diff --git a/NEWS b/NEWS
index 8947cccfd..0a9f33ec2 100644
--- a/NEWS
+++ b/NEWS
@@ -10,7 +10,7 @@
- added tooltips for toolbar buttons (English and French);
- added checkmarks in live search options popup menus;
- added browser detection with recommanded alternatives;
-- initial support for resizable columns in tables;
+- support for resizable columns in tables;
- improved IE7 and Safari support: attendees selector;
- countless bugfixes;
diff --git a/UI/Templates/ContactsUI/UIxContactsListView.wox b/UI/Templates/ContactsUI/UIxContactsListView.wox
index 950cfade2..d98db7d25 100644
--- a/UI/Templates/ContactsUI/UIxContactsListView.wox
+++ b/UI/Templates/ContactsUI/UIxContactsListView.wox
@@ -10,22 +10,23 @@
selectorComponentClass="selectorComponentClass"
title="name">
-
+
\ No newline at end of file
diff --git a/UI/Templates/MailerUI/UIxMailListView.wox b/UI/Templates/MailerUI/UIxMailListView.wox
index f77b31986..fd65c204a 100644
--- a/UI/Templates/MailerUI/UIxMailListView.wox
+++ b/UI/Templates/MailerUI/UIxMailListView.wox
@@ -8,22 +8,22 @@
xmlns:label="OGo:label">
| |
+ > |
|
diff --git a/UI/Templates/UIxPageFrame.wox b/UI/Templates/UIxPageFrame.wox
index d2a9086d6..91cb95945 100644
--- a/UI/Templates/UIxPageFrame.wox
+++ b/UI/Templates/UIxPageFrame.wox
@@ -46,6 +46,7 @@
+
diff --git a/UI/WebServerResources/ContactsUI.css b/UI/WebServerResources/ContactsUI.css
index ccf2bc5db..97d1d7f26 100644
--- a/UI/WebServerResources/ContactsUI.css
+++ b/UI/WebServerResources/ContactsUI.css
@@ -39,7 +39,7 @@ DIV#contactsListContent
left: 0px;
right: 0px;
height: 16em;
- overflow: scroll;
+ overflow: auto;
overflow-x: hidden; }
.aptview_text
@@ -169,17 +169,15 @@ DIV#folderTreeContent TABLE TD
padding: 0px; }
TABLE#contactsList
-{ display: block;
- position: relative;
- width: 100%; }
+{ width: 100%; }
-TABLE#contactsList TD
-{ white-space: normal; /* pre, normal, nowrap */
- /*width: 20%;*/ }
+TABLE#contactsList TD,
+TABLE#contactsList TH
+{ overflow: hidden;
+ white-space: nowrap; } /* pre, normal, nowrap */
-TD#nameHeader,
-TD#mailHeader
-{ /*width: 30%;*/ }
+TABLE#contactsList TH
+{ white-space: pre; }
TABLE#contactsList TD IMG
{
@@ -247,18 +245,6 @@ DIV.contactColumn H4
INPUT#searchValue:focus
{ color: #000; }
-TABLE#contactsList TD.resize-handle-active
-{ cursor: e-resize; }
-
-DIV.resize-handle
-{ cursor: e-resize;
- width: 2px;
- border-right: 1px solid #fff;
- position: absolute;
- top: 0;
- left: 0;
- max-height: 2em; }
-
/* drag handles */
DIV#dragHandle
{
diff --git a/UI/WebServerResources/ContactsUI.js b/UI/WebServerResources/ContactsUI.js
index 2b58fa4cc..a08aac746 100644
--- a/UI/WebServerResources/ContactsUI.js
+++ b/UI/WebServerResources/ContactsUI.js
@@ -2,7 +2,6 @@
var cachedContacts = new Array();
var currentContactFolder = null;
-var savedColumnsWidth = null;
var usersRightsWindowHeight = 200;
var usersRightsWindowWidth = 450;
@@ -56,7 +55,7 @@ function openContactsFolder(contactsFolder, reload, idx) {
if (document.contactsListAjaxRequest) {
document.contactsListAjaxRequest.aborted = true;
document.contactsListAjaxRequest.abort();
- }
+ } log (url);
document.contactsListAjaxRequest
= triggerAjaxRequest(url, contactsListCallback, selection);
}
@@ -74,33 +73,30 @@ function openContactsFolderAtIndex(element) {
= triggerAjaxRequest(url, contactsListCallback);
}
-function configureContactsListHeaders(cells) {
- for (var i = 0; i < cells.length; i++) {
- var currentCell = $(cells[i]);
- Event.observe(currentCell, "click",
- onHeaderClick.bindAsEventListener(currentCell));
- //Event.observe(currentCell, "mousedown", listRowMouseDownHandler);
- }
-}
-
function contactsListCallback(http) {
- var div = $("contactsListContent");
-
if (http.readyState == 4
&& http.status == 200) {
document.contactsListAjaxRequest = null;
- div.update(http.responseText);
var table = $("contactsList");
if (table) {
- TableKit.Resizable.init(table);
- if (savedColumnsWidth != null) {
- // Restore columns width
- table.setColumnsWidth(savedColumnsWidth);
- }
- configureContactsListHeaders(table.tBodies[0].rows[0].cells);
+ // Update table
+ var data = http.responseText;
+ var html = data.replace(/^(.*\n)*.*( 0) {
var sortHeader;
if (sorting["attribute"] == "displayName")
@@ -117,6 +113,11 @@ function contactsListCallback(http) {
sortHeader = null;
if (sortHeader) {
+ var sortImages = $(table.tHead).getElementsByClassName("sortImage");
+ $(sortImages).each(function(item) {
+ item.remove();
+ });
+
var sortImage = createElement("img", "messageSortImage", "sortImage");
sortHeader.insertBefore(sortImage, sortHeader.firstChild);
if (sorting["ascending"])
@@ -418,10 +419,9 @@ function onHeaderClick(event) {
sorting["ascending"] = true;
}
- savedColumnsWidth = this.up('table').getColumnsWidth();
refreshCurrentFolder();
- preventDefault(event);
+ Event.stop(event);
}
function newContact(sender) {
@@ -437,7 +437,7 @@ function onFolderSelectionChange() {
if (nodes[0].hasClassName("denied")) {
var div = $("contactsListContent");
- div.innerHTML = "";
+ div.update();
}
else {
search = {};
@@ -746,6 +746,13 @@ function initContacts(event) {
configureSelectionButtons();
configureContactFolders();
// initDnd();
+
+ var table = $("contactsList");
+ if (table) {
+ // Initialize contacts table
+ configureSortableTableHeaders(table);
+ TableKit.Resizable.init(table, {'trueResize' : true, 'keepWidth' : true});
+ }
}
addEvent(window, 'load', initContacts);
diff --git a/UI/WebServerResources/HTMLTableElement.js b/UI/WebServerResources/HTMLTableElement.js
index e029cd8ba..449175457 100644
--- a/UI/WebServerResources/HTMLTableElement.js
+++ b/UI/WebServerResources/HTMLTableElement.js
@@ -34,28 +34,6 @@ Element.addMethods({
node.select();
}
}
- },
-
- getColumnsWidth: function(element) {
- element = $(element);
- var widths = new Array();
- if (element.tagName == 'TABLE') {
- var cells = TableKit.getHeaderCells(element);
- for (var i = 0; i < cells.length; i++) {
- widths[i] = $(cells[i]).getWidth();
- }
- }
- return widths;
- },
-
- setColumnsWidth: function(element, widths) {
- element = $(element);
- if (element.tagName == 'TABLE') {
- for (var i = 0; i < widths.length; i++) {
- TableKit.Resizable.resize(element, i, widths[i]);
- }
- }
}
-
}); // Element.addMethods
diff --git a/UI/WebServerResources/MailerUI.css b/UI/WebServerResources/MailerUI.css
index c1ac5c7dd..a8cad3cd4 100644
--- a/UI/WebServerResources/MailerUI.css
+++ b/UI/WebServerResources/MailerUI.css
@@ -52,7 +52,7 @@ DIV#mailboxContent
left: 0px;
right: 0px;
height: 15.5em;
- overflow: scroll;
+ overflow: auto;
overflow-x: hidden; }
DIV#messageContent
@@ -475,10 +475,16 @@ TABLE#addr_table
}
TABLE#messageList
-{ /*width: 100%;*/ }
+{ width: 100%; }
-TABLE#messageList TD
-{ height: 1.2em; }
+TABLE#messageList TD,
+TABLE#messageList TH
+{ height: 1.2em;
+ overflow: hidden;
+ white-space: nowrap; }
+
+TABLE#messageList TH
+{ white-space: pre; }
TD#messageFlagHeader,
TABLE#messageList TD.messageFlagColumn
@@ -500,8 +506,7 @@ TABLE#messageList TD.messageAddressColumn
overflow: hidden; }
TD#dateHeader,
-TABLE#messageList TD.tbtv_date_headercell,
-TABLE#messageList TD.messageDateColumn
+TABLE#messageList TD.tbtv_date_headercell
{ /*width: 25%;*/
overflow: hidden; }
@@ -516,18 +521,6 @@ TABLE#messageList TR._deleted TD
text-decoration: line-through;
}
-TABLE#messageList TD.resize-handle-active
-{ cursor: e-resize; }
-
-DIV.resize-handle
-{ cursor: e-resize;
- width: 2px;
- border-right: 1px solid #fff;
- position: absolute;
- top: 0;
- left: 0;
- max-height: 2em; }
-
/* drag handles */
DIV#verticalDragHandle
{
diff --git a/UI/WebServerResources/MailerUI.js b/UI/WebServerResources/MailerUI.js
index 074a94f94..afb052b7a 100644
--- a/UI/WebServerResources/MailerUI.js
+++ b/UI/WebServerResources/MailerUI.js
@@ -342,7 +342,7 @@ function onMailboxTreeItemClick(event) {
else
openMailbox(mailbox);
- preventDefault(event);
+ Event.stop(event);
}
function onMailboxMenuMove() {
@@ -415,7 +415,6 @@ function openMailbox(mailbox, reload, idx) {
+ rightDragHandle.offsetHeight
+ 'px') });
}
-
document.messageListAjaxRequest
= triggerAjaxRequest(url, messageListCallback,
currentMessage);
@@ -429,18 +428,34 @@ function openMailbox(mailbox, reload, idx) {
function openMailboxAtIndex(event) {
openMailbox(currentMailbox, true, this.getAttribute("idx"));
- preventDefault(event);
+ Event.stop(event);
}
function messageListCallback(http) {
- var div = $('mailboxContent');
-
+ var table = $('messageList');
+
if (http.readyState == 4
&& http.status == 200) {
document.messageListAjaxRequest = null;
- div.update(http.responseText);
- TableKit.Resizable.init($('messageList'));
+ if (table) {
+ // Update table
+ var thead = table.tHead;
+ var tbody = table.tBodies[0];
+ var tmp = document.createElement('div');
+ $(tmp).update(http.responseText);
+ thead.rows[1].parentNode.replaceChild(tmp.firstChild.tHead.rows[1], thead.rows[1]);
+ table.replaceChild(tmp.firstChild.tBodies[0], tbody);
+ }
+ else {
+ // Add table
+ var div = $('mailboxContent');
+ div.update(http.responseText);
+ table = $('messageList');
+ configureMessageListEvents(table);
+ TableKit.Resizable.init(table, {'trueResize' : true, 'keepWidth' : true});
+ }
+ configureMessageListBodyEvents(table);
var selected = http.callbackData;
if (selected) {
@@ -448,20 +463,16 @@ function messageListCallback(http) {
if (row)
row.select();
}
- configureMessageListEvents();
if (sorting["attribute"] && sorting["attribute"].length > 0) {
- var sortHeader;
- if (sorting["attribute"] == "subject")
- sortHeader = $("subjectHeader");
- else if (sorting["attribute"] == "from")
- sortHeader = $("fromHeader");
- else if (sorting["attribute"] == "date")
- sortHeader = $("dateHeader");
- else
- sortHeader = null;
-
+ var sortHeader = $(sorting["attribute"] + "Header");
+
if (sortHeader) {
+ var sortImages = $(table.tHead).getElementsByClassName("sortImage");
+ $(sortImages).each(function(item) {
+ item.remove();
+ });
+
var sortImage = createElement("img", "messageSortImage", "sortImage");
sortHeader.insertBefore(sortImage, sortHeader.firstChild);
if (sorting["ascending"])
@@ -626,7 +637,7 @@ function storeCachedMessage(cachedMessage) {
cachedMessages[oldest] = cachedMessage;
}
-function onMessageSelectionChange() {
+function onMessageSelectionChange() { log ("onMessageSelectionChange");
var rows = this.getSelectedRowsId();
if (rows.length == 1) {
@@ -857,7 +868,7 @@ function onHeaderClick(event) {
newSortAttribute = "date";
else
newSortAttribute = "arrival";
-
+ log ("new sort attribute = " + newSortAttribute);
if (sorting["attribute"] == newSortAttribute)
sorting["ascending"] = !sorting["ascending"];
else {
@@ -866,7 +877,7 @@ function onHeaderClick(event) {
}
refreshCurrentFolder();
-
+
Event.stop(event);
}
@@ -956,35 +967,33 @@ var messageListData = function(type) {
/* a model for a futur refactoring of the sortable table headers mechanism */
-function configureMessageListHeaders(cells) {
- for (var i = 0; i < cells.length; i++) {
- var currentCell = $(cells[i]);
- Event.observe(currentCell, "click",
- onHeaderClick.bindAsEventListener(currentCell));
- //Event.observe(currentCell, "mousedown", listRowMouseDownHandler);
+
+function configureMessageListEvents(table) {
+ if (table) {
+ // Each body row can load a message
+ Event.observe(table, "mousedown",
+ onMessageSelectionChange.bindAsEventListener(table));
+
+ // Sortable columns
+ configureSortableTableHeaders(table);
}
}
-function configureMessageListEvents() {
- var messageList = $("messageList");
- if (messageList) {
- Event.observe(messageList, "mousedown",
- onMessageSelectionChange.bindAsEventListener(messageList));
-
- configureMessageListHeaders(messageList.tHead.rows[0].cells);
-
- var cell = messageList.tHead.rows[1].cells[0];
+function configureMessageListBodyEvents(table) {
+ if (table) {
+ // Page navigation
+ var cell = table.tHead.rows[1].cells[0];
if ($(cell).hasClassName("tbtv_navcell")) {
var anchors = $(cell).childNodesWithTag("a");
for (var i = 0; i < anchors.length; i++)
Event.observe(anchors[i], "click", openMailboxAtIndex.bindAsEventListener(anchors[i]));
}
- rows = messageList.tBodies[0].rows;
+ rows = table.tBodies[0].rows;
for (var i = 0; i < rows.length; i++) {
Event.observe(rows[i], "mousedown", onRowClick);
Event.observe(rows[i], "contextmenu", onMessageContextMenu.bindAsEventListener(rows[i]));
-
+
rows[i].dndTypes = function() { return new Array("mailRow"); };
rows[i].dndGhost = messageListGhost;
rows[i].dndDataForType = messageListData;
diff --git a/UI/WebServerResources/SchedulerUI.css b/UI/WebServerResources/SchedulerUI.css
index 8bea4af88..18719a020 100644
--- a/UI/WebServerResources/SchedulerUI.css
+++ b/UI/WebServerResources/SchedulerUI.css
@@ -69,7 +69,8 @@ UL#tasksList, UL#calendarList
overflow-x: hidden; }
UL#calendarList
-{ clear: both;
+{ clear: left;
+ width: 100%;
height: 10.5em;
margin: 0px; }
@@ -266,13 +267,19 @@ TABLE#dateSelectorTable
border: 1px solid #deebf7; }
TABLE#eventsList
-{ display: block;
- position: relative;
- width: 100%; }
+{ width: 100%; }
-TABLE#eventsList td.headerTitle,
-TABLE#eventsList td.headerLocation
-{ width: 35%; }
+TABLE#eventsList TD.headerTitle,
+TABLE#eventsList TD.headerDateTime
+{ width: 30%; }
+
+TABLE#eventsList TD,
+TABLE#eventsList TH
+{ overflow: hidden;
+ white-space: nowrap; } /* pre, normal, nowrap */
+
+TABLE#eventsList TH
+{ white-space: pre; }
._unfocused#dateSelector TD._selected,
UL._unfocused > LI._selected,
diff --git a/UI/WebServerResources/SchedulerUI.js b/UI/WebServerResources/SchedulerUI.js
index 8a4d6aa42..043d4ddcd 100644
--- a/UI/WebServerResources/SchedulerUI.js
+++ b/UI/WebServerResources/SchedulerUI.js
@@ -307,16 +307,15 @@ function eventsListCallback(http) {
var div = $("eventsListView");
document.eventsListAjaxRequest = null;
- var table = $("eventsList").tBodies[0];
+ var table = $("eventsList");
var params = parseQueryParameters(http.callbackData);
sortKey = params["sort"];
sortOrder = params["desc"];
- configureSortableTableHeaders();
var data = http.responseText.evalJSON(true);
for (var i = 0; i < data.length; i++) {
var row = document.createElement("tr");
- table.appendChild(row);
+ table.tBodies[0].appendChild(row);
$(row).addClassName("eventRow");
row.setAttribute("id", escape(data[i][0]));
row.cname = escape(data[i][0]);
@@ -771,7 +770,7 @@ function calendarDisplayCallback(http) {
if (http.readyState == 4
&& http.status == 200) {
document.dayDisplayAjaxRequest = null;
- div.innerHTML = http.responseText;
+ div.update(http.responseText);
if (http.callbackData["view"])
currentView = http.callbackData["view"];
if (http.callbackData["day"])
@@ -927,8 +926,8 @@ function _loadTasksHref(href) {
}
function onHeaderClick(event) {
-// log("onHeaderClick: " + this.link);
- _loadEventHref(this.link);
+ //log("onHeaderClick: " + this.link);
+ //_loadEventHref(this.link);
preventDefault(event);
}
@@ -1544,6 +1543,8 @@ function configureLists() {
list = $("eventsList");
list.multiselect = true;
+ //configureSortableTableHeaders(list);
+ TableKit.Resizable.init(list, {'trueResize' : true, 'keepWidth' : true});
Event.observe(list, "mousedown",
onEventsSelectionChange.bindAsEventListener(list));
var div = list.parentNode;
diff --git a/UI/WebServerResources/generic.css b/UI/WebServerResources/generic.css
index 861e7d2fc..d694da7c9 100644
--- a/UI/WebServerResources/generic.css
+++ b/UI/WebServerResources/generic.css
@@ -701,6 +701,20 @@ INPUT.checkBox
-moz-border-bottom-colors: #000 #fff;
-moz-border-right-colors: #000 #fff; }
+/* tablekit resizable columns */
+
+TABLE TD.resize-handle-active
+{ cursor: e-resize; }
+
+DIV.resize-handle
+{ cursor: e-resize;
+ width: 2px;
+ border-right: 1px solid #fff;
+ position: absolute;
+ top: 0;
+ left: 0;
+ max-height: 2em; }
+
@media print
{
BODY
diff --git a/UI/WebServerResources/generic.js b/UI/WebServerResources/generic.js
index 9a7c60538..e341d4be0 100644
--- a/UI/WebServerResources/generic.js
+++ b/UI/WebServerResources/generic.js
@@ -222,7 +222,7 @@ function openContactWindow(url, wId) {
return w;
}
-function openMailComposeWindow(url, wId) { log (url);
+function openMailComposeWindow(url, wId) {
if (!wId)
wId = "" + (new Date().getTime());
var w = window.open(url, wId,
@@ -1046,7 +1046,8 @@ function accessToSubscribedFolder(serverFolder) {
}
function listRowMouseDownHandler(event) {
- preventDefault(event);
+ preventDefault(event);
+ //Event.stop(event);
}
/* tabs */
@@ -1301,7 +1302,6 @@ function onLoadHandler(event) {
initMenus();
initTabs();
configureDragHandles();
- configureSortableTableHeaders();
configureLinkBanner();
translateLabels();
var progressImage = $("progressIndicator");
@@ -1326,14 +1326,11 @@ function onBodyClickContextMenu(event) {
preventDefault(event);
}
-function configureSortableTableHeaders() {
- var headers = document.getElementsByClassName("sortableTableHeader");
+function configureSortableTableHeaders(table) {
+ var headers = $(table).getElementsByClassName("sortableTableHeader");
for (var i = 0; i < headers.length; i++) {
var header = headers[i];
- var anchor = $(header).childNodesWithTag("a")[0];
- if (anchor)
- Event.observe(anchor, "click",
- onHeaderClick.bindAsEventListener(anchor));
+ Event.observe(header, "click", onHeaderClick.bindAsEventListener(header))
}
}
diff --git a/UI/WebServerResources/tablekit.js b/UI/WebServerResources/tablekit.js
index b7e78ffbe..cda8431a4 100644
--- a/UI/WebServerResources/tablekit.js
+++ b/UI/WebServerResources/tablekit.js
@@ -535,6 +535,16 @@ TableKit.Resizable = {
Event.observe(c, 'mouseout', TableKit.Resizable.killDetect);
});
},
+ reload : function(table) {
+ table = $(table);
+ var cells = TableKit.getHeaderCells(table);
+ cells.each(function(c){
+ c = $(c);
+ Event.stopObserving(c, 'mouseover', TableKit.Resizable.initDetect);
+ Event.stopObserving(c, 'mouseout', TableKit.Resizable.killDetect);
+ });
+ TableKit.Resizable.init(table);
+ },
resize : function(table, index, w) {
var cell;
if(typeof index === 'number') {