Drag-and-drop and tooltip behavior only on label div

brandonbowersox · Apr 20, 2015 · 08d4381 · 08d4381
1 parent 66d8092
commit 08d4381
Show file tree

Hide file tree

Showing 2 changed files with 14 additions and 10 deletions.
diff --git a/oaa-utils.css b/oaa-utils.css
@@ -6,17 +6,19 @@ div.oaa-element-overlay {
   border      : 3px solid;
   font-family : arial, helvetica, 'Liberation Sans', sans-serif;
   font-size   : 16px;
-}
-
-div.oaa-element-overlay:hover {
-  cursor      : grab;
-  cursor      : -moz-grab;
-  cursor      : -webkit-grab;
+  pointer-events: none;
 }
 
 div.oaa-element-overlay > div {
   float       : right;
   padding     : 1px 1px 4px 4px;
+  pointer-events: auto;
+}
+
+div.oaa-element-overlay > div:hover {
+  cursor      : grab;
+  cursor      : -moz-grab;
+  cursor      : -webkit-grab;
 }
 
 div.oaa-message-dialog {

diff --git a/oaa-utils.js b/oaa-utils.js
@@ -109,6 +109,7 @@ var OAAUtils = (function () {
     var innerStyle = "background-color: " + tgt.color;
     var minWidth  = 34;
     var minHeight = 27;
+    var labelDiv;
 
     function repositionOverlay (element) {
       if (typeof element.startLeft === "undefined") return;
@@ -134,13 +135,14 @@ var OAAUtils = (function () {
     node.style.zIndex = zIndex;
 
     node.innerHTML = '<div style="' + innerStyle + '">' + tgt.label + '</div>';
+    labelDiv = node.firstChild;
 
-    node.onmousedown = function (event) {
-      drag(this, hoistZIndex, event);
+    labelDiv.onmousedown = function (event) {
+      drag(this.parentNode, hoistZIndex, event);
     };
 
-    node.ondblclick = function (event) {
-      repositionOverlay(this);
+    labelDiv.ondblclick = function (event) {
+      repositionOverlay(this.parentNode);
     };
 
     return node;