bug 345998 - Provides shared 'jump to date' function and ui. patch by jminta, r1=lilmatt, r2=dmose

calendar/lightning/content/messenger-overlay-sidebar.js

@@ -106,6 +106,7 @@ function ltnMinimonthPick(minimonth)
         return;
 
     var jsDate = minimonth.value;
+    document.getElementById("ltnDateTextPicker").value = jsDate;
     var cdt = new CalDateTime();
     cdt.year = jsDate.getFullYear();
     cdt.month = jsDate.getMonth();
@@ -137,6 +138,14 @@ function ltnMinimonthPick(minimonth)
     currentView().goToDay(cdt);
 }
 
+function ltnGoToDate()
+{
+    var goToDate = document.getElementById("ltnDateTextPicker");
+    if (goToDate.value) {
+        ltnMinimonthPick(goToDate);
+    }
+}
+
 function ltnOnLoad(event)
 {
     gMiniMonthLoading = true;

calendar/lightning/content/messenger-overlay-sidebar.xul

@@ -55,6 +55,7 @@
 <?xml-stylesheet href="chrome://calendar/skin/calendar-views.css" type="text/css"?>
 <?xml-stylesheet href="chrome://calendar/content/calendar-decorated-views.css" type="text/css"?>
 <?xml-stylesheet href="chrome://calendar/content/datetimepickers/minimonth.css" type="text/css"?>
+<?xml-stylesheet href="chrome://calendar/content/datetimepickers/datetimepickers.css" type="text/css"?>
 
 <overlay id="ltnSidebarOverlay"
          xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
@@ -119,7 +120,11 @@
       <minimonth id="ltnMinimonth" onchange="ltnMinimonthPick(this);" flex="2"/>
       <spacer flex="1"/>
     </hbox>
-  
+    <hbox>
+      <spacer width="10"/>
+      <datetextpicker flex="1" id="ltnDateTextPicker" oncommand="ltnGoToDate()"/>
+    </hbox>
+
     <tabbox flex="1">
       <tabs>
         <tab label="&lightning.sidebar.agenda.label;"/>

calendar/locales/en-US/chrome/calendar/calendar.properties

@@ -238,3 +238,17 @@ addCategory=Add Category
 newCategory=New Category...
 
 attendeeInstructions=email@example.com
+
+today=Today
+tomorrow=Tomorrow
+yesterday=Yesterday
+
+go=Go
+
+# Some languages have different conjugations of 'next' and 'last'.  If yours
+# does not, simply repeat the value.  This will be used with day names, as in
+# 'next Sunday'.
+next1=next
+next2=next
+last1=last
+last2=last

calendar/resources/content/datetimepickers/datetimepickers.css

@@ -43,6 +43,10 @@ datetimepicker {
   -moz-binding: url("chrome://calendar/content/datetimepickers/datetimepickers.xml#datetimepicker");
 }
 
+datetextpicker {
+  -moz-binding: url("chrome://calendar/content/datetimepickers/datetimepickers.xml#datetextpicker");
+}
+
 timepicker {
   -moz-binding: url("chrome://calendar/content/datetimepickers/datetimepickers.xml#timepicker");
 }

calendar/resources/content/datetimepickers/datetimepickers.xml

@@ -63,6 +63,188 @@
           xmlns:xbl="http://www.mozilla.org/xbl"
           xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
 
+  <binding id="datetextpicker"
+           extends="chrome://calendar/content/datetimepickers/datetimepickers.xml#datetimepicker-base">
+    <content>
+      <xul:hbox flex="1">
+        <xul:textbox anonid="date-textbox" flex="1"
+                     onfocus="this.select();"
+                     onkeypress="if (event.keyCode == Components.interfaces.nsIDOMKeyEvent.DOM_VK_RETURN) fireGoEvent();"/>
+        <xul:button anonid="date-go-button" oncommand="fireGoEvent()"/>
+      </xul:hbox>
+    </content>
+    <implementation>
+      <field name="mRelativeDates">[]</field>
+      <field name="mDayNames">[]</field>
+      <field name="mRelationWords">[]</field>
+      <field name="mMonthLongNames">[]</field>
+      <field name="mMonthShortNames">[]</field>
+
+      <constructor><![CDATA[
+        var goButton = document.getAnonymousElementByAttribute(this, "anonid", "date-go-button");
+        goButton.setAttribute("label", calGetString("calendar", "go"));
+        // Load the stuff we're going to use to parse written dates
+        this.mRelativeDates = [
+            {word:calGetString("calendar", "today").toLowerCase(), offset: 0},
+            {word:calGetString("calendar", "yesterday").toLowerCase(), offset: -1},
+            {word:calGetString("calendar", "tomorrow").toLowerCase(), offset: 1}];
+        var i;
+        for (i = 1; i <= 7; i++) {
+          this.mDayNames.push(calGetString("dateFormat", "day."+i+".name").toLowerCase());
+        }
+
+        for (i = 1; i <= 12; i++) {
+          this.mMonthLongNames.push(calGetString("dateFormat", "month."+i+".name").toLowerCase());
+          this.mMonthShortNames.push(calGetString("dateFormat", "month."+i+".Mmm").toLowerCase());
+        }
+
+        // note that some languages have different conjugations of
+        // next/last depending on the day
+        this.mRelationWords = [
+            {word:calGetString("calendar", "last1"), offset: -1},
+            {word:calGetString("calendar", "last2"), offset: -1},
+            {word:calGetString("calendar", "next1"), offset: 0},
+            {word:calGetString("calendar", "next2"), offset: 0}];        
+
+        // Set the value to today
+        var text = document.getAnonymousElementByAttribute(this, "anonid", "date-textbox");
+        text.value = calGetString("calendar", "today");
+      ]]></constructor>
+
+      <property name="value">
+        <getter><![CDATA[
+          return this.mValue;
+        ]]></getter>
+        <setter><![CDATA[
+         var text = document.getAnonymousElementByAttribute(this, "anonid", "date-textbox");
+          try {
+            text.value = this.formatDate(val);
+          } catch(ex) {}
+          return val;
+        ]]></setter>
+      </property>
+
+      <method name="fireGoEvent">
+        <body><![CDATA[
+          var text = document.getAnonymousElementByAttribute(this, "anonid", "date-textbox");
+          var date = this.parseLanguageDate(text.value);
+          if (!date) {
+            date = this.parseDateTime(text.value);
+          }
+          if (date) {
+            // format fails if year <= 1600 on win2k, so try format first.
+            var prettyDate;
+            try { 
+              prettyDate = this.formatDate(date);
+            } catch (ex) {} // fall thru
+          }
+          if (date && prettyDate) {
+            this.mValue = date;
+            text.value = prettyDate;
+            this.fireEvent("command", date);
+            return;
+          }
+        ]]></body>
+      </method>
+
+      <!-- This function will take written (with words) dates and, if
+         - possible, return a Date() object described by the words.  Note
+         - that this function will not parse explicit dates, like 1/1/06,
+         - you should use parseDateTime for that.
+        -->
+      <method name="parseLanguageDate">
+        <parameter name="aValue"/>
+        <body><![CDATA[
+           if (!aValue) {
+             return null;
+           }
+           var val = aValue.toLowerCase();
+           // Look for the easy ones like today, tomorrow, etc
+           for each (var rel in this.mRelativeDates) {
+             if (val == rel.word) {
+               var now = new Date();
+               now.setDate(now.getDate()+rel.offset);
+               return now;
+             }
+           }
+
+           var parser = this;
+
+           // Takes a written day of the week and returns a js-date
+           // corresponding to the nearest day in the future that is
+           // that day of the week
+           function getDateForDay(aWord) {
+             for (var i in parser.mDayNames) {
+               if (aWord != parser.mDayNames[i]) {
+                 continue;
+               }
+               // Figure out what day of the week today is 
+               var calDate = createDateTime();
+               calDate.jsDate = new Date();
+
+               // i-weekday gets the offset (off by 1), add 7 to ensure
+               // that the % operation stays positive.
+               var offset = (i-calDate.weekday+7)%7 +1;
+               var now = new Date();
+               now.setDate(now.getDate()+offset);
+               return now;
+             }
+             return null;
+           }
+
+           // Remove commas
+           val = val.replace(',', '');
+
+           if (val.indexOf(' ') == -1) {
+             // Just a single word, or a single date.
+             return getDateForDay(val);
+           }
+
+           // Replace month names with numbers
+           for (var i in this.mMonthLongNames) {
+             if (val.indexOf(this.mMonthLongNames[i]) != -1) {
+               var newVal = val.replace(this.mMonthLongNames[i], Number(i)+1);
+               newVal = newVal.replace(' ', '/');
+               return this.parseDateTime(newVal);
+             }
+          }
+
+          // Same for short month names
+           for (var i in this.mMonthShortNames) {
+             if (val.indexOf(this.mMonthShortNames[i]) != -1) {
+               var newVal = val.replace(this.mMonthShortNames[i], Number(i)+1);
+               newVal = newVal.replace(' ', '/');
+               return this.parseDateTime(newVal);
+             }
+          }
+
+          // Now for the cool 'next' and 'last'
+          var words = val.split(' ');
+          var offset, day;
+          for each (word in words) {
+            for each (rel in this.mRelationWords) {
+              if (word == rel.word) {
+                offset = rel.offset;
+                break;
+              }
+            }
+            for (var i in this.mDayNames) {
+              if (word == this.mDayNames[i]) {
+                day = getDateForDay(word);
+                break;
+              }
+            }
+          }
+
+          if (day && offset != undefined) {
+            day.setDate(day.getDate()+(7*offset));
+            return day;
+          }
+          return null;
+        ]]></body>
+      </method>
+    </implementation>
+  </binding>
   <binding id="datepicker" extends="chrome://calendar/content/datetimepickers/datetimepickers.xml#datetimepicker-base">
     <!-- ::::::::::::::::: CONTENT ::::::::::::::::::::::::: -->
     <!-- Desired behavior: when user is done editing the date field 
@@ -1177,10 +1359,12 @@
 
       <method name="fireEvent">
         <parameter name="aEventName"/>
+        <parameter name="aDetail"/>
         <body>
           <![CDATA[
             var event = document.createEvent('Events');
             event.initEvent(aEventName, true, true);
+            event.detail = aDetail;
             this.dispatchEvent(event);
           ]]>
         </body>