Commit 6154b547 authored by christianrhansen's avatar christianrhansen

variables renaming

parent 9e51c09d
......@@ -143,12 +143,12 @@
q-icon(name="check")
//----- resize handler (top left)
// :style="{left: resizeHandler.topLeft.x - 20 + 'px', top: resizeHandler.topLeft.y - 20 + 'px'}")
// :style="{left: handlerNewCell.move.x - 20 + 'px', top: handlerNewCell.move.y - 20 + 'px'}")
.resize-handler-mobile.top-left.absolute.text-dark.justify-center.row.bg-white.shadow-6(
v-if="mobileTempCell.onGrid",
v-touch-pan="handleMoveCell", round, flat,
:style="{left: resizeHandler.topLeft.x - 20 + 'px', top: resizeHandler.topLeft.y - 20 + 'px'}",
:class="{'pushed': !resizeHandler.topLeft.pushed}")
:style="{left: handlerNewCell.move.x - 20 + 'px', top: handlerNewCell.move.y - 20 + 'px'}",
:class="{'pushed': !handlerNewCell.move.pushed}")
//:style="setHandlerStyle()")
// q-icon.self-center.rotate-180(name="signal_cellular_4_bar", size="12px", style="margin-top: 2px;")
q-icon.self-center.rotate-180(name="open_with", size="22px")
......@@ -157,7 +157,7 @@
.resize-handler-mobile.bottom-right.text-dark.fixed.justify-center.row.bg-white.shadow-6(
v-if="mobileTempCell.onGrid",
v-touch-pan="handleResizeCell", round, flat,
:style="{left: resizeHandler.bottomRight.x - 20 + 'px', top: resizeHandler.bottomRight.y - 20 + 'px'}")
:style="{left: handlerNewCell.resize.x - 20 + 'px', top: handlerNewCell.resize.y - 20 + 'px'}")
q-icon.self-center(name="signal_cellular_4_bar", size="12px", style="margin-left: -3px;")
// ---------------------------------------------------------------------------------------------------------------
......@@ -313,10 +313,10 @@
modal: false,
carousel: {visibility: false, icon: 'open_with', slide: 0},
// cursor: {x: undefined, y: undefined},
resizeHandler: {
handlerNewCell: {
size: {width: 40, height: 40},
topLeft: {x: 20, y: undefined, pushed: false, pos: undefined},
bottomRight: {x: undefined, y: undefined, pushed: false, pos: undefined}
move: {x: 20, y: undefined, pushed: false, pos: undefined},
resize: {x: undefined, y: undefined, pushed: false, pos: undefined}
}
}
},
......@@ -436,61 +436,61 @@
},
methods: {
setHandlerStyle () {
let _resizeHandler = this.resizeHandler
let _handlerNewCell = this.handlerNewCell
if (_resizeHandler.topLeft.pos.includes('absolute')) {
if (_handlerNewCell.move.pos.includes('absolute')) {
return {
'position': 'absolute',
'left': this.mobileTempCell.left + 'px',
'top': this.resizeHandler.topLeft.y - 20 + 'px'
'top': this.handlerNewCell.move.y - 20 + 'px'
}
}
else {
let side
if (_resizeHandler.topLeft.pos.includes('left')) side = '0px'
if (_handlerNewCell.move.pos.includes('left')) side = '0px'
else side = 'calc(100vw - 40px)'
return {
'position': 'fixed',
'left': side,
'top': this.resizeHandler.topLeft.y - 20 + 59 + 'px'
'top': this.handlerNewCell.move.y - 20 + 59 + 'px'
}
}
},
// observerCallback (entries, observer) {
observerCallback (entries) {
let entryX = entries[0].boundingClientRect.x
let _resizeHandler = this.resizeHandler
let _resizeHandlerHalf = _resizeHandler.size.width / 2
let _handlerNewCell = this.handlerNewCell
let _handlerNewCellHalf = _handlerNewCell.size.width / 2
console.log(this.mobileTempCell.ox)
// ----- left
if (entryX < _resizeHandlerHalf) {
_resizeHandler.topLeft.pos = 'fixed on-left-side'
if (entryX < _handlerNewCellHalf) {
_handlerNewCell.move.pos = 'fixed on-left-side'
}
// ----- middle
// if (entryX >= 20 && entryX <= window.innerWidth - 20) this.resizeHandler.topLeft.x = entryX
if (entryX >= _resizeHandlerHalf && entryX <= window.innerWidth - _resizeHandler.size.width) {
_resizeHandler.topLeft.x = this.mobileTempCell.left
_resizeHandler.topLeft.pos = 'absolute'
// if (entryX >= 20 && entryX <= window.innerWidth - 20) this.handlerNewCell.move.x = entryX
if (entryX >= _handlerNewCellHalf && entryX <= window.innerWidth - _handlerNewCell.size.width) {
_handlerNewCell.move.x = this.mobileTempCell.left
_handlerNewCell.move.pos = 'absolute'
}
// ----- right
if (entryX > window.innerWidth - _resizeHandler.size.width) {
_resizeHandler.topLeft.pos = 'fixed on-right-side'
if (entryX > window.innerWidth - _handlerNewCell.size.width) {
_handlerNewCell.move.pos = 'fixed on-right-side'
}
},
handleMoveCell (obj) {
this.resizeHandler.topLeft.x = obj.position.left
this.resizeHandler.topLeft.y = obj.position.top
this.handlerNewCell.move.x = obj.position.left
this.handlerNewCell.move.y = obj.position.top
let res = this.getGridPositionForEvent(obj)
if (obj.isFirst) {
this.mobileTempCell.show = true
this.mobileTempCell.button = false
this.resizeHandler.topLeft.pushed = true
this.handlerNewCell.move.pushed = true
}
this.mobileTempCell.x = res.x
......@@ -499,22 +499,22 @@
this.mobileTempCell.ox = res.ox
this.mobileTempCell.oy = res.oy
this.resizeHandler.topLeft.x = res.ox
this.resizeHandler.topLeft.y = res.oy
this.handlerNewCell.move.x = res.ox
this.handlerNewCell.move.y = res.oy
if (obj.isFinal) {
this.mobileTempCell.onGrid = true
this.mobileTempCell.button = true
this.mobileTempCell.left = this.gridDimensions.full.cell.width * (res.x - 1)
this.resizeHandler.topLeft.pushed = false
// this.resizeHandler.topLeft.y = this.gridDimensions.full.cell.height * (res.y - 1) + 8 + 59 + 20
this.resizeHandler.topLeft.x = this.gridDimensions.full.cell.width * (this.mobileTempCell.x - 1) + 8 + 20
this.resizeHandler.topLeft.y = this.gridDimensions.full.cell.height * (this.mobileTempCell.y - 1) + 8 + 20
this.handlerNewCell.move.pushed = false
// this.handlerNewCell.move.y = this.gridDimensions.full.cell.height * (res.y - 1) + 8 + 59 + 20
this.handlerNewCell.move.x = this.gridDimensions.full.cell.width * (this.mobileTempCell.x - 1) + 8 + 20
this.handlerNewCell.move.y = this.gridDimensions.full.cell.height * (this.mobileTempCell.y - 1) + 8 + 20
}
},
handleResizeCell (obj) {
// this.cursor = {x: obj.position.left, y: obj.position.top}
this.resizeHandler.bottomRight = {x: obj.position.left, y: obj.position.top}
this.handlerNewCell.resize = {x: obj.position.left, y: obj.position.top}
// ---> panGrid
let res = this.getGridPositionForEvent(obj)
......@@ -579,8 +579,8 @@
this.mobileTempCell.button = true
// this.addMobileCell(obj)
// this.mobileTempCell.show = false
this.resizeHandler.topLeft.x = this.gridDimensions.full.cell.width * (this.mobileTempCell.x - 1) + 8 + 20
this.resizeHandler.topLeft.y = this.gridDimensions.full.cell.height * (this.mobileTempCell.y - 1) + 8 + 20
this.handlerNewCell.move.x = this.gridDimensions.full.cell.width * (this.mobileTempCell.x - 1) + 8 + 20
this.handlerNewCell.move.y = this.gridDimensions.full.cell.height * (this.mobileTempCell.y - 1) + 8 + 20
}
}
},
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment