Changeset 2919

Timestamp:

05/25/10 01:27:45

Author:

johnsa

Message:

user client: scheduling interface - date/duration widgets and scheduling grid now interact with each other.

Files:

• trunk/deployment/webuser/webapp/resources/demoskins/themes/bedeworkTheme/eventForm.xsl (modified) (4 diffs)
• trunk/deployment/webuser/webapp/resources/demoskins/themes/bedeworkTheme/javascript/bedeworkScheduling.js (modified) (12 diffs)

trunk/deployment/webuser/webapp/resources/demoskins/themes/bedeworkTheme/eventForm.xsl

@@ -369 +369 @@
-                  <xsl:otherwise>
-                    <input type="text" name="bwEventWidgetStartDate" id="bwEventWidgetStartDate" size="10"/>
-                    <script type="text/javascript">
-                      <xsl:comment>
-                      /*$("#bwEventWidgetStartDate").datepicker({
-                        defaultDate: new Date(<xsl:value-of select="form/start/yearText/input/@value"/>, <xsl:value-of select="number(form/start/month/select/option[@selected = 'selected']/@value) - 1"/>, <xsl:value-of select="form/start/day/select/option[@selected = 'selected']/@value"/>)
-                      }).attr("readonly", "readonly");
-                      $("#bwEventWidgetStartDate").val('<xsl:value-of select="substring-before(form/start/rfc3339DateTime,'T')"/>');*/
-                      </xsl:comment>
-                    </script>
-                    <input type="hidden" name="eventStartDate.year">
-                      <xsl:attribute name="value"><xsl:value-of select="form/start/yearText/input/@value"/></xsl:attribute>
@@ -391 +383 @@
-              <div class="{$timeFieldsClass}" id="startTimeFields">
-                <span id="calWidgetStartTimeHider" class="show">
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
-                  <xsl:text> </xsl:text>
-                  <a href="javascript:bwClockLaunch('eventStartDate');"><img src="{$resourcesRoot}/images/clockIcon.gif" width="16" height="15" border="0" alt="bwClock"/></a>
@@ -402 +400 @@
-                    <xsl:if test="form/floating/input/@checked='checked'"><xsl:attribute name="disabled">disabled</xsl:attribute></xsl:if>
-                    <option value="-1"><xsl:copy-of select="$bwStr-AEEF-SelectTimezone"/></option>
-
-
-
-
-
-
-
-
-
-
-
+
-                  </select>
-                </span>
@@ -1487 +1475 @@
-              <xsl:text> </xsl:text>
-              <span class="schedTime">
-
-
+
+
+
+
+
+
-                <xsl:if test="form/start/ampm">
-
+
+
+
-                </xsl:if>
-              </span>

trunk/deployment/webuser/webapp/resources/demoskins/themes/bedeworkTheme/javascript/bedeworkScheduling.js

