michael@0: <?xml version="1.0"?>
michael@0: 
michael@0: <!-- This Source Code Form is subject to the terms of the Mozilla Public
michael@0:    - License, v. 2.0. If a copy of the MPL was not distributed with this
michael@0:    - file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
michael@0: 
michael@0: <bindings id="listboxBindings"
michael@0:           xmlns="http://www.mozilla.org/xbl"
michael@0:           xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
michael@0:           xmlns:xbl="http://www.mozilla.org/xbl">
michael@0: 
michael@0:   <!--
michael@0:     Interface binding that is base for bindings of xul:listbox and
michael@0:     xul:richlistbox elements. This binding assumes that successors bindings
michael@0:     will implement the following properties and methods:
michael@0: 
michael@0:     /** Return the number of items */
michael@0:     readonly itemCount
michael@0: 
michael@0:     /** Return index of given item
michael@0:     * @param aItem - given item element */
michael@0:     getIndexOfItem(aItem)
michael@0: 
michael@0:     /** Return item at given index
michael@0:     * @param aIndex - index of item element */
michael@0:     getItemAtIndex(aIndex)
michael@0: 
michael@0:     /** Return count of item elements */
michael@0:     getRowCount()
michael@0: 
michael@0:     /** Return count of visible item elements */
michael@0:     getNumberOfVisibleRows()
michael@0: 
michael@0:     /** Return index of first visible item element */
michael@0:     getIndexOfFirstVisibleRow()
michael@0: 
michael@0:     /** Return true if item of given index is visible
michael@0:      * @param aIndex - index of item element
michael@0:      *
michael@0:      * @note XXX: this method should be removed after bug 364612 is fixed
michael@0:      */
michael@0:     ensureIndexIsVisible(aIndex)
michael@0: 
michael@0:     /** Return true if item element is visible
michael@0:      * @param aElement - given item element */
michael@0:     ensureElementIsVisible(aElement)
michael@0: 
michael@0:     /** Scroll list control to make visible item of given index
michael@0:      * @param aIndex - index of item element
michael@0:      *
michael@0:      * @note XXX: this method should be removed after bug 364612 is fixed
michael@0:      */
michael@0:     scrollToIndex(aIndex)
michael@0: 
michael@0:     /** Create item element and append it to the end of listbox
michael@0:      * @param aLabel - label of new item element
michael@0:      * @param aValue - value of new item element */
michael@0:     appendItem(aLabel, aValue)
michael@0: 
michael@0:     /** Create item element and insert it to given position
michael@0:      * @param aIndex - insertion position
michael@0:      * @param aLabel - label of new item element
michael@0:      * @param aValue - value of new item element */
michael@0:     insertItemAt(aIndex, aLabel, aValue)
michael@0: 
michael@0:     /** Scroll up/down one page
michael@0:      * @param aDirection - specifies scrolling direction, should be either -1 or 1
michael@0:      * @return the number of elements the selection scrolled
michael@0:      */
michael@0:     scrollOnePage(aDirection)
michael@0: 
michael@0:     /** Fire "select" event */
michael@0:     _fireOnSelect()
michael@0:    -->
michael@0:    <binding id="listbox-base" role="xul:listbox"
michael@0:             extends="chrome://global/content/bindings/general.xml#basecontrol">
michael@0: 
michael@0:     <implementation implements="nsIDOMXULMultiSelectControlElement">
michael@0:       <field name="_lastKeyTime">0</field>
michael@0:       <field name="_incrementalString">""</field>
michael@0: 
michael@0:     <!-- nsIDOMXULSelectControlElement -->
michael@0:       <property name="selectedItem"
michael@0:                 onset="this.selectItem(val);">
michael@0:         <getter>
michael@0:         <![CDATA[
michael@0:           return this.selectedItems.length > 0 ? this.selectedItems[0] : null;
michael@0:         ]]>
michael@0:         </getter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="selectedIndex">
michael@0:         <getter>
michael@0:         <![CDATA[
michael@0:           if (this.selectedItems.length > 0)
michael@0:             return this.getIndexOfItem(this.selectedItems[0]);
michael@0:           return -1;
michael@0:         ]]>
michael@0:         </getter>
michael@0:         <setter>
michael@0:         <![CDATA[
michael@0:           if (val >= 0) {
michael@0:             this.selectItem(this.getItemAtIndex(val));
michael@0:           } else {
michael@0:             this.clearSelection();
michael@0:             this.currentItem = null;
michael@0:           }
michael@0:         ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="value">
michael@0:         <getter>
michael@0:         <![CDATA[
michael@0:           if (this.selectedItems.length > 0)
michael@0:             return this.selectedItem.value;
michael@0:           return null;
michael@0:         ]]>
michael@0:         </getter>
michael@0:         <setter>
michael@0:         <![CDATA[
michael@0:           var kids = this.getElementsByAttribute("value", val);
michael@0:           if (kids && kids.item(0))
michael@0:             this.selectItem(kids[0]);
michael@0:           return val;
michael@0:         ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <method name="removeItemAt">
michael@0:         <parameter name="index"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           var remove = this.getItemAtIndex(index);
michael@0:           if (remove)
michael@0:             this.removeChild(remove);
michael@0:           return remove;
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:     <!-- nsIDOMXULMultiSelectControlElement -->
michael@0:       <property name="selType"
michael@0:                 onget="return this.getAttribute('seltype');"
michael@0:                 onset="this.setAttribute('seltype', val); return val;"/>
michael@0: 
michael@0:       <property name="currentItem" onget="return this._currentItem;">
michael@0:         <setter>
michael@0:           if (this._currentItem == val)
michael@0:             return val;
michael@0: 
michael@0:           if (this._currentItem)
michael@0:             this._currentItem.current = false;
michael@0:           this._currentItem = val;
michael@0: 
michael@0:           if (val)
michael@0:             val.current = true;
michael@0: 
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="currentIndex">
michael@0:         <getter>
michael@0:           return this.currentItem ? this.getIndexOfItem(this.currentItem) : -1;
michael@0:         </getter>
michael@0:         <setter>
michael@0:         <![CDATA[
michael@0:           if (val >= 0)
michael@0:             this.currentItem = this.getItemAtIndex(val);
michael@0:           else
michael@0:             this.currentItem = null;
michael@0:         ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <field name="selectedItems">[]</field>
michael@0: 
michael@0:       <method name="addItemToSelection">
michael@0:         <parameter name="aItem"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (this.selType != "multiple" && this.selectedCount)
michael@0:             return;
michael@0: 
michael@0:           if (aItem.selected)
michael@0:             return;
michael@0: 
michael@0:           this.selectedItems.push(aItem);
michael@0:           aItem.selected = true;
michael@0: 
michael@0:           this._fireOnSelect();
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="removeItemFromSelection">
michael@0:         <parameter name="aItem"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (!aItem.selected)
michael@0:             return;
michael@0: 
michael@0:           for (var i = 0; i < this.selectedItems.length; ++i) {
michael@0:             if (this.selectedItems[i] == aItem) {
michael@0:               this.selectedItems.splice(i, 1);
michael@0:               aItem.selected = false;
michael@0:               break;
michael@0:             }
michael@0:           }
michael@0: 
michael@0:           this._fireOnSelect();
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="toggleItemSelection">
michael@0:         <parameter name="aItem"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (aItem.selected)
michael@0:             this.removeItemFromSelection(aItem);
michael@0:           else
michael@0:             this.addItemToSelection(aItem);
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="selectItem">
michael@0:         <parameter name="aItem"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (!aItem)
michael@0:             return;
michael@0: 
michael@0:           if (this.selectedItems.length == 1 && this.selectedItems[0] == aItem)
michael@0:             return;
michael@0: 
michael@0:           this._selectionStart = null;
michael@0: 
michael@0:           var suppress = this._suppressOnSelect;
michael@0:           this._suppressOnSelect = true;
michael@0: 
michael@0:           this.clearSelection();
michael@0:           this.addItemToSelection(aItem);
michael@0:           this.currentItem = aItem;
michael@0: 
michael@0:           this._suppressOnSelect = suppress;
michael@0:           this._fireOnSelect();
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="selectItemRange">
michael@0:         <parameter name="aStartItem"/>
michael@0:         <parameter name="aEndItem"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (this.selType != "multiple")
michael@0:             return;
michael@0: 
michael@0:           if (!aStartItem)
michael@0:             aStartItem = this._selectionStart ?
michael@0:               this._selectionStart : this.currentItem;
michael@0: 
michael@0:           if (!aStartItem)
michael@0:             aStartItem = aEndItem;
michael@0: 
michael@0:           var suppressSelect = this._suppressOnSelect;
michael@0:           this._suppressOnSelect = true;
michael@0: 
michael@0:           this._selectionStart = aStartItem;
michael@0: 
michael@0:           var currentItem;
michael@0:           var startIndex = this.getIndexOfItem(aStartItem);
michael@0:           var endIndex = this.getIndexOfItem(aEndItem);
michael@0:           if (endIndex < startIndex) {
michael@0:             currentItem = aEndItem;
michael@0:             aEndItem = aStartItem;
michael@0:             aStartItem = currentItem;
michael@0:           } else {
michael@0:             currentItem = aStartItem;
michael@0:           }
michael@0: 
michael@0:           while (currentItem) {
michael@0:             this.addItemToSelection(currentItem);
michael@0:             if (currentItem == aEndItem) {
michael@0:               currentItem = this.getNextItem(currentItem, 1);
michael@0:               break;
michael@0:             }
michael@0:             currentItem = this.getNextItem(currentItem, 1);
michael@0:           }
michael@0: 
michael@0:           // Clear around new selection
michael@0:           // Don't use clearSelection() because it causes a lot of noise
michael@0:           // with respect to selection removed notifications used by the
michael@0:           // accessibility API support.
michael@0:           var userSelecting = this._userSelecting;
michael@0:           this._userSelecting = false; // that's US automatically unselecting
michael@0:           for (; currentItem; currentItem = this.getNextItem(currentItem, 1))
michael@0:             this.removeItemFromSelection(currentItem);
michael@0: 
michael@0:           for (currentItem = this.getItemAtIndex(0); currentItem != aStartItem;
michael@0:                currentItem = this.getNextItem(currentItem, 1))
michael@0:             this.removeItemFromSelection(currentItem);
michael@0:           this._userSelecting = userSelecting;
michael@0: 
michael@0:           this._suppressOnSelect = suppressSelect;
michael@0: 
michael@0:           this._fireOnSelect();
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="selectAll">
michael@0:         <body>
michael@0:           this._selectionStart = null;
michael@0: 
michael@0:           var suppress = this._suppressOnSelect;
michael@0:           this._suppressOnSelect = true;
michael@0: 
michael@0:           var item = this.getItemAtIndex(0);
michael@0:           while (item) {
michael@0:             this.addItemToSelection(item);
michael@0:             item = this.getNextItem(item, 1);
michael@0:           }
michael@0: 
michael@0:           this._suppressOnSelect = suppress;
michael@0:           this._fireOnSelect();
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="invertSelection">
michael@0:         <body>
michael@0:           this._selectionStart = null;
michael@0: 
michael@0:           var suppress = this._suppressOnSelect;
michael@0:           this._suppressOnSelect = true;
michael@0: 
michael@0:           var item = this.getItemAtIndex(0);
michael@0:           while (item) {
michael@0:             if (item.selected)
michael@0:               this.removeItemFromSelection(item);
michael@0:             else
michael@0:               this.addItemToSelection(item);
michael@0:             item = this.getNextItem(item, 1);
michael@0:           }
michael@0: 
michael@0:           this._suppressOnSelect = suppress;
michael@0:           this._fireOnSelect();
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="clearSelection">
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (this.selectedItems) {
michael@0:             for (var i = this.selectedItems.length - 1; i >= 0; --i)
michael@0:               this.selectedItems[i].selected = false;
michael@0: 
michael@0:             this.selectedItems.length = 0;
michael@0:           }
michael@0: 
michael@0:           this._selectionStart = null;
michael@0:           this._fireOnSelect();
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <property name="selectedCount" readonly="true"
michael@0:                 onget="return this.selectedItems.length;"/>
michael@0: 
michael@0:       <method name="getSelectedItem">
michael@0:         <parameter name="aIndex"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           return aIndex < this.selectedItems.length ?
michael@0:             this.selectedItems[aIndex] : null;
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:     <!-- Other public members -->
michael@0:       <property name="disableKeyNavigation"
michael@0:                 onget="return this.hasAttribute('disableKeyNavigation');">
michael@0:         <setter>
michael@0:           if (val)
michael@0:             this.setAttribute("disableKeyNavigation", "true");
michael@0:           else
michael@0:             this.removeAttribute("disableKeyNavigation");
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="suppressOnSelect"
michael@0:                 onget="return this.getAttribute('suppressonselect') == 'true';"
michael@0:                 onset="this.setAttribute('suppressonselect', val);"/>
michael@0: 
michael@0:       <property name="_selectDelay"
michael@0:                 onset="this.setAttribute('_selectDelay', val);"
michael@0:                 onget="return this.getAttribute('_selectDelay') || 50;"/>
michael@0: 
michael@0:       <method name="timedSelect">
michael@0:         <parameter name="aItem"/>
michael@0:         <parameter name="aTimeout"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           var suppress = this._suppressOnSelect;
michael@0:           if (aTimeout != -1)
michael@0:             this._suppressOnSelect = true;
michael@0: 
michael@0:           this.selectItem(aItem);
michael@0: 
michael@0:           this._suppressOnSelect = suppress;
michael@0: 
michael@0:           if (aTimeout != -1) {
michael@0:             if (this._selectTimeout)
michael@0:               window.clearTimeout(this._selectTimeout);
michael@0:             this._selectTimeout =
michael@0:               window.setTimeout(this._selectTimeoutHandler, aTimeout, this);
michael@0:           }
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="moveByOffset">
michael@0:         <parameter name="aOffset"/>
michael@0:         <parameter name="aIsSelecting"/>
michael@0:         <parameter name="aIsSelectingRange"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if ((aIsSelectingRange || !aIsSelecting) &&
michael@0:               this.selType != "multiple")
michael@0:             return;
michael@0: 
michael@0:           var newIndex = this.currentIndex + aOffset;
michael@0:           if (newIndex < 0)
michael@0:             newIndex = 0;
michael@0: 
michael@0:           var numItems = this.getRowCount();
michael@0:           if (newIndex > numItems - 1)
michael@0:             newIndex = numItems - 1;
michael@0: 
michael@0:           var newItem = this.getItemAtIndex(newIndex);
michael@0:           // make sure that the item is actually visible/selectable
michael@0:           if (this._userSelecting && newItem && !this._canUserSelect(newItem))
michael@0:             newItem =
michael@0:               aOffset > 0 ? this.getNextItem(newItem, 1) || this.getPreviousItem(newItem, 1) :
michael@0:                             this.getPreviousItem(newItem, 1) || this.getNextItem(newItem, 1);
michael@0:           if (newItem) {
michael@0:             this.ensureIndexIsVisible(this.getIndexOfItem(newItem));
michael@0:             if (aIsSelectingRange)
michael@0:               this.selectItemRange(null, newItem);
michael@0:             else if (aIsSelecting)
michael@0:               this.selectItem(newItem);
michael@0: 
michael@0:             this.currentItem = newItem;
michael@0:           }
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:     <!-- Private -->
michael@0:       <method name="getNextItem">
michael@0:         <parameter name="aStartItem"/>
michael@0:         <parameter name="aDelta"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           while (aStartItem) {
michael@0:             aStartItem = aStartItem.nextSibling;
michael@0:             if (aStartItem && aStartItem instanceof
michael@0:                 Components.interfaces.nsIDOMXULSelectControlItemElement &&
michael@0:                 (!this._userSelecting || this._canUserSelect(aStartItem))) {
michael@0:               --aDelta;
michael@0:               if (aDelta == 0)
michael@0:                 return aStartItem;
michael@0:             }
michael@0:           }
michael@0:           return null;
michael@0:         ]]></body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="getPreviousItem">
michael@0:         <parameter name="aStartItem"/>
michael@0:         <parameter name="aDelta"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           while (aStartItem) {
michael@0:             aStartItem = aStartItem.previousSibling;
michael@0:             if (aStartItem && aStartItem instanceof
michael@0:                 Components.interfaces.nsIDOMXULSelectControlItemElement &&
michael@0:                 (!this._userSelecting || this._canUserSelect(aStartItem))) {
michael@0:               --aDelta;
michael@0:               if (aDelta == 0)
michael@0:                 return aStartItem;
michael@0:             }
michael@0:           }
michael@0:           return null;
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="_moveByOffsetFromUserEvent">
michael@0:         <parameter name="aOffset"/>
michael@0:         <parameter name="aEvent"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (!aEvent.defaultPrevented) {
michael@0:             this._userSelecting = true;
michael@0:             this._mayReverse = true;
michael@0:             this.moveByOffset(aOffset, !aEvent.ctrlKey, aEvent.shiftKey);
michael@0:             this._userSelecting = false;
michael@0:             this._mayReverse = false;
michael@0:             aEvent.preventDefault();
michael@0:           }
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="_canUserSelect">
michael@0:         <parameter name="aItem"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           var style = document.defaultView.getComputedStyle(aItem, "");
michael@0:           return style.display != "none" && style.visibility == "visible";
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="_selectTimeoutHandler">
michael@0:         <parameter name="aMe"/>
michael@0:         <body>
michael@0:           aMe._fireOnSelect();
michael@0:           aMe._selectTimeout = null;
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <field name="_suppressOnSelect">false</field>
michael@0:       <field name="_userSelecting">false</field>
michael@0:       <field name="_mayReverse">false</field>
michael@0:       <field name="_selectTimeout">null</field>
michael@0:       <field name="_currentItem">null</field>
michael@0:       <field name="_selectionStart">null</field>
michael@0:     </implementation>
michael@0: 
michael@0:     <handlers>
michael@0:       <handler event="keypress" keycode="VK_UP" modifiers="control shift any"
michael@0:                action="this._moveByOffsetFromUserEvent(-1, event);"
michael@0:                group="system"/>
michael@0:       <handler event="keypress" keycode="VK_DOWN" modifiers="control shift any"
michael@0:                action="this._moveByOffsetFromUserEvent(1, event);"
michael@0:                group="system"/>
michael@0:       <handler event="keypress" keycode="VK_HOME" modifiers="control shift any"
michael@0:                group="system">
michael@0:         <![CDATA[
michael@0:           this._mayReverse = true;
michael@0:           this._moveByOffsetFromUserEvent(-this.currentIndex, event);
michael@0:           this._mayReverse = false;
michael@0:         ]]>
michael@0:       </handler>
michael@0:       <handler event="keypress" keycode="VK_END" modifiers="control shift any"
michael@0:                group="system">
michael@0:         <![CDATA[
michael@0:           this._mayReverse = true;
michael@0:           this._moveByOffsetFromUserEvent(this.getRowCount() - this.currentIndex - 1, event);
michael@0:           this._mayReverse = false;
michael@0:         ]]>
michael@0:       </handler>
michael@0:       <handler event="keypress" keycode="VK_PAGE_UP" modifiers="control shift any"
michael@0:                group="system">
michael@0:         <![CDATA[
michael@0:           this._mayReverse = true;
michael@0:           this._moveByOffsetFromUserEvent(this.scrollOnePage(-1), event);
michael@0:           this._mayReverse = false;
michael@0:         ]]>
michael@0:       </handler>
michael@0:       <handler event="keypress" keycode="VK_PAGE_DOWN" modifiers="control shift any"
michael@0:                group="system">
michael@0:         <![CDATA[
michael@0:           this._mayReverse = true;
michael@0:           this._moveByOffsetFromUserEvent(this.scrollOnePage(1), event);
michael@0:           this._mayReverse = false;
michael@0:         ]]>
michael@0:       </handler>
michael@0:       <handler event="keypress" key=" " modifiers="control" phase="target">
michael@0:       <![CDATA[
michael@0:         if (this.currentItem && this.selType == "multiple")
michael@0:           this.toggleItemSelection(this.currentItem);
michael@0:       ]]>
michael@0:       </handler>
michael@0:       <handler event="focus">
michael@0:       <![CDATA[
michael@0:         if (this.getRowCount() > 0) {
michael@0:           if (this.currentIndex == -1) {
michael@0:             this.currentIndex = this.getIndexOfFirstVisibleRow();
michael@0:           }
michael@0:           else {
michael@0:             this.currentItem._fireEvent("DOMMenuItemActive");
michael@0:           }
michael@0:         }
michael@0:         this._lastKeyTime = 0;
michael@0:       ]]>
michael@0:       </handler>
michael@0:       <handler event="keypress" phase="target">
michael@0:       <![CDATA[
michael@0:         if (this.disableKeyNavigation || !event.charCode ||
michael@0:             event.altKey || event.ctrlKey || event.metaKey)
michael@0:           return;
michael@0: 
michael@0:         if (event.timeStamp - this._lastKeyTime > 1000)
michael@0:           this._incrementalString = "";
michael@0: 
michael@0:         var key = String.fromCharCode(event.charCode).toLowerCase();
michael@0:         this._incrementalString += key;
michael@0:         this._lastKeyTime = event.timeStamp;
michael@0: 
michael@0:         // If all letters in the incremental string are the same, just
michael@0:         // try to match the first one
michael@0:         var incrementalString = /^(.)\1+$/.test(this._incrementalString) ?
michael@0:                                 RegExp.$1 : this._incrementalString;
michael@0:         var length = incrementalString.length;
michael@0: 
michael@0:         var rowCount = this.getRowCount();
michael@0:         var l = this.selectedItems.length;
michael@0:         var start = l > 0 ? this.getIndexOfItem(this.selectedItems[l - 1]) : -1;
michael@0:         // start from the first element if none was selected or from the one
michael@0:         // following the selected one if it's a new or a repeated-letter search
michael@0:         if (start == -1 || length == 1)
michael@0:           start++;
michael@0: 
michael@0:         for (var i = 0; i < rowCount; i++) {
michael@0:           var k = (start + i) % rowCount;
michael@0:           var listitem = this.getItemAtIndex(k);
michael@0:           if (!this._canUserSelect(listitem))
michael@0:             continue;
michael@0:           // allow richlistitems to specify the string being searched for
michael@0:           var searchText = "searchLabel" in listitem ? listitem.searchLabel :
michael@0:                            listitem.getAttribute("label"); // (see also bug 250123)
michael@0:           searchText = searchText.substring(0, length).toLowerCase();
michael@0:           if (searchText == incrementalString) {
michael@0:             this.ensureIndexIsVisible(k);
michael@0:             this.timedSelect(listitem, this._selectDelay);
michael@0:             break;
michael@0:           }
michael@0:         }
michael@0:       ]]>
michael@0:       </handler>
michael@0:     </handlers>
michael@0:   </binding>
michael@0: 
michael@0: 
michael@0:   <!-- Binding for xul:listbox element.
michael@0:   -->
michael@0:   <binding id="listbox"
michael@0:            extends="#listbox-base">
michael@0: 
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/skin/listbox.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <content>
michael@0:       <children includes="listcols">
michael@0:         <xul:listcols>
michael@0:           <xul:listcol flex="1"/>
michael@0:         </xul:listcols>
michael@0:       </children>
michael@0:       <xul:listrows>
michael@0:         <children includes="listhead"/>
michael@0:         <xul:listboxbody xbl:inherits="rows,size,minheight">
michael@0:           <children includes="listitem"/>
michael@0:         </xul:listboxbody> 
michael@0:       </xul:listrows>
michael@0:     </content>
michael@0: 
michael@0:     <implementation>
michael@0: 
michael@0:       <!-- ///////////////// public listbox members ///////////////// -->
michael@0: 
michael@0:       <property name="listBoxObject"
michael@0:                 onget="return this.boxObject.QueryInterface(Components.interfaces.nsIListBoxObject);"
michael@0:                 readonly="true"/>
michael@0: 
michael@0:       <!-- ///////////////// private listbox members ///////////////// -->
michael@0: 
michael@0:       <method name="_fireOnSelect">
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           if (!this._suppressOnSelect && !this.suppressOnSelect) {
michael@0:             var event = document.createEvent("Events");
michael@0:             event.initEvent("select", true, true);
michael@0:             this.dispatchEvent(event);
michael@0:           }
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <constructor>
michael@0:       <![CDATA[
michael@0:         var count = this.itemCount;
michael@0:         for (var index = 0; index < count; index++) {
michael@0:           var item = this.getItemAtIndex(index);
michael@0:           if (item.getAttribute("selected") == "true")
michael@0:             this.selectedItems.push(item);
michael@0:         }
michael@0:       ]]>
michael@0:       </constructor>
michael@0: 
michael@0:       <!-- ///////////////// nsIDOMXULSelectControlElement ///////////////// -->
michael@0: 
michael@0:       <method name="appendItem">
michael@0:         <parameter name="aLabel"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           const XULNS =
michael@0:             "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
michael@0: 
michael@0:           var item = this.ownerDocument.createElementNS(XULNS, "listitem");
michael@0:           item.setAttribute("label", aLabel);
michael@0:           item.setAttribute("value", aValue);
michael@0:           this.appendChild(item);
michael@0:           return item;
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="insertItemAt">
michael@0:         <parameter name="aIndex"/>
michael@0:         <parameter name="aLabel"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           const XULNS =
michael@0:             "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul";
michael@0: 
michael@0:           var item = this.ownerDocument.createElementNS(XULNS, "listitem");
michael@0:           item.setAttribute("label", aLabel);
michael@0:           item.setAttribute("value", aValue);
michael@0:           var before = this.getItemAtIndex(aIndex);
michael@0:           if (before)
michael@0:             this.insertBefore(item, before);
michael@0:           else
michael@0:             this.appendChild(item);
michael@0:           return item;
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <property name="itemCount" readonly="true"
michael@0:                 onget="return this.listBoxObject.getRowCount()"/>
michael@0: 
michael@0:       <!-- ///////////////// nsIListBoxObject ///////////////// -->
michael@0:       <method name="getIndexOfItem">
michael@0:         <parameter name="item"/>
michael@0:         <body>
michael@0:           return this.listBoxObject.getIndexOfItem(item);
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="getItemAtIndex">
michael@0:         <parameter name="index"/>
michael@0:         <body>
michael@0:           return this.listBoxObject.getItemAtIndex(index);
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="ensureIndexIsVisible">
michael@0:         <parameter name="index"/>
michael@0:         <body>
michael@0:           return this.listBoxObject.ensureIndexIsVisible(index);
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="ensureElementIsVisible">
michael@0:         <parameter name="element"/>
michael@0:         <body>
michael@0:           return this.ensureIndexIsVisible(this.listBoxObject.getIndexOfItem(element));
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="scrollToIndex">
michael@0:         <parameter name="index"/>
michael@0:         <body>
michael@0:           return this.listBoxObject.scrollToIndex(index);
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="getNumberOfVisibleRows">
michael@0:         <body>
michael@0:           return this.listBoxObject.getNumberOfVisibleRows();
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="getIndexOfFirstVisibleRow">
michael@0:         <body>
michael@0:           return this.listBoxObject.getIndexOfFirstVisibleRow();
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="getRowCount">
michael@0:         <body>
michael@0:           return this.listBoxObject.getRowCount();
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="scrollOnePage">
michael@0:         <parameter name="direction"/>  <!-- Must be -1 or 1 -->
michael@0:         <body>      
michael@0:           <![CDATA[
michael@0:             var pageOffset = this.getNumberOfVisibleRows() * direction;
michael@0:             // skip over invisible elements - the user won't care about them
michael@0:             for (var i = 0; i != pageOffset; i += direction) {
michael@0:               var item = this.getItemAtIndex(this.currentIndex + i);
michael@0:               if (item && !this._canUserSelect(item))
michael@0:                 pageOffset += direction;
michael@0:             }
michael@0:             var newTop = this.getIndexOfFirstVisibleRow() + pageOffset;
michael@0:             if (direction == 1) {
michael@0:               var maxTop = this.getRowCount() - this.getNumberOfVisibleRows();
michael@0:               for (i = this.getRowCount(); i >= 0 && i > maxTop; i--) {
michael@0:                 item = this.getItemAtIndex(i);
michael@0:                 if (item && !this._canUserSelect(item))
michael@0:                   maxTop--;
michael@0:               }
michael@0:               if (newTop >= maxTop)
michael@0:                 newTop = maxTop;
michael@0:             }
michael@0:             if (newTop < 0)
michael@0:               newTop = 0;
michael@0:             this.scrollToIndex(newTop);
michael@0:             return pageOffset;          
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:     </implementation>
michael@0:     
michael@0:     <handlers>
michael@0:       <handler event="keypress" key=" " phase="target">
michael@0:         <![CDATA[
michael@0:           if (this.currentItem) {
michael@0:             if (this.currentItem.getAttribute("type") != "checkbox")
michael@0:               this.addItemToSelection(this.currentItem);
michael@0:             else if (!this.currentItem.disabled) {
michael@0:               this.currentItem.checked = !this.currentItem.checked;
michael@0:               this.currentItem.doCommand();
michael@0:             }
michael@0:           }
michael@0:         ]]>
michael@0:       </handler>
michael@0: 
michael@0:       <handler event="MozSwipeGesture">
michael@0:         <![CDATA[
michael@0:           // Figure out which index to show
michael@0:           let targetIndex = 0;
michael@0: 
michael@0:           // Only handle swipe gestures up and down
michael@0:           switch (event.direction) {
michael@0:             case event.DIRECTION_DOWN:
michael@0:               targetIndex = this.itemCount - 1;
michael@0:               // Fall through for actual action
michael@0:             case event.DIRECTION_UP:
michael@0:               this.ensureIndexIsVisible(targetIndex);
michael@0:               break;
michael@0:           }
michael@0:         ]]>
michael@0:       </handler>
michael@0:     </handlers>    
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listrows">
michael@0: 
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/skin/listbox.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <handlers>
michael@0:       <handler event="DOMMouseScroll" phase="capturing">
michael@0:       <![CDATA[
michael@0:         if (event.axis == event.HORIZONTAL_AXIS)
michael@0:           return;
michael@0: 
michael@0:         var listBox = this.parentNode.listBoxObject;
michael@0:         var rows = event.detail;
michael@0:         if (rows == UIEvent.SCROLL_PAGE_UP)
michael@0:           rows = -listBox.getNumberOfVisibleRows();
michael@0:         else if (rows == UIEvent.SCROLL_PAGE_DOWN)
michael@0:           rows = listBox.getNumberOfVisibleRows();
michael@0: 
michael@0:         listBox.scrollByLines(rows);
michael@0:         event.preventDefault();
michael@0:       ]]>
michael@0:       </handler>
michael@0: 
michael@0:       <handler event="MozMousePixelScroll" phase="capturing">
michael@0:       <![CDATA[
michael@0:         if (event.axis == event.HORIZONTAL_AXIS)
michael@0:           return;
michael@0: 
michael@0:         // shouldn't be scrolled by pixel scrolling events before a line/page
michael@0:         // scrolling event.
michael@0:         event.preventDefault();
michael@0:       ]]>
michael@0:       </handler>
michael@0:     </handlers>
michael@0:   </binding>
michael@0:   
michael@0:   <binding id="listitem" role="xul:listitem"
michael@0:            extends="chrome://global/content/bindings/general.xml#basetext">
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/skin/listbox.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:listcell xbl:inherits="label,crop,disabled,flexlabel"/>
michael@0:       </children>
michael@0:     </content>
michael@0: 
michael@0:     <implementation implements="nsIDOMXULSelectControlItemElement">
michael@0:       <property name="current" onget="return this.getAttribute('current') == 'true';">
michael@0:         <setter><![CDATA[
michael@0:           if (val)
michael@0:             this.setAttribute("current", "true");
michael@0:           else
michael@0:             this.removeAttribute("current");
michael@0: 
michael@0:           this._fireEvent(val ? "DOMMenuItemActive" : "DOMMenuItemInactive");
michael@0: 
michael@0:           return val;
michael@0:         ]]></setter>
michael@0:       </property>
michael@0: 
michael@0:       <!-- ///////////////// nsIDOMXULSelectControlItemElement ///////////////// -->
michael@0:                 
michael@0:       <property name="value" onget="return this.getAttribute('value');"
michael@0:                              onset="this.setAttribute('value', val); return val;"/>
michael@0:       <property name="label" onget="return this.getAttribute('label');"
michael@0:                              onset="this.setAttribute('label', val); return val;"/>
michael@0:       
michael@0:       <property name="selected" onget="return this.getAttribute('selected') == 'true';">
michael@0:         <setter><![CDATA[
michael@0:           if (val)
michael@0:             this.setAttribute("selected", "true");
michael@0:           else
michael@0:             this.removeAttribute("selected");
michael@0: 
michael@0:           return val;
michael@0:         ]]></setter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="control">
michael@0:         <getter><![CDATA[
michael@0:           var parent = this.parentNode;
michael@0:           while (parent) {
michael@0:             if (parent instanceof Components.interfaces.nsIDOMXULSelectControlElement)
michael@0:               return parent;
michael@0:             parent = parent.parentNode;
michael@0:           }
michael@0:           return null;
michael@0:         ]]></getter>
michael@0:       </property>
michael@0: 
michael@0:       <method name="_fireEvent">
michael@0:         <parameter name="name"/>
michael@0:         <body>
michael@0:         <![CDATA[
michael@0:           var event = document.createEvent("Events");
michael@0:           event.initEvent(name, true, true);
michael@0:           this.dispatchEvent(event);
michael@0:         ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:     </implementation>
michael@0:     <handlers>
michael@0:       <!-- If there is no modifier key, we select on mousedown, not
michael@0:            click, so that drags work correctly. -->
michael@0:       <handler event="mousedown">
michael@0:       <![CDATA[
michael@0:         var control = this.control;
michael@0:         if (!control || control.disabled)
michael@0:           return;
michael@0:         if ((!event.ctrlKey
michael@0: #ifdef XP_MACOSX
michael@0:              || event.button == 2
michael@0: #endif
michael@0:             ) && !event.shiftKey && !event.metaKey) {
michael@0:           if (!this.selected) {
michael@0:             control.selectItem(this);
michael@0:           }
michael@0:           control.currentItem = this;
michael@0:         }
michael@0:       ]]>
michael@0:       </handler>
michael@0: 
michael@0:       <!-- On a click (up+down on the same item), deselect everything
michael@0:            except this item. -->
michael@0:       <handler event="click" button="0">
michael@0:       <![CDATA[
michael@0:         var control = this.control;
michael@0:         if (!control || control.disabled)
michael@0:           return;
michael@0:         control._userSelecting = true;
michael@0:         if (control.selType != "multiple") {
michael@0:           control.selectItem(this);
michael@0:         }
michael@0:         else if (event.ctrlKey || event.metaKey) {
michael@0:           control.toggleItemSelection(this);
michael@0:           control.currentItem = this;
michael@0:         }
michael@0:         else if (event.shiftKey) {
michael@0:           control.selectItemRange(null, this);
michael@0:           control.currentItem = this;
michael@0:         }
michael@0:         else {
michael@0:           /* We want to deselect all the selected items except what was
michael@0:             clicked, UNLESS it was a right-click.  We have to do this
michael@0:             in click rather than mousedown so that you can drag a
michael@0:             selected group of items */
michael@0: 
michael@0:           // use selectItemRange instead of selectItem, because this
michael@0:           // doesn't de- and reselect this item if it is selected
michael@0:           control.selectItemRange(this, this);
michael@0:         }
michael@0:         control._userSelecting = false;
michael@0:       ]]>
michael@0:       </handler>
michael@0:     </handlers>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listitem-iconic"
michael@0:            extends="chrome://global/content/bindings/listbox.xml#listitem">
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:listcell class="listcell-iconic" xbl:inherits="label,image,crop,disabled,flexlabel"/>
michael@0:       </children>
michael@0:     </content>
michael@0:   </binding>
michael@0:   
michael@0:   <binding id="listitem-checkbox"
michael@0:            extends="chrome://global/content/bindings/listbox.xml#listitem">
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:listcell type="checkbox" xbl:inherits="label,crop,checked,disabled,flexlabel"/>
michael@0:       </children>
michael@0:     </content>
michael@0: 
michael@0:     <implementation>
michael@0:       <property name="checked"
michael@0:                 onget="return this.getAttribute('checked') == 'true';">
michael@0:         <setter><![CDATA[
michael@0:           if (val)
michael@0:             this.setAttribute('checked', 'true');
michael@0:           else
michael@0:             this.removeAttribute('checked');
michael@0:           var event = document.createEvent('Events');
michael@0:           event.initEvent('CheckboxStateChange', true, true);
michael@0:           this.dispatchEvent(event);
michael@0:           return val;
michael@0:         ]]></setter>
michael@0:       </property>
michael@0:     </implementation>
michael@0: 
michael@0:     <handlers> 
michael@0:       <handler event="mousedown" button="0">
michael@0:       <![CDATA[
michael@0:         if (!this.disabled && !this.control.disabled) {
michael@0:           this.checked = !this.checked;
michael@0:           this.doCommand();
michael@0:         }
michael@0:       ]]>
michael@0:       </handler>
michael@0:     </handlers>
michael@0:   </binding>
michael@0:   
michael@0:   <binding id="listitem-checkbox-iconic"
michael@0:            extends="chrome://global/content/bindings/listbox.xml#listitem-checkbox">
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:listcell type="checkbox" class="listcell-iconic" xbl:inherits="label,image,crop,checked,disabled,flexlabel"/>
michael@0:       </children>
michael@0:     </content>
michael@0:   </binding>
michael@0:   
michael@0:   <binding id="listcell" role="xul:listcell"
michael@0:            extends="chrome://global/content/bindings/general.xml#basecontrol">
michael@0: 
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/skin/listbox.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:label class="listcell-label" xbl:inherits="value=label,flex=flexlabel,crop,disabled" flex="1" crop="right"/>
michael@0:       </children>
michael@0:     </content>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listcell-iconic"
michael@0:            extends="chrome://global/content/bindings/listbox.xml#listcell">
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:image class="listcell-icon" xbl:inherits="src=image"/>
michael@0:         <xul:label class="listcell-label" xbl:inherits="value=label,flex=flexlabel,crop,disabled" flex="1" crop="right"/>
michael@0:       </children>
michael@0:     </content>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listcell-checkbox"
michael@0:            extends="chrome://global/content/bindings/listbox.xml#listcell">
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:image class="listcell-check" xbl:inherits="checked,disabled"/>
michael@0:         <xul:label class="listcell-label" xbl:inherits="value=label,flex=flexlabel,crop,disabled" flex="1" crop="right"/>
michael@0:       </children>
michael@0:     </content>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listcell-checkbox-iconic"
michael@0:            extends="chrome://global/content/bindings/listbox.xml#listcell-checkbox">
michael@0:     <content>
michael@0:       <children>
michael@0:         <xul:image class="listcell-check" xbl:inherits="checked,disabled"/>
michael@0:         <xul:image class="listcell-icon" xbl:inherits="src=image"/>
michael@0:         <xul:label class="listcell-label" xbl:inherits="value=label,flex=flexlabel,crop,disabled" flex="1" crop="right"/>
michael@0:       </children>
michael@0:     </content>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listhead" role="xul:listhead">
michael@0: 
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/skin/listbox.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <content>
michael@0:       <xul:listheaditem>
michael@0:         <children includes="listheader"/>
michael@0:       </xul:listheaditem>
michael@0:     </content>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="listheader" display="xul:button" role="xul:listheader">
michael@0: 
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/skin/listbox.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <content>
michael@0:       <xul:image class="listheader-icon"/>
michael@0:       <xul:label class="listheader-label" xbl:inherits="value=label,crop" flex="1" crop="right"/>
michael@0:       <xul:image class="listheader-sortdirection" xbl:inherits="sortDirection"/>
michael@0:     </content>
michael@0:   </binding>
michael@0: 
michael@0: </bindings>
michael@0: