mobile: improved temp cell handler query

partials/GridEditor.vue

@@ -183,7 +183,7 @@
           //----- (when main resize handler is outside of viewport)
           .handler-new-cell.temp.fixed.text-dark.justify-center.row.bg-white.shadow-6(
           v-touch-pan="handleResizeCell",
-          :class="[!tempHandler.resize.visibility ? 'temp-hide': 'temp-show']",
+          :class="[tempHandler.resize.visibility ? 'temp-show': 'temp-hide']",
           :style="{left: tempHandler.resize.left + 'px', top: handlerNewCell.resize.y + 59 - 20 + 'px'}",)
             q-icon.self-center(name="signal_cellular_4_bar", size="12px", style="margin-left: -3px;")
 
@@ -349,8 +349,8 @@
         },
         handlerNewCellTemp: {visibility: true, left: 0},
         tempHandler: {
-          move: {left: undefined, visibility: false},
-          resize: {left: undefined, visibility: false}
+          move: {left: undefined, visibility: false, intersectingMainHandler: undefined},
+          resize: {left: undefined, visibility: false, intersectingMainHandler: undefined}
         }
       }
     },
@@ -486,18 +486,57 @@
     },
     methods: {
       intersectionChanged (obj) {
-        // console.log(obj)
-        // console.log(this.tempHandler.move.left)
-
+        //
+        // -------------------- move
         if (obj.element === 'move') {
-          Math.sign(obj.offsetLeft) === 1 ? this.tempHandler.move.left = window.innerWidth - 40 : this.tempHandler.move.left = 0
+          this.tempHandler.move.intersectingMainHandler = obj.intersecting
           this.tempHandler.move.visibility = obj.intersecting
+
+          if (Math.sign(obj.offsetLeft) < 0) {
+            this.tempHandler.move.left = 0
+          }
+          else if (Math.sign(obj.offsetLeft) === 0) {
+          }
+          else if (Math.sign(obj.offsetLeft) === 1) {
+            this.tempHandler.move.left = window.innerWidth - 40
+          }
+
+          // ----- visibility resize
+          /*
+          if (this.tempHandler.move.left > 0) {
+            this.tempHandler.resize.visibility = false
+          }
+          else if (this.tempHandler.move.left === 0) {
+            this.tempHandler.resize.visibility = false
+          }
+
+          if (Math.sign(this.tempHandler.resize.left) > 0) {
+            this.tempHandler.resize.visibility = true
+          }
+          */
         }
 
+        // -------------------- resize
         if (obj.element === 'resize') {
-          // Math.sign(obj.offsetLeft) === 1 ? this.tempHandler.resize.left = window.innerWidth - 40 : this.tempHandler.resize.left = 0
-          Math.sign(obj.offsetLeft) === 1 ? this.tempHandler.resize.left = window.innerWidth - 40 : this.tempHandler.resize.left = 0
-          Math.sign(obj.offsetLeft) <= 0 ? this.tempHandler.resize.visibility = true : this.tempHandler.resize.visibility = false
+          this.tempHandler.resize.intersectingMainHandler = obj.intersecting
+
+          if (Math.sign(obj.offsetLeft) === 1) {
+            this.tempHandler.resize.left = window.innerWidth - 40
+          }
+          else if (Math.sign(obj.offsetLeft) === -1) {
+            this.tempHandler.resize.left = 0
+          }
+
+          if (Math.sign(obj.offsetLeft) === 1) {
+            this.tempHandler.resize.visibility = true
+          }
+          else if (Math.sign(obj.offsetLeft) === -1) {
+            this.tempHandler.resize.visibility = true
+          }
+          else if (obj.offsetLeft === undefined) {
+            this.tempHandler.resize.visibility = false
+          }
+          // this.tempHandler.resize.visibility = obj.intersecting
         }
       },
       /*