ng-drag-drop - npm Package Compare versions

Comparing version 4.0.0 to 4.0.1

CHANGELOG.md

@@ -0,1 +1,4 @@
+## 4.0.1 (2018-04-03) - Maintenance Release
+- Fix: Allow draghandle to work for touchscreens when used with polyfill. Pull Request ([#112](https://github.com/ObaidUrRehman/ng2-drag-drop/pull/112))
+- Fix: Overlapping droppable with non matching dropScope steals drop event.  Pull Request ([#110](https://github.com/ObaidUrRehman/ng2-drag-drop/pull/110))
 ## 4.0.0 (2017-10-24)
@@ -2,0 +5,0 @@ - Package renamed to `ng-drag-drop`

package.json

 {
   "name": "ng-drag-drop",
-  "version": "4.0.0",
+  "version": "4.0.1",
   "description": "Drag & Drop for Angular - based on HTML5 with no external dependencies.",
@@ -48,5 +48,5 @@ "main": "index.js",
     "concurrently": "^3.5.0",
-    "http-server": "^0.10.0",
+    "http-server": "^0.11.0",
     "jasmine-core": "~2.8.0",
-    "karma": "^1.3.0",
+    "karma": "^2.0.0",
     "karma-chrome-launcher": "^2.0.0",
@@ -56,3 +56,3 @@ "karma-cli": "^1.0.1",
     "karma-jasmine": "^1.0.2",
-    "karma-jasmine-html-reporter": "^0.2.2",
+    "karma-jasmine-html-reporter": "^1.0.0",
     "lite-server": "^2.3.0",
@@ -59,0 +59,0 @@ "lodash": "^4.17.4",

src/directives/draggable.directive.js

@@ -196,3 +196,3 @@ "use strict";
         'dragEnd': [{ type: core_1.HostListener, args: ['dragend', ['$event'],] },],
-        'mousedown': [{ type: core_1.HostListener, args: ['mousedown', ['$event'],] },],
+        'mousedown': [{ type: core_1.HostListener, args: ['mousedown', ['$event'],] }, { type: core_1.HostListener, args: ['touchstart', ['$event'],] },],
     };
@@ -199,0 +199,0 @@ return Draggable;

src/directives/draggable.directive.metadata.json

@@ -1,1 +0,1 @@
-[{"__symbolic":"module","version":3,"metadata":{"Draggable":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[draggable]"}]}],"members":{"dragData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragScope":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandleClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragTransitClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding"},"arguments":["draggable"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"},{"__symbolic":"reference","module":"../services/ng-drag-drop.service","name":"NgDragDropService"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method"}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragend",["$event"]]}]}],"mousedown":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mousedown",["$event"]]}]}],"allowDrag":[{"__symbolic":"method"}],"applyDragHandleClass":[{"__symbolic":"method"}],"getDragHandleElement":[{"__symbolic":"method"}],"unbindDragListeners":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"Draggable":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[draggable]"}]}],"members":{"dragData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragScope":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandleClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragTransitClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding"},"arguments":["draggable"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"},{"__symbolic":"reference","module":"../services/ng-drag-drop.service","name":"NgDragDropService"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method"}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragend",["$event"]]}]}],"mousedown":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mousedown",["$event"]]}]}],"allowDrag":[{"__symbolic":"method"}],"applyDragHandleClass":[{"__symbolic":"method"}],"getDragHandleElement":[{"__symbolic":"method"}],"unbindDragListeners":[{"__symbolic":"method"}]}}}}]
+[{"__symbolic":"module","version":3,"metadata":{"Draggable":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[draggable]"}]}],"members":{"dragData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragScope":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandleClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragTransitClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding"},"arguments":["draggable"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"},{"__symbolic":"reference","module":"../services/ng-drag-drop.service","name":"NgDragDropService"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method"}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragend",["$event"]]}]}],"mousedown":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mousedown",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["touchstart",["$event"]]}]}],"allowDrag":[{"__symbolic":"method"}],"applyDragHandleClass":[{"__symbolic":"method"}],"getDragHandleElement":[{"__symbolic":"method"}],"unbindDragListeners":[{"__symbolic":"method"}]}}}},{"__symbolic":"module","version":1,"metadata":{"Draggable":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive"},"arguments":[{"selector":"[draggable]"}]}],"members":{"dragData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandle":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEffect":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragScope":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragHandleClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragTransitClass":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragImage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"dragEnabled":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostBinding"},"arguments":["draggable"]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input"}}]}],"onDragStart":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDrag":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"onDragEnd":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output"}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2"},{"__symbolic":"reference","module":"../services/ng-drag-drop.service","name":"NgDragDropService"},{"__symbolic":"reference","module":"@angular/core","name":"NgZone"}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnDestroy":[{"__symbolic":"method"}],"dragStart":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragstart",["$event"]]}]}],"drag":[{"__symbolic":"method"}],"dragEnd":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["dragend",["$event"]]}]}],"mousedown":[{"__symbolic":"method","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["mousedown",["$event"]]},{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"HostListener"},"arguments":["touchstart",["$event"]]}]}],"allowDrag":[{"__symbolic":"method"}],"applyDragHandleClass":[{"__symbolic":"method"}],"getDragHandleElement":[{"__symbolic":"method"}],"unbindDragListeners":[{"__symbolic":"method"}]}}}}]

src/directives/droppable.directive.js

@@ -111,9 +111,14 @@ "use strict";
     Droppable.prototype.drop = function (e) {
-        dom_helper_1.DomHelper.removeClass(this.el, this.dragOverClass);
-        e.preventDefault();
-        e.stopPropagation();
-        this.ng2DragDropService.onDragEnd.next();
-        this.onDrop.emit(new drop_event_model_1.DropEvent(e, this.ng2DragDropService.dragData));
-        this.ng2DragDropService.dragData = null;
-        this.ng2DragDropService.scope = null;
+        var _this = this;
+        this.allowDrop().subscribe(function (result) {
+            if (result && _this._isDragActive) {
+                dom_helper_1.DomHelper.removeClass(_this.el, _this.dragOverClass);
+                e.preventDefault();
+                e.stopPropagation();
+                _this.ng2DragDropService.onDragEnd.next();
+                _this.onDrop.emit(new drop_event_model_1.DropEvent(e, _this.ng2DragDropService.dragData));
+                _this.ng2DragDropService.dragData = null;
+                _this.ng2DragDropService.scope = null;
+            }
+        });
     };
@@ -120,0 +125,0 @@ Droppable.prototype.allowDrop = function () {

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

Major refactor

Supply chain risk

Package has recently undergone a major refactor. It may be unstable or indicate significant internal changes. Use caution when updating to versions that include significant changes.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

173965

increased by0.5%

Lines of code

926

increased by0.54%

Number of medium supply chain risk alerts

0

decreased by-100%

No dependency changes