@@ -182 +182 @@
-  this.startRange = new Date(startRange);
-  this.endRange = new Date(startRange); 
+  this.dayRange = 5; // number of days to increment the end range
-  this.startHoursRange = startHoursRange;
-  this.endHoursRange = endHoursRange; 
@@ -191 +192 @@
-  this.organizer = organizerUri;
-  
-forma
-5);
+incremen
+this.dayRange);  
-    
-  // 2D array of time and busy state for all attendees
@@ -320 +321 @@
-        $(this).addClass("highlight");
-      }
+      
-    });
-    
@@ -325 +327 @@
-    // this flag lets us highlight the very first free time window on first click
-    pickNextClicked = true;
+    
+    bwGrid.setDateTimeWidgets(curSelectionTime);
-  };
-  
@@ -347 +351 @@
-      }
-    });
+    
+    bwGrid.setDateTimeWidgets(curSelectionTime);
-  };
-  
@@ -379 +385 @@
-  // Update the corresponding form elements and set the 
-  // duration for selection in the grid.
-
-
-
-
-
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
-    //do some form validation - make sure the durations are integers
-    if (isNaN(days) || isNaN(hours) || isNaN(mins)) {
@@ -403 +421 @@
-    
-    // set the scheduling duration field values from the parsed values
-
+also 
-    $("#durationDaysSched").val(days);
-    $("#durationHoursSched").val(hours);
@@ -733 +751 @@
-          // set the start of the selection range in milliseconds (first half of the ID)
-          // we will use this to set the start time and to find cells in the same column
-
-
+var 
+var 
-          
-          // now do the highlighting
@@ -754 +772 @@
-            }
-          }
+          
+          bwGrid.setDateTimeWidgets(startSelectionMils);
-  
-        }
-      );
+
+      this.setDateTimeWidgets = function(startMils) {
+        // set the values of the date/time widgets on the main and meeting tabs
+        var selectedDate = new Date(Number(startMils));
+        var selectedDateStr = selectedDate.getFullYear() + "-" + selectedDate.getMonthFull() + "-" + selectedDate.getDateFull();
+        $("#bwEventWidgetStartDate").val(selectedDateStr);
+        $("#bwEventWidgetStartDateSched").val(selectedDateStr);
+        // check for ampm or hour24
+        if ($("#eventStartDateSchedAmpm").length) {
+          // we are using am/pm
+          $("#eventStartDateHour").val(selectedDate.getHours12());
+          $("#eventStartDateMinute").val(selectedDate.getMinutesFull());
+          $("#eventStartDateAmpm").val(selectedDate.getAmpm());
+          $("#eventStartDateSchedHour").val(selectedDate.getHours12());
+          $("#eventStartDateSchedMinute").val(selectedDate.getMinutesFull());
+          $("#eventStartDateSchedAmpm").val(selectedDate.getAmpm());
+        } else {
+          // we are using hour24
+          $("#eventStartDateHour").val(selectedDate.getHours());
+          $("#eventStartDateMinute").val(selectedDate.getMinutesFull());
+          $("#eventStartDateSchedHour").val(selectedDate.getHours());
+          $("#eventStartDateSchedMinute").val(selectedDate.getMinutesFull());
+        }
+      } 
-      
-      /*
@@ -846 +890 @@
-      });
-      
+      // if we change the main tab's start date and duration, update the meeting tab
+      // and reset the range of the scheduling grid
+      $("#bwEventWidgetStartDate").change(function() {
+        $("#bwEventWidgetStartDateSched").val($("#bwEventWidgetStartDate").val());
+        bwGrid.startRange = $("#bwEventWidgetStartDate").datepicker("getDate");
+        bwGrid.endRange = $("#bwEventWidgetStartDate").datepicker("getDate");
+        bwGrid.endRange.addDays(bwGrid.dayRange);
+        bwGrid.requestFreeBusy(); 
+      });
+
+      $("#durationDays").change(function() {
+        bwGrid.bwSchedChangeDuration("#durationDays");
+      });
+      
+      $("#durationHours").change(function() {
+        bwGrid.bwSchedChangeDuration("#durationHours");
+      });
+      
+      $("#durationMinutes").change(function() {
+        bwGrid.bwSchedChangeDuration("#durationMinutes");
+      });
+
+      // if we change the meeting tab's date and duration, update the main tab
+      // and reset the range of the scheduling grid
+      $("#bwEventWidgetStartDateSched").change(function() {
+        $("#bwEventWidgetStartDate").val($("#bwEventWidgetStartDateSched").val());
+        bwGrid.startRange = $("#bwEventWidgetStartDateSched").datepicker("getDate");
+        bwGrid.endRange = $("#bwEventWidgetStartDateSched").datepicker("getDate");
+        bwGrid.endRange.addDays(bwGrid.dayRange);
+        bwGrid.requestFreeBusy(); 
+      });
+      
-      $("#durationDaysSched").change(function() {
-        bwGrid.bwSchedChangeDuration("#durationDaysSched");
@@ -906 +982 @@
-  return hours12;
-};
+Date.prototype.getAmpm = function() {
+  var ampm = "am";
+  var hours = this.getHours();
+  if (hours > 11) {
+    ampm = "pm";
+  }
+  return ampm;
+};
+// prepend months with zero if needed
+Date.prototype.getMonthFull = function() {
+  var monthFull = this.getMonth() + 1;
+  if (monthFull < 10) {
+    return "0" + monthFull;
+  }  
+  return monthFull;
+};
+// return a formatted day date, prepended with zero if needed
+Date.prototype.getDateFull = function() {
+  var dateFull = this.getDate();
+  if (dateFull < 10) {
+    return "0" + dateFull;
+  }  
+  return dateFull;
+};
-// prepend minutes with zero if needed
-Date.prototype.getMinutesFull = function() {
@@ -912 +1012 @@
-    return "0" + minutesFull;
-  }  
-
-
+
+
+
-
-/* UTC FORMATTERS */