home *** CD-ROM | disk | FTP | other *** search
/ Chip 2002 January / 01_02.iso / software / netscape62win / browser.xpi / bin / chrome / toolkit.jar / content / global / bindings / radio.xml < prev    next >
Encoding:
Extensible Markup Language  |  2001-08-15  |  7.0 KB  |  203 lines
  1. <?xml version="1.0"?>
  2.  
  3. <bindings id="radioBindings"
  4.    xmlns="http://www.mozilla.org/xbl"
  5.    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
  6.  
  7.   <binding id="radiogroup">
  8.     <resources>
  9.       <stylesheet src="chrome://global/skin/radio.css"/>
  10.     </resources>
  11.  
  12.     <implementation>
  13.       <property name="value" onset="this.setAttribute('value',val); return val;"
  14.                             onget="return this.getAttribute('value');"/>
  15.       <property name="disabled">
  16.         <getter>
  17.         <![CDATA[
  18.             var v = this.getAttribute('disabled');
  19.             return v=='true';
  20.         ]]>
  21.         </getter>
  22.         <setter>
  23.         <![CDATA[
  24.           this.setAttribute('disabled', 'true');
  25.           var groupElements = this.getElementsByAttribute( "group", this.id );
  26.           for( var i = 0; i < groupElements.length; i++ ) {
  27.             if (val)
  28.               groupElements[i].setAttribute("disabled","true");
  29.             else
  30.               groupElements[i].removeAttribute("disabled");
  31.           }
  32.           if (!val)
  33.             this.removeAttribute('disabled');
  34.           return val;
  35.         ]]>
  36.         </setter>
  37.       </property>
  38.       
  39.       <property name="selectedItem">
  40.         <getter>
  41.         <![CDATA[
  42.           this.disabled = this.disabled; // this strange line is to fire the setter for the disabled property
  43.           var groupElements = this.getElementsByAttribute( "group", this.id );
  44.           for( var i = 0; i < groupElements.length; i++ ) {
  45.             if( groupElements[i].checked || 
  46.                 groupElements[i].getAttribute( "checked" ) == "true" ) {
  47.               return groupElements[i];
  48.             }
  49.           }
  50.           return null;
  51.         ]]>
  52.         </getter>
  53.         <setter>
  54.         <![CDATA[
  55.           if (this.getAttribute("focused") == "true") 
  56.             val.setAttribute("focused", "true");
  57.           this.value = val.value;
  58.  
  59.           val.checked = true;
  60.           
  61.           // uncheck all other group nodes
  62.           var groupElements = this.getElementsByAttribute( "group", this.id );
  63.           for( var i = 0; i < groupElements.length; i++ ) {
  64.             if( groupElements[i] != val ) {
  65.               groupElements[i].checked = false;
  66.               groupElements[i].removeAttribute("focused");
  67.             }
  68.           }
  69.           return val;
  70.         ]]>
  71.         </setter>        
  72.       </property>
  73.       
  74.       <property name="focusedItem">
  75.         <getter>
  76.         <![CDATA[
  77.           var groupElements = this.getElementsByAttribute( "group", this.id );
  78.           for( var i = 0; i < groupElements.length; i++ ) {
  79.             if( groupElements[i].getAttribute( "focused" ) == "true" ) {
  80.               return groupElements[i];
  81.             }
  82.           }
  83.           return null;
  84.         ]]>
  85.         </getter>
  86.         <setter>
  87.         <![CDATA[
  88.           if (val) val.setAttribute("focused", "true");
  89.           
  90.           // unfocus all other group nodes
  91.           var groupElements = this.getElementsByAttribute( "group", this.id );
  92.           for( var i = 0; i < groupElements.length; i++ ) {
  93.             if( groupElements[i] != val ) {
  94.                 groupElements[i].removeAttribute("focused");
  95.             }
  96.           }
  97.           return val;
  98.         ]]>
  99.         </setter>
  100.       </property>
  101.       
  102.       <method name="checkAdjacentElement">
  103.         <parameter name="aNextFlag"/>
  104.         <body>
  105.         <![CDATA[
  106.           var currentElement = this.focusedItem;
  107.           var groupElements = this.getElementsByAttribute( "group", this.id );
  108.           var index;
  109.           for (var i = 0; i < groupElements.length; i++ ) {
  110.             if (groupElements[i] != currentElement) 
  111.               continue;
  112.             if (aNextFlag) {
  113.               index = (i + 1) % groupElements.length;
  114.               this.selectedItem = groupElements[index];
  115.               break;
  116.             }
  117.             else {              
  118.               index = i > 0 ? i - 1 : groupElements.length - 1;
  119.               this.selectedItem = groupElements[index];
  120.               break;
  121.             }
  122.           }
  123.           this.selectedItem.doCommand();
  124.         ]]>
  125.         </body>
  126.       </method>
  127.     </implementation>
  128.     
  129.     <handlers>
  130.       <handler event="click" button="0">
  131.         <![CDATA[
  132.             
  133.               if (event.target.localName == "radio" && 
  134.                   event.target.getAttribute("group") == this.id && // nested radiogroups?
  135.                   !event.target.disabled) 
  136.                 this.selectedItem = event.target;
  137.  
  138.          ]]>
  139.       </handler>
  140.  
  141.       <handler event="mousedown" button="0">
  142.         <![CDATA[
  143.             if (event.target.localName == "radio" && !event.target.disabled)
  144.               this.focusedItem = event.target;
  145.  
  146.          ]]>
  147.       </handler>
  148.      
  149.       <!-- keyboard navigation -->
  150.       <!-- Here's how keyboard navigation works in radio groups on Windows:
  151.            The group takes 'focus'
  152.            The user is then free to navigate around inside the group
  153.            using the arrow keys. Accessing previous or following radio buttons
  154.            is done solely through the arrow keys and not the tab button. Tab
  155.            takes you to the next widget in the tab order -->
  156.       <handler event="keypress" key=" ">
  157.          this.selectedItem = this.focusedItem;
  158.       </handler>
  159.       <handler event="keypress" keycode="VK_UP">
  160.         this.checkAdjacentElement(false);
  161.       </handler>
  162.       <handler event="keypress" keycode="VK_LEFT">
  163.         this.checkAdjacentElement(false);
  164.       </handler>
  165.       <handler event="keypress" keycode="VK_DOWN">
  166.         this.checkAdjacentElement(true);
  167.       </handler>
  168.       <handler event="keypress" keycode="VK_RIGHT">
  169.         this.checkAdjacentElement(true);
  170.       </handler>
  171.  
  172.       <!-- set a focused attribute on the selected item when the group
  173.            receives focus so that we can style it as if it were focused even though
  174.            it is not (Windows platform behaviour is for the group to receive focus,
  175.            not the item -->
  176.       <handler event="focus">
  177.         if (event.target == this) {
  178.           this.setAttribute("focused", "true");
  179.           if (this.focusedItem == null) this.focusedItem = this.selectedItem;
  180.         }
  181.       </handler>
  182.       <handler event="blur">
  183.         this.removeAttribute("focused");
  184.         this.focusedItem = null;
  185.       </handler>
  186.     </handlers>
  187.   </binding>
  188.  
  189.   <binding id="radio" extends="chrome://global/content/bindings/checkbox.xml#checkbox-baseline">
  190.     <resources>
  191.       <stylesheet src="chrome://global/skin/radio.css"/>
  192.     </resources>
  193.  
  194.     <implementation>
  195.       <property name="value" onset="this.setAttribute('value',val); return val;"
  196.                             onget="return this.getAttribute('value');"/>
  197.       <property name="group" onset="this.setAttribute('group',val); return val;"
  198.                             onget="return this.getAttribute('group');"/>
  199.     </implementation>
  200.   </binding>
  201.   
  202.  
  203. </bindings>