Skip to content

Commit

Permalink
Selectable: Updated docs.
Browse files Browse the repository at this point in the history
  • Loading branch information
@scottgonzalez
scottgonzalez committed Sep 1, 2012
1 parent 78584d3 commit 9f29381
Showing 1 changed file with 27 additions and 36 deletions.
63 changes: 27 additions & 36 deletions entries/selectable.xml
View file
Original file line number Diff line number Diff line change
@@ -1,91 +1,84 @@
<?xml version="1.0"?>
<entry name="selectable" type="widget" widget-element="selectable element">
<title>Selectable Widget</title>
<desc>Use the mouse to select individual or a group of elements</desc>
<desc>Use the mouse to select elements, individually or in a group.</desc>
<longdesc>
<p>The jQuery UI Selectable plugin allows for elements to be selected by dragging a box (sometimes called a lasso) with the mouse over the elements. Also, elements can be selected by click or drag while holding the Ctrl/Meta key, allowing for multiple (non-contiguous) selections.</p>
<p>The jQuery UI Selectable plugin allows for elements to be selected by dragging a box (sometimes called a lasso) with the mouse over the elements. Elements can also be selected via click or drag while holding the ctrl/meta key, allowing for multiple (non-contiguous) selections.</p>
</longdesc>
<note id="functional-css"/>
<added>1.0</added>
<options>
<option name="autoRefresh" default='true'>
<desc>This determines whether to refresh (recalculate) the position and size of each selectee at the beginning of each select operation. If you have many many items, you may want to set this to false and call the refresh method manually.</desc>
<type name="Boolean" />
<option name="autoRefresh" type="Boolean" default="true">
<desc>This determines whether to refresh (recalculate) the position and size of each selectee at the beginning of each select operation. If you have many items, you may want to set this to false and call the <a href="#method-refresh"><code>refresh()</code></a> method manually.</desc>
</option>
<option name="cancel" default='":input,option"'>
<option name="cancel" type="Selector" default='"input,textarea,button,select,option"'>
<desc>Prevents selecting if you start on elements matching the selector.</desc>
<type name="Selector" />
</option>
<option name="delay" default='0'>
<desc>Time in milliseconds to define when the selecting should start. It helps preventing unwanted selections when clicking on an element.</desc>
<type name="Number" />
<option name="delay" type="Integer" default="0">
<desc>Time in milliseconds to define when the selecting should start. This helps prevent unwanted selections when clicking on an element.</desc>
</option>
<xi:include href="../includes/widget-option-disabled.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<option name="distance" default='0'>
<desc>Tolerance, in pixels, for when selecting should start. If specified, selecting will not start until after mouse is dragged beyond distance.</desc>
<type name="Number" />
<option name="distance" type="Number" default="0">
<desc>Tolerance, in pixels, for when selecting should start. If specified, selecting will not start until the mouse has been dragged beyond the specified distance.</desc>
</option>
<option name="filter" default='"*"'>
<option name="filter" type="Selector" default='"*"'>
<desc>The matching child elements will be made selectees (able to be selected).</desc>
<type name="Selector" />
</option>
<option name="tolerance" default='"touch"'>
<option name="tolerance" type="String" default='"touch"'>
<desc>
Possible values: 'touch', 'fit'.
Specifies which mode to use for testing whether the lasso should select an item. Possible values:
<ul>
<li>'''fit''': draggable overlaps the droppable entirely</li>
<li>'''touch''': draggable overlaps the droppable any amount</li>
<li><code>"fit"</code>: Lasso overlaps the item entirely.</li>
<li><code>"touch"</code>: Lasso overlaps the item by any amount.</li>
</ul>
</desc>
<type name="String" />
</option>

</options>
<events>
<xi:include href="../includes/widget-event-create.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<event name="selected" type="selectableselected">
<desc>This event is triggered at the end of the select operation, on each element added to the selection.</desc>
<desc>Triggered at the end of the select operation, on each element added to the selection.</desc>
<argument name="event" type="Event"/>
<argument name="ui" type="Object">
<property name="selected" type="Element">
<desc>The selectable item that has been selected</desc>
<desc>The selectable item that has been selected.</desc>
</property>
</argument>
</event>
<event name="selecting" type="selectableselecting">
<desc>This event is triggered during the select operation, on each element added to the selection.</desc>
<desc>Triggered during the select operation, on each element added to the selection.</desc>
<argument name="event" type="Event"/>
<argument name="ui" type="Object">
<property name="selecting" type="Element">
<desc>The current selectable item being selected</desc>
<desc>The current selectable item being selected.</desc>
</property>
</argument>
</event>
<event name="start" type="selectablestart">
<desc>This event is triggered at the beginning of the select operation.</desc>
<desc>Triggered at the beginning of the select operation.</desc>
<argument name="event" type="Event"/>
<argument name="ui" type="Object"/>
</event>
<event name="stop" type="selectablestop">
<desc>This event is triggered at the end of the select operation.</desc>
<desc>Triggered at the end of the select operation.</desc>
<argument name="event" type="Event"/>
<argument name="ui" type="Object"/>
</event>
<event name="unselected" type="selectableunselected">
<desc>This event is triggered at the end of the select operation, on each element removed from the selection.</desc>
<desc>Triggered at the end of the select operation, on each element removed from the selection.</desc>
<argument name="event" type="Event"/>
<argument name="ui" type="Object">
<property name="unselected" type="Element">
<desc>The selectable item that has been unselected</desc>
<desc>The selectable item that has been unselected.</desc>
</property>
</argument>
</event>
<event name="unselecting" type="selectableunselecting">
<desc>This event is triggered during the select operation, on each element removed from the selection.</desc>
<desc>Triggered during the select operation, on each element removed from the selection.</desc>
<argument name="event" type="Event"/>
<argument name="ui" type="Object">
<property name="unselecting" type="Element">
<desc>The current selectable item being unselected</desc>
<desc>The current selectable item being unselected.</desc>
</property>
</argument>
</event>
Expand All @@ -95,7 +88,7 @@
<xi:include href="../includes/widget-method-disable.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/widget-method-enable.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<method name="refresh">
<desc> Refresh the position and size of each selectee element. This method can be used to manually recalculate the position and size of each selectee element. Very useful if autoRefresh is set to false.</desc>
<desc>Refresh the position and size of each selectee element. This method can be used to manually recalculate the position and size of each selectee when the <a href="#option-autoRefresh"><code>autoRefresh</code></a> option is set to <code>false</code>.</desc>
</method>
<xi:include href="../includes/widget-method-option.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
<xi:include href="../includes/widget-method-widget.xml" xmlns:xi="http://www.w3.org/2003/XInclude"/>
Expand All @@ -105,10 +98,10 @@
<desc>A simple jQuery UI Selectable.</desc>
<css><![CDATA[
#selectable .ui-selecting {
background: silver;
background: #ccc;
}
#selectable .ui-selected {
background: gray;
background: #999;
}
]]></css>
<code><![CDATA[$("#selectable").selectable();]]></code>
Expand All @@ -120,9 +113,7 @@
<li>Item 4</li>
<li>Item 5</li>
</ul>
]]></html>

</example>
<category slug="interactions"/>
</entry>

0 comments on commit 9f29381

Please sign in to comment.