https://www.visegradgroup.eu/js/aitia/aitia_dnd.js

1// függõségek
2if ("undefined" == typeof AITIA) {
3	alert("AITIA include missing!");
4}
5
6if ("undefined" == typeof AITIA_EVENT) {
7	alert("AITIA_EVENT include missing!");
8}
9
10// többszörös include
11if ("undefined" != typeof AITIA_DND) {
12	 alert("AITIA_DND multiple insert!");
13}
14
15AITIA_DND = 1;
16
17/**
18 * Javascript osztály drag'n'drop megvalósítására.
19 * drag objektumok paraméterei:
20 *  - start(drag, event) függvény, drag induláskor fut le
21 *  - move(drag, event) függvény, drag közben fut
22 *  - end(drag, event) függvény, drag végén fut le
23 *  - movable true|false mozog-e az objektum az egérrel
24 * 
25 * drop objektumok paraméterei:
26 *  - drop(drag, drop, event) függvény, drag objektum ejtésekor fut le
27 *  - hover(drag, drop, event) függvény, drag objektum drop felett lebegtetésekor fut le
28 *  - leave(drop, event) függvény, drop feletti lebegtetés végén fut le
29 *  - hoverclass string a drop elem css osztálya, ha van felette drag objektum
30 * 
31 * observer objektum függvényei:
32 *  - start(drag, event) függvény, drag induláskor fut le
33 *  - move(drag, event) függvény, drag közben fut
34 *  - end(drag, event) függvény, drag végén fut le, drop objektum nékül
35 *  - drop(drag, drop, event) függvény, drag objektum ejtésekor fut le
36 *  - hover(drag, drop, event) függvény, drag objektum drop felett lebegtetésekor fut le
37 *  - leave(drop, event) függvény, drop feletti lebegtetés végén fut le
38 */
39Aitia.Dnd = {
40	drops: [],
41	drags: [],
42	lastDrag: null,
43	lastDrop: null,
44	observer: null,
45	_dragsCnt: 0,
46	
47	addDrag: function(o, options) {
48		o = $(o);
49		if(o.options) {
50			for(attr in options) {
51				o.options[attr] = options[attr];
52			}
53		} else {
54			o.options = options;
55		}
56		//o.onmousedown = this._startDrag(o);
57		o.drag1 = function(e) {Aitia.Dnd._startDrag(e, o);};
58		Aitia.Event.addEvent(o, 'mousedown', o.drag1);
59		this._dragsCnt++;
60	},
61	
62	removeDrag: function(o) {
63		try {
64			o = $(o);
65			o.onmousedown = {};
66			Aitia.Event.removeEvent(o, 'mousedown', o.drag1);
67		}
68		catch(e) {}
69	},
70
71	addDrop: function(o, options) {
72		o = $(o);
73		if(o.options) {
74			for(attr in options) {
75				o.options[attr] = options[attr];
76			}
77		} else {
78			o.options = options;
79		}
80		o.drop1 = function(e) {Aitia.Dnd._startDrop(e, o);};
81		Aitia.Event.addEvent(o, 'mouseup', o.drop1);
82		o.drop2 =  function(e) {Aitia.Dnd._startHover(e, o);};
83		Aitia.Event.addEvent(o, 'mouseover', o.drop2);
84		o.drop3 =  function(e) {Aitia.Dnd._endHover(e, o);};
85		Aitia.Event.addEvent(o, 'mouseout', o.drop3);
86	},
87
88	removeDrop: function(o) {
89		o = $(o);
90		if(o.drop1) {
91			Aitia.Event.removeEvent(o, 'mouseup', o.drop1);
92			Aitia.Event.removeEvent(o, 'mouseover', o.drop2);
93			Aitia.Event.removeEvent(o, 'mouseout', o.drop3);
94		}
95	},
96
97	addObserver: function(o) {
98		this.observer = o;
99	},
100	
101	_startDrag: function(ev, o) {
102		if(!ev) {
103			ev = window.event;
104		}
105		document.onmousemove = this._dragging;
106		document.body.onmouseup = this._endDrag;
107		var drag = $(o);
108		Aitia.Dnd.lastDrag = drag;
109		if(Aitia.Dnd.observer) {
110			if(Aitia.Dnd.observer.start) {
111				Aitia.Dnd.observer.start(drag, ev);
112			}
113		}
114		if(drag.options.start) {
115			drag.options.start(drag, ev);
116		}
117	},
118	
119	_dragging: function(ev) {
120		if(!ev) {
121			ev = window.event;
122		}
123
124		var sel ;
125		if(document.selection && document.selection.empty){
126			document.selection.empty() ;
127		} else if(window.getSelection) {
128			sel=window.getSelection();
129			if(sel && sel.removeAllRanges) {
130				sel.removeAllRanges();
131			}
132		}
133
134		if(Aitia.Dnd.lastDrag) {
135			var drag = Aitia.Dnd.lastDrag;
136			if(Aitia.Dnd.observer) {
137				if(Aitia.Dnd.observer.move) {
138					Aitia.Dnd.observer.move(drag, ev);
139				}
140			}
141			if(drag.options.movable) {
142				drag.setStyle({	left: 10+(ev.pageX | ev.clientX)+'px', 
143												top: 10+(ev.pageY | ev.clientY)+'px', 
144												position: 'absolute', 
145												zIndex: '1000'});
146			}
147			if(drag.options.move) {
148				drag.options.move(drag, ev);
149			}
150		}
151	},
152	
153	_endDrag: function(ev) {
154		if(!ev) {
155			ev = window.event;
156		}
157		document.onmousemove = {};
158		document.body.onmouseup = {};
159		if(Aitia.Dnd.lastDrag) {
160			var drag = Aitia.Dnd.lastDrag;
161			if(Aitia.Dnd.observer) {
162				if(Aitia.Dnd.observer.end) {
163					Aitia.Dnd.observer.end(drag, ev);
164				}
165			}
166			if(drag.options.end) {
167				drag.options.end(drag, ev);
168			}
169			if(drag.options.movable) {
170				//drag.options.end(drag.element, ev);
171			}
172			Aitia.Dnd.lastDrag = null;
173			if(Aitia.Dnd.lastDrop) {
174				if(Aitia.Dnd.lastDrop.options.hoverclass) {
175					Aitia.Dnd.lastDrop.removeClassName(Aitia.Dnd.lastDrop.options.hoverclass);
176				}
177				Aitia.Dnd.lastDrop = null;
178			}
179		}
180	},
181	
182	_startDrop: function(ev, o) {
183		if(!ev) {
184			ev = window.event;
185		}
186		if(Aitia.Dnd.lastDrag) {
187			Aitia.Event.stopPropagation(ev);
188			var drop = $(o);
189			if(drop.options.accept) {

190				if(!drag.hasClassName(drop.options.accept)) {
191					return;
192				}
193			}
194			var drag = Aitia.Dnd.lastDrag;
195			if(drop != drag) {
196				if(Aitia.Dnd.observer) {
197					if(Aitia.Dnd.observer.drop) {
198						Aitia.Dnd.observer.drop(drag, drop, ev);
199					}
200				}
201				if(drop.options.drop) {
202					drop.options.drop(drag, drop, ev);
203				}
204			} else {
205				Aitia.Dnd._endDrag(ev);
206			}
207			Aitia.Dnd.lastDrag = null;
208		}
209	},
210	
211	_startHover: function(ev, o) {
212		if(!ev) {
213			ev = window.event;
214		}
215		var drop = $(o);
216		if(Aitia.Dnd.lastDrag) {
217			var drag = Aitia.Dnd.lastDrag;
218			if(drop.options.hoverclass) {
219				drop.addClassName(drop.options.hoverclass);
220			}
221			if(Aitia.Dnd.observer) {
222				if(Aitia.Dnd.observer.hover) {
223					Aitia.Dnd.observer.hover(drag, drop, ev);
224				}
225			}
226			if(drop.options.hover) {
227				drop.options.hover(drag, drop, ev);
228			}
229		}
230		Aitia.Dnd.lastDrop = drop;
231	},
232	
233	_endHover: function(ev, o) {
234		if(!ev) {
235			ev = window.event;
236		}
237		if(Aitia.Dnd.lastDrop) {
238			if(Aitia.Dnd.lastDrop.options.hoverclass) {
239				Aitia.Dnd.lastDrop.removeClassName(Aitia.Dnd.lastDrop.options.hoverclass);
240			}
241			if(Aitia.Dnd.lastDrop.options.leave) {
242				Aitia.Dnd.lastDrop.options.leave(Aitia.Dnd.lastDrop, ev);
243			}
244			if(Aitia.Dnd.observer) {
245				if(Aitia.Dnd.observer.leave) {
246					Aitia.Dnd.observer.leave(Aitia.Dnd.lastDrop, ev);
247				}
248			}
249			Aitia.Dnd.lastDrop = null;
250		}
251	}
252};