Bug 1410672 - Fix indent for eslint. r=MakeMyDay
authoreslint <eslint@bugzilla.kewis.ch>
Tue, 24 Oct 2017 23:17:03 +0200
changeset 29287 1c73b7308c85927524207fbd0015b91a0b04deb8
parent 29286 7aed7ffb951f77828426b361ab36667830c0b4c6
child 29288 5f5fbb45e801293526d7c6ab2158f7b7875c2828
push id2068
push userclokep@gmail.com
push dateMon, 13 Nov 2017 19:02:14 +0000
treeherdercomm-beta@9c7e7ce8672b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersMakeMyDay
bugs1410672
Bug 1410672 - Fix indent for eslint. r=MakeMyDay [skip-blame] MozReview-Commit-ID: 2NfsSjrb7i3
calendar/base/content/agenda-listbox.xml
calendar/base/content/calendar-base-view.xml
calendar/base/content/calendar-daypicker.xml
calendar/base/content/calendar-item-bindings.xml
calendar/base/content/calendar-menus.xml
calendar/base/content/calendar-month-view.xml
calendar/base/content/calendar-multiday-view.xml
calendar/base/content/calendar-task-tree.xml
calendar/base/content/calendar-view-core.xml
calendar/base/content/calendar-views.xml
calendar/base/content/dialogs/calendar-event-dialog-attendees.xml
calendar/base/content/dialogs/calendar-event-dialog-freebusy.xml
calendar/base/content/dialogs/calendar-event-dialog-recurrence-preview.xml
calendar/base/content/dialogs/calendar-invitations-list.xml
calendar/base/content/widgets/calendar-alarm-widget.xml
calendar/base/content/widgets/calendar-list-tree.xml
calendar/base/content/widgets/calendar-subscriptions-list.xml
calendar/base/content/widgets/calendar-widgets.xml
calendar/base/content/widgets/minimonth.xml
calendar/resources/content/datetimepickers/datetimepickers.xml
--- a/calendar/base/content/agenda-listbox.xml
+++ b/calendar/base/content/agenda-listbox.xml
@@ -9,85 +9,85 @@
           xmlns:xbl="http://www.mozilla.org/xbl">
 
   <binding id="agenda-base-richlist-item"
            extends="chrome://global/content/bindings/richlistbox.xml#richlistitem">
     <implementation>
       <field name="mOccurrence">null</field>;
       <property name="occurrence" readonly="true">
         <getter><![CDATA[
-          return this.mOccurrence;
+            return this.mOccurrence;
         ]]></getter>
       </property>
     </implementation>
 
     <handlers>
       <handler event="click" phase="capturing"><![CDATA[
-        if (event.detail == 1) {
-            agendaListbox.onSelect(this);
-        } else if (event.button == 0) {
-            // We only care about button 0 doubleclick events
-            document.getElementById("agenda_edit_event_command").doCommand();
-            event.stopPropagation();
-            event.preventDefault();
-        }
+          if (event.detail == 1) {
+              agendaListbox.onSelect(this);
+          } else if (event.button == 0) {
+              // We only care about button 0 doubleclick events
+              document.getElementById("agenda_edit_event_command").doCommand();
+              event.stopPropagation();
+              event.preventDefault();
+          }
       ]]></handler>
       <handler event="mouseover"><![CDATA[
-         event.stopPropagation();
-         onMouseOverItem(event);
+          event.stopPropagation();
+          onMouseOverItem(event);
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="agenda-checkbox-richlist-item"
            extends="chrome://global/content/bindings/richlistbox.xml#richlistitem">
     <content>
       <xul:treenode-checkbox class="agenda-checkbox" anonid="agenda-checkbox-widget"
                                                    flex="1"
                                                    xbl:inherits="selected,label,hidden,disabled"/>
     </content>
     <implementation>
       <field name="kCheckbox">null</field>;
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-        this.kCheckbox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-checkbox-widget");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          this.kCheckbox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-checkbox-widget");
       ]]></constructor>
 
       <method name="getItem">
         <body><![CDATA[
-          return this.mItem;
+            return this.mItem;
         ]]></body>
       </method>
 
       <method name="setItem">
         <parameter name="synthetic"/>
         <parameter name="showsToday"/>
         <body><![CDATA[
-          this.mItem = synthetic;
-          let duration = synthetic.duration;
-          if (showsToday) {
-              this.kCheckbox.label = this.getAttribute("title");
-              if (this.id == "nextweek-header") {
-                  if (duration > 7) {
-                      this.kCheckbox.label += " (" + unitPluralForm(duration / 7, "weeks") + ")";
-                  } else {
-                      this.kCheckbox.label += " (" + unitPluralForm(duration, "days") + ")";
-                  }
-              }
-          } else if (synthetic.duration == 1) {
-              this.kCheckbox.label = cal.getDateFormatter().formatDate(synthetic.start);
-          } else {
-              this.kCheckbox.label = cal.getDateFormatter().formatInterval(synthetic.start, synthetic.end);
-          }
+            this.mItem = synthetic;
+            let duration = synthetic.duration;
+            if (showsToday) {
+                this.kCheckbox.label = this.getAttribute("title");
+                if (this.id == "nextweek-header") {
+                    if (duration > 7) {
+                        this.kCheckbox.label += " (" + unitPluralForm(duration / 7, "weeks") + ")";
+                    } else {
+                        this.kCheckbox.label += " (" + unitPluralForm(duration, "days") + ")";
+                    }
+                }
+            } else if (synthetic.duration == 1) {
+                this.kCheckbox.label = cal.getDateFormatter().formatDate(synthetic.start);
+            } else {
+                this.kCheckbox.label = cal.getDateFormatter().formatInterval(synthetic.start, synthetic.end);
+            }
         ]]></body>
       </method>
 
       <method name="getCheckbox">
         <body><![CDATA[
-          return this.kCheckbox;
+            return this.kCheckbox;
         ]]></body>
       </method>
     </implementation>
   </binding>
 
   <binding id="agenda-allday-richlist-item"
            extends="chrome://calendar/content/agenda-listbox.xml#agenda-base-richlist-item">
     <content tooltip="itemTooltip">
@@ -106,78 +106,78 @@
           </xul:hbox>
         </xul:vbox>
       </xul:hbox>
     </content>
     <implementation>
       <field name="mAllDayItem">null</field>;
 
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-        this.mAllDayItem = document.getAnonymousElementByAttribute(this, "anonid", "allday-item");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          this.mAllDayItem = document.getAnonymousElementByAttribute(this, "anonid", "allday-item");
       ]]></constructor>
 
       <method name="setOccurrence">
         <parameter name="aOccurrence"/>
         <parameter name="aPeriod"/>
         <body><![CDATA[
-          this.mOccurrence = aOccurrence;
-          this.mAllDayItem.occurrence = aOccurrence;
-          let dateFormatter = cal.getDateFormatter();
-          let periodStartDate = aPeriod.start.clone();
-          periodStartDate.isDate = true;
-          let periodEndDate = aPeriod.end;
-          let startDate = this.mOccurrence[cal.calGetStartDateProp(this.mOccurrence)]
+            this.mOccurrence = aOccurrence;
+            this.mAllDayItem.occurrence = aOccurrence;
+            let dateFormatter = cal.getDateFormatter();
+            let periodStartDate = aPeriod.start.clone();
+            periodStartDate.isDate = true;
+            let periodEndDate = aPeriod.end;
+            let startDate = this.mOccurrence[cal.calGetStartDateProp(this.mOccurrence)]
+                                .getInTimezone(cal.calendarDefaultTimezone());
+            let endDate = this.mOccurrence[cal.calGetEndDateProp(this.mOccurrence)]
                               .getInTimezone(cal.calendarDefaultTimezone());
-          let endDate = this.mOccurrence[cal.calGetEndDateProp(this.mOccurrence)]
-                            .getInTimezone(cal.calendarDefaultTimezone());
-          let endPreviousDay = endDate.clone();
-          endPreviousDay.day--;
-          // Show items's date for long periods but also for "Upcoming"
-          // period with one day duration.
-          let showDate = aPeriod.multiday || aPeriod.duration > 1;
+            let endPreviousDay = endDate.clone();
+            endPreviousDay.day--;
+            // Show items's date for long periods but also for "Upcoming"
+            // period with one day duration.
+            let showDate = aPeriod.multiday || aPeriod.duration > 1;
 
-          let date = "";
-          let iconType = "";
-          let allDayDateLabel = document.getAnonymousElementByAttribute(this, "anonid", "agenda-allDayEvent-date");
-          setBooleanAttribute(allDayDateLabel, "hidden", !showDate);
-          if (startDate.compare(endPreviousDay) == 0) {
-              // All day event one day duration.
-              date = dateFormatter.formatDate(startDate);
-          } else if (startDate.compare(periodStartDate) >= 0 &&
-               startDate.compare(periodEndDate) <= 0) {
-              // All day event spanning multiple days.
-              iconType = "start";
-              date = dateFormatter.formatDate(startDate);
-          } else if (endDate.compare(periodStartDate) >= 0 &&
-                     endDate.compare(periodEndDate) <= 0) {
-              iconType = "end";
-              date = dateFormatter.formatDate(endPreviousDay);
-          } else {
-              iconType = "continue";
-              hideElement(allDayDateLabel);
-          }
+            let date = "";
+            let iconType = "";
+            let allDayDateLabel = document.getAnonymousElementByAttribute(this, "anonid", "agenda-allDayEvent-date");
+            setBooleanAttribute(allDayDateLabel, "hidden", !showDate);
+            if (startDate.compare(endPreviousDay) == 0) {
+                // All day event one day duration.
+                date = dateFormatter.formatDate(startDate);
+            } else if (startDate.compare(periodStartDate) >= 0 &&
+                 startDate.compare(periodEndDate) <= 0) {
+                // All day event spanning multiple days.
+                iconType = "start";
+                date = dateFormatter.formatDate(startDate);
+            } else if (endDate.compare(periodStartDate) >= 0 &&
+                       endDate.compare(periodEndDate) <= 0) {
+                iconType = "end";
+                date = dateFormatter.formatDate(endPreviousDay);
+            } else {
+                iconType = "continue";
+                hideElement(allDayDateLabel);
+            }
 
-          let multiDayImage = document.getAnonymousElementByAttribute(this, "anonid", "agenda-multiDayEvent-image");
-          multiDayImage.setAttribute("type", iconType);
-          // class wrap causes allday items to wrap its text in today-pane
-          let addWrap = document.getAnonymousElementByAttribute(this.mAllDayItem, "anonid", "eventbox");
-          addWrap.classList.add("wrap");
-          addWrap = document.getAnonymousElementByAttribute(this.mAllDayItem, "anonid", "event-detail-box");
-          addWrap.classList.add("wrap");
-          allDayDateLabel.value = date;
+            let multiDayImage = document.getAnonymousElementByAttribute(this, "anonid", "agenda-multiDayEvent-image");
+            multiDayImage.setAttribute("type", iconType);
+            // class wrap causes allday items to wrap its text in today-pane
+            let addWrap = document.getAnonymousElementByAttribute(this.mAllDayItem, "anonid", "eventbox");
+            addWrap.classList.add("wrap");
+            addWrap = document.getAnonymousElementByAttribute(this.mAllDayItem, "anonid", "event-detail-box");
+            addWrap.classList.add("wrap");
+            allDayDateLabel.value = date;
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="dragstart" phase="capturing"><![CDATA[
-        invokeEventDragSession(this.mAllDayItem.occurrence.clone(), this);
-        event.stopPropagation();
-        event.preventDefault();
+          invokeEventDragSession(this.mAllDayItem.occurrence.clone(), this);
+          event.stopPropagation();
+          event.preventDefault();
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="agenda-richlist-item"
            extends="chrome://calendar/content/agenda-listbox.xml#agenda-base-richlist-item">
     <content tooltip="itemTooltip">
       <xul:hbox anonid="agenda-container-box" class="agenda-container-box" xbl:inherits="selected,disabled,current" flex="1">
@@ -197,95 +197,95 @@
       </xul:hbox>
     </content>
 
     <implementation>
       <method name="setOccurrence">
         <parameter name="aItem"/>
         <parameter name="aPeriod"/>
         <body><![CDATA[
-          this.mOccurrence = aItem;
-          this.setAttribute("status", aItem.status);
-          let dateFormatter = Components.classes["@mozilla.org/calendar/datetime-formatter;1"]
-                                        .getService(Components.interfaces.calIDateTimeFormatter);
+            this.mOccurrence = aItem;
+            this.setAttribute("status", aItem.status);
+            let dateFormatter = Components.classes["@mozilla.org/calendar/datetime-formatter;1"]
+                                          .getService(Components.interfaces.calIDateTimeFormatter);
 
-          let periodStartDate = aPeriod.start.clone();
-          periodStartDate.isDate = true;
-          let periodEndDate = aPeriod.end.clone();
-          periodEndDate.day--;
-          let start = this.mOccurrence[cal.calGetStartDateProp(this.mOccurrence)]
+            let periodStartDate = aPeriod.start.clone();
+            periodStartDate.isDate = true;
+            let periodEndDate = aPeriod.end.clone();
+            periodEndDate.day--;
+            let start = this.mOccurrence[cal.calGetStartDateProp(this.mOccurrence)]
+                            .getInTimezone(cal.calendarDefaultTimezone());
+            let end = this.mOccurrence[cal.calGetEndDateProp(this.mOccurrence)]
                           .getInTimezone(cal.calendarDefaultTimezone());
-          let end = this.mOccurrence[cal.calGetEndDateProp(this.mOccurrence)]
-                        .getInTimezone(cal.calendarDefaultTimezone());
-          let startDate = start.clone();
-          startDate.isDate = true;
-          let endDate = end.clone();
-          endDate.isDate = true;
-          let endAtMidnight = (end.hour == 0 && end.minute == 0);
-          if (endAtMidnight) {
-              endDate.day--;
-          }
-          // Show items's date for long periods but also for "Upcoming"
-          // period with one day duration.
-          let longFormat = aPeriod.multiday || aPeriod.duration > 1;
+            let startDate = start.clone();
+            startDate.isDate = true;
+            let endDate = end.clone();
+            endDate.isDate = true;
+            let endAtMidnight = (end.hour == 0 && end.minute == 0);
+            if (endAtMidnight) {
+                endDate.day--;
+            }
+            // Show items's date for long periods but also for "Upcoming"
+            // period with one day duration.
+            let longFormat = aPeriod.multiday || aPeriod.duration > 1;
 
-          let duration = "";
-          let iconType = "";
-          if (startDate.compare(endDate) == 0) {
-              // event that starts and ends in the same day, midnight included
-              duration = longFormat ? dateFormatter.formatDateTime(start)
-                                    : dateFormatter.formatTime(start);
-          } else if (startDate.compare(periodStartDate) >= 0 &&
-                     startDate.compare(periodEndDate) <= 0) {
-              // event spanning multiple days, start date within period
-              iconType = "start";
-              duration = longFormat ? dateFormatter.formatDateTime(start)
-                                    : dateFormatter.formatTime(start);
-          } else if (endDate.compare(periodStartDate) >= 0 &&
-                     endDate.compare(periodEndDate) <= 0) {
-              // event spanning multiple days, end date within period
-              iconType = "end";
-              if (endAtMidnight) {
-                  duration = dateFormatter.formatDate(endDate) + " ";
-                  duration = longFormat ? duration + cal.calGetString("dateFormat", "midnight")
-                                        : cal.calGetString("dateFormat", "midnight");
-              } else {
-                  duration = longFormat ? dateFormatter.formatDateTime(end)
-                                        : dateFormatter.formatTime(end);
-              }
-          } else {
-              iconType = "continue";
-          }
-          let multiDayImage = document.getAnonymousElementByAttribute(this, "anonid", "agenda-multiDayEvent-image");
-          multiDayImage.setAttribute("type", iconType);
-          let durationbox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-event-start");
-          durationbox.textContent = duration;
+            let duration = "";
+            let iconType = "";
+            if (startDate.compare(endDate) == 0) {
+                // event that starts and ends in the same day, midnight included
+                duration = longFormat ? dateFormatter.formatDateTime(start)
+                                      : dateFormatter.formatTime(start);
+            } else if (startDate.compare(periodStartDate) >= 0 &&
+                       startDate.compare(periodEndDate) <= 0) {
+                // event spanning multiple days, start date within period
+                iconType = "start";
+                duration = longFormat ? dateFormatter.formatDateTime(start)
+                                      : dateFormatter.formatTime(start);
+            } else if (endDate.compare(periodStartDate) >= 0 &&
+                       endDate.compare(periodEndDate) <= 0) {
+                // event spanning multiple days, end date within period
+                iconType = "end";
+                if (endAtMidnight) {
+                    duration = dateFormatter.formatDate(endDate) + " ";
+                    duration = longFormat ? duration + cal.calGetString("dateFormat", "midnight")
+                                          : cal.calGetString("dateFormat", "midnight");
+                } else {
+                    duration = longFormat ? dateFormatter.formatDateTime(end)
+                                          : dateFormatter.formatTime(end);
+                }
+            } else {
+                iconType = "continue";
+            }
+            let multiDayImage = document.getAnonymousElementByAttribute(this, "anonid", "agenda-multiDayEvent-image");
+            multiDayImage.setAttribute("type", iconType);
+            let durationbox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-event-start");
+            durationbox.textContent = duration;
 
-          // show items with time only (today & tomorrow) as one line.
-          if (longFormat) {
-              let titlebox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-event-title");
-              titlebox.textContent = aItem.title;
-          } else {
-              durationbox.textContent += " " + aItem.title;
-          }
-          this.refreshColor();
+            // show items with time only (today & tomorrow) as one line.
+            if (longFormat) {
+                let titlebox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-event-title");
+                titlebox.textContent = aItem.title;
+            } else {
+                durationbox.textContent += " " + aItem.title;
+            }
+            this.refreshColor();
         ]]></body>
       </method>
 
       <method name="refreshColor">
         <body><![CDATA[
-          let calcolor = (this.mOccurrence &&
-                           this.mOccurrence.calendar.getProperty("color")) ||
-                          "#a8c2e1";
+            let calcolor = (this.mOccurrence &&
+                             this.mOccurrence.calendar.getProperty("color")) ||
+                            "#a8c2e1";
 
-          let imagebox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-calendar-image");
-          imagebox.setAttribute("style", "background-color: " + calcolor + ";");
+            let imagebox = document.getAnonymousElementByAttribute(this, "anonid", "agenda-calendar-image");
+            imagebox.setAttribute("style", "background-color: " + calcolor + ";");
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="dragstart"><![CDATA[
-        invokeEventDragSession(this.mOccurrence.clone(), this);
+          invokeEventDragSession(this.mOccurrence.clone(), this);
       ]]></handler>
     </handlers>
   </binding>
 </bindings>
--- a/calendar/base/content/calendar-base-view.xml
+++ b/calendar/base/content/calendar-base-view.xml
@@ -37,244 +37,244 @@
       <field name="mDropShadows">null</field>
       <field name="mMagnifyAmount">0</field>
       <field name="mPixelScrollDelta">0</field>
       <field name="mViewStart">null</field>
       <field name="mViewEnd">null</field>
       <field name="mToggleStatus">0</field>
       <field name="mLog">null</field>
       <field name="mToggleStatusFlag"><![CDATA[
-      ({
-          WorkdaysOnly: 1,
-          TasksInView: 2,
-          ShowCompleted: 4,
-      })
+        ({
+            WorkdaysOnly: 1,
+            TasksInView: 2,
+            ShowCompleted: 4,
+        })
       ]]></field>
 
       <field name="mPrefObserver"><![CDATA[
-      ({
-          calView: this,
-          observe: function(subj, topic, pref) {
-              this.calView.handlePreference(subj, topic, pref);
-          }
-      })
-      ]]></field>
-
-      <field name="mObserver"><![CDATA[
-        // the calIObserver, calICompositeObserver, and calIAlarmServiceObserver
         ({
-            QueryInterface: XPCOMUtils.generateQI([
-                Components.interfaces.calIObserver,
-                Components.interfaces.calIAlarmServiceObserver,
-                Components.interfaces.calICompositeObserver
-            ]),
-
             calView: this,
-
-            onStartBatch: function() {
-            },
-            onEndBatch: function() {
-            },
-
-            onLoad: function() {
-                this.calView.refresh();
-            },
-
-            onAddItem: function(aItem) {
-                if (cal.isToDo(aItem)) {
-                    if (!aItem.entryDate && !aItem.dueDate) {
-                        return;
-                    }
-                    if (!this.calView.mTasksInView) {
-                        return;
-                    }
-                    if (aItem.isCompleted && !this.calView.mShowCompleted) {
-                        return;
-                    }
-                }
-
-                let occs = aItem.getOccurrencesBetween(this.calView.startDate,
-                                                       this.calView.queryEndDate,
-                                                       {});
-                for (let occ of occs) {
-                    this.calView.doAddItem(occ);
-                }
-            },
-
-            onModifyItem: function(aNewItem, aOldItem) {
-                if (cal.isToDo(aNewItem) && cal.isToDo(aOldItem) &&
-                    !this.calView.mTasksInView) {
-                    return;
-                }
-                let occs;
-
-                if (!cal.isToDo(aOldItem) || aOldItem.entryDate || aOldItem.dueDate) {
-                    occs = aOldItem.getOccurrencesBetween(this.calView.startDate,
-                                                          this.calView.queryEndDate,
-                                                          {});
-                    for (let occ of occs) {
-                        this.calView.doDeleteItem(occ);
-                    }
-                }
-                if (cal.isToDo(aNewItem)) {
-                    if ((!aNewItem.entryDate && !aNewItem.dueDate) || !this.calView.mTasksInView) {
-                        return;
-                    }
-                    if (aNewItem.isCompleted && !this.calView.mShowCompleted) {
-                        return;
-                    }
-                }
-
-                occs = aNewItem.getOccurrencesBetween(this.calView.startDate,
-                                                      this.calView.queryEndDate,
-                                                      {});
-                for (let occ of occs) {
-                    this.calView.doAddItem(occ);
-                }
-            },
-
-            onDeleteItem: function(aItem) {
-                if (cal.isToDo(aItem)) {
-                    if (!this.calView.mTasksInView) {
-                        return;
-                    }
-                    if (!aItem.entryDate && !aItem.dueDate) {
-                        return;
-                    }
-                    if (aItem.isCompleted && !this.calView.mShowCompleted) {
-                        return;
-                    }
-                }
-
-                let occs = aItem.getOccurrencesBetween(this.calView.startDate,
-                                                       this.calView.queryEndDate,
-                                                       {});
-                for (let occ of occs) {
-                    this.calView.doDeleteItem(occ);
-                }
-            },
-
-            onError: function(aCalendar, aErrNo, aMessage) { },
-
-            onPropertyChanged: function(aCalendar, aName, aValue, aOldValue) {
-                switch (aName) {
-                    case "suppressAlarms":
-                        if (!Preferences.get("calendar.alarms.indicator.show", true) ||
-                            aCalendar.getProperty("capabilities.alarms.popup.supported") === false) {
-                            break;
-                        }
-                        // else fall through
-                    case "readOnly":
-                    case "disabled":
-                        // XXXvv we can be smarter about how we handle this stuff
-                        this.calView.refresh();
-                        break;
-                }
-            },
-
-            onPropertyDeleting: function(aCalendar, aName) {
-                // Values are not important here yet.
-                this.onPropertyChanged(aCalendar, aName, null, null);
-            },
-
-            //
-            // calIAlarmServiceObserver stuff
-            //
-            onAlarm: function(aAlarmItem) {
-                this.calView.flashAlarm(aAlarmItem, false);
-            },
-
-            onRemoveAlarmsByItem: function(aItem) {
-                // Stop the flashing for the item.
-                this.calView.flashAlarm(aItem, true);
-            },
-
-            onRemoveAlarmsByCalendar: function(aCalendar) {
-                // Stop the flashing for all items of this calendar
-                for (let key in this.calView.mFlashingEvents) {
-                    let item = this.calView.mFlashingEvents[key];
-                    if (item.calendar.id == aCalendar.id) {
-                        this.calView.flashAlarm(item, true);
-                    }
-                }
-            },
-
-            onAlarmsLoaded: function(aCalendar) {},
-
-            //
-            // calICompositeObserver stuff
-            // XXXvv we can be smarter about how we handle this stuff
-            //
-            onCalendarAdded: function(aCalendar) {
-                if (!aCalendar.getProperty("disabled")) {
-                    this.calView.addItemsFromCalendar(aCalendar);
-                }
-            },
-
-            onCalendarRemoved: function(aCalendar) {
-                if (!aCalendar.getProperty("disabled")) {
-                    this.calView.deleteItemsFromCalendar(aCalendar);
-                }
-            },
-
-            onDefaultCalendarChanged: function(aNewDefaultCalendar) {
-                // don't care, for now
+            observe: function(subj, topic, pref) {
+                this.calView.handlePreference(subj, topic, pref);
             }
         })
       ]]></field>
 
-      <constructor><![CDATA[
-        Components.utils.import("resource://gre/modules/Services.jsm");
-        Components.utils.import("resource://gre/modules/XPCOMUtils.jsm");
-        Components.utils.import("resource://gre/modules/Preferences.jsm");
-        Components.utils.import("resource:///modules/gloda/log4moz.js");
+      <field name="mObserver"><![CDATA[
+          // the calIObserver, calICompositeObserver, and calIAlarmServiceObserver
+          ({
+              QueryInterface: XPCOMUtils.generateQI([
+                  Components.interfaces.calIObserver,
+                  Components.interfaces.calIAlarmServiceObserver,
+                  Components.interfaces.calICompositeObserver
+              ]),
+
+              calView: this,
+
+              onStartBatch: function() {
+              },
+              onEndBatch: function() {
+              },
+
+              onLoad: function() {
+                  this.calView.refresh();
+              },
+
+              onAddItem: function(aItem) {
+                  if (cal.isToDo(aItem)) {
+                      if (!aItem.entryDate && !aItem.dueDate) {
+                          return;
+                      }
+                      if (!this.calView.mTasksInView) {
+                          return;
+                      }
+                      if (aItem.isCompleted && !this.calView.mShowCompleted) {
+                          return;
+                      }
+                  }
+
+                  let occs = aItem.getOccurrencesBetween(this.calView.startDate,
+                                                         this.calView.queryEndDate,
+                                                         {});
+                  for (let occ of occs) {
+                      this.calView.doAddItem(occ);
+                  }
+              },
+
+              onModifyItem: function(aNewItem, aOldItem) {
+                  if (cal.isToDo(aNewItem) && cal.isToDo(aOldItem) &&
+                      !this.calView.mTasksInView) {
+                      return;
+                  }
+                  let occs;
 
-        const kWorkdaysCommand = "calendar_toggle_workdays_only_command";
-        const kTasksInViewCommand = "calendar_toggle_tasks_in_view_command";
-        const kShowCompleted = "calendar_toggle_show_completed_in_view_command";
-        const kOrientation = "calendar_toggle_orientation_command";
+                  if (!cal.isToDo(aOldItem) || aOldItem.entryDate || aOldItem.dueDate) {
+                      occs = aOldItem.getOccurrencesBetween(this.calView.startDate,
+                                                            this.calView.queryEndDate,
+                                                            {});
+                      for (let occ of occs) {
+                          this.calView.doDeleteItem(occ);
+                      }
+                  }
+                  if (cal.isToDo(aNewItem)) {
+                      if ((!aNewItem.entryDate && !aNewItem.dueDate) || !this.calView.mTasksInView) {
+                          return;
+                      }
+                      if (aNewItem.isCompleted && !this.calView.mShowCompleted) {
+                          return;
+                      }
+                  }
+
+                  occs = aNewItem.getOccurrencesBetween(this.calView.startDate,
+                                                        this.calView.queryEndDate,
+                                                        {});
+                  for (let occ of occs) {
+                      this.calView.doAddItem(occ);
+                  }
+              },
+
+              onDeleteItem: function(aItem) {
+                  if (cal.isToDo(aItem)) {
+                      if (!this.calView.mTasksInView) {
+                          return;
+                      }
+                      if (!aItem.entryDate && !aItem.dueDate) {
+                          return;
+                      }
+                      if (aItem.isCompleted && !this.calView.mShowCompleted) {
+                          return;
+                      }
+                  }
+
+                  let occs = aItem.getOccurrencesBetween(this.calView.startDate,
+                                                         this.calView.queryEndDate,
+                                                         {});
+                  for (let occ of occs) {
+                      this.calView.doDeleteItem(occ);
+                  }
+              },
+
+              onError: function(aCalendar, aErrNo, aMessage) { },
 
-        this.workdaysOnly = (document.getElementById(kWorkdaysCommand)
-                                .getAttribute("checked") == "true");
-        this.tasksInView = (document.getElementById(kTasksInViewCommand)
-                                .getAttribute("checked") == "true");
-        this.rotated = (document.getElementById(kOrientation)
-                                .getAttribute("checked") == "true");
-        this.showCompleted = (document.getElementById(kShowCompleted)
-                                .getAttribute("checked") == "true");
+              onPropertyChanged: function(aCalendar, aName, aValue, aOldValue) {
+                  switch (aName) {
+                      case "suppressAlarms":
+                          if (!Preferences.get("calendar.alarms.indicator.show", true) ||
+                              aCalendar.getProperty("capabilities.alarms.popup.supported") === false) {
+                              break;
+                          }
+                          // else fall through
+                      case "readOnly":
+                      case "disabled":
+                          // XXXvv we can be smarter about how we handle this stuff
+                          this.calView.refresh();
+                          break;
+                  }
+              },
+
+              onPropertyDeleting: function(aCalendar, aName) {
+                  // Values are not important here yet.
+                  this.onPropertyChanged(aCalendar, aName, null, null);
+              },
+
+              //
+              // calIAlarmServiceObserver stuff
+              //
+              onAlarm: function(aAlarmItem) {
+                  this.calView.flashAlarm(aAlarmItem, false);
+              },
+
+              onRemoveAlarmsByItem: function(aItem) {
+                  // Stop the flashing for the item.
+                  this.calView.flashAlarm(aItem, true);
+              },
+
+              onRemoveAlarmsByCalendar: function(aCalendar) {
+                  // Stop the flashing for all items of this calendar
+                  for (let key in this.calView.mFlashingEvents) {
+                      let item = this.calView.mFlashingEvents[key];
+                      if (item.calendar.id == aCalendar.id) {
+                          this.calView.flashAlarm(item, true);
+                      }
+                  }
+              },
+
+              onAlarmsLoaded: function(aCalendar) {},
 
-        this.mTimezone = cal.calendarDefaultTimezone();
-        let alarmService = Components.classes["@mozilla.org/calendar/alarm-service;1"]
-                                     .getService(Components.interfaces.calIAlarmService);
-        alarmService.addObserver(this.mObserver);
-        this.setAttribute("type", this.type);
-        this.mResizeHandler = () => {
-            this.onResize(this);
-        };
-        this.viewBroadcaster.addEventListener(this.getAttribute("type") + "viewresized", this.mResizeHandler, true);
-        // add a preference observer to monitor changes
-        Services.prefs.addObserver("calendar.", this.mPrefObserver);
-        this.weekStartOffset = Preferences.get("calendar.week.start", 0);
-        this.updateDaysOffPrefs();
-        this.mPendingRefreshJobs = new Map();
-        this.mLog = Log4Moz.getConfiguredLogger("calBaseView");
-        this.mFlashingEvents = {};
+              //
+              // calICompositeObserver stuff
+              // XXXvv we can be smarter about how we handle this stuff
+              //
+              onCalendarAdded: function(aCalendar) {
+                  if (!aCalendar.getProperty("disabled")) {
+                      this.calView.addItemsFromCalendar(aCalendar);
+                  }
+              },
+
+              onCalendarRemoved: function(aCalendar) {
+                  if (!aCalendar.getProperty("disabled")) {
+                      this.calView.deleteItemsFromCalendar(aCalendar);
+                  }
+              },
+
+              onDefaultCalendarChanged: function(aNewDefaultCalendar) {
+                  // don't care, for now
+              }
+          })
+      ]]></field>
+
+      <constructor><![CDATA[
+          Components.utils.import("resource://gre/modules/Services.jsm");
+          Components.utils.import("resource://gre/modules/XPCOMUtils.jsm");
+          Components.utils.import("resource://gre/modules/Preferences.jsm");
+          Components.utils.import("resource:///modules/gloda/log4moz.js");
+
+          const kWorkdaysCommand = "calendar_toggle_workdays_only_command";
+          const kTasksInViewCommand = "calendar_toggle_tasks_in_view_command";
+          const kShowCompleted = "calendar_toggle_show_completed_in_view_command";
+          const kOrientation = "calendar_toggle_orientation_command";
+
+          this.workdaysOnly = (document.getElementById(kWorkdaysCommand)
+                                  .getAttribute("checked") == "true");
+          this.tasksInView = (document.getElementById(kTasksInViewCommand)
+                                  .getAttribute("checked") == "true");
+          this.rotated = (document.getElementById(kOrientation)
+                                  .getAttribute("checked") == "true");
+          this.showCompleted = (document.getElementById(kShowCompleted)
+                                  .getAttribute("checked") == "true");
+
+          this.mTimezone = cal.calendarDefaultTimezone();
+          let alarmService = Components.classes["@mozilla.org/calendar/alarm-service;1"]
+                                       .getService(Components.interfaces.calIAlarmService);
+          alarmService.addObserver(this.mObserver);
+          this.setAttribute("type", this.type);
+          this.mResizeHandler = () => {
+              this.onResize(this);
+          };
+          this.viewBroadcaster.addEventListener(this.getAttribute("type") + "viewresized", this.mResizeHandler, true);
+          // add a preference observer to monitor changes
+          Services.prefs.addObserver("calendar.", this.mPrefObserver);
+          this.weekStartOffset = Preferences.get("calendar.week.start", 0);
+          this.updateDaysOffPrefs();
+          this.mPendingRefreshJobs = new Map();
+          this.mLog = Log4Moz.getConfiguredLogger("calBaseView");
+          this.mFlashingEvents = {};
       ]]></constructor>
 
       <destructor><![CDATA[
-        Components.utils.import("resource://gre/modules/Services.jsm");
+          Components.utils.import("resource://gre/modules/Services.jsm");
 
-        if (this.mCalendar) {
-            this.mCalendar.removeObserver(this.mObserver);
-        }
-        let alarmService = Components.classes["@mozilla.org/calendar/alarm-service;1"]
-                                     .getService(Components.interfaces.calIAlarmService);
-        alarmService.removeObserver(this.mObserver);
-        this.viewBroadcaster.removeEventListener(this.getAttribute("type") + "viewresized", this.mResizeHandler, true);
-        Services.prefs.removeObserver("calendar.", this.mPrefObserver);
+          if (this.mCalendar) {
+              this.mCalendar.removeObserver(this.mObserver);
+          }
+          let alarmService = Components.classes["@mozilla.org/calendar/alarm-service;1"]
+                                       .getService(Components.interfaces.calIAlarmService);
+          alarmService.removeObserver(this.mObserver);
+          this.viewBroadcaster.removeEventListener(this.getAttribute("type") + "viewresized", this.mResizeHandler, true);
+          Services.prefs.removeObserver("calendar.", this.mPrefObserver);
       ]]></destructor>
 
       <property name="type" readonly="true">
         <getter><![CDATA[
             let typelist = this.id.split("-");
             return typelist[0];
         ]]></getter>
       </property>
@@ -331,422 +331,422 @@
       <property name="rangeEndDate"
                 onget="return this.mRangeEndDate;"
                 onset="return (this.mRangeEndDate = val);"/>
       <property name="observerID" readonly="true"
                 onget="return 'base-view-observer';"/>
 
       <property name="weekStartOffset">
         <getter><![CDATA[
-           return this.mWeekStartOffset;
+            return this.mWeekStartOffset;
         ]]></getter>
         <setter><![CDATA[
-           this.mWeekStartOffset = val;
-           return val;
+            this.mWeekStartOffset = val;
+            return val;
         ]]></setter>
       </property>
 
       <property name="displayCalendar">
         <getter><![CDATA[
-          return this.mCalendar;
+            return this.mCalendar;
         ]]></getter>
         <setter><![CDATA[
-          if (this.mCalendar) {
-              this.mCalendar.removeObserver(this.mObserver);
-          }
-          this.mCalendar = val;
-          this.mCalendar.addObserver(this.mObserver);
-          this.refresh();
-          return val;
+            if (this.mCalendar) {
+                this.mCalendar.removeObserver(this.mObserver);
+            }
+            this.mCalendar = val;
+            this.mCalendar.addObserver(this.mObserver);
+            this.refresh();
+            return val;
         ]]></setter>
       </property>
 
       <property name="initialized">
         <getter><![CDATA[
-          let retval;
+            let retval;
 
-          // Some views throw when accessing an uninitialized startDay
-          try {
-              retval = this.displayCalendar && this.startDay &&
-                       this.endDay;
-          } catch (ex) {
-              return false;
-          }
-          return retval;
+            // Some views throw when accessing an uninitialized startDay
+            try {
+                retval = this.displayCalendar && this.startDay &&
+                         this.endDay;
+            } catch (ex) {
+                return false;
+            }
+            return retval;
         ]]></getter>
       </property>
 
       <method name="goToDay">
         <parameter name="aDate"/>
         <body><![CDATA[
-          this.showDate(aDate);
+            this.showDate(aDate);
         ]]></body>
       </method>
 
       <method name="getRangeDescription">
         <body><![CDATA[
-          return cal.getDateFormatter().formatInterval(this.rangeStartDate, this.rangeEndDate);
+            return cal.getDateFormatter().formatInterval(this.rangeStartDate, this.rangeEndDate);
         ]]></body>
       </method>
 
       <!-- This function guarantees that the
        labels are clipped in the instance that the overflow occurrs,
        avoiding horizontal scrollbars from showing up for a short period. -->
       <method name="adjustWeekdayLength">
         <parameter name="forceShortName"/>
         <body><![CDATA[
-          let useShortNames = false;
-          let labeldayboxkids = this.labeldaybox.childNodes;
-          if (!labeldayboxkids || !labeldayboxkids[0]) {
-              useShortNames = true;
-          } else if (forceShortName && forceShortName === true) {
-              useShortNames = true;
-          } else {
-              let clientWidth = document.getAnonymousElementByAttribute(this, "anonid", "mainbox").clientWidth;
-              let timespacer = document.getAnonymousElementByAttribute(this, "anonid", "headertimespacer");
-              if (timespacer) {
-                  clientWidth -= timespacer.clientWidth;
-              }
-              if (this.getLongWeekdayTotalPixels() > 0.95 * clientWidth) {
-                  useShortNames = true;
-              }
-          }
-          for (let i = 0; i < labeldayboxkids.length; i++) {
-              labeldayboxkids[i].shortWeekNames = useShortNames;
-          }
+            let useShortNames = false;
+            let labeldayboxkids = this.labeldaybox.childNodes;
+            if (!labeldayboxkids || !labeldayboxkids[0]) {
+                useShortNames = true;
+            } else if (forceShortName && forceShortName === true) {
+                useShortNames = true;
+            } else {
+                let clientWidth = document.getAnonymousElementByAttribute(this, "anonid", "mainbox").clientWidth;
+                let timespacer = document.getAnonymousElementByAttribute(this, "anonid", "headertimespacer");
+                if (timespacer) {
+                    clientWidth -= timespacer.clientWidth;
+                }
+                if (this.getLongWeekdayTotalPixels() > 0.95 * clientWidth) {
+                    useShortNames = true;
+                }
+            }
+            for (let i = 0; i < labeldayboxkids.length; i++) {
+                labeldayboxkids[i].shortWeekNames = useShortNames;
+            }
         ]]></body>
       </method>
 
       <method name="today">
         <body><![CDATA[
-          let date = cal.jsDateToDateTime(new Date()).getInTimezone(this.mTimezone);
-          date.isDate = true;
-          return date;
+            let date = cal.jsDateToDateTime(new Date()).getInTimezone(this.mTimezone);
+            date.isDate = true;
+            return date;
         ]]></body>
       </method>
 
       <method name="isVisible">
         <body><![CDATA[
             return (this.nodeName == currentView().nodeName);
         ]]></body>
       </method>
 
       <method name="refresh">
         <body><![CDATA[
-          if (this.isVisible()) {
-              this.addItemsFromCalendar(this.mCalendar);
-          }
+            if (this.isVisible()) {
+                this.addItemsFromCalendar(this.mCalendar);
+            }
         ]]></body>
       </method>
 
       <!-- force refresh visible and invisible views.
            This method is added because when only a preference is toggled, the start
            and end date of views are unchanged, therefore those views behind the
            "scene" might stay the same upon switch to them. -->
       <method name="forceRefresh">
         <body><![CDATA[
-          this.addItemsFromCalendar(this.mCalendar);
+            this.addItemsFromCalendar(this.mCalendar);
         ]]></body>
       </method>
 
       <method name="addItemsFromCalendar">
         <parameter name="aCalendar"/>
         <body><![CDATA[
-          let refreshJob = {
-              QueryInterface: XPCOMUtils.generateQI([Components.interfaces.calIOperationListener]),
-              calView: this,
-              calendar: null,
-              calId: null,
-              operation: null,
-              cancelled: false,
+            let refreshJob = {
+                QueryInterface: XPCOMUtils.generateQI([Components.interfaces.calIOperationListener]),
+                calView: this,
+                calendar: null,
+                calId: null,
+                operation: null,
+                cancelled: false,
 
-              onOperationComplete: function(aOpCalendar, aStatus, aOperationType, aId, aDateTime) {
-                  this.calView.mLog.info("Refresh complete of calendar " + this.calId);
-                  if (this.calView.mPendingRefreshJobs.has(this.calId)) {
-                      this.calView.mPendingRefreshJobs.delete(this.calId);
-                  }
+                onOperationComplete: function(aOpCalendar, aStatus, aOperationType, aId, aDateTime) {
+                    this.calView.mLog.info("Refresh complete of calendar " + this.calId);
+                    if (this.calView.mPendingRefreshJobs.has(this.calId)) {
+                        this.calView.mPendingRefreshJobs.delete(this.calId);
+                    }
 
-                  if (!this.cancelled) {
-                      // Fire event
-                      this.calView.fireEvent("viewloaded", aOperationType);
-                  }
-              },
+                    if (!this.cancelled) {
+                        // Fire event
+                        this.calView.fireEvent("viewloaded", aOperationType);
+                    }
+                },
 
-              onGetResult: function(aOpCalendar, aStatus, aItemType, aDetail, aCount, aItems) {
-                  if (this.cancelled || !Components.isSuccessCode(aStatus)) {
-                      return;
-                  }
+                onGetResult: function(aOpCalendar, aStatus, aItemType, aDetail, aCount, aItems) {
+                    if (this.cancelled || !Components.isSuccessCode(aStatus)) {
+                        return;
+                    }
 
-                  for (let item of aItems) {
-                      if (!cal.isToDo(item) || item.entryDate || item.dueDate) {
-                          this.calView.doAddItem(item);
-                      }
-                  }
-              },
+                    for (let item of aItems) {
+                        if (!cal.isToDo(item) || item.entryDate || item.dueDate) {
+                            this.calView.doAddItem(item);
+                        }
+                    }
+                },
 
-              cancel: function() {
-                  this.calView.mLog.info("Refresh cancelled for calendar " + this.calId);
-                  this.cancelled = true;
-                  let operation = cal.wrapInstance(this.operation, Components.interfaces.calIOperation);
-                  if (operation && operation.isPending) {
-                      operation.cancel();
-                      this.operation = null;
-                  }
-              },
+                cancel: function() {
+                    this.calView.mLog.info("Refresh cancelled for calendar " + this.calId);
+                    this.cancelled = true;
+                    let operation = cal.wrapInstance(this.operation, Components.interfaces.calIOperation);
+                    if (operation && operation.isPending) {
+                        operation.cancel();
+                        this.operation = null;
+                    }
+                },
 
-              execute: function() {
-                  if (!this.calView.startDate || !this.calView.endDate || !aCalendar) {
-                      return;
-                  }
+                execute: function() {
+                    if (!this.calView.startDate || !this.calView.endDate || !aCalendar) {
+                        return;
+                    }
 
-                  if (aCalendar.type == "composite") {
-                      // we're refreshing from the composite calendar, so we can cancel
-                      // all other pending refresh jobs.
-                      this.calView.mLog.info("Refreshing composite calendar, cancelling all pending refreshes");
-                      this.calId = "composite";
-                      for (let job of this.calView.mPendingRefreshJobs.values()) {
-                          job.cancel();
-                      }
-                      this.calView.mPendingRefreshJobs.clear();
-                      this.calView.relayout();
-                  } else {
-                      this.calId = aCalendar.id;
-                      if (this.calView.mPendingRefreshJobs.has(this.calId)) {
-                          this.calView.mPendingRefreshJobs.get(this.calId).cancel();
-                          this.calView.mPendingRefreshJobs.delete(this.calId);
-                      }
-                  }
-                  this.calendar = aCalendar;
+                    if (aCalendar.type == "composite") {
+                        // we're refreshing from the composite calendar, so we can cancel
+                        // all other pending refresh jobs.
+                        this.calView.mLog.info("Refreshing composite calendar, cancelling all pending refreshes");
+                        this.calId = "composite";
+                        for (let job of this.calView.mPendingRefreshJobs.values()) {
+                            job.cancel();
+                        }
+                        this.calView.mPendingRefreshJobs.clear();
+                        this.calView.relayout();
+                    } else {
+                        this.calId = aCalendar.id;
+                        if (this.calView.mPendingRefreshJobs.has(this.calId)) {
+                            this.calView.mPendingRefreshJobs.get(this.calId).cancel();
+                            this.calView.mPendingRefreshJobs.delete(this.calId);
+                        }
+                    }
+                    this.calendar = aCalendar;
 
-                  // start our items query; for a disjoint date range
-                  // we get all the items, and just filter out the ones we don't
-                  // care about in addItem
-                  let filter = this.calendar.ITEM_FILTER_CLASS_OCCURRENCES;
-                  if (this.calView.mShowCompleted) {
-                      filter |= this.calendar.ITEM_FILTER_COMPLETED_ALL;
-                  } else {
-                      filter |= this.calendar.ITEM_FILTER_COMPLETED_NO;
-                  }
+                    // start our items query; for a disjoint date range
+                    // we get all the items, and just filter out the ones we don't
+                    // care about in addItem
+                    let filter = this.calendar.ITEM_FILTER_CLASS_OCCURRENCES;
+                    if (this.calView.mShowCompleted) {
+                        filter |= this.calendar.ITEM_FILTER_COMPLETED_ALL;
+                    } else {
+                        filter |= this.calendar.ITEM_FILTER_COMPLETED_NO;
+                    }
 
-                  if (this.calView.mTasksInView) {
-                      filter |= this.calendar.ITEM_FILTER_TYPE_ALL;
-                  } else {
-                      filter |= this.calendar.ITEM_FILTER_TYPE_EVENT;
-                  }
+                    if (this.calView.mTasksInView) {
+                        filter |= this.calendar.ITEM_FILTER_TYPE_ALL;
+                    } else {
+                        filter |= this.calendar.ITEM_FILTER_TYPE_EVENT;
+                    }
 
-                  let operation = this.calendar.getItems(filter,
-                                                         0,
-                                                         this.calView.startDate,
-                                                         this.calView.queryEndDate,
-                                                         this);
-                  operation = cal.wrapInstance(operation, Components.interfaces.calIOperation);
-                  if (operation && operation.isPending) {
-                      this.operation = operation;
-                      this.calView.mPendingRefreshJobs.set(this.calId, this);
-                  }
-              }
-          };
+                    let operation = this.calendar.getItems(filter,
+                                                           0,
+                                                           this.calView.startDate,
+                                                           this.calView.queryEndDate,
+                                                           this);
+                    operation = cal.wrapInstance(operation, Components.interfaces.calIOperation);
+                    if (operation && operation.isPending) {
+                        this.operation = operation;
+                        this.calView.mPendingRefreshJobs.set(this.calId, this);
+                    }
+                }
+            };
 
-          refreshJob.execute();
+            refreshJob.execute();
         ]]></body>
       </method>
 
       <method name="deleteItemsFromCalendar">
         <parameter name="aCalendar"/>
         <body><![CDATA[
-          /* This method must be implemented in subclasses. */
-          throw Components.results.NS_ERROR_NOT_IMPLEMENTED;
+            /* This method must be implemented in subclasses. */
+            throw Components.results.NS_ERROR_NOT_IMPLEMENTED;
         ]]></body>
       </method>
 
       <!-- the end date that should be used for getItems and similar queries -->
       <property name="queryEndDate" readonly="true">
         <getter><![CDATA[
-          let end = this.endDate;
-          if (!end) {
-              return null;
-          }
-          end = end.clone();
-          end.day += 1;
-          end.isDate = true;
-          return end;
+            let end = this.endDate;
+            if (!end) {
+                return null;
+            }
+            end = end.clone();
+            end.day += 1;
+            end.isDate = true;
+            return end;
         ]]></getter>
       </property>
 
       <method name="fireEvent">
         <parameter name="aEventName"/>
         <parameter name="aEventDetail"/>
         <body><![CDATA[
-          let event = document.createEvent("Events");
-          event.initEvent(aEventName, true, false);
-          event.detail = aEventDetail;
-          this.dispatchEvent(event);
+            let event = document.createEvent("Events");
+            event.initEvent(aEventName, true, false);
+            event.detail = aEventDetail;
+            this.dispatchEvent(event);
         ]]></body>
       </method>
 
       <method name="removeDropShadows">
         <body><![CDATA[
-          let dropbox = document.getAnonymousElementByAttribute(this, "dropbox", "true");
-          if (dropbox && dropbox !== undefined) {
-              dropbox.setAttribute("dropbox", "false");
-          }
+            let dropbox = document.getAnonymousElementByAttribute(this, "dropbox", "true");
+            if (dropbox && dropbox !== undefined) {
+                dropbox.setAttribute("dropbox", "false");
+            }
         ]]></body>
       </method>
 
       <method name="getLongWeekdayTotalPixels">
         <body><![CDATA[
-          if (this.mLongWeekdayTotalPixels <= 0) {
-              let maxDayWidth = 0;
-              for (let label of this.labeldaybox.childNodes) {
-                  if (label.localName && label.localName == "calendar-day-label") {
-                      label.shortWeekNames = false;
-                      let curPixelLength = label.getLongWeekdayPixels();
-                      maxDayWidth = Math.max(maxDayWidth, curPixelLength);
-                  }
-              }
-              if (maxDayWidth > 0) {
-                  this.mLongWeekdayTotalPixels = (maxDayWidth * this.labeldaybox.childNodes.length) + 10;
-              }
-          }
-          return this.mLongWeekdayTotalPixels;
+            if (this.mLongWeekdayTotalPixels <= 0) {
+                let maxDayWidth = 0;
+                for (let label of this.labeldaybox.childNodes) {
+                    if (label.localName && label.localName == "calendar-day-label") {
+                        label.shortWeekNames = false;
+                        let curPixelLength = label.getLongWeekdayPixels();
+                        maxDayWidth = Math.max(maxDayWidth, curPixelLength);
+                    }
+                }
+                if (maxDayWidth > 0) {
+                    this.mLongWeekdayTotalPixels = (maxDayWidth * this.labeldaybox.childNodes.length) + 10;
+                }
+            }
+            return this.mLongWeekdayTotalPixels;
         ]]></body>
       </method>
 
       <!-- A preference handler which is called by the preference observer.
            Can be overwritten in derived bindings. -->
       <method name="handleCommonPreference">
         <parameter name="aSubject"/>
         <parameter name="aTopic"/>
         <parameter name="aPreference"/>
         <body><![CDATA[
-          // refresh view if categories seem to have changed
-          if (aPreference.startsWith("calendar.category.color")) {
-              this.refreshView();
-              return;
-          }
-          switch (aPreference) {
-              case "calendar.week.d0sundaysoff":
-              case "calendar.week.d1mondaysoff":
-              case "calendar.week.d2tuesdaysoff":
-              case "calendar.week.d3wednesdaysoff":
-              case "calendar.week.d4thursdaysoff":
-              case "calendar.week.d5fridaysoff":
-              case "calendar.week.d6saturdaysoff":
-                  this.updateDaysOffPrefs();
-                  break;
-              case "calendar.timezone.local":
-                  this.timezone = cal.calendarDefaultTimezone();
-                  this.refreshView();
-                  break;
-              case "calendar.alarms.indicator.show":
-                  // Break here to ensure the view is refreshed
-                  break;
-              case "calendar.week.start":
-                  this.weekStartOffset = aSubject.getIntPref(aPreference);
-                  break;
-              case "calendar.date.format":
-                  this.refreshView();
-                  break;
-              default:
-                  return;
-          }
-          this.refreshView();
+            // refresh view if categories seem to have changed
+            if (aPreference.startsWith("calendar.category.color")) {
+                this.refreshView();
+                return;
+            }
+            switch (aPreference) {
+                case "calendar.week.d0sundaysoff":
+                case "calendar.week.d1mondaysoff":
+                case "calendar.week.d2tuesdaysoff":
+                case "calendar.week.d3wednesdaysoff":
+                case "calendar.week.d4thursdaysoff":
+                case "calendar.week.d5fridaysoff":
+                case "calendar.week.d6saturdaysoff":
+                    this.updateDaysOffPrefs();
+                    break;
+                case "calendar.timezone.local":
+                    this.timezone = cal.calendarDefaultTimezone();
+                    this.refreshView();
+                    break;
+                case "calendar.alarms.indicator.show":
+                    // Break here to ensure the view is refreshed
+                    break;
+                case "calendar.week.start":
+                    this.weekStartOffset = aSubject.getIntPref(aPreference);
+                    break;
+                case "calendar.date.format":
+                    this.refreshView();
+                    break;
+                default:
+                    return;
+            }
+            this.refreshView();
         ]]></body>
       </method>
 
       <method name="updateDaysOffPrefs">
         <body><![CDATA[
-          const weekPrefix = "calendar.week.";
-          const prefNames = [
-              "d0sundaysoff", "d1mondaysoff", "d2tuesdaysoff",
-              "d3wednesdaysoff", "d4thursdaysoff", "d5fridaysoff",
-              "d6saturdaysoff"
-          ];
-          const defaults = [
-              "true", "false", "false", "false", "false", "false", "true"
-          ];
-          let daysOff = [];
-          for (let i in prefNames) {
-              if (Preferences.get(weekPrefix + prefNames[i], defaults[i])) {
-                  daysOff.push(Number(i));
-              }
-          }
-          this.daysOffArray = daysOff;
+            const weekPrefix = "calendar.week.";
+            const prefNames = [
+                "d0sundaysoff", "d1mondaysoff", "d2tuesdaysoff",
+                "d3wednesdaysoff", "d4thursdaysoff", "d5fridaysoff",
+                "d6saturdaysoff"
+            ];
+            const defaults = [
+                "true", "false", "false", "false", "false", "false", "true"
+            ];
+            let daysOff = [];
+            for (let i in prefNames) {
+                if (Preferences.get(weekPrefix + prefNames[i], defaults[i])) {
+                    daysOff.push(Number(i));
+                }
+            }
+            this.daysOffArray = daysOff;
         ]]></body>
       </method>
 
       <method name="refreshView">
         <body><![CDATA[
-          if (!this.startDay || !this.endDay) {
-              // don't refresh if we're not initialized
-              return;
-          }
-          // Just refresh, the goToDay function will notice
-          this.goToDay(this.selectedDay);
-          this.forceRefresh();
+            if (!this.startDay || !this.endDay) {
+                // don't refresh if we're not initialized
+                return;
+            }
+            // Just refresh, the goToDay function will notice
+            this.goToDay(this.selectedDay);
+            this.forceRefresh();
         ]]></body>
       </method>
 
       <!-- Default implementations follow, these make things easier for
             extensions that don't need certain features. -->
       <method name="handlePreference">
         <parameter name="aSubject"/>
         <parameter name="aTopic"/>
         <parameter name="aPref"/>
         <body><![CDATA[
-          // Do nothing by default
+            // Do nothing by default
         ]]></body>
       </method>
       <method name="setDateRange">
         <parameter name="aStartDate"/>
         <parameter name="aEndDate"/>
         <body><![CDATA[
-          cal.navigationBar.setDateRange(aStartDate, aEndDate);
+            cal.navigationBar.setDateRange(aStartDate, aEndDate);
         ]]></body>
       </method>
 
       <property name="selectedDay"
                 onget="return this.startDate"
                 onset="return this.startDate"/>
 
       <method name="getSelectedItems">
         <parameter name="aCount"/>
         <body><![CDATA[
-          aCount.value = this.mSelectedItems.length;
-          return this.mSelectedItems;
+            aCount.value = this.mSelectedItems.length;
+            return this.mSelectedItems;
         ]]></body>
       </method>
       <method name="setSelectedItems">
         <parameter name="aCount"/>
         <parameter name="aItems"/>
         <body><![CDATA[
-          this.mSelectedItems = aItems.concat([]);
-          return this.mSelectedItems;
+            this.mSelectedItems = aItems.concat([]);
+            return this.mSelectedItems;
         ]]></body>
       </method>
 
       <method name="getDateList">
         <parameter name="aCount"/>
         <parameter name="aDates"/>
         <body><![CDATA[
-          let start = this.startDate.clone();
-          while (start.compare(this.endDate) <= 0) {
-              dates.push(start);
-              start.day++;
-          }
-          aCount.value = dates.length;
-          return dates;
+            let start = this.startDate.clone();
+            while (start.compare(this.endDate) <= 0) {
+                dates.push(start);
+                start.day++;
+            }
+            aCount.value = dates.length;
+            return dates;
         ]]></body>
       </method>
 
       <method name="flashAlarm">
         <parameter name="aAlarmItem"/>
         <parameter name="aStop"/>
         <body><![CDATA[
-          // Do nothing by default
+            // Do nothing by default
         ]]></body>
       </method>
 
       <method name="zoomIn">
         <parameter name="aLevel"/>
         <body><![CDATA[
         ]]></body>
       </method>
@@ -758,98 +758,98 @@
       <method name="zoomReset">
         <body><![CDATA[
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="move"><![CDATA[
-        this.moveView(event.detail);
+          this.moveView(event.detail);
       ]]></handler>
       <handler event="keypress"><![CDATA[
-        const kKE = Components.interfaces.nsIDOMKeyEvent;
-        switch (event.keyCode) {
-            case kKE.DOM_VK_PAGE_UP:
-                this.moveView(-1);
-                break;
-            case kKE.DOM_VK_PAGE_DOWN:
-                this.moveView(1);
-                break;
-        }
+          const kKE = Components.interfaces.nsIDOMKeyEvent;
+          switch (event.keyCode) {
+              case kKE.DOM_VK_PAGE_UP:
+                  this.moveView(-1);
+                  break;
+              case kKE.DOM_VK_PAGE_DOWN:
+                  this.moveView(1);
+                  break;
+          }
       ]]></handler>
       <handler event="wheel"><![CDATA[
-        const pixelThreshold = 150;
-        if (event.shiftKey && Preferences.get("calendar.view.mousescroll", true)) {
-            if (event.deltaMode == event.DOM_DELTA_LINE) {
-                if (event.deltaY != 0) {
-                    deltaView = event.deltaY < 0 ? -1 : 1;
-                }
-            } else if (event.deltaMode == event.DOM_DELTA_PIXEL) {
-                this.mPixelScrollDelta += event.deltaY;
-                if (this.mPixelScrollDelta > pixelThreshold) {
-                    deltaView = 1;
-                    this.mPixelScrollDelta = 0;
-                } else if (this.mPixelScrollDelta < -pixelThreshold) {
-                    deltaView = -1;
-                    this.mPixelScrollDelta = 0;
-                }
-            }
+          const pixelThreshold = 150;
+          if (event.shiftKey && Preferences.get("calendar.view.mousescroll", true)) {
+              if (event.deltaMode == event.DOM_DELTA_LINE) {
+                  if (event.deltaY != 0) {
+                      deltaView = event.deltaY < 0 ? -1 : 1;
+                  }
+              } else if (event.deltaMode == event.DOM_DELTA_PIXEL) {
+                  this.mPixelScrollDelta += event.deltaY;
+                  if (this.mPixelScrollDelta > pixelThreshold) {
+                      deltaView = 1;
+                      this.mPixelScrollDelta = 0;
+                  } else if (this.mPixelScrollDelta < -pixelThreshold) {
+                      deltaView = -1;
+                      this.mPixelScrollDelta = 0;
+                  }
+              }
 
-            if (deltaView != 0) {
-                this.moveView(deltaView);
-            }
-        }
+              if (deltaView != 0) {
+                  this.moveView(deltaView);
+              }
+          }
 
-        // Prevent default scroll handling
-        event.preventDefault();
+          // Prevent default scroll handling
+          event.preventDefault();
       ]]></handler>
       <handler event="MozRotateGesture"><![CDATA[
-        // Threshold for the minimum and maximum angle we should accept
-        // rotation for. 90 degrees minimum is most logical, but 45 degrees
-        // allows you to rotate with one hand.
-        const MIN_ROTATE_ANGLE = 45;
-        const MAX_ROTATE_ANGLE = 180;
+          // Threshold for the minimum and maximum angle we should accept
+          // rotation for. 90 degrees minimum is most logical, but 45 degrees
+          // allows you to rotate with one hand.
+          const MIN_ROTATE_ANGLE = 45;
+          const MAX_ROTATE_ANGLE = 180;
 
-        let absval = Math.abs(event.delta);
-        if (this.supportsRotation &&
-            absval >= MIN_ROTATE_ANGLE &&
-            absval < MAX_ROTATE_ANGLE) {
-            toggleOrientation();
-            event.preventDefault();
-        }
+          let absval = Math.abs(event.delta);
+          if (this.supportsRotation &&
+              absval >= MIN_ROTATE_ANGLE &&
+              absval < MAX_ROTATE_ANGLE) {
+              toggleOrientation();
+              event.preventDefault();
+          }
       ]]></handler>
       <handler event="MozMagnifyGestureStart"><![CDATA[
-        this.mMagnifyAmount = 0;
+          this.mMagnifyAmount = 0;
       ]]></handler>
       <handler event="MozMagnifyGestureUpdate"><![CDATA[
-        // Threshold as to how much magnification causes the zoom to happen
-        const THRESHOLD = 30;
+          // Threshold as to how much magnification causes the zoom to happen
+          const THRESHOLD = 30;
 
-        if (this.supportsZoom) {
-            this.mMagnifyAmount += event.delta;
+          if (this.supportsZoom) {
+              this.mMagnifyAmount += event.delta;
 
-            if (this.mMagnifyAmount > THRESHOLD) {
-                this.zoomOut();
-                this.mMagnifyAmount = 0;
-            } else if (this.mMagnifyAmount < -THRESHOLD) {
-                this.zoomIn();
-                this.mMagnifyAmount = 0;
-            }
-            event.preventDefault();
-        }
+              if (this.mMagnifyAmount > THRESHOLD) {
+                  this.zoomOut();
+                  this.mMagnifyAmount = 0;
+              } else if (this.mMagnifyAmount < -THRESHOLD) {
+                  this.zoomIn();
+                  this.mMagnifyAmount = 0;
+              }
+              event.preventDefault();
+          }
       ]]></handler>
       <handler event="MozSwipeGesture"><![CDATA[
-        if ((event.direction == SimpleGestureEvent.DIRECTION_UP && !this.rotated) ||
-            (event.direction == SimpleGestureEvent.DIRECTION_LEFT && this.rotated)) {
-            this.moveView(-1);
-        } else if ((event.direction == SimpleGestureEvent.DIRECTION_DOWN && !this.rotated) ||
-                   (event.direction == SimpleGestureEvent.DIRECTION_RIGHT && this.rotated)) {
-            this.moveView(1);
-        }
+          if ((event.direction == SimpleGestureEvent.DIRECTION_UP && !this.rotated) ||
+              (event.direction == SimpleGestureEvent.DIRECTION_LEFT && this.rotated)) {
+              this.moveView(-1);
+          } else if ((event.direction == SimpleGestureEvent.DIRECTION_DOWN && !this.rotated) ||
+                     (event.direction == SimpleGestureEvent.DIRECTION_RIGHT && this.rotated)) {
+              this.moveView(1);
+          }
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="calendar-day-label" extends="xul:box">
     <content flex="1" pack="center">
       <xul:label anonid="longWeekdayName" class="calendar-day-label-name" xbl:inherits="selected,relation"/>
       <xul:label anonid="shortWeekdayName" class="calendar-day-label-name" hidden="true" xbl:inherits="selected,relation"/>
@@ -858,71 +858,73 @@
       <field name="mWeekday">-1</field>
       <field name="longWeekdayPixels">0</field>
       <field name="mDate">null</field>
       <property name="longName" readonly="true"
                 onget="return document.getAnonymousElementByAttribute(this, 'anonid', 'longWeekdayName');"/>
       <property name="shortName" readonly="true"
                 onget="return document.getAnonymousElementByAttribute(this, 'anonid', 'shortWeekdayName');"/>
       <property name="weekDay">
-        <getter>return this.mWeekday;</getter>
+        <getter><![CDATA[
+            return this.mWeekday;
+        ]]></getter>
         <setter><![CDATA[
-          this.mWeekday = val % 7;
-          this.longName.value = cal.getDateFormatter().dayName(val);
-          this.shortName.value = cal.getDateFormatter().shortDayName(val);
-          return this.mWeekday;
+            this.mWeekday = val % 7;
+            this.longName.value = cal.getDateFormatter().dayName(val);
+            this.shortName.value = cal.getDateFormatter().shortDayName(val);
+            return this.mWeekday;
         ]]></setter>
       </property>
 
       <property name="date">
         <getter><![CDATA[
-          return this.mDate;
+            return this.mDate;
         ]]></getter>
         <setter><![CDATA[
-          this.mDate = val;
-          let dateFormatter = cal.getDateFormatter();
-          let label = cal.calGetString("calendar", "dayHeaderLabel", [
-              dateFormatter.shortDayName(val.weekday),
-              dateFormatter.formatDateWithoutYear(val)
-          ]);
-          this.shortName.setAttribute("value", label);
-          label = cal.calGetString("calendar", "dayHeaderLabel", [
-              dateFormatter.dayName(val.weekday),
-              dateFormatter.formatDateWithoutYear(val)
-          ]);
-          this.longName.setAttribute("value", label);
-          return val;
+            this.mDate = val;
+            let dateFormatter = cal.getDateFormatter();
+            let label = cal.calGetString("calendar", "dayHeaderLabel", [
+                dateFormatter.shortDayName(val.weekday),
+                dateFormatter.formatDateWithoutYear(val)
+            ]);
+            this.shortName.setAttribute("value", label);
+            label = cal.calGetString("calendar", "dayHeaderLabel", [
+                dateFormatter.dayName(val.weekday),
+                dateFormatter.formatDateWithoutYear(val)
+            ]);
+            this.longName.setAttribute("value", label);
+            return val;
         ]]></setter>
       </property>
 
       <property name="shortWeekNames">
         <getter><![CDATA[
         ]]></getter>
         <setter><![CDATA[
-          // cache before change, in case we are switching to short
-          this.getLongWeekdayPixels();
-          setBooleanAttribute(this.longName, "hidden", val);
-          setBooleanAttribute(this.shortName, "hidden", !val);
-          return val;
+            // cache before change, in case we are switching to short
+            this.getLongWeekdayPixels();
+            setBooleanAttribute(this.longName, "hidden", val);
+            setBooleanAttribute(this.shortName, "hidden", !val);
+            return val;
         ]]></setter>
       </property>
 
       <method name="getLongWeekdayPixels">
         <body><![CDATA[
-          // Only do this if the long weekdays are visible and we haven't already cached.
-          let longNameWidth = this.longName.boxObject.width;
-          if (longNameWidth > 0) {
-              this.longWeekdayPixels = longNameWidth +
-                                       getSummarizedStyleValues(this.longName, ["margin-left", "margin-right"]);
-              this.longWeekdayPixels += getSummarizedStyleValues(this, [
-                  "border-left-width", "padding-left", "padding-right"
-              ]);
-              return this.longWeekdayPixels;
-          } else {
-              // in this case the weekdaypixels have not yet been layouted;
-              // by definition 0 is returned
-              return 0;
-          }
+            // Only do this if the long weekdays are visible and we haven't already cached.
+            let longNameWidth = this.longName.boxObject.width;
+            if (longNameWidth > 0) {
+                this.longWeekdayPixels = longNameWidth +
+                                         getSummarizedStyleValues(this.longName, ["margin-left", "margin-right"]);
+                this.longWeekdayPixels += getSummarizedStyleValues(this, [
+                    "border-left-width", "padding-left", "padding-right"
+                ]);
+                return this.longWeekdayPixels;
+            } else {
+                // in this case the weekdaypixels have not yet been layouted;
+                // by definition 0 is returned
+                return 0;
+            }
         ]]></body>
       </method>
     </implementation>
   </binding>
 </bindings>
--- a/calendar/base/content/calendar-daypicker.xml
+++ b/calendar/base/content/calendar-daypicker.xml
@@ -25,27 +25,27 @@
                    flex="1"
                    xbl:inherits="value=label"/>
       </xul:hbox>
     </content>
     <implementation>
       <method name="onmodified">
         <parameter name="aEvent"/>
         <body><![CDATA[
-          if (aEvent.attrName == "checked") {
-              let event = document.createEvent("Events");
-              event.initEvent("select", true, true);
-              this.calendar.dispatchEvent(event);
-          }
+            if (aEvent.attrName == "checked") {
+                let event = document.createEvent("Events");
+                event.initEvent("select", true, true);
+                this.calendar.dispatchEvent(event);
+            }
         ]]></body>
       </method>
       <constructor><![CDATA[
-        this.setAttribute("autoCheck", "true");
-        this.setAttribute("type", "checkbox");
-        this.addEventListener("DOMAttrModified", this.onmodified);
+          this.setAttribute("autoCheck", "true");
+          this.setAttribute("type", "checkbox");
+          this.addEventListener("DOMAttrModified", this.onmodified);
       ]]></constructor>
     </implementation>
   </binding>
 
   <!--
   ########################################################################
   ## daypicker-weekday
   ########################################################################
@@ -72,76 +72,76 @@
       <!--
       The weekday-picker manages an array of selected days of the week and
       the 'days' property is the interface to this array. the expected argument is
       an array containing integer elements, where each element represents a selected
       day of the week, starting with SUNDAY=1.
       -->
       <property name="days">
         <setter><![CDATA[
+            let mainbox =
+                document.getAnonymousElementByAttribute(
+                    this, "anonid", "mainbox");
+            let numChilds = mainbox.childNodes.length;
+            for (let i = 0; i < numChilds; i++) {
+                let child = mainbox.childNodes[i];
+                child.removeAttribute("checked");
+            }
+            for (let i = 0; i < val.length; i++) {
+                let index = val[i] - 1 - this.weekStartOffset;
+                if (index < 0) {
+                    index += 7;
+                }
+                mainbox.childNodes[index].setAttribute("checked", "true");
+            }
+            return val;
+        ]]></setter>
+        <getter><![CDATA[
+            let mainbox =
+                document.getAnonymousElementByAttribute(
+                    this, "anonid", "mainbox");
+            let numChilds = mainbox.childNodes.length;
+            let days = [];
+            for (let i = 0; i < numChilds; i++) {
+                let child = mainbox.childNodes[i];
+                if (child.getAttribute("checked") == "true") {
+                    let index = i + this.weekStartOffset;
+                    if (index >= 7) {
+                        index -= 7;
+                    }
+                    days.push(index + 1);
+                }
+            }
+            return days;
+        ]]></getter>
+      </property>
+
+      <constructor><![CDATA[
+          Components.utils.import("resource://gre/modules/Services.jsm");
+          Components.utils.import("resource://gre/modules/Preferences.jsm");
+
+          this.weekStartOffset = Preferences.get("calendar.week.start", 0);
+
+          let props =
+              Services.strings.createBundle(
+                  "chrome://calendar/locale/dateFormat.properties");
           let mainbox =
               document.getAnonymousElementByAttribute(
                   this, "anonid", "mainbox");
           let numChilds = mainbox.childNodes.length;
           for (let i = 0; i < numChilds; i++) {
               let child = mainbox.childNodes[i];
-              child.removeAttribute("checked");
-          }
-          for (let i = 0; i < val.length; i++) {
-              let index = val[i] - 1 - this.weekStartOffset;
-              if (index < 0) {
-                  index += 7;
+              let dow = i + this.weekStartOffset;
+              if (dow >= 7) {
+                  dow -= 7;
               }
-              mainbox.childNodes[index].setAttribute("checked", "true");
-          }
-          return val;
-        ]]></setter>
-        <getter><![CDATA[
-          let mainbox =
-              document.getAnonymousElementByAttribute(
-                  this, "anonid", "mainbox");
-          let numChilds = mainbox.childNodes.length;
-          let days = [];
-          for (let i = 0; i < numChilds; i++) {
-              let child = mainbox.childNodes[i];
-              if (child.getAttribute("checked") == "true") {
-                  let index = i + this.weekStartOffset;
-                  if (index >= 7) {
-                      index -= 7;
-                  }
-                  days.push(index + 1);
-              }
+              let day = props.GetStringFromName("day." + (dow + 1) + ".Mmm");
+              child.label = day;
+              child.calendar = this;
           }
-          return days;
-        ]]></getter>
-      </property>
-
-      <constructor><![CDATA[
-        Components.utils.import("resource://gre/modules/Services.jsm");
-        Components.utils.import("resource://gre/modules/Preferences.jsm");
-
-        this.weekStartOffset = Preferences.get("calendar.week.start", 0);
-
-        let props =
-            Services.strings.createBundle(
-                "chrome://calendar/locale/dateFormat.properties");
-        let mainbox =
-            document.getAnonymousElementByAttribute(
-                this, "anonid", "mainbox");
-        let numChilds = mainbox.childNodes.length;
-        for (let i = 0; i < numChilds; i++) {
-            let child = mainbox.childNodes[i];
-            let dow = i + this.weekStartOffset;
-            if (dow >= 7) {
-                dow -= 7;
-            }
-            let day = props.GetStringFromName("day." + (dow + 1) + ".Mmm");
-            child.label = day;
-            child.calendar = this;
-        }
       ]]></constructor>
     </implementation>
   </binding>
 
   <!--
   ########################################################################
   ## daypicker-monthday
   ########################################################################
@@ -196,71 +196,71 @@
           <daypicker bottom="true" label="31" xbl:inherits="disabled, mode=id"/>
           <daypicker bottom="true" right="true" label="" xbl:inherits="disabled, mode=id"/>
         </xul:hbox>
       </xul:vbox>
     </content>
     <implementation>
       <property name="days">
         <setter><![CDATA[
+            let mainbox =
+                document.getAnonymousElementByAttribute(
+                    this, "anonid", "mainbox");
+            let numRows = mainbox.childNodes.length;
+            let days = [];
+            for (let i = 0; i < numRows; i++) {
+                let row = mainbox.childNodes[i];
+                let numChilds = row.childNodes.length;
+                for (let j = 0; j < numChilds; j++) {
+                    let child = row.childNodes[j];
+                    child.removeAttribute("checked");
+                    days.push(child);
+                }
+            }
+            for (let i = 0; i < val.length; i++) {
+                let lastDayOffset = val[i] == -1 ? 0 : -1;
+                let index = (val[i] < 0 ? val[i] + days.length + lastDayOffset
+                                        : val[i] - 1);
+                days[index].setAttribute("checked", "true");
+            }
+            return val;
+        ]]></setter>
+        <getter><![CDATA[
+            let mainbox =
+                document.getAnonymousElementByAttribute(
+                    this, "anonid", "mainbox");
+            let numRows = mainbox.childNodes.length;
+            let days = [];
+            for (let i = 0; i < numRows; i++) {
+                let row = mainbox.childNodes[i];
+                let numChilds = row.childNodes.length;
+                for (let j = 0; j < numChilds; j++) {
+                    let child = row.childNodes[j];
+                    if (child.getAttribute("checked") == "true") {
+                        days.push(Number(child.label) ? Number(child.label) : -1);
+                    }
+                }
+            }
+            return days;
+        ]]></getter>
+      </property>
+
+      <constructor><![CDATA[
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
           let mainbox =
               document.getAnonymousElementByAttribute(
                   this, "anonid", "mainbox");
           let numRows = mainbox.childNodes.length;
-          let days = [];
-          for (let i = 0; i < numRows; i++) {
-              let row = mainbox.childNodes[i];
-              let numChilds = row.childNodes.length;
-              for (let j = 0; j < numChilds; j++) {
-                  let child = row.childNodes[j];
-                  child.removeAttribute("checked");
-                  days.push(child);
-              }
-          }
-          for (let i = 0; i < val.length; i++) {
-              let lastDayOffset = val[i] == -1 ? 0 : -1;
-              let index = (val[i] < 0 ? val[i] + days.length + lastDayOffset
-                                      : val[i] - 1);
-              days[index].setAttribute("checked", "true");
-          }
-          return val;
-        ]]></setter>
-        <getter><![CDATA[
-          let mainbox =
-              document.getAnonymousElementByAttribute(
-                  this, "anonid", "mainbox");
-          let numRows = mainbox.childNodes.length;
-          let days = [];
+          let child = null;
           for (let i = 0; i < numRows; i++) {
               let row = mainbox.childNodes[i];
               let numChilds = row.childNodes.length;
               for (let j = 0; j < numChilds; j++) {
-                  let child = row.childNodes[j];
-                  if (child.getAttribute("checked") == "true") {
-                      days.push(Number(child.label) ? Number(child.label) : -1);
-                  }
+                  child = row.childNodes[j];
+                  child.calendar = this;
               }
           }
-          return days;
-        ]]></getter>
-      </property>
-
-      <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-        let mainbox =
-            document.getAnonymousElementByAttribute(
-                this, "anonid", "mainbox");
-        let numRows = mainbox.childNodes.length;
-        let child = null;
-        for (let i = 0; i < numRows; i++) {
-            let row = mainbox.childNodes[i];
-            let numChilds = row.childNodes.length;
-            for (let j = 0; j < numChilds; j++) {
-                child = row.childNodes[j];
-                child.calendar = this;
-            }
-        }
-        let labelLastDay = cal.calGetString("calendar-event-dialog", "eventRecurrenceMonthlyLastDayLabel");
-        child.setAttribute("label", labelLastDay);
+          let labelLastDay = cal.calGetString("calendar-event-dialog", "eventRecurrenceMonthlyLastDayLabel");
+          child.setAttribute("label", labelLastDay);
       ]]></constructor>
     </implementation>
   </binding>
 </bindings>
--- a/calendar/base/content/calendar-item-bindings.xml
+++ b/calendar/base/content/calendar-item-bindings.xml
@@ -29,76 +29,76 @@
       <xul:textbox readonly="true"
                    class="selectable-label plain"
                    anonid="item-datetime-value"/>
     </content>
     <implementation>
       <field name="mItem">null</field>
 
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
       ]]></constructor>
 
       <property name="mode"
                 readonly="true">
         <getter><![CDATA[
-          if (this.hasAttribute("mode")) {
-              return this.getAttribute("mode");
-          } else {
-              return "start";
-          }
+            if (this.hasAttribute("mode")) {
+                return this.getAttribute("mode");
+            } else {
+                return "start";
+            }
         ]]></getter>
       </property>
       <property name="Item">
         <getter><![CDATA[
-          return mItem;
+            return mItem;
         ]]></getter>
         <setter><![CDATA[
-          this.mItem = val;
-          let headerLabel = document.getAnonymousElementByAttribute(this, "anonid", "item-datetime-label");
-          let itemDateTimeLabel = document.getAnonymousElementByAttribute(this, "anonid", "item-datetime-value");
-          let date;
-          if (this.mode == "start") {
-              date = this.mItem[cal.calGetStartDateProp(this.mItem)];
-              if (date) {
-                  let label;
-                  if (cal.isToDo(this.mItem)) {
-                      label = this.getAttribute("taskStartLabel");
-                  } else {
-                      label = this.getAttribute("eventStartLabel");
-                  }
-                  headerLabel.value = label;
-              }
-          } else {
-              date = this.mItem[cal.calGetEndDateProp(this.mItem)];
-              if (date) {
-                  let label;
-                  if (cal.isToDo(this.mItem)) {
-                      label = this.getAttribute("taskDueLabel");
-                  } else {
-                      label = this.getAttribute("eventEndLabel");
-                  }
-                  headerLabel.value = label;
-              }
-          }
-          let hideLabels = (date == null);
-          if (hideLabels) {
-              this.setAttribute("hidden", "true");
-          } else {
-              const kDefaultTimezone = cal.calendarDefaultTimezone();
-              let localTime = date.getInTimezone(kDefaultTimezone);
-              let formatter = cal.getDateFormatter();
-              itemDateTimeLabel.value = formatter.formatDateTime(localTime);
-              if (!date.timezone.isFloating && date.timezone.tzid != kDefaultTimezone.tzid) {
-                  // we additionally display the original datetime with timezone
-                  let orgTime = cal.calGetString("calendar", "datetimeWithTimezone", [
-                      formatter.formatDateTime(date),
-                      date.timezone.tzid
-                  ]);
-                  itemDateTimeLabel.value += " (" + orgTime + ")";
-              }
-              this.removeAttribute("hidden");
-          }
+            this.mItem = val;
+            let headerLabel = document.getAnonymousElementByAttribute(this, "anonid", "item-datetime-label");
+            let itemDateTimeLabel = document.getAnonymousElementByAttribute(this, "anonid", "item-datetime-value");
+            let date;
+            if (this.mode == "start") {
+                date = this.mItem[cal.calGetStartDateProp(this.mItem)];
+                if (date) {
+                    let label;
+                    if (cal.isToDo(this.mItem)) {
+                        label = this.getAttribute("taskStartLabel");
+                    } else {
+                        label = this.getAttribute("eventStartLabel");
+                    }
+                    headerLabel.value = label;
+                }
+            } else {
+                date = this.mItem[cal.calGetEndDateProp(this.mItem)];
+                if (date) {
+                    let label;
+                    if (cal.isToDo(this.mItem)) {
+                        label = this.getAttribute("taskDueLabel");
+                    } else {
+                        label = this.getAttribute("eventEndLabel");
+                    }
+                    headerLabel.value = label;
+                }
+            }
+            let hideLabels = (date == null);
+            if (hideLabels) {
+                this.setAttribute("hidden", "true");
+            } else {
+                const kDefaultTimezone = cal.calendarDefaultTimezone();
+                let localTime = date.getInTimezone(kDefaultTimezone);
+                let formatter = cal.getDateFormatter();
+                itemDateTimeLabel.value = formatter.formatDateTime(localTime);
+                if (!date.timezone.isFloating && date.timezone.tzid != kDefaultTimezone.tzid) {
+                    // we additionally display the original datetime with timezone
+                    let orgTime = cal.calGetString("calendar", "datetimeWithTimezone", [
+                        formatter.formatDateTime(date),
+                        date.timezone.tzid
+                    ]);
+                    itemDateTimeLabel.value += " (" + orgTime + ")";
+                }
+                this.removeAttribute("hidden");
+            }
         ]]></setter>
       </property>
     </implementation>
   </binding>
 </bindings>
--- a/calendar/base/content/calendar-menus.xml
+++ b/calendar/base/content/calendar-menus.xml
@@ -12,65 +12,65 @@
 
   <binding id="task-menupopup" extends="xul:menupopup">
     <implementation>
       <field name="mType">null</field>;
       <field name="mPopupHandler">null</field>
       <field name="mParentMenuPopup">null</field>
 
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
 
-        this.mPopupHandler = () => { this.changeMenuByPropertyName(); };
-        this.mParentMenuPopup = cal.getParentNodeOrThis(this, "menupopup");
-        this.mParentMenuPopup.addEventListener("popupshowing", this.mPopupHandler, true);
+          this.mPopupHandler = () => { this.changeMenuByPropertyName(); };
+          this.mParentMenuPopup = cal.getParentNodeOrThis(this, "menupopup");
+          this.mParentMenuPopup.addEventListener("popupshowing", this.mPopupHandler, true);
       ]]></constructor>
 
       <destructor><![CDATA[
-        this.mParentMenuPopup.removeEventListener("popupshowing", this.mPopupHandler, true);
+          this.mParentMenuPopup.removeEventListener("popupshowing", this.mPopupHandler, true);
       ]]></destructor>
 
       <!-- This method checks a command which naming follows
            the notation 'calendar_' +  mType + ' + '-' + propertyValue + 'command',
            when its propertyValue part matches the propertyValue of the selected tasks
            as long as the selected tasks share common propertyValues. -->
       <method name="changeMenuByPropertyName">
         <body><![CDATA[
-          let liveList = document.getAnonymousNodes(this);
-          for (let item of liveList) {
-              let commandName = item.getAttribute("command");
-              let command = document.getElementById(commandName);
-              if (command) {
-                  command.setAttribute("checked", "false");
-                  item.setAttribute("checked", "false");
-              }
-          }
-          let propertyValue;
-          if (gTabmail && gTabmail.currentTabInfo.mode.type == "calendarTask") {
-              // We are in a task tab (editing a single task).
-              propertyValue = gConfig[this.mType];
-          } else {
-              // We are in the Tasks tab.
-              let tasks = getSelectedTasks();
-              let tasksSelected = (tasks != null) && (tasks.length > 0);
-              if (tasksSelected) {
-                  let task = tasks[0];
-                  if (cal.isPropertyValueSame(tasks, this.mType)) {
-                      propertyValue = task[this.mType];
-                  }
-              } else {
-                  cal.applyAttributeToMenuChildren(this, "disabled", !tasksSelected);
-              }
-          }
-          if (propertyValue || propertyValue == 0) {
-              let command = document.getElementById("calendar_" + this.mType + "-" + propertyValue + "_command");
-              if (command) {
-                  command.setAttribute("checked", "true");
-              }
-          }
+            let liveList = document.getAnonymousNodes(this);
+            for (let item of liveList) {
+                let commandName = item.getAttribute("command");
+                let command = document.getElementById(commandName);
+                if (command) {
+                    command.setAttribute("checked", "false");
+                    item.setAttribute("checked", "false");
+                }
+            }
+            let propertyValue;
+            if (gTabmail && gTabmail.currentTabInfo.mode.type == "calendarTask") {
+                // We are in a task tab (editing a single task).
+                propertyValue = gConfig[this.mType];
+            } else {
+                // We are in the Tasks tab.
+                let tasks = getSelectedTasks();
+                let tasksSelected = (tasks != null) && (tasks.length > 0);
+                if (tasksSelected) {
+                    let task = tasks[0];
+                    if (cal.isPropertyValueSame(tasks, this.mType)) {
+                        propertyValue = task[this.mType];
+                    }
+                } else {
+                    cal.applyAttributeToMenuChildren(this, "disabled", !tasksSelected);
+                }
+            }
+            if (propertyValue || propertyValue == 0) {
+                let command = document.getElementById("calendar_" + this.mType + "-" + propertyValue + "_command");
+                if (command) {
+                    command.setAttribute("checked", "true");
+                }
+            }
         ]]></body>
       </method>
     </implementation>
    </binding>
 
   <binding id="task-progress-menupopup" extends="chrome://calendar/content/calendar-menus.xml#task-menupopup">
     <content>
       <xul:menuitem anonid="percent-0-menuitem"
@@ -102,18 +102,18 @@
                 label="&progress.level.100;"
                 accesskey="&progress.level.100.accesskey;"
                 observes="calendar_percentComplete-100_command"
                 command="calendar_percentComplete-100_command"/>
       <children/>
     </content>
     <implementation>
       <constructor><![CDATA[
-        this.mType = "percentComplete";
-        this.changeMenuByPropertyName();
+          this.mType = "percentComplete";
+          this.changeMenuByPropertyName();
       ]]></constructor>
     </implementation>
    </binding>
 
   <binding id="task-priority-menupopup" extends="chrome://calendar/content/calendar-menus.xml#task-menupopup">
     <content>
       <xul:menuitem id="priority-0-menuitem"
                     type="checkbox"
@@ -138,14 +138,14 @@
                 label="&priority.level.high;"
                 accesskey="&priority.level.high.accesskey;"
                 command="calendar_priority-1_command"
                 observes="calendar_priority-1_command"/>
       <children/>
     </content>
     <implementation>
       <constructor><![CDATA[
-        this.mType = "priority";
-        this.changeMenuByPropertyName();
+          this.mType = "priority";
+          this.changeMenuByPropertyName();
       ]]></constructor>
     </implementation>
    </binding>
 </bindings>
--- a/calendar/base/content/calendar-month-view.xml
+++ b/calendar/base/content/calendar-month-view.xml
@@ -65,59 +65,59 @@
               </xul:stack>
             </xul:box>
           </xul:box>
         </xul:hbox>
       </xul:vbox>
     </content>
     <implementation>
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
       ]]></constructor>
 
       <property name="occurrence">
         <getter><![CDATA[
-          return this.mOccurrence;
+            return this.mOccurrence;
         ]]></getter>
         <setter><![CDATA[
-          cal.ASSERT(!this.mOccurrence, "Code changes needed to set the occurrence twice", true);
-          this.mOccurrence = val;
-          if (cal.isEvent(val)) {
-              if (!val.startDate.isDate) {
-                  let label = document.getAnonymousElementByAttribute(this, "anonid", "item-label");
-                  let formatter = Components.classes["@mozilla.org/calendar/datetime-formatter;1"]
-                                            .getService(Components.interfaces.calIDateTimeFormatter);
-                  let timezone = this.calendarView ? this.calendarView.mTimezone
-                                                   : cal.calendarDefaultTimezone();
-                  let parentDate = cal.ensureDateTime(this.parentBox.date);
-                  let startTime = val.startDate.getInTimezone(timezone);
-                  let endTime = val.endDate.getInTimezone(timezone);
-                  let nextDay = parentDate.clone();
-                  nextDay.day++;
-                  let comp = endTime.compare(nextDay);
-                  if (startTime.compare(parentDate) == -1) {
-                      if (comp == 1) {
-                          label.value = "↔";
-                      } else if (comp == 0) {
-                          label.value = "↤";
-                      } else {
-                          label.value = "⇥ " + formatter.formatTime(endTime);
-                      }
-                  } else if (comp == 1) {
-                      label.value = "⇤ " + formatter.formatTime(startTime);
-                  } else {
-                      label.value = formatter.formatTime(startTime);
-                  }
-                  label.setAttribute("time", "true");
-              }
-          }
+            cal.ASSERT(!this.mOccurrence, "Code changes needed to set the occurrence twice", true);
+            this.mOccurrence = val;
+            if (cal.isEvent(val)) {
+                if (!val.startDate.isDate) {
+                    let label = document.getAnonymousElementByAttribute(this, "anonid", "item-label");
+                    let formatter = Components.classes["@mozilla.org/calendar/datetime-formatter;1"]
+                                              .getService(Components.interfaces.calIDateTimeFormatter);
+                    let timezone = this.calendarView ? this.calendarView.mTimezone
+                                                     : cal.calendarDefaultTimezone();
+                    let parentDate = cal.ensureDateTime(this.parentBox.date);
+                    let startTime = val.startDate.getInTimezone(timezone);
+                    let endTime = val.endDate.getInTimezone(timezone);
+                    let nextDay = parentDate.clone();
+                    nextDay.day++;
+                    let comp = endTime.compare(nextDay);
+                    if (startTime.compare(parentDate) == -1) {
+                        if (comp == 1) {
+                            label.value = "↔";
+                        } else if (comp == 0) {
+                            label.value = "↤";
+                        } else {
+                            label.value = "⇥ " + formatter.formatTime(endTime);
+                        }
+                    } else if (comp == 1) {
+                        label.value = "⇤ " + formatter.formatTime(startTime);
+                    } else {
+                        label.value = formatter.formatTime(startTime);
+                    }
+                    label.setAttribute("time", "true");
+                }
+            }
 
-          this.setEditableLabel();
-          this.setCSSClasses();
-          return val;
+            this.setEditableLabel();
+            this.setCSSClasses();
+            return val;
         ]]></setter>
       </property>
     </implementation>
   </binding>
 
   <binding id="calendar-month-day-box" extends="chrome://calendar/content/widgets/calendar-widgets.xml#dragndropContainer">
     <content orient="vertical">
       <xul:hbox anonid="monthday-labels" style="overflow: hidden;">
@@ -136,208 +136,210 @@
       </xul:hbox>
       <xul:vbox anonid="day-items" class="calendar-month-day-box-items-box" flex="1">
         <children/>
       </xul:vbox>
     </content>
 
     <implementation>
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
       ]]></constructor>
 
       <field name="mDate">null</field>
       <field name="mItemHash">{}</field>
       <field name="mShowMonthLabel">false</field>
 
       <property name="date"
                 onget="return this.mDate"
                 onset="this.setDate(val); return val;"/>
 
       <property name="selected">
         <getter><![CDATA[
-          let sel = this.getAttribute("selected");
-          if (sel && sel == "true") {
-              return true;
-          }
+            let sel = this.getAttribute("selected");
+            if (sel && sel == "true") {
+                return true;
+            }
 
-          return false;
+            return false;
         ]]></getter>
         <setter><![CDATA[
-          if (val) {
-              this.setAttribute("selected", "true");
-          } else {
-              this.removeAttribute("selected");
-          }
-          return val;
+            if (val) {
+                this.setAttribute("selected", "true");
+            } else {
+                this.removeAttribute("selected");
+            }
+            return val;
         ]]></setter>
       </property>
 
       <property name="dayitems">
-        <getter>return document.getAnonymousElementByAttribute(this, "anonid", "day-items");</getter>
+        <getter><![CDATA[
+            return document.getAnonymousElementByAttribute(this, "anonid", "day-items");
+        ]]></getter>
       </property>
 
       <property name="showMonthLabel">
         <getter><![CDATA[
-          return this.mShowMonthLabel;
+            return this.mShowMonthLabel;
         ]]></getter>
         <setter><![CDATA[
-          if (this.mShowMonthLabel == val) {
-              return val;
-          }
-          this.mShowMonthLabel = val;
+            if (this.mShowMonthLabel == val) {
+                return val;
+            }
+            this.mShowMonthLabel = val;
 
-          if (!this.mDate) {
-              return val;
-          }
-          if (val) {
-              this.setAttribute("value", cal.getDateFormatter().formatDateWithoutYear(this.mDate));
-          } else {
-              this.setAttribute("value", this.mDate.day);
-          }
-          return val;
+            if (!this.mDate) {
+                return val;
+            }
+            if (val) {
+                this.setAttribute("value", cal.getDateFormatter().formatDateWithoutYear(this.mDate));
+            } else {
+                this.setAttribute("value", this.mDate.day);
+            }
+            return val;
         ]]></setter>
       </property>
 
       <method name="setDate">
         <parameter name="aDate"/>
         <body><![CDATA[
-          if (!aDate) {
-              throw Components.results.NS_ERROR_NULL_POINTER;
-          }
+            if (!aDate) {
+                throw Components.results.NS_ERROR_NULL_POINTER;
+            }
 
-          // Remove all the old events
-          this.mItemHash = {};
-          removeChildren(this);
+            // Remove all the old events
+            this.mItemHash = {};
+            removeChildren(this);
 
-          if (this.mDate && this.mDate.compare(aDate) == 0) {
-              return;
-          }
+            if (this.mDate && this.mDate.compare(aDate) == 0) {
+                return;
+            }
 
-          this.mDate = aDate;
+            this.mDate = aDate;
 
-          // Set up DOM attributes for custom CSS coloring.
-          let weekTitle = cal.getWeekInfoService().getWeekTitle(aDate);
-          this.setAttribute("year", aDate.year);
-          this.setAttribute("month", aDate.month + 1);
-          this.setAttribute("week", weekTitle);
-          this.setAttribute("day", aDate.day);
+            // Set up DOM attributes for custom CSS coloring.
+            let weekTitle = cal.getWeekInfoService().getWeekTitle(aDate);
+            this.setAttribute("year", aDate.year);
+            this.setAttribute("month", aDate.month + 1);
+            this.setAttribute("week", weekTitle);
+            this.setAttribute("day", aDate.day);
 
-          if (this.mShowMonthLabel) {
-              let monthName = cal.calGetString("dateFormat", "month." + (aDate.month + 1) + ".Mmm");
-              this.setAttribute("value", aDate.day + " " + monthName);
-          } else {
-              this.setAttribute("value", aDate.day);
-          }
+            if (this.mShowMonthLabel) {
+                let monthName = cal.calGetString("dateFormat", "month." + (aDate.month + 1) + ".Mmm");
+                this.setAttribute("value", aDate.day + " " + monthName);
+            } else {
+                this.setAttribute("value", aDate.day);
+            }
         ]]></body>
       </method>
 
       <method name="addItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          if (aItem.hashId in this.mItemHash) {
-              this.deleteItem(aItem);
-          }
+            if (aItem.hashId in this.mItemHash) {
+                this.deleteItem(aItem);
+            }
 
-          let box = createXULElement("calendar-month-day-box-item");
-          let context = this.getAttribute("item-context") ||
-                        this.getAttribute("context");
-          box.setAttribute("context", context);
-          box.setAttribute("calendar-uri", aItem.calendar.uri.spec);
-          box.setAttribute("calendar-id", aItem.calendar.id);
+            let box = createXULElement("calendar-month-day-box-item");
+            let context = this.getAttribute("item-context") ||
+                          this.getAttribute("context");
+            box.setAttribute("context", context);
+            box.setAttribute("calendar-uri", aItem.calendar.uri.spec);
+            box.setAttribute("calendar-id", aItem.calendar.id);
 
-          cal.binaryInsertNode(this, box, aItem, cal.view.compareItems, false);
+            cal.binaryInsertNode(this, box, aItem, cal.view.compareItems, false);
 
-          box.calendarView = this.calendarView;
-          box.item = aItem;
-          box.parentBox = this;
-          box.occurrence = aItem;
+            box.calendarView = this.calendarView;
+            box.item = aItem;
+            box.parentBox = this;
+            box.occurrence = aItem;
 
-          this.mItemHash[aItem.hashId] = box;
-          return box;
+            this.mItemHash[aItem.hashId] = box;
+            return box;
         ]]></body>
       </method>
 
       <method name="selectItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          if (aItem.hashId in this.mItemHash) {
-              this.mItemHash[aItem.hashId].selected = true;
-          }
+            if (aItem.hashId in this.mItemHash) {
+                this.mItemHash[aItem.hashId].selected = true;
+            }
         ]]></body>
       </method>
 
       <method name="unselectItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          if (aItem.hashId in this.mItemHash) {
-              this.mItemHash[aItem.hashId].selected = false;
-          }
+            if (aItem.hashId in this.mItemHash) {
+                this.mItemHash[aItem.hashId].selected = false;
+            }
         ]]></body>
       </method>
 
       <method name="deleteItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          if (aItem.hashId in this.mItemHash) {
-              let node = this.mItemHash[aItem.hashId];
-              node.remove();
-              delete this.mItemHash[aItem.hashId];
-          }
+            if (aItem.hashId in this.mItemHash) {
+                let node = this.mItemHash[aItem.hashId];
+                node.remove();
+                delete this.mItemHash[aItem.hashId];
+            }
         ]]></body>
       </method>
 
       <method name="onDropItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          // When item's timezone is different than the default one, the
-          // item might get moved on a day different than the drop day.
-          // Changing the drop day allows to compensate a possible difference.
+            // When item's timezone is different than the default one, the
+            // item might get moved on a day different than the drop day.
+            // Changing the drop day allows to compensate a possible difference.
 
-          // Figure out if the timezones cause a days difference.
-          let start = (aItem[cal.calGetStartDateProp(aItem)] ||
-                       aItem[cal.calGetEndDateProp(aItem)]).clone();
-          let dayboxDate = this.mDate.clone();
-          if (start.timezone != dayboxDate.timezone) {
-              let startInDefaultTz = start.clone().getInTimezone(dayboxDate.timezone);
-              start.isDate = true;
-              startInDefaultTz.isDate = true;
-              startInDefaultTz.timezone = start.timezone;
-              let dayDiff = start.subtractDate(startInDefaultTz);
-              // Change the day where to drop the item.
-              dayboxDate.addDuration(dayDiff);
-          }
+            // Figure out if the timezones cause a days difference.
+            let start = (aItem[cal.calGetStartDateProp(aItem)] ||
+                         aItem[cal.calGetEndDateProp(aItem)]).clone();
+            let dayboxDate = this.mDate.clone();
+            if (start.timezone != dayboxDate.timezone) {
+                let startInDefaultTz = start.clone().getInTimezone(dayboxDate.timezone);
+                start.isDate = true;
+                startInDefaultTz.isDate = true;
+                startInDefaultTz.timezone = start.timezone;
+                let dayDiff = start.subtractDate(startInDefaultTz);
+                // Change the day where to drop the item.
+                dayboxDate.addDuration(dayDiff);
+            }
 
-          return cal.moveItem(aItem, dayboxDate);
+            return cal.moveItem(aItem, dayboxDate);
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="mousedown"><![CDATA[
-        event.stopPropagation();
-        if (this.mDate) {
-            this.calendarView.selectedDay = this.mDate;
-        }
+          event.stopPropagation();
+          if (this.mDate) {
+              this.calendarView.selectedDay = this.mDate;
+          }
       ]]></handler>
       <handler event="dblclick"><![CDATA[
-        event.stopPropagation();
-        this.calendarView.controller.createNewEvent();
+          event.stopPropagation();
+          this.calendarView.controller.createNewEvent();
       ]]></handler>
       <handler event="click" button="0"><![CDATA[
-        if (!(event.ctrlKey || event.metaKey)) {
-            this.calendarView.setSelectedItems(0, []);
-        }
+          if (!(event.ctrlKey || event.metaKey)) {
+              this.calendarView.setSelectedItems(0, []);
+          }
       ]]></handler>
       <handler event="wheel"><![CDATA[
-        if (cal.getParentNodeOrThisByAttribute(event.originalTarget, "anonid", "day-label") == null) {
-            if (this.dayitems.scrollHeight > this.dayitems.clientHeight) {
-                event.stopPropagation();
-            }
-        }
+          if (cal.getParentNodeOrThisByAttribute(event.originalTarget, "anonid", "day-label") == null) {
+              if (this.dayitems.scrollHeight > this.dayitems.clientHeight) {
+                  event.stopPropagation();
+              }
+          }
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="calendar-month-base-view" extends="chrome://calendar/content/calendar-base-view.xml#calendar-base-view">
     <content style="overflow: auto;" flex="1" xbl:inherits="context,item-context">
       <xul:vbox anonid="mainbox" flex="1">
         <xul:hbox class="labeldaybox-container"
@@ -412,32 +414,32 @@
             </xul:row>
           </xul:rows>
         </xul:grid>
       </xul:vbox>
     </content>
 
     <implementation implements="calICalendarView">
       <constructor><![CDATA[
-        Components.utils.import("resource://gre/modules/Preferences.jsm");
-        Components.utils.import("resource://calendar/modules/calViewUtils.jsm");
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
+          Components.utils.import("resource://gre/modules/Preferences.jsm");
+          Components.utils.import("resource://calendar/modules/calViewUtils.jsm");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
 
-        // Set the preference for the default start of the week
-        this.weekStartOffset = Preferences.get("calendar.week.start", 0);
+          // Set the preference for the default start of the week
+          this.weekStartOffset = Preferences.get("calendar.week.start", 0);
 
-        for (let i = 0; i < 7; i++) {
-            let hdr = createXULElement("calendar-day-label");
-            this.labeldaybox.appendChild(hdr);
-            hdr.weekDay = (i + this.mWeekStartOffset) % 7;
-            hdr.shortWeekNames = false;
-        }
+          for (let i = 0; i < 7; i++) {
+              let hdr = createXULElement("calendar-day-label");
+              this.labeldaybox.appendChild(hdr);
+              hdr.weekDay = (i + this.mWeekStartOffset) % 7;
+              hdr.shortWeekNames = false;
+          }
 
-        // Set the preference for displaying the week number
-        this.mShowWeekNumber = Preferences.get("calendar.view-minimonth.showWeekNumber", true);
+          // Set the preference for displaying the week number
+          this.mShowWeekNumber = Preferences.get("calendar.view-minimonth.showWeekNumber", true);
       ]]></constructor>
 
       <!-- fields -->
       <field name="mDateBoxes">null</field>
       <field name="mSelectedDayBox">null</field>
 
       <field name="mShowDaysOutsideMonth">true</field>
       <field name="mShowFullMonth">true</field>
@@ -445,24 +447,24 @@
 
       <field name="mClickedTime">null</field>
 
       <!-- other methods -->
       <method name="setAttribute">
         <parameter name="aAttr"/>
         <parameter name="aVal"/>
         <body><![CDATA[
-          let needsrelayout = (aAttr == "context" || aAttr == "item-context");
-          let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
+            let needsrelayout = (aAttr == "context" || aAttr == "item-context");
+            let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
 
-          if (needsrelayout) {
-              this.relayout();
-          }
+            if (needsrelayout) {
+                this.relayout();
+            }
 
-          return ret;
+            return ret;
         ]]></body>
       </method>
 
       <!-- calICalendarView -->
 
       <property name="supportsDisjointDates" readonly="true"
                 onget="return false;"/>
       <property name="hasDisjointDates" readonly="true"
@@ -471,21 +473,21 @@
       <property name="startDate" readonly="true"
                 onget="return this.mStartDate"/>
 
       <property name="endDate" readonly="true"
                 onget="return this.mEndDate"/>
 
       <property name="showFullMonth">
         <getter><![CDATA[
-          return this.mShowFullMonth;
+            return this.mShowFullMonth;
         ]]></getter>
         <setter><![CDATA[
-          this.mShowFullMonth = val;
-          return val;
+            this.mShowFullMonth = val;
+            return val;
         ]]></setter>
       </property>
 
       <!-- this property may be overridden by the
           descendent classes if neeeded  -->
       <property name="weeksInView">
         <getter><![CDATA[
             return 0;
@@ -495,649 +497,649 @@
         ]]></setter>
       </property>
 
       <method name="handlePreference">
         <parameter name="aSubject"/>
         <parameter name="aTopic"/>
         <parameter name="aPreference"/>
         <body><![CDATA[
-          aSubject.QueryInterface(Components.interfaces.nsIPrefBranch);
+            aSubject.QueryInterface(Components.interfaces.nsIPrefBranch);
 
-          switch (aPreference) {
-              case "calendar.previousweeks.inview":
-                  this.updateDaysOffPrefs();
-                  this.refreshView();
-                  break;
+            switch (aPreference) {
+                case "calendar.previousweeks.inview":
+                    this.updateDaysOffPrefs();
+                    this.refreshView();
+                    break;
 
-              case "calendar.week.start":
-                  this.weekStartOffset = aSubject.getIntPref(aPreference);
-                  // Refresh the view so the settings take effect
-                  this.refreshView();
-                  break;
+                case "calendar.week.start":
+                    this.weekStartOffset = aSubject.getIntPref(aPreference);
+                    // Refresh the view so the settings take effect
+                    this.refreshView();
+                    break;
 
-              case "calendar.weeks.inview":
-                  this.weeksInView = aSubject.getIntPref(aPreference);
-                  break;
+                case "calendar.weeks.inview":
+                    this.weeksInView = aSubject.getIntPref(aPreference);
+                    break;
 
-              case "calendar.view-minimonth.showWeekNumber":
-                  this.mShowWeekNumber = aSubject.getBoolPref(aPreference);
-                  if (this.mShowWeekNumber) {
-                      this.refreshView();
-                  } else {
-                      this.hideWeekNumbers();
-                  }
-                  break;
+                case "calendar.view-minimonth.showWeekNumber":
+                    this.mShowWeekNumber = aSubject.getBoolPref(aPreference);
+                    if (this.mShowWeekNumber) {
+                        this.refreshView();
+                    } else {
+                        this.hideWeekNumbers();
+                    }
+                    break;
 
-              default:
-                  this.handleCommonPreference(aSubject, aTopic, aPreference);
-                  break;
-          }
+                default:
+                    this.handleCommonPreference(aSubject, aTopic, aPreference);
+                    break;
+            }
         ]]></body>
       </method>
 
       <method name="getSelectedItems">
         <parameter name="aCount"/>
         <body><![CDATA[
-          aCount.value = this.mSelectedItems.length;
-          return this.mSelectedItems;
+            aCount.value = this.mSelectedItems.length;
+            return this.mSelectedItems;
         ]]></body>
       </method>
 
       <method name="setSelectedItems">
         <parameter name="aCount"/>
         <parameter name="aItems"/>
         <parameter name="aSuppressEvent"/>
         <body><![CDATA[
-          if (this.mSelectedItems.length) {
-              for (let item of this.mSelectedItems) {
-                  let oldboxes = this.findDayBoxesForItem(item);
-                  for (let oldbox of oldboxes) {
-                      oldbox.unselectItem(item);
-                  }
-              }
-          }
+            if (this.mSelectedItems.length) {
+                for (let item of this.mSelectedItems) {
+                    let oldboxes = this.findDayBoxesForItem(item);
+                    for (let oldbox of oldboxes) {
+                        oldbox.unselectItem(item);
+                    }
+                }
+            }
 
-          this.mSelectedItems = aItems || [];
+            this.mSelectedItems = aItems || [];
 
-          if (this.mSelectedItems.length) {
-              for (let item of this.mSelectedItems) {
-                  let newboxes = this.findDayBoxesForItem(item);
-                  for (let newbox of newboxes) {
-                      newbox.selectItem(item);
-                  }
-              }
-          }
+            if (this.mSelectedItems.length) {
+                for (let item of this.mSelectedItems) {
+                    let newboxes = this.findDayBoxesForItem(item);
+                    for (let newbox of newboxes) {
+                        newbox.selectItem(item);
+                    }
+                }
+            }
 
-          if (!aSuppressEvent) {
-              this.fireEvent("itemselect", this.mSelectedItems);
-          }
+            if (!aSuppressEvent) {
+                this.fireEvent("itemselect", this.mSelectedItems);
+            }
         ]]></body>
       </method>
 
       <method name="centerSelectedItems">
         <body>
         </body>
       </method>
 
       <property name="selectedDay">
         <getter><![CDATA[
-          if (this.mSelectedDayBox) {
-              return this.mSelectedDayBox.date.clone();
-          }
+            if (this.mSelectedDayBox) {
+                return this.mSelectedDayBox.date.clone();
+            }
 
-          return null;
+            return null;
         ]]></getter>
         <setter><![CDATA[
-          if (this.mSelectedDayBox) {
-              this.mSelectedDayBox.selected = false;
-          }
+            if (this.mSelectedDayBox) {
+                this.mSelectedDayBox.selected = false;
+            }
 
-          let realVal = val;
-          if (!realVal.isDate) {
-              realVal = val.clone();
-              realVal.isDate = true;
-          }
-          let box = this.findDayBoxForDate(realVal);
-          if (box) {
-              box.selected = true;
-              this.mSelectedDayBox = box;
-          }
-          this.fireEvent("dayselect", realVal);
-          return val;
+            let realVal = val;
+            if (!realVal.isDate) {
+                realVal = val.clone();
+                realVal.isDate = true;
+            }
+            let box = this.findDayBoxForDate(realVal);
+            if (box) {
+                box.selected = true;
+                this.mSelectedDayBox = box;
+            }
+            this.fireEvent("dayselect", realVal);
+            return val;
         ]]></setter>
       </property>
 
       <property name="selectedDateTime">
         <getter><![CDATA[
             return cal.getDefaultStartDate(this.selectedDay);
         ]]></getter>
         <setter><![CDATA[
             this.mClickedTime = val;
         ]]></setter>
       </property>
 
       <method name="showDate">
         <parameter name="aDate"/>
         <body><![CDATA[
-          // If aDate is null it means that only a refresh is needed
-          // without changing the start and end of the view.
-          if (aDate) {
-              this.setDateRange(aDate.startOfMonth, aDate.endOfMonth);
-              this.selectedDay = aDate;
-          } else {
-              this.refresh();
-              // Refresh the selected day if it doesn't appear in the view.
-              this.selectedDay = this.selectedDay;
-          }
+            // If aDate is null it means that only a refresh is needed
+            // without changing the start and end of the view.
+            if (aDate) {
+                this.setDateRange(aDate.startOfMonth, aDate.endOfMonth);
+                this.selectedDay = aDate;
+            } else {
+                this.refresh();
+                // Refresh the selected day if it doesn't appear in the view.
+                this.selectedDay = this.selectedDay;
+            }
         ]]></body>
       </method>
 
       <method name="onResize">
       <parameter name="aBinding"/>
         <body><![CDATA[
-          aBinding.adjustWeekdayLength();
-          // Delete the timer for the time indicator in day/week view.
-          timeIndicator.cancel();
+            aBinding.adjustWeekdayLength();
+            // Delete the timer for the time indicator in day/week view.
+            timeIndicator.cancel();
         ]]></body>
       </method>
 
       <method name="setDateRange">
         <parameter name="aStartDate"/>
         <parameter name="aEndDate"/>
         <body><![CDATA[
-          this.rangeStartDate = aStartDate;
-          this.rangeEndDate = aEndDate;
-          let viewStart = cal.getWeekInfoService().getStartOfWeek(
-                                      aStartDate.getInTimezone(this.mTimezone));
-          let viewEnd = cal.getWeekInfoService().getEndOfWeek(
-                                      aEndDate.getInTimezone(this.mTimezone));
+            this.rangeStartDate = aStartDate;
+            this.rangeEndDate = aEndDate;
+            let viewStart = cal.getWeekInfoService().getStartOfWeek(
+                                        aStartDate.getInTimezone(this.mTimezone));
+            let viewEnd = cal.getWeekInfoService().getEndOfWeek(
+                                        aEndDate.getInTimezone(this.mTimezone));
 
-          viewStart.isDate = true;
-          viewStart.makeImmutable();
-          viewEnd.isDate = true;
-          viewEnd.makeImmutable();
-          this.mStartDate = viewStart;
-          this.mEndDate = viewEnd;
+            viewStart.isDate = true;
+            viewStart.makeImmutable();
+            viewEnd.isDate = true;
+            viewEnd.makeImmutable();
+            this.mStartDate = viewStart;
+            this.mEndDate = viewEnd;
 
-          // check values of tasksInView, workdaysOnly, showCompleted
-          // see setDateRange comment in calendar-multiday-view.xml
-          let toggleStatus = 0;
+            // check values of tasksInView, workdaysOnly, showCompleted
+            // see setDateRange comment in calendar-multiday-view.xml
+            let toggleStatus = 0;
 
-          if (this.mTasksInView) {
-              toggleStatus |= this.mToggleStatusFlag.TasksInView;
-          }
-          if (this.mWorkdaysOnly) {
-              toggleStatus |= this.mToggleStatusFlag.WorkdaysOnly;
-          }
-          if (this.mShowCompleted) {
-              toggleStatus |= this.mToggleStatusFlag.ShowCompleted;
-          }
+            if (this.mTasksInView) {
+                toggleStatus |= this.mToggleStatusFlag.TasksInView;
+            }
+            if (this.mWorkdaysOnly) {
+                toggleStatus |= this.mToggleStatusFlag.WorkdaysOnly;
+            }
+            if (this.mShowCompleted) {
+                toggleStatus |= this.mToggleStatusFlag.ShowCompleted;
+            }
 
-          // Update the navigation bar only when changes are related to the current view.
-          if (this.isVisible()) {
-              cal.navigationBar.setDateRange(aStartDate, aEndDate);
-          }
+            // Update the navigation bar only when changes are related to the current view.
+            if (this.isVisible()) {
+                cal.navigationBar.setDateRange(aStartDate, aEndDate);
+            }
 
-          // Check whether view range has been changed since last call to
-          // relayout()
-          if (!this.mViewStart || !this.mViewEnd ||
-              this.mViewEnd.compare(viewEnd) != 0 ||
-              this.mViewStart.compare(viewStart) != 0 ||
-              this.mToggleStatus != toggleStatus) {
-              this.refresh();
-          }
+            // Check whether view range has been changed since last call to
+            // relayout()
+            if (!this.mViewStart || !this.mViewEnd ||
+                this.mViewEnd.compare(viewEnd) != 0 ||
+                this.mViewStart.compare(viewStart) != 0 ||
+                this.mToggleStatus != toggleStatus) {
+                this.refresh();
+            }
 
         ]]></body>
       </method>
 
       <method name="getDateList">
         <parameter name="aCount"/>
         <body><![CDATA[
-          if (!this.mStartDate || !this.mEndDate) {
-              aCount.value = 0;
-              return [];
-          }
+            if (!this.mStartDate || !this.mEndDate) {
+                aCount.value = 0;
+                return [];
+            }
 
-          let results = [];
-          let curDate = this.mStartDate.clone();
-          curDate.isDate = true;
+            let results = [];
+            let curDate = this.mStartDate.clone();
+            curDate.isDate = true;
 
-          while (curDate.compare(this.mEndDate) <= 0) {
-              results.push(curDate.clone());
-              curDate.day += 1;
-          }
-          aCount.value = results.length;
-          return results;
+            while (curDate.compare(this.mEndDate) <= 0) {
+                results.push(curDate.clone());
+                curDate.day += 1;
+            }
+            aCount.value = results.length;
+            return results;
         ]]></body>
       </method>
 
       <!-- public properties and methods -->
 
       <!-- whether to show days outside of the current month -->
       <property name="showDaysOutsideMonth">
         <getter><![CDATA[
-          return this.mShowDaysOutsideMonth;
+            return this.mShowDaysOutsideMonth;
         ]]></getter>
         <setter><![CDATA[
-          if (this.mShowDaysOutsideMonth != val) {
-              this.mShowDaysOutsideMonth = val;
-              this.refresh();
-          }
-          return val;
+            if (this.mShowDaysOutsideMonth != val) {
+                this.mShowDaysOutsideMonth = val;
+                this.refresh();
+            }
+            return val;
         ]]></setter>
       </property>
 
       <!-- private properties and methods -->
 
       <property name="monthgrid" readonly="true"
                 onget="return document.getAnonymousElementByAttribute(this, 'anonid', 'monthgrid');"/>
 
       <property name="monthgridrows" readonly="true"
                 onget="return document.getAnonymousElementByAttribute(this, 'anonid', 'monthgridrows');"/>
 
       <method name="relayout">
         <body><![CDATA[
-          // Adjust headers based on the starting day of the week, if necessary
-          if (this.labeldaybox.firstChild.weekDay != this.weekStartOffset) {
-              for (let i = 0; i < this.labeldaybox.childNodes.length; i++) {
-                  this.labeldaybox.childNodes[i].weekDay = (i + this.weekStartOffset) % 7;
-              }
-          }
+            // Adjust headers based on the starting day of the week, if necessary
+            if (this.labeldaybox.firstChild.weekDay != this.weekStartOffset) {
+                for (let i = 0; i < this.labeldaybox.childNodes.length; i++) {
+                    this.labeldaybox.childNodes[i].weekDay = (i + this.weekStartOffset) % 7;
+                }
+            }
 
-          if (this.mSelectedItems.length) {
-              this.mSelectedItems = [];
-          }
+            if (this.mSelectedItems.length) {
+                this.mSelectedItems = [];
+            }
 
-          if (!this.mStartDate || !this.mEndDate) {
-              throw Components.results.NS_ERROR_FAILURE;
-          }
+            if (!this.mStartDate || !this.mEndDate) {
+                throw Components.results.NS_ERROR_FAILURE;
+            }
 
-          // Days that are not in the main month on display are displayed with
-          // a gray background.  Unless the month actually starts on a Sunday,
-          // this means that mStartDate.month is 1 month less than the main month
-          let mainMonth = this.mStartDate.month;
-          if (this.mStartDate.day != 1) {
-              mainMonth++;
-              mainMonth = mainMonth % 12;
-          }
+            // Days that are not in the main month on display are displayed with
+            // a gray background.  Unless the month actually starts on a Sunday,
+            // this means that mStartDate.month is 1 month less than the main month
+            let mainMonth = this.mStartDate.month;
+            if (this.mStartDate.day != 1) {
+                mainMonth++;
+                mainMonth = mainMonth % 12;
+            }
 
-          let dateBoxes = [];
-          let today = this.today();
+            let dateBoxes = [];
+            let today = this.today();
 
-          // This gets set to true, telling us to collapse the rest of the rows
-          let finished = false;
-          let dateList = this.getDateList({});
+            // This gets set to true, telling us to collapse the rest of the rows
+            let finished = false;
+            let dateList = this.getDateList({});
 
-          // This allows to find the first column of dayboxes where to set the
-          // week labels taking into account whether days-off are displayed or not.
-          let weekLabelColumnPos = -1;
+            // This allows to find the first column of dayboxes where to set the
+            // week labels taking into account whether days-off are displayed or not.
+            let weekLabelColumnPos = -1;
 
-          let rows = this.monthgridrows.childNodes;
+            let rows = this.monthgridrows.childNodes;
 
-          // Iterate through each monthgridrow and set up the day-boxes that
-          // are its child nodes.  Remember, childNodes is not a normal array,
-          // so don't use the in operator if you don't want extra properties
-          // coming out.
-          for (let i = 0; i < rows.length; i++) {
-              let row = rows[i];
-              // If we've already assigned all of the day-boxes that we need, just
-              // collapse the rest of the rows, otherwise expand them if needed.
-              if (finished) {
-                  row.setAttribute("collapsed", true);
-                  continue;
-              } else {
-                  row.removeAttribute("collapsed");
-              }
-              for (let j = 0; j < row.childNodes.length; j++) {
-                  let daybox = row.childNodes[j];
-                  let date = dateList[dateBoxes.length];
+            // Iterate through each monthgridrow and set up the day-boxes that
+            // are its child nodes.  Remember, childNodes is not a normal array,
+            // so don't use the in operator if you don't want extra properties
+            // coming out.
+            for (let i = 0; i < rows.length; i++) {
+                let row = rows[i];
+                // If we've already assigned all of the day-boxes that we need, just
+                // collapse the rest of the rows, otherwise expand them if needed.
+                if (finished) {
+                    row.setAttribute("collapsed", true);
+                    continue;
+                } else {
+                    row.removeAttribute("collapsed");
+                }
+                for (let j = 0; j < row.childNodes.length; j++) {
+                    let daybox = row.childNodes[j];
+                    let date = dateList[dateBoxes.length];
 
-                  // Remove the attribute "relation" for all the column headers.
-                  // Consider only the first row index otherwise it will be
-                  // removed again afterwards the correct setting.
-                  if (i == 0) {
-                      this.labeldaybox.childNodes[j].removeAttribute("relation");
-                  }
+                    // Remove the attribute "relation" for all the column headers.
+                    // Consider only the first row index otherwise it will be
+                    // removed again afterwards the correct setting.
+                    if (i == 0) {
+                        this.labeldaybox.childNodes[j].removeAttribute("relation");
+                    }
 
-                  daybox.setAttribute("context", this.getAttribute("context"));
-                  daybox.setAttribute("item-context", this.getAttribute("item-context") || this.getAttribute("context"));
+                    daybox.setAttribute("context", this.getAttribute("context"));
+                    daybox.setAttribute("item-context", this.getAttribute("item-context") || this.getAttribute("context"));
 
-                  // Set the box-class depending on if this box displays a day in
-                  // the month being currently shown or not.
-                  let boxClass;
-                  if (this.showFullMonth) {
-                      boxClass = "calendar-month-day-box-" +
-                                 (mainMonth == date.month ? "current-month" : "other-month");
-                  } else {
-                      boxClass = "calendar-month-day-box-current-month";
-                  }
-                  if (this.mDaysOffArray.some(dayOffNum => dayOffNum == date.weekday)) {
-                      boxClass = "calendar-month-day-box-day-off " + boxClass;
-                  }
+                    // Set the box-class depending on if this box displays a day in
+                    // the month being currently shown or not.
+                    let boxClass;
+                    if (this.showFullMonth) {
+                        boxClass = "calendar-month-day-box-" +
+                                   (mainMonth == date.month ? "current-month" : "other-month");
+                    } else {
+                        boxClass = "calendar-month-day-box-current-month";
+                    }
+                    if (this.mDaysOffArray.some(dayOffNum => dayOffNum == date.weekday)) {
+                        boxClass = "calendar-month-day-box-day-off " + boxClass;
+                    }
 
-                  // Set up date relations
-                  switch (date.compare(today)) {
-                      case -1:
-                          daybox.setAttribute("relation", "past");
-                          break;
-                      case 0:
-                          daybox.setAttribute("relation", "today");
-                          this.labeldaybox.childNodes[j].setAttribute("relation", "today");
-                          break;
-                      case 1:
-                          daybox.setAttribute("relation", "future");
-                          break;
-                  }
+                    // Set up date relations
+                    switch (date.compare(today)) {
+                        case -1:
+                            daybox.setAttribute("relation", "past");
+                            break;
+                        case 0:
+                            daybox.setAttribute("relation", "today");
+                            this.labeldaybox.childNodes[j].setAttribute("relation", "today");
+                            break;
+                        case 1:
+                            daybox.setAttribute("relation", "future");
+                            break;
+                    }
 
-                  // Set up label with the week number in the first day of the row.
-                  if (this.mShowWeekNumber) {
-                      let weekLabel = document.getAnonymousElementByAttribute(daybox, "anonid", "week-label");
-                      if (weekLabelColumnPos < 0) {
-                          let isDayOff = this.mDaysOffArray.includes((j + this.mWeekStartOffset) % 7);
-                          if (this.mDisplayDaysOff || !isDayOff) {
-                              weekLabelColumnPos = j;
-                          }
-                      }
-                      // Build and set the label.
-                      if (j == weekLabelColumnPos) {
-                          weekLabel.removeAttribute("hidden");
-                          let weekNumber = cal.getWeekInfoService().getWeekTitle(date);
-                          let weekString = cal.calGetString("calendar", "abbreviationOfWeek", [weekNumber]);
-                          weekLabel.value = weekString;
-                      } else {
-                          weekLabel.hidden = true;
-                      }
-                  }
+                    // Set up label with the week number in the first day of the row.
+                    if (this.mShowWeekNumber) {
+                        let weekLabel = document.getAnonymousElementByAttribute(daybox, "anonid", "week-label");
+                        if (weekLabelColumnPos < 0) {
+                            let isDayOff = this.mDaysOffArray.includes((j + this.mWeekStartOffset) % 7);
+                            if (this.mDisplayDaysOff || !isDayOff) {
+                                weekLabelColumnPos = j;
+                            }
+                        }
+                        // Build and set the label.
+                        if (j == weekLabelColumnPos) {
+                            weekLabel.removeAttribute("hidden");
+                            let weekNumber = cal.getWeekInfoService().getWeekTitle(date);
+                            let weekString = cal.calGetString("calendar", "abbreviationOfWeek", [weekNumber]);
+                            weekLabel.value = weekString;
+                        } else {
+                            weekLabel.hidden = true;
+                        }
+                    }
 
-                  daybox.setAttribute("class", boxClass);
+                    daybox.setAttribute("class", boxClass);
 
-                  daybox.setDate(date);
-                  if (date.day == 1 || date.day == date.endOfMonth.day) {
-                      daybox.showMonthLabel = true;
-                  } else {
-                      daybox.showMonthLabel = false;
-                  }
-                  daybox.calendarView = this;
-                  daybox.date = date;
-                  dateBoxes.push(daybox);
+                    daybox.setDate(date);
+                    if (date.day == 1 || date.day == date.endOfMonth.day) {
+                        daybox.showMonthLabel = true;
+                    } else {
+                        daybox.showMonthLabel = false;
+                    }
+                    daybox.calendarView = this;
+                    daybox.date = date;
+                    dateBoxes.push(daybox);
 
-                  // If we've now assigned all of our dates, set this to true so we
-                  // know we can just collapse the rest of the rows.
-                  if (dateBoxes.length == dateList.length) {
-                      finished = true;
-                  }
-              }
-          }
+                    // If we've now assigned all of our dates, set this to true so we
+                    // know we can just collapse the rest of the rows.
+                    if (dateBoxes.length == dateList.length) {
+                        finished = true;
+                    }
+                }
+            }
 
-          // If we're not showing a full month, then add a few extra labels to
-          // help the user orient themselves in the view.
-          if (!this.mShowFullMonth) {
-              dateBoxes[0].showMonthLabel = true;
-              dateBoxes[dateBoxes.length - 1].showMonthLabel = true;
-          }
+            // If we're not showing a full month, then add a few extra labels to
+            // help the user orient themselves in the view.
+            if (!this.mShowFullMonth) {
+                dateBoxes[0].showMonthLabel = true;
+                dateBoxes[dateBoxes.length - 1].showMonthLabel = true;
+            }
 
-          // Store these, so that we can access them later
-          this.mDateBoxes = dateBoxes;
-          this.hideDaysOff();
+            // Store these, so that we can access them later
+            this.mDateBoxes = dateBoxes;
+            this.hideDaysOff();
 
-          this.adjustWeekdayLength();
+            this.adjustWeekdayLength();
 
-          // Store the start and end of current view. Next time when
-          // setDateRange is called, it will use mViewStart and mViewEnd to
-          // check if view range has been changed.
-          this.mViewStart = this.mStartDate;
-          this.mViewEnd = this.mEndDate;
+            // Store the start and end of current view. Next time when
+            // setDateRange is called, it will use mViewStart and mViewEnd to
+            // check if view range has been changed.
+            this.mViewStart = this.mStartDate;
+            this.mViewEnd = this.mEndDate;
 
-          // Store toggle status of current view
-          let toggleStatus = 0;
+            // Store toggle status of current view
+            let toggleStatus = 0;
 
-          if (this.mTasksInView) {
-              toggleStatus |= this.mToggleStatusFlag.TasksInView;
-          }
-          if (this.mWorkdaysOnly) {
-              toggleStatus |= this.mToggleStatusFlag.WorkdaysOnly;
-          }
-          if (this.mShowCompleted) {
-              toggleStatus |= this.mToggleStatusFlag.ShowCompleted;
-          }
+            if (this.mTasksInView) {
+                toggleStatus |= this.mToggleStatusFlag.TasksInView;
+            }
+            if (this.mWorkdaysOnly) {
+                toggleStatus |= this.mToggleStatusFlag.WorkdaysOnly;
+            }
+            if (this.mShowCompleted) {
+                toggleStatus |= this.mToggleStatusFlag.ShowCompleted;
+            }
 
-          this.mToggleStatus = toggleStatus;
+            this.mToggleStatus = toggleStatus;
         ]]></body>
       </method>
 
       <method name="hideWeekNumbers">
         <body><![CDATA[
-          let rows = this.monthgridrows.childNodes;
-          for (let i = 0; i < rows.length; i++) {
-              let row = rows[i];
-              for (let j = 0; j < row.childNodes.length; j++) {
-                  let daybox = row.childNodes[j];
-                  let weekLabel = document.getAnonymousElementByAttribute(daybox, "anonid", "week-label");
-                  weekLabel.hidden = true;
-              }
-          }
+            let rows = this.monthgridrows.childNodes;
+            for (let i = 0; i < rows.length; i++) {
+                let row = rows[i];
+                for (let j = 0; j < row.childNodes.length; j++) {
+                    let daybox = row.childNodes[j];
+                    let weekLabel = document.getAnonymousElementByAttribute(daybox, "anonid", "week-label");
+                    weekLabel.hidden = true;
+                }
+            }
         ]]></body>
       </method>
 
       <method name="hideDaysOff">
         <body><![CDATA[
-          let columns = document.getAnonymousElementByAttribute(this, "anonid", "monthgridcolumns").childNodes;
-          let headerkids = document.getAnonymousElementByAttribute(this, "anonid", "labeldaybox").childNodes;
-          for (let i = 0; i < columns.length; i++) {
-              let dayForColumn = (i + this.mWeekStartOffset) % 7;
-              let dayOff = this.mDaysOffArray.includes(dayForColumn);
-              columns[i].collapsed = dayOff && !this.mDisplayDaysOff;
-              headerkids[i].collapsed = dayOff && !this.mDisplayDaysOff;
-          }
+            let columns = document.getAnonymousElementByAttribute(this, "anonid", "monthgridcolumns").childNodes;
+            let headerkids = document.getAnonymousElementByAttribute(this, "anonid", "labeldaybox").childNodes;
+            for (let i = 0; i < columns.length; i++) {
+                let dayForColumn = (i + this.mWeekStartOffset) % 7;
+                let dayOff = this.mDaysOffArray.includes(dayForColumn);
+                columns[i].collapsed = dayOff && !this.mDisplayDaysOff;
+                headerkids[i].collapsed = dayOff && !this.mDisplayDaysOff;
+            }
         ]]></body>
       </method>
 
       <method name="findDayBoxForDate">
         <parameter name="aDate"/>
         <body><![CDATA[
-          if (!this.mDateBoxes) {
-              return null;
-          }
-          for (let box of this.mDateBoxes) {
-              if (box.mDate.compare(aDate) == 0) {
-                  return box;
-              }
-          }
-          return null;
+            if (!this.mDateBoxes) {
+                return null;
+            }
+            for (let box of this.mDateBoxes) {
+                if (box.mDate.compare(aDate) == 0) {
+                    return box;
+                }
+            }
+            return null;
         ]]></body>
       </method>
 
       <method name="findDayBoxesForItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          let targetDate = null;
-          let finishDate = null;
-          let boxes = [];
+            let targetDate = null;
+            let finishDate = null;
+            let boxes = [];
 
-          // All our boxes are in default tz, so we need these times in them too.
-          if (cal.isEvent(aItem)) {
-              targetDate = aItem.startDate.getInTimezone(this.mTimezone);
-              finishDate = aItem.endDate.getInTimezone(this.mTimezone);
-          } else if (cal.isToDo(aItem)) {
-              // Consider tasks without entry OR due date.
-              if (aItem.entryDate || aItem.dueDate) {
-                  targetDate = (aItem.entryDate || aItem.dueDate).getInTimezone(this.mTimezone);
-                  finishDate = (aItem.dueDate || aItem.entryDate).getInTimezone(this.mTimezone);
-              }
-          }
+            // All our boxes are in default tz, so we need these times in them too.
+            if (cal.isEvent(aItem)) {
+                targetDate = aItem.startDate.getInTimezone(this.mTimezone);
+                finishDate = aItem.endDate.getInTimezone(this.mTimezone);
+            } else if (cal.isToDo(aItem)) {
+                // Consider tasks without entry OR due date.
+                if (aItem.entryDate || aItem.dueDate) {
+                    targetDate = (aItem.entryDate || aItem.dueDate).getInTimezone(this.mTimezone);
+                    finishDate = (aItem.dueDate || aItem.entryDate).getInTimezone(this.mTimezone);
+                }
+            }
 
-          if (!targetDate) {
-              return boxes;
-          }
+            if (!targetDate) {
+                return boxes;
+            }
 
-          if (!finishDate) {
-              let maybeBox = this.findDayBoxForDate(targetDate);
-              if (maybeBox) {
-                  boxes.push(maybeBox);
-              }
-              return boxes;
-          }
+            if (!finishDate) {
+                let maybeBox = this.findDayBoxForDate(targetDate);
+                if (maybeBox) {
+                    boxes.push(maybeBox);
+                }
+                return boxes;
+            }
 
-          if (!targetDate.isDate) {
-              // Reset the time to 00:00, so that we really get all the boxes
-              targetDate.hour = 0;
-              targetDate.minute = 0;
-              targetDate.second = 0;
-          }
+            if (!targetDate.isDate) {
+                // Reset the time to 00:00, so that we really get all the boxes
+                targetDate.hour = 0;
+                targetDate.minute = 0;
+                targetDate.second = 0;
+            }
 
-          if (targetDate.compare(finishDate) == 0) {
-              // We have also to handle zero length events in particular for
-              // tasks without entry or due date.
-              let box = this.findDayBoxForDate(targetDate);
-              if (box) {
-                  boxes.push(box);
-              }
-          }
+            if (targetDate.compare(finishDate) == 0) {
+                // We have also to handle zero length events in particular for
+                // tasks without entry or due date.
+                let box = this.findDayBoxForDate(targetDate);
+                if (box) {
+                    boxes.push(box);
+                }
+            }
 
-          while (targetDate.compare(finishDate) == -1) {
-              let box = this.findDayBoxForDate(targetDate);
+            while (targetDate.compare(finishDate) == -1) {
+                let box = this.findDayBoxForDate(targetDate);
 
-              // This might not exist, if the event spans the view start or end
-              if (box) {
-                  boxes.push(box);
-              }
-              targetDate.day += 1;
-          }
+                // This might not exist, if the event spans the view start or end
+                if (box) {
+                    boxes.push(box);
+                }
+                targetDate.day += 1;
+            }
 
-          return boxes;
-	]]></body>
+            return boxes;
+        ]]></body>
       </method>
 
       <method name="doAddItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          let boxes = this.findDayBoxesForItem(aItem);
+            let boxes = this.findDayBoxesForItem(aItem);
 
-          if (!boxes.length) {
-              return;
-          }
+            if (!boxes.length) {
+                return;
+            }
 
-          for (let box of boxes) {
-              box.addItem(aItem);
-          }
+            for (let box of boxes) {
+                box.addItem(aItem);
+            }
         ]]></body>
       </method>
 
       <method name="doDeleteItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          let boxes = this.findDayBoxesForItem(aItem);
+            let boxes = this.findDayBoxesForItem(aItem);
 
-          if (!boxes.length) {
-              return;
-          }
+            if (!boxes.length) {
+                return;
+            }
 
-          function isNotItem(a) {
-              return (a.hashId != aItem.hashId);
-          }
-          let oldLength = this.mSelectedItems.length;
-          this.mSelectedItems = this.mSelectedItems.filter(isNotItem);
+            function isNotItem(a) {
+                return (a.hashId != aItem.hashId);
+            }
+            let oldLength = this.mSelectedItems.length;
+            this.mSelectedItems = this.mSelectedItems.filter(isNotItem);
 
-          for (let box of boxes) {
-              box.deleteItem(aItem);
-          }
+            for (let box of boxes) {
+                box.deleteItem(aItem);
+            }
 
-          // If a deleted event was selected, we need to announce that the
-          // selection changed.
-          if (oldLength != this.mSelectedItems.length) {
-              this.fireEvent("itemselect", this.mSelectedItems);
-          }
+            // If a deleted event was selected, we need to announce that the
+            // selection changed.
+            if (oldLength != this.mSelectedItems.length) {
+                this.fireEvent("itemselect", this.mSelectedItems);
+            }
         ]]></body>
       </method>
 
       <method name="deleteItemsFromCalendar">
         <parameter name="aCalendar"/>
         <body><![CDATA[
-          if (!this.mDateBoxes) {
-              return;
-          }
-          for (let box of this.mDateBoxes) {
-              for (let id in box.mItemHash) {
-                  let node = box.mItemHash[id];
-                  let item = node.item;
-                  if (item.calendar.id == aCalendar.id) {
-                      box.deleteItem(item);
-                  }
-              }
-          }
+            if (!this.mDateBoxes) {
+                return;
+            }
+            for (let box of this.mDateBoxes) {
+                for (let id in box.mItemHash) {
+                    let node = box.mItemHash[id];
+                    let item = node.item;
+                    if (item.calendar.id == aCalendar.id) {
+                        box.deleteItem(item);
+                    }
+                }
+            }
         ]]></body>
       </method>
 
       <method name="flashAlarm">
         <parameter name="aAlarmItem"/>
         <parameter name="aStop"/>
         <body><![CDATA[
-          let showIndicator = Preferences.get("calendar.alarms.indicator.show", true);
-          let totaltime = Preferences.get("calendar.alarms.indicator.totaltime", 3600);
+            let showIndicator = Preferences.get("calendar.alarms.indicator.show", true);
+            let totaltime = Preferences.get("calendar.alarms.indicator.totaltime", 3600);
 
-          if (!aStop && (!showIndicator || totaltime < 1)) {
-              // No need to animate if the indicator should not be shown.
-              return;
-          }
+            if (!aStop && (!showIndicator || totaltime < 1)) {
+                // No need to animate if the indicator should not be shown.
+                return;
+            }
 
-          // Make sure the flashing attribute is set or reset on all visible
-          // boxes.
-          let boxes = this.findDayBoxesForItem(aAlarmItem);
-          for (let box of boxes) {
-              for (let id in box.mItemHash) {
-                  let itemData = box.mItemHash[id];
-                  if (itemData.item.hasSameIds(aAlarmItem)) {
-                      if (aStop) {
-                          itemData.removeAttribute("flashing");
-                      } else {
-                          itemData.setAttribute("flashing", "true");
-                      }
-                  }
-              }
-          }
+            // Make sure the flashing attribute is set or reset on all visible
+            // boxes.
+            let boxes = this.findDayBoxesForItem(aAlarmItem);
+            for (let box of boxes) {
+                for (let id in box.mItemHash) {
+                    let itemData = box.mItemHash[id];
+                    if (itemData.item.hasSameIds(aAlarmItem)) {
+                        if (aStop) {
+                            itemData.removeAttribute("flashing");
+                        } else {
+                            itemData.setAttribute("flashing", "true");
+                        }
+                    }
+                }
+            }
 
-          if (aStop) {
-              // We are done flashing, prevent newly created event boxes from flashing.
-              delete this.mFlashingEvents[aAlarmItem.hashId];
-          } else {
-              // Set up a timer to stop the flashing after the total time.
-              this.mFlashingEvents[aAlarmItem.hashId] = aAlarmItem;
-              setTimeout(() => this.flashAlarm(aAlarmItem, true), totaltime);
-          }
+            if (aStop) {
+                // We are done flashing, prevent newly created event boxes from flashing.
+                delete this.mFlashingEvents[aAlarmItem.hashId];
+            } else {
+                // Set up a timer to stop the flashing after the total time.
+                this.mFlashingEvents[aAlarmItem.hashId] = aAlarmItem;
+                setTimeout(() => this.flashAlarm(aAlarmItem, true), totaltime);
+            }
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="wheel"><![CDATA[
-        const pixelThreshold = 150;
-        let scrollEnabled = Preferences.get("calendar.view.mousescroll", true);
-        if (!event.ctrlKey && !event.shiftKey &&
-            !event.altKey && !event.metaKey && scrollEnabled) {
-            // In the month view, the only thing that can be scrolled
-            // is the month the user is in. calendar-base-view takes care
-            // of the shift key, so only move the view when no modifier
-            // is pressed.
-            let deltaView = 0;
-            if (event.deltaMode == event.DOM_DELTA_LINE) {
-                if (event.deltaY != 0) {
-                    deltaView = event.deltaY < 0 ? -1 : 1;
-                }
-            } else if (event.deltaMode == event.DOM_DELTA_PIXEL) {
-                this.mPixelScrollDelta += event.deltaY;
-                if (this.mPixelScrollDelta > pixelThreshold) {
-                    deltaView = 1;
-                    this.mPixelScrollDelta = 0;
-                } else if (this.mPixelScrollDelta < -pixelThreshold) {
-                    deltaView = -1;
-                    this.mPixelScrollDelta = 0;
-                }
-            }
+          const pixelThreshold = 150;
+          let scrollEnabled = Preferences.get("calendar.view.mousescroll", true);
+          if (!event.ctrlKey && !event.shiftKey &&
+              !event.altKey && !event.metaKey && scrollEnabled) {
+              // In the month view, the only thing that can be scrolled
+              // is the month the user is in. calendar-base-view takes care
+              // of the shift key, so only move the view when no modifier
+              // is pressed.
+              let deltaView = 0;
+              if (event.deltaMode == event.DOM_DELTA_LINE) {
+                  if (event.deltaY != 0) {
+                      deltaView = event.deltaY < 0 ? -1 : 1;
+                  }
+              } else if (event.deltaMode == event.DOM_DELTA_PIXEL) {
+                  this.mPixelScrollDelta += event.deltaY;
+                  if (this.mPixelScrollDelta > pixelThreshold) {
+                      deltaView = 1;
+                      this.mPixelScrollDelta = 0;
+                  } else if (this.mPixelScrollDelta < -pixelThreshold) {
+                      deltaView = -1;
+                      this.mPixelScrollDelta = 0;
+                  }
+              }
 
-            if (deltaView != 0) {
-                this.moveView(deltaView);
-            }
-        }
+              if (deltaView != 0) {
+                  this.moveView(deltaView);
+              }
+          }
       ]]></handler>
     </handlers>
   </binding>
 </bindings>
--- a/calendar/base/content/calendar-multiday-view.xml
+++ b/calendar/base/content/calendar-multiday-view.xml
@@ -26,150 +26,150 @@
     <implementation>
       <field name="mPixPerMin">0.6</field>
       <field name="mStartMin">0</field>
       <field name="mEndMin">24 * 60</field>
       <field name="mDayStartHour">0</field>
       <field name="mDayEndHour">24</field>
 
       <constructor>
-        this.relayout();
+          this.relayout();
       </constructor>
 
       <method name="setDayStartEndHours">
         <parameter name="aDayStartHour"/>
         <parameter name="aDayEndHour"/>
         <body><![CDATA[
-          if (aDayStartHour * 60 < this.mStartMin ||
-              aDayStartHour > aDayEndHour ||
-              aDayEndHour * 60 > this.mEndMin) {
-              throw Components.results.NS_ERROR_INVALID_ARG;
-          }
-          if (this.mDayStartHour != aDayStartHour ||
-              this.mDayEndHour != aDayEndHour) {
-              this.mDayEndHour = aDayEndHour;
-              this.mDayStartHour = aDayStartHour;
-
-              let topbox = document.getAnonymousElementByAttribute(this, "anonid", "topbox");
-              if (topbox.childNodes.length) {
-                  // This only needs to be done if the initial relayout has
-                  // already happened, otherwise it will be done then.
-                  for (let hour = this.mStartMin / 60; hour < this.mEndMin / 60; hour++) {
-                      if (hour < this.mDayStartHour || hour >= this.mDayEndHour) {
-                          topbox.childNodes[hour].setAttribute("off-time", "true");
-                      } else {
-                          topbox.childNodes[hour].removeAttribute("off-time");
-                      }
-                  }
-              }
-          }
+            if (aDayStartHour * 60 < this.mStartMin ||
+                aDayStartHour > aDayEndHour ||
+                aDayEndHour * 60 > this.mEndMin) {
+                throw Components.results.NS_ERROR_INVALID_ARG;
+            }
+            if (this.mDayStartHour != aDayStartHour ||
+                this.mDayEndHour != aDayEndHour) {
+                this.mDayEndHour = aDayEndHour;
+                this.mDayStartHour = aDayStartHour;
+
+                let topbox = document.getAnonymousElementByAttribute(this, "anonid", "topbox");
+                if (topbox.childNodes.length) {
+                    // This only needs to be done if the initial relayout has
+                    // already happened, otherwise it will be done then.
+                    for (let hour = this.mStartMin / 60; hour < this.mEndMin / 60; hour++) {
+                        if (hour < this.mDayStartHour || hour >= this.mDayEndHour) {
+                            topbox.childNodes[hour].setAttribute("off-time", "true");
+                        } else {
+                            topbox.childNodes[hour].removeAttribute("off-time");
+                        }
+                    }
+                }
+            }
         ]]></body>
       </method>
 
       <method name="setAttribute">
         <parameter name="aAttr"/>
         <parameter name="aVal"/>
         <body><![CDATA[
-          let needsrelayout = false;
-          if (aAttr == "orient") {
-              if (this.getAttribute("orient") != aVal) {
-                  needsrelayout = true;
-              }
-          }
-
-          // this should be done using lookupMethod(), see bug 286629
-          let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
-
-          if (needsrelayout) {
-              this.relayout();
-          }
-
-          return ret;
+            let needsrelayout = false;
+            if (aAttr == "orient") {
+                if (this.getAttribute("orient") != aVal) {
+                    needsrelayout = true;
+                }
+            }
+
+            // this should be done using lookupMethod(), see bug 286629
+            let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
+
+            if (needsrelayout) {
+                this.relayout();
+            }
+
+            return ret;
         ]]></body>
       </method>
 
       <property name="pixelsPerMinute"
                 onget="return this.mPixPerMin"
                 onset="if (this.mPixPerMin != val) { this.mPixPerMin = val; this.relayout(); } return val;"/>
 
       <method name="relayout">
         <body><![CDATA[
-          Components.utils.import("resource://calendar/modules/calUtils.jsm");
-          let topbox = document.getAnonymousElementByAttribute(this, "anonid", "topbox");
-          let orient = topbox.getAttribute("orient");
-
-          function makeTimeBox(timestr, size) {
-              let box = createXULElement("box");
-              box.setAttribute("orient", orient);
-
-              if (orient == "horizontal") {
-                  box.setAttribute("width", size);
-              } else {
-                  box.setAttribute("height", size);
-              }
-
-              let label = createXULElement("label");
-              label.setAttribute("class", "calendar-time-bar-label");
-              label.setAttribute("value", timestr);
-              label.setAttribute("align", "center");
-
-              box.appendChild(label);
-
-              return box;
-          }
-
-          while (topbox.hasChildNodes()) {
-              topbox.lastChild.remove();
-          }
-
-          let timeFormatter = cal.getDateFormatter();
-          let jsTime = new Date();
-          let timeString;
-          let theMin = this.mStartMin;
-          let theHour = Math.floor(theMin / 60);
-          let durLeft = this.mEndMin - this.mStartMin;
-
-          while (durLeft > 0) {
-              let dur;
-              if (this.mEndMin - theMin < 60) {
-                  dur = this.mEndMin - theMin;
-              } else {
-                  dur = theMin % 60;
-              }
-              theMin += dur;
-              if (dur == 0) {
-                  dur = 60;
-              }
-
-              // calculate duration pixel as the difference between
-              // start pixel and end pixel to avoid rounding errors.
-              let startPix = Math.round(theMin * this.mPixPerMin);
-              let endPix = Math.round((theMin + dur) * this.mPixPerMin);
-              let durPix = endPix - startPix;
-              let box;
-              if (dur == 60) {
-                  jsTime.setHours(theHour, 0, 0);
-                  timeString = timeFormatter.formatTime(cal.jsDateToDateTime(jsTime, cal.floating()));
-                  box = makeTimeBox(timeString, durPix);
-              } else {
-                  box = makeTimeBox("", durPix);
-              }
-
-              // Set up workweek hours
-              if (theHour < this.mDayStartHour || theHour >= this.mDayEndHour) {
-                  box.setAttribute("off-time", "true");
-              }
-
-              box.setAttribute("class", "calendar-time-bar-box-" + (theHour % 2 == 0 ? "even" : "odd"));
-              topbox.appendChild(box);
-
-              durLeft -= dur;
-              theMin += dur;
-              theHour++;
-          }
+            Components.utils.import("resource://calendar/modules/calUtils.jsm");
+            let topbox = document.getAnonymousElementByAttribute(this, "anonid", "topbox");
+            let orient = topbox.getAttribute("orient");
+
+            function makeTimeBox(timestr, size) {
+                let box = createXULElement("box");
+                box.setAttribute("orient", orient);
+
+                if (orient == "horizontal") {
+                    box.setAttribute("width", size);
+                } else {
+                    box.setAttribute("height", size);
+                }
+
+                let label = createXULElement("label");
+                label.setAttribute("class", "calendar-time-bar-label");
+                label.setAttribute("value", timestr);
+                label.setAttribute("align", "center");
+
+                box.appendChild(label);
+
+                return box;
+            }
+
+            while (topbox.hasChildNodes()) {
+                topbox.lastChild.remove();
+            }
+
+            let timeFormatter = cal.getDateFormatter();
+            let jsTime = new Date();
+            let timeString;
+            let theMin = this.mStartMin;
+            let theHour = Math.floor(theMin / 60);
+            let durLeft = this.mEndMin - this.mStartMin;
+
+            while (durLeft > 0) {
+                let dur;
+                if (this.mEndMin - theMin < 60) {
+                    dur = this.mEndMin - theMin;
+                } else {
+                    dur = theMin % 60;
+                }
+                theMin += dur;
+                if (dur == 0) {
+                    dur = 60;
+                }
+
+                // calculate duration pixel as the difference between
+                // start pixel and end pixel to avoid rounding errors.
+                let startPix = Math.round(theMin * this.mPixPerMin);
+                let endPix = Math.round((theMin + dur) * this.mPixPerMin);
+                let durPix = endPix - startPix;
+                let box;
+                if (dur == 60) {
+                    jsTime.setHours(theHour, 0, 0);
+                    timeString = timeFormatter.formatTime(cal.jsDateToDateTime(jsTime, cal.floating()));
+                    box = makeTimeBox(timeString, durPix);
+                } else {
+                    box = makeTimeBox("", durPix);
+                }
+
+                // Set up workweek hours
+                if (theHour < this.mDayStartHour || theHour >= this.mDayEndHour) {
+                    box.setAttribute("off-time", "true");
+                }
+
+                box.setAttribute("class", "calendar-time-bar-box-" + (theHour % 2 == 0 ? "even" : "odd"));
+                topbox.appendChild(box);
+
+                durLeft -= dur;
+                theMin += dur;
+                theHour++;
+            }
         ]]></body>
       </method>
     </implementation>
   </binding>
 
   <!--
      - A simple gripbar that is displayed at the start and end of an
      - event box.  Needs to handle being dragged and resizing the
@@ -183,43 +183,43 @@
                xbl:inherits="align=whichside">
         <xul:image xbl:inherits="class"/>
       </xul:box>
     </content>
 
     <implementation>
       <property name="parentorient">
         <getter><![CDATA[
-          return this.getAttribute("parentorient");
+            return this.getAttribute("parentorient");
         ]]></getter>
         <setter><![CDATA[
-          let thebox = document.getAnonymousElementByAttribute(this, "anonid", "thebox");
-          this.setAttribute("parentorient", val);
-          thebox.setAttribute("orient", getOtherOrientation(val));
-          return val;
+            let thebox = document.getAnonymousElementByAttribute(this, "anonid", "thebox");
+            this.setAttribute("parentorient", val);
+            thebox.setAttribute("orient", getOtherOrientation(val));
+            return val;
         ]]></setter>
       </property>
 
       <!-- private -->
       <constructor><![CDATA[
-        this.parentorient = this.getAttribute("parentorient");
+          this.parentorient = this.getAttribute("parentorient");
       ]]></constructor>
     </implementation>
 
     <handlers>
       <handler event="mousedown" button="0"><![CDATA[
-        // store the attribute 'whichside' in the event object
-        // but *don't* call stopPropagation(). as soon as the
-        // enclosing event box will receive the event it will
-        // make use of this information in order to invoke the
-        // appropriate action.
-        event.whichside = this.getAttribute("whichside");
+          // store the attribute 'whichside' in the event object
+          // but *don't* call stopPropagation(). as soon as the
+          // enclosing event box will receive the event it will
+          // make use of this information in order to invoke the
+          // appropriate action.
+          event.whichside = this.getAttribute("whichside");
       ]]></handler>
       <handler event="click" button="0"><![CDATA[
-        event.stopPropagation();
+          event.stopPropagation();
       ]]></handler>
     </handlers>
   </binding>
 
   <!--
      - A column for displaying event boxes in.  One column per
      - day; it manages the layout of the events given via add/deleteEvent.
     -->
@@ -239,21 +239,21 @@
           <xul:label anonid="fgdragbox-endlabel" class="fgdragbox-label"/>
         </xul:box>
       </xul:stack>
       <xul:calendar-event-box anonid="config-box" hidden="true" xbl:inherits="orient"/>
     </content>
 
     <implementation>
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-
-        this.mEventInfos = [];
-        this.mTimezone = cal.UTC();
-        this.mSelectedItemIds = {};
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
+
+          this.mEventInfos = [];
+          this.mTimezone = cal.UTC();
+          this.mSelectedItemIds = {};
       ]]></constructor>
 
       <!-- fields -->
       <field name="mPixPerMin">0.6</field>
       <field name="mStartMin">0</field>
       <field name="mEndMin">24 * 60</field>
       <field name="mDayStartMin">8 * 60</field>
       <field name="mDayEndMin">17 * 60</field>
@@ -285,167 +285,167 @@
         -->
       <field name="mCreatedNewEvent">false</field>
       <field name="mEventToEdit">null</field>
       <field name="mSelectedItemIds">null</field>
 
       <!-- properties -->
       <property name="pixelsPerMinute">
         <getter><![CDATA[
-          return this.mPixPerMin;
+            return this.mPixPerMin;
         ]]></getter>
         <setter><![CDATA[
-          if (val <= 0.0) {
-              val = 0.01;
-          }
-          if (val != this.mPixPerMin) {
-              this.mPixPerMin = val;
-              this.relayout();
-          }
-          return val;
+            if (val <= 0.0) {
+                val = 0.01;
+            }
+            if (val != this.mPixPerMin) {
+                this.mPixPerMin = val;
+                this.relayout();
+            }
+            return val;
         ]]></setter>
       </property>
 
       <field name="mSelected">false</field>
       <property name="selected">
         <getter><![CDATA[
-          return this.mSelected;
+            return this.mSelected;
         ]]></getter>
         <setter><![CDATA[
-          this.mSelected = val;
-          if (this.bgbox && this.bgbox.hasChildNodes()) {
-              let child = this.bgbox.firstChild;
-              while (child) {
-                  if (val) {
-                      child.setAttribute("selected", "true");
-                  } else {
-                      child.removeAttribute("selected");
-                  }
-                  child = child.nextSibling;
-              }
-          }
-          return val;
+            this.mSelected = val;
+            if (this.bgbox && this.bgbox.hasChildNodes()) {
+                let child = this.bgbox.firstChild;
+                while (child) {
+                    if (val) {
+                        child.setAttribute("selected", "true");
+                    } else {
+                        child.removeAttribute("selected");
+                    }
+                    child = child.nextSibling;
+                }
+            }
+            return val;
         ]]></setter>
       </property>
 
       <property name="date">
         <getter><![CDATA[
-          return this.mDate;
+            return this.mDate;
         ]]></getter>
         <setter><![CDATA[
-          this.mDate = val;
-
-          if (!cal.compareObjects(val.timezone, this.mTimezone)) {
-              this.mTimezone = val.timezone;
-              if (!this.mLayoutBatchCount) {
-                  this.recalculateStartEndMinutes();
-              }
-          }
-
-          return val;
+            this.mDate = val;
+
+            if (!cal.compareObjects(val.timezone, this.mTimezone)) {
+                this.mTimezone = val.timezone;
+                if (!this.mLayoutBatchCount) {
+                    this.recalculateStartEndMinutes();
+                }
+            }
+
+            return val;
         ]]></setter>
       </property>
 
       <property name="calendarView"
                 onget="return this.mCalendarView;"
                 onset="return (this.mCalendarView = val);" />
 
       <property name="topbox" readonly="true">
         <getter><![CDATA[
-          return document.getAnonymousElementByAttribute(this, "anonid", "topbox");
+            return document.getAnonymousElementByAttribute(this, "anonid", "topbox");
         ]]></getter>
       </property>
 
       <property name="bgbox" readonly="true">
         <getter><![CDATA[
-          return document.getAnonymousElementByAttribute(this, "anonid", "bgbox");
+            return document.getAnonymousElementByAttribute(this, "anonid", "bgbox");
         ]]></getter>
       </property>
 
       <field name="mFgboxes">null</field>
       <field name="mMinDuration">null</field>
       <property name="fgboxes" readonly="true">
         <getter><![CDATA[
-          if (this.mFgboxes == null) {
-              this.mFgboxes = {
-                  box: document.getAnonymousElementByAttribute(this, "anonid", "fgbox"),
-                  dragbox: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox"),
-                  dragspacer: document.getAnonymousElementByAttribute(this, "anonid", "fgdragspacer"),
-                  startlabel: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox-startlabel"),
-                  endlabel: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox-endlabel")
-              };
-          }
-          return this.mFgboxes;
+            if (this.mFgboxes == null) {
+                this.mFgboxes = {
+                    box: document.getAnonymousElementByAttribute(this, "anonid", "fgbox"),
+                    dragbox: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox"),
+                    dragspacer: document.getAnonymousElementByAttribute(this, "anonid", "fgdragspacer"),
+                    startlabel: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox-startlabel"),
+                    endlabel: document.getAnonymousElementByAttribute(this, "anonid", "fgdragbox-endlabel")
+                };
+            }
+            return this.mFgboxes;
         ]]></getter>
       </property>
 
       <property name="timeIndicatorBox"
         readonly="true">
         <getter><![CDATA[
-          return document.getAnonymousElementByAttribute(this, "anonid", "timeIndicatorBox");
+            return document.getAnonymousElementByAttribute(this, "anonid", "timeIndicatorBox");
         ]]></getter>
       </property>
 
       <property name="events" readonly="true" onget="return this.methods"/>
 
       <field name="mDayOff">false</field>
       <property name="dayOff">
         <getter><![CDATA[
-          return this.mDayOff;
+            return this.mDayOff;
         ]]></getter>
         <setter><![CDATA[
-          this.mDayOff = val;
-          return val;
+            this.mDayOff = val;
+            return val;
         ]]></setter>
       </property>
 
       <!-- mEventInfos -->
       <field name="mSelectedChunks">[]</field>
 
       <method name="selectOccurrence">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          if (aOccurrence) {
-              this.mSelectedItemIds[aOccurrence.hashId] = true;
-              let chunk = this.findChunkForOccurrence(aOccurrence);
-              if (!chunk) {
-                  return;
-              }
-              chunk.selected = true;
-              this.mSelectedChunks.push(chunk);
-          }
+            if (aOccurrence) {
+                this.mSelectedItemIds[aOccurrence.hashId] = true;
+                let chunk = this.findChunkForOccurrence(aOccurrence);
+                if (!chunk) {
+                    return;
+                }
+                chunk.selected = true;
+                this.mSelectedChunks.push(chunk);
+            }
         ]]></body>
       </method>
 
       <method name="unselectOccurrence">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          if (aOccurrence) {
-              delete this.mSelectedItemIds[aOccurrence.hashId];
-              let chunk = this.findChunkForOccurrence(aOccurrence);
-              if (!chunk) {
-                  return;
-              }
-              chunk.selected = false;
-              let index = this.mSelectedChunks.indexOf(chunk);
-              this.mSelectedChunks.splice(index, 1);
-          }
+            if (aOccurrence) {
+                delete this.mSelectedItemIds[aOccurrence.hashId];
+                let chunk = this.findChunkForOccurrence(aOccurrence);
+                if (!chunk) {
+                    return;
+                }
+                chunk.selected = false;
+                let index = this.mSelectedChunks.indexOf(chunk);
+                this.mSelectedChunks.splice(index, 1);
+            }
         ]]></body>
       </method>
 
       <method name="findChunkForOccurrence">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          for (let chunk of this.mEventBoxes) {
-              if (chunk.occurrence.hashId == aOccurrence.hashId) {
-                  return chunk;
-              }
-          }
-
-          return null;
+            for (let chunk of this.mEventBoxes) {
+                if (chunk.occurrence.hashId == aOccurrence.hashId) {
+                    return chunk;
+                }
+            }
+
+            return null;
         ]]></body>
       </method>
 
       <method name="startLayoutBatchChange">
         <body><![CDATA[
             this.mLayoutBatchCount++;
         ]]></body>
       </method>
@@ -457,1333 +457,1333 @@
             }
         ]]></body>
       </method>
 
       <method name="setAttribute">
         <parameter name="aAttr"/>
         <parameter name="aVal"/>
         <body><![CDATA[
-          // this should be done using lookupMethod(), see bug 286629
-          let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
-
-          if (aAttr == "orient" && this.getAttribute("orient") != aVal) {
-              this.relayout();
-          }
-
-          return ret;
+            // this should be done using lookupMethod(), see bug 286629
+            let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
+
+            if (aAttr == "orient" && this.getAttribute("orient") != aVal) {
+                this.relayout();
+            }
+
+            return ret;
         ]]></body>
       </method>
 
       <method name="internalDeleteEvent">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          let itemIndex = -1;
-          let occ;
-          for (let i in this.mEventInfos) {
-              occ = this.mEventInfos[i].event;
-              if (occ.hashId == aOccurrence.hashId) {
-                  itemIndex = i;
-                  break;
-              }
-          }
-
-          if (itemIndex == -1) {
-              return false;
-          } else {
-              delete this.mSelectedItemIds[occ.hashId];
-              this.mSelectedChunks = this.mSelectedChunks.filter((item) => {
-                  return !item.occurrence || (item.occurrence.hashId != aOccurrence.hashId);
-              });
-              this.mEventInfos.splice(itemIndex, 1);
-              return true;
-          }
+            let itemIndex = -1;
+            let occ;
+            for (let i in this.mEventInfos) {
+                occ = this.mEventInfos[i].event;
+                if (occ.hashId == aOccurrence.hashId) {
+                    itemIndex = i;
+                    break;
+                }
+            }
+
+            if (itemIndex == -1) {
+                return false;
+            } else {
+                delete this.mSelectedItemIds[occ.hashId];
+                this.mSelectedChunks = this.mSelectedChunks.filter((item) => {
+                    return !item.occurrence || (item.occurrence.hashId != aOccurrence.hashId);
+                });
+                this.mEventInfos.splice(itemIndex, 1);
+                return true;
+            }
         ]]></body>
       </method>
 
       <method name="recalculateStartEndMinutes">
         <body><![CDATA[
-          for (let chunk of this.mEventInfos) {
-              let mins = this.getStartEndMinutesForOccurrence(chunk.event);
-              chunk.startMinute = mins.start;
-              chunk.endMinute = mins.end;
-          }
-
-          this.relayout();
+            for (let chunk of this.mEventInfos) {
+                let mins = this.getStartEndMinutesForOccurrence(chunk.event);
+                chunk.startMinute = mins.start;
+                chunk.endMinute = mins.end;
+            }
+
+            this.relayout();
         ]]></body>
       </method>
 
       <!-- This function returns the start and end minutes of the occurrence
            part in the day of this column, moreover, the real start and end
            minutes of the whole occurrence (which could span multiple days)
            relative to the time 0:00 of the day in this column -->
       <method name="getStartEndMinutesForOccurrence">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          let stdate = aOccurrence.startDate || aOccurrence.entryDate || aOccurrence.dueDate;
-          let enddate = aOccurrence.endDate || aOccurrence.dueDate || aOccurrence.entryDate;
-
-          if (!cal.compareObjects(stdate.timezone, this.mTimezone)) {
-              stdate = stdate.getInTimezone(this.mTimezone);
-          }
-
-          if (!cal.compareObjects(enddate.timezone, this.mTimezone)) {
-              enddate = enddate.getInTimezone(this.mTimezone);
-          }
-
-          let startHour = stdate.hour;
-          let startMinute = stdate.minute;
-          let endHour = enddate.hour;
-          let endMinute = enddate.minute;
-
-          // Handle cases where an event begins or ends on a day other than this
-          if (stdate.compare(this.mDate) == -1) {
-              startHour = 0;
-              startMinute = 0;
-          }
-          if (enddate.compare(this.mDate) == 1) {
-              endHour = 24;
-              endMinute = 0;
-          }
-
-          // For occurrences that span multiple days, we figure out the real
-          // occurrence start and end minutes relative to the date of this
-          // column and time 0:00
-          let durend = enddate.subtractDate(this.mDate);
-          let durstart = stdate.subtractDate(this.mDate);
-          // 'durend' is always positive, instead 'durstart' might be negative
-          // if the event starts one or more days before the date of this column
-          let realStart_ = (durstart.days * 24 + durstart.hours) * 60 + durstart.minutes;
-          realStart_ = durstart.isNegative ? -1 * realStart_ : realStart_;
-          let realEnd_ = (durend.days * 24 + durend.hours) * 60 + durend.minutes;
-
-          return {
-              start: startHour * 60 + startMinute,
-              end: endHour * 60 + endMinute,
-              realStart: realStart_,
-              realEnd: realEnd_
-          };
+            let stdate = aOccurrence.startDate || aOccurrence.entryDate || aOccurrence.dueDate;
+            let enddate = aOccurrence.endDate || aOccurrence.dueDate || aOccurrence.entryDate;
+
+            if (!cal.compareObjects(stdate.timezone, this.mTimezone)) {
+                stdate = stdate.getInTimezone(this.mTimezone);
+            }
+
+            if (!cal.compareObjects(enddate.timezone, this.mTimezone)) {
+                enddate = enddate.getInTimezone(this.mTimezone);
+            }
+
+            let startHour = stdate.hour;
+            let startMinute = stdate.minute;
+            let endHour = enddate.hour;
+            let endMinute = enddate.minute;
+
+            // Handle cases where an event begins or ends on a day other than this
+            if (stdate.compare(this.mDate) == -1) {
+                startHour = 0;
+                startMinute = 0;
+            }
+            if (enddate.compare(this.mDate) == 1) {
+                endHour = 24;
+                endMinute = 0;
+            }
+
+            // For occurrences that span multiple days, we figure out the real
+            // occurrence start and end minutes relative to the date of this
+            // column and time 0:00
+            let durend = enddate.subtractDate(this.mDate);
+            let durstart = stdate.subtractDate(this.mDate);
+            // 'durend' is always positive, instead 'durstart' might be negative
+            // if the event starts one or more days before the date of this column
+            let realStart_ = (durstart.days * 24 + durstart.hours) * 60 + durstart.minutes;
+            realStart_ = durstart.isNegative ? -1 * realStart_ : realStart_;
+            let realEnd_ = (durend.days * 24 + durend.hours) * 60 + durend.minutes;
+
+            return {
+                start: startHour * 60 + startMinute,
+                end: endHour * 60 + endMinute,
+                realStart: realStart_,
+                realEnd: realEnd_
+            };
         ]]></body>
       </method>
 
       <method name="createChunk">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          let mins = this.getStartEndMinutesForOccurrence(aOccurrence);
-
-          let chunk = {
-              startMinute: mins.start,
-              endMinute: mins.end,
-              event: aOccurrence
-          };
-          return chunk;
+            let mins = this.getStartEndMinutesForOccurrence(aOccurrence);
+
+            let chunk = {
+                startMinute: mins.start,
+                endMinute: mins.end,
+                event: aOccurrence
+            };
+            return chunk;
         ]]></body>
       </method>
 
       <method name="addEvent">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          this.internalDeleteEvent(aOccurrence);
-
-          let chunk = this.createChunk(aOccurrence);
-          this.mEventInfos.push(chunk);
-          if (this.mEventMapTimeout) {
-              clearTimeout(this.mEventMapTimeout);
-          }
-
-          if (this.mCreatedNewEvent) {
-              this.mEventToEdit = aOccurrence;
-          }
-
-          this.mEventMapTimeout = setTimeout(() => this.relayout(), 5);
+            this.internalDeleteEvent(aOccurrence);
+
+            let chunk = this.createChunk(aOccurrence);
+            this.mEventInfos.push(chunk);
+            if (this.mEventMapTimeout) {
+                clearTimeout(this.mEventMapTimeout);
+            }
+
+            if (this.mCreatedNewEvent) {
+                this.mEventToEdit = aOccurrence;
+            }
+
+            this.mEventMapTimeout = setTimeout(() => this.relayout(), 5);
         ]]></body>
       </method>
 
       <method name="deleteEvent">
         <parameter name="aOccurrence"/>
         <body><![CDATA[
-          if (this.internalDeleteEvent(aOccurrence)) {
-              this.relayout();
-          }
+            if (this.internalDeleteEvent(aOccurrence)) {
+                this.relayout();
+            }
         ]]></body>
       </method>
 
       <method name="clear">
         <body><![CDATA[
-          while (this.bgbox && this.bgbox.hasChildNodes()) {
-              this.bgbox.lastChild.remove();
-          }
-          while (this.topbox && this.topbox.hasChildNodes()) {
-              this.topbox.lastChild.remove();
-          }
-          for (let handler of this.mHandlersToRemove) {
-              this.calendarView.viewBroadcaster.removeEventListener(this.calendarView.getAttribute("type") + "viewresized", handler, true);
-          }
-          this.mHandlersToRemove = [];
-          this.mSelectedChunks = [];
+            while (this.bgbox && this.bgbox.hasChildNodes()) {
+                this.bgbox.lastChild.remove();
+            }
+            while (this.topbox && this.topbox.hasChildNodes()) {
+                this.topbox.lastChild.remove();
+            }
+            for (let handler of this.mHandlersToRemove) {
+                this.calendarView.viewBroadcaster.removeEventListener(this.calendarView.getAttribute("type") + "viewresized", handler, true);
+            }
+            this.mHandlersToRemove = [];
+            this.mSelectedChunks = [];
         ]]></body>
       </method>
 
       <method name="relayout">
         <body><![CDATA[
-          if (this.mLayoutBatchCount > 0) {
-              return;
-          }
-          this.clear();
-
-          let orient = this.getAttribute("orient");
-          this.bgbox.setAttribute("orient", orient);
-
-          // bgbox is used mainly for drawing the grid.  at some point it may
-          // also be used for all-day events.
-          let otherorient = getOtherOrientation(orient);
-          let configBox = document.getAnonymousElementByAttribute(this, "anonid", "config-box");
-          configBox.removeAttribute("hidden");
-          let minSize = configBox.getOptimalMinSize();
-          configBox.setAttribute("hidden", "true");
-          this.mMinDuration = Components.classes["@mozilla.org/calendar/duration;1"]
-                                            .createInstance(Components.interfaces.calIDuration);
-          this.mMinDuration.minutes = Math.trunc(minSize / this.mPixPerMin);
-
-          let theMin = this.mStartMin;
-          while (theMin < this.mEndMin) {
-              let dur = theMin % 60;
-              theMin += dur;
-              if (dur == 0) {
-                  dur = 60;
-              }
-
-              let box = createXULElement("spacer");
-              // we key off this in a CSS selector
-              box.setAttribute("orient", orient);
-              box.setAttribute("class", "calendar-event-column-linebox");
-
-              if (this.mSelected) {
-                  box.setAttribute("selected", "true");
-              }
-              if (this.mDayOff) {
-                  box.setAttribute("weekend", "true");
-              }
-              if (theMin < this.mDayStartMin || theMin >= this.mDayEndMin) {
-                  box.setAttribute("off-time", "true");
-              }
-
-              // Carry forth the day relation
-              box.setAttribute("relation", this.getAttribute("relation"));
-
-              // calculate duration pixel as the difference between
-              // start pixel and end pixel to avoid rounding errors.
-              let startPix = Math.round(theMin * this.mPixPerMin);
-              let endPix = Math.round((theMin + dur) * this.mPixPerMin);
-              let durPix = endPix - startPix;
-              if (orient == "vertical") {
-                  box.setAttribute("height", durPix);
-              } else {
-                  box.setAttribute("width", durPix);
-              }
-
-              box.setAttribute("style", "min-width: 1px; min-height: 1px;");
-
-              this.bgbox.appendChild(box);
-              theMin += 60;
-          }
-
-          // fgbox is used for dragging events
-          this.fgboxes.box.setAttribute("orient", orient);
-          document.getAnonymousElementByAttribute(this, "anonid", "fgdragspacer").setAttribute("orient", orient);
-
-          // this one is set to otherorient, since it will contain
-          // child boxes set to "orient" (one for each set of
-          // overlapping event areas)
-          this.topbox.setAttribute("orient", otherorient);
-
-          this.mEventMap = this.computeEventMap();
-          this.mEventBoxes = [];
-
-          if (!this.mEventMap.length) {
-              return;
-          }
-
-          // First of all we create a xul:stack which
-          // will hold all events for this event column.
-          // The stack will be grouped below .../calendar-event-column/stack/topbox.
-          let stack = createXULElement("stack");
-          stack.setAttribute("flex", "1");
-          this.topbox.appendChild(stack);
-
-          let boxToEdit;
-          let columnCount = 1;
-          let spanTotal = 0;
-
-          for (let layer of this.mEventMap) {
-              // The event-map (this.mEventMap) contains an array of layers.
-              // For each layer we create a box below the stack just created above.
-              // So each different layer lives in a box that's contained in the stack.
-              let xulColumn = createXULElement("box");
-              xulColumn.setAttribute("orient", otherorient);
-              xulColumn.setAttribute("flex", "1");
-              xulColumn.setAttribute("style", "min-width: 1px; min-height: 1px;");
-              stack.appendChild(xulColumn);
-
-              let numBlocksInserted = 0;
-
-              // column count determined by layer with no special span columns
-              if (layer.every(e => !e.specialSpan)) {
-                  columnCount = layer.length;
-              }
-              spanTotal = 0;
-
-              // Each layer contains a list of the columns that
-              // need to be created for a span.
-              for (let column of layer) {
-                  let innerColumn = createXULElement("box");
-                  innerColumn.setAttribute("orient", orient);
-
-                  let colFlex = column.specialSpan ? columnCount * column.specialSpan : 1;
-                  innerColumn.setAttribute("flex", colFlex);
-                  spanTotal += colFlex;
-
-                  innerColumn.style.minWidth = "1px";
-                  innerColumn.style.minHeight = "1px";
-                  innerColumn.style.width = colFlex + "px";
-                  innerColumn.style.height = colFlex + "px";
-
-                  xulColumn.appendChild(innerColumn);
-                  let duration;
-                  for (let chunk of column) {
-                      duration = chunk.duration;
-                      if (!duration) {
-                          continue;
-                      }
-
-                      if (chunk.event) {
-                          let chunkBox = createXULElement("calendar-event-box");
-                          let durMinutes = duration.inSeconds / 60;
-                          let size = Math.max(durMinutes * this.mPixPerMin, minSize);
-                          if (orient == "vertical") {
-                              chunkBox.setAttribute("height", size);
-                          } else {
-                              chunkBox.setAttribute("width", size);
-                          }
-                          chunkBox.setAttribute("context",
-                                                this.getAttribute("item-context") ||
-                                                  this.getAttribute("context"));
-                          chunkBox.setAttribute("orient", orient);
-
-                          // Set the gripBars visibility in the chunk. Keep it
-                          // hidden for tasks with only entry date OR due date.
-                          if ((chunk.event.entryDate || !chunk.event.dueDate) &&
-                              (!chunk.event.entryDate || chunk.event.dueDate)) {
-                              let startGripVisible = (chunk.event.startDate || chunk.event.entryDate)
-                                                         .compare(chunk.startDate) == 0;
-                              let endGripVisible = (chunk.event.endDate || chunk.event.dueDate)
-                                                       .compare(chunk.endDate) <= 0;
-                              if (startGripVisible && endGripVisible) {
-                                  chunkBox.setAttribute("gripBars", "both");
-                              } else if (endGripVisible) {
-                                  chunkBox.setAttribute("gripBars", "end");
-                              } else if (startGripVisible) {
-                                  chunkBox.setAttribute("gripBars", "start");
-                              }
-                          }
-
-                          innerColumn.appendChild(chunkBox);
-                          chunkBox.calendarView = this.calendarView;
-                          chunkBox.occurrence = chunk.event;
-                          chunkBox.parentColumn = this;
-                          if (chunk.event.hashId in this.mSelectedItemIds) {
-                              chunkBox.selected = true;
-                              this.mSelectedChunks.push(chunkBox);
-                          }
-
-                          this.mEventBoxes.push(chunkBox);
-
-                          if (this.mEventToEdit &&
-                              chunkBox.occurrence.hashId == this.mEventToEdit.hashId) {
-                              boxToEdit = chunkBox;
-                          }
-                      } else {
-                          let chunkBox = createXULElement("spacer");
-                          chunkBox.setAttribute("context", this.getAttribute("context"));
-                          chunkBox.setAttribute("style", "min-width: 1px; min-height: 1px;");
-                          chunkBox.setAttribute("orient", orient);
-                          chunkBox.setAttribute("class", "calendar-empty-space-box");
-                          innerColumn.appendChild(chunkBox);
-
-                          let durMinutes = duration.inSeconds / 60;
-                          if (orient == "vertical") {
-                              chunkBox.setAttribute("height", durMinutes * this.mPixPerMin);
-                          } else {
-                              chunkBox.setAttribute("width", durMinutes * this.mPixPerMin);
-                          }
-                      }
-                  }
-
-                  numBlocksInserted++;
-              }
-
-              // add last empty column if necessary
-              if (spanTotal < columnCount) {
-                  let lastColumn = createXULElement("box");
-                  lastColumn.setAttribute("orient", orient);
-                  lastColumn.setAttribute("flex", columnCount - spanTotal);
-                  lastColumn.style.minWidth = "1px";
-                  lastColumn.style.minHeight = "1px";
-                  lastColumn.style.width = (columnCount - spanTotal) + "px";
-                  lastColumn.style.height = (columnCount - spanTotal) + "px";
-
-                  xulColumn.appendChild(lastColumn);
-              }
-
-              if (boxToEdit) {
-                  this.mCreatedNewEvent = false;
-                  this.mEventToEdit = null;
-                  boxToEdit.startEditing();
-              }
-
-              if (numBlocksInserted == 0) {
-                  // if we didn't insert any blocks, then
-                  // forget about this column
-                  xulColumn.remove();
-              }
-          }
+            if (this.mLayoutBatchCount > 0) {
+                return;
+            }
+            this.clear();
+
+            let orient = this.getAttribute("orient");
+            this.bgbox.setAttribute("orient", orient);
+
+            // bgbox is used mainly for drawing the grid.  at some point it may
+            // also be used for all-day events.
+            let otherorient = getOtherOrientation(orient);
+            let configBox = document.getAnonymousElementByAttribute(this, "anonid", "config-box");
+            configBox.removeAttribute("hidden");
+            let minSize = configBox.getOptimalMinSize();
+            configBox.setAttribute("hidden", "true");
+            this.mMinDuration = Components.classes["@mozilla.org/calendar/duration;1"]
+                                              .createInstance(Components.interfaces.calIDuration);
+            this.mMinDuration.minutes = Math.trunc(minSize / this.mPixPerMin);
+
+            let theMin = this.mStartMin;
+            while (theMin < this.mEndMin) {
+                let dur = theMin % 60;
+                theMin += dur;
+                if (dur == 0) {
+                    dur = 60;
+                }
+
+                let box = createXULElement("spacer");
+                // we key off this in a CSS selector
+                box.setAttribute("orient", orient);
+                box.setAttribute("class", "calendar-event-column-linebox");
+
+                if (this.mSelected) {
+                    box.setAttribute("selected", "true");
+                }
+                if (this.mDayOff) {
+                    box.setAttribute("weekend", "true");
+                }
+                if (theMin < this.mDayStartMin || theMin >= this.mDayEndMin) {
+                    box.setAttribute("off-time", "true");
+                }
+
+                // Carry forth the day relation
+                box.setAttribute("relation", this.getAttribute("relation"));
+
+                // calculate duration pixel as the difference between
+                // start pixel and end pixel to avoid rounding errors.
+                let startPix = Math.round(theMin * this.mPixPerMin);
+                let endPix = Math.round((theMin + dur) * this.mPixPerMin);
+                let durPix = endPix - startPix;
+                if (orient == "vertical") {
+                    box.setAttribute("height", durPix);
+                } else {
+                    box.setAttribute("width", durPix);
+                }
+
+                box.setAttribute("style", "min-width: 1px; min-height: 1px;");
+
+                this.bgbox.appendChild(box);
+                theMin += 60;
+            }
+
+            // fgbox is used for dragging events
+            this.fgboxes.box.setAttribute("orient", orient);
+            document.getAnonymousElementByAttribute(this, "anonid", "fgdragspacer").setAttribute("orient", orient);
+
+            // this one is set to otherorient, since it will contain
+            // child boxes set to "orient" (one for each set of
+            // overlapping event areas)
+            this.topbox.setAttribute("orient", otherorient);
+
+            this.mEventMap = this.computeEventMap();
+            this.mEventBoxes = [];
+
+            if (!this.mEventMap.length) {
+                return;
+            }
+
+            // First of all we create a xul:stack which
+            // will hold all events for this event column.
+            // The stack will be grouped below .../calendar-event-column/stack/topbox.
+            let stack = createXULElement("stack");
+            stack.setAttribute("flex", "1");
+            this.topbox.appendChild(stack);
+
+            let boxToEdit;
+            let columnCount = 1;
+            let spanTotal = 0;
+
+            for (let layer of this.mEventMap) {
+                // The event-map (this.mEventMap) contains an array of layers.
+                // For each layer we create a box below the stack just created above.
+                // So each different layer lives in a box that's contained in the stack.
+                let xulColumn = createXULElement("box");
+                xulColumn.setAttribute("orient", otherorient);
+                xulColumn.setAttribute("flex", "1");
+                xulColumn.setAttribute("style", "min-width: 1px; min-height: 1px;");
+                stack.appendChild(xulColumn);
+
+                let numBlocksInserted = 0;
+
+                // column count determined by layer with no special span columns
+                if (layer.every(e => !e.specialSpan)) {
+                    columnCount = layer.length;
+                }
+                spanTotal = 0;
+
+                // Each layer contains a list of the columns that
+                // need to be created for a span.
+                for (let column of layer) {
+                    let innerColumn = createXULElement("box");
+                    innerColumn.setAttribute("orient", orient);
+
+                    let colFlex = column.specialSpan ? columnCount * column.specialSpan : 1;
+                    innerColumn.setAttribute("flex", colFlex);
+                    spanTotal += colFlex;
+
+                    innerColumn.style.minWidth = "1px";
+                    innerColumn.style.minHeight = "1px";
+                    innerColumn.style.width = colFlex + "px";
+                    innerColumn.style.height = colFlex + "px";
+
+                    xulColumn.appendChild(innerColumn);
+                    let duration;
+                    for (let chunk of column) {
+                        duration = chunk.duration;
+                        if (!duration) {
+                            continue;
+                        }
+
+                        if (chunk.event) {
+                            let chunkBox = createXULElement("calendar-event-box");
+                            let durMinutes = duration.inSeconds / 60;
+                            let size = Math.max(durMinutes * this.mPixPerMin, minSize);
+                            if (orient == "vertical") {
+                                chunkBox.setAttribute("height", size);
+                            } else {
+                                chunkBox.setAttribute("width", size);
+                            }
+                            chunkBox.setAttribute("context",
+                                                  this.getAttribute("item-context") ||
+                                                    this.getAttribute("context"));
+                            chunkBox.setAttribute("orient", orient);
+
+                            // Set the gripBars visibility in the chunk. Keep it
+                            // hidden for tasks with only entry date OR due date.
+                            if ((chunk.event.entryDate || !chunk.event.dueDate) &&
+                                (!chunk.event.entryDate || chunk.event.dueDate)) {
+                                let startGripVisible = (chunk.event.startDate || chunk.event.entryDate)
+                                                           .compare(chunk.startDate) == 0;
+                                let endGripVisible = (chunk.event.endDate || chunk.event.dueDate)
+                                                         .compare(chunk.endDate) <= 0;
+                                if (startGripVisible && endGripVisible) {
+                                    chunkBox.setAttribute("gripBars", "both");
+                                } else if (endGripVisible) {
+                                    chunkBox.setAttribute("gripBars", "end");
+                                } else if (startGripVisible) {
+                                    chunkBox.setAttribute("gripBars", "start");
+                                }
+                            }
+
+                            innerColumn.appendChild(chunkBox);
+                            chunkBox.calendarView = this.calendarView;
+                            chunkBox.occurrence = chunk.event;
+                            chunkBox.parentColumn = this;
+                            if (chunk.event.hashId in this.mSelectedItemIds) {
+                                chunkBox.selected = true;
+                                this.mSelectedChunks.push(chunkBox);
+                            }
+
+                            this.mEventBoxes.push(chunkBox);
+
+                            if (this.mEventToEdit &&
+                                chunkBox.occurrence.hashId == this.mEventToEdit.hashId) {
+                                boxToEdit = chunkBox;
+                            }
+                        } else {
+                            let chunkBox = createXULElement("spacer");
+                            chunkBox.setAttribute("context", this.getAttribute("context"));
+                            chunkBox.setAttribute("style", "min-width: 1px; min-height: 1px;");
+                            chunkBox.setAttribute("orient", orient);
+                            chunkBox.setAttribute("class", "calendar-empty-space-box");
+                            innerColumn.appendChild(chunkBox);
+
+                            let durMinutes = duration.inSeconds / 60;
+                            if (orient == "vertical") {
+                                chunkBox.setAttribute("height", durMinutes * this.mPixPerMin);
+                            } else {
+                                chunkBox.setAttribute("width", durMinutes * this.mPixPerMin);
+                            }
+                        }
+                    }
+
+                    numBlocksInserted++;
+                }
+
+                // add last empty column if necessary
+                if (spanTotal < columnCount) {
+                    let lastColumn = createXULElement("box");
+                    lastColumn.setAttribute("orient", orient);
+                    lastColumn.setAttribute("flex", columnCount - spanTotal);
+                    lastColumn.style.minWidth = "1px";
+                    lastColumn.style.minHeight = "1px";
+                    lastColumn.style.width = (columnCount - spanTotal) + "px";
+                    lastColumn.style.height = (columnCount - spanTotal) + "px";
+
+                    xulColumn.appendChild(lastColumn);
+                }
+
+                if (boxToEdit) {
+                    this.mCreatedNewEvent = false;
+                    this.mEventToEdit = null;
+                    boxToEdit.startEditing();
+                }
+
+                if (numBlocksInserted == 0) {
+                    // if we didn't insert any blocks, then
+                    // forget about this column
+                    xulColumn.remove();
+                }
+            }
         ]]></body>
       </method>
 
       <method name="computeEventMap">
         <body><![CDATA[
-          /* We're going to create a series of 'blobs'.  A blob is a series of
-           * events that create a continuous block of busy time.  In other
-           * words, a blob ends when there is some time such that no events
-           * occupy that time.
-           *
-           * Each blob will be an array of objects with the following properties:
-           *    item:     the event/task
-           *    startCol: the starting column to display the event in (0-indexed)
-           *    colSpan:  the number of columns the item spans
-           *
-           * An item with no conflicts will have startCol: 0 and colSpan: 1.
-           */
-          let blobs = [];
-          let currentBlob = [];
-          function sortByStart(aEventInfo, bEventInfo) {
-              // If you pass in tasks without both entry and due dates, I will
-              // kill you
-              let startComparison = aEventInfo.layoutStart.compare(bEventInfo.layoutStart);
-              if (startComparison == 0) {
-                  // If the items start at the same time, return the longer one
-                  // first
-                  return bEventInfo.layoutEnd.compare(aEventInfo.layoutEnd);
-              } else {
-                  return startComparison;
-              }
-          }
-          this.mEventInfos.forEach((aEventInfo) => {
-              let item = aEventInfo.event.clone();
-              let start = item.startDate || item.entryDate || item.dueDate;
-              start = start.getInTimezone(this.mTimezone);
-              aEventInfo.layoutStart = start;
-              let end = item.endDate || item.dueDate || item.entryDate;
-              end = end.getInTimezone(this.mTimezone);
-              let secEnd = start.clone();
-              secEnd.addDuration(this.mMinDuration);
-              if (secEnd.nativeTime > end.nativeTime) {
-                  aEventInfo.layoutEnd = secEnd;
-              } else {
-                  aEventInfo.layoutEnd = end;
-              }
-              return aEventInfo;
-          });
-          this.mEventInfos.sort(sortByStart);
-
-          // The end time of the last ending event in the entire blob
-          let latestItemEnd;
-
-          // This array keeps track of the last (latest ending) item in each of
-          // the columns of the current blob. We could reconstruct this data at
-          // any time by looking at the items in the blob, but that would hurt
-          // perf.
-          let colEndArray = [];
-
-          /* Go through a 3 step process to try and place each item.
-           * Step 1: Look for an existing column with room for the item.
-           * Step 2: Look for a previously placed item that can be shrunk in
-           *         width to make room for the item.
-           * Step 3: Give up and create a new column for the item.
-           *
-           * (The steps are explained in more detail as we come to them)
-           */
-          for (let i in this.mEventInfos) {
-              let curItemInfo = {
-                  event: this.mEventInfos[i].event,
-                  layoutStart: this.mEventInfos[i].layoutStart,
-                  layoutEnd: this.mEventInfos[i].layoutEnd
-              };
-              if (!latestItemEnd) {
-                  latestItemEnd = curItemInfo.layoutEnd;
-              }
-              if (currentBlob.length && latestItemEnd &&
-                  curItemInfo.layoutStart.compare(latestItemEnd) != -1) {
-                  // We're done with this current blob because item starts
-                  // after the last event in the current blob ended.
-                  blobs.push({ blob: currentBlob, totalCols: colEndArray.length });
-
-                  // Reset our variables
-                  currentBlob = [];
-                  colEndArray = [];
-              }
-
-              // Place the item in its correct place in the blob
-              let placedItem = false;
-
-              // Step 1
-              // Look for a possible column in the blob that has been left open. This
-              // would happen if we already have multiple columns but some of
-              // the cols have events before latestItemEnd.  For instance
-              //       |      |      |
-              //       |______|      |
-              //       |ev1   |______|
-              //       |      |ev2   |
-              //       |______|      |
-              //       |      |      |
-              //       |OPEN! |      |<--Our item's start time might be here
-              //       |      |______|
-              //       |      |      |
-              //
-              // Remember that any time we're starting a new blob, colEndArray
-              // will be empty, but that's ok.
-              for (let j = 0; j < colEndArray.length; ++j) {
-                  let colEnd = colEndArray[j].layoutEnd;
-                  if (colEnd.compare(curItemInfo.layoutStart) != 1) {
-                      // Yay, we can jump into this column
-                      colEndArray[j] = curItemInfo;
-
-                      // Check and see if there are any adjacent columns we can
-                      // jump into as well.
-                      let lastCol = Number(j) + 1;
-                      while (lastCol < colEndArray.length) {
-                          let nextColEnd = colEndArray[lastCol].layoutEnd;
-                          // If the next column's item ends after we start, we
-                          // can't expand any further
-                          if (nextColEnd.compare(curItemInfo.layoutStart) == 1) {
-                              break;
-                          }
-                          colEndArray[lastCol] = curItemInfo;
-                          lastCol++;
-                      }
-                      // Now construct the info we need to push into the blob
-                      currentBlob.push({
-                          itemInfo: curItemInfo,
-                          startCol: j,
-                          colSpan: lastCol - j
-                      });
-
-                      // Update latestItemEnd
-                      if (latestItemEnd &&
-                          curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
-                          latestItemEnd = curItemInfo.layoutEnd;
-                      }
-                      placedItem = true;
-                      break; // Stop iterating through colEndArray
-                  }
-              }
-
-              if (placedItem) {
-                  // Go get the next item
-                  continue;
-              }
-
-              // Step 2
-              // OK, all columns (if there are any) overlap us.  Look if the
-              // last item in any of the last items in those columns is taking
-              // up 2 or more cols. If so, shrink it and stick the item in the
-              // created space. For instance
-              //       |______|______|______|
-              //       |ev1   |ev3   |ev4   |
-              //       |      |      |      |
-              //       |      |______|      |
-              //       |      |      |______|
-              //       |      |_____________|
-              //       |      |ev2          |
-              //       |______|             |<--If our item's start time is
-              //       |      |_____________|   here, we can shrink ev2 and jump
-              //       |      |      |      |   in column #3
-              //
-              for (let j = 1; j < colEndArray.length; ++j) {
-                  if (colEndArray[j].event.hashId == colEndArray[j - 1].event.hashId) {
-                      // Good we found a item that spanned multiple columns.
-                      // Find it in the blob so we can modify its properties
-                      for (let blobKey in currentBlob) {
-                          if (currentBlob[blobKey].itemInfo.event.hashId == colEndArray[j].event.hashId) {
-                              // Take all but the first spot that the item spanned
-                              let spanOfShrunkItem = currentBlob[blobKey].colSpan;
-                              currentBlob.push({
-                                  itemInfo: curItemInfo,
-                                  startCol: Number(currentBlob[blobKey].startCol) + 1,
-                                  colSpan: spanOfShrunkItem - 1
-                              });
-
-                              // Update colEndArray
-                              for (let k = j; k < j + spanOfShrunkItem - 1; k++) {
-                                  colEndArray[k] = curItemInfo;
-                              }
-
-                              // Modify the data on the old item
-                              currentBlob[blobKey] = {
-                                  itemInfo: currentBlob[blobKey].itemInfo,
-                                  startCol: currentBlob[blobKey].startCol,
-                                  colSpan: 1
-                              };
-                              // Update latestItemEnd
-                              if (latestItemEnd &&
-                                  curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
-                                  latestItemEnd = curItemInfo.layoutEnd;
-                              }
-                              break; // Stop iterating through currentBlob
-                          }
-                      }
-                      placedItem = true;
-                      break; // Stop iterating through colEndArray
-                  }
-              }
-
-              if (placedItem) {
-                  // Go get the next item
-                  continue;
-              }
-
-              // Step 3
-              // Guess what? We still haven't placed the item.  We need to
-              // create a new column for it.
-
-              // All the items in the last column, except for the one* that
-              // conflicts with the item we're trying to place, need to have
-              // their span extended by 1, since we're adding the new column
-              //
-              // * Note that there can only be one, because we sorted our
-              //   events by start time, so this event must start later than
-              //   the start of any possible conflicts.
-              let lastColNum = colEndArray.length;
-              for (let blobKey in currentBlob) {
-                  let blobKeyEnd = currentBlob[blobKey].itemInfo.layoutEnd;
-                  if (currentBlob[blobKey].startCol + currentBlob[blobKey].colSpan == lastColNum &&
-                      blobKeyEnd.compare(curItemInfo.layoutStart) != 1) {
-                      currentBlob[blobKey] = {
-                          itemInfo: currentBlob[blobKey].itemInfo,
-                          startCol: currentBlob[blobKey].startCol,
-                          colSpan: currentBlob[blobKey].colSpan + 1
-                      };
-                  }
-              }
-              currentBlob.push({
-                  itemInfo: curItemInfo,
-                  startCol: colEndArray.length,
-                  colSpan: 1
-              });
-              colEndArray.push(curItemInfo);
-
-              // Update latestItemEnd
-              if (latestItemEnd && curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
-                  latestItemEnd = curItemInfo.layoutEnd;
-              }
-              // Go get the next item
-          }
-          // Add the last blob
-          blobs.push({
-              blob: currentBlob,
-              totalCols: colEndArray.length
-          });
-          return this.setupBoxStructure(blobs);
+            /* We're going to create a series of 'blobs'.  A blob is a series of
+             * events that create a continuous block of busy time.  In other
+             * words, a blob ends when there is some time such that no events
+             * occupy that time.
+             *
+             * Each blob will be an array of objects with the following properties:
+             *    item:     the event/task
+             *    startCol: the starting column to display the event in (0-indexed)
+             *    colSpan:  the number of columns the item spans
+             *
+             * An item with no conflicts will have startCol: 0 and colSpan: 1.
+             */
+            let blobs = [];
+            let currentBlob = [];
+            function sortByStart(aEventInfo, bEventInfo) {
+                // If you pass in tasks without both entry and due dates, I will
+                // kill you
+                let startComparison = aEventInfo.layoutStart.compare(bEventInfo.layoutStart);
+                if (startComparison == 0) {
+                    // If the items start at the same time, return the longer one
+                    // first
+                    return bEventInfo.layoutEnd.compare(aEventInfo.layoutEnd);
+                } else {
+                    return startComparison;
+                }
+            }
+            this.mEventInfos.forEach((aEventInfo) => {
+                let item = aEventInfo.event.clone();
+                let start = item.startDate || item.entryDate || item.dueDate;
+                start = start.getInTimezone(this.mTimezone);
+                aEventInfo.layoutStart = start;
+                let end = item.endDate || item.dueDate || item.entryDate;
+                end = end.getInTimezone(this.mTimezone);
+                let secEnd = start.clone();
+                secEnd.addDuration(this.mMinDuration);
+                if (secEnd.nativeTime > end.nativeTime) {
+                    aEventInfo.layoutEnd = secEnd;
+                } else {
+                    aEventInfo.layoutEnd = end;
+                }
+                return aEventInfo;
+            });
+            this.mEventInfos.sort(sortByStart);
+
+            // The end time of the last ending event in the entire blob
+            let latestItemEnd;
+
+            // This array keeps track of the last (latest ending) item in each of
+            // the columns of the current blob. We could reconstruct this data at
+            // any time by looking at the items in the blob, but that would hurt
+            // perf.
+            let colEndArray = [];
+
+            /* Go through a 3 step process to try and place each item.
+             * Step 1: Look for an existing column with room for the item.
+             * Step 2: Look for a previously placed item that can be shrunk in
+             *         width to make room for the item.
+             * Step 3: Give up and create a new column for the item.
+             *
+             * (The steps are explained in more detail as we come to them)
+             */
+            for (let i in this.mEventInfos) {
+                let curItemInfo = {
+                    event: this.mEventInfos[i].event,
+                    layoutStart: this.mEventInfos[i].layoutStart,
+                    layoutEnd: this.mEventInfos[i].layoutEnd
+                };
+                if (!latestItemEnd) {
+                    latestItemEnd = curItemInfo.layoutEnd;
+                }
+                if (currentBlob.length && latestItemEnd &&
+                    curItemInfo.layoutStart.compare(latestItemEnd) != -1) {
+                    // We're done with this current blob because item starts
+                    // after the last event in the current blob ended.
+                    blobs.push({ blob: currentBlob, totalCols: colEndArray.length });
+
+                    // Reset our variables
+                    currentBlob = [];
+                    colEndArray = [];
+                }
+
+                // Place the item in its correct place in the blob
+                let placedItem = false;
+
+                // Step 1
+                // Look for a possible column in the blob that has been left open. This
+                // would happen if we already have multiple columns but some of
+                // the cols have events before latestItemEnd.  For instance
+                //       |      |      |
+                //       |______|      |
+                //       |ev1   |______|
+                //       |      |ev2   |
+                //       |______|      |
+                //       |      |      |
+                //       |OPEN! |      |<--Our item's start time might be here
+                //       |      |______|
+                //       |      |      |
+                //
+                // Remember that any time we're starting a new blob, colEndArray
+                // will be empty, but that's ok.
+                for (let j = 0; j < colEndArray.length; ++j) {
+                    let colEnd = colEndArray[j].layoutEnd;
+                    if (colEnd.compare(curItemInfo.layoutStart) != 1) {
+                        // Yay, we can jump into this column
+                        colEndArray[j] = curItemInfo;
+
+                        // Check and see if there are any adjacent columns we can
+                        // jump into as well.
+                        let lastCol = Number(j) + 1;
+                        while (lastCol < colEndArray.length) {
+                            let nextColEnd = colEndArray[lastCol].layoutEnd;
+                            // If the next column's item ends after we start, we
+                            // can't expand any further
+                            if (nextColEnd.compare(curItemInfo.layoutStart) == 1) {
+                                break;
+                            }
+                            colEndArray[lastCol] = curItemInfo;
+                            lastCol++;
+                        }
+                        // Now construct the info we need to push into the blob
+                        currentBlob.push({
+                            itemInfo: curItemInfo,
+                            startCol: j,
+                            colSpan: lastCol - j
+                        });
+
+                        // Update latestItemEnd
+                        if (latestItemEnd &&
+                            curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
+                            latestItemEnd = curItemInfo.layoutEnd;
+                        }
+                        placedItem = true;
+                        break; // Stop iterating through colEndArray
+                    }
+                }
+
+                if (placedItem) {
+                    // Go get the next item
+                    continue;
+                }
+
+                // Step 2
+                // OK, all columns (if there are any) overlap us.  Look if the
+                // last item in any of the last items in those columns is taking
+                // up 2 or more cols. If so, shrink it and stick the item in the
+                // created space. For instance
+                //       |______|______|______|
+                //       |ev1   |ev3   |ev4   |
+                //       |      |      |      |
+                //       |      |______|      |
+                //       |      |      |______|
+                //       |      |_____________|
+                //       |      |ev2          |
+                //       |______|             |<--If our item's start time is
+                //       |      |_____________|   here, we can shrink ev2 and jump
+                //       |      |      |      |   in column #3
+                //
+                for (let j = 1; j < colEndArray.length; ++j) {
+                    if (colEndArray[j].event.hashId == colEndArray[j - 1].event.hashId) {
+                        // Good we found a item that spanned multiple columns.
+                        // Find it in the blob so we can modify its properties
+                        for (let blobKey in currentBlob) {
+                            if (currentBlob[blobKey].itemInfo.event.hashId == colEndArray[j].event.hashId) {
+                                // Take all but the first spot that the item spanned
+                                let spanOfShrunkItem = currentBlob[blobKey].colSpan;
+                                currentBlob.push({
+                                    itemInfo: curItemInfo,
+                                    startCol: Number(currentBlob[blobKey].startCol) + 1,
+                                    colSpan: spanOfShrunkItem - 1
+                                });
+
+                                // Update colEndArray
+                                for (let k = j; k < j + spanOfShrunkItem - 1; k++) {
+                                    colEndArray[k] = curItemInfo;
+                                }
+
+                                // Modify the data on the old item
+                                currentBlob[blobKey] = {
+                                    itemInfo: currentBlob[blobKey].itemInfo,
+                                    startCol: currentBlob[blobKey].startCol,
+                                    colSpan: 1
+                                };
+                                // Update latestItemEnd
+                                if (latestItemEnd &&
+                                    curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
+                                    latestItemEnd = curItemInfo.layoutEnd;
+                                }
+                                break; // Stop iterating through currentBlob
+                            }
+                        }
+                        placedItem = true;
+                        break; // Stop iterating through colEndArray
+                    }
+                }
+
+                if (placedItem) {
+                    // Go get the next item
+                    continue;
+                }
+
+                // Step 3
+                // Guess what? We still haven't placed the item.  We need to
+                // create a new column for it.
+
+                // All the items in the last column, except for the one* that
+                // conflicts with the item we're trying to place, need to have
+                // their span extended by 1, since we're adding the new column
+                //
+                // * Note that there can only be one, because we sorted our
+                //   events by start time, so this event must start later than
+                //   the start of any possible conflicts.
+                let lastColNum = colEndArray.length;
+                for (let blobKey in currentBlob) {
+                    let blobKeyEnd = currentBlob[blobKey].itemInfo.layoutEnd;
+                    if (currentBlob[blobKey].startCol + currentBlob[blobKey].colSpan == lastColNum &&
+                        blobKeyEnd.compare(curItemInfo.layoutStart) != 1) {
+                        currentBlob[blobKey] = {
+                            itemInfo: currentBlob[blobKey].itemInfo,
+                            startCol: currentBlob[blobKey].startCol,
+                            colSpan: currentBlob[blobKey].colSpan + 1
+                        };
+                    }
+                }
+                currentBlob.push({
+                    itemInfo: curItemInfo,
+                    startCol: colEndArray.length,
+                    colSpan: 1
+                });
+                colEndArray.push(curItemInfo);
+
+                // Update latestItemEnd
+                if (latestItemEnd && curItemInfo.layoutEnd.compare(latestItemEnd) == 1) {
+                    latestItemEnd = curItemInfo.layoutEnd;
+                }
+                // Go get the next item
+            }
+            // Add the last blob
+            blobs.push({
+                blob: currentBlob,
+                totalCols: colEndArray.length
+            });
+            return this.setupBoxStructure(blobs);
         ]]></body>
       </method>
 
       <method name="setupBoxStructure">
         <parameter name="aBlobs"/>
         <body><![CDATA[
-          // This is actually going to end up being a 3-d array
-          // 1st dimension: "layers", sets of columns of events that all
-          //                should have equal width*
-          // 2nd dimension: "columns", individual columns of non-conflicting
-          //                items
-          // 3rd dimension: "chunks", individual items or placeholders for
-          //                the blank time in between them
-          //
-          // * Note that 'equal width' isn't strictly correct.  If we're
-          //   oriented differently, it will be height (and we'll have rows
-          //   not columns).  What's more, in the 'specialSpan' case, the
-          //   columns won't actually have the same size, but will only all
-          //   be multiples of a common size.  See the note in the relayout
-          //   function for more info on this (fairly rare) case.
-          let layers = [];
-
-          // When we start a new blob, move to a new set of layers
-          let layerOffset = 0;
-          for (let glob of aBlobs) {
-              let layerArray = [];
-              let layerCounter = 1;
-
-              for (let data of glob.blob) {
-                  // from the item at hand we need to figure out on which
-                  // layer and on which column it should go.
-                  let layerIndex;
-                  let specialSpan = null;
-
-                  // each blob receives its own layer, that's the first part of the story. within
-                  // a given blob we need to distribute the items on different layers depending on
-                  // the number of columns each item spans. if each item just spans a single column
-                  // the blob will cover *one* layer. if the blob contains items that span more than
-                  // a single column, this blob will cover more than one layer. the algorithm places
-                  // the items on the first layer in the case an item covers a single column. new layers
-                  // are introduced based on the start column and number of spanning columns of an item.
-                  if (data.colSpan == 1) {
-                      layerIndex = 0;
-                  } else {
-                      let index = glob.totalCols * data.colSpan + data.startCol;
-                      layerIndex = layerArray[index];
-                      if (!layerIndex) {
-                          layerIndex = layerCounter++;
-                          layerArray[index] = layerIndex;
-                      }
-                      let offset = (glob.totalCols - data.colSpan) % glob.totalCols;
-                      if (offset != 0) {
-                          specialSpan = data.colSpan / glob.totalCols;
-                      }
-                  }
-                  layerIndex += layerOffset;
-
-                  // Make sure there's room to insert stuff
-                  while (layerIndex >= layers.length) {
-                      layers.push([]);
-                  }
-
-                  while (data.startCol >= layers[layerIndex].length) {
-                      layers[layerIndex].push([]);
-                      if (specialSpan) {
-                          layers[layerIndex][layers[layerIndex].length - 1].specialSpan = 1 / glob.totalCols;
-                      }
-                  }
-
-                  // we now retrieve the column from 'layerIndex' and 'startCol'.
-                  let col = layers[layerIndex][data.startCol];
-                  if (specialSpan) {
-                      col.specialSpan = specialSpan;
-                  }
-
-                  // take into account that items can span several days.
-                  // that's why i'm clipping the start- and end-time to the
-                  // timespan of this column.
-                  let start = data.itemInfo.layoutStart;
-                  let end = data.itemInfo.layoutEnd;
-                  if (start.year != this.date.year ||
-                      start.month != this.date.month ||
-                      start.day != this.date.day) {
-                      start = start.clone();
-                      start.resetTo(this.date.year,
+            // This is actually going to end up being a 3-d array
+            // 1st dimension: "layers", sets of columns of events that all
+            //                should have equal width*
+            // 2nd dimension: "columns", individual columns of non-conflicting
+            //                items
+            // 3rd dimension: "chunks", individual items or placeholders for
+            //                the blank time in between them
+            //
+            // * Note that 'equal width' isn't strictly correct.  If we're
+            //   oriented differently, it will be height (and we'll have rows
+            //   not columns).  What's more, in the 'specialSpan' case, the
+            //   columns won't actually have the same size, but will only all
+            //   be multiples of a common size.  See the note in the relayout
+            //   function for more info on this (fairly rare) case.
+            let layers = [];
+
+            // When we start a new blob, move to a new set of layers
+            let layerOffset = 0;
+            for (let glob of aBlobs) {
+                let layerArray = [];
+                let layerCounter = 1;
+
+                for (let data of glob.blob) {
+                    // from the item at hand we need to figure out on which
+                    // layer and on which column it should go.
+                    let layerIndex;
+                    let specialSpan = null;
+
+                    // each blob receives its own layer, that's the first part of the story. within
+                    // a given blob we need to distribute the items on different layers depending on
+                    // the number of columns each item spans. if each item just spans a single column
+                    // the blob will cover *one* layer. if the blob contains items that span more than
+                    // a single column, this blob will cover more than one layer. the algorithm places
+                    // the items on the first layer in the case an item covers a single column. new layers
+                    // are introduced based on the start column and number of spanning columns of an item.
+                    if (data.colSpan == 1) {
+                        layerIndex = 0;
+                    } else {
+                        let index = glob.totalCols * data.colSpan + data.startCol;
+                        layerIndex = layerArray[index];
+                        if (!layerIndex) {
+                            layerIndex = layerCounter++;
+                            layerArray[index] = layerIndex;
+                        }
+                        let offset = (glob.totalCols - data.colSpan) % glob.totalCols;
+                        if (offset != 0) {
+                            specialSpan = data.colSpan / glob.totalCols;
+                        }
+                    }
+                    layerIndex += layerOffset;
+
+                    // Make sure there's room to insert stuff
+                    while (layerIndex >= layers.length) {
+                        layers.push([]);
+                    }
+
+                    while (data.startCol >= layers[layerIndex].length) {
+                        layers[layerIndex].push([]);
+                        if (specialSpan) {
+                            layers[layerIndex][layers[layerIndex].length - 1].specialSpan = 1 / glob.totalCols;
+                        }
+                    }
+
+                    // we now retrieve the column from 'layerIndex' and 'startCol'.
+                    let col = layers[layerIndex][data.startCol];
+                    if (specialSpan) {
+                        col.specialSpan = specialSpan;
+                    }
+
+                    // take into account that items can span several days.
+                    // that's why i'm clipping the start- and end-time to the
+                    // timespan of this column.
+                    let start = data.itemInfo.layoutStart;
+                    let end = data.itemInfo.layoutEnd;
+                    if (start.year != this.date.year ||
+                        start.month != this.date.month ||
+                        start.day != this.date.day) {
+                        start = start.clone();
+                        start.resetTo(this.date.year,
+                                      this.date.month,
+                                      this.date.day,
+                                      0, this.mStartMin, 0,
+                                      start.timezone);
+                    }
+                    if (end.year != this.date.year ||
+                        end.month != this.date.month ||
+                        end.day != this.date.day) {
+                        end = end.clone();
+                        end.resetTo(this.date.year,
                                     this.date.month,
                                     this.date.day,
-                                    0, this.mStartMin, 0,
-                                    start.timezone);
-                  }
-                  if (end.year != this.date.year ||
-                      end.month != this.date.month ||
-                      end.day != this.date.day) {
-                      end = end.clone();
-                      end.resetTo(this.date.year,
-                                  this.date.month,
-                                  this.date.day,
-                                  0, this.mEndMin, 0,
-                                  end.timezone);
-                  }
-                  let prevEnd;
-                  if (col.length > 0) {
-                      // Fill in time gaps with a placeholder
-                      prevEnd = col[col.length - 1].endDate.clone();
-                  } else {
-                      // First event in the column, add a placeholder for the
-                      // blank time from this.mStartMin to the event's start
-                      prevEnd = start.clone();
-                      prevEnd.hour = 0;
-                      prevEnd.minute = this.mStartMin;
-                  }
-                  prevEnd.timezone = cal.floating();
-                  // the reason why we need to calculate time durations
-                  // based on floating timezones is that we need avoid
-                  // dst gaps in this case. converting the date/times to
-                  // floating conveys this idea in a natural way. note that
-                  // we explicitly don't use getInTimezone() as it would
-                  // be slightly more expensive in terms of performance.
-                  let floatstart = start.clone();
-                  floatstart.timezone = cal.floating();
-                  let dur = floatstart.subtractDate(prevEnd);
-                  if (dur.inSeconds) {
-                      col.push({ duration: dur });
-                  }
-                  let floatend = end.clone();
-                  floatend.timezone = cal.floating();
-                  col.push({
-                      event: data.itemInfo.event,
-                      endDate: end,
-                      startDate: start,
-                      duration: floatend.subtractDate(floatstart)
-                  });
-              }
-              layerOffset = layers.length;
-          }
-          return layers;
+                                    0, this.mEndMin, 0,
+                                    end.timezone);
+                    }
+                    let prevEnd;
+                    if (col.length > 0) {
+                        // Fill in time gaps with a placeholder
+                        prevEnd = col[col.length - 1].endDate.clone();
+                    } else {
+                        // First event in the column, add a placeholder for the
+                        // blank time from this.mStartMin to the event's start
+                        prevEnd = start.clone();
+                        prevEnd.hour = 0;
+                        prevEnd.minute = this.mStartMin;
+                    }
+                    prevEnd.timezone = cal.floating();
+                    // the reason why we need to calculate time durations
+                    // based on floating timezones is that we need avoid
+                    // dst gaps in this case. converting the date/times to
+                    // floating conveys this idea in a natural way. note that
+                    // we explicitly don't use getInTimezone() as it would
+                    // be slightly more expensive in terms of performance.
+                    let floatstart = start.clone();
+                    floatstart.timezone = cal.floating();
+                    let dur = floatstart.subtractDate(prevEnd);
+                    if (dur.inSeconds) {
+                        col.push({ duration: dur });
+                    }
+                    let floatend = end.clone();
+                    floatend.timezone = cal.floating();
+                    col.push({
+                        event: data.itemInfo.event,
+                        endDate: end,
+                        startDate: start,
+                        duration: floatend.subtractDate(floatstart)
+                    });
+                }
+                layerOffset = layers.length;
+            }
+            return layers;
         ]]></body>
       </method>
 
       <method name="getShadowElements">
         <parameter name="aStart"/>
         <parameter name="aEnd"/>
         <body><![CDATA[
-          // aStart and aEnd are start and end minutes of the occurrence
-          // from time 0:00 of the dragging column
-          let shadows = 1;
-          let offset = 0;
-          let startMin;
-          if (aStart < 0) {
-              shadows += Math.ceil(Math.abs(aStart) / this.mEndMin);
-              offset = shadows - 1;
-              let reminder = Math.abs(aStart) % this.mEndMin;
-              startMin = this.mEndMin - (reminder ? reminder : this.mEndMin);
-          } else {
-              startMin = aStart;
-          }
-          shadows += Math.floor(aEnd / this.mEndMin);
-
-          // return values needed to build the shadows while dragging
-          return {
-              shadows: shadows,             // number of shadows
-              offset: offset,               // Offset first<->selected shadows
-              startMin: startMin,           // First shadow start minute
-              endMin: aEnd % this.mEndMin   // Last shadow end minute
-          };
+            // aStart and aEnd are start and end minutes of the occurrence
+            // from time 0:00 of the dragging column
+            let shadows = 1;
+            let offset = 0;
+            let startMin;
+            if (aStart < 0) {
+                shadows += Math.ceil(Math.abs(aStart) / this.mEndMin);
+                offset = shadows - 1;
+                let reminder = Math.abs(aStart) % this.mEndMin;
+                startMin = this.mEndMin - (reminder ? reminder : this.mEndMin);
+            } else {
+                startMin = aStart;
+            }
+            shadows += Math.floor(aEnd / this.mEndMin);
+
+            // return values needed to build the shadows while dragging
+            return {
+                shadows: shadows,             // number of shadows
+                offset: offset,               // Offset first<->selected shadows
+                startMin: startMin,           // First shadow start minute
+                endMin: aEnd % this.mEndMin   // Last shadow end minute
+            };
         ]]></body>
       </method>
 
       <method name="firstLastShadowColumns">
         <parameter name="aOffset"/>
         <parameter name="aShadows"/>
         <body><![CDATA[
-          let firstCol = this; // eslint-disable-line consistent-this
-          let lastCol = this; // eslint-disable-line consistent-this
-          let firstIndex = aOffset == null ? this.mDragState.offset : aOffset;
-          let lastIndex = firstIndex;
-          while (firstCol.previousSibling && firstIndex > 0) {
-              firstCol = firstCol.previousSibling;
-              firstIndex--;
-          }
-          let lastShadow = aShadows == null ? this.mDragState.shadows : aShadows;
-          while (lastCol.nextSibling && lastIndex < lastShadow - 1) {
-              lastCol = lastCol.nextSibling;
-              lastIndex++;
-          }
-
-          // returns first and last column with shadows that are visible in the
-          // week and the positions of these (visible) columns in the set of
-          // columns shadows of the occurrence
-          return {
-              firstCol: firstCol,
-              firstIndex: firstIndex,
-              lastCol: lastCol,
-              lastIndex: lastIndex
-          };
+            let firstCol = this; // eslint-disable-line consistent-this
+            let lastCol = this; // eslint-disable-line consistent-this
+            let firstIndex = aOffset == null ? this.mDragState.offset : aOffset;
+            let lastIndex = firstIndex;
+            while (firstCol.previousSibling && firstIndex > 0) {
+                firstCol = firstCol.previousSibling;
+                firstIndex--;
+            }
+            let lastShadow = aShadows == null ? this.mDragState.shadows : aShadows;
+            while (lastCol.nextSibling && lastIndex < lastShadow - 1) {
+                lastCol = lastCol.nextSibling;
+                lastIndex++;
+            }
+
+            // returns first and last column with shadows that are visible in the
+            // week and the positions of these (visible) columns in the set of
+            // columns shadows of the occurrence
+            return {
+                firstCol: firstCol,
+                firstIndex: firstIndex,
+                lastCol: lastCol,
+                lastIndex: lastIndex
+            };
         ]]></body>
       </method>
 
       <method name="updateShadowsBoxes">
         <parameter name="aStart"/>
         <parameter name="aEnd"/>
         <parameter name="aCurrentOffset"/>
         <parameter name="aCurrentShadows"/>
         <parameter name="aSizeattr"/>
         <body><![CDATA[
-          let lateralColumns = this.firstLastShadowColumns(aCurrentOffset, aCurrentShadows);
-          let firstCol = lateralColumns.firstCol;
-          let firstIndex = lateralColumns.firstIndex;
-          let lastCol = lateralColumns.lastCol;
-          let lastIndex = lateralColumns.lastIndex;
-
-          // remove the first/last shadow when start/end time goes in the
-          // next/previous day. This happens when current offset is different
-          // from offset stored in mDragState
-          if (aCurrentOffset != null) {
-              if (this.mDragState.offset > aCurrentOffset && firstCol.previousSibling) {
-                  firstCol.previousSibling.fgboxes.dragbox.removeAttribute("dragging");
-                  firstCol.previousSibling.fgboxes.box.removeAttribute("dragging");
-              }
-              let currentOffsetEndSide = aCurrentShadows - 1 - aCurrentOffset;
-              if ((this.mDragState.shadows - 1 - this.mDragState.offset) > currentOffsetEndSide &&
-                   lastCol.nextSibling) {
-                  lastCol.nextSibling.fgboxes.dragbox.removeAttribute("dragging");
-                  lastCol.nextSibling.fgboxes.box.removeAttribute("dragging");
-              }
-          }
-
-          // set shadow boxes size for every part of the occurrence
-          let firstShadowSize = (aCurrentShadows == 1 ? aEnd : this.mEndMin) - aStart;
-          let column = firstCol;
-          for (let i = firstIndex; column && i <= lastIndex; i++) {
-              column.fgboxes.box.setAttribute("dragging", "true");
-              column.fgboxes.dragbox.setAttribute("dragging", "true");
-              if (i == 0) {
-                  // first shadow
-                  column.fgboxes.dragspacer.setAttribute(aSizeattr, aStart * column.mPixPerMin);
-                  column.fgboxes.dragbox.setAttribute(aSizeattr, firstShadowSize * column.mPixPerMin);
-              } else if (i == (aCurrentShadows - 1)) {
-                  // last shadow
-                  column.fgboxes.dragspacer.setAttribute(aSizeattr, 0);
-                  column.fgboxes.dragbox.setAttribute(aSizeattr, aEnd * column.mPixPerMin);
-              } else {
-                  // an intermediate shadow (full day)
-                  column.fgboxes.dragspacer.setAttribute(aSizeattr, 0);
-                  column.fgboxes.dragbox.setAttribute(aSizeattr, this.mEndMin * column.mPixPerMin);
-              }
-              column = column.nextSibling;
-          }
+            let lateralColumns = this.firstLastShadowColumns(aCurrentOffset, aCurrentShadows);
+            let firstCol = lateralColumns.firstCol;
+            let firstIndex = lateralColumns.firstIndex;
+            let lastCol = lateralColumns.lastCol;
+            let lastIndex = lateralColumns.lastIndex;
+
+            // remove the first/last shadow when start/end time goes in the
+            // next/previous day. This happens when current offset is different
+            // from offset stored in mDragState
+            if (aCurrentOffset != null) {
+                if (this.mDragState.offset > aCurrentOffset && firstCol.previousSibling) {
+                    firstCol.previousSibling.fgboxes.dragbox.removeAttribute("dragging");
+                    firstCol.previousSibling.fgboxes.box.removeAttribute("dragging");
+                }
+                let currentOffsetEndSide = aCurrentShadows - 1 - aCurrentOffset;
+                if ((this.mDragState.shadows - 1 - this.mDragState.offset) > currentOffsetEndSide &&
+                     lastCol.nextSibling) {
+                    lastCol.nextSibling.fgboxes.dragbox.removeAttribute("dragging");
+                    lastCol.nextSibling.fgboxes.box.removeAttribute("dragging");
+                }
+            }
+
+            // set shadow boxes size for every part of the occurrence
+            let firstShadowSize = (aCurrentShadows == 1 ? aEnd : this.mEndMin) - aStart;
+            let column = firstCol;
+            for (let i = firstIndex; column && i <= lastIndex; i++) {
+                column.fgboxes.box.setAttribute("dragging", "true");
+                column.fgboxes.dragbox.setAttribute("dragging", "true");
+                if (i == 0) {
+                    // first shadow
+                    column.fgboxes.dragspacer.setAttribute(aSizeattr, aStart * column.mPixPerMin);
+                    column.fgboxes.dragbox.setAttribute(aSizeattr, firstShadowSize * column.mPixPerMin);
+                } else if (i == (aCurrentShadows - 1)) {
+                    // last shadow
+                    column.fgboxes.dragspacer.setAttribute(aSizeattr, 0);
+                    column.fgboxes.dragbox.setAttribute(aSizeattr, aEnd * column.mPixPerMin);
+                } else {
+                    // an intermediate shadow (full day)
+                    column.fgboxes.dragspacer.setAttribute(aSizeattr, 0);
+                    column.fgboxes.dragbox.setAttribute(aSizeattr, this.mEndMin * column.mPixPerMin);
+                }
+                column = column.nextSibling;
+            }
         ]]></body>
       </method>
 
       <method name="onEventSweepKeypress">
         <parameter name="event"/>
         <body><![CDATA[
-          let col = document.calendarEventColumnDragging;
-          if (col && event.keyCode == event.DOM_VK_ESCAPE) {
-              window.removeEventListener("mousemove", col.onEventSweepMouseMove);
-              window.removeEventListener("mouseup", col.onEventSweepMouseUp);
-              window.removeEventListener("keypress", col.onEventSweepKeypress);
-
-              let lateralColumns = col.firstLastShadowColumns();
-              let column = lateralColumns.firstCol;
-              let index = lateralColumns.firstIndex;
-              while (column && index < col.mDragState.shadows) {
-                  column.fgboxes.dragbox.removeAttribute("dragging");
-                  column.fgboxes.box.removeAttribute("dragging");
-                  column = column.nextSibling;
-                  index++;
-              }
-
-              col.mDragState = null;
-              document.calendarEventColumnDragging = null;
-          }
+            let col = document.calendarEventColumnDragging;
+            if (col && event.keyCode == event.DOM_VK_ESCAPE) {
+                window.removeEventListener("mousemove", col.onEventSweepMouseMove);
+                window.removeEventListener("mouseup", col.onEventSweepMouseUp);
+                window.removeEventListener("keypress", col.onEventSweepKeypress);
+
+                let lateralColumns = col.firstLastShadowColumns();
+                let column = lateralColumns.firstCol;
+                let index = lateralColumns.firstIndex;
+                while (column && index < col.mDragState.shadows) {
+                    column.fgboxes.dragbox.removeAttribute("dragging");
+                    column.fgboxes.box.removeAttribute("dragging");
+                    column = column.nextSibling;
+                    index++;
+                }
+
+                col.mDragState = null;
+                document.calendarEventColumnDragging = null;
+            }
         ]]></body>
       </method>
 
       <method name="clearMagicScroll">
         <body><![CDATA[
-          if (this.mMagicScrollTimer) {
-              clearTimeout(this.mMagicScrollTimer);
-              this.mMagicScrollTimer = null;
-          }
+            if (this.mMagicScrollTimer) {
+                clearTimeout(this.mMagicScrollTimer);
+                this.mMagicScrollTimer = null;
+            }
         ]]></body>
       </method>
 
       <method name="setupMagicScroll">
         <parameter name="event"/>
         <body><![CDATA[
-          this.clearMagicScroll();
-
-          // If we are at the bottom or top of the view (or left/right when
-          // rotated), calculate the difference and start accelerating the
-          // scrollbar.
-          let diffStart, diffEnd;
-          let orient = event.target.getAttribute("orient");
-          let scrollbox = document.getAnonymousElementByAttribute(
-                         event.target, "anonid", "scrollbox");
-          if (orient == "vertical") {
-              diffStart = event.clientY - scrollbox.boxObject.y;
-              diffEnd = scrollbox.boxObject.y + scrollbox.boxObject.height - event.clientY;
-          } else {
-              diffStart = event.clientX - scrollbox.boxObject.x;
-              diffEnd = scrollbox.boxObject.x + scrollbox.boxObject.width - event.clientX;
-          }
-
-          const SCROLLZONE = 55;     // Size (pixels) of the top/bottom view where the scroll starts.
-          const MAXTIMEOUT = 250;    // Max and min time interval (ms) between
-          const MINTIMEOUT = 30;     // two consecutive scrolls.
-          const SCROLLBYHOUR = 0.33; // Part of hour to move for each scroll.
-          let insideScrollZone = 0;
-          let pxPerHr = event.target.mPixPerMin * 60;
-          let scrollBy = Math.floor(pxPerHr * SCROLLBYHOUR);
-          if (diffStart < SCROLLZONE) {
-              insideScrollZone = SCROLLZONE - diffStart;
-              scrollBy *= -1;
-          } else if (diffEnd < SCROLLZONE) {
-              insideScrollZone = SCROLLZONE - diffEnd;
-          }
-
-          if (insideScrollZone) {
-              let sbo = scrollbox.boxObject;
-              let timeout = MAXTIMEOUT - insideScrollZone * (MAXTIMEOUT - MINTIMEOUT) / SCROLLZONE;
-              this.mMagicScrollTimer = setTimeout(() => {
-                  sbo.scrollBy(orient == "horizontal" && scrollBy,
-                               orient == "vertical" && scrollBy);
-                  this.onEventSweepMouseMove(event);
-              }, timeout);
-          }
+            this.clearMagicScroll();
+
+            // If we are at the bottom or top of the view (or left/right when
+            // rotated), calculate the difference and start accelerating the
+            // scrollbar.
+            let diffStart, diffEnd;
+            let orient = event.target.getAttribute("orient");
+            let scrollbox = document.getAnonymousElementByAttribute(
+                           event.target, "anonid", "scrollbox");
+            if (orient == "vertical") {
+                diffStart = event.clientY - scrollbox.boxObject.y;
+                diffEnd = scrollbox.boxObject.y + scrollbox.boxObject.height - event.clientY;
+            } else {
+                diffStart = event.clientX - scrollbox.boxObject.x;
+                diffEnd = scrollbox.boxObject.x + scrollbox.boxObject.width - event.clientX;
+            }
+
+            const SCROLLZONE = 55;     // Size (pixels) of the top/bottom view where the scroll starts.
+            const MAXTIMEOUT = 250;    // Max and min time interval (ms) between
+            const MINTIMEOUT = 30;     // two consecutive scrolls.
+            const SCROLLBYHOUR = 0.33; // Part of hour to move for each scroll.
+            let insideScrollZone = 0;
+            let pxPerHr = event.target.mPixPerMin * 60;
+            let scrollBy = Math.floor(pxPerHr * SCROLLBYHOUR);
+            if (diffStart < SCROLLZONE) {
+                insideScrollZone = SCROLLZONE - diffStart;
+                scrollBy *= -1;
+            } else if (diffEnd < SCROLLZONE) {
+                insideScrollZone = SCROLLZONE - diffEnd;
+            }
+
+            if (insideScrollZone) {
+                let sbo = scrollbox.boxObject;
+                let timeout = MAXTIMEOUT - insideScrollZone * (MAXTIMEOUT - MINTIMEOUT) / SCROLLZONE;
+                this.mMagicScrollTimer = setTimeout(() => {
+                    sbo.scrollBy(orient == "horizontal" && scrollBy,
+                                 orient == "vertical" && scrollBy);
+                    this.onEventSweepMouseMove(event);
+                }, timeout);
+            }
         ]]></body>
       </method>
 
       <!--
          - Event sweep handlers
         -->
       <method name="onEventSweepMouseMove">
         <parameter name="event"/>
         <body><![CDATA[
-          let col = document.calendarEventColumnDragging;
-          if (!col) {
-              return;
-          }
-
-          col.setupMagicScroll(event);
-
-          let dragState = col.mDragState;
-
-          let lateralColumns = col.firstLastShadowColumns();
-          let firstCol = lateralColumns.firstCol;
-          let firstIndex = lateralColumns.firstIndex;
-
-          // If we leave the view, then stop our internal sweeping and start a
-          // real drag session. Someday we need to fix the sweep to soely be a
-          // drag session, no sweeping.
-          if (event.clientX < (event.target.boxObject.x) ||
-              event.clientX > (event.target.boxObject.x + event.target.boxObject.width) ||
-              event.clientY < (event.target.boxObject.y) ||
-              event.clientY > (event.target.boxObject.y + event.target.boxObject.height)) {
-              // Remove the drag state
-              for (let column = firstCol, i = firstIndex;
-                   column && i < col.mDragState.shadows;
-                   column = column.nextSibling, i++) {
-                  column.fgboxes.dragbox.removeAttribute("dragging");
-                  column.fgboxes.box.removeAttribute("dragging");
-              }
-
-              window.removeEventListener("mousemove", col.onEventSweepMouseMove);
-              window.removeEventListener("mouseup", col.onEventSweepMouseUp);
-              window.removeEventListener("keypress", col.onEventSweepKeypress);
-              document.calendarEventColumnDragging = null;
-              col.mDragState = null;
-
-              // the multiday view currently exhibits a less than optimal strategy
-              // in terms of item selection. items don't get automatically selected
-              // when clicked and dragged, as to differentiate inline editing from
-              // the act of selecting an event. but the application internal drop
-              // targets will ask for selected items in order to pull the data from
-              // the packets. that's why we need to make sure at least the currently
-              // dragged event is contained in the set of selected items.
-              let selectedItems = this.getSelectedItems({});
-              if (!selectedItems.some(aItem => aItem.hashId == item.hashId)) {
-                  col.calendarView.setSelectedItems(1,
-                      [event.ctrlKey ? item.parentItem : item]);
-              }
-              invokeEventDragSession(dragState.dragOccurrence, col);
-              return;
-          }
-
-          col.fgboxes.box.setAttribute("dragging", "true");
-          col.fgboxes.dragbox.setAttribute("dragging", "true");
-          let minutesInDay = col.mEndMin - col.mStartMin;
-
-          // check if we need to jump a column
-          let jumpedColumns;
-          let newcol = col.calendarView.findColumnForClientPoint(event.screenX, event.screenY);
-          if (newcol && newcol != col) {
-              // Find how many columns we are jumping by subtracting the dates.
-              let dur = newcol.mDate.subtractDate(col.mDate);
-              jumpedColumns = dur.days;
-              jumpedColumns *= dur.isNegative ? -1 : 1;
-              if (dragState.dragType == "modify-start") {
-                  // prevent dragging the start date after the end date in a new column
-                  if ((dragState.limitEndMin - minutesInDay * jumpedColumns) < 0) {
-                      return;
-                  }
-                  dragState.limitEndMin -= minutesInDay * jumpedColumns;
-              } else if (dragState.dragType == "modify-end") {
-                  // prevent dragging the end date before the start date in a new column
-                  if ((dragState.limitStartMin - minutesInDay * jumpedColumns) > minutesInDay) {
-                      return;
-                  }
-                  dragState.limitStartMin -= minutesInDay * jumpedColumns;
-              } else if (dragState.dragType == "new") {
-                  dragState.limitEndMin -= minutesInDay * jumpedColumns;
-                  dragState.limitStartMin -= minutesInDay * jumpedColumns;
-                  dragState.jumpedColumns += jumpedColumns;
-              }
-              // kill our drag state
-              for (let column = firstCol, i = firstIndex;
-                   column && i < col.mDragState.shadows;
-                   column = column.nextSibling, i++) {
-                  column.fgboxes.dragbox.removeAttribute("dragging");
-                  column.fgboxes.box.removeAttribute("dragging");
-              }
-
-              // jump ship
-              newcol.acceptInProgressSweep(dragState);
-
-              // restart event handling
-              col.onEventSweepMouseMove(event);
-
-              return;
-          }
-
-          let mousePos;
-          let sizeattr;
-          if (col.getAttribute("orient") == "vertical") {
-              mousePos = event.screenY - col.parentNode.boxObject.screenY;
-              sizeattr = "height";
-          } else {
-              mousePos = event.screenX - col.parentNode.boxObject.screenX;
-              sizeattr = "width";
-          }
-          // don't let mouse position go outside the window edges
-          let pos = Math.max(0, mousePos) - dragState.mouseOffset;
-
-          // snap interval: 15 minutes or 1 minute if modifier key is pressed
-          let snapIntMin = (event.shiftKey &&
-                            !event.ctrlKey &&
-                            !event.altKey &&
-                            !event.metaKey) ? 1 : 15;
-          let interval = col.mPixPerMin * snapIntMin;
-          let curmin = Math.floor(pos / interval) * snapIntMin;
-          let deltamin = curmin - dragState.origMin;
-
-          let shadowElements;
-          if (dragState.dragType == "new") {
-              // Extend deltamin in a linear way over the columns
-              deltamin += minutesInDay * dragState.jumpedColumns;
-              if (deltamin < 0) {
-                  // create a new event modifying the start. End time is fixed
-                  shadowElements = {
-                      shadows: 1 - dragState.jumpedColumns,
-                      offset: 0,
-                      startMin: curmin,
-                      endMin: dragState.origMin
-                  };
-              } else {
-                  // create a new event modifying the end. Start time is fixed
-                  shadowElements = {
-                      shadows: dragState.jumpedColumns + 1,
-                      offset: dragState.jumpedColumns,
-                      startMin: dragState.origMin,
-                      endMin: curmin
-                  };
-              }
-              dragState.startMin = shadowElements.startMin;
-              dragState.endMin = shadowElements.endMin;
-          } else if (dragState.dragType == "move") {
-              // if we're moving, we modify startMin and endMin of the shadow.
-              shadowElements = col.getShadowElements(dragState.origMinStart + deltamin,
-                                                     dragState.origMinEnd + deltamin);
-              dragState.startMin = shadowElements.startMin;
-              dragState.endMin = shadowElements.endMin;
-              // Keep track of the last start position because it will help to
-              // build the event at the end of the drag session.
-              dragState.lastStart = dragState.origMinStart + deltamin;
-          } else if (dragState.dragType == "modify-start") {
-              // if we're modifying the start, the end time is fixed.
-              shadowElements = col.getShadowElements(dragState.origMin + deltamin, dragState.limitEndMin);
-              dragState.startMin = shadowElements.startMin;
-              dragState.endMin = shadowElements.endMin;
-
-              // but we need to not go past the end; if we hit
-              // the end, then we'll clamp to the previous snap interval minute
-              if (dragState.startMin >= dragState.limitEndMin) {
-                  dragState.startMin = Math.ceil((dragState.limitEndMin - snapIntMin) / snapIntMin) * snapIntMin;
-              }
-          } else if (dragState.dragType == "modify-end") {
-              // if we're modifying the end, the start time is fixed.
-              shadowElements = col.getShadowElements(dragState.limitStartMin, dragState.origMin + deltamin);
-              dragState.startMin = shadowElements.startMin;
-              dragState.endMin = shadowElements.endMin;
-
-              // but we need to not go past the start; if we hit
-              // the start, then we'll clamp to the next snap interval minute
-              if (dragState.endMin <= dragState.limitStartMin) {
-                  dragState.endMin = Math.floor((dragState.limitStartMin + snapIntMin) / snapIntMin) * snapIntMin;
-              }
-          }
-          let currentOffset = shadowElements.offset;
-          let currentShadows = shadowElements.shadows;
-
-          // now we can update the shadow boxes position and size
-          col.updateShadowsBoxes(dragState.startMin, dragState.endMin,
-                                 currentOffset, currentShadows,
-                                 sizeattr);
-
-          // update the labels
-          lateralColumns = col.firstLastShadowColumns(currentOffset, currentShadows);
-          col.updateDragLabels(lateralColumns.firstCol, lateralColumns.lastCol);
-
-          col.mDragState.offset = currentOffset;
-          col.mDragState.shadows = currentShadows;
+            let col = document.calendarEventColumnDragging;
+            if (!col) {
+                return;
+            }
+
+            col.setupMagicScroll(event);
+
+            let dragState = col.mDragState;
+
+            let lateralColumns = col.firstLastShadowColumns();
+            let firstCol = lateralColumns.firstCol;
+            let firstIndex = lateralColumns.firstIndex;
+
+            // If we leave the view, then stop our internal sweeping and start a
+            // real drag session. Someday we need to fix the sweep to soely be a
+            // drag session, no sweeping.
+            if (event.clientX < (event.target.boxObject.x) ||
+                event.clientX > (event.target.boxObject.x + event.target.boxObject.width) ||
+                event.clientY < (event.target.boxObject.y) ||
+                event.clientY > (event.target.boxObject.y + event.target.boxObject.height)) {
+                // Remove the drag state
+                for (let column = firstCol, i = firstIndex;
+                     column && i < col.mDragState.shadows;
+                     column = column.nextSibling, i++) {
+                    column.fgboxes.dragbox.removeAttribute("dragging");
+                    column.fgboxes.box.removeAttribute("dragging");
+                }
+
+                window.removeEventListener("mousemove", col.onEventSweepMouseMove);
+                window.removeEventListener("mouseup", col.onEventSweepMouseUp);
+                window.removeEventListener("keypress", col.onEventSweepKeypress);
+                document.calendarEventColumnDragging = null;
+                col.mDragState = null;
+
+                // the multiday view currently exhibits a less than optimal strategy
+                // in terms of item selection. items don't get automatically selected
+                // when clicked and dragged, as to differentiate inline editing from
+                // the act of selecting an event. but the application internal drop
+                // targets will ask for selected items in order to pull the data from
+                // the packets. that's why we need to make sure at least the currently
+                // dragged event is contained in the set of selected items.
+                let selectedItems = this.getSelectedItems({});
+                if (!selectedItems.some(aItem => aItem.hashId == item.hashId)) {
+                    col.calendarView.setSelectedItems(1,
+                        [event.ctrlKey ? item.parentItem : item]);
+                }
+                invokeEventDragSession(dragState.dragOccurrence, col);
+                return;
+            }
+
+            col.fgboxes.box.setAttribute("dragging", "true");
+            col.fgboxes.dragbox.setAttribute("dragging", "true");
+            let minutesInDay = col.mEndMin - col.mStartMin;
+
+            // check if we need to jump a column
+            let jumpedColumns;
+            let newcol = col.calendarView.findColumnForClientPoint(event.screenX, event.screenY);
+            if (newcol && newcol != col) {
+                // Find how many columns we are jumping by subtracting the dates.
+                let dur = newcol.mDate.subtractDate(col.mDate);
+                jumpedColumns = dur.days;
+                jumpedColumns *= dur.isNegative ? -1 : 1;
+                if (dragState.dragType == "modify-start") {
+                    // prevent dragging the start date after the end date in a new column
+                    if ((dragState.limitEndMin - minutesInDay * jumpedColumns) < 0) {
+                        return;
+                    }
+                    dragState.limitEndMin -= minutesInDay * jumpedColumns;
+                } else if (dragState.dragType == "modify-end") {
+                    // prevent dragging the end date before the start date in a new column
+                    if ((dragState.limitStartMin - minutesInDay * jumpedColumns) > minutesInDay) {
+                        return;
+                    }
+                    dragState.limitStartMin -= minutesInDay * jumpedColumns;
+                } else if (dragState.dragType == "new") {
+                    dragState.limitEndMin -= minutesInDay * jumpedColumns;
+                    dragState.limitStartMin -= minutesInDay * jumpedColumns;
+                    dragState.jumpedColumns += jumpedColumns;
+                }
+                // kill our drag state
+                for (let column = firstCol, i = firstIndex;
+                     column && i < col.mDragState.shadows;
+                     column = column.nextSibling, i++) {
+                    column.fgboxes.dragbox.removeAttribute("dragging");
+                    column.fgboxes.box.removeAttribute("dragging");
+                }
+
+                // jump ship
+                newcol.acceptInProgressSweep(dragState);
+
+                // restart event handling
+                col.onEventSweepMouseMove(event);
+
+                return;
+            }
+
+            let mousePos;
+            let sizeattr;
+            if (col.getAttribute("orient") == "vertical") {
+                mousePos = event.screenY - col.parentNode.boxObject.screenY;
+                sizeattr = "height";
+            } else {
+                mousePos = event.screenX - col.parentNode.boxObject.screenX;
+                sizeattr = "width";
+            }
+            // don't let mouse position go outside the window edges
+            let pos = Math.max(0, mousePos) - dragState.mouseOffset;
+
+            // snap interval: 15 minutes or 1 minute if modifier key is pressed
+            let snapIntMin = (event.shiftKey &&
+                              !event.ctrlKey &&
+                              !event.altKey &&
+                              !event.metaKey) ? 1 : 15;
+            let interval = col.mPixPerMin * snapIntMin;
+            let curmin = Math.floor(pos / interval) * snapIntMin;
+            let deltamin = curmin - dragState.origMin;
+
+            let shadowElements;
+            if (dragState.dragType == "new") {
+                // Extend deltamin in a linear way over the columns
+                deltamin += minutesInDay * dragState.jumpedColumns;
+                if (deltamin < 0) {
+                    // create a new event modifying the start. End time is fixed
+                    shadowElements = {
+                        shadows: 1 - dragState.jumpedColumns,
+                        offset: 0,
+                        startMin: curmin,
+                        endMin: dragState.origMin
+                    };
+                } else {
+                    // create a new event modifying the end. Start time is fixed
+                    shadowElements = {
+                        shadows: dragState.jumpedColumns + 1,
+                        offset: dragState.jumpedColumns,
+                        startMin: dragState.origMin,
+                        endMin: curmin
+                    };
+                }
+                dragState.startMin = shadowElements.startMin;
+                dragState.endMin = shadowElements.endMin;
+            } else if (dragState.dragType == "move") {
+                // if we're moving, we modify startMin and endMin of the shadow.
+                shadowElements = col.getShadowElements(dragState.origMinStart + deltamin,
+                                                       dragState.origMinEnd + deltamin);
+                dragState.startMin = shadowElements.startMin;
+                dragState.endMin = shadowElements.endMin;
+                // Keep track of the last start position because it will help to
+                // build the event at the end of the drag session.
+                dragState.lastStart = dragState.origMinStart + deltamin;
+            } else if (dragState.dragType == "modify-start") {
+                // if we're modifying the start, the end time is fixed.
+                shadowElements = col.getShadowElements(dragState.origMin + deltamin, dragState.limitEndMin);
+                dragState.startMin = shadowElements.startMin;
+                dragState.endMin = shadowElements.endMin;
+
+                // but we need to not go past the end; if we hit
+                // the end, then we'll clamp to the previous snap interval minute
+                if (dragState.startMin >= dragState.limitEndMin) {
+                    dragState.startMin = Math.ceil((dragState.limitEndMin - snapIntMin) / snapIntMin) * snapIntMin;
+                }
+            } else if (dragState.dragType == "modify-end") {
+                // if we're modifying the end, the start time is fixed.
+                shadowElements = col.getShadowElements(dragState.limitStartMin, dragState.origMin + deltamin);
+                dragState.startMin = shadowElements.startMin;
+                dragState.endMin = shadowElements.endMin;
+
+                // but we need to not go past the start; if we hit
+                // the start, then we'll clamp to the next snap interval minute
+                if (dragState.endMin <= dragState.limitStartMin) {
+                    dragState.endMin = Math.floor((dragState.limitStartMin + snapIntMin) / snapIntMin) * snapIntMin;
+                }
+            }
+            let currentOffset = shadowElements.offset;
+            let currentShadows = shadowElements.shadows;
+
+            // now we can update the shadow boxes position and size
+            col.updateShadowsBoxes(dragState.startMin, dragState.endMin,
+                                   currentOffset, currentShadows,
+                                   sizeattr);
+
+            // update the labels
+            lateralColumns = col.firstLastShadowColumns(currentOffset, currentShadows);
+            col.updateDragLabels(lateralColumns.firstCol, lateralColumns.lastCol);
+
+            col.mDragState.offset = currentOffset;
+            col.mDragState.shadows = currentShadows;
         ]]></body>
       </method>
 
       <method name="onEventSweepMouseUp">
         <parameter name="event"/>
         <body><![CDATA[
-          let col = document.calendarEventColumnDragging;
-          if (!col) {
-              return;
-          }
-
-          let dragState = col.mDragState;
-
-          let lateralColumns = col.firstLastShadowColumns();
-          let column = lateralColumns.firstCol;
-          let index = lateralColumns.firstIndex;
-          while (column && index < dragState.shadows) {
-              column.fgboxes.dragbox.removeAttribute("dragging");
-              column.fgboxes.box.removeAttribute("dragging");
-              column = column.nextSibling;
-              index++;
-          }
-
-          col.clearMagicScroll();
-
-          window.removeEventListener("mousemove", col.onEventSweepMouseMove);
-          window.removeEventListener("mouseup", col.onEventSweepMouseUp);
-          window.removeEventListener("keypress", col.onEventSweepKeypress);
-
-          document.calendarEventColumnDragging = null;
-
-          // if the user didn't sweep out at least a few pixels, ignore
-          // unless we're in a different column
-          if (dragState.origColumn == col) {
-              let ignore = false;
-              let orient = col.getAttribute("orient");
-              let position = orient == "vertical" ? event.screenY : event.screenX;
-              if (Math.abs(position - dragState.origLoc) < 3) {
-                  ignore = true;
-              }
-
-              if (ignore) {
-                  col.mDragState = null;
-                  return;
-              }
-          }
-
-          let newStart;
-          let newEnd;
-          let startTZ;
-          let endTZ;
-          let dragDay = col.mDate;
-          if (dragState.dragType != "new") {
-              let oldStart = dragState.dragOccurrence.startDate ||
-                             dragState.dragOccurrence.entryDate ||
-                             dragState.dragOccurrence.dueDate;
-              let oldEnd = dragState.dragOccurrence.endDate ||
-                           dragState.dragOccurrence.dueDate ||
-                           dragState.dragOccurrence.entryDate;
-              newStart = oldStart.clone();
-              newEnd = oldEnd.clone();
-
-              // Our views are pegged to the default timezone.  If the event
-              // isn't also in the timezone, we're going to need to do some
-              // tweaking. We could just do this for every event but
-              // getInTimezone is slow, so it's much better to only do this
-              // when the timezones actually differ from the view's.
-              if (col.mTimezone != newStart.timezone ||
-                  col.mTimezone != newEnd.timezone) {
-                  startTZ = newStart.timezone;
-                  endTZ = newEnd.timezone;
-                  newStart = newStart.getInTimezone(col.calendarView.mTimezone);
-                  newEnd = newEnd.getInTimezone(col.calendarView.mTimezone);
-              }
-          }
-
-          if (dragState.dragType == "modify-start") {
-              newStart.resetTo(dragDay.year, dragDay.month, dragDay.day,
-                               0, dragState.startMin + col.mStartMin, 0,
-                               newStart.timezone);
-          } else if (dragState.dragType == "modify-end") {
-              newEnd.resetTo(dragDay.year, dragDay.month, dragDay.day,
-                             0, dragState.endMin + col.mStartMin, 0,
-                             newEnd.timezone);
-          } else if (dragState.dragType == "new") {
-              let startDay = dragState.origColumn.mDate;
-              let draggedForward = (dragDay.compare(startDay) > 0);
-              newStart = draggedForward ? startDay.clone() : dragDay.clone();
-              newEnd = draggedForward ? dragDay.clone() : startDay.clone();
-              newStart.isDate = false;
-              newEnd.isDate = false;
-              newStart.resetTo(newStart.year, newStart.month, newStart.day,
-                               0, dragState.startMin + col.mStartMin, 0,
-                               newStart.timezone);
-              newEnd.resetTo(newEnd.year, newEnd.month, newEnd.day,
-                             0, dragState.endMin + col.mStartMin, 0,
-                             newEnd.timezone);
-
-              // Edit the event title on the first of the new event's occurrences
-              if (draggedForward) {
-                  dragState.origColumn.mCreatedNewEvent = true;
-              } else {
-                  col.mCreatedNewEvent = true;
-              }
-          } else if (dragState.dragType == "move") {
-              // Figure out the new date-times of the event by adding the duration
-              // of the total movement (days and minutes) to the old dates.
-              let duration = dragDay.subtractDate(dragState.origColumn.mDate);
-              let minutes = dragState.lastStart - dragState.realStart;
-
-              // Since both boxDate and beginMove are dates (note datetimes),
-              // subtractDate will only give us a non-zero number of hours on
-              // DST changes. While strictly speaking, subtractDate's behavior
-              // is correct, we need to move the event a discrete number of
-              // days here. There is no need for normalization here, since
-              // addDuration does the job for us. Also note, the duration used
-              // here is only used to move over multiple days. Moving on the
-              // same day uses the minutes from the dragState.
-              if (duration.hours == 23) {
-                  // entering DST
-                  duration.hours++;
-              } else if (duration.hours == 1) {
-                  // leaving DST
-                  duration.hours--;
-              }
-
-              if (duration.isNegative) {
-                  // Adding negative minutes to a negative duration makes the
-                  // duration more positive, but we want more negative, and
-                  // vice versa.
-                  minutes *= -1;
-              }
-              duration.minutes = minutes;
-              duration.normalize();
-
-              newStart.addDuration(duration);
-              newEnd.addDuration(duration);
-          }
-
-          // If we tweaked tzs, put times back in their original ones
-          if (startTZ) {
-              newStart = newStart.getInTimezone(startTZ);
-          }
-          if (endTZ) {
-              newEnd = newEnd.getInTimezone(endTZ);
-          }
-
-          if (dragState.dragType == "new") {
-              // We won't pass a calendar, since the display calendar is the
-              // composite anyway. createNewEvent() will use the selected
-              // calendar.
-              // TODO We might want to get rid of the extra displayCalendar
-              // member.
-              col.calendarView.controller.createNewEvent(null,
-                                                         newStart,
-                                                         newEnd);
-          } else if (dragState.dragType == "move" ||
-                     dragState.dragType == "modify-start" ||
-                     dragState.dragType == "modify-end") {
-              col.calendarView.controller.modifyOccurrence(dragState.dragOccurrence,
-                                                           newStart, newEnd);
-          }
-          document.calendarEventColumnDragging = null;
-          col.mDragState = null;
+            let col = document.calendarEventColumnDragging;
+            if (!col) {
+                return;
+            }
+
+            let dragState = col.mDragState;
+
+            let lateralColumns = col.firstLastShadowColumns();
+            let column = lateralColumns.firstCol;
+            let index = lateralColumns.firstIndex;
+            while (column && index < dragState.shadows) {
+                column.fgboxes.dragbox.removeAttribute("dragging");
+                column.fgboxes.box.removeAttribute("dragging");
+                column = column.nextSibling;
+                index++;
+            }
+
+            col.clearMagicScroll();
+
+            window.removeEventListener("mousemove", col.onEventSweepMouseMove);
+            window.removeEventListener("mouseup", col.onEventSweepMouseUp);
+            window.removeEventListener("keypress", col.onEventSweepKeypress);
+
+            document.calendarEventColumnDragging = null;
+
+            // if the user didn't sweep out at least a few pixels, ignore
+            // unless we're in a different column
+            if (dragState.origColumn == col) {
+                let ignore = false;
+                let orient = col.getAttribute("orient");
+                let position = orient == "vertical" ? event.screenY : event.screenX;
+                if (Math.abs(position - dragState.origLoc) < 3) {
+                    ignore = true;
+                }
+
+                if (ignore) {
+                    col.mDragState = null;
+                    return;
+                }
+            }
+
+            let newStart;
+            let newEnd;
+            let startTZ;
+            let endTZ;
+            let dragDay = col.mDate;
+            if (dragState.dragType != "new") {
+                let oldStart = dragState.dragOccurrence.startDate ||
+                               dragState.dragOccurrence.entryDate ||
+                               dragState.dragOccurrence.dueDate;
+                let oldEnd = dragState.dragOccurrence.endDate ||
+                             dragState.dragOccurrence.dueDate ||
+                             dragState.dragOccurrence.entryDate;
+                newStart = oldStart.clone();
+                newEnd = oldEnd.clone();
+
+                // Our views are pegged to the default timezone.  If the event
+                // isn't also in the timezone, we're going to need to do some
+                // tweaking. We could just do this for every event but
+                // getInTimezone is slow, so it's much better to only do this
+                // when the timezones actually differ from the view's.
+                if (col.mTimezone != newStart.timezone ||
+                    col.mTimezone != newEnd.timezone) {
+                    startTZ = newStart.timezone;
+                    endTZ = newEnd.timezone;
+                    newStart = newStart.getInTimezone(col.calendarView.mTimezone);
+                    newEnd = newEnd.getInTimezone(col.calendarView.mTimezone);
+                }
+            }
+
+            if (dragState.dragType == "modify-start") {
+                newStart.resetTo(dragDay.year, dragDay.month, dragDay.day,
+                                 0, dragState.startMin + col.mStartMin, 0,
+                                 newStart.timezone);
+            } else if (dragState.dragType == "modify-end") {
+                newEnd.resetTo(dragDay.year, dragDay.month, dragDay.day,
+                               0, dragState.endMin + col.mStartMin, 0,
+                               newEnd.timezone);
+            } else if (dragState.dragType == "new") {
+                let startDay = dragState.origColumn.mDate;
+                let draggedForward = (dragDay.compare(startDay) > 0);
+                newStart = draggedForward ? startDay.clone() : dragDay.clone();
+                newEnd = draggedForward ? dragDay.clone() : startDay.clone();
+                newStart.isDate = false;
+                newEnd.isDate = false;
+                newStart.resetTo(newStart.year, newStart.month, newStart.day,
+                                 0, dragState.startMin + col.mStartMin, 0,
+                                 newStart.timezone);
+                newEnd.resetTo(newEnd.year, newEnd.month, newEnd.day,
+                               0, dragState.endMin + col.mStartMin, 0,
+                               newEnd.timezone);
+
+                // Edit the event title on the first of the new event's occurrences
+                if (draggedForward) {
+                    dragState.origColumn.mCreatedNewEvent = true;
+                } else {
+                    col.mCreatedNewEvent = true;
+                }
+            } else if (dragState.dragType == "move") {
+                // Figure out the new date-times of the event by adding the duration
+                // of the total movement (days and minutes) to the old dates.
+                let duration = dragDay.subtractDate(dragState.origColumn.mDate);
+                let minutes = dragState.lastStart - dragState.realStart;
+
+                // Since both boxDate and beginMove are dates (note datetimes),
+                // subtractDate will only give us a non-zero number of hours on
+                // DST changes. While strictly speaking, subtractDate's behavior
+                // is correct, we need to move the event a discrete number of
+                // days here. There is no need for normalization here, since
+                // addDuration does the job for us. Also note, the duration used
+                // here is only used to move over multiple days. Moving on the
+                // same day uses the minutes from the dragState.
+                if (duration.hours == 23) {
+                    // entering DST
+                    duration.hours++;
+                } else if (duration.hours == 1) {
+                    // leaving DST
+                    duration.hours--;
+                }
+
+                if (duration.isNegative) {
+                    // Adding negative minutes to a negative duration makes the
+                    // duration more positive, but we want more negative, and
+                    // vice versa.
+                    minutes *= -1;
+                }
+                duration.minutes = minutes;
+                duration.normalize();
+
+                newStart.addDuration(duration);
+                newEnd.addDuration(duration);
+            }
+
+            // If we tweaked tzs, put times back in their original ones
+            if (startTZ) {
+                newStart = newStart.getInTimezone(startTZ);
+            }
+            if (endTZ) {
+                newEnd = newEnd.getInTimezone(endTZ);
+            }
+
+            if (dragState.dragType == "new") {
+                // We won't pass a calendar, since the display calendar is the
+                // composite anyway. createNewEvent() will use the selected
+                // calendar.
+                // TODO We might want to get rid of the extra displayCalendar
+                // member.
+                col.calendarView.controller.createNewEvent(null,
+                                                           newStart,
+                                                           newEnd);
+            } else if (dragState.dragType == "move" ||
+                       dragState.dragType == "modify-start" ||
+                       dragState.dragType == "modify-end") {
+                col.calendarView.controller.modifyOccurrence(dragState.dragOccurrence,
+                                                             newStart, newEnd);
+            }
+            document.calendarEventColumnDragging = null;
+            col.mDragState = null;
         ]]></body>
       </method>
 
       <!-- This is called by an event box when a grippy on either side is dragged,
          - or when the middle is pressed to drag the event to move it.  We create
          - the same type of view that we use to sweep out a new event, but we
          - initialize it based on the event's values and what type of dragging
          - we're doing.  In addition, we constrain things like not being able to
@@ -1794,451 +1794,451 @@
         <parameter name="aOccurrence"/>
         <!-- "start", "end", "middle" -->
         <parameter name="aGrabbedElement"/>
         <!-- mouse screenX/screenY from the event -->
         <parameter name="aMouseX"/>
         <parameter name="aMouseY"/>
         <parameter name="aSnapInt"/>
         <body><![CDATA[
-          if (!cal.isCalendarWritable(aOccurrence.calendar) ||
-              !cal.userCanModifyItem(aOccurrence) ||
-              (aOccurrence.calendar instanceof Components.interfaces.calISchedulingSupport && aOccurrence.calendar.isInvitation(aOccurrence)) ||
-              aOccurrence.calendar.getProperty("capabilities.events.supported") === false) {
-              return;
-          }
-
-          this.mDragState = {
-              origColumn: this,
-              dragOccurrence: aOccurrence,
-              mouseOffset: 0,
-              offset: null,
-              shadows: null,
-              limitStartMin: null,
-              lastStart: 0,
-              jumpedColumns: 0
-          };
-
-          // snap interval: 15 minutes or 1 minute if modifier key is pressed
-          let snapIntMin = aSnapInt || 15;
-          let sizeattr;
-          if (this.getAttribute("orient") == "vertical") {
-              this.mDragState.origLoc = aMouseY;
-              sizeattr = "height";
-          } else {
-              this.mDragState.origLoc = aMouseX;
-              sizeattr = "width";
-          }
-
-          let mins = this.getStartEndMinutesForOccurrence(aOccurrence);
-
-          // these are only used to compute durations or to compute UI
-          // sizes, so offset by this.mStartMin for sanity here (at the
-          // expense of possible insanity later)
-          mins.start -= this.mStartMin;
-          mins.end -= this.mStartMin;
-
-          if (aGrabbedElement == "start") {
-              this.mDragState.dragType = "modify-start";
-              // we have to use "realEnd" as fixed end value
-              this.mDragState.limitEndMin = mins.realEnd;
-
-              // snap start
-              this.mDragState.origMin = Math.floor(mins.start / snapIntMin) * snapIntMin;
-
-              // show the shadows and drag labels when clicking on gripbars
-              let shadowElements = this.getShadowElements(this.mDragState.origMin,
-                                                          this.mDragState.limitEndMin);
-              this.mDragState.startMin = shadowElements.startMin;
-              this.mDragState.endMin = shadowElements.endMin;
-              this.mDragState.shadows = shadowElements.shadows;
-              this.mDragState.offset = shadowElements.offset;
-              this.updateShadowsBoxes(this.mDragState.origMin, this.mDragState.endMin,
-                                      0, this.mDragState.shadows,
-                                      sizeattr);
-
-              // update drag labels
-              let lastCol = this.firstLastShadowColumns().lastCol;
-              this.updateDragLabels(this, lastCol);
-          } else if (aGrabbedElement == "end") {
-              this.mDragState.dragType = "modify-end";
-              // we have to use "realStart" as fixed end value
-              this.mDragState.limitStartMin = mins.realStart;
-
-              // snap end
-              this.mDragState.origMin = Math.floor(mins.end / snapIntMin) * snapIntMin;
-
-              // show the shadows and drag labels when clicking on gripbars
-              let shadowElements = this.getShadowElements(this.mDragState.limitStartMin,
-                                                          this.mDragState.origMin);
-              this.mDragState.startMin = shadowElements.startMin;
-              this.mDragState.endMin = shadowElements.endMin;
-              this.mDragState.shadows = shadowElements.shadows;
-              this.mDragState.offset = shadowElements.offset;
-              this.updateShadowsBoxes(this.mDragState.startMin, this.mDragState.endMin,
-                                      shadowElements.offset, this.mDragState.shadows,
-                                      sizeattr);
-
-              // update drag labels
-              let firstCol = this.firstLastShadowColumns().firstCol;
-              this.updateDragLabels(firstCol, this);
-          } else if (aGrabbedElement == "middle") {
-              this.mDragState.dragType = "move";
-              // in a move, origMin will be the start minute of the element where
-              // the drag occurs. Along with mouseOffset, it allows to track the
-              // shadow position. origMinStart and origMinEnd allow to figure out
-              // the real shadow size.
-              // We snap to the start and add the real duration to find the end
-              let limitDurationMin = mins.realEnd - mins.realStart;
-              this.mDragState.origMin = Math.floor(mins.start / snapIntMin) * snapIntMin;
-              this.mDragState.origMinStart = Math.floor(mins.realStart / snapIntMin) * snapIntMin;
-              this.mDragState.origMinEnd = this.mDragState.origMinStart + limitDurationMin;
-              // Keep also track of the real Start, it will be used at the end
-              // of the drag session to calculate the new start and end datetimes.
-              this.mDragState.realStart = mins.realStart;
-
-              let shadowElements = this.getShadowElements(this.mDragState.origMinStart,
-                                                          this.mDragState.origMinEnd);
-              this.mDragState.shadows = shadowElements.shadows;
-              this.mDragState.offset = shadowElements.offset;
-              // we need to set a mouse offset, since we're not dragging from
-              // one end of the element
-              if (aEventBox) {
-                  if (this.getAttribute("orient") == "vertical") {
-                      this.mDragState.mouseOffset = aMouseY - aEventBox.boxObject.screenY;
-                  } else {
-                      this.mDragState.mouseOffset = aMouseX - aEventBox.boxObject.screenX;
-                  }
-              }
-          } else {
-              // Invalid grabbed element.
-          }
-
-          document.calendarEventColumnDragging = this;
-
-          window.addEventListener("mousemove", this.onEventSweepMouseMove);
-          window.addEventListener("mouseup", this.onEventSweepMouseUp);
-          window.addEventListener("keypress", this.onEventSweepKeypress);
+            if (!cal.isCalendarWritable(aOccurrence.calendar) ||
+                !cal.userCanModifyItem(aOccurrence) ||
+                (aOccurrence.calendar instanceof Components.interfaces.calISchedulingSupport && aOccurrence.calendar.isInvitation(aOccurrence)) ||
+                aOccurrence.calendar.getProperty("capabilities.events.supported") === false) {
+                return;
+            }
+
+            this.mDragState = {
+                origColumn: this,
+                dragOccurrence: aOccurrence,
+                mouseOffset: 0,
+                offset: null,
+                shadows: null,
+                limitStartMin: null,
+                lastStart: 0,
+                jumpedColumns: 0
+            };
+
+            // snap interval: 15 minutes or 1 minute if modifier key is pressed
+            let snapIntMin = aSnapInt || 15;
+            let sizeattr;
+            if (this.getAttribute("orient") == "vertical") {
+                this.mDragState.origLoc = aMouseY;
+                sizeattr = "height";
+            } else {
+                this.mDragState.origLoc = aMouseX;
+                sizeattr = "width";
+            }
+
+            let mins = this.getStartEndMinutesForOccurrence(aOccurrence);
+
+            // these are only used to compute durations or to compute UI
+            // sizes, so offset by this.mStartMin for sanity here (at the
+            // expense of possible insanity later)
+            mins.start -= this.mStartMin;
+            mins.end -= this.mStartMin;
+
+            if (aGrabbedElement == "start") {
+                this.mDragState.dragType = "modify-start";
+                // we have to use "realEnd" as fixed end value
+                this.mDragState.limitEndMin = mins.realEnd;
+
+                // snap start
+                this.mDragState.origMin = Math.floor(mins.start / snapIntMin) * snapIntMin;
+
+                // show the shadows and drag labels when clicking on gripbars
+                let shadowElements = this.getShadowElements(this.mDragState.origMin,
+                                                            this.mDragState.limitEndMin);
+                this.mDragState.startMin = shadowElements.startMin;
+                this.mDragState.endMin = shadowElements.endMin;
+                this.mDragState.shadows = shadowElements.shadows;
+                this.mDragState.offset = shadowElements.offset;
+                this.updateShadowsBoxes(this.mDragState.origMin, this.mDragState.endMin,
+                                        0, this.mDragState.shadows,
+                                        sizeattr);
+
+                // update drag labels
+                let lastCol = this.firstLastShadowColumns().lastCol;
+                this.updateDragLabels(this, lastCol);
+            } else if (aGrabbedElement == "end") {
+                this.mDragState.dragType = "modify-end";
+                // we have to use "realStart" as fixed end value
+                this.mDragState.limitStartMin = mins.realStart;
+
+                // snap end
+                this.mDragState.origMin = Math.floor(mins.end / snapIntMin) * snapIntMin;
+
+                // show the shadows and drag labels when clicking on gripbars
+                let shadowElements = this.getShadowElements(this.mDragState.limitStartMin,
+                                                            this.mDragState.origMin);
+                this.mDragState.startMin = shadowElements.startMin;
+                this.mDragState.endMin = shadowElements.endMin;
+                this.mDragState.shadows = shadowElements.shadows;
+                this.mDragState.offset = shadowElements.offset;
+                this.updateShadowsBoxes(this.mDragState.startMin, this.mDragState.endMin,
+                                        shadowElements.offset, this.mDragState.shadows,
+                                        sizeattr);
+
+                // update drag labels
+                let firstCol = this.firstLastShadowColumns().firstCol;
+                this.updateDragLabels(firstCol, this);
+            } else if (aGrabbedElement == "middle") {
+                this.mDragState.dragType = "move";
+                // in a move, origMin will be the start minute of the element where
+                // the drag occurs. Along with mouseOffset, it allows to track the
+                // shadow position. origMinStart and origMinEnd allow to figure out
+                // the real shadow size.
+                // We snap to the start and add the real duration to find the end
+                let limitDurationMin = mins.realEnd - mins.realStart;
+                this.mDragState.origMin = Math.floor(mins.start / snapIntMin) * snapIntMin;
+                this.mDragState.origMinStart = Math.floor(mins.realStart / snapIntMin) * snapIntMin;
+                this.mDragState.origMinEnd = this.mDragState.origMinStart + limitDurationMin;
+                // Keep also track of the real Start, it will be used at the end
+                // of the drag session to calculate the new start and end datetimes.
+                this.mDragState.realStart = mins.realStart;
+
+                let shadowElements = this.getShadowElements(this.mDragState.origMinStart,
+                                                            this.mDragState.origMinEnd);
+                this.mDragState.shadows = shadowElements.shadows;
+                this.mDragState.offset = shadowElements.offset;
+                // we need to set a mouse offset, since we're not dragging from
+                // one end of the element
+                if (aEventBox) {
+                    if (this.getAttribute("orient") == "vertical") {
+                        this.mDragState.mouseOffset = aMouseY - aEventBox.boxObject.screenY;
+                    } else {
+                        this.mDragState.mouseOffset = aMouseX - aEventBox.boxObject.screenX;
+                    }
+                }
+            } else {
+                // Invalid grabbed element.
+            }
+
+            document.calendarEventColumnDragging = this;
+
+            window.addEventListener("mousemove", this.onEventSweepMouseMove);
+            window.addEventListener("mouseup", this.onEventSweepMouseUp);
+            window.addEventListener("keypress", this.onEventSweepKeypress);
         ]]></body>
       </method>
 
       <!-- called by sibling columns to tell us to take over the sweeping
          - of an event.
         -->
       <method name="acceptInProgressSweep">
         <parameter name="aDragState"/>
         <body><![CDATA[
-          this.mDragState = aDragState;
-          document.calendarEventColumnDragging = this;
-
-          this.fgboxes.box.setAttribute("dragging", "true");
-          this.fgboxes.dragbox.setAttribute("dragging", "true");
-
-          // the same event handlers are still valid,
-          // because they use document.calendarEventColumnDragging.
-          // So we really don't have anything to do here.
+            this.mDragState = aDragState;
+            document.calendarEventColumnDragging = this;
+
+            this.fgboxes.box.setAttribute("dragging", "true");
+            this.fgboxes.dragbox.setAttribute("dragging", "true");
+
+            // the same event handlers are still valid,
+            // because they use document.calendarEventColumnDragging.
+            // So we really don't have anything to do here.
         ]]></body>
       </method>
 
       <method name="updateDragLabels">
         <parameter name="aFirstColumn"/>
         <parameter name="aLastColumn"/>
         <body><![CDATA[
-          Components.utils.import("resource://calendar/modules/calUtils.jsm");
-          if (!this.mDragState) {
-              return;
-          }
-
-          let firstColumn = aFirstColumn || this;
-          let lastColumn = aLastColumn || this;
-          let realstartmin = this.mDragState.startMin + this.mStartMin;
-          let realendmin = this.mDragState.endMin + this.mStartMin;
-          let starthr = Math.floor(realstartmin / 60);
-          let startmin = realstartmin % 60;
-
-          let endhr = Math.floor(realendmin / 60);
-          let endmin = realendmin % 60;
-
-          let timeFormatter = cal.getDateFormatter();
-
-          let jsTime = new Date();
-          jsTime.setHours(starthr, startmin);
-          let startstr = timeFormatter.formatTime(cal.jsDateToDateTime(jsTime, cal.floating()));
-          jsTime.setHours(endhr, endmin);
-          let endstr = timeFormatter.formatTime(cal.jsDateToDateTime(jsTime, cal.floating()));
-
-          // Tasks without Entry or Due date have a string as first label
-          // instead of the time.
-          if (cal.isToDo(this.mDragState.dragOccurrence)) {
-              if (!this.mDragState.dragOccurrence.dueDate) {
-                  startstr = cal.calGetString("calendar", "dragLabelTasksWithOnlyEntryDate");
-              } else if (!this.mDragState.dragOccurrence.entryDate) {
-                  startstr = cal.calGetString("calendar", "dragLabelTasksWithOnlyDueDate");
-              }
-          }
-          firstColumn.fgboxes.startlabel.setAttribute("value", startstr);
-          lastColumn.fgboxes.endlabel.setAttribute("value", endstr);
+            Components.utils.import("resource://calendar/modules/calUtils.jsm");
+            if (!this.mDragState) {
+                return;
+            }
+
+            let firstColumn = aFirstColumn || this;
+            let lastColumn = aLastColumn || this;
+            let realstartmin = this.mDragState.startMin + this.mStartMin;
+            let realendmin = this.mDragState.endMin + this.mStartMin;
+            let starthr = Math.floor(realstartmin / 60);
+            let startmin = realstartmin % 60;
+
+            let endhr = Math.floor(realendmin / 60);
+            let endmin = realendmin % 60;
+
+            let timeFormatter = cal.getDateFormatter();
+
+            let jsTime = new Date();
+            jsTime.setHours(starthr, startmin);
+            let startstr = timeFormatter.formatTime(cal.jsDateToDateTime(jsTime, cal.floating()));
+            jsTime.setHours(endhr, endmin);
+            let endstr = timeFormatter.formatTime(cal.jsDateToDateTime(jsTime, cal.floating()));
+
+            // Tasks without Entry or Due date have a string as first label
+            // instead of the time.
+            if (cal.isToDo(this.mDragState.dragOccurrence)) {
+                if (!this.mDragState.dragOccurrence.dueDate) {
+                    startstr = cal.calGetString("calendar", "dragLabelTasksWithOnlyEntryDate");
+                } else if (!this.mDragState.dragOccurrence.entryDate) {
+                    startstr = cal.calGetString("calendar", "dragLabelTasksWithOnlyDueDate");
+                }
+            }
+            firstColumn.fgboxes.startlabel.setAttribute("value", startstr);
+            lastColumn.fgboxes.endlabel.setAttribute("value", endstr);
 
         ]]></body>
       </method>
 
       <method name="setDayStartEndMinutes">
         <parameter name="aDayStartMin"/>
         <parameter name="aDayEndMin"/>
         <body><![CDATA[
-          if (aDayStartMin < this.mStartMin || aDayStartMin > aDayEndMin ||
-              aDayEndMin > this.mEndMin) {
-              throw Components.results.NS_ERROR_INVALID_ARG;
-          }
-          if (this.mDayStartMin != aDayStartMin || this.mDayEndMin != aDayEndMin) {
-              this.mDayStartMin = aDayStartMin;
-              this.mDayEndMin = aDayEndMin;
-          }
+            if (aDayStartMin < this.mStartMin || aDayStartMin > aDayEndMin ||
+                aDayEndMin > this.mEndMin) {
+                throw Components.results.NS_ERROR_INVALID_ARG;
+            }
+            if (this.mDayStartMin != aDayStartMin || this.mDayEndMin != aDayEndMin) {
+                this.mDayStartMin = aDayStartMin;
+                this.mDayEndMin = aDayEndMin;
+            }
         ]]></body>
       </method>
 
       <method name="getClickedDateTime">
         <parameter name="event"/>
         <body><![CDATA[
-          let newStart = this.date.clone();
-          newStart.isDate = false;
-          newStart.hour = 0;
-
-          const ROUND_INTERVAL = 15;
-
-          let interval = this.mPixPerMin * ROUND_INTERVAL;
-          let pos;
-          if (this.getAttribute("orient") == "vertical") {
-              pos = event.screenY - this.parentNode.boxObject.screenY;
-          } else {
-              pos = event.screenX - this.parentNode.boxObject.screenX;
-          }
-          newStart.minute = (Math.round(pos / interval) * ROUND_INTERVAL) + this.mStartMin;
-          event.stopPropagation();
-          return newStart;
+            let newStart = this.date.clone();
+            newStart.isDate = false;
+            newStart.hour = 0;
+
+            const ROUND_INTERVAL = 15;
+
+            let interval = this.mPixPerMin * ROUND_INTERVAL;
+            let pos;
+            if (this.getAttribute("orient") == "vertical") {
+                pos = event.screenY - this.parentNode.boxObject.screenY;
+            } else {
+                pos = event.screenX - this.parentNode.boxObject.screenX;
+            }
+            newStart.minute = (Math.round(pos / interval) * ROUND_INTERVAL) + this.mStartMin;
+            event.stopPropagation();
+            return newStart;
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="dblclick" button="0"><![CDATA[
-        if (this.calendarView.controller) {
-            let newStart = getClickedDateTime(event);
-            this.calendarView.controller.createNewEvent(null, newStart, null);
-        }
+          if (this.calendarView.controller) {
+              let newStart = getClickedDateTime(event);
+              this.calendarView.controller.createNewEvent(null, newStart, null);
+          }
       ]]></handler>
 
       <handler event="click" button="0"><![CDATA[
-        if (!(event.ctrlKey || event.metaKey)) {
-            this.calendarView.setSelectedItems(0, []);
-            this.focus();
-        }
+          if (!(event.ctrlKey || event.metaKey)) {
+              this.calendarView.setSelectedItems(0, []);
+              this.focus();
+          }
       ]]></handler>
 
       <handler event="click" button="2"><![CDATA[
-        let newStart = getClickedDateTime(event);
-        this.calendarView.selectedDateTime = newStart;
+          let newStart = getClickedDateTime(event);
+          this.calendarView.selectedDateTime = newStart;
       ]]></handler>
 
       <!-- mouse down handler, in empty event column regions.  Starts sweeping out a new
          - event.
         -->
       <handler event="mousedown"><![CDATA[
-        // select this column
-        this.calendarView.selectedDay = this.mDate;
-
-        // If the selected calendar is readOnly, we don't want any sweeping.
-        let calendar = getSelectedCalendar();
-        if (!cal.isCalendarWritable(calendar) ||
-            calendar.getProperty("capabilities.events.supported") === false) {
-            return;
-        }
-
-        // Only start sweeping out an event if the left button was clicked
-        if (event.button != 0) {
-            return;
-        }
-
-        this.mDragState = {
-            origColumn: this,
-            dragType: "new",
-            mouseOffset: 0,
-            offset: null,
-            shadows: null,
-            limitStartMin: null,
-            limitEndMin: null,
-            jumpedColumns: 0
-        };
-
-        // snap interval: 15 minutes or 1 minute if modifier key is pressed
-        let snapIntMin = (event.shiftKey &&
-                          !event.ctrlKey &&
-                          !event.altKey &&
-                          !event.metaKey) ? 1 : 15;
-        let interval = this.mPixPerMin * snapIntMin;
-
-        if (this.getAttribute("orient") == "vertical") {
-            this.mDragState.origLoc = event.screenY;
-            this.mDragState.origMin = Math.floor((event.screenY - this.parentNode.boxObject.screenY) / interval) * snapIntMin;
-            this.mDragState.limitEndMin = this.mDragState.origMin;
-            this.mDragState.limitStartMin = this.mDragState.origMin;
-            this.fgboxes.dragspacer.setAttribute("height", this.mDragState.origMin * this.mPixPerMin);
-        } else {
-            this.mDragState.origLoc = event.screenX;
-            this.mDragState.origMin = Math.floor((event.screenX - this.parentNode.boxObject.screenX) / interval) * snapIntMin;
-            this.fgboxes.dragspacer.setAttribute("width", this.mDragState.origMin * this.mPixPerMin);
-        }
-
-        document.calendarEventColumnDragging = this;
-
-        window.addEventListener("mousemove", this.onEventSweepMouseMove);
-        window.addEventListener("mouseup", this.onEventSweepMouseUp);
-        window.addEventListener("keypress", this.onEventSweepKeypress);
+          // select this column
+          this.calendarView.selectedDay = this.mDate;
+
+          // If the selected calendar is readOnly, we don't want any sweeping.
+          let calendar = getSelectedCalendar();
+          if (!cal.isCalendarWritable(calendar) ||
+              calendar.getProperty("capabilities.events.supported") === false) {
+              return;
+          }
+
+          // Only start sweeping out an event if the left button was clicked
+          if (event.button != 0) {
+              return;
+          }
+
+          this.mDragState = {
+              origColumn: this,
+              dragType: "new",
+              mouseOffset: 0,
+              offset: null,
+              shadows: null,
+              limitStartMin: null,
+              limitEndMin: null,
+              jumpedColumns: 0
+          };
+
+          // snap interval: 15 minutes or 1 minute if modifier key is pressed
+          let snapIntMin = (event.shiftKey &&
+                            !event.ctrlKey &&
+                            !event.altKey &&
+                            !event.metaKey) ? 1 : 15;
+          let interval = this.mPixPerMin * snapIntMin;
+
+          if (this.getAttribute("orient") == "vertical") {
+              this.mDragState.origLoc = event.screenY;
+              this.mDragState.origMin = Math.floor((event.screenY - this.parentNode.boxObject.screenY) / interval) * snapIntMin;
+              this.mDragState.limitEndMin = this.mDragState.origMin;
+              this.mDragState.limitStartMin = this.mDragState.origMin;
+              this.fgboxes.dragspacer.setAttribute("height", this.mDragState.origMin * this.mPixPerMin);
+          } else {
+              this.mDragState.origLoc = event.screenX;
+              this.mDragState.origMin = Math.floor((event.screenX - this.parentNode.boxObject.screenX) / interval) * snapIntMin;
+              this.fgboxes.dragspacer.setAttribute("width", this.mDragState.origMin * this.mPixPerMin);
+          }
+
+          document.calendarEventColumnDragging = this;
+
+          window.addEventListener("mousemove", this.onEventSweepMouseMove);
+          window.addEventListener("mouseup", this.onEventSweepMouseUp);
+          window.addEventListener("keypress", this.onEventSweepKeypress);
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="calendar-header-container" extends="chrome://calendar/content/widgets/calendar-widgets.xml#dragndropContainer">
     <content xbl:inherits="selected" flex="1" class="calendar-event-column-header">
       <children/>
     </content>
 
     <implementation>
       <field name="mItemBoxes">null</field>
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-
-        this.mItemBoxes = [];
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
+
+          this.mItemBoxes = [];
       ]]></constructor>
 
       <property name="date">
         <getter><![CDATA[
-          return this.mDate;
+            return this.mDate;
         ]]></getter>
         <setter><![CDATA[
-          this.mDate = val;
-          return val;
+            this.mDate = val;
+            return val;
         ]]></setter>
       </property>
       <method name="findBoxForItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-          for (let item of this.mItemBoxes) {
-              if (aItem && item.occurrence.hasSameIds(aItem)) {
-                  // We can return directly, since there will only be one box per
-                  // item in the header.
-                  return item;
-              }
-          }
-          return null;
+            for (let item of this.mItemBoxes) {
+                if (aItem && item.occurrence.hasSameIds(aItem)) {
+                    // We can return directly, since there will only be one box per
+                    // item in the header.
+                    return item;
+                }
+            }
+            return null;
         ]]></body>
       </method>
 
       <method name="addEvent">
         <parameter name="aItem"/>
         <body><![CDATA[
-          // prevent same items being added
-          if (this.mItemBoxes.some(itemBox => itemBox.occurrence.hashId == aItem.hashId)) {
-              return;
-          }
-
-          let itemBox = createXULElement("calendar-editable-item");
-          this.appendChild(itemBox);
-          itemBox.calendarView = this.calendarView;
-          itemBox.occurrence = aItem;
-          let ctxt = this.calendarView.getAttribute("item-context") ||
-                     this.calendarView.getAttribute("context");
-          itemBox.setAttribute("context", ctxt);
-
-          if (aItem.hashId in this.calendarView.mFlashingEvents) {
-              itemBox.setAttribute("flashing", "true");
-          }
-
-          this.mItemBoxes.push(itemBox);
-          itemBox.parentBox = this;
+            // prevent same items being added
+            if (this.mItemBoxes.some(itemBox => itemBox.occurrence.hashId == aItem.hashId)) {
+                return;
+            }
+
+            let itemBox = createXULElement("calendar-editable-item");
+            this.appendChild(itemBox);
+            itemBox.calendarView = this.calendarView;
+            itemBox.occurrence = aItem;
+            let ctxt = this.calendarView.getAttribute("item-context") ||
+                       this.calendarView.getAttribute("context");
+            itemBox.setAttribute("context", ctxt);
+
+            if (aItem.hashId in this.calendarView.mFlashingEvents) {
+                itemBox.setAttribute("flashing", "true");
+            }
+
+            this.mItemBoxes.push(itemBox);
+            itemBox.parentBox = this;
         ]]></body>
       </method>
 
       <method name="deleteEvent">
         <parameter name="aItem"/>
         <body><![CDATA[
-          for (let i in this.mItemBoxes) {
-              if (this.mItemBoxes[i].occurrence.hashId == aItem.hashId) {
-                  this.mItemBoxes[i].remove();
-                  this.mItemBoxes.splice(i, 1);
-                  break;
-              }
-          }
+            for (let i in this.mItemBoxes) {
+                if (this.mItemBoxes[i].occurrence.hashId == aItem.hashId) {
+                    this.mItemBoxes[i].remove();
+                    this.mItemBoxes.splice(i, 1);
+                    break;
+                }
+            }
         ]]></body>
       </method>
 
       <method name="onDropItem">
         <parameter name="aItem"/>
         <body><![CDATA[
-         let newItem = cal.moveItem(aItem, this.mDate);
-         newItem = cal.setItemToAllDay(newItem, true);
-         return newItem;
+            let newItem = cal.moveItem(aItem, this.mDate);
+            newItem = cal.setItemToAllDay(newItem, true);
+            return newItem;
         ]]></body>
       </method>
 
       <method name="selectOccurrence">
         <parameter name="aItem"/>
         <body><![CDATA[
-          for (let itemBox of this.mItemBoxes) {
-              if (aItem && (itemBox.occurrence.hashId == aItem.hashId)) {
-                  itemBox.selected = true;
-              }
-          }
+            for (let itemBox of this.mItemBoxes) {
+                if (aItem && (itemBox.occurrence.hashId == aItem.hashId)) {
+                    itemBox.selected = true;
+                }
+            }
         ]]></body>
       </method>
       <method name="unselectOccurrence">
         <parameter name="aItem"/>
         <body><![CDATA[
-          for (let itemBox of this.mItemBoxes) {
-              if (aItem && (itemBox.occurrence.hashId == aItem.hashId)) {
-                  itemBox.selected = false;
-              }
-          }
+            for (let itemBox of this.mItemBoxes) {
+                if (aItem && (itemBox.occurrence.hashId == aItem.hashId)) {
+                    itemBox.selected = false;
+                }
+            }
         ]]></body>
       </method>
 
     </implementation>
 
     <handlers>
       <handler event="dblclick" button="0"><![CDATA[
-        this.calendarView.controller.createNewEvent(null, this.mDate, null, true);
+          this.calendarView.controller.createNewEvent(null, this.mDate, null, true);
       ]]></handler>
       <handler event="mousedown"><![CDATA[
-        this.calendarView.selectedDay = this.mDate;
+          this.calendarView.selectedDay = this.mDate;
       ]]></handler>
       <handler event="click" button="0"><![CDATA[
-        if (!(event.ctrlKey || event.metaKey)) {
-            this.calendarView.setSelectedItems(0, []);
-        }
+          if (!(event.ctrlKey || event.metaKey)) {
+              this.calendarView.setSelectedItems(0, []);
+          }
       ]]></handler>
       <handler event="click" button="2"><![CDATA[
-        let newStart = this.calendarView.selectedDay.clone();
-        newStart.isDate = true;
-        this.calendarView.selectedDateTime = newStart;
-        event.stopPropagation();
+          let newStart = this.calendarView.selectedDay.clone();
+          newStart.isDate = true;
+          this.calendarView.selectedDateTime = newStart;
+          event.stopPropagation();
       ]]></handler>
       <handler event="wheel"><![CDATA[
-        if (this.getAttribute("orient") == "vertical") {
-            // In vertical view (normal), don't let the parent multiday view
-            // handle the scrolling in its bubbling phase. The default action
-            // will make the box scroll here.
-
-            // TODO We could scroll by the height of exactly one event box, but
-            // since a normal box's boxObject doesn't implement nsIScrollBoxObject,
-            // there is no way to scroll by pixels. Using a xul:scrollbox has
-            // problems since the equalsize attribute isn't inherited by the
-            // inner box, and even if that is worked around, something makes the
-            // rotated view look bad in that case.
-            event.stopPropagation();
-        }
+          if (this.getAttribute("orient") == "vertical") {
+              // In vertical view (normal), don't let the parent multiday view
+              // handle the scrolling in its bubbling phase. The default action
+              // will make the box scroll here.
+
+              // TODO We could scroll by the height of exactly one event box, but
+              // since a normal box's boxObject doesn't implement nsIScrollBoxObject,
+              // there is no way to scroll by pixels. Using a xul:scrollbox has
+              // problems since the equalsize attribute isn't inherited by the
+              // inner box, and even if that is worked around, something makes the
+              // rotated view look bad in that case.
+              event.stopPropagation();
+          }
       ]]></handler>
     </handlers>
   </binding>
 
   <!--
      -  An individual event box, to be inserted into a column.
     -->
   <binding id="calendar-event-box" extends="chrome://calendar/content/calendar-view-core.xml#calendar-editable-item">
@@ -2300,200 +2300,200 @@
             </xul:stack>
           </xul:box>
         </xul:box>
       </xul:box>
     </content>
 
     <implementation>
       <constructor><![CDATA[
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-
-        this.orient = this.getAttribute("orient");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
+
+          this.orient = this.getAttribute("orient");
       ]]></constructor>
 
       <!-- fields -->
       <field name="mParentColumn">null</field>
 
       <!-- methods/properties -->
       <method name="setAttribute">
         <parameter name="aAttr"/>
         <parameter name="aVal"/>
         <body><![CDATA[
-          let needsrelayout = false;
-          if (aAttr == "orient") {
-              if (this.getAttribute("orient") != aVal) {
-                  needsrelayout = true;
-              }
-          }
-
-          // this should be done using lookupMethod(), see bug 286629
-          let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
-
-          if (needsrelayout) {
-              let eventbox = document.getAnonymousElementByAttribute(this, "anonid", "eventbox");
-              eventbox.setAttribute("orient", val);
-              let gb1 = document.getAnonymousElementByAttribute(this, "anonid", "gripbar1");
-              gb1.parentorient = val;
-              let gb2 = document.getAnonymousElementByAttribute(this, "anonid", "gripbar2");
-              gb2.parentorient = val;
-          }
-
-          return ret;
+            let needsrelayout = false;
+            if (aAttr == "orient") {
+                if (this.getAttribute("orient") != aVal) {
+                    needsrelayout = true;
+                }
+            }
+
+            // this should be done using lookupMethod(), see bug 286629
+            let ret = XULElement.prototype.setAttribute.call(this, aAttr, aVal);
+
+            if (needsrelayout) {
+                let eventbox = document.getAnonymousElementByAttribute(this, "anonid", "eventbox");
+                eventbox.setAttribute("orient", val);
+                let gb1 = document.getAnonymousElementByAttribute(this, "anonid", "gripbar1");
+                gb1.parentorient = val;
+                let gb2 = document.getAnonymousElementByAttribute(this, "anonid", "gripbar2");
+                gb2.parentorient = val;
+            }
+
+            return ret;
         ]]></body>
       </method>
 
       <method name="getOptimalMinSize">
         <body><![CDATA[
-          if (this.getAttribute("orient") == "vertical") {
-              let minHeight = getOptimalMinimumHeight(this.eventNameLabel) +
-                              getSummarizedStyleValues(document.getAnonymousElementByAttribute(this, "anonid", "eventbox"), ["margin-bottom", "margin-top"]) +
-                              getSummarizedStyleValues(this, ["border-bottom-width", "border-top-width"]);
-              this.setAttribute("minheight", minHeight);
-              this.setAttribute("minwidth", "1");
-              return minHeight;
-          } else {
-              this.eventNameLabel.setAttribute("style", "min-width: 2em");
-              let minWidth = getOptimalMinimumWidth(this.eventNameLabel);
-              this.setAttribute("minwidth", minWidth);
-              this.setAttribute("minheight", "1");
-              return minWidth;
-          }
+            if (this.getAttribute("orient") == "vertical") {
+                let minHeight = getOptimalMinimumHeight(this.eventNameLabel) +
+                                getSummarizedStyleValues(document.getAnonymousElementByAttribute(this, "anonid", "eventbox"), ["margin-bottom", "margin-top"]) +
+                                getSummarizedStyleValues(this, ["border-bottom-width", "border-top-width"]);
+                this.setAttribute("minheight", minHeight);
+                this.setAttribute("minwidth", "1");
+                return minHeight;
+            } else {
+                this.eventNameLabel.setAttribute("style", "min-width: 2em");
+                let minWidth = getOptimalMinimumWidth(this.eventNameLabel);
+                this.setAttribute("minwidth", minWidth);
+                this.setAttribute("minheight", "1");
+                return minWidth;
+            }
         ]]></body>
       </method>
 
       <property name="parentColumn"
         onget="return this.mParentColumn;"
         onset="return (this.mParentColumn = val);"/>
 
       <property name="startMinute" readonly="true">
         <getter><![CDATA[
-          if (!this.mOccurrence) {
-              return 0;
-          }
-          let startDate = this.mOccurrence.startDate || this.mOccurrence.entryDate;
-          return startDate.hour * 60 + startDate.minute;
+            if (!this.mOccurrence) {
+                return 0;
+            }
+            let startDate = this.mOccurrence.startDate || this.mOccurrence.entryDate;
+            return startDate.hour * 60 + startDate.minute;
         ]]></getter>
       </property>
 
       <property name="endMinute" readonly="true">
         <getter><![CDATA[
-          if (!this.mOccurrence) {
-              return 0;
-          }
-          let endDate = this.mOccurrence.endDate || this.mOccurrence.dueDate;
-          return endDate.hour * 60 + endDate.minute;
+            if (!this.mOccurrence) {
+                return 0;
+            }
+            let endDate = this.mOccurrence.endDate || this.mOccurrence.dueDate;
+            return endDate.hour * 60 + endDate.minute;
         ]]></getter>
       </property>
 
       <method name="setEditableLabel">
         <body><![CDATA[
-          let evl = this.eventNameLabel;
-          let item = this.mOccurrence;
-
-          if (item.title && item.title != "") {
-              // Use <description> textContent so it can wrap.
-              evl.textContent = item.title;
-          } else {
-              evl.textContent = cal.calGetString("calendar", "eventUntitled");
-          }
-
-          let gripbar = document.getAnonymousElementByAttribute(this, "anonid", "gripbar1").boxObject.height;
-          let height = document.getAnonymousElementByAttribute(this, "anonid", "eventbox").boxObject.height;
-          evl.setAttribute("style", "max-height: " + Math.max(0, height-gripbar * 2) + "px");
+            let evl = this.eventNameLabel;
+            let item = this.mOccurrence;
+
+            if (item.title && item.title != "") {
+                // Use <description> textContent so it can wrap.
+                evl.textContent = item.title;
+            } else {
+                evl.textContent = cal.calGetString("calendar", "eventUntitled");
+            }
+
+            let gripbar = document.getAnonymousElementByAttribute(this, "anonid", "gripbar1").boxObject.height;
+            let height = document.getAnonymousElementByAttribute(this, "anonid", "eventbox").boxObject.height;
+            evl.setAttribute("style", "max-height: " + Math.max(0, height-gripbar * 2) + "px");
         ]]></body>
       </method>
     </implementation>
 
     <handlers>
       <handler event="mousedown" button="0"><![CDATA[
-        event.stopPropagation();
-
-        if (this.mEditing) {
-            return;
-        }
-
-        this.parentColumn.calendarView.selectedDay = this.parentColumn.mDate;
-        this.mMouseX = event.screenX;
-        this.mMouseY = event.screenY;
-
-        let whichside = event.whichside;
-        if (whichside) {
-            this.calendarView.setSelectedItems(1,
-                [event.ctrlKey ? this.mOccurrence.parentItem : this.mOccurrence]);
-
-            let snapIntMin = (event.shiftKey &&
-                              !event.ctrlKey &&
-                              !event.altKey &&
-                              !event.metaKey) ? 1 : 15;
-            // start edge resize drag
-            this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, whichside,
-                                                         event.screenX, event.screenY,
-                                                         snapIntMin);
-        } else {
-            // may be click or drag,
-            // so wait for mousemove (or mouseout if fast) to start item move drag
-            this.mInMouseDown = true;
-        }
+          event.stopPropagation();
+
+          if (this.mEditing) {
+              return;
+          }
+
+          this.parentColumn.calendarView.selectedDay = this.parentColumn.mDate;
+          this.mMouseX = event.screenX;
+          this.mMouseY = event.screenY;
+
+          let whichside = event.whichside;
+          if (whichside) {
+              this.calendarView.setSelectedItems(1,
+                  [event.ctrlKey ? this.mOccurrence.parentItem : this.mOccurrence]);
+
+              let snapIntMin = (event.shiftKey &&
+                                !event.ctrlKey &&
+                                !event.altKey &&
+                                !event.metaKey) ? 1 : 15;
+              // start edge resize drag
+              this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, whichside,
+                                                           event.screenX, event.screenY,
+                                                           snapIntMin);
+          } else {
+              // may be click or drag,
+              // so wait for mousemove (or mouseout if fast) to start item move drag
+              this.mInMouseDown = true;
+          }
       ]]></handler>
 
       <handler event="mousemove"><![CDATA[
-        if (!this.mInMouseDown) {
-            return;
-        }
-
-        let deltaX = Math.abs(event.screenX - this.mMouseX);
-        let deltaY = Math.abs(event.screenY - this.mMouseY);
-        // more than a 3 pixel move?
-        if ((deltaX * deltaX + deltaY * deltaY) > 9) {
-            if (this.parentColumn) {
-                if (this.editingTimer) {
-                    clearTimeout(this.editingTimer);
-                    this.editingTimer = null;
-                }
-
-                this.calendarView.setSelectedItems(1, [this.mOccurrence]);
-
-                this.mEditing = false;
-
-                this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, "middle", this.mMouseX, this.mMouseY);
-                this.mInMouseDown = false;
-            }
-        }
+          if (!this.mInMouseDown) {
+              return;
+          }
+
+          let deltaX = Math.abs(event.screenX - this.mMouseX);
+          let deltaY = Math.abs(event.screenY - this.mMouseY);
+          // more than a 3 pixel move?
+          if ((deltaX * deltaX + deltaY * deltaY) > 9) {
+              if (this.parentColumn) {
+                  if (this.editingTimer) {
+                      clearTimeout(this.editingTimer);
+                      this.editingTimer = null;
+                  }
+
+                  this.calendarView.setSelectedItems(1, [this.mOccurrence]);
+
+                  this.mEditing = false;
+
+                  this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, "middle", this.mMouseX, this.mMouseY);
+                  this.mInMouseDown = false;
+              }
+          }
       ]]></handler>
 
       <handler event="mouseout"><![CDATA[
-        if (!this.mEditing && this.mInMouseDown && this.parentColumn) {
-            if (this.editingTimer) {
-                clearTimeout(this.editingTimer);
-                this.editingTimer = null;
-            }
-
-            this.calendarView.setSelectedItems(1, [this.mOccurrence]);
-
-            this.mEditing = false;
-
-            this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, "middle", this.mMouseX, this.mMouseY);
-            this.mInMouseDown = false;
-        }
+          if (!this.mEditing && this.mInMouseDown && this.parentColumn) {
+              if (this.editingTimer) {
+                  clearTimeout(this.editingTimer);
+                  this.editingTimer = null;
+              }
+
+              this.calendarView.setSelectedItems(1, [this.mOccurrence]);
+
+              this.mEditing = false;
+
+              this.parentColumn.startSweepingToModifyEvent(this, this.mOccurrence, "middle", this.mMouseX, this.mMouseY);
+              this.mInMouseDown = false;
+          }
       ]]></handler>
 
       <handler event="mouseup"><![CDATA[
-        if (this.mEditing) {
-            return;
-        }
-
-        this.mInMouseDown = false;
+          if (this.mEditing) {
+              return;
+          }
+
+          this.mInMouseDown = false;
       ]]></handler>
 
       <handler event="mouseover"><![CDATA[
-        if (this.calendarView && this.calendarView.controller) {
-            event.stopPropagation();
-            onMouseOverItem(event);
-        }
+          if (this.calendarView && this.calendarView.controller) {
+              event.stopPropagation();
+              onMouseOverItem(event);
+          }
       ]]></handler>
     </handlers>
   </binding>
 
   <binding id="calendar-multiday-view" extends="chrome://calendar/content/calendar-base-view.xml#calendar-base-view">
     <content flex="1" orient="vertical" xbl:inherits="context,item-context">
       <xul:box anonid="mainbox" class="multiday-view-main-box" flex="1">
         <!-- these boxes are tricky: width or height in CSS depend on orient -->
@@ -2517,143 +2517,143 @@
           <xul:box anonid="daybox" class="multiday-view-day-box" flex="1"
                    equalsize="always"/>
         </xul:scrollbox>
       </xul:box>
     </content>
 
     <implementation implements="calICalendarView">
       <constructor><![CDATA[
-        Components.utils.import("resource://gre/modules/Preferences.jsm");
-        Components.utils.import("resource://calendar/modules/calUtils.jsm");
-
-        // get day start/end hour from prefs and set on the view
-        this.setDayStartEndMinutes(Preferences.get("calendar.view.daystarthour", 8) * 60,
-                                   Preferences.get("calendar.view.dayendhour", 17) * 60);
-
-        // initially scroll to the day start hour in the view
-        this.scrollToMinute(this.mDayStartMin);
-
-        // get visible hours from prefs and set on the view
-        let visibleMinutes = Preferences.get("calendar.view.visiblehours", 9) * 60;
-        this.setVisibleMinutes(visibleMinutes);
-
-        // set the flex attribute at the scrollbox-innerbox
-        // (this can be removed, after Bug 343555 is fixed)
-        let scrollbox = document.getAnonymousElementByAttribute(
-                       this, "anonid", "scrollbox");
-        document.getAnonymousElementByAttribute(
-            scrollbox, "class", "box-inherit scrollbox-innerbox").flex = "1";
-
-        // set the time interval for the time indicator timer
-        this.setTimeIndicatorInterval(Preferences.get("calendar.view.timeIndicatorInterval", 15));
-        this.enableTimeIndicator();
-
-        this.reorient();
+          Components.utils.import("resource://gre/modules/Preferences.jsm");
+          Components.utils.import("resource://calendar/modules/calUtils.jsm");
+
+          // get day start/end hour from prefs and set on the view
+          this.setDayStartEndMinutes(Preferences.get("calendar.view.daystarthour", 8) * 60,
+                                     Preferences.get("calendar.view.dayendhour", 17) * 60);
+
+          // initially scroll to the day start hour in the view
+          this.scrollToMinute(this.mDayStartMin);
+
+          // get visible hours from prefs and set on the view
+          let visibleMinutes = Preferences.get("calendar.view.visiblehours", 9) * 60;
+          this.setVisibleMinutes(visibleMinutes);
+
+          // set the flex attribute at the scrollbox-innerbox
+          // (this can be removed, after Bug 343555 is fixed)
+          let scrollbox = document.getAnonymousElementByAttribute(
+                         this, "anonid", "scrollbox");
+          document.getAnonymousElementByAttribute(
+              scrollbox, "class", "box-inherit scrollbox-innerbox").flex = "1";
+
+          // set the time interval for the time indicator timer
+          this.setTimeIndicatorInterval(Preferences.get("calendar.view.timeIndicatorInterval", 15));
+          this.enableTimeIndicator();
+
+          this.reorient();
       ]]></constructor>
 
       <property name="daysInView" readonly="true">
         <getter><![CDATA[
-          return this.labeldaybox.childNodes && this.labeldaybox.childNodes.length;
+            return this.labeldaybox.childNodes && this.labeldaybox.childNodes.length;
         ]]></getter>
       </property>
 
       <property name="supportsZoom" readonly="true"
                 onget="return true;"/>
       <property name="supportsRotation" readonly="true"
                 onget="return true"/>
 
       <method name="setTimeIndicatorInterval">
         <parameter name="aPrefInterval"/>
         <body><![CDATA[
-          // If the preference just edited by the user is outside the valid
-          // range [0, 1440], we change it into the nearest limit (0 or 1440).
-          let newTimeInterval = Math.max(0, Math.min(1440, aPrefInterval));
-          if (newTimeInterval != aPrefInterval) {
-              Preferences.set("calendar.view.timeIndicatorInterval", newTimeInterval);
-          }
-
-          if (newTimeInterval != this.mTimeIndicatorInterval) {
-              this.mTimeIndicatorInterval = newTimeInterval;
-          }
-          if (this.mTimeIndicatorInterval == 0) {
-              timeIndicator.cancel();
-          }
+            // If the preference just edited by the user is outside the valid
+            // range [0, 1440], we change it into the nearest limit (0 or 1440).
+            let newTimeInterval = Math.max(0, Math.min(1440, aPrefInterval));
+            if (newTimeInterval != aPrefInterval) {
+                Preferences.set("calendar.view.timeIndicatorInterval", newTimeInterval);
+            }
+
+            if (newTimeInterval != this.mTimeIndicatorInterval) {
+                this.mTimeIndicatorInterval = newTimeInterval;
+            }
+            if (this.mTimeIndicatorInterval == 0) {
+                timeIndicator.cancel();
+            }
         ]]></body>
       </method>
 
       <method name="enableTimeIndicator">
         <body><![CDATA[
-          // Hide or show the time indicator if the preference becomes 0 or greater than 0.
-          let hideIndicator = this.mTimeIndicatorInterval == 0;
-          setBooleanAttribute(this.timeBarTimeIndicator, "hidden", hideIndicator);
-          let todayColumn = this.findColumnForDate(this.today());
-          if (todayColumn) {
-              setBooleanAttribute(todayColumn.column.timeIndicatorBox, "hidden", hideIndicator);
-          }
-          // Update the timer but only under some circumstances, otherwise
-          // it will update the wrong view or it will start without need.
-          let currentMode = document.getElementById("modeBroadcaster").getAttribute("mode");
-          let currView = currentView().type;
-          if (currentMode == "calendar" && currView == this.type && !hideIndicator &&
-              (currView == "day" || currView == "week")) {
-              this.updateTimeIndicatorPosition(true);
-          }
+            // Hide or show the time indicator if the preference becomes 0 or greater than 0.
+            let hideIndicator = this.mTimeIndicatorInterval == 0;
+            setBooleanAttribute(this.timeBarTimeIndicator, "hidden", hideIndicator);
+            let todayColumn = this.findColumnForDate(this.today());
+            if (todayColumn) {
+                setBooleanAttribute(todayColumn.column.timeIndicatorBox, "hidden", hideIndicator);
+            }
+            // Update the timer but only under some circumstances, otherwise
+            // it will update the wrong view or it will start without need.
+            let currentMode = document.getElementById("modeBroadcaster").getAttribute("mode");
+            let currView = currentView().type;
+            if (currentMode == "calendar" && currView == this.type && !hideIndicator &&
+                (currView == "day" || currView == "week")) {
+                this.updateTimeIndicatorPosition(true);
+            }
         ]]></body>
       </method>
 
       <method name="updateTimeIndicatorPosition">
         <parameter name="aUpdateTheTimer"/>
         <parameter name="aPpmChanged"/>
         <parameter name="aViewChanged"/>
         <body><![CDATA[
-          let now = cal.now();
-          let nowMinutes = now.hour * 60 + now.minute;
-          if (aUpdateTheTimer) {
-              let prefInt = this.mTimeIndicatorInterval;
-              if (prefInt == 0) {
-                  timeIndicator.cancel();
-                  return;
-              }
-
-              // Increase the update interval if pixels per minute is small.
-              let oldPrefInt = prefInt;
-              if (aPpmChanged && this.mPixPerMin < 0.6) {
-                  prefInt = Math.round(prefInt / this.mPixPerMin);
-              }
-              if (!aPpmChanged || aViewChanged || oldPrefInt != prefInt) {
-                  // Synchronize the timer with a multiple of the interval.
-                  let firstInterval = (prefInt - nowMinutes % prefInt) * 60 - now.second;
-                  if (timeIndicator.timer) {
-                      timeIndicator.cancel();
-                  }
-                  timeIndicator.lastView = this.id;
-                  timeIndicator.timer = setTimeout(() => {
-                      this.updateTimeIndicatorPosition(false);
-                      timeIndicator.start(prefInt * 60, this);
-                  }, firstInterval * 1000);
-
-                  // Set the time for the first positioning of the indicator.
-                  let time = Math.floor(nowMinutes / prefInt) * prefInt;
-                  document.getElementById("day-view").mTimeIndicatorMinutes = time;
-                  document.getElementById("week-view").mTimeIndicatorMinutes = time;
-              }
-          } else if (aUpdateTheTimer === false) {
-              // Set the time for every positioning after the first
-              document.getElementById("day-view").mTimeIndicatorMinutes = nowMinutes;
-              document.getElementById("week-view").mTimeIndicatorMinutes = nowMinutes;
-          }
-          // Update the position of the indicator.
-          let position = Math.round(this.mPixPerMin * this.mTimeIndicatorMinutes) - 1;
-          let posAttr = (this.orient == "vertical" ? "top: " : "left: ");
-          this.timeBarTimeIndicator.setAttribute("style", posAttr + position + "px;");
-          let todayColumn = this.findColumnForDate(this.today());
-          if (todayColumn) {
-              todayColumn.column.timeIndicatorBox.setAttribute("style", "margin-" + posAttr + position + "px;");
-          }
+            let now = cal.now();
+            let nowMinutes = now.hour * 60 + now.minute;
+            if (aUpdateTheTimer) {
+                let prefInt = this.mTimeIndicatorInterval;
+                if (prefInt == 0) {
+                    timeIndicator.cancel();
+                    return;
+                }
+
+                // Increase the update interval if pixels per minute is small.
+                let oldPrefInt = prefInt;
+                if (aPpmChanged && this.mPixPerMin < 0.6) {
+                    prefInt = Math.round(prefInt / this.mPixPerMin);
+                }
+                if (!aPpmChanged || aViewChanged || oldPrefInt != prefInt) {
+                    // Synchronize the timer with a multiple of the interval.
+                    let firstInterval = (prefInt - nowMinutes % prefInt) * 60 - now.second;
+                    if (timeIndicator.timer) {
+                        timeIndicator.cancel();
+                    }
+                    timeIndicator.lastView = this.id;
+                    timeIndicator.timer = setTimeout(() => {
+                        this.updateTimeIndicatorPosition(false);
+                        timeIndicator.start(prefInt * 60, this);
+                    }, firstInterval * 1000);
+
+                    // Set the time for the first positioning of the indicator.
+                    let time = Math.floor(nowMinutes / prefInt) * prefInt;
+                    document.getElementById("day-view").mTimeIndicatorMinutes = time;
+                    document.getElementById("week-view").mTimeIndicatorMinutes = time;
+                }
+            } else if (aUpdateTheTimer === false) {
+                // Set the time for every positioning after the first
+                document.getElementById("day-view").mTimeIndicatorMinutes = nowMinutes;
+                document.getElementById("week-view").mTimeIndicatorMinutes = nowMinutes;
+            }
+            // Update the position of the indicator.
+            let position = Math.round(this.mPixPerMin * this.mTimeIndicatorMinutes) - 1;
+            let posAttr = (this.orient == "vertical" ? "top: " : "left: ");
+            this.timeBarTimeIndicator.setAttribute("style", posAttr + position + "px;");
+            let todayColumn = this.findColumnForDate(this.today());
+            if (todayColumn) {
+                todayColumn.column.timeIndicatorBox.setAttribute("style", "margin-" + posAttr + position + "px;");
+            }
         ]]></body>
       </method>
 
       <method name="handlePreference">
         <parameter name="aSubject"/>
         <parameter name="aTopic"/>
         <parameter name="aPreference"/>
         <body><![CDATA[
@@ -2687,45 +2687,45 @@
                     break;
             }
         ]]></body>
       </method>
 
       <method name="onResize">
         <parameter name="aRealSelf"/>
         <body><![CDATA[
-          let self = aRealSelf || this; // eslint-disable-line consistent-this
-          let isARelayout = !aRealSelf;
-          let scrollbox = document.getAnonymousElementByAttribute(self, "anonid", "scrollbox");
-          let size;
-          if (self.orient == "horizontal") {
-              size = scrollbox.boxObject.width;
-          } else {
-              size = scrollbox.boxObject.height;
-          }
-          let ppm = size / self.mVisibleMinutes;
-          ppm = Math.floor(ppm * 1000) / 1000;
-          if (ppm < self.mMinPixelsPerMinute) {
-              ppm = self.mMinPixelsPerMinute;
-          }
-          let ppmChanged = (self.pixelsPerMinute != ppm);
-          self.pixelsPerMinute = ppm;
-          setTimeout(() => self.scrollToMinute(self.mFirstVisibleMinute), 0);
-
-          // Fit the weekday labels while scrolling.
-          self.adjustWeekdayLength(self.getAttribute("orient") == "horizontal");
-
-          // Adjust the time indicator position and the related timer.
-          if (this.mTimeIndicatorInterval != 0) {
-              let viewChanged = isARelayout && (timeIndicator.lastView != this.id);
-              let currentMode = document.getElementById("modeBroadcaster").getAttribute("mode");
-              if (currentMode == "calendar" && (!timeIndicator.timer || ppmChanged || viewChanged)) {
-                  self.updateTimeIndicatorPosition(true, ppmChanged, viewChanged);
-              }
-          }
+            let self = aRealSelf || this; // eslint-disable-line consistent-this
+            let isARelayout = !aRealSelf;
+            let scrollbox = document.getAnonymousElementByAttribute(self, "anonid", "scrollbox");
+            let size;
+            if (self.orient == "horizontal") {
+                size = scrollbox.boxObject.width;
+            } else {
+                size = scrollbox.boxObject.height;
+            }
+            let ppm = size / self.mVisibleMinutes;
+            ppm = Math.floor(ppm * 1000) / 1000;
+            if (ppm < self.mMinPixelsPerMinute) {
+                ppm = self.mMinPixelsPerMinute;
+            }
+            let ppmChanged = (self.pixelsPerMinute != ppm);
+            self.pixelsPerMinute = ppm;
+            setTimeout(() => self.scrollToMinute(self.mFirstVisibleMinute), 0);
+
+            // Fit the weekday labels while scrolling.
+            self.adjustWeekdayLength(self.getAttribute("orient") == "horizontal");
+
+            // Adjust the time indicator position and the related timer.
+            if (this.mTimeIndicatorInterval != 0) {
+                let viewChanged = isARelayout && (timeIndicator.lastView != this.id);
+                let currentMode = document.getElementById("modeBroadcaster").getAttribute("mode");
+                if (currentMode == "calendar" && (!timeIndicator.timer || ppmChanged || viewChanged)) {
+                    self.updateTimeIndicatorPosition(true, ppmChanged, viewChanged);
+                }
+            }
         ]]></body>
       </method>
 
       <!-- mDateList will always be sorted before being set -->
       <field name="mDateList">null</field>
       <!-- array of { date: calIDatetime, column: colbox, header: hdrbox }  -->
       <field name="mDateColumns">null</field>
       <field name="mPixPerMin">0.6</field>
@@ -2741,1151 +2741,1151 @@
       <field name="mTimeIndicatorInterval">15</field>
       <field name="mModeHandler">null</field>
       <field name="mTimeIndicatorMinutes">0</field>
 
       <method name="flashAlarm">
         <parameter name="aAlarmItem"/>
         <parameter name="aStop"/>
         <body><![CDATA[
-          // Helper function to save some duplicate code
-          function setFlashingAttribute(aBox) {
-              if (aStop) {
-                  aBox.removeAttribute("flashing");
-              } else {
-                  aBox.setAttribute("flashing", "true");
-              }
-          }
-
-          let showIndicator = Preferences.get("calendar.alarms.indicator.show", true);
-          let totaltime = Preferences.get("calendar.alarms.indicator.totaltime", 3600);
-
-          if (!aStop && (!showIndicator || totaltime < 1)) {
-              // No need to animate if the indicator should not be shown.
-              return;
-          }
-
-
-          // Make sure the flashing attribute is set or reset on all visible
-          // boxes.
-          let columns = this.findColumnsForItem(aAlarmItem);
-          for (let col of columns) {
-              let box = col.column.findChunkForOccurrence(aAlarmItem);
-              if (box && box.eventbox) {
-                  setFlashingAttribute(box.eventbox);
-              }
-              box = col.header.findBoxForItem(aAlarmItem);
-              if (box) {
-                  setFlashingAttribute(box);
-              }
-          }
-
-          if (aStop) {
-              // We are done flashing, prevent newly created event boxes from flashing.
-              delete this.mFlashingEvents[aAlarmItem.hashId];
-          } else {
-              // Set up a timer to stop the flashing after the total time.
-              this.mFlashingEvents[aAlarmItem.hashId] = aAlarmItem;
-              setTimeout(() => this.flashAlarm(aAlarmItem, true), totaltime);
-          }
+            // Helper function to save some duplicate code
+            function setFlashingAttribute(aBox) {
+                if (aStop) {
+                    aBox.removeAttribute("flashing");
+                } else {
+                    aBox.setAttribute("flashing", "true");
+                }
+            }
+
+            let showIndicator = Preferences.get("calendar.alarms.indicator.show", true);
+            let totaltime = Preferences.get("calendar.alarms.indicator.totaltime", 3600);
+
+            if (!aStop && (!showIndicator || totaltime < 1)) {
+                // No need to animate if the indicator should not be shown.
+                return;
+            }
+
+
+            // Make sure the flashing attribute is set or reset on all visible
+            // boxes.
+            let columns = this.findColumnsForItem(aAlarmItem);
+            for (let col of columns) {
+                let box = col.column.findChunkForOccurrence(aAlarmItem);
+                if (box && box.eventbox) {
+                    setFlashingAttribute(box.eventbox);
+                }
+                box = col.header.findBoxForItem(aAlarmItem);
+                if (box) {
+                    setFlashingAttribute(box);
+                }
+            }
+
+            if (aStop) {
+                // We are done flashing, prevent newly created event boxes from flashing.
+                delete this.mFlashingEvents[aAlarmItem.hashId];
+            } else {
+                // Set up a timer to stop the flashing after the total time.
+                this.mFlashingEvents[aAlarmItem.hashId] = aAlarmItem;
+                setTimeout(() => this.flashAlarm(aAlarmItem, true), totaltime);
+            }
         ]]></body>
       </method>
 
       <!-- calICalendarView -->
       <property name="supportsDisjointDates"
         onget="return true"/>
       <property name="hasDisjointDates"
         onget="return (this.mDateList != null);"/>
 
       <property name="startDate">
         <getter><![CDATA[
-          if (this.mStartDate) {
-              return this.mStartDate;
-          } else if (this.mDateList && this.mDateList.length > 0) {
-              return this.mDateList[0];
-          } else {
-              return null;
-          }
+            if (this.mStartDate) {
+                return this.mStartDate;
+            } else if (this.mDateList && this.mDateList.length > 0) {
+                return this.mDateList[0];
+            } else {
+                return null;
+            }
         ]]></getter>
       </property>
 
       <property name="endDate">
         <getter><![CDATA[
-          if (this.mEndDate) {
-              return this.mEndDate;
-          } else if (this.mDateList && this.mDateList.length > 0) {
-              return this.mDateList[this.mDateList.length - 1];
-          } else {
-              return null;
-          }
+            if (this.mEndDate) {
+                return this.mEndDate;
+            } else if (this.mDateList && this.mDateList.length > 0) {
+                return this.mDateList[this.mDateList.length - 1];
+            } else {
+                return null;
+            }
         ]]></getter>
       </property>
 
       <method name="showDate">
         <parameter name="aDate"/>
         <body><![CDATA[
-          let targetDate = aDate.getInTimezone(this.mTimezone);
-          targetDate.isDate = true;
-
-          if (this.mStartDate && this.mEndDate) {
-              if (this.mStartDate.compare(targetDate) <= 0 &&
-                  this.mEndDate.compare(targetDate) >= 0) {
-                  return;
-              }
-          } else if (this.mDateList) {
-              for (let date of this.mDateList) {
-                  // if date is already visible, nothing to do
-                  if (date.compare(targetDate) == 0) {
-                      return;
-                  }
-              }
-          }
-
-          // if we're only showing one date, then continue
-          // to only show one date; otherwise, show the week.
-          if (this.numVisibleDates == 1) {
-              this.setDateRange(aDate, aDate);
-          } else {
-              this.setDateRange(aDate.startOfWeek, aDate.endOfWeek);
-          }
-
-          this.selectedDay = targetDate;
+            let targetDate = aDate.getInTimezone(this.mTimezone);
+            targetDate.isDate = true;
+
+            if (this.mStartDate && this.mEndDate) {
+                if (this.mStartDate.compare(targetDate) <= 0 &&
+                    this.mEndDate.compare(targetDate) >= 0) {
+                    return;
+                }
+            } else if (this.mDateList) {
+                for (let date of this.mDateList) {
+                    // if date is already visible, nothing to do
+                    if (date.compare(targetDate) == 0) {
+                        return;
+                    }
+                }
+            }
+
+            // if we're only showing one date, then continue
+            // to only show one date; otherwise, show the week.
+            if (this.numVisibleDates == 1) {
+                this.setDateRange(aDate, aDate);
+            } else {
+                this.setDateRange(aDate.startOfWeek, aDate.endOfWeek);
+            }
+
+            this.selectedDay = targetDate;
         ]]></body>
       </method>
 
       <method name="setDateRange">
         <parameter name="aStartDate"/>
         <parameter name="aEndDate"/>
         <body><![CDATA[
-          this.rangeStartDate = aStartDate;
-          this.rangeEndDate = aEndDate;
-
-          let viewStart = aStartDate.getInTimezone(this.mTimezone);
-          let viewEnd = aEndDate.getInTimezone(this.mTimezone);
-
-          viewStart.isDate = true;
-          viewStart.makeImmutable();
-          viewEnd.isDate = true;
-          viewEnd.makeImmutable();
-          this.mStartDate = viewStart;
-          this.mEndDate = viewEnd;
-
-          // goToDay are called when toggle the values below. The attempt to fix
-          // Bug 872063 has modified the behavior of setDateRange, which doesn't
-          // always refresh the view anymore. That is not the expected behavior
-          // by goToDay. Add checks here to determine if the view need to be
-          // refreshed.
-
-          // First, check values of tasksInView, workdaysOnly, showCompleted.
-          // Their status will determine the value of toggleStatus, which is
-          // saved to this.mToggleStatus during last call to relayout()
-          let toggleStatus = 0;
-
-          if (this.mTasksInView) {
-              toggleStatus |= this.mToggleStatusFlag.TasksInView;
-          }
-          if (this.mWorkdaysOnly) {
-              toggleStatus |= this.mToggleStatusFlag.WorkdaysOnly;
-          }
-          if (this.mShowCompleted) {
-              toggleStatus |= this.mToggleStatusFlag.ShowCompleted;
-          }
-
-          // Update the navigation bar only when changes are related to the current view.
-          if (this.isVisible()) {
-              cal.navigationBar.setDateRange(viewStart, viewEnd);
-          }
-
-          // Check whether view range has been changed since last call to
-          // relayout()
-          if (!this.mViewStart || !this.mViewEnd ||
-              this.mViewEnd.compare(viewEnd) != 0 ||
-              this.mViewStart.compare(viewStart) != 0 ||
-              this.mToggleStatus != toggleStatus) {
-              this.refresh();
-          }
+            this.rangeStartDate = aStartDate;
+            this.rangeEndDate = aEndDate;
+
+            let viewStart = aStartDate.getInTimezone(this.mTimezone);
+            let viewEnd = aEndDate.getInTimezone(this.mTimezone);
+
+            viewStart.isDate = true;
+            viewStart.makeImmutable();
+            viewEnd.isDate = true;
+            viewEnd.makeImmutable();
+            this.mStartDate = viewStart;
+            this.mEndDate = viewEnd;
+
+            // goToDay are called when toggle the values below. The attempt to fix
+            // Bug 872063 has modified the behavior of setDateRange, which doesn't
+            // always refresh the view anymore. That is not the expected behavior
+            // by goToDay. Add checks here to determine if the view need to be
+            // refreshed.
+
+            // First, check values of tasksInView, workdaysOnly, showCompleted.
+            // Their status will determine the value of toggleStatus, which is
+            // saved to this.mToggleStatus during last call to relayout()
+            let toggleStatus = 0;
+
+            if (this.mTasksInView) {
+                toggleStatus |= this.mToggleStatusFlag.TasksInView;
+            }
+            if (this.mWorkdaysOnly) {
+                toggleStatus |= this.mToggleStatusFlag.WorkdaysOnly;
+            }
+            if (this.mShowCompleted) {
+                toggleStatus |= this.mToggleStatusFlag.ShowCompleted;
+            }
+
+            // Update the navigation bar only when changes are related to the current view.
+            if (this.isVisible()) {
+                cal.navigationBar.setDateRange(viewStart, viewEnd);
+            }
+
+            // Check whether view range has been changed since last call to
+            // relayout()
+            if (!this.mViewStart || !this.mViewEnd ||
+                this.mViewEnd.compare(viewEnd) != 0 ||
+                this.mViewStart.compare(viewStart) != 0 ||
+                this.mToggleStatus != toggleStatus) {
+                this.refresh();
+            }
         ]]></body>
       </method>
 
       <method name="getDateList">
         <parameter name="aCount"/>
         <body><![CDATA[
-          let dates = [];
-          if (this.mStartDate && this.mEndDate) {
-              let date = this.mStartDate.clone();
-              while (date.compare(this.mEndDate) <= 0) {
-                  dates.push(d.clone());
-                  date.day += 1;
-              }
-          } else if (this.mDateList) {
-              for (let date of this.mDateList) {
-                  dates.push(date.clone());
-              }
-          }
-
-          aCount.value = dates.length;
-          return dates;
+            let dates = [];
+            if (this.mStartDate && this.mEndDate) {
+                let date = this.mStartDate.clone();
+                while (date.compare(this.mEndDate) <= 0) {
+                    dates.push(d.clone());
+                    date.day += 1;
+                }
+            } else if (this.mDateList) {
+                for (let date of this.mDateList) {
+                    dates.push(date.clone());
+                }
+            }
+
+            aCount.value = dates.length;
+            return dates;
         ]]></body>
       </method>
 
       <property name="selectedDateTime">
         <getter><![CDATA[
-          return this.mClickedTime;
+            return this.mClickedTime;
         ]]></getter>
         <setter><![CDATA[
-          this.mClickedTime = val;
+            this.mClickedTime = val;
         ]]></setter>
       </property>
 
       <property name="selectedDay">
         <getter><![CDATA[
-          let selected;
-          if (this.numVisibleDates == 1) {
-              selected = this.mDateColumns[0].date;
-          } else if (this.mSelectedDay) {
-              selected = this.mSelectedDay;
-          } else if (this.mSelectedDayCol) {
-              selected = this.mSelectedDayCol.date;
-          }
-
-          // TODO Make sure the selected day is valid
-          // TODO select now if it is in the range?
-          return selected;
+            let selected;
+            if (this.numVisibleDates == 1) {
+                selected = this.mDateColumns[0].date;
+            } else if (this.mSelectedDay) {
+                selected = this.mSelectedDay;
+            } else if (this.mSelectedDayCol) {
+                selected = this.mSelectedDayCol.date;
+            }
+
+            // TODO Make sure the selected day is valid
+            // TODO select now if it is in the range?
+            return selected;
         ]]></getter>
         <setter><![CDATA[
-          // ignore if just 1 visible, it's always selected,
-          // but we don't indicate it
-          if (this.numVisibleDates == 1) {
-              this.fireEvent("dayselect", val);
-              return val;
-          }
-
-          if (this.mSelectedDayCol) {
-              this.mSelectedDayCol.column.selected = false;
-              this.mSelectedDayCol.header.removeAttribute("selected");
-          }
-
-          if (val) {
-              this.mSelectedDayCol = this.findColumnForDate(val);
-              if (this.mSelectedDayCol) {
-                  this.mSelectedDay = this.mSelectedDayCol.date;
-                  this.mSelectedDayCol.column.selected = true;
-                  this.mSelectedDayCol.header.setAttribute("selected", "true");
-              } else {
-                  this.mSelectedDay = val;
-              }
-          }
-          this.fireEvent("dayselect", val);
-          return val;
+            // ignore if just 1 visible, it's always selected,
+            // but we don't indicate it
+            if (this.numVisibleDates == 1) {
+                this.fireEvent("dayselect", val);
+                return val;
+            }
+
+            if (this.mSelectedDayCol) {
+                this.mSelectedDayCol.column.selected = false;
+                this.mSelectedDayCol.header.removeAttribute("selected");
+            }
+
+            if (val) {
+                this.mSelectedDayCol = this.findColumnForDate(val);
+                if (this.mSelectedDayCol) {
+                    this.mSelectedDay = this.mSelectedDayCol.date;
+                    this.mSelectedDayCol.column.selected = true;
+                    this.mSelectedDayCol.header.setAttribute("selected", "true");
+                } else {
+                    this.mSelectedDay = val;
+                }
+            }
+            this.fireEvent("dayselect", val);
+            return val;
         ]]></setter>
       </property>
 
       <method name="getSelectedItems">
         <parameter name="aCount"/>
         <body><![CDATA[
-          aCount.value = this.mSelectedItems.length;
-          return this.mSelectedItems;
+            aCount.value = this.mSelectedItems.length;
+            return this.mSelectedItems;
         ]]></body>
       </method>
       <method name="setSelectedItems">
         <parameter name="aCount"/>
         <parameter name="aItems"/>
         <parameter name="aSuppressEvent"/>
         <body><![CDATA[
-          if (this.mSelectedItems) {
-              for (let item of this.mSelectedItems) {
-                  for (let occ of this.getItemOccurrencesInView(item)) {
-                      let cols = this.findColumnsForItem(occ);
-                      for (let col of cols) {
-                          col.header.unselectOccurrence(occ);
-                          col.column.unselectOccurrence(occ);
-                      }
-                  }
-              }
-          }
-          this.mSelectedItems = aItems || [];
-
-          for (let item of this.mSelectedItems) {
-              for (let occ of this.getItemOccurrencesInView(item)) {
-                  let cols = this.findColumnsForItem(occ);
-                  if (cols.length > 0) {
-                      let start = item.startDate || item.entryDate || item.dueDate;
-                      for (let col of cols) {
-                          if (start.isDate) {
-                              col.header.selectOccurrence(occ);
-                          } else {
-                              col.column.selectOccurrence(occ);
-                          }
-                      }
-                  }
-              }
-          }
-
-          if (!aSuppressEvent) {
-              this.fireEvent("itemselect", this.mSelectedItems);
-          }
+            if (this.mSelectedItems) {
+                for (let item of this.mSelectedItems) {
+                    for (let occ of this.getItemOccurrencesInView(item)) {
+                        let cols = this.findColumnsForItem(occ);
+                        for (let col of cols) {
+                            col.header.unselectOccurrence(occ);
+                            col.column.unselectOccurrence(occ);
+                        }
+                    }
+                }
+            }
+            this.mSelectedItems = aItems || [];
+
+            for (let item of this.mSelectedItems) {
+                for (let occ of this.getItemOccurrencesInView(item)) {
+                    let cols = this.findColumnsForItem(occ);
+                    if (cols.length > 0) {
+                        let start = item.startDate || item.entryDate || item.dueDate;
+                        for (let col of cols) {
+                            if (start.isDate) {
+                                col.header.selectOccurrence(occ);
+                            } else {
+                                col.column.selectOccurrence(occ);
+                            }
+                        }
+                    }
+                }
+            }
+
+            if (!aSuppressEvent) {
+                this.fireEvent("itemselect", this.mSelectedItems);
+            }
         ]]></body>
       </method>
 
       <method name="getItemOccurrencesInView">
         <parameter name="aItem"/>
         <body><![CDATA[
-          if (aItem.recurrenceInfo && aItem.recurrenceStartDate) {
-              // if selected a parent item, show occurrence(s) in view range
-              return aItem.getOccurrencesBetween(this.startDate, this.queryEndDate, {}, 0);
-          } else if (aItem.recurrenceStartDate) {
-              return [aItem];
-          } else { // undated todo
-              return [];
-          }
+            if (aItem.recurrenceInfo && aItem.recurrenceStartDate) {
+                // if selected a parent item, show occurrence(s) in view range
+                return aItem.getOccurrencesBetween(this.startDate, this.queryEndDate, {}, 0);
+            } else if (aItem.recurrenceStartDate) {
+                return [aItem];
+            } else { // undated todo
+                return [];
+            }
         ]]></body>
       </method>
 
       <method name="centerSelectedItems">
         <body><![CDATA[
-          let displayTZ = cal.calendarDefaultTimezone();
-          let lowMinute = 24 * 60;
-          let highMinute = 0;
-
-          for (let item of this.mSelectedItems) {
-              let startDateProperty = cal.calGetStartDateProp(item);
-              let endDateProperty = cal.calGetEndDateProp(item);
-
-              let occs = [];
-              if (item.recurrenceInfo) {
-                  // if selected a parent item, show occurrence(s) in view range
-                  occs = item.getOccurrencesBetween(this.startDate, this.queryEndDate, {}, 0);
-              } else {
-                  occs = [item];
-              }
-
-              for (let occ of occs) {
-                  let occStart = occ[startDateProperty];
-                  let occEnd = occ[endDateProperty];
-                  // must have at least one of start or end
-                  if (!occStart && !occEnd) {
-                      continue; // task with no dates
-                  }
-
-                  // if just has single datetime, treat as zero duration item
-                  // (such as task with due dat