Skip to content
GitLab
Projects
Groups
Snippets
Help
Loading...
Help
What's new
7
Help
Support
Community forum
Keyboard shortcuts
?
Submit feedback
Sign in / Register
Toggle navigation
Open sidebar
Motion Bank
MB.js
Quasar Components MoSys
Commits
64e2a5ff
Commit
64e2a5ff
authored
Oct 08, 2019
by
christianrhansen
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
created via touch resizable temp mobile cell (not finished)
parent
49293545
Pipeline
#16591
passed with stage
in 1 minute and 23 seconds
Changes
1
Pipelines
1
Hide whitespace changes
Inline
Side-by-side
Showing
1 changed file
with
42 additions
and
3 deletions
+42
-3
partials/GridEditor.vue
partials/GridEditor.vue
+42
-3
No files found.
partials/GridEditor.vue
View file @
64e2a5ff
...
...
@@ -20,6 +20,7 @@
// ------------------------------------------------------------------------------------------------------------ grid
div.cell-grid(
v-touch-pan="panGrid",
@click="event => {addMobileCell(event)}",
@dragenter="handleGridDragOver",
@dragover="handleGridDragOver",
...
...
@@ -101,6 +102,11 @@
.cell-item.cell-item-tmp(:style="getAnnotationStyle(tmpCell)", :key="`cell-tmp-${index}`")
cell(:cell="tmpCell")
//----- temporary cell (mobile)
.cell-item.cell-item-tmp-mobile(:style="mobileTempCellStyle(mobileTempCell)")
| blabla
// cell(:cell="tmpCell")
// ---------------------------------------------------------------------------------------------------------------
template(v-else)
.cell-item(:style="getAnnotationStyle({x:0,y:0,width:1,height:1})", key="cell-grid-resizer")
...
...
@@ -243,7 +249,8 @@
resizingGrid
:
false
,
mobileSelectedCell
:
undefined
,
touch
:
{
position
:
{
top
:
undefined
,
left
:
undefined
}},
isMobile
:
this
.
$q
.
platform
.
is
.
mobile
isMobile
:
this
.
$q
.
platform
.
is
.
mobile
,
mobileTempCell
:
{
x
:
0
,
y
:
0
,
width
:
1
,
height
:
1
}
}
},
computed
:
{
...
...
@@ -321,6 +328,12 @@
}
},
methods
:
{
panGrid
(
obj
)
{
let
res
=
this
.
getGridPositionForEvent
(
obj
)
console
.
log
(
res
)
this
.
mobileTempCell
.
x
=
res
.
x
+
1
this
.
mobileTempCell
.
y
=
res
.
y
+
1
},
async
cellHold
(
event
,
annotation
)
{
this
.
$store
.
commit
(
'
mosys/setEditingCells
'
,
''
)
...
...
@@ -751,9 +764,23 @@
getGridPositionForEvent
(
event
,
offset
=
{
x
:
0
,
y
:
0
})
{
// console.log('###', event)
offset
=
{
x
:
0
,
y
:
0
}
// TODO: remove quick fix
let
_clientX
,
_clientY
if
(
event
.
clientX
&&
event
.
clientY
)
{
_clientX
=
event
.
clientX
_clientY
=
event
.
clientY
}
if
(
event
.
position
.
left
&&
event
.
position
.
top
)
{
_clientX
=
event
.
position
.
left
_clientY
=
event
.
position
.
top
}
const
elContainerBoundingBox
=
this
.
$el
.
getBoundingClientRect
()
const
ox
=
event
.
clientX
+
this
.
$el
.
scrollLeft
-
elContainerBoundingBox
.
x
-
offset
.
x
const
oy
=
event
.
clientY
+
this
.
$el
.
scrollTop
-
elContainerBoundingBox
.
y
-
offset
.
y
const
ox
=
_clientX
+
this
.
$el
.
scrollLeft
-
elContainerBoundingBox
.
x
-
offset
.
x
const
oy
=
_clientY
+
this
.
$el
.
scrollTop
-
elContainerBoundingBox
.
y
-
offset
.
y
// const ox = event.clientX + this.$el.scrollLeft - elContainerBoundingBox.x - offset.x
// const oy = event.clientY + this.$el.scrollTop - elContainerBoundingBox.y - offset.y
const
x
=
Math
.
ceil
(
ox
/
this
.
gridDimensions
.
full
.
cell
.
width
)
const
y
=
Math
.
ceil
(
oy
/
this
.
gridDimensions
.
full
.
cell
.
height
)
return
{
x
:
x
,
y
:
y
,
ox
:
ox
,
oy
:
oy
}
...
...
@@ -792,6 +819,15 @@
}
}
},
mobileTempCellStyle
(
obj
)
{
console
.
log
(
obj
)
return
{
'
grid-column-start
'
:
obj
.
x
,
'
grid-column-end
'
:
obj
.
width
,
'
grid-row-start
'
:
obj
.
y
,
'
grid-row-end
'
:
obj
.
height
}
},
getAnnotationStyle
(
annotation
)
{
const
parsed
=
annotation
.
target
.
selector
.
parse
()
return
{
...
...
@@ -901,4 +937,7 @@
top -60px
&.show
top 0px
.cell-item-tmp-mobile
background-color rgba(0, 0, 255, .25)
</
style
>
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
.
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment