bug 272732

more work on new/edit event dialog.
more of the todo/task controls are wired in and working.
r=pavlov@pavlov.net

calendar/resources/content/applicationUtil.js

@@ -1,4 +1,5 @@
-/* ***** BEGIN LICENSE BLOCK *****
+/* -*- Mode: javascript; tab-width: 20; indent-tabs-mode: nil; c-basic-offset: 4 -*-
+ * ***** BEGIN LICENSE BLOCK *****
  * Version: MPL 1.1/GPL 2.0/LGPL 2.1
  *
  * The contents of this file are subject to the Mozilla Public License Version
@@ -11,6 +12,14 @@
  * for the specific language governing rights and limitations under the
  * License.
  *
+ * The Original Code is Mozilla Calendar code.
+ *
+ * The Initial Developer of the Original Code is Eric Belhaire.
+ * Portions created by the Initial Developer are Copyright (C) 2003
+ * the Initial Developer. All Rights Reserved.
+ *
+ * Contributor(s): Matthew Willis <mattwillis@gmail.com>
+ *
  * Alternatively, the contents of this file may be used under the terms of
  * either the GNU General Public License Version 2 or later (the "GPL"), or
  * the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
@@ -25,6 +34,7 @@
  *
  * ***** END LICENSE BLOCK ***** */
 
+
 const nsIWindowMediator = Components.interfaces.nsIWindowMediator;
 
 function toOpenWindowByType( inType, uri )
@@ -103,6 +113,7 @@ function launchBrowser( UrlToGoTo )
    //window.open( UrlToGoTo, "calendar-opened-window" );
 }
 
+
 function goToggleToolbar( id, elementID )
 {
     var toolbar = document.getElementById(id);
@@ -118,6 +129,7 @@ function goToggleToolbar( id, elementID )
     }
 }
 
+
 function openExtensions(aOpenMode)
 {
     const EMTYPE = "Extension:Manager";
@@ -143,24 +155,112 @@ function openExtensions(aOpenMode)
     }
 }
 
+
 function showElement( elementId )
 {
     try {
-    dump("showElement: showing "+elementId+"\n");
+        debug("showElement: showing " + elementId );
         document.getElementById( elementId ).removeAttribute( "hidden" );
-  }
+    } catch (e) {
-  catch (e) {
         dump("showElement: Couldn't remove hidden attribute from " + elementId + "\n");
     }
 }
 
+
 function hideElement( elementId )
 {
     try {
-    dump("hideElement: hiding "+elementId+"\n");
+        debug("hideElement: hiding " + elementId );
         document.getElementById( elementId ).setAttribute( "hidden", "true" );
-  }
+    } catch (e) {
-  catch (e) {
         dump("hideElement: Couldn't set hidden attribute on " + elementId + "\n");
     }
 }
+
+
+function enableElement( elementId )
+{
+    try {
+        debug("enableElement: enabling " + elementId );
+        //document.getElementById( elementId ).setAttribute( "disabled", "false" );
+
+        // call remove attribute beacuse some widget code checks for the presense of a 
+        // disabled attribute, not the value.
+        document.getElementById( elementId ).removeAttribute( "disabled" );
+    } catch (e) {
+        dump("enableElement: Couldn't remove disabled attribute on " + elementId + "\n");
+    }
+}
+
+
+function disableElement( elementId )
+{
+    try {
+        debug("disableElement: disabling " + elementId );
+        document.getElementById( elementId ).setAttribute( "disabled", "true" );
+    } catch (e) {
+        dump("disableElement: Couldn't set disabled attribute to true on " + elementId + "\n");
+    }
+}
+
+
+function processEnableCheckbox( checkboxId, elementId )
+{
+    if( document.getElementById( checkboxId ).checked )
+        enableElement( elementId );
+    else
+        disableElement( elementId );
+}
+
+
+/*
+ *   Update plural singular menu items
+ */
+
+function updateMenuPlural( lengthFieldId, menuId )
+{
+    var field = document.getElementById( lengthFieldId );
+    var menu = document.getElementById( menuId );
+
+    // figure out whether we should use singular or plural
+    var length = field.value;
+
+    var newLabelNumber;
+
+    // XXX This assumes that "0 days, minutes, etc." is plural in other languages.
+    if( ( Number( length ) == 0 ) || ( Number( length ) > 1 ) )
+        newLabelNumber = "labelplural"
+    else
+        newLabelNumber = "labelsingular"
+
+    // see what we currently show and change it if required
+    var oldLabelNumber = menu.getAttribute( "labelnumber" );
+
+    if( newLabelNumber != oldLabelNumber ) {
+        // remember what we are showing now
+        menu.setAttribute( "labelnumber", newLabelNumber );
+
+        // update the menu items
+        var items = menu.getElementsByTagName( "menuitem" );
+
+        for( var i = 0; i < items.length; ++i ) {
+            var menuItem = items[i];
+            var newLabel = menuItem.getAttribute( newLabelNumber );
+            menuItem.label = newLabel;
+            menuItem.setAttribute( "label", newLabel );
+        }
+
+        // force the menu selection to redraw
+        var saveSelectedIndex = menu.selectedIndex;
+        menu.selectedIndex = -1;
+        menu.selectedIndex = saveSelectedIndex;
+    }
+}
+
+
+function debug( text )
+{
+    if( gDebugEnabled )
+        dump( text + "\n");
+}
+

calendar/resources/content/eventDialog.xul

@@ -14,8 +14,7 @@
    -
    - The Original Code is OEone Calendar Code, released October 31st, 2001.
    -
-   - The Initial Developer of the Original Code is
+   - The Initial Developer of the Original Code is OEone Corporation.
-   - OEone Corporation.
    - Portions created by the Initial Developer are Copyright (C) 2001
    - the Initial Developer. All Rights Reserved.
    -
@@ -45,8 +44,7 @@
 
 <!-- CSS File with all styles specific to the dialog -->
 <?xml-stylesheet href="chrome://calendar/skin/eventDialog.css" ?>
-<?xml-stylesheet
+<?xml-stylesheet href="chrome://calendar/content/datetimepickers/datetimepicker.css" ?>
- href="chrome://calendar/content/datetimepickers/datetimepicker.css" ?>
 
 <!-- CSS for selecting contacts to invite to event -->
 <?xml-stylesheet href="chrome://calendar/skin/selectAddresses.css" ?>
@@ -60,15 +58,14 @@
 ]>
 
 
-<dialog
+<dialog id="calendar-new-component-window"
-   id="calendar-new-component-window"
         title="Calendar Component"
         onload="loadCalendarEventDialog()"
         buttons="accept,cancel"
         ondialogaccept="return onOKCommand();"
         ondialogcancel="return true;"
         persist="screenX screenY"
-   minwidth="490"
+        minwidth="500" minheight="400"
         xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
         xmlns:nc="http://home.netscape.com/NC-rdf#">
 
@@ -90,13 +87,13 @@
 
 
 <!-- Javascript includes -->
-
-<script type="application/x-javascript" src="chrome://calendar/content/calendar.js"/>
 <script type="application/x-javascript" src="chrome://global/content/strres.js"/>
+<script type="application/x-javascript" src="chrome://calendar/content/calendar.js"/>
 <script type="application/x-javascript" src="chrome://calendar/content/dateUtils.js"/>
 <script type="application/x-javascript" src="chrome://calendar/content/eventDialog.js"/>
 <script type="application/x-javascript" src="chrome://calendar/content/selectAddressesDialog.js"/>
 <script type="application/x-javascript" src="chrome://calendar/content/attachFile.js"/>
+
 <!-- NEEDED FOR APPLICATION SUPPORT -->
 <script type="application/x-javascript" src="chrome://calendar/content/applicationUtil.js"/>
 
@@ -108,26 +105,22 @@
 <dataset>
     <data id="data-event-title-new"             value="&event.title.new;" />
     <data id="data-event-title-edit"            value="&event.title.edit;" />
