From fcfb2c32004dc9dae4c55a40d6498d56a2f8c188 Mon Sep 17 00:00:00 2001 From: Francis Lachapelle Date: Thu, 18 Sep 2008 18:03:59 +0000 Subject: [PATCH] Monotone-Parent: 56874b8e1d2260289bbdde17c8dbc01a15f354e7 Monotone-Revision: 6fed1c4d16e6a86a4b38ab7174119068a10f5ede Monotone-Author: flachapelle@inverse.ca Monotone-Date: 2008-09-18T18:03:59 Monotone-Branch: ca.inverse.sogo --- UI/WebServerResources/ContactsUI.js | 12 +++ UI/WebServerResources/MailerUI.js | 16 +++- UI/WebServerResources/SOGoDragHandles.js | 101 +++++++++++++++-------- UI/WebServerResources/SchedulerUI.js | 14 +++- 4 files changed, 107 insertions(+), 36 deletions(-) diff --git a/UI/WebServerResources/ContactsUI.js b/UI/WebServerResources/ContactsUI.js index b325ae2ec..d97fef2e0 100644 --- a/UI/WebServerResources/ContactsUI.js +++ b/UI/WebServerResources/ContactsUI.js @@ -987,6 +987,15 @@ function configureSelectionButtons() { } } +function onWindowResize(event) { + var handle = $("dragHandle"); + if (handle) + handle.adjust(); + handle = $("rightDragHandle"); + if (handle) + handle.adjust(); +} + function initContacts(event) { if (document.body.hasClassName("popup")) configureSelectionButtons(); @@ -1003,6 +1012,9 @@ function initContacts(event) { configureSortableTableHeaders(table); TableKit.Resizable.init(table, {'trueResize' : true, 'keepWidth' : true}); } + + Event.observe(window, "resize", onWindowResize); + onWindowResize(null); // Default sort options sorting["attribute"] = "displayName"; diff --git a/UI/WebServerResources/MailerUI.js b/UI/WebServerResources/MailerUI.js index 6e11b9b42..c0d4cce51 100644 --- a/UI/WebServerResources/MailerUI.js +++ b/UI/WebServerResources/MailerUI.js @@ -1221,7 +1221,7 @@ function configureDragHandles() { var handle = $("verticalDragHandle"); if (handle) { handle.addInterface(SOGoDragHandlesInterface); - handle.leftMargin = 1; + handle.leftMargin = 50; handle.leftBlock=$("leftPanel"); handle.rightBlock=$("rightPanel"); } @@ -1234,6 +1234,15 @@ function configureDragHandles() { } } +function onWindowResize(event) { + var handle = $("verticalDragHandle"); + if (handle) + handle.adjust(); + handle = $("rightDragHandle"); + if (handle) + handle.adjust(); +} + /* dnd */ function initDnd() { // log("MailerUI initDnd"); @@ -1283,6 +1292,9 @@ function initMailer(event) { Event.observe(document, "keydown", onDocumentKeydown); } + Event.observe(window, "resize", onWindowResize); + onWindowResize(null); + // Default sort options sorting["attribute"] = "date"; sorting["ascending"] = false; @@ -1368,7 +1380,7 @@ function updateMailboxTreeInPage() { var text = format.formatted(Mailer.quotas.usedSpace, Mailer.quotas.maxQuota, percents); var quotaDiv = new Element('div', { 'class': 'quota', 'info': text }); var levelDiv = new Element('div', { 'class': 'level' }); - var valueDiv = new Element('div', { 'class': 'value ' + level, 'style': 'width: ' + percents + '%' }); + var valueDiv = new Element('div', { 'class': 'value ' + level, 'style': 'width: ' + ((percents > 100)?100:percents) + '%' }); var marksDiv = new Element('div', { 'class': 'marks' }); marksDiv.appendChild(new Element('div')); marksDiv.appendChild(new Element('div')); diff --git a/UI/WebServerResources/SOGoDragHandles.js b/UI/WebServerResources/SOGoDragHandles.js index 6ac411987..2633a57b1 100644 --- a/UI/WebServerResources/SOGoDragHandles.js +++ b/UI/WebServerResources/SOGoDragHandles.js @@ -2,9 +2,9 @@ var SOGoDragHandlesInterface = { leftMargin: 180, - topMargin: 120, + topMargin: 140, dhType: null, - dhLimit: null, + dhLimit: -1, origX: -1, origLeft: -1, origRight: -1, @@ -19,37 +19,60 @@ var SOGoDragHandlesInterface = { startHandleDraggingBound: null, stopHandleDraggingBound: null, moveBound: null, + delayedSave: null, bind: function () { this.startHandleDraggingBound = this.startHandleDragging.bindAsEventListener(this); this.observe("mousedown", this.startHandleDraggingBound, false); }, + adjust: function () { + if (!this.dhType) + this._determineType(); + if (this.dhType == 'horizontal') { + this.dhLimit = window.width() - 20; + if (parseInt(this.getStyle("left")) > this.dhLimit) { + this.setStyle({ left: this.dhLimit + "px" }); + this.rightBlock.setStyle({ left: (this.dhLimit) + 'px' }); + this.leftBlock.setStyle({ width: (this.dhLimit) + 'px' }); + if (this.delayedSave) window.clearTimeout(this.delayedSave); + this.delayedSave = this.saveDragHandleState.delay(3, this.dhType, this.dhLimit, this.saveDragHandleStateCallback); + } + } + else if (this.dhType == 'vertical') { + this.dhLimit = window.height() - 20 - this.upperBlock.cumulativeOffset()[1] + this.upperBlock.offsetTop; + if (parseInt(this.getStyle("top")) > this.dhLimit) { + this.setStyle({ top: this.dhLimit + 'px' }); + this.lowerBlock.setStyle({ top: this.dhLimit + 'px' }); + this.upperBlock.setStyle({ height: (this.dhLimit - this.upperBlock.offsetTop) + 'px' }); + if (this.delayedSave) window.clearTimeout(this.delayedSave); + this.delayedSave = this.saveDragHandleState.delay(3, this.dhType, this.dhLimit, this.saveDragHandleStateCallback); + } + } + }, _determineType: function () { - if (this.leftBlock && this.rightBlock) { + if (this.leftBlock && this.rightBlock) this.dhType = 'horizontal'; - this.dhLimit = window.width() - 10; - } - else if (this.upperBlock && this.lowerBlock) { + else if (this.upperBlock && this.lowerBlock) this.dhType = 'vertical'; - this.dhLimit = window.height() - 10; - } }, - startHandleDragging: function (event) { log("startHandleDragging"); + startHandleDragging: function (event) { if (!this.dhType) this._determineType(); var targ = getTarget(event); if (targ.nodeType == 1) { if (this.dhType == 'horizontal') { + this.dhLimit = window.width() - 20; this.origX = this.offsetLeft; this.origLeft = this.leftBlock.offsetWidth; - delta = 0; + this.delta = 0; this.origRight = this.rightBlock.offsetLeft - 5; document.body.setStyle({ cursor: "e-resize" }); } else if (this.dhType == 'vertical') { + this.dhLimit = window.height() - 20; this.origY = this.offsetTop; this.origUpper = this.upperBlock.offsetHeight; var pointY = Event.pointerY(event); - if (pointY <= this.topMargin) delta = this.topMargin; - else delta = pointY - this.offsetTop - 5; + if (pointY <= this.topMargin) this.delta = this.topMargin; + else this.delta = pointY - this.offsetTop - 5; this.origLower = this.lowerBlock.offsetTop - 5; document.body.setStyle({ cursor: "n-resize" }); } @@ -72,6 +95,10 @@ var SOGoDragHandlesInterface = { this.rightBlock.setStyle({ left: (this.leftMargin) + 'px' }); this.leftBlock.setStyle({ width: (this.leftMargin) + 'px' }); } + else if (pointerX >= this.dhLimit) { + this.rightBlock.setStyle({ left: (this.dhLimit) + 'px' }); + this.leftBlock.setStyle({ width: (this.dhLimit) + 'px' }); + } else { var deltaX = Math.floor(pointerX - this.origX - (this.offsetWidth / 2)); this.rightBlock.setStyle({ left: (this.origRight + deltaX) + 'px' }); @@ -81,15 +108,16 @@ var SOGoDragHandlesInterface = { } else if (this.dhType == 'vertical') { var pointerY = Event.pointerY(event); - if (pointerY <= this.topMargin) { - this.lowerBlock.setStyle({ top: (this.topMargin - delta) + 'px' }); - this.upperBlock.setStyle({ height: (this.topMargin - delta) + 'px' }); - } - else { - var deltaY = Math.floor(pointerY - this.origY - (this.offsetHeight / 2)); - this.lowerBlock.setStyle({ top: (this.origLower + deltaY - delta) + 'px' }); - this.upperBlock.setStyle({ height: (this.origUpper + deltaY - delta) + 'px' }); - } + var deltaY; + if (pointerY <= this.topMargin) + deltaY = Math.floor(this.topMargin - this.origY - (this.offsetHeight / 2)); + else if (pointerY >= this.dhLimit) + deltaY = Math.floor(this.dhLimit - this.origY - (this.offsetHeight / 2)); + else + deltaY = Math.floor(pointerY - this.origY - (this.offsetHeight / 2)); + this.lowerBlock.setStyle({ top: (this.origLower + deltaY - this.delta) + 'px' }); + this.upperBlock.setStyle({ height: (this.origUpper + deltaY - this.delta) + 'px' }); + this.saveDragHandleState(this.dhType, parseInt(this.lowerBlock.getStyle("top"))); } Event.stopObserving(document.body, "mouseup", this.stopHandleDraggingBound, true); @@ -106,20 +134,27 @@ var SOGoDragHandlesInterface = { if (this.dhType == 'horizontal') { var hX = Event.pointerX(event); var width = this.offsetWidth; - if (hX < this.leftMargin) + if (hX < this.leftMargin) { hX = this.leftMargin + Math.floor(width / 2); - else if (hX > this.dhLimit) - log ("limit"); + this.stopHandleDragging(event); + } else if (hX > this.dhLimit) { + if (hX > (this.dhLimit + 5)) + this.stopHandleDragging(event); + hX = this.dhLimit + Math.floor(width / 2); + } var newLeft = Math.floor(hX - (width / 2)); this.setStyle({ left: newLeft + 'px' }); } else if (this.dhType == 'vertical') { - var height = this.offsetHeight; var hY = Event.pointerY(event); + var height = this.offsetHeight; if (hY < this.topMargin) - hY = this.topMargin + Math.floor(height / 2); - else if (hY > this.dhLimit) - log ("limit"); - var newTop = Math.floor(hY - (height / 2)) - delta; + hY = this.topMargin; + else if (hY > this.dhLimit) { + if (hY > (this.dhLimit + 5)) + this.stopHandleDragging(event); + hY = this.dhLimit; + } + var newTop = Math.floor(hY - (height / 2)) - this.delta; this.setStyle({ top: newTop + 'px' }); } Event.stop(event); @@ -149,14 +184,14 @@ var SOGoDragHandlesInterface = { } } }, - saveDragHandleState: function (type, position) { + saveDragHandleState: function (type, position, fcn) { if (!$(document.body).hasClassName("popup")) { var urlstr = ApplicationBaseURL + "saveDragHandleState" + "?" + type + "=" + position; - triggerAjaxRequest(urlstr, this.saveDragHandleStateCallback); + var callbackFunction = fcn || this.saveDragHandleStateCallback; + triggerAjaxRequest(urlstr, callbackFunction); } - }, - + }, saveDragHandleStateCallback: function (http) { if (isHttpStatus204(http.status)) { log ("drag handle state saved"); diff --git a/UI/WebServerResources/SchedulerUI.js b/UI/WebServerResources/SchedulerUI.js index f505cebf9..6f787a0e5 100644 --- a/UI/WebServerResources/SchedulerUI.js +++ b/UI/WebServerResources/SchedulerUI.js @@ -73,7 +73,7 @@ function _editEventId(id, calendar, recurrence) { urlstr += "/" + recurrence; targetname += recurrence; } - urlstr += "/edit"; log (urlstr); + urlstr += "/edit"; var win = window.open(urlstr, "_blank", "width=490,height=470,resizable=0"); if (win) @@ -1940,6 +1940,15 @@ function onBodyClickHandler(event) { $("eventDialog").hide(); } +function onWindowResize(event) { + var handle = $("verticalDragHandle"); + if (handle) + handle.adjust(); + handle = $("rightDragHandle"); + if (handle) + handle.adjust(); +} + function initCalendars() { sorting["attribute"] = "start"; sorting["ascending"] = true; @@ -1954,6 +1963,9 @@ function initCalendars() { selector.attachMenu("calendarsMenu"); $(document.body).observe("click", onBodyClickHandler); } + + Event.observe(window, "resize", onWindowResize); + onWindowResize(null); } FastInit.addOnLoad(initCalendars);