-
Notifications
You must be signed in to change notification settings - Fork 5
Expand file tree
/
Copy pathne-dragdrop.js
More file actions
executable file
·106 lines (87 loc) · 3.37 KB
/
Copy pathne-dragdrop.js
File metadata and controls
executable file
·106 lines (87 loc) · 3.37 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
/**
* NE DRAG DROP
* ***************************************************************************************************************************
*/
angular.module('neDragdrop',[])
.directive('draggable', [function() {
return function(scope, element, attrs) {
// this gives us the native JS object
var el = element[0];
function preventDrag(e) {
e.preventDefault();
return false;
}
function addDragClass(e) {
e.dataTransfer.effectAllowed = 'move';
e.dataTransfer.setData('Text', this.id);
this.classList.add('dragged');
if(attrs.drag) scope.$apply(attrs.drag);
return false;
}
function removeDragClass(e) {
this.classList.remove('dragged');
return false;
}
if(attrs.draggable === 'false'){
el.addEventListener('dragstart', preventDrag);
scope.$on('$destroy', function(){
el.removeEventListener('dragstart', preventDrag);
});
}
else {
el.draggable = true;
el.addEventListener('dragstart', addDragClass);
el.addEventListener('dragend', removeDragClass);
scope.$on('$destroy', function(){
el.removeEventListener('dragstart', preventDrag);
el.removeEventListener('dragend', removeDragClass);
});
}
};
}])
.directive('droppable', [function() {
return function(scope, element, attrs) {
// again we need the native object
var el = element[0];
function dragover(e) {
e.dataTransfer.dropEffect = 'move';
// allows us to drop
if (e.preventDefault) e.preventDefault();
this.classList.add('dragover');
return false;
}
el.addEventListener('dragover', dragover);
function dragenter(e) {
this.classList.add('dragover');
return false;
}
el.addEventListener('dragenter', dragenter);
function dragleave(e) {
this.classList.remove('dragover');
return false;
}
el.addEventListener('dragleave', dragleave);
function drop(e) {
// Stops some browsers from redirecting.
if(e.stopPropagation) e.stopPropagation();
e.preventDefault();
this.classList.remove('dragover');
//var binId = this.id;
//var item = document.getElementById(e.dataTransfer.getData('Text'));
//this.appendChild(item);
// call the passed drop function
if(attrs.drop) scope.$apply(attrs.drop);
//scope.$apply(function(scope) {
// if(scope.drop) scope.$eval(scope.drop);
//});
return false;
}
el.addEventListener('drop', drop);
scope.$on('$destroy', function(){
el.removeEventListener('dragover', dragover);
el.removeEventListener('dragenter', dragenter);
el.removeEventListener('dragleave', dragleave);
el.removeEventListener('drop', drop);
});
};
}]);