-<div class="body-wrap" xmlns:ext="http://www.extjs.com"><div class="top-tools"><a class="inner-link" href="#Ext.ux.ToolbarReorderer-props"><img src="resources/images/default/s.gif" class="item-icon icon-prop">Properties</a> <a class="inner-link" href="#Ext.ux.ToolbarReorderer-methods"><img src="resources/images/default/s.gif" class="item-icon icon-method">Methods</a> <a class="inner-link" href="#Ext.ux.ToolbarReorderer-events"><img src="resources/images/default/s.gif" class="item-icon icon-event">Events</a> <a class="inner-link" href="#Ext.ux.ToolbarReorderer-configs"><img src="resources/images/default/s.gif" class="item-icon icon-config">Config Options</a> <a class="bookmark" href="../docs/?class=Ext.ux.ToolbarReorderer"><img src="resources/images/default/s.gif" class="item-icon icon-fav">Direct Link</a> </div><div class="inheritance res-block"><pre class="res-block-inner"><a href="output/Ext.ux.Reorderer.html" ext:member="" ext:cls="Ext.ux.Reorderer">Reorderer</a> <img src="resources/elbow-end.gif">ToolbarReorderer</pre></div><h1>Class <a href="source/ToolbarReorderer.html#cls-Ext.ux.ToolbarReorderer">Ext.ux.ToolbarReorderer</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/ToolbarReorderer.html#cls-Ext.ux.ToolbarReorderer">ToolbarReorderer.js</a></td></tr><tr><td class="label">Class:</td><td class="hd-info"><a href="source/ToolbarReorderer.html#cls-Ext.ux.ToolbarReorderer">ToolbarReorderer</a></td></tr><tr><td class="label">Extends:</td><td class="hd-info"><a href="output/Ext.ux.Reorderer.html" ext:cls="Ext.ux.Reorderer" ext:member="">Reorderer</a></td></tr></table><div class="description">Plugin which can be attached to any Ext.Toolbar instance. Provides ability to reorder toolbar items
-with drag and drop. Example:
-<pre>
-new Ext.Toolbar({
-plugins: [
-new Ext.ux.ToolbarReorderer({
-defaultReorderable: true
-})
-],
-items: [
-{text: 'Button 1', reorderable: false},
-{text: 'Button 2'},
-{text: 'Button 3'}
-]
-});
-</pre>
-In the example above, buttons 2 and 3 will be reorderable via drag and drop. An event named 'reordered'
-is added to the Toolbar, and is fired whenever a reorder has been completed.</div><div class="hr"></div><a id="Ext.ux.ToolbarReorderer-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 inherited"><td class="micon"><a href="#expand" class="exi"> </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"><a href="output/Ext.ux.Reorderer.html#" ext:member="#" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </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"><a href="output/Ext.ux.Reorderer.html#" ext:member="#" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="config-row inherited"><td class="micon"><a href="#expand" class="exi"> </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"><a href="output/Ext.ux.Reorderer.html#" ext:member="#" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr></tbody></table><a id="Ext.ux.ToolbarReorderer-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 expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.ux.ToolbarReorderer-buttonXCache"></a><b><a href="source/ToolbarReorderer.html#prop-Ext.ux.ToolbarReorderer-buttonXCache">buttonXCache</a></b> : Object<div class="mdesc"><div class="short">This is used to store the correct x value of each button in the array. We need to use this
-instead of the button's re...</div><div class="long">This is used to store the correct x value of each button in the array. We need to use this
-instead of the button's reported x co-ordinate because the buttons are animated when they move -
-if another onDrag is fired while the button is still moving, the comparison x value will be incorrect</div></div></td><td class="msource">ToolbarReorderer</td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </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
-Object containing default values for plugin configuration details. These can be overridden when
-constructing the plugin<div class="mdesc"></div></td><td class="msource"><a href="output/Ext.ux.Reorderer.html#defaults" ext:member="#defaults" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="property-row inherited"><td class="micon"><a href="#expand" class="exi"> </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
-Reference to the target component which contains the reorderable items<div class="mdesc"></div></td><td class="msource"><a href="output/Ext.ux.Reorderer.html#target" ext:member="#target" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr></tbody></table><a id="Ext.ux.ToolbarReorderer-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 inherited"><td class="micon"><a href="#expand" class="exi"> </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>( <code>Object config</code> )
- :
- 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"><a href="output/Ext.ux.Reorderer.html#constructor" ext:member="#constructor" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.ux.ToolbarReorderer-createItemDD"></a><b><a href="source/ToolbarReorderer.html#method-Ext.ux.ToolbarReorderer-createItemDD">createItemDD</a></b>( <code>Mixed button</code> )
- :
- 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">ToolbarReorderer</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </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>( <code>Object mappings</code> )
- :
- 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"><a href="output/Ext.ux.Reorderer.html#doReorder" ext:member="#doReorder" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.ux.ToolbarReorderer-endDrag"></a><b><a href="source/ToolbarReorderer.html#method-Ext.ux.ToolbarReorderer-endDrag">endDrag</a></b>()
- :
- void<div class="mdesc"><div class="short">After the drag has been completed, make sure the button being dragged makes it back to
-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
-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">ToolbarReorderer</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </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>()
- :
- 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,
-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,
-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"><a href="output/Ext.ux.Reorderer.html#getItems" ext:member="#getItems" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="method-row expandable "><td class="micon"><a href="#expand" class="exi"> </a></td><td class="sig"><a id="Ext.ux.ToolbarReorderer-init"></a><b><a href="source/ToolbarReorderer.html#method-Ext.ux.ToolbarReorderer-init">init</a></b>()
- :
- void<div class="mdesc"><div class="short">Initializes the plugin, decorates the toolbar with additional functionality</div><div class="long">Initializes the plugin, decorates the toolbar with additional functionality<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">ToolbarReorderer</td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </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>()
- :
- 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"><a href="output/Ext.ux.Reorderer.html#initEvents" ext:member="#initEvents" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </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>( <code>Object mappings</code> )
- :
- void<div class="mdesc"><div class="short">Reorders the items in the target component according to the given mapping object. Example:
-this.reorder({
-1: 5,
-3: 2
-...</div><div class="long">Reorders the items in the target component according to the given mapping object. Example:
-this.reorder({
-1: 5,
-3: 2
-});
-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"><a href="output/Ext.ux.Reorderer.html#reorder" ext:member="#reorder" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr></tbody></table><a id="Ext.ux.ToolbarReorderer-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 inherited"><td class="micon"><a href="#expand" class="exi"> </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> :
- ( <code>Object mappings</code>, <code>Mixed component</code>, <code>Ext.ux.TabReorderer this</code> )
- <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"><a href="output/Ext.ux.Reorderer.html#before-reorder" ext:member="#before-reorder" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr><tr class="method-row expandable inherited"><td class="micon"><a href="#expand" class="exi"> </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> :
- ( <code>Object mappings</code>, <code>Mixed component</code>, <code>Ext.ux.TabReorderer this</code> )
- <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"><a href="output/Ext.ux.Reorderer.html#reorder" ext:member="#reorder" ext:cls="Ext.ux.Reorderer">Reorderer</a></td></tr></tbody></table></div>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff