examples/docs/output/Ext.ux.Reorderer.html

   1 <div class="body-wrap" xmlns:ext="http://www.extjs.com"><div class="top-tools"><a class="inner-link" href="#Ext.ux.Reorderer-props"><img src="resources/images/default/s.gif" class="item-icon icon-prop">Properties</a>&#13;<a class="inner-link" href="#Ext.ux.Reorderer-methods"><img src="resources/images/default/s.gif" class="item-icon icon-method">Methods</a>&#13;<a class="inner-link" href="#Ext.ux.Reorderer-events"><img src="resources/images/default/s.gif" class="item-icon icon-event">Events</a>&#13;<a class="inner-link" href="#Ext.ux.Reorderer-configs"><img src="resources/images/default/s.gif" class="item-icon icon-config">Config Options</a>&#13;<a class="bookmark" href="../docs/?class=Ext.ux.Reorderer"><img src="resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a>&#13;</div><h1>Class <a href="source/Reorderer.html#cls-Ext.ux.Reorderer">Ext.ux.Reorderer</a></h1><table cellspacing="0"><tr><td class="label">Package:</td><td class="hd-info">Ext.ux</td></tr><tr><td class="label">Defined In:</td><td class="hd-info"><a href="source/Reorderer.html#cls-Ext.ux.Reorderer">Reorderer.js</a></td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/Reorderer.html#cls-Ext.ux.Reorderer">Reorderer</a></td></tr><tr><td class="label">Subclasses:</td><td class="hd-info"><a href="output/Ext.ux.HBoxReorderer.html" ext:cls="Ext.ux.HBoxReorderer">HBoxReorderer</a>,&#13;<a href="output/Ext.ux.ToolbarReorderer.html" ext:cls="Ext.ux.ToolbarReorderer">ToolbarReorderer</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info">Object</td></tr></table><div class="description">Generic base class for handling reordering of items. This base class must be extended to provide the
   2 actual reordering functionality - the base class just sets up events and abstract logic functions.
   3 It will fire events and set defaults, deferring the actual reordering to a doReorder implementation.
   4 See Ext.ux.TabReorderer for an example.</div><div class="hr"></div><a id="Ext.ux.Reorderer-configs"></a><h2>Config Options</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Config Options</th><th class="msource-header">Defined By</th></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-"></a><b><a href="source/Reorderer.html#cfg-Ext.ux.Reorderer-null"></a></b> : animate<div class="mdesc"></div></td><td class="msource">Reorderer</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-"></a><b><a href="source/Reorderer.html#cfg-Ext.ux.Reorderer-null"></a></b> : animationDuration<div class="mdesc"></div></td><td class="msource">Reorderer</td></tr><tr class="config-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-"></a><b><a href="source/Reorderer.html#cfg-Ext.ux.Reorderer-null"></a></b> : defaultReorderable<div class="mdesc"></div></td><td class="msource">Reorderer</td></tr></tbody></table><a id="Ext.ux.Reorderer-props"></a><h2>Public Properties</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Property</th><th class="msource-header">Defined By</th></tr><tr class="property-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-defaults"></a><b><a href="source/Reorderer.html#prop-Ext.ux.Reorderer-defaults">defaults</a></b> : Object
   5 Object containing default values for plugin configuration details. These can be overridden when
   6 constructing the plugin<div class="mdesc"></div></td><td class="msource">Reorderer</td></tr><tr class="property-row  "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-target"></a><b><a href="source/Reorderer.html#prop-Ext.ux.Reorderer-target">target</a></b> : Ext.Component
   7 Reference to the target component which contains the reorderable items<div class="mdesc"></div></td><td class="msource">Reorderer</td></tr></tbody></table><a id="Ext.ux.Reorderer-methods"></a><h2>Public Methods</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Method</th><th class="msource-header">Defined By</th></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-constructor"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-constructor">constructor</a></b>(&nbsp;<code>Object&nbsp;config</code>&nbsp;)
   8     :
   9                                         void<div class="mdesc"><div class="short">Creates the plugin instance, applies defaults</div><div class="long">Creates the plugin instance, applies defaults<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>config</code> : Object<div class="sub-desc">Optional config object</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-createItemDD"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-createItemDD">createItemDD</a></b>(&nbsp;<code>Mixed&nbsp;button</code>&nbsp;)
  10     :
  11                                         void<div class="mdesc"><div class="short">Sets up the given Toolbar item as a draggable</div><div class="long">Sets up the given Toolbar item as a draggable<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>button</code> : Mixed<div class="sub-desc">The item to make draggable (usually an Ext.Button instance)</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-doReorder"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-doReorder">doReorder</a></b>(&nbsp;<code>Object&nbsp;mappings</code>&nbsp;)
  12     :
  13                                         void<div class="mdesc"><div class="short">Abstract function to perform the actual reordering. This MUST be overridden in a subclass</div><div class="long">Abstract function to perform the actual reordering. This MUST be overridden in a subclass<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>mappings</code> : Object<div class="sub-desc">Mappings of the old item indexes to new item indexes</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-endDrag"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-endDrag">endDrag</a></b>()
  14     :
  15                                         void<div class="mdesc"><div class="short">After the drag has been completed, make sure the button being dragged makes it back to
  16 the correct location and reset...</div><div class="long">After the drag has been completed, make sure the button being dragged makes it back to
  17 the correct location and resets its z index<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-getItems"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-getItems">getItems</a></b>()
  18     :
  19                                         Array<div class="mdesc"><div class="short">Returns an array of items which will be made draggable. This defaults to the contents of this.target.items,
  20 but can b...</div><div class="long">Returns an array of items which will be made draggable. This defaults to the contents of this.target.items,
  21 but can be overridden - e.g. for TabPanels<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li><code>Array</code><div class="sub-desc">The array of items which will be made draggable</div></li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-init"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-init">init</a></b>(&nbsp;<code>Mixed&nbsp;target</code>&nbsp;)
  22     :
  23                                         void<div class="mdesc"><div class="short">Initializes the plugin, stores a reference to the target</div><div class="long">Initializes the plugin, stores a reference to the target<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>target</code> : Mixed<div class="sub-desc">The target component which contains the reorderable items</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-initEvents"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-initEvents">initEvents</a></b>()
  24     :
  25                                         void<div class="mdesc"><div class="short">Adds before-reorder and reorder events to the target component</div><div class="long">Adds before-reorder and reorder events to the target component<div class="mdetail-params"><strong>Parameters:</strong><ul><li>None.</li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-reorder"></a><b><a href="source/Reorderer.html#method-Ext.ux.Reorderer-reorder">reorder</a></b>(&nbsp;<code>Object&nbsp;mappings</code>&nbsp;)
  26     :
  27                                         void<div class="mdesc"><div class="short">Reorders the items in the target component according to the given mapping object. Example:
  28 this.reorder({
  29 1: 5,
  30 3: 2
  31 ...</div><div class="long">Reorders the items in the target component according to the given mapping object. Example:
  32 this.reorder({
  33 1: 5,
  34 3: 2
  35 });
  36 Would move the item at index 1 to index 5, and the item at index 3 to index 2<div class="mdetail-params"><strong>Parameters:</strong><ul><li><code>mappings</code> : Object<div class="sub-desc">Object containing current item index as key and new index as property</div></li></ul><strong>Returns:</strong><ul><li>void</li></ul></div></div></div></td><td class="msource">Reorderer</td></tr></tbody></table><a id="Ext.ux.Reorderer-events"></a><h2>Public Events</h2><table cellspacing="0" class="member-table"><tbody><tr><th colspan="2" class="sig-header">Event</th><th class="msource-header">Defined By</th></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-before-reorder"></a><b><a href="source/Reorderer.html#event-Ext.ux.Reorderer-before-reorder">before-reorder</a></b> :
  37                                       (&nbsp;<code>Object&nbsp;mappings</code>,&nbsp;<code>Mixed&nbsp;component</code>,&nbsp;<code>Ext.ux.TabReorderer&nbsp;this</code>&nbsp;)
  38     <div class="mdesc"><div class="short">Fires before a reorder occurs. Return false to cancel</div><div class="long">Fires before a reorder occurs. Return false to cancel<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>mappings</code> : Object<div class="sub-desc">Mappings of the old item indexes to new item indexes</div></li><li><code>component</code> : Mixed<div class="sub-desc">The target component</div></li><li><code>this</code> : Ext.ux.TabReorderer<div class="sub-desc">The plugin instance</div></li></ul></div></div></div></td><td class="msource">Reorderer</td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi">&nbsp;</a></td><td class="sig"><a id="Ext.ux.Reorderer-reorder"></a><b><a href="source/Reorderer.html#event-Ext.ux.Reorderer-reorder">reorder</a></b> :
  39                                       (&nbsp;<code>Object&nbsp;mappings</code>,&nbsp;<code>Mixed&nbsp;component</code>,&nbsp;<code>Ext.ux.TabReorderer&nbsp;this</code>&nbsp;)
  40     <div class="mdesc"><div class="short">Fires after a reorder has occured.</div><div class="long">Fires after a reorder has occured.<div class="mdetail-params"><strong style="font-weight: normal;">Listeners will be called with the following arguments:</strong><ul><li><code>mappings</code> : Object<div class="sub-desc">Mappings of the old item indexes to the new item indexes</div></li><li><code>component</code> : Mixed<div class="sub-desc">The target component</div></li><li><code>this</code> : Ext.ux.TabReorderer<div class="sub-desc">The plugin instance</div></li></ul></div></div></div></td><td class="msource">Reorderer</td></tr></tbody></table></div>