Monotone-Parent: ec22eec31a634d17211dbfb68bdc49ab1baca4aa

Monotone-Revision: 0fe27b5739f7397e525075ec4060c837ba896b62

Monotone-Author: wsourdeau@inverse.ca
Monotone-Date: 2006-11-09T22:55:04
Monotone-Branch: ca.inverse.sogo

ChangeLog

@@ -1,5 +1,10 @@
 2006-11-09  Wolfgang Sourdeau  <wsourdeau@inverse.ca>
 
+	* UI/WebServerResources/generic.js: added and activated many
+	"load" handlers to configure generic widgets used across the
+	modules. More events are now handled in a DOM-fashion way instead
+	of by setting the relative attributes in the templates.
+
 	* UI/Templates/UIxSortableTableHeader.wox: all the events are
 	declared from the javascript DOM onload handlers.
 

UI/WebServerResources/ContactsUI.js

@@ -155,6 +155,7 @@ function contactsListCallback(http)
       for (var i = 0; i < selected.length; i++)
         selectNode($(selected[i]));
     }
+    configureSortableTableHeaders();
   }
   else
     log ("ajax fuckage");
@@ -426,21 +427,19 @@ function newEmailTo(sender) {
   return false; /* stop following the link */
 }
 
-function onHeaderClick(node)
+function onHeaderClick(event)
 {
-  var href = node.getAttribute("href");
-
   if (document.contactsListAjaxRequest) {
     document.contactsListAjaxRequest.aborted = true;
     document.contactsListAjaxRequest.abort();
   }
-  url = CurrentContactFolderURL() + "/" + href;
-  if (!href.match(/noframe=/))
+  url = CurrentContactFolderURL() + "/" + this.link;
+  if (!this.link.match(/noframe=/))
     url += "&noframe=1";
   document.contactsListAjaxRequest
     = triggerAjaxRequest(url, contactsListCallback);
 
-  return false;
+  event.preventDefault();
 }
 
 function registerDraggableMessageNodes()
@@ -638,3 +637,35 @@ function onAddressBookRemove(node) {
 
   return false;
 }
+
+function configureDragHandles() {
+  var handle = $("dragHandle");
+  if (handle) {
+    handle.addInterface(SOGoDragHandlesInterface);
+    handle.leftBlock=$("contactFoldersList");
+    handle.rightBlock=$("rightPanel");
+  }
+
+  handle = $("rightDragHandle");
+  if (handle) {
+    handle.addInterface(SOGoDragHandlesInterface);
+    handle.upperBlock=$("contactsListContent");
+    handle.lowerBlock=$("contactView");
+  }
+}
+
+function configureContactFolders() {
+  var contactFolders = $("contactFolders");
+  if (contactFolders) {
+    contactFolders.addEventListener("selectionchange", onFolderSelectionChange, false);
+  }
+}
+
+var initContacts = {
+  handleEvent: function (event) {
+    configureContactFolders();
+//     initDnd();
+  }
+}
+
+window.addEventListener("load", initContacts, false);

UI/WebServerResources/MailerUI.js

@@ -53,19 +53,14 @@ function openMessageWindow(msguid, url) {
   return false;
 }
 
-function clickedUid(sender, msguid) {
+function onMessageDoubleClick(event) {
   resetSelection(window);
+  var msguid = this.parentNode.id.substr(4);
   return openMessageWindow(msguid,
                            ApplicationBaseURL + currentMailbox + "/"
                            + msguid + "/view");
 }
 
-function doubleClickedUid(sender, msguid) {
-  alert("DOUBLE Clicked " + msguid);
-
-  return false;
-}
-
 function toggleMailSelect(sender) {
   var row;
   row = $(sender.name);
@@ -236,12 +231,9 @@ function openMessageWindowsForSelection(action)
   return false;
 }
 
-function mailListMarkMessage(sender, action, msguid, markread)
-{
-  var url;
+function mailListMarkMessage(event) {
   var http = createHTTPClient();
-
-  url = ApplicationBaseURL + currentMailbox + "/" + action + "?uid=" + msguid;
+  var url = ApplicationBaseURL + currentMailbox + "/" + action + "?uid=" + msguid;
 
   if (http) {
     // TODO: add parameter to signal that we are only interested in OK
@@ -433,6 +425,8 @@ function messageListCallback(http)
       var row = $('row_' + selected);
       selectNode(row);
     }
+    configureMessageListEvents();
+    configureSortableTableHeaders();
   }
   else
     log ("ajax fuckage");
@@ -551,9 +545,7 @@ function storeCachedMessage(cachedMessage)
 
 function onMessageSelectionChange()
 {
-  var messageList = $("messageList");
-  var rows  = messageList.getSelectedRowsId();
-
+  var rows = this.getSelectedRowsId();
   if (rows.length == 1) {
     var idx = rows[0].substr(4);
 
@@ -737,13 +729,13 @@ function initMailboxSelection(mailboxName)
   currentMailbox = mailboxName;
 
   var tree = $("d");
-  var treeNodes = getElementsByClassName('DIV', 'dTreeNode', tree);
+  var treeNodes = document.getElementsByClassName("dTreeNode", tree);
   var i = 0;
   while (i < treeNodes.length
          && treeNodes[i].getAttribute("dataname") != currentMailbox)
     i++;
   if (i < treeNodes.length) {
-    var links = getElementsByClassName('A', 'node', treeNodes[i]);
+    var links = document.getElementsByClassName("node", treeNodes[i]);
     if (tree.selectedEntry)
       deselectNode(tree.selectedEntry);
     selectNode(links[0]);
@@ -752,27 +744,19 @@ function initMailboxSelection(mailboxName)
   }
 }
 
-function onHeaderClick(node)
+function onHeaderClick(event)
 {
-  var href = node.getAttribute("href");
-
   if (document.messageListAjaxRequest) {
     document.messageListAjaxRequest.aborted = true;
     document.messageListAjaxRequest.abort();
   }
-  url = ApplicationBaseURL + currentMailbox + "/" + href;
-  if (!href.match(/noframe=/))
+  url = ApplicationBaseURL + currentMailbox + "/" + this.link;
+  if (!this.link.match(/noframe=/))
     url += "&noframe=1";
-  log ("url: " + url);
   document.messageListAjaxRequest
     = triggerAjaxRequest(url, messageListCallback);
 
-  return false;
-}
-
-function registerDraggableMessageNodes()
-{
-  log ("can we drag...");
+  event.preventDefault();
 }
 
 function onSearchFormSubmit()
@@ -816,6 +800,49 @@ var messageListGhost = function () {
   return newDiv;
 }
 
+function configureMessageListEvents() {
+  var messageList = $("messageList");
+  if (messageList) {
+    messageList.addEventListener("selectionchange",
+                                 onMessageSelectionChange, false);
+    var rows = messageList.tBodies[0].rows;
+    var start = 0;
+    while (rows[start].cells[0].hasClassName("tbtv_headercell")
+           || rows[start].cells[0].hasClassName("tbtv_navcell"))
+      start++;
+    for (var i = start; i < rows.length; i++) {
+      rows[i].addEventListener("click", onRowClick, false);
+      rows[i].addEventListener("contextmenu", onMessageContextMenu, false);
+      for (var j = 0; j < rows[i].cells.length; j++) {
+        var cell = rows[i].cells[j];
+        cell.addEventListener("mousedown", listRowMouseDownHandler, true);
+        if (j == 2 || j == 3 || j == 5)
+          cell.addEventListener("dblclick", onMessageDoubleClick, false);
+        else if (j == 4) {
+          var img = cell.childNodesWithTag("img")[0];
+          img.addEventListener("click", mailListMarkMessage, false);
+        }
+      }
+    }
+  }
+}
+
+function configureDragHandles() {
+  var handle = $("dragHandle");
+  if (handle) {
+    handle.addInterface(SOGoDragHandlesInterface);
+    handle.leftBlock=$("mailerFolderTree");
+    handle.rightBlock=$("mailerPageContent");
+  }
+
+  handle = $("mailboxDragHandle");
+  if (handle) {
+    handle.addInterface(SOGoDragHandlesInterface);
+    handle.upperBlock=$("mailboxContent");
+    handle.lowerBlock=$("messageContent");
+  }
+}
+
 /* dnd */
 function initDnd() {
   log ("MailerUI initDnd");
@@ -843,6 +870,7 @@ function refreshContacts() {
 
 var initMailer = {
   handleEvent: function (event) {
+    configureMessageListEvents();
 //     initDnd();
   }
 }

UI/WebServerResources/SOGoDragHandles.js

@@ -33,14 +33,14 @@ var SOGoDragHandlesInterface = {
       } else if (this.dhType == 'vertical') {
         this.origY = this.offsetTop;
         this.origUpper = this.upperBlock.offsetHeight;
-        delta = event.clientY - this.offsetTop;
+        delta = event.clientY - this.offsetTop - 5;
         this.origLower = this.lowerBlock.offsetTop - 5;
         document.body.style.cursor = "n-resize";
       }
 
       document._currentDragHandle = this;
-      document.addEventListener('mouseup', this.documentStopHandleDragging, true);
-      document.addEventListener('mousemove', this.documentMove, true);
+      document.addEventListener("mouseup", this.documentStopHandleDragging, true);
+      document.addEventListener("mousemove", this.documentMove, true);
       this.move(event);
       event.cancelBubble = true;
     }
@@ -70,8 +70,8 @@ var SOGoDragHandlesInterface = {
       this.upperBlock.style.height = (this.origUpper + deltaY - delta) + 'px;';
     }
  
-    document.removeEventListener('mouseup', this.documentStopHandleDragging, true);
-    document.removeEventListener('mousemove', this.documentMove, true);
+    document.removeEventListener("mouseup", this.documentStopHandleDragging, true);
+    document.removeEventListener("mousemove", this.documentMove, true);
     document.body.setAttribute('style', '');
 
     this.move(event);

UI/WebServerResources/SchedulerUI.js

@@ -250,6 +250,7 @@ function appointmentsListCallback(http)
     var params = parseQueryParameters(http.callbackData);
     sortKey = params["sort"];
     sortOrder = params["desc"];
+    configureSortableTableHeaders();
   }
   else
     log ("ajax fuckage");
@@ -503,15 +504,13 @@ function onAppointmentContextMenuHide(event)
   }
 }
 
-function onAppointmentsSelectionChange()
-{
+function onAppointmentsSelectionChange() {
   listOfSelection = $("appointmentsList");
   listOfSelection.removeClassName("_unfocused");
   $("tasksList").addClassName("_unfocused");
 }
 
-function onTasksSelectionChange()
-{
+function onTasksSelectionChange() {
   listOfSelection = $("tasksList");
   listOfSelection.removeClassName("_unfocused");
   $("appointmentsList").addClassName("_unfocused");
@@ -522,10 +521,9 @@ function _loadAppointmentHref(href) {
     document.appointmentsListAjaxRequest.aborted = true;
     document.appointmentsListAjaxRequest.abort();
   }
-  url = CalendarBaseURL + href;
-
+  var url = CalendarBaseURL + href;
   document.appointmentsListAjaxRequest
-    = triggerAjaxRequest(url, appointmentsListCallback, href);
+    = triggerAjaxRequest(href, appointmentsListCallback, href);
 
   return false;
 }
@@ -544,8 +542,11 @@ function _loadTasksHref(href) {
   return false;
 }
 
-function onHeaderClick(node) {
-  return _loadAppointmentHref(node.getAttribute("href"));
+function onHeaderClick(event) {
+  log("onHeaderClick: " + this.link);
+  _loadAppointmentHref(this.link);
+
+  event.preventDefault();
 }
 
 function refreshAppointments() {
@@ -965,3 +966,19 @@ function browseUrl(anchor, event) {
 
   return false;
 }
+
+function configureDragHandles() {
+  var handle = $("verticalDragHandle");
+  if (handle) {
+    handle.addInterface(SOGoDragHandlesInterface);
+    handle.leftBlock=$("leftPanel");
+    handle.rightBlock=$("rightPanel");
+  }
+
+  handle = $("rightDragHandle");
+  if (handle) {
+    handle.addInterface(SOGoDragHandlesInterface);
+    handle.upperBlock=$("appointmentsListView");
+    handle.lowerBlock=$("calendarView");
+  }
+}

UI/WebServerResources/generic.js

@@ -75,7 +75,7 @@ function getAllElements(scope)
 
 /* from
    http://www.robertnyman.com/2005/11/07/the-ultimate-getelementsbyclassname/ */
-function getElementsByClassName(_tag, _class, _scope) {
+function getElementsByClassName2(_tag, _class, _scope) {
   var regexp, classes, elements, element, returnElements;
 
   _scope = _scope || document;
@@ -217,25 +217,27 @@ function triggerAjaxRequest(url, callback, userdata) {
   return http;
 }
 
-function checkAjaxRequestsState()
-{
-  if (activeAjaxRequests > 0
-      && !document.busyAnim) {
-    var anim = document.createElement("img");
-    document.busyAnim = anim;
-    anim.setAttribute("src", ResourcesURL + '/busy.gif');
-    anim.style.position = "absolute;";
-    anim.style.top = "2.5em;";
-    anim.style.right = "1em;";
-    anim.style.visibility = "hidden;";
-    anim.style.zindex = "1;";
-    var folderTree = document.getElementById("toolbar");
-    folderTree.appendChild(anim);
-    anim.style.visibility = "visible;";
-  } else if (activeAjaxRequests == 0
+function checkAjaxRequestsState() {
+  var toolbar = document.getElementById("toolbar");
+  if (toolbar) {
+    if (activeAjaxRequests > 0
+        && !document.busyAnim) {
+      var anim = document.createElement("img");
+      document.busyAnim = anim;
+      anim.src = ResourcesURL + "/busy.gif";
+      anim.style.position = "absolute;";
+      anim.style.top = "2.5em;";
+      anim.style.right = "1em;";
+      anim.style.visibility = "hidden;";
+      anim.style.zindex = "1;";
+      toolbar.appendChild(anim);
+      anim.style.visibility = "visible;";
+    }
+    else if (activeAjaxRequests == 0
 	     && document.busyAnim) {
-    document.busyAnim.parentNode.removeChild(document.busyAnim);
-    document.busyAnim = null;
+      document.busyAnim.parentNode.removeChild(document.busyAnim);
+      document.busyAnim = null;
+    }
   }
 }
 
@@ -387,12 +389,11 @@ function onRowClick(event) {
 
   if (startSelection != node.parentNode.getSelectedNodes()) {
     var parentNode = node.parentNode;
-    if (parentNode.tagName == 'TBODY')
+    if (parentNode instanceof HTMLTableSectionElement)
       parentNode = parentNode.parentNode;
-    var code = '' + parentNode.getAttribute('onselectionchange');
-    if (code.length > 0) {
-      node.eval(code);
-    }
+    var onSelectionChangeEvent = document.createEvent("Event");
+    onSelectionChangeEvent.initEvent("selectionchange", true, true);
+    parentNode.dispatchEvent(onSelectionChangeEvent);
   }
 }
 
@@ -440,7 +441,7 @@ function onMenuClick(event, menuId)
 function setupMenuTarget(menu, target)
 {
   menu.menuTarget = target;
-  var menus = getElementsByClassName("*", "menu", menu);
+  var menus = getElementsByClassName("menu", menu);
   for (var i = 0; i < menus.length; i++) {
     menus[i].menuTarget = target;
   }
@@ -574,7 +575,8 @@ function log(message) {
       logWindow = logWindow.opener;
   }
   var logConsole = logWindow.document.getElementById('logConsole');
-  logConsole.innerHTML += message + '<br />' + "\n";
+  if (logConsole)
+    logConsole.innerHTML += message + '<br />' + "\n";
 }
 
 function dropDownSubmenu(event)
@@ -637,145 +639,6 @@ function checkDropDown(event)
     }
 }
 
-/* drag handle */
-
-var dragHandle;
-var dragHandleOrigX;
-var dragHandleOrigLeft;
-var dragHandleOrigRight;
-var dragHandleOrigY;
-var dragHandleOrigUpper;
-var dragHandleOrigLower;
-var dragHandleDiff;
-
-function startHandleDragging(event) {
-  if (event.button == 0) {
-    var leftBlock = event.target.getAttribute('leftblock');
-    var rightBlock = event.target.getAttribute('rightblock');
-    var upperBlock = event.target.getAttribute('upperblock');
-    var lowerBlock = event.target.getAttribute('lowerblock');
-
-    dragHandle = event.target;
-    if (leftBlock && rightBlock) {
-      dragHandle.dhType = 'horizontal';
-      dragHandleOrigX = dragHandle.offsetLeft;
-      dragHandleOrigLeft = document.getElementById(leftBlock).offsetWidth;
-      dragHandleDiff = 0;
-      dragHandleOrigRight = document.getElementById(rightBlock).offsetLeft - 5;
-      document.body.style.cursor = "e-resize";
-    } else if (upperBlock && lowerBlock) {
-      dragHandle.dhType = 'vertical';
-      var uBlock = document.getElementById(upperBlock);
-      var lBlock = document.getElementById(lowerBlock);
-      dragHandleOrigY = dragHandle.offsetTop;
-      dragHandleOrigUpper = uBlock.offsetHeight;
-      dragHandleDiff = event.clientY - dragHandle.offsetTop;
-      dragHandleOrigLower = lBlock.offsetTop - 5;
-      document.body.style.cursor = "n-resize";
-    }
-
-    document.addEventListener('mouseup', stopHandleDragging, true);
-    document.addEventListener('mousemove', dragHandleMove, true);
-
-    dragHandleMove(event);
-    event.cancelBubble = true;
-  }
-
-  return false;
-}
-
-function stopHandleDragging(event) {
-  if (dragHandle.dhType == 'horizontal') {
-    var diffX = Math.floor(event.clientX - dragHandleOrigX
-                           - (dragHandle.offsetWidth / 2));
-    var lBlock
-      = document.getElementById(dragHandle.getAttribute('leftblock'));
-    var rBlock
-      = document.getElementById(dragHandle.getAttribute('rightblock'));
-    
-    rBlock.style.left = (dragHandleOrigRight + diffX) + 'px;';
-    lBlock.style.width = (dragHandleOrigLeft + diffX) + 'px;';
-  } else if (dragHandle.dhType == 'vertical') {
-    var diffY = Math.floor(event.clientY - dragHandleOrigY
-                           - (dragHandle.offsetHeight / 2));
-    var uBlock
-      = document.getElementById(dragHandle.getAttribute('upperblock'));
-    var lBlock
-      = document.getElementById(dragHandle.getAttribute('lowerblock'));
-
-    lBlock.style.top = (dragHandleOrigLower + diffY
-                        - dragHandleDiff) + 'px;';
-    uBlock.style.height = (dragHandleOrigUpper + diffY - dragHandleDiff) + 'px;';
-  }
- 
-  document.removeEventListener('mouseup', stopHandleDragging, true);
-  document.removeEventListener('mousemove', dragHandleMove, true);
-  document.body.setAttribute('style', '');
-  event.cancelBubble = true;
-
-  dragHandleMove(event);
-
-  return false;
-}
-
-function dragHandleMove(event) {
-  if (dragHandle.dhType == 'horizontal') {
-    var width = dragHandle.offsetWidth;
-    var hX = event.clientX;
-    if (hX > -1) {
-      var newLeft = Math.floor(hX - (width / 2));
-      dragHandle.style.left = newLeft + 'px;';
-      event.cancelBubble = true;
-      
-      return false;
-    }
-  } else if (dragHandle.dhType == 'vertical') {
-    var height = dragHandle.offsetHeight;
-    var hY = event.clientY;
-    if (hY > -1) {
-      var newTop = Math.floor(hY - (height / 2))  - dragHandleDiff;
-      dragHandle.style.top = newTop + 'px;';
-      event.cancelBubble = true;
-
-      return false;
-    }
-  }
-}
-
-function dragHandleDoubleClick(event) {
-  dragHandle = event.target;
-
-  if (dragHandle.dhType == 'horizontal') {
-    var lBlock
-      = document.getElementById(dragHandle.getAttribute('leftblock'));
-    var lLeft = lBlock.offsetLeft;
-    
-    if (dragHandle.offsetLeft > lLeft) {
-      var rBlock
-        = document.getElementById(dragHandle.getAttribute('rightblock'));
-      var leftDiff = rBlock.offsetLeft - dragHandle.offsetLeft;
-
-      dragHandle.style.left = lLeft + 'px;';
-      lBlock.style.width = '0px';
-      rBlock.style.left = (lLeft + leftDiff) + 'px;';
-    }
-  } else if (dragHandle.dhType == 'vertical') {
-    var uBlock
-      = document.getElementById(dragHandle.getAttribute('upperblock'));
-    var uTop = uBlock.offsetTop;
-
-    if (dragHandle.offsetTop > uTop) {
-      var lBlock
-        = document.getElementById(dragHandle.getAttribute('lowerblock'));
-      var topDiff = lBlock.offsetTop - dragHandle.offsetTop;
-      
-      dragHandle.style.top = uTop + 'px;';
-      uBlock.style.width = '0px';
-      lBlock.style.top = (uTop + topDiff) + 'px;';
-    }
-  }
-}
-
 /* search field */
 function popupSearchMenu(event, menuId)
 {
@@ -946,6 +809,10 @@ function onContactRemove(node) {
   return false;
 }
 
+function listRowMouseDownHandler(event) {
+  event.preventDefault();
+}
+
 /* tabs */
 function initTabs()
 {
@@ -1072,10 +939,26 @@ function indexColor(number) {
 var onLoadHandler = {
   handleEvent: function (event) {
     initTabs();
+    configureDragHandles();
+    configureSortableTableHeaders();
 //     genericInitDnd();
   }
 }
 
+function configureSortableTableHeaders() {
+  var headers = document.getElementsByClassName("sortableTableHeader");
+  log("length: " + headers.length);
+  for (var i = 0; i < headers.length; i++) {
+    var anchor = headers[i].childNodesWithTag("a")[0];
+    if (!anchor.link) {
+      log("anchor " + i);
+      anchor.link = anchor.getAttribute("href");
+      anchor.href = "#";
+      anchor.addEventListener("click", onHeaderClick, true);
+    }
+  }
+}
+
 window.addEventListener("load", onLoadHandler, false);
 
 /* drag and drop */
@@ -1260,3 +1143,11 @@ function genericInitDnd() {
 //     tables[i].addEventListener("dragstop", document.DNDManager.sourceStop, false);
 //   }
 }
+
+/* stubs */
+function configureDragHandles() {
+}
+
+function onHeaderClick(event) {
+  window.alert("generic headerClick");
+}