From d6f7301d1c65104c3ce43b3c642a7bf4867233c7 Mon Sep 17 00:00:00 2001 From: Wolfgang Sourdeau Date: Thu, 9 Nov 2006 22:55:04 +0000 Subject: [PATCH] Monotone-Parent: ec22eec31a634d17211dbfb68bdc49ab1baca4aa Monotone-Revision: 0fe27b5739f7397e525075ec4060c837ba896b62 Monotone-Author: wsourdeau@inverse.ca Monotone-Date: 2006-11-09T22:55:04 Monotone-Branch: ca.inverse.sogo --- ChangeLog | 5 + UI/WebServerResources/ContactsUI.js | 43 ++++- UI/WebServerResources/MailerUI.js | 86 ++++++--- UI/WebServerResources/SOGoDragHandles.js | 10 +- UI/WebServerResources/SchedulerUI.js | 35 +++- UI/WebServerResources/generic.js | 221 ++++++----------------- 6 files changed, 186 insertions(+), 214 deletions(-) diff --git a/ChangeLog b/ChangeLog index f0f4d7a67..99d05a04a 100644 --- a/ChangeLog +++ b/ChangeLog @@ -1,5 +1,10 @@ 2006-11-09 Wolfgang Sourdeau + * 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. diff --git a/UI/WebServerResources/ContactsUI.js b/UI/WebServerResources/ContactsUI.js index b85788d3c..c0bec198f 100644 --- a/UI/WebServerResources/ContactsUI.js +++ b/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); diff --git a/UI/WebServerResources/MailerUI.js b/UI/WebServerResources/MailerUI.js index e706e871b..0f186c1ee 100644 --- a/UI/WebServerResources/MailerUI.js +++ b/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(); } } diff --git a/UI/WebServerResources/SOGoDragHandles.js b/UI/WebServerResources/SOGoDragHandles.js index 3c08bc80a..d922a1171 100644 --- a/UI/WebServerResources/SOGoDragHandles.js +++ b/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); diff --git a/UI/WebServerResources/SchedulerUI.js b/UI/WebServerResources/SchedulerUI.js index 7a48190eb..e80dc5496 100644 --- a/UI/WebServerResources/SchedulerUI.js +++ b/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"); + } +} diff --git a/UI/WebServerResources/generic.js b/UI/WebServerResources/generic.js index 9f33d9c48..ce3dcced3 100644 --- a/UI/WebServerResources/generic.js +++ b/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 + '
' + "\n"; + if (logConsole) + logConsole.innerHTML += message + '
' + "\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"); +}