-    <data id="data-event-title-new"             value="&todo.title.new;" />
+    <data id="data-todo-title-new"              value="&todo.title.new;" />
-    <data id="data-event-title-edit"            value="&todo.title.edit;" />
+    <data id="data-todo-title-edit"             value="&todo.title.edit;" />
     <data id="onthe-text"                       value="&onthe-text;" />
     <data id="last-text"                        value="&last-text;" />
     <data id="ofthemonth-text"                  value="&ofthemonth-text;" />
 </dataset>
 
-
 <!-- Dialog content -->
 
 <tabbox>
   <tabs>
-    <!-- XXX label="&newevent.newevent.tab.label;" -->
+    <tab label="&newevent.general.tab.label;"/>
-    <tab label="General"/>
     <tab label="&newevent.recurrence.tab.label;"/>
-    <!-- XXX label="&newevent.contacts.tab.label;" -->
+    <tab label="&newevent.attendees.tab.label;"/>
-    <tab label="Attendees"/>
+    <tab label="&newevent.attachments.tab.label;"/>
-    <!-- XXX label="&newevent.files.tab.label;" -->
+    <tab label="&newevent.advanced.tab.label;"/>
-    <tab label="Attachments"/>
-    <tab label="Advanced"/>
   </tabs>
   <tabpanels>
     <tabpanel>
@@ -144,21 +137,24 @@
                 <row align="center">
                   <!-- Item Type -->
                   <hbox pack="end">
-                    <label for="component-type" value="Item Type"/>
+                    <label for="component-type" value="&newevent.itemType.label;"/>
                   </hbox>
                   <hbox>
-                    <menulist id="component-type" crop="none" oncommand="processComponentType()">
+                    <menulist id="component-type" crop="none" 
+                              oncommand="processComponentType()">
                       <menupopup id="component-menulist-menupopup">
-                        <menuitem label="Event"   value="ICAL_COMPONENT_EVENT"/>
+                        <menuitem label="&newevent.itemType.event.label;"
-                        <menuitem label="Task"    value="ICAL_COMPONENT_TODO"/>
+                                  value="ICAL_COMPONENT_EVENT"/>
-                        <menuitem label="Journal" value="ICAL_COMPONENT_JOURNAL"
+                        <menuitem label="&newevent.itemType.todo.label;"
-                                  disabled="true"/>
+                                  value="ICAL_COMPONENT_TODO"/>
+                        <menuitem label="newevent.itemType.journal.label"
+                                  value="ICAL_COMPONENT_JOURNAL"
+                                  hidden="true" disabled="true"/>
                       </menupopup>
                     </menulist>
                     <spacer width="10px"/>
-                    <!-- Calendar Server &newevent.server.label; -->
                     <hbox align="center" flex="1">
-                      <label id="server-field-label" value="Calendar"/>
+                      <label id="server-field-label" value="&newevent.server.label;"/>
                       <menulist id="server-field">
                         <menupopup id="server-menulist-menupopup" datasources="rdf:null"
                                    ref="urn:calendarcontainer">
@@ -189,16 +185,25 @@
                   <textbox id="location-field"/>
                 </row>
                 <row align="center">
-                  <!-- Status -->
+                  <!-- Categories -->
                   <hbox pack="end">
-                    <label id="event-status-label" for="event-status-menulist-menupopup"
+                    <label for="categories-menulist-menupopup"
-                           value="&newevent.status.label;" hidden="true"/>
+                           value="&newtodo.categories.label;"/>
-                    <label id="task-status-label" for="cancelled-checkbox"
-                           value="&newtodo.status.label;" hidden="true"/>
                   </hbox>
                   <hbox>
-                    <menulist id="event-status-field" label="&newevent.status.label;"
+                    <menulist id="categories-field">
-                              hidden="true">
+                      <menupopup id="categories-menulist-menupopup">
+                        <menuitem label="&priority.level.none;" value="0"/>
+                      </menupopup>
+                    </menulist>
+                    <spacer width="10px"/>
+                    <!-- Status / Priority -->
+                    <hbox align="center">
+                      <label id="event-status-label" for="event-status-menulist-menupopup"
+                             value="&newevent.status.label;" hidden="true"/>
+                      <label id="task-priority-label" for="priority-levels"
+                             value="&newtodo.priority.label;" hidden="true"/>
+                      <menulist id="event-status-field" hidden="true">
                         <menupopup id="event-status-menulist-menupopup">
                           <menuitem label="None"/>
                           <menuitem label="&newevent.status.tentative.label;"
@@ -209,15 +214,12 @@
                                     value="ICAL_STATUS_CANCELLED"/>
                         </menupopup>
                       </menulist>
-                    <checkbox id="cancelled-checkbox" label="&newtodo.cancelled.label;"
+                      <menulist id="priority-levels" hidden="true">
-                              checked="false" hidden="true"/>
+                        <menupopup>
-                    <spacer width="10px"/>
-                    <!-- Categories -->
-                    <hbox align="center">
-                      <label for="categories-menulist-menupopup" value="&newtodo.categories.label;"/>
-                      <menulist id="categories-field" label="&newevent.category.label;">
-                        <menupopup id="categories-menulist-menupopup">
                           <menuitem label="&priority.level.none;"   value="0"/>
+                          <menuitem label="&priority.level.low;"    value="9"/>
+                          <menuitem label="&priority.level.medium;" value="5"/>
+                          <menuitem label="&priority.level.high;"   value="1"/>
                         </menupopup>
                       </menulist>
                     </hbox>
@@ -248,22 +250,39 @@
                 <rows>
                   <row>
                     <hbox pack="end" align="center">
-                      <label class="field-label-box-class" value="From"/>
+                      <label id="event-start-datetime-label" class="field-label-box-class"
+                             value="From" hidden="true"/>
+                      <label id="task-start-datetime-label" class="field-label-box-class"
+                             value="&newevent.startdate.label;" hidden="true"/>
                     </hbox>
                     <hbox flex="1">
-                      <datetimepicker id="start-datetime" value="" onchange="onDateTimePick( this );"/>
+                      <checkbox id="start-checkbox"
+                                oncommand="onDateTimeCheckbox(this, 'start-datetime')"
+                                persist="checked" hidden="true"/>
+                      <datetimepicker id="start-datetime" value="" 
+                                      onchange="onDateTimePick( this );"/>
                       <spacer flex="1"/>
                     </hbox>
                   </row>
                   <row>
                     <hbox pack="end" align="center">
-                      <label value="To"/>
+                      <label id="event-end-datetime-label"
+                             value="To" hidden="true"/>
+                      <label id="task-due-datetime-label"
+                             value="&newtodo.duedate.label;" hidden="true"/>
                     </hbox>
                     <hbox flex="1">
-                      <datetimepicker id="end-datetime" value="" onchange="onDateTimePick( this );"/>
+                      <checkbox id="due-checkbox"
+                                oncommand="onDateTimeCheckbox(this, 'due-datetime')"
+                                persist="checked" hidden="true"/>
+                      <datetimepicker id="due-datetime" value=""
+                                      onchange="onDateTimePick( this );" hidden="true"/>
+                      <datetimepicker id="end-datetime" value=""
+                                      onchange="onDateTimePick( this );" hidden="true"/>
                       <spacer flex="1"/>
                     </hbox>
                   </row>
+
                   <!-- Invalid end date/time warnings -->
                   <row align="center">
                     <spacer />
@@ -287,6 +306,56 @@
                     <label id="due-date-warning" class="warning-text-class"
                            value="&newtodo.duedate.warning;" hidden="true"/>
                   </row>
+
+                  <!-- Completed -->
+                  <row>
+                    <hbox pack="end" align="center">
+                      <label id="task-completed-label"
+                             value="&newtodo.completed.label;" hidden="true"/>
+                    </hbox>
+                    <hbox flex="1" align="center">
+                      <checkbox id="completed-checkbox" hidden="true"
+                                oncommand="updateCompletedItemEnabled()"/>
+                      <datepicker id="completed-date-picker"
+                                  disabled="true" value="" hidden="true"/>
+                      <spacer/>
+                      <menulist id="percent-complete-menulist"
+                                editable="true" hidden="true"
+                                oncommand="percentCompleteCommand()">
+                        <menupopup>
+                          <menuitem label="0"   value="0"/>
+                          <menuitem label="10"  value="10"/>
+                          <menuitem label="20"  value="20"/>
+                          <menuitem label="30"  value="30"/>
+                          <menuitem label="40"  value="40"/>
+                          <menuitem label="50"  value="50"/>
+                          <menuitem label="60"  value="60"/>
+                          <menuitem label="70"  value="70"/>
+                          <menuitem label="80"  value="80"/>
+                          <menuitem label="90"  value="90"/>
+                          <menuitem label="100" value="100"/>
+                        </menupopup>
+                      </menulist>
+                      <label id="percent-complete-label"
+                             for="percent-complete-menulist"
+                             value="&newtodo.percentcomplete.label;"
+                             hidden="true"/>
+                      <spacer flex="1"/>
+                    </hbox>
+                  </row>
+                  
+                  <!-- Task Cancelled -->
+                  <row>
+                    <hbox pack="end" align="center">
+                      <label id="todo-cancelled-label"
+                             value="&newtodo.cancelled.label;" hidden="true"/>
+                    </hbox>
+                    <hbox flex="1" align="center">
+                      <checkbox id="todo-cancelled-checkbox"
+                                checked="false" hidden="true"/>
+                      <spacer flex="1"/>
+                    </hbox>
+                  </row>
                 </rows>
               </grid>
             </hbox>
@@ -307,7 +376,7 @@
                     <menuitem label="None" value="none"/>
                     <menuitem label="Popup" value="popup"/>
                     <menuitem label="Popup &amp; Play Sound" value="popupAndSound"
-                              disabled="true"/>
+                              hidden="true" disabled="true"/>
                     <menuitem label="Send Email" value="email"/>
                   </menupopup>
                 </menulist>
@@ -362,6 +431,14 @@
                     -->
                   </menupopup>
                 </menulist>
+                <menulist id="alarm-trigger-relation" crop="none" hidden="true">
+                  <menupopup>
+                    <menuitem label="&newtodo.beforealarm.label;"
+                              value="ICAL_RELATED_START"/>
+                    <menuitem label="&newtodo.beforealarmends.label;"
+                              value="ICAL_RELATED_END"/>
+                  </menupopup>
+                </menulist>
               </vbox>
             </hbox>
             <hbox id="alarm-box-email" align="center">
@@ -435,7 +512,7 @@
               </menupopup>
             </menulist>
           </hbox>
-          <hbox id="repeat-extenstions-week"
+          <hbox id="repeat-extensions-week"
                 disabled="true"
                 disable-controller="repeat"
                 collapsed="false"
@@ -483,7 +560,7 @@
                       value="6"
                       checked="false" />
           </hbox>
-          <hbox id="repeat-extenstions-month"
+          <hbox id="repeat-extensions-month"
                 disabled="true"
                 collapsed="true"
                 align="center">
@@ -564,11 +641,13 @@
               </row>
               <row>
                 <listbox id="exception-dates-listbox"
+                         oninput="textboxChanged( this.id, 'delete-exception-button' );"
                          disable-controller="repeat"
                          rows="4"/>
                 <vbox>
-                  <button label="&newevent.deleteexceptions.label;"
+                  <button id="delete-exception-button"
-                          disable-controller="repeat"
+                          label="&newevent.deleteexceptions.label;"
+                          disabled="true"
                           oncommand="removeSelectedExceptionDate()"/>
                 </vbox>
               </row>
@@ -576,6 +655,9 @@
           </grid>
         </groupbox>
         </hbox>
+        <hbox flex="2">
+          <spacer flex="2"/>
+        </hbox>
       </vbox>
     </tabpanel><!-- /Repeat -->
 
@@ -587,9 +669,10 @@
                      <checkbox id="invite-checkbox"
                                label="&newevent.invite.label;"
                                checked="false"
-                               oncommand="commandInvite()"/>
+                               oncommand="processInviteCheckbox()"/>
                      <textbox id="invite-email-field"
                               size="39"
+                              oninput="textboxChanged( this.id, 'invite-email-button' );"
                               disabled="true"/>
                      <button label="Add" id="invite-email-button" onclick="onIniviteAdd();"/>
                   </hbox>
@@ -707,7 +790,9 @@
 
          <!-- "Advanced" tab -->
          <tabpanel>
-
+           <vbox flex="1">
+             <hbox flex="1">
+               <groupbox flex="1">
                  <grid>
                     <columns>
                        <column/>
@@ -722,13 +807,16 @@
                           </hbox>
                           <hbox>
                               <textbox id="uri-field"
+                                       oninput="textboxChanged( this.id, 'load-url-button' );"
 #ifndef MOZ_SUNBIRD
                                        type="autocomplete"
                                        searchSessions="history"
 #endif
                                        flex="1"/>
-                         <button label="&newevent.uri.visit.label;"
+                              <button id="load-url-button"
-                                 oncommand="loadURL()"/>
+                                      label="&newevent.uri.visit.label;"
+                                      oncommand="loadURL()"
+                                      disabled="true"/>
                           </hbox>
                        </row>
 
@@ -753,8 +841,9 @@
                        </row>
                     </rows>
                  </grid>
-            
+               </groupbox>
-            
+             </hbox>
+           </vbox>
          </tabpanel>
          
       </tabpanels>

calendar/resources/locale/en-US/calendar.dtd

@@ -85,7 +85,7 @@
 <!ENTITY newevent.private.label      "Private" >
 <!ENTITY newevent.private.note       "This event is private." >
 <!ENTITY newevent.alarm.label        "Alarm" >
-<!ENTITY newevent.server.label       "Calendar File" >
+<!ENTITY newevent.server.label       "Calendar" >
 <!ENTITY newevent.invite.label       "Invite" >
 <!ENTITY newevent.email.label        "Email Alarm To:" >
 <!ENTITY newevent.beforealarm.label  "before the event starts" >
@@ -105,10 +105,11 @@
 <!ENTITY newevent.endtime.tooltip    "Choose an end time for this event" >
 <!ENTITY newevent.starttimeerror.alertmessage "Your event cannot end before it has started. Please fix either the start time or the end time." >
 <!ENTITY newevent.recurendtimeerror.alertmessage "Your event's repeat time cannot be before the event end time. Please fix this, or disable repeating." >
-<!ENTITY newevent.newevent.tab.label "Event" >
+<!ENTITY newevent.general.tab.label         "General" >
 <!ENTITY newevent.recurrence.tab.label      "Recurrence" >
-<!ENTITY newevent.contacts.tab.label "Contacts" >
+<!ENTITY newevent.attendees.tab.label       "Attendees" >
-<!ENTITY newevent.files.tab.label "Files" >
+<!ENTITY newevent.attachments.tab.label     "Attachments" >
+<!ENTITY newevent.advanced.tab.label        "Advanced" >
 <!ENTITY newevent.status.label "Status" >
 <!ENTITY newevent.status.longlabel "Event Status">
 <!ENTITY newevent.status.needsaction.label "Needs Action" >
@@ -117,6 +118,10 @@
 <!ENTITY newevent.status.cancelled.label   "Cancelled" >
 <!ENTITY newevent.status.tentative.label   "Tentative" >
 <!ENTITY newevent.status.confirmed.label   "Confirmed" >
+<!ENTITY newevent.itemType.label            "Item Type" >
+<!ENTITY newevent.itemType.event.label      "Event" >
+<!ENTITY newevent.itemType.todo.label       "Task" >
+<!ENTITY newevent.itemType.journal.label    "Journal" >
 
 <!ENTITY newevent.advanced.repeat.dayofmonth.label "On the xth day of the month">
 <!ENTITY newevent.advanced.repeat.dayofweek.label "4th Tuesday of the month">