Home

# Class goog.fx.DragListGroup

A class representing a group of one or more "drag lists" with items that can be dragged within them and between them. Example usage: var dragListGroup = new goog.fx.DragListGroup(); dragListGroup.setDragItemHandleHoverClass(className1, className2); dragListGroup.setDraggerElClass(className3); dragListGroup.addDragList(vertList, goog.fx.DragListDirection.DOWN); dragListGroup.addDragList(horizList, goog.fx.DragListDirection.RIGHT); dragListGroup.init();

extends goog.events.EventTarget

Instance Method Summary
| `addDragList(?Element dragListElement, ?goog.fx.DragListDirection growthDirection, boolean= opt_unused, string= opt_dragHoverClass)` Adds a drag list to this DragListGroup. All calls to this method must happen before the call to init(). Remember that all child nodes (except text nodes) will be made draggable to any other drag list in this group.
| `cleanupDragDom_()` Cleans up DOM changes that are made by the {@code handleDrag*} methods.
| `cleanup_(goog.events.Event= opt_e)` Clear all our temporary fields that are only defined while dragging, and all the bounds info stored on the drag lists and drag elements.
| `cloneNode_(?Element sourceEl) ⇒ ?Element` Note: Copied from abstractdragdrop.js. TODO(user): consolidate. Creates copy of node being dragged.

`disposeInternal()`

Unattach listeners from this object. Classes that extend EventTarget may need to override this method in order to remove references to DOM Elements and additional listeners, it should be something like this:

    MyClass.prototype.disposeInternal = function() {
    MyClass.superClass_.disposeInternal.call(this);
    // Dispose logic for MyClass
    };

| `getHandleForDragItem_(?Element dragItem) ⇒ ?Element` Default implementation of the function to get the "handle" element for a drag item. By default, we use the whole drag item as the handle. Users can change this by calling setFunctionToGetHandleForDragItem().
| `getHoverDragList_(?goog.math.Coordinate draggerElCenter) ⇒ ?Element` Helper for handleDragMove_(). Given the position of the center of the dragger element, figures out whether it's currently hovering over any of the drag lists.

`getHoverNextItem_(?Element hoverList, ?goog.math.Coordinate draggerElCenter) ⇒ ?Element`

Helper for handleDragMove_(). Given the position of the center of the dragger element, plus the drag list that it's currently hovering over, figures out the next drag item in the list that follows the current position of the dragger element. (I.e. if the drag action ends right now, it would become the item after the current drag item.)

| `getHysteresis() ⇒ number`
| `handleDragEnd_(!goog.fx.DragEvent dragEvent) ⇒ boolean` Handles the end or the cancellation of a drag action, i.e. END or CLEANUP event fired by the dragger.
| `handleDragItemHandleMouseout_(?goog.events.BrowserEvent e)` Handles a MOUSEOUT event fired on the handle element of a drag item.
| `handleDragItemHandleMouseover_(?goog.events.BrowserEvent e)` Handles a MOUSEOVER event fired on the handle element of a drag item.
| `handleDragItemMouseout_(?goog.events.BrowserEvent e)` Handles a MOUSEOUT event fired on a drag item.
| `handleDragItemMouseover_(?goog.events.BrowserEvent e)` Handles a MOUSEOVER event fired on a drag item.
| `handleDragMove_(?goog.fx.DragEvent dragEvent) ⇒ boolean` Handles a drag movement (i.e. DRAG event fired by the dragger).
| `handleDragStart_(!goog.fx.DragEvent e)` Handles the start of a drag action.
| `handlePotentialDragStart_(!goog.events.BrowserEvent e)` Handles mouse and touch events which may start a drag action.
| `init()` Performs the initial setup to make all items in all lists draggable.
| `insertCurrDragItem_(?Element hoverList, ?Element hoverNextItem)` Inserts the current drag item to the appropriate location in the drag list that we're hovering over (if the current drag item is not already there).
| `insertCurrHoverItem()` Inserts the currently dragged item in its new place. This method is used for insertion only when updateWhileDragging_ is false (otherwise there is no need for that). In the basic implementation the element is inserted before the currently hovered over item (this can be changed by overriding the method in subclasses).
| `isInRect_(?goog.math.Coordinate pos, ?goog.math.Rect rect) ⇒ boolean` Checks whether a coordinate position resides inside a rectangle.
| `recacheListAndItemBounds_(?Element currDragItem)` Caches the heights of each drag list and drag item, except for the current drag item.

`setCurrDragItemClass((string|undefined) var_args)`

Sets a user-supplied CSS class to add to the current drag item (during a drag action). If not set, the default behavior adds visibility:hidden to the current drag item so that it is a block of empty space in the hover drag list (if any). If this class is set by the user, then the default behavior does not happen (unless, of course, the class also contains visibility:hidden).

| `setDragItemHandleHoverClass((string|undefined) var_args)` Sets a user-supplied CSS class to add to a drag item handle on hover (not during a drag action).
| `setDragItemHoverClass((string|undefined) var_args)` Sets a user-supplied CSS class to add to a drag item on hover (not during a drag action).
| `setDraggerElClass(string draggerElClass)` Sets a user-supplied CSS class to add to the clone of the current drag item that's actually being dragged around (during a drag action).
| `setFunctionToGetHandleForDragItem(function ((Element|null)): (Element|null) getHandleForDragItemFn)` Sets a user-supplied function used to get the "handle" element for a drag item. The function must accept exactly one argument. The argument may be any drag item element. If not set, the default implementation uses the whole drag item as the handle.
| `setHysteresis(number distance)` Sets the distance the user has to drag the element before a drag operation is started.
| `setIsCurrDragItemAlwaysDisplayed()` Sets the property of the currDragItem that it is always displayed in the list.
| `setNoUpdateWhileDragging()` Sets the private property updateWhileDragging_ to false. This disables the update of the position of the currDragItem while dragging. It will only be placed to its new location once the drag ends.

`updateCurrHoverItem(?Element hoverNextItem, ?goog.math.Coordinate= opt_draggerElCenter)`

Updates the value of currHoverItem_. This method is used for insertion only when updateWhileDragging_ is false. The below implementation is the basic one. This method can be extended by a subclass to support changes to hovered item (eg: highlighting). Parametr opt_draggerElCenter can be used for more sophisticated effects.

Static Method Summary
| `getBottomBound_(?goog.math.Rect itemBounds) ⇒ number` Private helper for getHoverNextItem_(). Given the bounds of an item, computes the item's bottom y-value.
| `getLeftBound_(?goog.math.Rect itemBounds) ⇒ number` Private helper for getHoverNextItem_(). Given the bounds of an item, computes the item's left x-value.
| `getRightBound_(?goog.math.Rect itemBounds) ⇒ number` Private helper for getHoverNextItem_(). Given the bounds of an item, computes the item's right x-value.
| `isGreaterThan_(number a, number b) ⇒ boolean` Private helper for getHoverNextItem_().
| `isLessThan_(number a, number b) ⇒ boolean` Private helper for getHoverNextItem_().
| `verticalDistanceFromItem_(?Element item, ?goog.math.Coordinate target) ⇒ number` Private helper for getHoverNextItem(). Given an item and a target determine the vertical distance from the item's center to the target.