From 0b0fbf677e031723a4a9c5b2d194d7d7fda5d7c6 Mon Sep 17 00:00:00 2001 From: Adrian Lang Date: Fri, 27 Nov 2009 12:24:02 +0100 Subject: Make drag inheritable darcs-hash:20091127112402-e4919-dc8340c03ef2d3b242302dcc228d56539eaf9e28.gz --- lib/scripts/drag.js | 55 ++++++++++++++++++++++++++++------------------------- 1 file changed, 29 insertions(+), 26 deletions(-) (limited to 'lib/scripts/drag.js') diff --git a/lib/scripts/drag.js b/lib/scripts/drag.js index 4726b77de..fa249a996 100644 --- a/lib/scripts/drag.js +++ b/lib/scripts/drag.js @@ -1,8 +1,9 @@ /** * Makes a DOM object draggable * - * This is currently for movable DOM dialogs only. If needed it could be - * extended to execute callbacks on special events... + * If you just want to move objects around, use drag.attach. For full + * customization, drag can be used as a javascript prototype, it is + * inheritance-aware. * * @link http://nofunc.org/Drag_Drop/ */ @@ -26,33 +27,36 @@ var drag = { attach: function (obj,handle) { if(handle){ handle.dragobject = obj; - addEvent($(handle),'mousedown',drag.start); }else{ - addEvent($(obj),'mousedown',drag.start); + handle = obj; } + var _this = this; + addEvent($(handle),'mousedown',function (e) {return _this.start(e); }); }, /** * Starts the dragging operation */ start: function (e){ - drag.handle = e.target; - if(drag.handle.dragobject){ - drag.obj = drag.handle.dragobject; + this.handle = e.target; + if(this.handle.dragobject){ + this.obj = this.handle.dragobject; }else{ - drag.obj = drag.handle; + this.obj = this.handle; } - drag.handle.className += ' ondrag'; - drag.obj.className += ' ondrag'; + this.handle.className += ' ondrag'; + this.obj.className += ' ondrag'; - drag.oX = parseInt(drag.obj.style.left); - drag.oY = parseInt(drag.obj.style.top); - drag.eX = drag.evX(e); - drag.eY = drag.evY(e); + this.oX = parseInt(this.obj.style.left); + this.oY = parseInt(this.obj.style.top); + this.eX = drag.evX(e); + this.eY = drag.evY(e); - addEvent(document,'mousemove',drag.drag); - addEvent(document,'mouseup',drag.stop); + var _this = this; + this.mousehandlers = [function (e) {return _this.drag(e);}, function (e) {return _this.stop(e);}]; + addEvent(document,'mousemove', this.mousehandlers[0]); + addEvent(document,'mouseup', this.mousehandlers[1]); e.preventDefault(); e.stopPropagation(); @@ -63,21 +67,21 @@ var drag = { * Ends the dragging operation */ stop: function(){ - drag.handle.className = drag.handle.className.replace(/ ?ondrag/,''); - drag.obj.className = drag.obj.className.replace(/ ?ondrag/,''); - removeEvent(document,'mousemove',drag.drag); - removeEvent(document,'mouseup',drag.stop); - drag.obj = null; - drag.handle = null; + this.handle.className = this.handle.className.replace(/ ?ondrag/,''); + this.obj.className = this.obj.className.replace(/ ?ondrag/,''); + removeEvent(document,'mousemove', this.mousehandlers[0]); + removeEvent(document,'mouseup', this.mousehandlers[1]); + this.obj = null; + this.handle = null; }, /** * Moves the object during the dragging operation */ drag: function(e) { - if(drag.obj) { - drag.obj.style.top = (drag.evY(e)+drag.oY-drag.eY+'px'); - drag.obj.style.left = (drag.evX(e)+drag.oX-drag.eX+'px'); + if(this.obj) { + this.obj.style.top = (this.evY(e)+this.oY-this.eY+'px'); + this.obj.style.left = (this.evX(e)+this.oX-this.eX+'px'); } }, @@ -96,4 +100,3 @@ var drag = { } }; - -- cgit v1.2.3 From 63de0a583d1ce8c88c5362eecd0fc5ecd8c411a4 Mon Sep 17 00:00:00 2001 From: Adrian Lang Date: Tue, 2 Mar 2010 14:30:37 +0100 Subject: =?UTF-8?q?Fix=20pageX=20and=20pageY=20in=20IE=E2=80=99s=20JS=20ev?= =?UTF-8?q?ents?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- lib/scripts/drag.js | 22 ++++------------------ 1 file changed, 4 insertions(+), 18 deletions(-) (limited to 'lib/scripts/drag.js') diff --git a/lib/scripts/drag.js b/lib/scripts/drag.js index fa249a996..254eab4a6 100644 --- a/lib/scripts/drag.js +++ b/lib/scripts/drag.js @@ -50,8 +50,8 @@ var drag = { this.oX = parseInt(this.obj.style.left); this.oY = parseInt(this.obj.style.top); - this.eX = drag.evX(e); - this.eY = drag.evY(e); + this.eX = e.pageX; + this.eY = e.pageY; var _this = this; this.mousehandlers = [function (e) {return _this.drag(e);}, function (e) {return _this.stop(e);}]; @@ -80,23 +80,9 @@ var drag = { */ drag: function(e) { if(this.obj) { - this.obj.style.top = (this.evY(e)+this.oY-this.eY+'px'); - this.obj.style.left = (this.evX(e)+this.oX-this.eX+'px'); + this.obj.style.top = (e.pageY+this.oY-this.eY+'px'); + this.obj.style.left = (e.pageX+this.oX-this.eX+'px'); } }, - /** - * Returns the X position of the given event. - */ - evX: function(e){ - return (e.pageX) ? e.pageX : e.clientX + document.body.scrollTop; //fixme shouldn't this be scrollLeft? - }, - - /** - * Returns the Y position of the given event. - */ - evY: function(e){ - return (e.pageY) ? e.pageY : e.clientY + document.body.scrollTop; - } - }; -- cgit v1.2.3 From fda42deb082e4bdb560818a9c23b96f9312176d5 Mon Sep 17 00:00:00 2001 From: Adrian Lang Date: Mon, 15 Mar 2010 16:57:38 +0100 Subject: Various JavaScript fixes * Syntax error fixed * lock refresh event is now attached to the whole edit form since it bubbles up and we cannot be sure that the wikitext input exists on all edit forms * Updated findPos(X|Y) * Easier and less error-prone way of getting the section edit button in the highlight mouseover event handler --- lib/scripts/drag.js | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) (limited to 'lib/scripts/drag.js') diff --git a/lib/scripts/drag.js b/lib/scripts/drag.js index 254eab4a6..169be5219 100644 --- a/lib/scripts/drag.js +++ b/lib/scripts/drag.js @@ -83,6 +83,5 @@ var drag = { this.obj.style.top = (e.pageY+this.oY-this.eY+'px'); this.obj.style.left = (e.pageX+this.oX-this.eX+'px'); } - }, - + } }; -- cgit v1.2.3 From f48ee0bd5efcf14944440e5dcb4042b14301f8ef Mon Sep 17 00:00:00 2001 From: Adrian Lang Date: Wed, 28 Jul 2010 15:52:20 +0200 Subject: Do not cancel event bubble in drag --- lib/scripts/drag.js | 2 -- 1 file changed, 2 deletions(-) (limited to 'lib/scripts/drag.js') diff --git a/lib/scripts/drag.js b/lib/scripts/drag.js index 169be5219..2212fb6c1 100644 --- a/lib/scripts/drag.js +++ b/lib/scripts/drag.js @@ -58,8 +58,6 @@ var drag = { addEvent(document,'mousemove', this.mousehandlers[0]); addEvent(document,'mouseup', this.mousehandlers[1]); - e.preventDefault(); - e.stopPropagation(); return false; }, -- cgit v1.2.3