vue-multi-drag - npm Package Compare versions

Comparing version 0.3.1 to 0.3.2

CHANGELOG.md

@@ -0,1 +1,4 @@
+**0.3.2**
+vue emits implemented
+
 **0.3.1**
@@ -2,0 +5,0 @@ (dev) copying main.js from demo, otherwise dev server won't start

dist/vue-multi-drag.common.js

 /*!
- * vue-multi-drag v0.3.1 
+ * vue-multi-drag v0.3.2 
  * (c) 2019 mszkb
@@ -115,3 +115,3 @@ * Released under the ISC License.
     key: "initItem",
-    value: function initItem(draggableItem) {
+    value: function initItem(draggableItem, vnode) {
       draggableItem.setAttribute('grabindex', this.allItems.length); // this attribute keeps track of the position
@@ -121,3 +121,3 @@ // so it is not affected by the order of selection
       this.allItems.push(draggableItem);
-      this.attachEventListeners(draggableItem);
+      this.attachEventListeners(draggableItem, vnode);
     }
@@ -133,3 +133,3 @@ /**
     key: "attachEventListeners",
-    value: function attachEventListeners(draggableItem) {
+    value: function attachEventListeners(draggableItem, vnode) {
       var _this2 = this;
@@ -143,2 +143,4 @@
 
+        vnode.context.$emit('mousedown');
+
         _this2.options.callbackAfterMousdown(e, _this2);
@@ -151,2 +153,4 @@ });
 
+        vnode.context.$emit('mouseup');
+
         _this2.options.callbackAfterMouseup(e, _this2);
@@ -159,2 +163,4 @@ });
 
+        vnode.context.$emit('dragstart');
+
         _this2.options.callbackAfterDragStart(e, _this2);
@@ -170,2 +176,4 @@ });
 
+        vnode.context.$emit('dragover');
+
         _this2.options.callbackAfterDragOver(e, _this2);
@@ -178,2 +186,4 @@ });
 
+        vnode.context.$emit('dragend');
+
         _this2.options.callbackAfterDragend(e, _this2);
@@ -696,3 +706,3 @@ });
   Vue.directive('mz-drag', {
-    bind: function bind(el) {
+    bind: function bind(el, binding, vnode) {
       // something logic ...
@@ -707,3 +717,3 @@ el.setAttribute('draggable', 'true'); // enable html5 drag API
 
-      vmdb.initItem(el);
+      vmdb.initItem(el, vnode);
     },
@@ -710,0 +720,0 @@ unbind: function unbind(el) {

dist/vue-multi-drag.esm.js

 /*!
- * vue-multi-drag v0.3.1 
+ * vue-multi-drag v0.3.2 
  * (c) 2019 mszkb
@@ -111,3 +111,3 @@ * Released under the ISC License.
     key: "initItem",
-    value: function initItem(draggableItem) {
+    value: function initItem(draggableItem, vnode) {
       draggableItem.setAttribute('grabindex', this.allItems.length); // this attribute keeps track of the position
@@ -117,3 +117,3 @@ // so it is not affected by the order of selection
       this.allItems.push(draggableItem);
-      this.attachEventListeners(draggableItem);
+      this.attachEventListeners(draggableItem, vnode);
     }
@@ -129,3 +129,3 @@ /**
     key: "attachEventListeners",
-    value: function attachEventListeners(draggableItem) {
+    value: function attachEventListeners(draggableItem, vnode) {
       var _this2 = this;
@@ -139,2 +139,4 @@
 
+        vnode.context.$emit('mousedown');
+
         _this2.options.callbackAfterMousdown(e, _this2);
@@ -147,2 +149,4 @@ });
 
+        vnode.context.$emit('mouseup');
+
         _this2.options.callbackAfterMouseup(e, _this2);
@@ -155,2 +159,4 @@ });
 
+        vnode.context.$emit('dragstart');
+
         _this2.options.callbackAfterDragStart(e, _this2);
@@ -166,2 +172,4 @@ });
 
+        vnode.context.$emit('dragover');
+
         _this2.options.callbackAfterDragOver(e, _this2);
@@ -174,2 +182,4 @@ });
 
+        vnode.context.$emit('dragend');
+
         _this2.options.callbackAfterDragend(e, _this2);
@@ -692,3 +702,3 @@ });
   Vue.directive('mz-drag', {
-    bind: function bind(el) {
+    bind: function bind(el, binding, vnode) {
       // something logic ...
@@ -703,3 +713,3 @@ el.setAttribute('draggable', 'true'); // enable html5 drag API
 
-      vmdb.initItem(el);
+      vmdb.initItem(el, vnode);
     },
@@ -706,0 +716,0 @@ unbind: function unbind(el) {

dist/vue-multi-drag.umd.js

 /*!
- * vue-multi-drag v0.3.1 
+ * vue-multi-drag v0.3.2 
  * (c) 2019 mszkb
@@ -117,3 +117,3 @@ * Released under the ISC License.
       key: "initItem",
-      value: function initItem(draggableItem) {
+      value: function initItem(draggableItem, vnode) {
         draggableItem.setAttribute('grabindex', this.allItems.length); // this attribute keeps track of the position
@@ -123,3 +123,3 @@ // so it is not affected by the order of selection
         this.allItems.push(draggableItem);
-        this.attachEventListeners(draggableItem);
+        this.attachEventListeners(draggableItem, vnode);
       }
@@ -135,3 +135,3 @@ /**
       key: "attachEventListeners",
-      value: function attachEventListeners(draggableItem) {
+      value: function attachEventListeners(draggableItem, vnode) {
         var _this2 = this;
@@ -145,2 +145,4 @@
 
+          vnode.context.$emit('mousedown');
+
           _this2.options.callbackAfterMousdown(e, _this2);
@@ -153,2 +155,4 @@ });
 
+          vnode.context.$emit('mouseup');
+
           _this2.options.callbackAfterMouseup(e, _this2);
@@ -161,2 +165,4 @@ });
 
+          vnode.context.$emit('dragstart');
+
           _this2.options.callbackAfterDragStart(e, _this2);
@@ -172,2 +178,4 @@ });
 
+          vnode.context.$emit('dragover');
+
           _this2.options.callbackAfterDragOver(e, _this2);
@@ -180,2 +188,4 @@ });
 
+          vnode.context.$emit('dragend');
+
           _this2.options.callbackAfterDragend(e, _this2);
@@ -698,3 +708,3 @@ });
     Vue.directive('mz-drag', {
-      bind: function bind(el) {
+      bind: function bind(el, binding, vnode) {
         // something logic ...
@@ -709,3 +719,3 @@ el.setAttribute('draggable', 'true'); // enable html5 drag API
 
-        vmdb.initItem(el);
+        vmdb.initItem(el, vnode);
       },
@@ -712,0 +722,0 @@ unbind: function unbind(el) {

dist/vue-multi-drag.umd.min.js

 /*!
- * vue-multi-drag v0.3.1 
+ * vue-multi-drag v0.3.2 
  * (c) 2019 mszkb
  * Released under the ISC License.
  */
