renaming variable (handlerNewCell -> cellHandler)

partials/GridEditor.vue

@@ -154,12 +154,12 @@
           //----------------------------------------------------------------------------------------------- move handler
           //----- (main)
           cell-handler-mobile.main-handler.shadow-1(
-          v-if="!handlerNewCell.resize.pushed",
+          v-if="!cellHandler.resize.pushed",
           @onIntersectionChange="intersectionChanged",
           :element="'move'",
           v-touch-pan="handleMoveCell",
-          :style="{left: handlerNewCell.move.x - 20 + 'px', top: handlerNewCell.move.y - 20 + 'px'}",
-          :class="[{'pushed': !handlerNewCell.move.pushed}, {'hide': !mobileTempCell.onGrid}]")
+          :style="{left: cellHandler.move.x - 20 + 'px', top: cellHandler.move.y - 20 + 'px'}",
+          :class="[{'pushed': !cellHandler.move.pushed}, {'hide': !mobileTempCell.onGrid}]")
             q-icon.rotate-180(name="open_with", size="22px")
 
           //----- (temp)
@@ -167,27 +167,27 @@
           cell-handler-mobile.temp-handler.shadow-1(
           v-touch-pan="handleMoveCell",
           :doubleTap="{el: $el, type: 'scroll', oLeft: mobileTempCell.left}",
-          :class="[(!mobileTempCell.onGrid || tempHandler.move.intersectingMainHandler || handlerNewCell.resize.pushed || handlerNewCell.move.pushed ? 'hide': 'show'), (tempHandler.move.side === 'left' ? 'left-side' : 'right-side')]",
-          :style="{top: handlerNewCell.move.y + 59 - 20 + 'px'}",)
+          :class="[(!mobileTempCell.onGrid || tempHandler.move.intersectingMainHandler || cellHandler.resize.pushed || cellHandler.move.pushed ? 'hide': 'show'), (tempHandler.move.side === 'left' ? 'left-side' : 'right-side')]",
+          :style="{top: cellHandler.move.y + 59 - 20 + 'px'}",)
             q-icon.rotate-180(name="open_with", size="22px")
 
           //--------------------------------------------------------------------------------------------- resize handler
           //----- (main)
           cell-handler-mobile.main-handler.shadow-1(
-          v-if="!handlerNewCell.move.pushed",
+          v-if="!cellHandler.move.pushed",
           @onIntersectionChange="intersectionChanged",
           :element="'resize'",
           v-touch-pan="handleResizeCell",
-          :style="{left: handlerNewCell.resize.x - 20 + 'px', top: handlerNewCell.resize.y - 20 + 'px'}",
-          :class="[{'pushed': !handlerNewCell.resize.pushed}, {'hide': !mobileTempCell.onGrid}]")
+          :style="{left: cellHandler.resize.x - 20 + 'px', top: cellHandler.resize.y - 20 + 'px'}",
+          :class="[{'pushed': !cellHandler.resize.pushed}, {'hide': !mobileTempCell.onGrid}]")
             q-icon(name="signal_cellular_4_bar", size="12px", style="margin-left: -3px;")
 
           //----- (temp)
           //----- (when main resize handler is outside of viewport)
           cell-handler-mobile.temp-handler.shadow-1(
           v-touch-pan="handleResizeCell",
-          :class="[(!mobileTempCell.onGrid || tempHandler.resize.intersectingMainHandler || handlerNewCell.move.pushed || handlerNewCell.resize.pushed ? 'hide': 'show'), (tempHandler.resize.side === 'left' ? 'left-side' : 'right-side')]",
-          :style="{top: handlerNewCell.resize.y + 59 - 20 + 'px'}",)
+          :class="[(!mobileTempCell.onGrid || tempHandler.resize.intersectingMainHandler || cellHandler.move.pushed || cellHandler.resize.pushed ? 'hide': 'show'), (tempHandler.resize.side === 'left' ? 'left-side' : 'right-side')]",
+          :style="{top: cellHandler.resize.y + 59 - 20 + 'px'}",)
             q-icon(name="signal_cellular_4_bar", size="12px", style="margin-left: -3px;")
 
       // ---------------------------------------------------------------------------------------------------------------
@@ -345,7 +345,7 @@
         modal: false,
         carousel: {visibility: false, icon: 'open_with', slide: 0},
         // cursor: {x: undefined, y: undefined},
