ng-drag-to-reorder
Advanced tools
Comparing version 0.1.4 to 0.1.5
{ | ||
"name": "ng-drag-to-reorder", | ||
"version": "0.1.2", | ||
"version": "0.1.4", | ||
"description": "Lightweight AngularJS drag and drop functionality to reorder lists without any dependencies other than Angular.", | ||
@@ -12,7 +12,7 @@ "main": "./ngDragToReorder.js", | ||
"AngularJS", | ||
"Drag", | ||
"and", | ||
"Drop", | ||
"Angular", | ||
"Drag and drop", | ||
"Draggable", | ||
"Reorder" | ||
"Reorder", | ||
"ng-repeat" | ||
], | ||
@@ -26,5 +26,5 @@ "homepage": "https://github.com/mhthompson86/ng-drag-to-reorder", | ||
"tests", | ||
"demo" | ||
"demo/*" | ||
] | ||
} | ||
@@ -5,7 +5,20 @@ (function () { | ||
angular.module('ngDragToReorder', []) | ||
.service('ngDragToReorder', function () { | ||
.factory('ngDragToReorder', function () { | ||
var _list = []; | ||
return { | ||
isSupported: draggable | ||
isSupported: draggable, | ||
setList: setList, | ||
getList: getList | ||
}; | ||
function setList(array) { | ||
if (array && array.length) _list = array; | ||
} | ||
function getList() { | ||
return _list; | ||
} | ||
function draggable() { | ||
@@ -15,2 +28,3 @@ var div = document.createElement('div'); | ||
} | ||
}) | ||
@@ -20,10 +34,12 @@ .directive('dragToReorder', ['ngDragToReorder', '$parse', function (ngDragToReorder, $parse) { | ||
restrict: 'A', | ||
link: function (scope, element, attrs) { | ||
link: function (scope, element, attrs, ctrl) { | ||
if (!ngDragToReorder.isSupported() || attrs.dragToReorder === '') return; | ||
if (!ngDragToReorder.isSupported()) return; | ||
var el = element[0], list = $parse(attrs.dragToReorder)(scope), stringIdx, int, item, | ||
ngDragToReorder.setList($parse(attrs.dragToReorder)((scope))); | ||
var el = element[0], list, stringIdx, int, item, | ||
newIdx, startIndex, target, offsetY, dragging = 'dtr-dragging', over = 'dtr-over', | ||
droppingAbove = 'dtr-dropping-above', droppingBelow = 'dtr-dropping-below', transition = 'dtr-transition', | ||
delay = 1000, loaded = false; | ||
delay = 1000, loaded = false, above = [], below = [], i, j; | ||
@@ -91,5 +107,17 @@ //console.log('list:', list); | ||
list = ngDragToReorder.getList(); | ||
item = list.splice(startIndex, 1)[0]; | ||
list.splice(newIdx, 0, item); | ||
ngDragToReorder.setList(list); | ||
scope.$apply(function () { | ||
scope.$emit('dragToReorder_drop', { | ||
item: item, | ||
newIndex: newIdx, | ||
prevIndex: startIndex, | ||
list: list | ||
}); | ||
}); | ||
this.classList.remove(over); | ||
@@ -109,10 +137,2 @@ this.classList.remove(droppingAbove); | ||
scope.$apply(function() { | ||
scope.$emit('dragToReorder_drop', { | ||
item: item, | ||
newIndex: newIdx, | ||
prevIndex: startIndex, | ||
list: list | ||
}); | ||
}) | ||
} | ||
@@ -139,2 +159,3 @@ | ||
}, delay); | ||
cleanupClasses(); | ||
return false; | ||
@@ -180,2 +201,18 @@ } | ||
function cleanupClasses () { | ||
above = document.querySelectorAll('.' + droppingAbove); | ||
below = document.querySelectorAll('.' + droppingBelow); | ||
if (above.length) { | ||
for (i = 0; i < above.length; i++) { | ||
above[i].classList.remove(droppingAbove); | ||
} | ||
} | ||
if (below.length) { | ||
for (i = 0; i < below.length; i++) { | ||
below[i].classList.remove(droppingBelow); | ||
} | ||
} | ||
} | ||
} | ||
@@ -182,0 +219,0 @@ }; |
{ | ||
"name": "ng-drag-to-reorder", | ||
"version": "0.1.4", | ||
"version": "0.1.5", | ||
"description": "Lightweight AngularJS drag and drop functionality to reorder lists without any dependencies other than Angular.", | ||
@@ -5,0 +5,0 @@ "main": "ngDragToReorder.js", |
@@ -125,5 +125,6 @@ # ng-drag-to-reorder | ||
3. You can import the **ngDragToReorder** service into your controller and check to see if drag and drop functionality is supported by your | ||
browser. The `drag-to-reorder` directive uses this service to prevent itself from wiring up event listeners if the browser doesn't support | ||
it. You can use the same service if you want to show or hide and buttons or other UI based on browser support. | ||
it. You can use the same service if you want to show or hide any buttons or other UI based on browser support. | ||
@@ -130,0 +131,0 @@ ```html |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
14
207
156
44013