-!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):(e=e||self,t(e.VueMultiDrag={}))}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){for(var i=0;i<t.length;i++){var r=t[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function r(e,t,r){return t&&i(e.prototype,t),r&&i(e,r),e}function s(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function n(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{},r=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),r.forEach(function(t){s(e,t,i[t])})}return e}function a(e){}var o=function(){function e(i){t(this,e),this.options=i,this.allItems=[],this.selections={items:[],owner:null,droptarget:null},this.dropZones=null,this.draggableItems=null,this.related={},this._attachGlobalListeners()}return r(e,[{key:"_attachGlobalListeners",value:function(){var e=this;document.addEventListener("dragenter",function(t){e.options.callbackBeforeDragenter(t,e),e.related=t.target,e.options.callbackAfterDragenter(t,e)}),document.addEventListener("dragleave",function(t){e.options.callbackBeforeDragleave(t,e),e._dragLeave(t),e.options.callbackAfterDragleave(t,e)})}},{key:"initItem",value:function(e){e.setAttribute("grabindex",this.allItems.length),this.allItems.push(e),this.attachEventListeners(e)}},{key:"attachEventListeners",value:function(e){var t=this;e.addEventListener("mousedown",function(e){t.options.callbackBeforeMousdown(e,t),t._mouseDown(e),t.options.callbackAfterMousdown(e,t)}),e.addEventListener("mouseup",function(e){t.options.callbackBeforeMouseup(e,t),t._mouseUp(e),t.options.callbackAfterMouseup(e,t)}),e.addEventListener("dragstart",function(e){t.options.callbackBeforeDragStart(e,t),t._dragStart(e),t.options.callbackAfterDragStart(e,t)}),e.addEventListener("dragover",function(e){t.options.callbackBeforeDragOver(e,t),t.selections.items.length&&e.preventDefault(),t.options.callbackAfterDragOver(e,t)}),e.addEventListener("dragend",function(e){t.options.callbackBeforeDragend(e,t),t._dragEnd(e),t.options.callbackAfterDragend(e,t)})}},{key:"_addSelection",value:function(e){if(this.selections.owner){if(this.selections.owner!==e.parentNode)return}else this.selections.owner=e.parentNode;e.setAttribute("aria-grabbed","true"),this.selections.items.push(e),this.selections.items.sort(function(e,t){return e.getAttribute("grabindex")>t.getAttribute("grabindex")?1:t.getAttribute("grabindex")>e.getAttribute("grabindex")?-1:0})}},{key:"_removeSelection",value:function(e){e.setAttribute("aria-grabbed","false");for(var t=this.selections.items.length,i=0;i<t;i++)if(this.selections.items[i]===e){this.selections.items.splice(i,1);break}0===this.selections.items.length&&(this.selections.owner=null)}},{key:"_clearSelections",value:function(){if(this.selections.items.length){for(var e=this.selections.items.length,t=0;t<e;t++)this.selections.items[t].setAttribute("aria-grabbed","false");this.selections.owner=null,this.selections.items=[]}}},{key:"_hasModifier",value:function(e){return e.ctrlKey||e.metaKey||e.shiftKey}},{key:"_initDropZones",value:function(){null===this.dropZones&&(this.dropZones=document.querySelectorAll("[related]"))}},{key:"_initDraggableItems",value:function(){null===this.draggableItems&&(this.draggableItems=document.querySelectorAll("[draggable]"))}},{key:"_addDropeffects",value:function(){this._initDropZones(),this._initDraggableItems();for(var e=this.dropZones.length,t=0;t<e;t++)this.dropZones[t]!==this.selections.owner&&"none"===this.dropZones[t].getAttribute("aria-dropeffect")&&(this.dropZones[t].setAttribute("aria-dropeffect","move"),this.dropZones[t].setAttribute("tabindex","0"));for(var i=this.draggableItems.length,r=0;r<i;r++)this.draggableItems[r].parentNode!==this.selections.owner&&this.draggableItems[r].getAttribute("aria-grabbed")&&(this.draggableItems[r].removeAttribute("aria-grabbed"),this.draggableItems[r].removeAttribute("tabindex"))}},{key:"_clearDropeffects",value:function(){if(this._initDropZones(),this._initDraggableItems(),this.selections.items.length){for(var e=this.dropZones.length,t=0;t<e;t++)"none"!==this.dropZones[t].getAttribute("aria-dropeffect")&&(this.dropZones[t].setAttribute("aria-dropeffect","none"),this.dropZones[t].removeAttribute("tabindex"));for(var i=this.draggableItems.length,r=0;r<i;r++)this.draggableItems[r].getAttribute("aria-grabbed")?"true"===this.draggableItems[r].getAttribute("aria-grabbed")&&this.draggableItems[r].setAttribute("tabindex","0"):(this.draggableItems[r].setAttribute("aria-grabbed","false"),this.draggableItems[r].setAttribute("tabindex","0"))}}},{key:"_getContainer",value:function(e){do{if(1===e.nodeType&&e.getAttribute("aria-dropeffect"))return e}while(e=e.parentNode);return null}},{key:"_mouseDown",value:function(e){this._clearDropeffects(),this._hasModifier(e)&&(this._clearDropeffects(),this._clearSelections())}},{key:"_mouseUp",value:function(e){if(!this._hasModifier(e))return void(e.target.getAttribute("draggable")&&("false"===e.target.getAttribute("aria-grabbed")?this._addSelection(e.target):this._removeSelection(e.target)));e.target.getAttribute("draggable")&&("true"===e.target.getAttribute("aria-grabbed")?(this._removeSelection(e.target),this.selections.items.length||(this.selections.owner=null)):this._addSelection(e.target))}},{key:"_dragStart",value:function(e){this.selections.owner!==e.target.parentNode&&(this._clearSelections(),this._addSelection(e.target)),"false"===e.target.getAttribute("aria-grabbed")&&this._addSelection(e.target),e.dataTransfer.setData("text",""),this._addDropeffects()}},{key:"_keyDown",value:function(e){if(e.target.getAttribute("aria-grabbed")&&(32===e.keyCode&&(this._hasModifier(e)?"true"===e.target.getAttribute("aria-grabbed")?(1===this.selections.items.length&&this._clearDropeffects(),this._removeSelection(e.target),this.selections.items.length&&this._addDropeffects(),this.selections.items.length||(this.selections.owner=null)):(this._addSelection(e.target),this._addDropeffects()):"false"===e.target.getAttribute("aria-grabbed")?(this._clearDropeffects(),this._clearSelections(),this._addSelection(e.target),this._addDropeffects()):this._addDropeffects(),e.preventDefault()),77===e.keyCode&&this._hasModifier(e))){if(this.selections.items.length)if(this._addDropeffects(),this.selections.owner===this.dropZones[this.dropZones.length-1])this.dropZones[0].focus();else for(var t=this.dropZones.length,i=0;i<t;i++)if(this.selections.owner===this.dropZones[i]){this.dropZones[i+1].focus();break}e.preventDefault()}27===e.keyCode&&this.selections.items.length&&(this._clearDropeffects(),this.selections.items[this.selections.items.length-1].focus(),this._clearSelections())}},{key:"_dragLeave",value:function(e){this._initDropZones(),this._initDraggableItems();var t=this._getContainer(this.related);t===this.selections.owner&&(t=null),t!==this.selections.droptarget&&(this.selections.droptarget&&(this.selections.droptarget.className=this.selections.droptarget.className.replace(/ dragover/g,"")),t&&(t.className+=" dragover"),this.selections.droptarget=t)}},{key:"_startIndex",value:function(e){var t=e.lastChild;return null===t?0:"#text"===t.nodeName?0:t.getAttribute("grabindex")}},{key:"_dragEnd",value:function(e){if(this.selections.droptarget){for(var t=this._startIndex(this.selections.droptarget),i=this.selections.items.length,r=0;r<i;r++)this.selections.items[r].setAttribute("grabindex",++t),this.selections.droptarget.appendChild(this.selections.items[r]);e.preventDefault()}this.selections.items.length&&(this._clearDropeffects(),this.selections.droptarget&&(this._clearSelections(),this.selections.droptarget.className=this.selections.droptarget.className.replace(/ dragover/g,""),this.selections.droptarget=null))}}]),e}(),l={};l.install=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i={invert:!0,selectAll:!0,itemCheckbox:!0,callbackBeforeDragStart:function(){},callbackAfterDragStart:function(){},callbackBeforeDragOver:function(){},callbackAfterDragOver:function(){},callbackBeforeDragend:function(){},callbackAfterDragend:function(){},callbackBeforeDragenter:function(){},callbackAfterDragenter:function(){},callbackBeforeDragleave:function(){},callbackAfterDragleave:function(){},callbackBeforeMouseup:function(){},callbackAfterMouseup:function(){},callbackBeforeMousdown:function(){},callbackAfterMousdown:function(){}},r=n({},i,t),s=new o(r);e.directive("mz-drag",{bind:function(e){e.setAttribute("draggable","true"),e.setAttribute("aria-grabbed","false"),e.setAttribute("tabindex","0"),e.setAttribute("grabindex","0"),s.initItem(e)},unbind:function(e){e.removeEventListener()}}),e.directive("mz-dropzone",{bind:function(e){e.setAttribute("related","true"),e.setAttribute("aria-dropeffect","none")}}),e.mixin({created:function(){}}),e.prototype.$myMethod=function(){}},e.default=l,e.register=a,Object.defineProperty(e,"__esModule",{value:!0})});
+!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?t(exports):"function"==typeof define&&define.amd?define(["exports"],t):(e=e||self,t(e.VueMultiDrag={}))}(this,function(e){"use strict";function t(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}function i(e,t){for(var i=0;i<t.length;i++){var r=t[i];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(e,r.key,r)}}function r(e,t,r){return t&&i(e.prototype,t),r&&i(e,r),e}function s(e,t,i){return t in e?Object.defineProperty(e,t,{value:i,enumerable:!0,configurable:!0,writable:!0}):e[t]=i,e}function n(e){for(var t=1;t<arguments.length;t++){var i=null!=arguments[t]?arguments[t]:{},r=Object.keys(i);"function"==typeof Object.getOwnPropertySymbols&&(r=r.concat(Object.getOwnPropertySymbols(i).filter(function(e){return Object.getOwnPropertyDescriptor(i,e).enumerable}))),r.forEach(function(t){s(e,t,i[t])})}return e}function a(e){}var o=function(){function e(i){t(this,e),this.options=i,this.allItems=[],this.selections={items:[],owner:null,droptarget:null},this.dropZones=null,this.draggableItems=null,this.related={},this._attachGlobalListeners()}return r(e,[{key:"_attachGlobalListeners",value:function(){var e=this;document.addEventListener("dragenter",function(t){e.options.callbackBeforeDragenter(t,e),e.related=t.target,e.options.callbackAfterDragenter(t,e)}),document.addEventListener("dragleave",function(t){e.options.callbackBeforeDragleave(t,e),e._dragLeave(t),e.options.callbackAfterDragleave(t,e)})}},{key:"initItem",value:function(e,t){e.setAttribute("grabindex",this.allItems.length),this.allItems.push(e),this.attachEventListeners(e,t)}},{key:"attachEventListeners",value:function(e,t){var i=this;e.addEventListener("mousedown",function(e){i.options.callbackBeforeMousdown(e,i),i._mouseDown(e),t.context.$emit("mousedown"),i.options.callbackAfterMousdown(e,i)}),e.addEventListener("mouseup",function(e){i.options.callbackBeforeMouseup(e,i),i._mouseUp(e),t.context.$emit("mouseup"),i.options.callbackAfterMouseup(e,i)}),e.addEventListener("dragstart",function(e){i.options.callbackBeforeDragStart(e,i),i._dragStart(e),t.context.$emit("dragstart"),i.options.callbackAfterDragStart(e,i)}),e.addEventListener("dragover",function(e){i.options.callbackBeforeDragOver(e,i),i.selections.items.length&&e.preventDefault(),t.context.$emit("dragover"),i.options.callbackAfterDragOver(e,i)}),e.addEventListener("dragend",function(e){i.options.callbackBeforeDragend(e,i),i._dragEnd(e),t.context.$emit("dragend"),i.options.callbackAfterDragend(e,i)})}},{key:"_addSelection",value:function(e){if(this.selections.owner){if(this.selections.owner!==e.parentNode)return}else this.selections.owner=e.parentNode;e.setAttribute("aria-grabbed","true"),this.selections.items.push(e),this.selections.items.sort(function(e,t){return e.getAttribute("grabindex")>t.getAttribute("grabindex")?1:t.getAttribute("grabindex")>e.getAttribute("grabindex")?-1:0})}},{key:"_removeSelection",value:function(e){e.setAttribute("aria-grabbed","false");for(var t=this.selections.items.length,i=0;i<t;i++)if(this.selections.items[i]===e){this.selections.items.splice(i,1);break}0===this.selections.items.length&&(this.selections.owner=null)}},{key:"_clearSelections",value:function(){if(this.selections.items.length){for(var e=this.selections.items.length,t=0;t<e;t++)this.selections.items[t].setAttribute("aria-grabbed","false");this.selections.owner=null,this.selections.items=[]}}},{key:"_hasModifier",value:function(e){return e.ctrlKey||e.metaKey||e.shiftKey}},{key:"_initDropZones",value:function(){null===this.dropZones&&(this.dropZones=document.querySelectorAll("[related]"))}},{key:"_initDraggableItems",value:function(){null===this.draggableItems&&(this.draggableItems=document.querySelectorAll("[draggable]"))}},{key:"_addDropeffects",value:function(){this._initDropZones(),this._initDraggableItems();for(var e=this.dropZones.length,t=0;t<e;t++)this.dropZones[t]!==this.selections.owner&&"none"===this.dropZones[t].getAttribute("aria-dropeffect")&&(this.dropZones[t].setAttribute("aria-dropeffect","move"),this.dropZones[t].setAttribute("tabindex","0"));for(var i=this.draggableItems.length,r=0;r<i;r++)this.draggableItems[r].parentNode!==this.selections.owner&&this.draggableItems[r].getAttribute("aria-grabbed")&&(this.draggableItems[r].removeAttribute("aria-grabbed"),this.draggableItems[r].removeAttribute("tabindex"))}},{key:"_clearDropeffects",value:function(){if(this._initDropZones(),this._initDraggableItems(),this.selections.items.length){for(var e=this.dropZones.length,t=0;t<e;t++)"none"!==this.dropZones[t].getAttribute("aria-dropeffect")&&(this.dropZones[t].setAttribute("aria-dropeffect","none"),this.dropZones[t].removeAttribute("tabindex"));for(var i=this.draggableItems.length,r=0;r<i;r++)this.draggableItems[r].getAttribute("aria-grabbed")?"true"===this.draggableItems[r].getAttribute("aria-grabbed")&&this.draggableItems[r].setAttribute("tabindex","0"):(this.draggableItems[r].setAttribute("aria-grabbed","false"),this.draggableItems[r].setAttribute("tabindex","0"))}}},{key:"_getContainer",value:function(e){do{if(1===e.nodeType&&e.getAttribute("aria-dropeffect"))return e}while(e=e.parentNode);return null}},{key:"_mouseDown",value:function(e){this._clearDropeffects(),this._hasModifier(e)&&(this._clearDropeffects(),this._clearSelections())}},{key:"_mouseUp",value:function(e){if(!this._hasModifier(e))return void(e.target.getAttribute("draggable")&&("false"===e.target.getAttribute("aria-grabbed")?this._addSelection(e.target):this._removeSelection(e.target)));e.target.getAttribute("draggable")&&("true"===e.target.getAttribute("aria-grabbed")?(this._removeSelection(e.target),this.selections.items.length||(this.selections.owner=null)):this._addSelection(e.target))}},{key:"_dragStart",value:function(e){this.selections.owner!==e.target.parentNode&&(this._clearSelections(),this._addSelection(e.target)),"false"===e.target.getAttribute("aria-grabbed")&&this._addSelection(e.target),e.dataTransfer.setData("text",""),this._addDropeffects()}},{key:"_keyDown",value:function(e){if(e.target.getAttribute("aria-grabbed")&&(32===e.keyCode&&(this._hasModifier(e)?"true"===e.target.getAttribute("aria-grabbed")?(1===this.selections.items.length&&this._clearDropeffects(),this._removeSelection(e.target),this.selections.items.length&&this._addDropeffects(),this.selections.items.length||(this.selections.owner=null)):(this._addSelection(e.target),this._addDropeffects()):"false"===e.target.getAttribute("aria-grabbed")?(this._clearDropeffects(),this._clearSelections(),this._addSelection(e.target),this._addDropeffects()):this._addDropeffects(),e.preventDefault()),77===e.keyCode&&this._hasModifier(e))){if(this.selections.items.length)if(this._addDropeffects(),this.selections.owner===this.dropZones[this.dropZones.length-1])this.dropZones[0].focus();else for(var t=this.dropZones.length,i=0;i<t;i++)if(this.selections.owner===this.dropZones[i]){this.dropZones[i+1].focus();break}e.preventDefault()}27===e.keyCode&&this.selections.items.length&&(this._clearDropeffects(),this.selections.items[this.selections.items.length-1].focus(),this._clearSelections())}},{key:"_dragLeave",value:function(e){this._initDropZones(),this._initDraggableItems();var t=this._getContainer(this.related);t===this.selections.owner&&(t=null),t!==this.selections.droptarget&&(this.selections.droptarget&&(this.selections.droptarget.className=this.selections.droptarget.className.replace(/ dragover/g,"")),t&&(t.className+=" dragover"),this.selections.droptarget=t)}},{key:"_startIndex",value:function(e){var t=e.lastChild;return null===t?0:"#text"===t.nodeName?0:t.getAttribute("grabindex")}},{key:"_dragEnd",value:function(e){if(this.selections.droptarget){for(var t=this._startIndex(this.selections.droptarget),i=this.selections.items.length,r=0;r<i;r++)this.selections.items[r].setAttribute("grabindex",++t),this.selections.droptarget.appendChild(this.selections.items[r]);e.preventDefault()}this.selections.items.length&&(this._clearDropeffects(),this.selections.droptarget&&(this._clearSelections(),this.selections.droptarget.className=this.selections.droptarget.className.replace(/ dragover/g,""),this.selections.droptarget=null))}}]),e}(),l={};l.install=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:{},i={invert:!0,selectAll:!0,itemCheckbox:!0,callbackBeforeDragStart:function(){},callbackAfterDragStart:function(){},callbackBeforeDragOver:function(){},callbackAfterDragOver:function(){},callbackBeforeDragend:function(){},callbackAfterDragend:function(){},callbackBeforeDragenter:function(){},callbackAfterDragenter:function(){},callbackBeforeDragleave:function(){},callbackAfterDragleave:function(){},callbackBeforeMouseup:function(){},callbackAfterMouseup:function(){},callbackBeforeMousdown:function(){},callbackAfterMousdown:function(){}},r=n({},i,t),s=new o(r);e.directive("mz-drag",{bind:function(e,t,i){e.setAttribute("draggable","true"),e.setAttribute("aria-grabbed","false"),e.setAttribute("tabindex","0"),e.setAttribute("grabindex","0"),s.initItem(e,i)},unbind:function(e){e.removeEventListener()}}),e.directive("mz-dropzone",{bind:function(e){e.setAttribute("related","true"),e.setAttribute("aria-dropeffect","none")}}),e.mixin({created:function(){}}),e.prototype.$myMethod=function(){}},e.default=l,e.register=a,Object.defineProperty(e,"__esModule",{value:!0})});

