UWA Class: UWA.Controls.Drag.Move

new UWA.Controls.Drag.Move(options)

Drag and drop DOM elements in zones. Inherits from Drag.

Drag.Move steps (excludes the 'move' step for simplification):

            o
            v
          start ---> o
            |
            v
          handles
            |
            v
   -----> enter
   |     __| |__
   |    |       |
   |    v       v
   --- leave   drop
        |__   __| |
           | |    |
           v v    |
          cancel  |
            |  ___|
            | |
            v v
           stop
            v
            o

Example

new Drag.Move({
    // Constrain the element placement to this zone
    container: container,

    // Start dragging by clicking on any element matching this selector
    delegate: '.moveme, .moveme > *',

    // The moving element should be the closest element with the 'moveme' class
    handles: function (context) {
        return context.target.getClosest('.moveme');
    }
});

Parameters

Name Type Description

options

Object

Options hash or a option/value pair.

Properties

Name	Type	Argument	Default	Description
`container`	Element	<optional>	undefined	An Element instance to get the limits of the draggable zone. If the 'root' option is not defined, 'container' is used as 'root'.
`zones`	String	<optional>	[root]	Either: a CSS selector who will be called against the 'root', a list of Elements or a function returning a list of Elements. The zones are elements where the handled element could be dropped, or moved on it.
`centerHandles`	Boolean	<optional>	undefined	If `true`, centers the handled element around the cursor.
`overlay`	Boolean	<optional>	undefined	If `true`, but an overlay in the 'document' to prevent frames or flash to steal drag events. This is only available on non-touch devices as touch events do not have this problem.
`start`	Function	<optional>	undefined	Callback. If defined, will be called before the drag snaps. If it returns `false`, it cancels the whole process.
`handles`	Function	<optional>	undefined	Callback. If defined, will be called as soon as the drag snaps. If it returns a DOM element, the element is used to set the drag position. If it returns undefined, the event target will be used instead.
`enter`	Function	<optional>	undefined	Callback. If defined, called when the cursor enters in a zone. If it returns a DOM element, it will be used as placeholder in this zone.
`leave`	Function	<optional>	undefined	Callback. If defined, called when the cursor leaves a zone.
`drop`	Function	<optional>	undefined	Callback. If defined, called when the handled element is droped on a zone. If it returns `false`, the next step is 'cancel'.
`move`	Function	<optional>	undefined	Callback. If defined, called when the handled element moves.
`cancel`	Function	<optional>	undefined	Callback. If defined, called when the handled element is dropped outside a zone or if 'drop' returned `false`.
`stop`	Function	<optional>	undefined	Callback. If defined, called when the drag stops. Not called if 'start' returned `false`.
`fixed`	Function	<optional>	undefined	Callback. If defined, called to determine if a node (passed second argument) should be fixed. This can cancel a drag and influences the palceholder placement
`allowBesidePlaceholder`	Boolean	<optional>	false	If `true` the placeholder could be placed next to the dragged target.

Extends

UWA.Controls.Drag

Index

Methods

setOptions(Object) → {this}

Set the options.

Parameters

Name	Type	Description
`Object`	options	The options to use

Returns

Type: this

start()

Overrides Drag.start. Call callbacks 'start' and 'fixed' to check if we have to start the move process.

snap()

Overrides Drag.snap. Call the 'handles' callback and initialises the zone and limit caches.

refreshCache()

Context proof (this method can be called as context.refreshCache). Refresh the zones cache.

reset()

Overrides the Drag.reset method.

stop()

Overrides the Drag.stop method. Call the 'drop', 'cancel' and 'stop' callbacks.

move()

Overrides the Drag.move method. Computes the position of the element, and call the 'leave', 'enter' and 'move' callbacks.

setPosition()

Set the position of the element, after limiting it with the limits. Populates the 'limit' property.

getList(definition) → {Array.<DOMElement>}

Get a list of elements based on the type of the parameter. If it is an array, it returns it. If it is a function, calls it and return the results. If it is a string, consider it as a CSS selector to be run within the 'root' element.

Parameters

Name	Type	Description
`definition`	Array \| Function \| String	Some elements to consider.

Returns

A list of dom elements.

Type: Array.<DOMElement>

call(name, arg)

Invoke a callback if it is defined

Parameters

Name	Type	Description
`name`	String	The name of the callback
`arg`	Array	The parameters to pass to the callback

Returns

The result of the callback

refreshPlaceholderCache()

Refreshes the placeholder cache

placePlaceholder()

Put the placeholder between the elements contained in the current zone.