/*!
 * Ext JS Library 3.0.3
 * Copyright(c) 2006-2009 Ext JS, LLC
 * licensing@extjs.com
 * http://www.extjs.com/license
 */
/** * @class Ext.dd.DragTracker * @extends Ext.util.Observable */ Ext.dd.DragTracker = function(config){ Ext.apply(this, config); this.addEvents(
/** * @event mousedown * @param {Object} this * @param {Object} e event object */ 'mousedown',
/** * @event mouseup * @param {Object} this * @param {Object} e event object */ 'mouseup',
/** * @event mousemove * @param {Object} this * @param {Object} e event object */ 'mousemove',
/** * @event dragstart * @param {Object} this * @param {Object} startXY the page coordinates of the event */ 'dragstart',
/** * @event dragend * @param {Object} this * @param {Object} e event object */ 'dragend',
/** * @event drag * @param {Object} this * @param {Object} e event object */ 'drag' ); this.dragRegion = new Ext.lib.Region(0,0,0,0); if(this.el){ this.initEl(this.el); } } Ext.extend(Ext.dd.DragTracker, Ext.util.Observable, {
/** * @cfg {Boolean} active * Defaults to false. */ active: false,
/** * @cfg {Number} tolerance * Defaults to 5. */ tolerance: 5,
/** * @cfg {Boolean/Number} autoStart * Defaults to false. Specify true to defer trigger start by 1000 ms. * Specify a Number for the number of milliseconds to defer trigger start. */ autoStart: false, initEl: function(el){ this.el = Ext.get(el); el.on('mousedown', this.onMouseDown, this, this.delegate ? {delegate: this.delegate} : undefined); }, destroy : function(){ this.el.un('mousedown', this.onMouseDown, this); }, onMouseDown: function(e, target){ if(this.fireEvent('mousedown', this, e) !== false && this.onBeforeStart(e) !== false){ this.startXY = this.lastXY = e.getXY(); this.dragTarget = this.delegate ? target : this.el.dom; if(this.preventDefault !== false){ e.preventDefault(); } var doc = Ext.getDoc(); doc.on('mouseup', this.onMouseUp, this); doc.on('mousemove', this.onMouseMove, this); doc.on('selectstart', this.stopSelect, this); if(this.autoStart){ this.timer = this.triggerStart.defer(this.autoStart === true ? 1000 : this.autoStart, this); } } }, onMouseMove: function(e, target){ // HACK: IE hack to see if button was released outside of window. */ if(this.active && Ext.isIE && !e.browserEvent.button){ e.preventDefault(); this.onMouseUp(e); return; } e.preventDefault(); var xy = e.getXY(), s = this.startXY; this.lastXY = xy; if(!this.active){ if(Math.abs(s[0]-xy[0]) > this.tolerance || Math.abs(s[1]-xy[1]) > this.tolerance){ this.triggerStart(); }else{ return; } } this.fireEvent('mousemove', this, e); this.onDrag(e); this.fireEvent('drag', this, e); }, onMouseUp: function(e){ var doc = Ext.getDoc(); doc.un('mousemove', this.onMouseMove, this); doc.un('mouseup', this.onMouseUp, this); doc.un('selectstart', this.stopSelect, this); e.preventDefault(); this.clearStart(); var wasActive = this.active; this.active = false; delete this.elRegion; this.fireEvent('mouseup', this, e); if(wasActive){ this.onEnd(e); this.fireEvent('dragend', this, e); } }, triggerStart: function(isTimer){ this.clearStart(); this.active = true; this.onStart(this.startXY); this.fireEvent('dragstart', this, this.startXY); }, clearStart : function(){ if(this.timer){ clearTimeout(this.timer); delete this.timer; } }, stopSelect : function(e){ e.stopEvent(); return false; }, onBeforeStart : function(e){ }, onStart : function(xy){ }, onDrag : function(e){ }, onEnd : function(e){ }, getDragTarget : function(){ return this.dragTarget; }, getDragCt : function(){ return this.el; }, getXY : function(constrain){ return constrain ? this.constrainModes[constrain].call(this, this.lastXY) : this.lastXY; }, getOffset : function(constrain){ var xy = this.getXY(constrain); var s = this.startXY; return [s[0]-xy[0], s[1]-xy[1]]; }, constrainModes: { 'point' : function(xy){ if(!this.elRegion){ this.elRegion = this.getDragCt().getRegion(); } var dr = this.dragRegion; dr.left = xy[0]; dr.top = xy[1]; dr.right = xy[0]; dr.bottom = xy[1]; dr.constrainTo(this.elRegion); return [dr.left, dr.top]; } } });