package.json

@@ -23,3 +23,3 @@ {
   "license": "ISC",
-  "version": "0.3.1",
+  "version": "0.3.2",
   "scripts": {
@@ -26,0 +26,0 @@ "serve": "vue-cli-service serve",

README.md

@@ -32,3 +32,9 @@ # vue-multi-drag
       <ul v-mz-dropzone>
-        <li v-mz-drag>Element 1</li>
+        <li v-mz-drag 
+        @dragend="method"
+        @dragenter="method2"
+        @dragexit="method3"
+        @dragleave="method4"
+        @dragover="method5"
+        @dragstart="method6">Element 1</li>
         <li v-mz-drag>Element 2</li>
@@ -35,0 +41,0 @@ <li v-mz-drag>Element 3</li>

src/index.js

@@ -44,3 +44,3 @@ import VueMultiDragBehaviour from './vue-multi-drag-behaviour'
   Vue.directive('mz-drag', {
-    bind(el) {
+    bind(el, binding, vnode) {
       // something logic ...
@@ -52,3 +52,3 @@ el.setAttribute('draggable', 'true') // enable html5 drag API
       // the index resets when the item moves to other column
-      vmdb.initItem(el)
+      vmdb.initItem(el, vnode)
     },
@@ -55,0 +55,0 @@ unbind(el) {

src/vue-multi-drag-behaviour.js

@@ -40,7 +40,7 @@ // Took the algorithm and all the logic from
 
-  initItem (draggableItem) {
+  initItem (draggableItem, vnode) {
     draggableItem.setAttribute('grabindex', this.allItems.length) // this attribute keeps track of the position
     // so it is not affected by the order of selection
     this.allItems.push(draggableItem)
-    this.attachEventListeners(draggableItem)
+    this.attachEventListeners(draggableItem, vnode)
   }
@@ -54,3 +54,3 @@
    */
-  attachEventListeners (draggableItem) {
+  attachEventListeners (draggableItem, vnode) {
     // this.items.push(draggableItem)
@@ -61,2 +61,3 @@
       this._mouseDown(e)
+      vnode.context.$emit('mousedown')
       this.options.callbackAfterMousdown(e, this)
@@ -67,2 +68,3 @@ })
       this._mouseUp(e)
+      vnode.context.$emit('mouseup')
       this.options.callbackAfterMouseup(e, this)
@@ -73,2 +75,3 @@ })
       this._dragStart(e)
+      vnode.context.$emit('dragstart')
       this.options.callbackAfterDragStart(e, this)
@@ -82,2 +85,3 @@ })
       }
+      vnode.context.$emit('dragover')
       this.options.callbackAfterDragOver(e, this)
@@ -89,2 +93,3 @@ })
       this._dragEnd(e)
+      vnode.context.$emit('dragend')
       this.options.callbackAfterDragend(e, this)
@@ -91,0 +96,0 @@ })

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

117195

increased by1.31%

Lines of code

2316

increased by0.87%

Number of lines in readme file

124

increased by5.08%

No dependency changes