fix-bug: drag & drop not working on Firefox

dabeng · dabeng · commit 482b3f365be0 · 2018-08-14T10:29:16.000+08:00
diff --git a/bower.json b/bower.json
@@ -1,6 +1,6 @@
 {
   "name": "orgchart",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "homepage": "https://github.com/dabeng/OrgChart",
   "authors": [
     "dabeng <dabeng413@gmail.com>"
diff --git a/demo/js/jquery.orgchart.js b/demo/js/jquery.orgchart.js
@@ -892,9 +892,6 @@
       var opts = this.options;
       var origEvent = event.originalEvent;
       var isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());
-      if (isFirefox) {
-        origEvent.dataTransfer.setData('text/html', 'hack for firefox');
-      }
       var ghostNode, nodeCover;
       if (!document.querySelector('.ghost-node')) {
         ghostNode = document.createElementNS("http://www.w3.org/2000/svg", "svg");
@@ -907,9 +904,10 @@
         nodeCover = $(ghostNode).children().get(0);
       }
       var transValues = $nodeDiv.closest('.orgchart').css('transform').split(',');
-      var scale = Math.abs(window.parseFloat((opts.direction === 't2b' || opts.direction === 'b2t') ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));
-      ghostNode.setAttribute('width', $nodeDiv.outerWidth(false));
-      ghostNode.setAttribute('height', $nodeDiv.outerHeight(false));
+      var isHorizontal = opts.direction === 't2b' || opts.direction === 'b2t';
+      var scale = Math.abs(window.parseFloat(isHorizontal ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));
+      ghostNode.setAttribute('width', isHorizontal ? $nodeDiv.outerWidth(false) : $nodeDiv.outerHeight(false));
+      ghostNode.setAttribute('height', isHorizontal ? $nodeDiv.outerHeight(false) : $nodeDiv.outerWidth(false));
       nodeCover.setAttribute('x',5 * scale);
       nodeCover.setAttribute('y',5 * scale);
       nodeCover.setAttribute('width', 120 * scale);
@@ -959,6 +957,7 @@
     },
     //
     dragstartHandler: function (event) {
+      event.originalEvent.dataTransfer.setData('text/html', 'hack for firefox');
       // if users enable zoom or direction options
       if (this.$chart.css('transform') !== 'none') {
         this.createGhostNode(event);
diff --git a/dist/js/jquery.orgchart.js b/dist/js/jquery.orgchart.js
@@ -892,9 +892,6 @@
       var opts = this.options;
       var origEvent = event.originalEvent;
       var isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());
-      if (isFirefox) {
-        origEvent.dataTransfer.setData('text/html', 'hack for firefox');
-      }
       var ghostNode, nodeCover;
       if (!document.querySelector('.ghost-node')) {
         ghostNode = document.createElementNS("http://www.w3.org/2000/svg", "svg");
@@ -907,9 +904,10 @@
         nodeCover = $(ghostNode).children().get(0);
       }
       var transValues = $nodeDiv.closest('.orgchart').css('transform').split(',');
-      var scale = Math.abs(window.parseFloat((opts.direction === 't2b' || opts.direction === 'b2t') ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));
-      ghostNode.setAttribute('width', $nodeDiv.outerWidth(false));
-      ghostNode.setAttribute('height', $nodeDiv.outerHeight(false));
+      var isHorizontal = opts.direction === 't2b' || opts.direction === 'b2t';
+      var scale = Math.abs(window.parseFloat(isHorizontal ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));
+      ghostNode.setAttribute('width', isHorizontal ? $nodeDiv.outerWidth(false) : $nodeDiv.outerHeight(false));
+      ghostNode.setAttribute('height', isHorizontal ? $nodeDiv.outerHeight(false) : $nodeDiv.outerWidth(false));
       nodeCover.setAttribute('x',5 * scale);
       nodeCover.setAttribute('y',5 * scale);
       nodeCover.setAttribute('width', 120 * scale);
@@ -959,6 +957,7 @@
     },
     //
     dragstartHandler: function (event) {
+      event.originalEvent.dataTransfer.setData('text/html', 'hack for firefox');
       // if users enable zoom or direction options
       if (this.$chart.css('transform') !== 'none') {
         this.createGhostNode(event);
diff --git a/dist/js/jquery.orgchart.min.js b/dist/js/jquery.orgchart.min.js
diff --git a/dist/js/jquery.orgchart.min.js.map b/dist/js/jquery.orgchart.min.js.map
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "orgchart",
-  "version": "2.1.2",
+  "version": "2.1.3",
   "description": "Simple and direct organization chart(tree-like hierarchy) plugin based on pure DOM and jQuery.",
   "main": "./dist/js/jquery.orgchart.min.js",
   "style": [
diff --git a/src/js/jquery.orgchart.js b/src/js/jquery.orgchart.js
@@ -892,9 +892,6 @@
       var opts = this.options;
       var origEvent = event.originalEvent;
       var isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());
-      if (isFirefox) {
-        origEvent.dataTransfer.setData('text/html', 'hack for firefox');
-      }
       var ghostNode, nodeCover;
       if (!document.querySelector('.ghost-node')) {
         ghostNode = document.createElementNS("http://www.w3.org/2000/svg", "svg");
@@ -907,9 +904,10 @@
         nodeCover = $(ghostNode).children().get(0);
       }
       var transValues = $nodeDiv.closest('.orgchart').css('transform').split(',');
-      var scale = Math.abs(window.parseFloat((opts.direction === 't2b' || opts.direction === 'b2t') ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));
-      ghostNode.setAttribute('width', $nodeDiv.outerWidth(false));
-      ghostNode.setAttribute('height', $nodeDiv.outerHeight(false));
+      var isHorizontal = opts.direction === 't2b' || opts.direction === 'b2t';
+      var scale = Math.abs(window.parseFloat(isHorizontal ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));
+      ghostNode.setAttribute('width', isHorizontal ? $nodeDiv.outerWidth(false) : $nodeDiv.outerHeight(false));
+      ghostNode.setAttribute('height', isHorizontal ? $nodeDiv.outerHeight(false) : $nodeDiv.outerWidth(false));
       nodeCover.setAttribute('x',5 * scale);
       nodeCover.setAttribute('y',5 * scale);
       nodeCover.setAttribute('width', 120 * scale);
@@ -959,6 +957,7 @@
     },
     //
     dragstartHandler: function (event) {
+      event.originalEvent.dataTransfer.setData('text/html', 'hack for firefox');
       // if users enable zoom or direction options
       if (this.$chart.css('transform') !== 'none') {
         this.createGhostNode(event);

Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "orgchart",`
`3`		`- "version": "2.1.2",`
	`3`	`+ "version": "2.1.3",`
`4`	`4`	`"homepage": "https://github.com/dabeng/OrgChart",`
`5`	`5`	`"authors": [`
`6`	`6`	`"dabeng <[email protected]>"`