Change annotation edit grabbing to ctrl-click

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>

modules/glmv.js

@@ -1,5 +1,5 @@
 let slideShowInterval = null
-let grabHotspotStart = null
+let grabHotspot = null
 
 /**
  * Sets listener and attributes on model-viewer to
@@ -185,10 +185,16 @@ toggleAnnotations = function(mView) {
  * @param {MouseEvent} event
  */
 grabAnnotation = function(e) {
-    if (!grabHotspotStart) {
-        grabHotspotStart = {x: e.x, y: e.y}
+    if (e.ctrlKey) {
+        grabHotspot = {x: e.x, y: e.y}
         const contEl = $('.glmv-container')[0]
         contEl.addEventListener('mousemove', moveAnnotation)
+        const mvEl = $('model-viewer')[0]
+        console.log(contEl)
+        console.log(e)
+        console.log(mvEl.queryHotspot(e.target.slot))
+    } else {
+        grabHotspot = null
     }
 }
 
@@ -198,9 +204,9 @@ grabAnnotation = function(e) {
  * @param {MouseEvent} event
  */
 moveAnnotation = function(e) {
-    if (grabHotspotStart) {
-        grabHotspotStart.move = true
-        e.target.style['transform'] = `translate(${e.x - grabHotspotStart.x}px, ${e.y - grabHotspotStart.y}px) scale(1.1,1.1)`
+    if (grabHotspot) {
+        grabHotspot.move = true
+        e.target.style['transform'] = `translate(${e.x - grabHotspot.x}px, ${e.y - grabHotspot.y}px) scale(1.1,1.1)`
     }
 }
 
@@ -210,7 +216,8 @@ moveAnnotation = function(e) {
  * @param {MouseEvent} event
  */
 releaseAnnotation = function(e) {
-    if (grabHotspotStart.move) {
+    if (grabHotspot.move) {
+        console.log(e.target)
         e.target.style['transform']=''
         const contEl = $('.glmv-container')[0]
         contEl.removeEventListener('mousemove', moveAnnotation)
@@ -240,7 +247,7 @@ releaseAnnotation = function(e) {
         const newText = currentText.replace(/(.*?<pre>)[\S\s]*?(<\/pre>.*)/,`$1\n${JSON.stringify(metadata, null, 2)}\n$2`)
         $('#wpTextbox1').val(newText)
     }
-    grabHotspotStart = null
+    grabHotspot = null
 }
 
 /**