-        handlerNewCell: {
+        cellHandler: {
           size: {width: 40, height: 40},
           move: {x: 20, y: undefined, pushed: false, pos: undefined, inViewport: undefined, onLeft: undefined, onRight: undefined, dataLeft: undefined},
           resize: {x: undefined, y: undefined, pushed: false, pos: undefined}
@@ -503,15 +503,15 @@
         }
       },
       handleMoveCell (obj) {
-        this.handlerNewCell.move.x = obj.position.left
-        this.handlerNewCell.move.y = obj.position.top
+        this.cellHandler.move.x = obj.position.left
+        this.cellHandler.move.y = obj.position.top
 
         let res = this.getGridPositionForEvent(obj)
 
         if (obj.isFirst) {
           this.mobileTempCell.show = true
           this.mobileTempCell.button = false
-          this.handlerNewCell.move.pushed = true
+          this.cellHandler.move.pushed = true
         }
 
         this.mobileTempCell.x = res.x
@@ -520,27 +520,27 @@
         this.mobileTempCell.ox = res.ox
         this.mobileTempCell.oy = res.oy
 
-        this.handlerNewCell.move.x = res.ox
-        this.handlerNewCell.move.y = res.oy
+        this.cellHandler.move.x = res.ox
+        this.cellHandler.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.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
+          this.cellHandler.move.pushed = false
+          // this.cellHandler.move.y = this.gridDimensions.full.cell.height * (res.y - 1) + 8 + 59 + 20
+          this.cellHandler.move.x = this.gridDimensions.full.cell.width * (this.mobileTempCell.x - 1) + 8 + 20
+          this.cellHandler.move.y = this.gridDimensions.full.cell.height * (this.mobileTempCell.y - 1) + 8 + 20
 
-          this.handlerNewCell.resize.x = this.gridDimensions.full.cell.width * (res.x + this.mobileTempCell.width - 1) - 8 - 20
-          this.handlerNewCell.resize.y = this.gridDimensions.full.cell.height * (res.y + this.mobileTempCell.height - 1) - 8 - 20
+          this.cellHandler.resize.x = this.gridDimensions.full.cell.width * (res.x + this.mobileTempCell.width - 1) - 8 - 20
+          this.cellHandler.resize.y = this.gridDimensions.full.cell.height * (res.y + this.mobileTempCell.height - 1) - 8 - 20
         }
       },
       handleResizeCell (obj) {
         // this.cursor = {x: obj.position.left, y: obj.position.top}
-        // this.handlerNewCell.resize = {x: obj.position.left, y: obj.position.top}
-        this.handlerNewCell.resize.x = obj.position.left
-        this.handlerNewCell.resize.y = obj.position.top
+        // this.cellHandler.resize = {x: obj.position.left, y: obj.position.top}
+        this.cellHandler.resize.x = obj.position.left
+        this.cellHandler.resize.y = obj.position.top
 
         // ---> panGrid
         let res = this.getGridPositionForEvent(obj)
@@ -548,23 +548,23 @@
         if (obj.isFirst) {
           this.mobileTempCell.show = true
           this.mobileTempCell.button = false
-          this.handlerNewCell.resize.pushed = true
+          this.cellHandler.resize.pushed = true
         }
 
         this.mobileTempCell.width = res.x - this.mobileTempCell.x + 1
         this.mobileTempCell.height = res.y - this.mobileTempCell.y + 1
 
-        this.handlerNewCell.resize.x = res.ox
-        this.handlerNewCell.resize.y = res.oy
+        this.cellHandler.resize.x = res.ox
+        this.cellHandler.resize.y = res.oy
 
         if (obj.isFinal) {
           this.mobileTempCell.onGrid = true
           this.mobileTempCell.button = true
-          this.handlerNewCell.resize.pushed = false
+          this.cellHandler.resize.pushed = false
           // this.addMobileCell(obj)
           // this.mobileTempCell.show = false
-          this.handlerNewCell.resize.x = this.gridDimensions.full.cell.width * res.x - 8 - 20
-          this.handlerNewCell.resize.y = this.gridDimensions.full.cell.height * res.y - 8 - 20
+          this.cellHandler.resize.x = this.gridDimensions.full.cell.width * res.x - 8 - 20
+          this.cellHandler.resize.y = this.gridDimensions.full.cell.height * res.y - 8 - 20
         }
       },
       clearCachedCell () {
@@ -611,11 +611,11 @@
             this.mobileTempCell.button = true
             // this.addMobileCell(obj)
             // this.mobileTempCell.show = false
-            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
+            this.cellHandler.move.x = this.gridDimensions.full.cell.width * (this.mobileTempCell.x - 1) + 8 + 20
+            this.cellHandler.move.y = this.gridDimensions.full.cell.height * (this.mobileTempCell.y - 1) + 8 + 20
 
-            this.handlerNewCell.resize.x = this.gridDimensions.full.cell.width * res.x - 8 - 20
-            this.handlerNewCell.resize.y = this.gridDimensions.full.cell.height * res.y - 8 - 20
+            this.cellHandler.resize.x = this.gridDimensions.full.cell.width * res.x - 8 - 20
+            this.cellHandler.resize.y = this.gridDimensions.full.cell.height * res.y - 8 - 20
           }
         }
       },