Class: SC.Drag
Extends
SC.Object.
An instance of this object is created whenever a drag occurs. The instance manages the mouse/touch events and coordinating with droppable targets until the user releases the mouse button.
To initiate a drag, you should call SC.Drag.start() with the options below
specified in a hash. Pass the ones you need to get the drag you want:
event-- (req) The mouse event/touch that triggered the drag. This will be used to position the element.source-- (req) The drag source object that should be consulted during the drag operations. This is usually the container view that initiated the drag.dragView-- Optional view that will be used as the source image for the drag. The drag operation will clone the DOM elements for this view and parent them under the drag pane, which has the class namesc-ghost-view. The drag view is not moved from its original location during a drag. If thedragViewis not provided, the source is used asdragView.ghost--YES|NOIfNO, the drag view image will show, but the sourcedragViewwill not be hidden. Set toYESto make it appear that thedragViewitself is being dragged around.slideBack--YES|NOIfYESand the drag operation is cancelled, thedragViewwill slide back to its source origin.origin-- If passed, this will be used as the origin point for theghostViewwhen it slides back. You normally do not need to pass this unless the ghost view does not appear in the main UI.data-- Optional hash of data types and values. You can use this to pass a static set of data instead of providing adataSource. If you provide adataSource, it will be used instead.dataSource-- Optional object that will provide the data for the drag to be consumed by the drop target. If you do not pass this parameter or the data hash, then the source object will be used if it implements theSC.DragDataSourceProtocolprotocol.anchorView-- if you pass this optional view, then the drag will only be allowed to happen within this view. TheghostViewwill actually be added as a child of this view during the drag. Normally theanchorViewis the window.
Defined in: drag.js
Field Summary
- allowedDragOperations
- data
- dataSource
- dragView
- ghost
- ghostActsLikeCursor
- ghostOffset
- ghostView
- location
- slideBack
- source
- sourceIsDraggable
- Fields borrowed from SC.Object:
- concatenatedProperties, isDestroyed, isObject, nextProperty, object, property, target, toInvalidate
- Fields borrowed from SC.Observable:
- isObservable
Class Methods
- addDropTarget(target)
- addScrollableView(target)
- inspectOperation(op)
- removeDropTarget(target)
- removeScrollableView(target)
- start(ops)
Instance Methods
- dataForType(dataType)
- dataTypes()
- hasDataType(dataType)
- hideGhostView()
- touchesDragged(evt)
- unhideGhostView()
Field Detail
allowedDragOperations NumberReturns the currently allowed dragOperations for the drag. This will be
set just before any callbacks are invoked on a drop target. The drag
source is given an opportunity to set these operations.
Optional hash of data. Used if no dataSource was provided.
Drag sources can provide a hash of data when the drag begins instead of
specifying an actual dataSource. The data is stored in this property.
If you are implementing a drop target, use the dataTypes property and
dataForTypes() method to access data instead of working directly with
these properties.
Optional object used to provide the data for the drag.
Drag source can designate a dataSource object to generate the data for
a drag dynamically. The data source can and often is the drag source
object itself.
Data Source objects must comply with the SC.DragDataSourceProtocol interface. If
you do not want to implement this interface, you can provide the data
directly with the data property.
If you are implementing a drop target, use the dataTypes property and
dataForTypes() method to access data instead of working directly with
these properties.
The view that was used as the source of the ghostView.
The drag view is not moved from its original location during a drag.
Instead, the DOM content of the view is cloned and managed by the
ghostView. If you want to visually indicate that the view is being
moved, you should set ghost to YES.
If dragView is not provided the source is used instead.
If YES, the dragView is automatically hidden while dragging around the
ghost.
If YES, then the ghostView will acts like a cursor and attach directly
to the mouse/touch location.
The origin to slide back to in the coordinate of the dragView's
containerView.
The view actually dragged around the screen. This is created automatically
from the dragView.
The current location of the mouse pointer in window coordinates. This is
updated as long as the mouse button is pressed or touch is active. Drop targets are
encouraged to update this property in their dragUpdated() method
implementations.
The ghostView will be positioned at this location.
If YES, then the ghostView will slide back to its original location if
drag is cancelled.
If NO, the source will not be copied, clone, no ghost view will get created,
and it won't be moved.
Class Method Detail
Register the view object as a drop target.
This method is called automatically whenever a view is created with the
isDropTarget property set to YES. You generally will not need to call it
yourself.
- Parameters:
- target SC.View
- a view implementing the SC.DropTargetProtocol protocol
Register the view object as a scrollable view. These views will auto-scroll during a drag.
- Parameters:
- target SC.View
- The view that should be auto-scrolled
Defined in: drag.js.
- Parameters:
- op
Unregister the view object as a drop target.
This method is called automatically whenever a view is removed from the hierarchy. You generally will not need to call it yourself.
- Parameters:
- target SC.View
- A previously registered drop target
Remove the view object as a scrollable view. These views will auto-scroll during a drag.
- Parameters:
- target SC.View
- A previously registered scrollable view
This is the method you use to initiate a new drag. See class documentation for more info on the options taken by this method.
- Parameters:
- ops
Instance Method Detail
Retrieve the data for the specified dataType from the drag source.
Drop targets can use this method during their performDragOperation()
method to retrieve the actual data provided by the drag data source. This
data may be generated dynamically depending on the data source.
Data types supported by this drag operation.
Returns an array of data types supported by the drag source. This may be generated dynamically depending on the data source.
If you are implementing a drag source, you will need to provide these data types so that drop targets can detect if they can accept your drag data.
If you are implementing a drop target, you should inspect this property
on your dragEntered() and prepareForDragOperation() methods to determine
if you can handle any of the data types offered up by the drag source.
- Parameters:
- evt