See ChangeLog

Monotone-Parent: eb22f4d3b368a79ce56bcad18f9f176fff0cb73c
Monotone-Revision: 157670819f732591d0987b295faeb89c843803db

Monotone-Author: flachapelle@inverse.ca
Monotone-Date: 2012-09-07T19:46:49
Monotone-Branch: ca.inverse.sogo

UI/WebServerResources/ContactsUI.css

@@ -103,24 +103,17 @@ TABLE.titletable TD.titlecell SELECT
 
 DIV#contactFoldersList
 { position: absolute;
-  top: 84px;
+  top: 82px;
   left: 0px;
   width: 15em;
+  background-color: #CCDDEC;
   bottom: 0px;
   margin: 0px;
   padding: 0px;
   overflow: hidden; }
 
-DIV#smallToolbarContainer
-{ height: 50px;
-  margin: 0px 2px; }
-
-DIV#smallToolbarContainer > .tabs
-{ margin: 0px 2px;
-  height: 40px; }
-
 DIV#abToolbar
-{ height: 38px; }
+{ padding-left: 6px; }
 
 SPAN.toolbarButton
 { float: none;
@@ -130,27 +123,15 @@ A.toolbarButton
 { text-decoration: none; }
 
 UL#contactFolders
-{ display: block;
-  list-style-type: none;
+{ list-style-type: none;
   list-style-image: none;
-  clear: both;
+  clear: left;
   cursor: default;
   color: #000;
-  background: #CCDDEC;
-  position: absolute; /* required for Safari & IE */
-  top: 68px; /* leave space for the mini addressbook */
-  bottom: 0px;
-  left: 0;
-  right: 0;
-  width: auto;
   margin: 0px;
   padding: 0px;
   overflow: auto;
   overflow-x: hidden;
-  border-top: 1px solid #909090;
-  border-left: 1px solid #909090;
-  border-bottom: 1px solid #FFFFFF;
-  border-right: 1px solid #FFFFFF;
   -moz-user-select: none;
   -khtml-user-select: none;
 }
@@ -158,11 +139,10 @@ UL#contactFolders
 UL#contactFolders LI
 {
     background-repeat: no-repeat;
-    background-position: 4px 2px;
+    background-position: 14px 2px;
     cursor: pointer;
-    line-height: 20px;
-    height: 20px;
-    padding-left: 22px;
+    line-height: 2em;
+    padding-left: 34px;
     margin: 0px;
     width: auto;
     white-space: nowrap;
@@ -334,10 +314,6 @@ SPAN.photoFrame:hover {
   -webkit-transform: scale(3.0, 3.0) rotate(0deg) translate(33%, 33%);
   -ms-transform: rotate(0deg) scale(3.0, 3.0); }
 
-SPAN.photoFrame:hover IMG.contactPhoto
-{ 
-  }
-
 /* drag handles */
 DIV#dragHandle
 { cursor: e-resize;

UI/WebServerResources/ContactsUI.js

@@ -1319,10 +1319,8 @@ function initContacts(event) {
         configureSelectionButtons();
     }
 
-    var tabsContainer = $("smallToolbarContainer");
-    if (tabsContainer) {
-        var controller = new SOGoTabsController();
-        controller.attachToTabsContainer(tabsContainer);
+    var foldersList = $("contactFoldersList");
+    if (foldersList) {
         configureAbToolbar();
 
         // Addressbook import form

UI/WebServerResources/HTMLTableElement.js

@@ -8,6 +8,9 @@ Element.addMethods({
       
       return $(tbody).getSelectedNodes();
     }
+    else if (element.tagName == 'TBODY') {
+        return element.getSelectedNodes();
+    }
     else if (element.tagName == 'UL') {
       return element.getSelectedNodes();
     }

UI/WebServerResources/SOGoTabsController.js

@@ -83,17 +83,20 @@ SOGoTabsController.prototype = {
                     currentNode.observe("mousedown",
                                         this.onTabMouseDownBound, false);
                     currentNode.observe("click", this.onTabClickBound, false);
+                    if (currentNode.hasClassName("active"))
+                        this.activeTab = currentNode;
                     //$(currentNode.getAttribute("target")).hide();
                 }
 
                 this.firstTab.addClassName("first");
-                this.firstTab.addClassName("active");
-                this.activeTab = this.firstTab;
-
+                if (this.activeTab == null) {
+                    this.activeTab = this.firstTab;
+                    this.activeTab.addClassName("active");
+                }
                 var last = nodes.length - 1;
                 this.lastTab = $(nodes[last]);
 
-                var target = $(this.firstTab.getAttribute("target"));
+                var target = $(this.activeTab.getAttribute("target"));
                 target.addClassName("active");
             }
             this.onWindowResizeBound = this.onWindowResize.bindAsEventListener(this);
@@ -141,6 +144,7 @@ SOGoTabsController.prototype = {
             this.activeTab = $(clickedTab);
             this.activeTab.addClassName("active"); // current LI
             content.addClassName("active");
+            this.activeTab.fire("tabs:click", content.id);
 
             // Prototype alternative
         

UI/WebServerResources/SchedulerUI.css

@@ -4,57 +4,44 @@ DIV#leftPanel
   left: 0px;
   width: 19.25em;
   bottom: 0px;
+  background-color: #CCDDEC;
   overflow: hidden; }
 
 DIV#schedulerTabs
 { position: absolute;
   top: 4px;
-  left: 2px;
-  right: 2px;
+  left: 1px;
+  right: 0px;
   height: 186px; }
 
-DIV#tasksListView
-{ position: absolute;
-  top: 200px;
-  bottom: 0px;
-  left: 2px;
-  right: 0px;
-  overflow: hidden; }
+DIV#schedulerTabs .tabs
+{ right: 5px; }
 
-DIV#tasksListView H2
-{ font-size: 10pt;
-  margin: 0px;
-  margin-left: .25em;
-  padding: 0px; }
-
-DIV#tasksListView LABEL
-{ margin: .25em; }
+DIV#schedulerTabs .tab
+{ left: 0px;
+  right: 0px; }
 
 DIV#calendarSelectorView
-{ top: 3px;
-  overflow: hidden; }
+{ overflow: hidden; }
 
-DIV#calendarsList
-{ height: 100%; }
+DIV#calendarSelectorButtons
+{ padding-left: 6px; }
 
 DIV.colorBox
 { display: inline;
-  border: 1px solid #333;
   font-weight: normal;
   margin-right: 3px;
   font-size: 80%;
   width: 1em;
-  height: .75em; }
+  height: .75em;
+  -webkit-border-radius: 2px;
+  border-radius: 2px; }
 
-UL#tasksList, UL#calendarList
+UL#calendarList
 { cursor: default;
+  clear: left;
   margin: 0px;
   padding: 0px;
-  border-top: 1px solid #909090;
-  border-left: 1px solid #909090;
-  border-bottom: 1px solid #FFFFFF;
-  border-right: 1px solid #FFFFFF;
-  background-color: #CCDDEC;
   list-style-type: none;
   list-style-image: none;
   overflow: hidden;
@@ -62,61 +49,51 @@ UL#tasksList, UL#calendarList
   -moz-user-select: none;
   -khtml-user-select: none; }
 
-UL#calendarList
-{ clear: left;
-  height: 115px; }
-
 UL#calendarList LI
-{ cursor: pointer;
-  white-space: nowrap; }
-
-UL#tasksList
-{ position: absolute;
-  top: 2em;
-  left: 0px;
-  right: 0px;
-  bottom: .25em; }
-
-UL#tasksList LI
 { cursor: pointer;
   width: 100%;
-  white-space: nowrap; }
+  white-space: nowrap;
+  line-height: 2em;
+  padding-left: 10px; }
 
-UL#tasksList LI.duelater,
-UL#tasksList LI.duetoday,
-UL#tasksList LI.overdue
+#tasksList .duelater,
+#tasksList .duetoday,
+#tasksList .overdue
 { font-weight: bold; }
 
-UL#tasksList LI.overdue,
-UL#tasksList LI.important
+#tasksList .overdue,
+#tasksList .important
 { color: #f00 !important; }
 
-UL#tasksList LI.duetoday
+#tasksList .low
+{ color: #666 !important; }
+
+#tasksList .duetoday
 { color: #00f !important; }
 
-UL#tasksList LI.completed SPAN
+#tasksList .completed span
 { text-decoration: line-through;
   color: #000; }
 
-UL#tasksList LI.important SPAN
+#tasksList .important SPAN
 { background-image: url(important.png);
   background-repeat: no-repeat;
   background-position: 3px 2px;
   padding-left: 10px;
 }
-UL#tasksList LI SPAN
+#tasksList  SPAN
 { padding-left: 2px; }
 
-UL#tasksList LI._selected.overdue
+#tasksList ._selected.overdue
 { color: #fff !important;
   background-color: #f00 !important; }
 
-UL#tasksList LI._selected.duetoday
+#tasksList ._selected.duetoday
 { color: #fff !important;
   background-color: #00f !important; }
 
-UL#tasksList LI._selected.duelater,
-UL#tasksList LI._selected.completed
+#tasksList ._selected.duelater,
+#tasksList ._selected.completed
 { color: #fff !important;
   background-color: #9ABCD8 !important; }
 
@@ -129,17 +106,12 @@ DIV#rightPanel
   margin-left: 5px;
   overflow: hidden; }
 
-/* top list */
-DIV#eventsListView
+/* top lists in tabs */
+DIV#eventsListView,
+DIV#tasksListView
 { cursor: default;
-  position: absolute;
   background-color: #FFFFFF;
-  top: 2.5em;
-  left: 0px;
-  right: 0px;
-  height: 15.5em;
   overflow: hidden;
-  border-left: 1px solid #9B9B9B;
   overflow-y: auto; }
 
 DIV#calendarView
@@ -174,9 +146,6 @@ DIV#calendarView A
   right: 0px;
   height: 5px; }
 
-#filterPanel
-{ padding-right: .5em; }
-
 DIV#dateSelectorView
 { overflow: hidden; }
 
@@ -184,7 +153,7 @@ DIV#dateSelectorView
 { margin: 0px auto;
   height: 13.5em;
   background-color: #fff;
-  border-top: 1px solid #FFFFFF !important;
+  border-top: 1px solid #909090 !important;
   border-left: 1px solid #FFFFFF !important;
   border-bottom: 1px solid #909090 !important;
   border-right: 1px solid #909090 !important; }
@@ -279,21 +248,45 @@ TABLE#dateSelectorTable TD TABLE TD.dayOfToday
 { visibility: hidden;
   display: none; }
 
-TABLE#eventsList
+TABLE#eventsList,
+TABLE#tasksList
 { width: 100%; }
 
+TABLE#eventsList .colorBox
+{ margin-left: 2px; }
+
 TABLE#eventsList TD.headerTitle,
 TABLE#eventsList TD.headerDateTime
 { width: 30%; }
 
 TABLE#eventsList TD,
-TABLE#eventsList TH
+TABLE#eventsList TH,
+TABLE#tasksList TD,
+TABLE#tasksList TH
 { overflow: hidden;
+  line-height: 1.5em;
   white-space: nowrap; } /* pre, normal, nowrap */
 
-TABLE#eventsList TH
+TABLE#eventsList TH,
+TABLE#tasksList TH
 { white-space: pre; }
 
+TABLE#tasksList TD#completedHeader
+{ text-align: center;
+  width: 20px; }
+
+TABLE#eventsList THEAD TD:last-child,
+TABLE#tasksList THEAD TD:last-child
+{ border-right: 0px; }
+
+#filterPanel,
+.tab label
+{ display: block;
+  margin: 0;
+  padding: 5px;
+  background-color: #eee;
+  background-color: #E6E7E6; }
+
 DIV#eventDialog
 { width: 200px; }
 

UI/WebServerResources/SchedulerUI.js

@@ -241,8 +241,11 @@ function deleteEvent() {
                         }
                         if (sortedNodes[calendar].indexOf(nodes[i].cname) < 0) {
                             sortedNodes[calendar].push(nodes[i].cname);
-                            if (nodes[i].tagName == 'TR')
-                                events.push(nodes[i].down('td').allTextContent()); // extract the first column only
+                            if (nodes[i].tagName == 'TR') {
+                                var cell = nodes[i].down('td span');
+                                var title = cell.allTextContent();
+                                events.push(title); // extract the first column only
+                            }
                             else
                                 events.push(nodes[i].allTextContent());
                         }
@@ -422,7 +425,7 @@ function onMenuRawEvent(event) {
     var calendar = selectedCalendarCell[0].calendar;
     var cname = selectedCalendarCell[0].cname;
 
-    var url = ApplicationBaseURL + calendar + "/" + cname + "/raw"
+    var url = ApplicationBaseURL + calendar + "/" + cname + "/raw";
     openGenericWindow(url);
 }
 
@@ -918,8 +921,8 @@ function eventsListCallback(http) {
 
         var rows = table.select("TBODY TR");
         rows.each(function(e) {
-                e.remove();
-            });
+            e.remove();
+        });
 
         if (http.responseText.length > 0) {
             var data = http.responseText.evalJSON(true);
@@ -927,13 +930,14 @@ function eventsListCallback(http) {
                 var row = createElement("tr");
                 table.tBodies[0].appendChild(row);
                 row.addClassName("eventRow");
+                var calendar = escape(data[i][1]);
                 var rTime = data[i][16];
                 var id = escape(data[i][1] + "-" + data[i][0]);
                 if (rTime)
                     id += "-" + escape(rTime);
                 row.setAttribute("id", id);
                 row.cname = escape(data[i][0]);
-                row.calendar = escape(data[i][1]);
+                row.calendar = calendar;
                 if (rTime)
                     row.recurrenceTime = escape(rTime);
                 row.isException = data[i][17];
@@ -954,8 +958,13 @@ function eventsListCallback(http) {
                 var td = createElement("td");
                 row.appendChild(td);
                 td.observe("mousedown", listRowMouseDownHandler, true);
-                td.appendChild(document.createTextNode(data[i][4])); // title
-
+                var colorDiv = createElement("div", false, "colorBox calendarFolder" + calendar);
+                td.appendChild(colorDiv);
+                colorDiv.update('OO');
+                var span = createElement("span");
+                td.appendChild(span);
+                span.update(data[i][4]); // title
+                
                 td = createElement("td");
                 row.appendChild(td);
                 td.observe("mousedown", listRowMouseDownHandler, true);
@@ -1002,57 +1011,98 @@ function eventsListCallback(http) {
 }
 
 function tasksListCallback(http) {
-    var div = $("tasksListView");
-
     if (http.readyState == 4
         && http.status == 200) {
+        var div = $("tasksListView");
         document.tasksListAjaxRequest = null;
-        var list = $("tasksList");
+        var table = $("tasksList");
+        lastClickedRow = -1; // from generic.js
+
+        var rows = table.select("TBODY TR");
+        rows.each(function(e) {
+            e.remove();
+        });
 
         if (http.responseText.length > 0) {
             var data = http.responseText.evalJSON(true);
-            
-            list.previousScroll = list.scrollTop;
-            while (list.childNodes.length)
-                list.removeChild(list.childNodes[0]);
 
+            // [0] Task ID
+            // [1] Calendar ID
+            // [2] Calendar name
+            // [3] Status (0, 1 = completed, 2)
+            // [4] Title
+            // [5] Due date (int)
+            // [6] Classification (0 = public, 1, = private, 2 = confidential)
+            // [7] Location
+            // [8] Category
+            // [9] Editable?
+            // [10] Erasable?
+            // [11] Priority (0, 1 = important, 9 = low)
+            // [12] Status CSS class (duelater, completed, etc)
+            // (13) Due date (formatted)
+            
             for (var i = 0; i < data.length; i++) {
-                var listItem = createElement("li");
-                list.appendChild(listItem);
-                listItem.on("dblclick", editDoubleClickedEvent);
+                var row = createElement("tr");
+                table.tBodies[0].appendChild(row);
+
+                row.on("dblclick", editDoubleClickedEvent);
 
                 var calendar = escape(data[i][1]);
                 var cname = escape(data[i][0]);
-                listItem.setAttribute("id", calendar + "-" + cname);
+                row.setAttribute("id", calendar + "-" + cname);
                 //listItem.addClassName(data[i][5]); // Classification
-                listItem.addClassName(data[i][9]); // status (duelater, completed, etc)
-                listItem.calendar = calendar;
-                listItem.cname = cname;
-                listItem.erasable = data[i][7] || IsSuperUser;
+                row.addClassName(data[i][12]); // status
+                row.calendar = calendar;
+                row.cname = cname;
+                row.erasable = data[i][10] || IsSuperUser;
+                if (parseInt(data[i][11]) == 1) {
+                  row.addClassName("important");
+                }
+                else if (parseInt(data[i][11]) == 9) {
+                  row.addClassName("low");
+                }
+
+                var cell = createElement("td");
+                row.appendChild(cell);
                 var input = createElement("input");
                 input.setAttribute("type", "checkbox");
-                if (parseInt(data[i][6]) == 0) // editable?
-                  input.setAttribute("disabled", true);
-                if (parseInt(data[i][8]) == 1) {
-                  listItem.addClassName("important");
-                }
-                listItem.appendChild(input);
-                input.observe("click", updateTaskStatus, true);
+                cell.appendChild(input);
                 input.setAttribute("value", "1");
-                if (data[i][2] == 1)
+                if (parseInt(data[i][9]) == 0) // editable?
+                    input.setAttribute("disabled", true);
+                input.addClassName("checkBox");
+                if (parseInt(data[i][3]) == 1) // completed?
                     input.setAttribute("checked", "checked");
-                $(input).addClassName("checkBox");
+                input.observe("click", updateTaskStatus, true);
 
+                cell = createElement("td");
+                row.appendChild(cell);
                 var colorDiv = createElement("div", false, "colorBox calendarFolder" + calendar);
+                cell.appendChild(colorDiv);
                 colorDiv.update('OO');
-                listItem.appendChild(colorDiv);
-
                 var t = new Element ("span");
-                t.update(data[i][3]);
-                listItem.appendChild (t);
+                cell.appendChild(t);
+                t.update(data[i][4]); // title
+
+                cell = createElement("td");
+                row.appendChild(cell);
+                if (data[i][13])
+                    cell.update(data[i][13]); // end date
+
+                cell = createElement("td");
+                row.appendChild(cell);
+                cell.update(data[i][7]); // location
+
+                cell = createElement("td");
+                row.appendChild(cell);
+                cell.update(data[i][8]); // category
+
+                cell = createElement("td");
+                row.appendChild(cell);
+                cell.update(data[i][2]); // calendar name
             }
 
-            list.scrollTop = list.previousScroll;
+            table.scrollTop = table.previousScroll;
 
             if (http.callbackData) {
                 var selectedNodesId = http.callbackData;
@@ -1999,7 +2049,7 @@ function onEventsSelectionChange() {
     tasksList.addClassName("_unfocused");
     deselectAll(tasksList);
 
-    var rows = $(this.tBodies[0]).getSelectedNodes();
+    var rows = $(this).getSelectedNodes();
     if (rows.length == 1) {
         var row = rows[0];
         changeCalendarDisplay( { "day": row.day,
@@ -2412,7 +2462,7 @@ function onShowCompletedTasks(event) {
 
 function updateTaskStatus(event) {
     var newStatus = (this.checked ? 1 : 0);
-    _updateTaskCompletion (this.parentNode, newStatus);
+    _updateTaskCompletion (this.up("tr"), newStatus);
     return false;
 }
 
@@ -2637,7 +2687,7 @@ function newTask () {
 }
 
 function marksTasksAsCompleted () {
-    var selectedTasks = $$("UL#tasksList LI._selected");
+    var selectedTasks = $$("#tasksList ._selected");
 
     for (var i = 0; i < selectedTasks.length; i++) {
         var task = selectedTasks[i];
@@ -2655,7 +2705,7 @@ function _updateTaskCompletion (task, value) {
 }
 
 function onMenuRawTask(event) {
-    var selectedTasks = $$("UL#tasksList LI._selected");
+    var selectedTasks = $$("#tasksList ._selected");
     if (selectedTasks.length != 1) {
       return;
     }
@@ -2706,7 +2756,7 @@ function configureDragHandles() {
     handle = $("rightDragHandle");
     if (handle) {
         handle.addInterface(SOGoDragHandlesInterface);
-        handle.upperBlock = $("eventsListView");
+        handle.upperBlock = $("schedulerTabs");
         handle.lowerBlock = $("calendarView");
     }
 }
@@ -3106,7 +3156,7 @@ function deletePersonalCalendarCallback(http) {
 }
 
 function configureLists() {
-    var list = $("tasksList");
+    var list = $$("#tasksList tbody").first();
     list.multiselect = true;
     list.on("mousedown", onTasksSelectionChange);
     list.on("selectstart", listRowMouseDownHandler);
@@ -3121,7 +3171,7 @@ function configureLists() {
     list.multiselect = true;
     configureSortableTableHeaders(list);
     TableKit.Resizable.init(list, {'trueResize' : true, 'keepWidth' : true});
-    list.observe("mousedown", onEventsSelectionChange);
+    list.down("tbody").on("mousedown", onEventsSelectionChange);
 }
 
 function initDateSelectorEvents() {
@@ -3223,6 +3273,15 @@ function onDocumentKeydown(event) {
     }
 }
 
+function saveTabState(event) {
+    var tab = $(event).memo;
+
+    var url =  ApplicationBaseURL + "saveSelectedList";
+    var params = "list=" + tab;
+    triggerAjaxRequest(url, null, null, params,
+                       { "Content-type": "application/x-www-form-urlencoded" });
+}
+
 function initScheduler() {
     sorting["attribute"] = "start";
     sorting["ascending"] = true;
@@ -3234,6 +3293,7 @@ function initScheduler() {
         var tabsContainer = $("schedulerTabs");
         var controller = new SOGoTabsController();
         controller.attachToTabsContainer(tabsContainer);
+        schedulerTabs.on("tabs:click", saveTabState);
 
         if (UserSettings['ShowCompletedTasks']) {
             showCompletedTasks = parseInt(UserSettings['ShowCompletedTasks']);

UI/WebServerResources/generic.css

@@ -55,6 +55,14 @@ LABEL
   white-space: nowrap;
   margin-left: .5em; }
 
+H6
+{ font-size: 11px;
+  color: #9ABCD8;
+  color: #627e9c;
+  text-transform: uppercase;
+  margin: 10px 0px 5px 0px;
+  padding-left: 5px; }
+
 TABLE
 { table-layout: fixed;
   border-spacing: 0px; }
@@ -493,7 +501,7 @@ DIV.noJavascriptErrorMessage A
   margin: 0px auto; }
 
 LI.denied
-{ background-color: #fefefe;
+{ n0background-color: #fefefe;
   font-style: italic;
   color: #f33; }
 
@@ -507,7 +515,7 @@ TD._selected
   color: #fff;
 }
 
-LI[class~="_selected"].denied
+LI._selected.denied
 { 
   background-color: #f33;
 }

UI/WebServerResources/generic.js

@@ -1193,7 +1193,7 @@ function initCriteria() {
     var searchValue = $("searchValue");
     var searchOptions = $("searchOptions");
 
-    if (searchValue) {
+    if (searchValue && searchOptions) {
         var firstOption = searchOptions.down("li");
         if (firstOption) {
             searchCriteria.value = firstOption.getAttribute('id');

UI/WebServerResources/iefixes.css

@@ -171,7 +171,8 @@ TABLE.framenocaption
 TABLE.frame TBODY
 { padding: 20px; }
 
-UL#calendarList
+UL#calendarList,
+UL#contactFolders
 { margin-top: 2px; }
 
 A.toolbarButton SPAN,
@@ -179,10 +180,8 @@ A.toolbarButton:hover SPAN {
   height: 50px;
   padding: 5px 2px 6px 5px;
 }
-A.smallToolbarButton, A.smallToolbarButton:hover,
-A.smallToolbarButton SPAN, A.smallToolbarButton:hover SPAN
-{ height: 33px; }
-
+A.smallToolbarButton, A.smallToolbarButton:hover
+{ height: 34px; }
 A.toolbarButton:active SPAN {
   background-position: auto; /*broken*/
 }