Sencha Documentation

Ext.dd.DragTracker

Overview

Sub classes

Ext.resizer.SplitterTracker
A DragTracker listens for drag events on an Element and fires events at the start and end of the drag, as well as during the drag. This is useful for components such as Ext.slider.MultiSlider, where there is an element that can be dragged around to change the Slider's value. DragTracker provides a series of template methods that should be overridden to provide functionality in response to detected drag operations. These are onBeforeStart, onStart, onDrag and onEnd. See Ext.slider.MultiSlider's initEvents function for an example implementation.

Config Options

 
: trackOver
 
: overCls
 
: constrainTo
 
autoStart : Boolean/Number
Defaults to false. Specify true to defer trigger start by 1000 ms. Specify a Number for the number of milliseconds to...
Defaults to false. Specify true to defer trigger start by 1000 ms. Specify a Number for the number of milliseconds to defer trigger start.
 
delegate : String
Optional. A DomQuery selector which identifies child elements within the DragTracker's encapsulating Element which ar...
Optional.

A DomQuery selector which identifies child elements within the DragTracker's encapsulating Element which are the tracked elements. This limits tracking to only begin when the matching elements are mousedowned.

This may also be a specific child element within the DragTracker's encapsulating element to use as the tracked element.

 
preventDefault : Boolean
Specify false to enable default actions on onMouseDown events. Defaults to true.
Specify false to enable default actions on onMouseDown events. Defaults to true.
 
stopEvent : Boolean
Specify true to stop the mousedown event from bubbling to outer listeners from the target element (or its delegates)....
Specify true to stop the mousedown event from bubbling to outer listeners from the target element (or its delegates). Defaults to false.
 
tolerance : Number
Number of pixels the drag target must be moved before dragging is considered to have started. Defaults to 5.
Number of pixels the drag target must be moved before dragging is considered to have started. Defaults to 5.

Properties

 
active : Boolean Read-only property indicated whether the user is currently dragging this tracker.
 
dragTarget : HtmlElement <p><b>Only valid during drag operations. Read-only.</b></p> <p>The element being dragged.</p> <p>If the {@link #delegate} option is used, this will be the delegate element which was mousedowned.</p>

Methods

 
getDragTarget : Ext.core.Element
Returns the drag target. This is usually the DragTracker's encapsulating element. If the delegate option is being use...

Returns the drag target. This is usually the DragTracker's encapsulating element.

If the delegate option is being used, this may be a child element which matches the delegate selector.

 
getOffset( constrainMode {String} ) : Void
Returns the X, Y offset of the current mouse position from the mousedown point. This method may optionally constrain ...

Returns the X, Y offset of the current mouse position from the mousedown point.

This method may optionally constrain the real offset values, and returns a point coerced in one of two modes:

  • point
    The current mouse position is coerced into the constrainRegion, and the resulting position is returned.
  • dragTarget
    The new Region of the dragTarget is calculated based upon the current mouse position, and then coerced into the constrainRegion. The returned mouse position is then adjusted by the same delta as was used to coerce the region.

Parameters

  • {String} : constrainMode
    Optional. If omitted the true mouse position is returned. May be passed as 'point' or 'dragTarget'. See above..

Returns

  • Void
 
initEl( Ext.core.Element/HTMLElement el ) : Void
Initializes the DragTracker on a given element.
Initializes the DragTracker on a given element.

Parameters

  • el : Ext.core.Element/HTMLElement
    The element

Returns

  • Void
 
onBeforeStart( Ext.EventObject e ) : Void
Template method which should be overridden by each DragTracker instance. Called when the user first clicks and holds ...
Template method which should be overridden by each DragTracker instance. Called when the user first clicks and holds the mouse button down. Return false to disallow the drag

Parameters

  • e : Ext.EventObject
    The event object

Returns

  • Void
 
onDrag( Ext.EventObject e ) : Void
Template method which should be overridden by each DragTracker instance. Called whenever a drag has been detected.
Template method which should be overridden by each DragTracker instance. Called whenever a drag has been detected.

Parameters

  • e : Ext.EventObject
    The event object

Returns

  • Void
 
onEnd( Ext.EventObject e ) : Void
Template method which should be overridden by each DragTracker instance. Called when a drag operation has been comple...
Template method which should be overridden by each DragTracker instance. Called when a drag operation has been completed (e.g. the user clicked and held the mouse down, dragged the element and then released the mouse button)

Parameters

  • e : Ext.EventObject
    The event object

Returns

  • Void
 
onStart( Ext.EventObject e ) : Void
Template method which should be overridden by each DragTracker instance. Called when a drag operation starts (e.g. th...
Template method which should be overridden by each DragTracker instance. Called when a drag operation starts (e.g. the user has moved the tracked element beyond the specified tolerance)

Parameters

  • e : Ext.EventObject
    The event object

Returns

  • Void

Events

 
drag( Object this, Object e )
 
dragend( Object this, Object e )
 
dragstart( Object this, Object e )
 
mousedown( Object this, Object e )
Fires when the mouse button is pressed down, but before a drag operation begins. The drag operation begins after eith...

Fires when the mouse button is pressed down, but before a drag operation begins. The drag operation begins after either the mouse has been moved by tolerance pixels, or after the autoStart timer fires.

Return false to veto the drag operation.

Parameters

  • this : Object
  • e : Object
    event object

Returns

  • Void
 
mousemove( Object this, Object e )
Fired when the mouse is moved. Returning false cancels the drag operation.
Fired when the mouse is moved. Returning false cancels the drag operation.

Parameters

  • this : Object
  • e : Object
    event object

Returns

  • Void
 
mouseout( Object this, Object e )
Only available when trackOver is true Fires when the mouse exits the DragTracker's target element (or if delegate is ...

Only available when trackOver is true

Fires when the mouse exits the DragTracker's target element (or if delegate is used, when the mouse exits a delegate element).

Parameters

  • this : Object
  • e : Object
    event object

Returns

  • Void
 
mouseover( Object this, Object e, HtmlElement target )
Only available when trackOver is true Fires when the mouse enters the DragTracker's target element (or if delegate is...

Only available when trackOver is true

Fires when the mouse enters the DragTracker's target element (or if delegate is used, when the mouse enters a delegate element).

Parameters

  • this : Object
  • e : Object
    event object
  • target : HtmlElement
    The element mouseovered.

Returns

  • Void
 
mouseup( Object this, Object e )
© 2011 Sencha Inc.