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: <!DOCTYPE bindings [
michael@0:   <!ENTITY % datetimepickerDTD SYSTEM "chrome://global/locale/datetimepicker.dtd">
michael@0:   %datetimepickerDTD;
michael@0: ]>
michael@0: 
michael@0: <bindings id="timepickerBindings"
michael@0:    xmlns="http://www.mozilla.org/xbl"
michael@0:    xmlns:html="http://www.w3.org/1999/xhtml"
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:   <binding id="datetimepicker-base"
michael@0:            extends="chrome://global/content/bindings/general.xml#basecontrol">
michael@0: 
michael@0:     <resources>
michael@0:       <stylesheet src="chrome://global/content/textbox.css"/>
michael@0:       <stylesheet src="chrome://global/skin/textbox.css"/>
michael@0:       <stylesheet src="chrome://global/skin/dropmarker.css"/>
michael@0:       <stylesheet src="chrome://global/skin/datetimepicker.css"/>
michael@0:     </resources>
michael@0: 
michael@0:     <content align="center">
michael@0:       <xul:hbox class="datetimepicker-input-box" align="center"
michael@0:                 xbl:inherits="context">
michael@0:         <xul:hbox class="textbox-input-box datetimepicker-input-subbox" align="center">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-one"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:         <xul:label anonid="sep-first" class="datetimepicker-separator" value=":"/>
michael@0:         <xul:hbox class="textbox-input-box datetimepicker-input-subbox" align="center">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-two"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:         <xul:label anonid="sep-second" class="datetimepicker-separator" value=":"/>
michael@0:         <xul:hbox class="textbox-input-box datetimepicker-input-subbox" align="center">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-three"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:         <xul:hbox class="textbox-input-box datetimepicker-input-subbox" align="center">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-ampm"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:       </xul:hbox>
michael@0:       <xul:spinbuttons anonid="buttons" xbl:inherits="disabled"
michael@0:                        onup="this.parentNode._increaseOrDecrease(1);"
michael@0:                        ondown="this.parentNode._increaseOrDecrease(-1);"/>
michael@0:     </content>
michael@0: 
michael@0:     <implementation>
michael@0:       <field name="_dateValue">null</field>
michael@0:       <field name="_fieldOne">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "input-one");
michael@0:       </field>
michael@0:       <field name="_fieldTwo">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "input-two");
michael@0:       </field>
michael@0:       <field name="_fieldThree">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "input-three");
michael@0:       </field>
michael@0:       <field name="_fieldAMPM">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "input-ampm");
michael@0:       </field>
michael@0:       <field name="_separatorFirst">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "sep-first");
michael@0:       </field>
michael@0:       <field name="_separatorSecond">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "sep-second");
michael@0:       </field>
michael@0:       <field name="_lastFocusedField">null</field>
michael@0:       <field name="_hasEntry">true</field>
michael@0:       <field name="_valueEntered">false</field>
michael@0:       <field name="attachedControl">null</field>
michael@0: 
michael@0:       <property name="_currentField" readonly="true">
michael@0:         <getter>
michael@0:           var focusedInput = document.activeElement;
michael@0:           if (focusedInput == this._fieldOne ||
michael@0:               focusedInput == this._fieldTwo ||
michael@0:               focusedInput == this._fieldThree ||
michael@0:               focusedInput == this._fieldAMPM)
michael@0:             return focusedInput;
michael@0:           return this._lastFocusedField || this._fieldOne;
michael@0:         </getter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="dateValue" onget="return new Date(this._dateValue);">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             if (!(val instanceof Date))
michael@0:               throw "Invalid Date";
michael@0: 
michael@0:             this._setValueNoSync(val);
michael@0:             if (this.attachedControl)
michael@0:               this.attachedControl._setValueNoSync(val);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="readOnly" onset="if (val) this.setAttribute('readonly', 'true');
michael@0:                                        else this.removeAttribute('readonly'); return val;"
michael@0:                                 onget="return this.getAttribute('readonly') == 'true';"/>
michael@0: 
michael@0:       <method name="_fireEvent">
michael@0:         <parameter name="aEventName"/>
michael@0:         <parameter name="aTarget"/>
michael@0:         <body>
michael@0:           var event = document.createEvent("Events");
michael@0:           event.initEvent(aEventName, true, true);
michael@0:           return !aTarget.dispatchEvent(event);
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="_setValueOnChange">
michael@0:         <parameter name="aField"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (!this._hasEntry)
michael@0:               return;
michael@0: 
michael@0:             if (aField == this._fieldOne ||
michael@0:                 aField == this._fieldTwo ||
michael@0:                 aField == this._fieldThree) {
michael@0:               var value = Number(aField.value);
michael@0:               if (isNaN(value))
michael@0:                 value = 0;
michael@0: 
michael@0:               value = this._constrainValue(aField, value, true);
michael@0:               this._setFieldValue(aField, value);
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:       <method name="_init">
michael@0:         <body/>
michael@0:       </method>
michael@0: 
michael@0:       <constructor>
michael@0:         this._init();
michael@0: 
michael@0:         var cval = this.getAttribute("value");
michael@0:         if (cval) {
michael@0:           try {
michael@0:             this.value = cval;
michael@0:             return;
michael@0:           } catch (ex) { }
michael@0:         }
michael@0:         this.dateValue = new Date();
michael@0:       </constructor>
michael@0: 
michael@0:       <destructor>
michael@0:         if (this.attachedControl) {
michael@0:           this.attachedControl.attachedControl = null;
michael@0:           this.attachedControl = null;
michael@0:         }
michael@0:       </destructor>
michael@0: 
michael@0:     </implementation>
michael@0: 
michael@0:     <handlers>
michael@0:       <handler event="focus" phase="capturing">
michael@0:         <![CDATA[
michael@0:           var target = event.originalTarget;
michael@0:           if (target == this._fieldOne ||
michael@0:               target == this._fieldTwo ||
michael@0:               target == this._fieldThree ||
michael@0:               target == this._fieldAMPM)
michael@0:             this._lastFocusedField = target;
michael@0:         ]]>
michael@0:       </handler>
michael@0: 
michael@0:       <handler event="keypress">
michael@0:         <![CDATA[
michael@0:           if (this._hasEntry && event.charCode &&
michael@0:               this._currentField != this._fieldAMPM &&
michael@0: 	      ! (event.altKey || event.ctrlKey || event.metaKey) &&
michael@0:               (event.charCode < 48 || event.charCode > 57))
michael@0:             event.preventDefault();
michael@0:         ]]>
michael@0:       </handler>
michael@0: 
michael@0:       <handler event="keypress" keycode="VK_UP">
michael@0:         if (this._hasEntry)
michael@0:           this._increaseOrDecrease(1);
michael@0:       </handler>
michael@0:       <handler event="keypress" keycode="VK_DOWN">
michael@0:         if (this._hasEntry)
michael@0:           this._increaseOrDecrease(-1);
michael@0:       </handler>
michael@0: 
michael@0:       <handler event="input">
michael@0:         this._valueEntered = true;
michael@0:       </handler>
michael@0: 
michael@0:       <handler event="change">
michael@0:         this._setValueOnChange(event.originalTarget);
michael@0:       </handler>
michael@0:     </handlers>
michael@0: 
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="timepicker"
michael@0:            extends="chrome://global/content/bindings/datetimepicker.xml#datetimepicker-base">
michael@0: 
michael@0:     <implementation>
michael@0:       <field name="is24HourClock">false</field>
michael@0:       <field name="hourLeadingZero">false</field>
michael@0:       <field name="minuteLeadingZero">true</field>
michael@0:       <field name="secondLeadingZero">true</field>
michael@0:       <field name="amIndicator">"AM"</field>
michael@0:       <field name="pmIndicator">"PM"</field>
michael@0: 
michael@0:       <field name="hourField">null</field>
michael@0:       <field name="minuteField">null</field>
michael@0:       <field name="secondField">null</field>
michael@0: 
michael@0:       <property name="value">
michael@0:         <getter>
michael@0:           <![CDATA[
michael@0:             var minute = this._dateValue.getMinutes();
michael@0:             if (minute < 10)
michael@0:               minute = "0" + minute;
michael@0: 
michael@0:             var second = this._dateValue.getSeconds();
michael@0:             if (second < 10)
michael@0:               second = "0" + second;
michael@0:             return this._dateValue.getHours() + ":" + minute + ":" + second;
michael@0:           ]]>
michael@0:         </getter>
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var items = val.match(/^([0-9]{1,2})\:([0-9]{1,2})\:?([0-9]{1,2})?$/);
michael@0:             if (!items)
michael@0:               throw "Invalid Time";
michael@0: 
michael@0:             var dt = this.dateValue;
michael@0:             dt.setHours(items[1]);
michael@0:             dt.setMinutes(items[2]);
michael@0:             dt.setSeconds(items[3] ? items[3] : 0);
michael@0:             this.dateValue = dt;
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="hour" onget="return this._dateValue.getHours();">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var valnum = Number(val);
michael@0:             if (isNaN(valnum) || valnum < 0 || valnum > 23)
michael@0:               throw "Invalid Hour";
michael@0:             this._setFieldValue(this.hourField, valnum);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="minute" onget="return this._dateValue.getMinutes();">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var valnum = Number(val);
michael@0:             if (isNaN(valnum) || valnum < 0 || valnum > 59)
michael@0:               throw "Invalid Minute";
michael@0:             this._setFieldValue(this.minuteField, valnum);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="second" onget="return this._dateValue.getSeconds();">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var valnum = Number(val);
michael@0:             if (isNaN(valnum) || valnum < 0 || valnum > 59)
michael@0:               throw "Invalid Second";
michael@0:             this._setFieldValue(this.secondField, valnum);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="isPM">
michael@0:         <getter>
michael@0:           <![CDATA[
michael@0:             return (this.hour >= 12);
michael@0:           ]]>
michael@0:         </getter>
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             if (val) {
michael@0:               if (this.hour < 12)
michael@0:                 this.hour += 12;
michael@0:             }
michael@0:             else if (this.hour >= 12)
michael@0:               this.hour -= 12;
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="hideSeconds">
michael@0:         <getter>
michael@0:           return (this.getAttribute("hideseconds") == "true");
michael@0:         </getter>
michael@0:         <setter>
michael@0:           if (val)
michael@0:             this.setAttribute("hideseconds", "true");
michael@0:           else
michael@0:             this.removeAttribute("hideseconds");
michael@0:           if (this.secondField)
michael@0:             this.secondField.parentNode.collapsed = val;
michael@0:           this._separatorSecond.collapsed = val;
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="increment">
michael@0:         <getter>
michael@0:           <![CDATA[
michael@0:             var increment = this.getAttribute("increment");
michael@0:             increment = Number(increment);
michael@0:             if (isNaN(increment) || increment <= 0 || increment >= 60)
michael@0:               return 1;
michael@0:             return increment;
michael@0:           ]]>
michael@0:         </getter>
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             if (typeof val == "number")
michael@0:               this.setAttribute("increment", val);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <method name="_setValueNoSync">
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             var dt = new Date(aValue);
michael@0:             if (!isNaN(dt)) {
michael@0:               this._dateValue = dt;
michael@0:               this.setAttribute("value", this.value);
michael@0:               this._updateUI(this.hourField, this.hour);
michael@0:               this._updateUI(this.minuteField, this.minute);
michael@0:               this._updateUI(this.secondField, this.second);
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_increaseOrDecrease">
michael@0:         <parameter name="aDir"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (this.disabled || this.readOnly)
michael@0:               return;
michael@0: 
michael@0:             var field = this._currentField;
michael@0:             if (this._valueEntered)
michael@0:               this._setValueOnChange(field);
michael@0: 
michael@0:             if (field == this._fieldAMPM) {
michael@0:               this.isPM = !this.isPM;
michael@0:               this._fireEvent("change", this);
michael@0:             }
michael@0:             else {
michael@0:               var oldval;
michael@0:               var change = aDir;
michael@0:               if (field == this.hourField) {
michael@0:                 oldval = this.hour;
michael@0:               }
michael@0:               else if (field == this.minuteField) {
michael@0:                 oldval = this.minute;
michael@0:                 change *= this.increment;
michael@0:               }
michael@0:               else if (field == this.secondField) {
michael@0:                 oldval = this.second;
michael@0:               }
michael@0: 
michael@0:               var newval = this._constrainValue(field, oldval + change, false);
michael@0: 
michael@0:               if (field == this.hourField)
michael@0:                 this.hour = newval;
michael@0:               else if (field == this.minuteField)
michael@0:                 this.minute = newval;
michael@0:               else if (field == this.secondField)
michael@0:                 this.second = newval;
michael@0: 
michael@0:               if (oldval != newval)
michael@0:                 this._fireEvent("change", this);
michael@0:             }
michael@0:             field.select();
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_setFieldValue">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (aField == this.hourField)
michael@0:               this._dateValue.setHours(aValue);
michael@0:             else if (aField == this.minuteField)
michael@0:               this._dateValue.setMinutes(aValue);
michael@0:             else if (aField == this.secondField)
michael@0:               this._dateValue.setSeconds(aValue);
michael@0: 
michael@0:             this.setAttribute("value", this.value);
michael@0:             this._updateUI(aField, aValue);
michael@0: 
michael@0:             if (this.attachedControl)
michael@0:               this.attachedControl._setValueNoSync(this._dateValue);
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_updateUI">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             this._valueEntered = false;
michael@0: 
michael@0:             var prependZero = false;
michael@0:             if (aField == this.hourField) {
michael@0:               prependZero = this.hourLeadingZero;
michael@0:               if (!this.is24HourClock) {
michael@0:                 if (aValue >= 12) {
michael@0:                   if (aValue > 12)
michael@0:                     aValue -= 12;
michael@0:                   this._fieldAMPM.value = this.pmIndicator;
michael@0:                 }
michael@0:                 else {
michael@0:                   if (aValue == 0)
michael@0:                     aValue = 12;
michael@0:                   this._fieldAMPM.value = this.amIndicator;
michael@0:                 }
michael@0:               }
michael@0:             }
michael@0:             else if (aField == this.minuteField) {
michael@0:               prependZero = this.minuteLeadingZero;
michael@0:             }
michael@0:             else if (aField == this.secondField) {
michael@0:               prependZero = this.secondLeadingZero;
michael@0:             }
michael@0: 
michael@0:             if (prependZero && aValue < 10)
michael@0:               aField.value = "0" + aValue;
michael@0:             else
michael@0:               aField.value = aValue;
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_constrainValue">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <parameter name="aNoWrap"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             // aNoWrap is true when the user entered a value, so just
michael@0:             // constrain within limits. If false, the value is being
michael@0:             // incremented or decremented, so wrap around values 
michael@0:             var max = (aField == this.hourField) ? 24 : 60;
michael@0:             if (aValue < 0)
michael@0:               return aNoWrap ? 0 : max + aValue;
michael@0:             if (aValue >= max)
michael@0:               return aNoWrap ? max - 1 : aValue - max;
michael@0:             return aValue;
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_init">
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             this.hourField = this._fieldOne;
michael@0:             this.minuteField = this._fieldTwo;
michael@0:             this.secondField = this._fieldThree;
michael@0: 
michael@0:             var numberOrder = /^(\D*)\s*(\d+)(\D*)(\d+)(\D*)(\d+)\s*(\D*)$/;
michael@0: 
michael@0:             var pmTime = new Date(2000,0,1,16,7,9).toLocaleFormat("%X");
michael@0:             var numberFields = pmTime.match(numberOrder);
michael@0:             if (numberFields) {
michael@0:               this._separatorFirst.value = numberFields[3];
michael@0:               this._separatorSecond.value = numberFields[5];
michael@0:               if (Number(numberFields[2]) > 12)
michael@0:                 this.is24HourClock = true;
michael@0:               else
michael@0:                 this.pmIndicator = numberFields[1] || numberFields[7];
michael@0:             }
michael@0: 
michael@0:             var amTime = new Date(2000,0,1,1,7,9).toLocaleFormat("%X");
michael@0:             numberFields = amTime.match(numberOrder);
michael@0:             if (numberFields) {
michael@0:               this.hourLeadingZero = (numberFields[2].length > 1);
michael@0:               this.minuteLeadingZero = (numberFields[4].length > 1);
michael@0:               this.secondLeadingZero = (numberFields[6].length > 1);
michael@0: 
michael@0:               if (!this.is24HourClock) {
michael@0:                 this.amIndicator = numberFields[1] || numberFields[7];
michael@0:                 if (numberFields[1]) {
michael@0:                   var mfield = this._fieldAMPM.parentNode;
michael@0:                   var mcontainer = mfield.parentNode;
michael@0:                   mcontainer.insertBefore(mfield, mcontainer.firstChild);
michael@0:                 }
michael@0:                 var size = (numberFields[1] || numberFields[7]).length;
michael@0:                 if (this.pmIndicator.length > size)
michael@0:                   size = this.pmIndicator.length;
michael@0:                 this._fieldAMPM.size = size;
michael@0:                 this._fieldAMPM.maxLength = size;
michael@0:               }
michael@0:               else {
michael@0:                 this._fieldAMPM.parentNode.collapsed = true;
michael@0:               }
michael@0:             }
michael@0: 
michael@0:             this.hideSeconds = this.hideSeconds;
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:     </implementation>
michael@0: 
michael@0:     <handlers>
michael@0:       <handler event="keypress">
michael@0:         <![CDATA[
michael@0:           // just allow any printable character to switch the AM/PM state
michael@0:           if (event.charCode && !this.disabled && !this.readOnly &&
michael@0:               this._currentField == this._fieldAMPM) {
michael@0:             this.isPM = !this.isPM;
michael@0:             this._fieldAMPM.select();
michael@0:             this._fireEvent("change", this);
michael@0:             event.preventDefault();
michael@0:           }
michael@0:         ]]>
michael@0:       </handler>
michael@0:     </handlers>
michael@0: 
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="datepicker"
michael@0:            extends="chrome://global/content/bindings/datetimepicker.xml#datetimepicker-base">
michael@0: 
michael@0:     <implementation>
michael@0:       <field name="yearLeadingZero">false</field>
michael@0:       <field name="monthLeadingZero">true</field>
michael@0:       <field name="dateLeadingZero">true</field>
michael@0: 
michael@0:       <field name="yearField"/>
michael@0:       <field name="monthField"/>
michael@0:       <field name="dateField"/>
michael@0: 
michael@0:       <property name="value">
michael@0:         <getter>
michael@0:           <![CDATA[
michael@0:             var month = this._dateValue.getMonth();
michael@0:             month = (month < 9) ? month = "0" + ++month : month + 1;
michael@0: 
michael@0:             var date = this._dateValue.getDate();
michael@0:             if (date < 10)
michael@0:               date = "0" + date;
michael@0:             return this._dateValue.getFullYear() + "-" + month + "-" + date;
michael@0:           ]]>
michael@0: 
michael@0:         </getter>
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var results = val.match(/^([0-9]{1,4})\-([0-9]{1,2})\-([0-9]{1,2})$/);
michael@0:             if (!results)
michael@0:               throw "Invalid Date";
michael@0: 
michael@0:             this.dateValue = new Date(results[1] + "/" + results[2] + "/" + results[3]);
michael@0:             this.setAttribute("value", this.value);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="year" onget="return this._dateValue.getFullYear();">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var valnum = Number(val);
michael@0:             if (isNaN(valnum) || valnum < 1 || valnum > 9999)
michael@0:               throw "Invalid Year";
michael@0:             this._setFieldValue(this.yearField, valnum);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="month" onget="return this._dateValue.getMonth();">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var valnum = Number(val);
michael@0:             if (isNaN(valnum) || valnum < 0 || valnum > 11)
michael@0:               throw "Invalid Month";
michael@0:             this._setFieldValue(this.monthField, valnum);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="date" onget="return this._dateValue.getDate();">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             var valnum = Number(val);
michael@0:             if (isNaN(valnum) || valnum < 1 || valnum > 31)
michael@0:               throw "Invalid Date";
michael@0:             this._setFieldValue(this.dateField, valnum);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="open" onget="return false;" onset="return val;"/>
michael@0: 
michael@0:       <property name="displayedMonth" onget="return this.month;"
michael@0:                 onset="this.month = val; return val;"/>
michael@0:       <property name="displayedYear" onget="return this.year;"
michael@0:                 onset="this.year = val; return val;"/>
michael@0: 
michael@0:       <method name="_setValueNoSync">
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             var dt = new Date(aValue);
michael@0:             if (!isNaN(dt)) {
michael@0:               this._dateValue = dt;
michael@0:               this.setAttribute("value", this.value);
michael@0:               this._updateUI(this.yearField, this.year);
michael@0:               this._updateUI(this.monthField, this.month);
michael@0:               this._updateUI(this.dateField, this.date);
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_increaseOrDecrease">
michael@0:         <parameter name="aDir"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (this.disabled || this.readOnly)
michael@0:               return;
michael@0: 
michael@0:             var field = this._currentField;
michael@0:             if (this._valueEntered)
michael@0:               this._setValueOnChange(field);
michael@0: 
michael@0:             var oldval;
michael@0:             if (field == this.yearField)
michael@0:               oldval = this.year;
michael@0:             else if (field == this.monthField)
michael@0:               oldval = this.month;
michael@0:             else if (field == this.dateField)
michael@0:               oldval = this.date;
michael@0: 
michael@0:             var newval = this._constrainValue(field, oldval + aDir, false);
michael@0: 
michael@0:             if (field == this.yearField)
michael@0:               this.year = newval;
michael@0:             else if (field == this.monthField)
michael@0:               this.month = newval;
michael@0:             else if (field == this.dateField)
michael@0:               this.date = newval;
michael@0: 
michael@0:             if (oldval != newval)
michael@0:               this._fireEvent("change", this);
michael@0:             field.select();
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_setFieldValue">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (aField == this.yearField) {
michael@0:               var oldDate = this.date;
michael@0:               this._dateValue.setFullYear(aValue);
michael@0:               if (oldDate != this.date) {
michael@0:                 this._dateValue.setDate(0);
michael@0:                 this._updateUI(this.dateField, this.date);
michael@0:               }
michael@0:             }
michael@0:             else if (aField == this.monthField) {
michael@0:               var oldDate = this.date;
michael@0:               this._dateValue.setMonth(aValue);
michael@0:               if (oldDate != this.date) {
michael@0:                 this._dateValue.setDate(0);
michael@0:                 this._updateUI(this.dateField, this.date);
michael@0:               }
michael@0:             }
michael@0:             else if (aField == this.dateField) {
michael@0:               this._dateValue.setDate(aValue);
michael@0:             }
michael@0: 
michael@0:             this.setAttribute("value", this.value);
michael@0:             this._updateUI(aField, aValue);
michael@0: 
michael@0:             if (this.attachedControl)
michael@0:               this.attachedControl._setValueNoSync(this._dateValue);
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_updateUI">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             this._valueEntered = false;
michael@0: 
michael@0:             var prependZero = false;
michael@0:             if (aField == this.yearField) {
michael@0:               if (this.yearLeadingZero) {
michael@0:                 aField.value = ("000" + aValue).slice(-4);
michael@0:                 return;
michael@0:               }
michael@0:             }
michael@0:             else if (aField == this.monthField) {
michael@0:               aValue++;
michael@0:               prependZero = this.monthLeadingZero;
michael@0:             }
michael@0:             else if (aField == this.dateField) {
michael@0:               prependZero = this.dateLeadingZero;
michael@0:             }
michael@0:             if (prependZero && aValue < 10)
michael@0:               aField.value = "0" + aValue;
michael@0:             else
michael@0:               aField.value = aValue;
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_constrainValue">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <parameter name="aNoWrap"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             // the month will be 1 to 12 if entered by the user, so subtract 1
michael@0:             if (aNoWrap && aField == this.monthField)
michael@0:               aValue--;
michael@0: 
michael@0:             if (aField == this.dateField) {
michael@0:               if (aValue < 1)
michael@0:                 return new Date(this.year, this.month + 1, 0).getDate();
michael@0: 
michael@0:               var currentMonth = this.month;
michael@0:               var dt = new Date(this.year, currentMonth, aValue);
michael@0:               return (dt.getMonth() != currentMonth ? 1 : aValue);
michael@0:             }
michael@0:             var min = (aField == this.monthField) ? 0 : 1;
michael@0:             var max = (aField == this.monthField) ? 11 : 9999;
michael@0:             if (aValue < min)
michael@0:               return aNoWrap ? min : max;
michael@0:             if (aValue > max)
michael@0:               return aNoWrap ? max : min;
michael@0:             return aValue;
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_init">
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             // We'll default to YYYY/MM/DD to start.
michael@0:             var yfield = "input-one";
michael@0:             var mfield = "input-two";
michael@0:             var dfield = "input-three";
michael@0:             var twoDigitYear = false;
michael@0:             this.yearLeadingZero = true;
michael@0:             this.monthLeadingZero = true;
michael@0:             this.dateLeadingZero = true;
michael@0: 
michael@0:             var numberOrder = /^(\D*)\s*(\d+)(\D*)(\d+)(\D*)(\d+)\s*(\D*)$/;
michael@0: 
michael@0:             var dt = new Date(2002,9,4).toLocaleFormat("%x");
michael@0:             var numberFields = dt.match(numberOrder);
michael@0:             if (numberFields) {
michael@0:               this._separatorFirst.value = numberFields[3];
michael@0:               this._separatorSecond.value = numberFields[5];
michael@0: 
michael@0:               var yi = 2, mi = 4, di = 6;
michael@0: 
michael@0:               for (var i = 1; i < numberFields.length; i++) {
michael@0:                 switch (Number(numberFields[i])) {
michael@0:                   case 2:
michael@0:                     twoDigitYear = true; // fall through
michael@0:                   case 2002:
michael@0:                     yi = i;
michael@0:                     yfield = (i == 2 ? "input-one" :
michael@0:                              (i == 4 ? "input-two" : "input-three"));
michael@0:                     break;
michael@0:                   case 9, 10:
michael@0:                     mi = i;
michael@0:                     mfield = (i == 2 ? "input-one" :
michael@0:                              (i == 4 ? "input-two" : "input-three"));
michael@0:                     break;
michael@0:                   case 4:
michael@0:                     di = i;
michael@0:                     dfield = (i == 2 ? "input-one" :
michael@0:                              (i == 4 ? "input-two" : "input-three"));
michael@0:                     break;
michael@0:                 }
michael@0:               }
michael@0: 
michael@0:               this.yearLeadingZero = (numberFields[yi].length > 1);
michael@0:               this.monthLeadingZero = (numberFields[mi].length > 1);
michael@0:               this.dateLeadingZero = (numberFields[di].length > 1);
michael@0:             }
michael@0: 
michael@0:             this.yearField = document.getAnonymousElementByAttribute(this, "anonid", yfield);
michael@0:             if (!twoDigitYear)
michael@0:               this.yearField.parentNode.classList.add("datetimepicker-input-subbox", "datetimepicker-year");
michael@0:             this.monthField = document.getAnonymousElementByAttribute(this, "anonid", mfield);
michael@0:             this.dateField = document.getAnonymousElementByAttribute(this, "anonid", dfield);
michael@0: 
michael@0:             this._fieldAMPM.parentNode.collapsed = true;
michael@0:             this.yearField.size = twoDigitYear ? 2 : 4;
michael@0:             this.yearField.maxLength = twoDigitYear ? 2 : 4;
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:     </implementation>
michael@0: 
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="datepicker-grid"
michael@0:            extends="chrome://global/content/bindings/datetimepicker.xml#datepicker">
michael@0: 
michael@0:     <content>
michael@0:       <vbox class="datepicker-mainbox"
michael@0:             xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
michael@0:         <hbox class="datepicker-monthbox" align="center">
michael@0:           <button class="datepicker-previous datepicker-button" type="repeat"
michael@0:                   xbl:inherits="disabled"
michael@0:                   oncommand="document.getBindingParent(this)._increaseOrDecreaseMonth(-1);"/>
michael@0:           <spacer flex="1"/>
michael@0:           <deck anonid="monthlabeldeck">
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:             <label class="datepicker-gridlabel"/>
michael@0:           </deck>
michael@0:           <label anonid="yearlabel" class="datepicker-gridlabel"/>
michael@0:           <spacer flex="1"/>
michael@0:           <button class="datepicker-next datepicker-button" type="repeat"
michael@0:                   xbl:inherits="disabled"
michael@0:                   oncommand="document.getBindingParent(this)._increaseOrDecreaseMonth(1);"/>
michael@0:         </hbox>
michael@0:         <grid class="datepicker-grid" role="grid">
michael@0:           <columns>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:             <column class="datepicker-gridrow" flex="1"/>
michael@0:           </columns>
michael@0:           <rows anonid="datebox">
michael@0:             <row anonid="dayofweekbox">
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:               <label class="datepicker-weeklabel" role="columnheader"/>
michael@0:             </row>
michael@0:             <row>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:             </row>
michael@0:             <row>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:             </row>
michael@0:             <row>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:             </row>
michael@0:             <row>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:             </row>
michael@0:             <row>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:             </row>
michael@0:             <row>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:               <label class="datepicker-gridlabel" role="gridcell"/>
michael@0:             </row>
michael@0:           </rows>
michael@0:         </grid>
michael@0:       </vbox>
michael@0:     </content>
michael@0: 
michael@0:     <implementation>
michael@0:       <field name="_hasEntry">false</field>
michael@0:       <field name="_weekStart">&firstdayofweek.default;</field>
michael@0:       <field name="_displayedDate">null</field>
michael@0:       <field name="_todayItem">null</field>
michael@0: 
michael@0:       <field name="yearField">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "yearlabel");
michael@0:       </field>
michael@0:       <field name="monthField">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "monthlabeldeck");
michael@0:       </field>
michael@0:       <field name="dateField">
michael@0:         document.getAnonymousElementByAttribute(this, "anonid", "datebox");
michael@0:       </field>
michael@0: 
michael@0:       <field name="_selectedItem">null</field>
michael@0: 
michael@0:       <property name="selectedItem" onget="return this._selectedItem">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             if (!val.value)
michael@0:               return val;
michael@0:             if (val.parentNode.parentNode != this.dateField)
michael@0:               return val;
michael@0: 
michael@0:             if (this._selectedItem)
michael@0:               this._selectedItem.removeAttribute("selected");
michael@0:             this._selectedItem = val;
michael@0:             val.setAttribute("selected", "true");
michael@0:             this._displayedDate.setDate(val.value);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <property name="displayedMonth">
michael@0:         <getter>
michael@0:           return this._displayedDate.getMonth();
michael@0:         </getter>
michael@0:         <setter>
michael@0:           this._updateUI(this.monthField, val, true);
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="displayedYear">
michael@0:         <getter>
michael@0:           return this._displayedDate.getFullYear();
michael@0:         </getter>
michael@0:         <setter>
michael@0:           this._updateUI(this.yearField, val, true);
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0: 
michael@0:       <method name="_init">
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             var monthLabel = this.monthField.firstChild;
michael@0:             var tempDate = new Date(2005, 0, 1);
michael@0:             for (var month = 0; month < 12; month++) {
michael@0:               tempDate.setMonth(month);
michael@0:               monthLabel.setAttribute("value", tempDate.toLocaleFormat("%B"));
michael@0:               monthLabel = monthLabel.nextSibling;
michael@0:             }
michael@0: 
michael@0:             var fdow = Number(this.getAttribute("firstdayofweek"));
michael@0:             if (!isNaN(fdow) && fdow >= 0 && fdow <= 6)
michael@0:               this._weekStart = fdow;
michael@0: 
michael@0:             var weekbox = document.getAnonymousElementByAttribute(this, "anonid", "dayofweekbox").childNodes;
michael@0:             var date = new Date();
michael@0:             date.setDate(date.getDate() - (date.getDay() - this._weekStart));
michael@0:             for (var i = 0; i < weekbox.length; i++) {
michael@0:               weekbox[i].value = date.toLocaleFormat("%a").charAt(0);
michael@0:               date.setDate(date.getDate() + 1);
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_setValueNoSync">
michael@0:         <parameter name="aValue"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             var dt = new Date(aValue);
michael@0:             if (!isNaN(dt)) {
michael@0:               this._dateValue = dt;
michael@0:               this.setAttribute("value", this.value);
michael@0:               this._updateUI();
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_updateUI">
michael@0:         <parameter name="aField"/>
michael@0:         <parameter name="aValue"/>
michael@0:         <parameter name="aCheckMonth"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             var date;
michael@0:             var currentMonth;
michael@0:             if (aCheckMonth) {
michael@0:               if (!this._displayedDate)
michael@0:                 this._displayedDate = this.dateValue;
michael@0: 
michael@0:               var expectedMonth = aValue;
michael@0:               if (aField == this.monthField) {
michael@0:                 this._displayedDate.setMonth(aValue);
michael@0:               }
michael@0:               else {
michael@0:                 expectedMonth = this._displayedDate.getMonth();
michael@0:                 this._displayedDate.setFullYear(aValue);
michael@0:               }
michael@0: 
michael@0:               if (expectedMonth != -1 && expectedMonth != 12 &&
michael@0:                   expectedMonth != this._displayedDate.getMonth()) {
michael@0:                 // If the month isn't what was expected, then the month overflowed.
michael@0:                 // Setting the date to 0 will go back to the last day of the right month.
michael@0:                 this._displayedDate.setDate(0);
michael@0:               }
michael@0: 
michael@0:               date = new Date(this._displayedDate);
michael@0:               currentMonth = this._displayedDate.getMonth();
michael@0:             }
michael@0:             else {
michael@0:               var samemonth = (this._displayedDate &&
michael@0:                                this._displayedDate.getMonth() == this.month &&
michael@0:                                this._displayedDate.getFullYear() == this.year);
michael@0:               if (samemonth) {
michael@0:                 var items = this.dateField.getElementsByAttribute("value", this.date);
michael@0:                 if (items.length)
michael@0:                   this.selectedItem = items[0];
michael@0:                 return;
michael@0:               }
michael@0: 
michael@0:               date = this.dateValue;
michael@0:               this._displayedDate = new Date(date);
michael@0:               currentMonth = this.month;
michael@0:             }
michael@0: 
michael@0:             if (this._todayItem) {
michael@0:               this._todayItem.removeAttribute("today");
michael@0:               this._todayItem = null;
michael@0:             }
michael@0: 
michael@0:             if (this._selectedItem) {
michael@0:               this._selectedItem.removeAttribute("selected");
michael@0:               this._selectedItem = null;
michael@0:             }
michael@0: 
michael@0:             // Update the month and year title
michael@0:             this.monthField.selectedIndex = currentMonth;
michael@0:             this.yearField.setAttribute("value", date.getFullYear());
michael@0: 
michael@0:             date.setDate(1);
michael@0:             var firstWeekday = (7 + date.getDay() - this._weekStart) % 7;
michael@0:             date.setDate(date.getDate() - firstWeekday);
michael@0: 
michael@0:             var today = new Date();
michael@0:             var datebox = this.dateField;
michael@0:             for (var k = 1; k < datebox.childNodes.length; k++) {
michael@0:               var row = datebox.childNodes[k];
michael@0:               for (var i = 0; i < 7; i++) {
michael@0:                 var item = row.childNodes[i];
michael@0: 
michael@0:                 if (currentMonth == date.getMonth()) {
michael@0:                   item.value = date.getDate();
michael@0: 
michael@0:                   // highlight today
michael@0:                   if (this._isSameDay(today, date)) {
michael@0:                     this._todayItem = item;
michael@0:                     item.setAttribute("today", "true");
michael@0:                   }
michael@0: 
michael@0:                   // highlight the selected date
michael@0:                   if (this._isSameDay(this._dateValue, date)) {
michael@0:                     this._selectedItem = item;
michael@0:                     item.setAttribute("selected", "true");
michael@0:                   }
michael@0:                 }
michael@0:                 else {
michael@0:                   item.value = "";
michael@0:                 }
michael@0: 
michael@0:                 date.setDate(date.getDate() + 1);
michael@0:               }
michael@0:             }
michael@0: 
michael@0:             this._fireEvent("monthchange", this);
michael@0:             if (this.hasAttribute("monthchange")) {
michael@0:               var fn = new Function("event", aTarget.getAttribute("onmonthchange"));
michael@0:               fn.call(aTarget, event);
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_increaseOrDecreaseDateFromEvent">
michael@0:         <parameter name="aEvent"/>
michael@0:         <parameter name="aDiff"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (aEvent.originalTarget == this && !this.disabled && !this.readOnly) {
michael@0:               var newdate = this.dateValue;
michael@0:               newdate.setDate(newdate.getDate() + aDiff);
michael@0:               this.dateValue = newdate;
michael@0:               this._fireEvent("change", this);
michael@0:             }
michael@0:             aEvent.stopPropagation();
michael@0:             aEvent.preventDefault();
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_increaseOrDecreaseMonth">
michael@0:         <parameter name="aDir"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             if (!this.disabled) {
michael@0:               var month = this._displayedDate ? this._displayedDate.getMonth() :
michael@0:                                                 this.month;
michael@0:               this._updateUI(this.monthField, month + aDir, true);
michael@0:             }
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0:       <method name="_isSameDay">
michael@0:         <parameter name="aDate1"/>
michael@0:         <parameter name="aDate2"/>
michael@0:         <body>
michael@0:           <![CDATA[
michael@0:             return (aDate1 && aDate2 &&
michael@0:                     aDate1.getDate() == aDate2.getDate() &&
michael@0:                     aDate1.getMonth() == aDate2.getMonth() &&
michael@0:                     aDate1.getFullYear() == aDate2.getFullYear());
michael@0:           ]]>
michael@0:         </body>
michael@0:       </method>
michael@0: 
michael@0:     </implementation>
michael@0: 
michael@0:     <handlers>
michael@0:       <handler event="click">
michael@0:         <![CDATA[
michael@0:           if (event.button != 0 || this.disabled || this.readOnly)
michael@0:             return;
michael@0: 
michael@0:           var target = event.originalTarget;
michael@0:           if (target.classList.contains("datepicker-gridlabel") &&
michael@0:               target != this.selectedItem) {
michael@0:             this.selectedItem = target;
michael@0:             this._dateValue = new Date(this._displayedDate);
michael@0:             if (this.attachedControl)
michael@0:               this.attachedControl._setValueNoSync(this._dateValue);
michael@0:             this._fireEvent("change", this);
michael@0: 
michael@0:             if (this.attachedControl && "open" in this.attachedControl)
michael@0:               this.attachedControl.open = false; // close the popup
michael@0:           }
michael@0:         ]]>
michael@0:       </handler>
michael@0:       <handler event="MozMousePixelScroll" preventdefault="true"/>
michael@0:       <handler event="DOMMouseScroll" preventdefault="true">
michael@0:         <![CDATA[
michael@0:           this._increaseOrDecreaseMonth(event.detail < 0 ? -1 : 1);
michael@0:         ]]>
michael@0:       </handler>
michael@0:       <handler event="keypress" keycode="VK_LEFT"
michael@0:                action="this._increaseOrDecreaseDateFromEvent(event, -1);"/>
michael@0:       <handler event="keypress" keycode="VK_RIGHT"
michael@0:                action="this._increaseOrDecreaseDateFromEvent(event, 1);"/>
michael@0:       <handler event="keypress" keycode="VK_UP"
michael@0:                action="this._increaseOrDecreaseDateFromEvent(event, -7);"/>
michael@0:       <handler event="keypress" keycode="VK_DOWN"
michael@0:                action="this._increaseOrDecreaseDateFromEvent(event, 7);"/>
michael@0:       <handler event="keypress" keycode="VK_PAGE_UP" preventdefault="true"
michael@0:                action="this._increaseOrDecreaseMonth(-1);"/>
michael@0:       <handler event="keypress" keycode="VK_PAGE_DOWN" preventdefault="true"
michael@0:                action="this._increaseOrDecreaseMonth(1);"/>
michael@0:     </handlers>
michael@0:   </binding>
michael@0: 
michael@0:   <binding id="datepicker-popup" display="xul:menu"
michael@0:            extends="chrome://global/content/bindings/datetimepicker.xml#datepicker">
michael@0:     <content align="center">
michael@0:       <xul:hbox class="textbox-input-box datetimepicker-input-box" align="center"
michael@0:                 allowevents="true" xbl:inherits="context">
michael@0:         <xul:hbox class="datetimepicker-input-subbox" align="baseline">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-one"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:         <xul:label anonid="sep-first" class="datetimepicker-separator" value=":"/>
michael@0:         <xul:hbox class="datetimepicker-input-subbox" align="baseline">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-two"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:         <xul:label anonid="sep-second" class="datetimepicker-separator" value=":"/>
michael@0:         <xul:hbox class="datetimepicker-input-subbox" align="center">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-three"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:         <xul:hbox class="datetimepicker-input-subbox" align="center">
michael@0:           <html:input class="datetimepicker-input textbox-input" anonid="input-ampm"
michael@0:                       size="2" maxlength="2"
michael@0:                       xbl:inherits="disabled,readonly"/>
michael@0:         </xul:hbox>
michael@0:       </xul:hbox>
michael@0:       <xul:spinbuttons anonid="buttons" xbl:inherits="disabled" allowevents="true"
michael@0:                        onup="this.parentNode._increaseOrDecrease(1);"
michael@0:                        ondown="this.parentNode._increaseOrDecrease(-1);"/>
michael@0:       <xul:dropmarker class="datepicker-dropmarker" xbl:inherits="disabled"/>
michael@0:       <xul:panel onpopupshown="this.firstChild.focus();" level="top">
michael@0:         <xul:datepicker anonid="grid" type="grid" class="datepicker-popupgrid"
michael@0:                         xbl:inherits="disabled,readonly,firstdayofweek"/>
michael@0:       </xul:panel>
michael@0:     </content>
michael@0:     <implementation>
michael@0:       <constructor>
michael@0:         var grid = document.getAnonymousElementByAttribute(this, "anonid", "grid");
michael@0:         this.attachedControl = grid;
michael@0:         grid.attachedControl = this;
michael@0:         grid._setValueNoSync(this._dateValue);
michael@0:       </constructor>
michael@0:       <property name="open" onget="return this.hasAttribute('open');">
michael@0:         <setter>
michael@0:           <![CDATA[
michael@0:             if (this.boxObject instanceof Components.interfaces.nsIMenuBoxObject)
michael@0:               this.boxObject.openMenu(val);
michael@0:             return val;
michael@0:           ]]>
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="displayedMonth">
michael@0:         <getter>
michael@0:           return document.getAnonymousElementByAttribute(this, "anonid", "grid").displayedMonth;
michael@0:         </getter>
michael@0:         <setter>
michael@0:           document.getAnonymousElementByAttribute(this, "anonid", "grid").displayedMonth = val;
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0:       <property name="displayedYear">
michael@0:         <getter>
michael@0:           return document.getAnonymousElementByAttribute(this, "anonid", "grid").displayedYear;
michael@0:         </getter>
michael@0:         <setter>
michael@0:           document.getAnonymousElementByAttribute(this, "anonid", "grid").displayedYear = val;
michael@0:           return val;
michael@0:         </setter>
michael@0:       </property>
michael@0:     </implementation>
michael@0:   </binding>
michael@0: 
michael@0: </bindings>