2010-11-15 08:39:52 +01:00
|
|
|
/*
|
2011-11-08 17:40:44 +01:00
|
|
|
Copyright (c) 2004-2011, The Dojo Foundation All Rights Reserved.
|
2010-11-15 08:39:52 +01:00
|
|
|
Available via Academic Free License >= 2.1 OR the modified BSD license.
|
|
|
|
see: http://dojotoolkit.org/license for details
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
2011-03-04 17:02:28 +01:00
|
|
|
if(!dojo._hasResource["dojo.dnd.Mover"]){ //_hasResource checks added by build. Do not use _hasResource directly in your code.
|
|
|
|
dojo._hasResource["dojo.dnd.Mover"] = true;
|
2010-11-15 08:39:52 +01:00
|
|
|
dojo.provide("dojo.dnd.Mover");
|
|
|
|
dojo.require("dojo.dnd.common");
|
|
|
|
dojo.require("dojo.dnd.autoscroll");
|
2011-03-04 17:02:28 +01:00
|
|
|
|
2011-11-08 17:40:44 +01:00
|
|
|
|
2011-03-04 17:02:28 +01:00
|
|
|
dojo.declare("dojo.dnd.Mover", null, {
|
|
|
|
constructor: function(node, e, host){
|
|
|
|
// summary:
|
2011-11-08 17:40:44 +01:00
|
|
|
// an object which makes a node follow the mouse, or touch-drag on touch devices.
|
2011-03-04 17:02:28 +01:00
|
|
|
// Used as a default mover, and as a base class for custom movers.
|
|
|
|
// node: Node
|
|
|
|
// a node (or node's id) to be moved
|
|
|
|
// e: Event
|
|
|
|
// a mouse event, which started the move;
|
|
|
|
// only pageX and pageY properties are used
|
|
|
|
// host: Object?
|
|
|
|
// object which implements the functionality of the move,
|
|
|
|
// and defines proper events (onMoveStart and onMoveStop)
|
|
|
|
this.node = dojo.byId(node);
|
2011-11-08 17:40:44 +01:00
|
|
|
var pos = e.touches ? e.touches[0] : e;
|
|
|
|
this.marginBox = {l: pos.pageX, t: pos.pageY};
|
2011-03-04 17:02:28 +01:00
|
|
|
this.mouseButton = e.button;
|
2011-11-08 17:40:44 +01:00
|
|
|
var h = (this.host = host), d = node.ownerDocument;
|
2011-03-04 17:02:28 +01:00
|
|
|
this.events = [
|
2011-11-08 17:40:44 +01:00
|
|
|
// At the start of a drag, onFirstMove is called, and then the following two
|
|
|
|
// connects are disconnected
|
|
|
|
dojo.connect(d, "onmousemove", this, "onFirstMove"),
|
|
|
|
dojo.connect(d, "ontouchmove", this, "onFirstMove"),
|
|
|
|
|
|
|
|
// These are called continually during the drag
|
2011-03-04 17:02:28 +01:00
|
|
|
dojo.connect(d, "onmousemove", this, "onMouseMove"),
|
2011-11-08 17:40:44 +01:00
|
|
|
dojo.connect(d, "ontouchmove", this, "onMouseMove"),
|
|
|
|
|
|
|
|
// And these are called at the end of the drag
|
2011-03-04 17:02:28 +01:00
|
|
|
dojo.connect(d, "onmouseup", this, "onMouseUp"),
|
2011-11-08 17:40:44 +01:00
|
|
|
dojo.connect(d, "ontouchend", this, "onMouseUp"),
|
|
|
|
|
2011-03-04 17:02:28 +01:00
|
|
|
// cancel text selection and text dragging
|
|
|
|
dojo.connect(d, "ondragstart", dojo.stopEvent),
|
2011-11-08 17:40:44 +01:00
|
|
|
dojo.connect(d.body, "onselectstart", dojo.stopEvent)
|
2011-03-04 17:02:28 +01:00
|
|
|
];
|
|
|
|
// notify that the move has started
|
|
|
|
if(h && h.onMoveStart){
|
|
|
|
h.onMoveStart(this);
|
|
|
|
}
|
|
|
|
},
|
|
|
|
// mouse event processors
|
|
|
|
onMouseMove: function(e){
|
|
|
|
// summary:
|
2011-11-08 17:40:44 +01:00
|
|
|
// event processor for onmousemove/ontouchmove
|
2011-03-04 17:02:28 +01:00
|
|
|
// e: Event
|
2011-11-08 17:40:44 +01:00
|
|
|
// mouse/touch event
|
2011-03-04 17:02:28 +01:00
|
|
|
dojo.dnd.autoScroll(e);
|
2011-11-08 17:40:44 +01:00
|
|
|
var m = this.marginBox,
|
|
|
|
pos = e.touches ? e.touches[0] : e;
|
|
|
|
this.host.onMove(this, {l: m.l + pos.pageX, t: m.t + pos.pageY}, e);
|
2011-03-04 17:02:28 +01:00
|
|
|
dojo.stopEvent(e);
|
|
|
|
},
|
|
|
|
onMouseUp: function(e){
|
2011-11-08 17:40:44 +01:00
|
|
|
if(dojo.isWebKit && dojo.isMac && this.mouseButton == 2 ?
|
|
|
|
e.button == 0 : this.mouseButton == e.button){ // TODO Should condition be met for touch devices, too?
|
2011-03-04 17:02:28 +01:00
|
|
|
this.destroy();
|
|
|
|
}
|
|
|
|
dojo.stopEvent(e);
|
|
|
|
},
|
|
|
|
// utilities
|
|
|
|
onFirstMove: function(e){
|
|
|
|
// summary:
|
2011-11-08 17:40:44 +01:00
|
|
|
// makes the node absolute; it is meant to be called only once.
|
2011-03-04 17:02:28 +01:00
|
|
|
// relative and absolutely positioned nodes are assumed to use pixel units
|
|
|
|
var s = this.node.style, l, t, h = this.host;
|
|
|
|
switch(s.position){
|
|
|
|
case "relative":
|
|
|
|
case "absolute":
|
|
|
|
// assume that left and top values are in pixels already
|
|
|
|
l = Math.round(parseFloat(s.left)) || 0;
|
|
|
|
t = Math.round(parseFloat(s.top)) || 0;
|
|
|
|
break;
|
|
|
|
default:
|
|
|
|
s.position = "absolute"; // enforcing the absolute mode
|
|
|
|
var m = dojo.marginBox(this.node);
|
|
|
|
// event.pageX/pageY (which we used to generate the initial
|
|
|
|
// margin box) includes padding and margin set on the body.
|
|
|
|
// However, setting the node's position to absolute and then
|
|
|
|
// doing dojo.marginBox on it *doesn't* take that additional
|
|
|
|
// space into account - so we need to subtract the combined
|
|
|
|
// padding and margin. We use getComputedStyle and
|
|
|
|
// _getMarginBox/_getContentBox to avoid the extra lookup of
|
2011-11-08 17:40:44 +01:00
|
|
|
// the computed style.
|
2011-03-04 17:02:28 +01:00
|
|
|
var b = dojo.doc.body;
|
|
|
|
var bs = dojo.getComputedStyle(b);
|
|
|
|
var bm = dojo._getMarginBox(b, bs);
|
|
|
|
var bc = dojo._getContentBox(b, bs);
|
|
|
|
l = m.l - (bc.l - bm.l);
|
|
|
|
t = m.t - (bc.t - bm.t);
|
|
|
|
break;
|
|
|
|
}
|
|
|
|
this.marginBox.l = l - this.marginBox.l;
|
|
|
|
this.marginBox.t = t - this.marginBox.t;
|
|
|
|
if(h && h.onFirstMove){
|
|
|
|
h.onFirstMove(this, e);
|
|
|
|
}
|
2011-11-08 17:40:44 +01:00
|
|
|
|
|
|
|
// Disconnect onmousemove and ontouchmove events that call this function
|
|
|
|
dojo.disconnect(this.events.shift());
|
|
|
|
dojo.disconnect(this.events.shift());
|
2011-03-04 17:02:28 +01:00
|
|
|
},
|
|
|
|
destroy: function(){
|
|
|
|
// summary:
|
|
|
|
// stops the move, deletes all references, so the object can be garbage-collected
|
|
|
|
dojo.forEach(this.events, dojo.disconnect);
|
|
|
|
// undo global settings
|
|
|
|
var h = this.host;
|
|
|
|
if(h && h.onMoveStop){
|
|
|
|
h.onMoveStop(this);
|
|
|
|
}
|
|
|
|
// destroy objects
|
|
|
|
this.events = this.node = this.host = null;
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
2010-11-15 08:39:52 +01:00
|
|
|
}
|