From c91e09a1c4bef947af1a5b390e8c3913e6e4a1c8 Mon Sep 17 00:00:00 2001 From: Antoine Nguyen Date: Mon, 29 Sep 2014 21:54:09 +0200 Subject: [PATCH] Few webmail fixes. see #585 --- .../webmail/static/webmail/css/webmail.css | 12 +-- .../webmail/static/webmail/js/webmail.js | 89 +++++++++++++++---- .../templates/webmail/attachments.html | 2 +- .../webmail/templatetags/webmail_tags.py | 16 ++-- 4 files changed, 87 insertions(+), 32 deletions(-) diff --git a/modoboa/extensions/webmail/static/webmail/css/webmail.css b/modoboa/extensions/webmail/static/webmail/css/webmail.css index f3b709d82..dd85f5f6b 100644 --- a/modoboa/extensions/webmail/static/webmail/css/webmail.css +++ b/modoboa/extensions/webmail/static/webmail/css/webmail.css @@ -97,7 +97,11 @@ body, html { .nav-sidebar li > a { padding-top: 7px; padding-bottom: 7px; -} +} + +.nav-sidebar li li { + margin-left: 10px; +} #mboxes_container a[name=loadfolder] { white-space: nowrap; @@ -190,14 +194,10 @@ div.expanded { background-repeat: no-repeat; } -div#leftcol #mboxes_container .nav .droppable div.clickbox{ +div#leftcol #mboxes_container .nav .droppable div.clickbox { z-index: 800; } -li.droppable li{ - margin-left: 10px; -} - /* * Compose form */ diff --git a/modoboa/extensions/webmail/static/webmail/js/webmail.js b/modoboa/extensions/webmail/static/webmail/js/webmail.js index c250ee9a2..d49de0ba8 100644 --- a/modoboa/extensions/webmail/static/webmail/js/webmail.js +++ b/modoboa/extensions/webmail/static/webmail/js/webmail.js @@ -1,5 +1,9 @@ -/* - * The javascript code that brings the webmail to life! +/** + * Creates an instance of Webmail. + * + * @constructor + * @param {Object} options - instance options + * @classdesc The javascript code that brings the webmail to life! */ var Webmail = function(options) { this.initialize(options); @@ -99,6 +103,11 @@ Webmail.prototype = { this.listen(); }, + /** + * Register navigation callbacks. + * + * @this Webmail + */ register_navcallbacks: function() { this.navobject.register_callback( "listmailbox", $.proxy(this.listmailbox_callback, this)); @@ -330,6 +339,12 @@ Webmail.prototype = { } }, + /** + * Update the current displayed content. + * + * @this Webmail + * @param {Object} response - object containing the new content + */ page_update: function(response) { var curmb = this.get_current_mailbox(); @@ -431,8 +446,11 @@ Webmail.prototype = { } }, - /* - * Inject a new *clickbox* somewhere in the tree + /** + * Inject a new *clickbox* somewhere in the tree. + * + * @this Webmail + * @param {Object} $container - box container */ inject_clickbox: function($container) { $container.prepend($("
", {'class' : 'clickbox collapsed'})); @@ -467,10 +485,12 @@ Webmail.prototype = { return $li; }, - /* + /** * Inject new mailboxes under a given parent in the tree. * - * $parent must be a
  • node. + * @this Webmail + * @param {Object} $parent - an existing
  • node. + * @param {Array} mboxes - list of mailboxes to inject */ inject_mailboxes: function($parent, mboxes) { var $ul = $("
      ", { @@ -500,6 +520,10 @@ Webmail.prototype = { /** * Download mailboxes from the server. + * + * @this Webmail + * @param {Object} parent - parent node where mailboxes will be appended + * @param {boolean} async - if true, the ajax call will be asynchronous */ get_mailboxes: function(parent, async) { if (async === undefined) { @@ -519,6 +543,10 @@ Webmail.prototype = { * Open/Close a mailbox with children. * * This is an internal method. + * + * @this Webmail + * @param {Object} $div - the
      that was clicked + * @param {Object} $ul - the
        element to show/hide */ toggle_mbox_state: function($div, $ul) { if ($ul.hasClass("hidden")) { @@ -531,15 +559,19 @@ Webmail.prototype = { }, /** - * Open or close a mailbox (user triggered). + * Click event : open or close a mailbox (user triggered). * * The first time it is opened, sub mailboxes will be downloaded * from the server and injected into the tree. + * + * @this Webmail + * @param {Object} e - event object */ mbox_state_callback: function(e) { e.preventDefault(); + e.stopPropagation(); var $div = $(e.target); - var $parent = $div.parents("li"); + var $parent = $div.parents("li").first(); var $ul = $parent.find('ul[name="' + $parent.attr("name") + '"]'); if (!$ul.length) { @@ -549,15 +581,18 @@ Webmail.prototype = { this.toggle_mbox_state($div, $ul); }, - /* - * Unselect every selected mailbox + /** + * Unselect every selected mailbox. */ reset_mb_selection: function() { $("a[name=loadfolder]").parent().removeClass("active").addClass("droppable"); }, /** - * Select a particular mailbox (one already present in the DOM) + * Select a particular mailbox (one already present in the DOM). + * + * @this Webmail + * @param {Object|string} obj - mailbox to select */ select_mailbox: function(obj) { var $obj = (typeof obj != "string") ? $(obj) : $('a[href="' + obj + '"]'); @@ -568,10 +603,13 @@ Webmail.prototype = { $obj.parent().addClass("active"); }, - /* - * Tries to select a particular sub-mailbox and loads it from the + /** + * Try to select a particular sub-mailbox and load it from the * server if it's not present in the DOM. (nb: all parents needed * to access this mailbox are also loaded) + * + * @this Webmail + * @param {string} mailbox - mailbox to select */ load_and_select_mailbox: function(mailbox) { if (mailbox.indexOf(this.options.hdelimiter) == -1) { @@ -847,7 +885,7 @@ Webmail.prototype = { * Onclick callback used to load the content of a particular * mailbox. (activated when clicking on a mailbox's name) */ - _listmailbox_loader: function(event, obj) { + _listmailbox_loader: function(event, obj, reset_page) { if (event) { event.preventDefault(); } @@ -856,10 +894,20 @@ Webmail.prototype = { } this.navobject.reset().setparams({ action: "listmailbox", - mbox: obj.attr("href") - }).update(); + mbox: obj.attr("href"), + }); + if (reset_page) { + this.navobject.setparam("reset_page", reset_page); + } + this.navobject.update(); }, + /** + * Click event: list the content of a particular mailbox. + * + * @this Webmail + * @param {Object} event - event object + */ listmailbox_loader: function(event) { var $target = get_target(event, "a"); @@ -868,7 +916,7 @@ Webmail.prototype = { return; } this.select_mailbox(event.target); - this._listmailbox_loader(event, $target); + this._listmailbox_loader(event, $target, true); }, /* @@ -954,8 +1002,11 @@ Webmail.prototype = { * Ajax navigation callbacks */ - /* - * 'listmailbox' callback + /** + * Navigation callback: listmailbox. + * + * @this Webmail + * @param {Object} resp - ajax response (JSON) */ listmailbox_callback: function(resp) { this.store_nav_params(); diff --git a/modoboa/extensions/webmail/templates/webmail/attachments.html b/modoboa/extensions/webmail/templates/webmail/attachments.html index e416654a7..22d02a7de 100644 --- a/modoboa/extensions/webmail/templates/webmail/attachments.html +++ b/modoboa/extensions/webmail/templates/webmail/attachments.html @@ -18,7 +18,7 @@
        - +
        diff --git a/modoboa/extensions/webmail/templatetags/webmail_tags.py b/modoboa/extensions/webmail/templatetags/webmail_tags.py index e59439936..238bad08a 100644 --- a/modoboa/extensions/webmail/templatetags/webmail_tags.py +++ b/modoboa/extensions/webmail/templatetags/webmail_tags.py @@ -125,8 +125,10 @@ def listmailbox_menu(selection, folder, user): @register.simple_tag -def print_mailboxes(tree, selected=None, withunseen=False, selectonly=False, hdelimiter='.'): - """Display a tree of mailboxes and sub-mailboxes +def print_mailboxes( + tree, selected=None, withunseen=False, selectonly=False, + hdelimiter='.'): + """Display a tree of mailboxes and sub-mailboxes. :param tree: the mailboxes to display """ @@ -148,10 +150,6 @@ def print_mailboxes(tree, selected=None, withunseen=False, selectonly=False, hde cssclass += " unseen" extra_attrs = ' data-toggle="%d"' % mbox["unseen"] - result += "" % ( - "path" in mbox and mbox["path"] or mbox["name"], cssclass, - 'selectfolder' if selectonly else 'loadfolder', extra_attrs - ) if "sub" in mbox: if selected is not None and selected != name and selected.count(name): ul_state = "visible" @@ -161,6 +159,11 @@ def print_mailboxes(tree, selected=None, withunseen=False, selectonly=False, hde div_state = "collapsed" result += "
        " % div_state + result += "        " % ( + "path" in mbox and mbox["path"] or mbox["name"], cssclass, + 'selectfolder' if selectonly else 'loadfolder', extra_attrs + ) + iclass = mbox["class"] if "class" in mbox \ else "fa fa-folder" result += " %s" % (iclass, label) @@ -173,6 +176,7 @@ def print_mailboxes(tree, selected=None, withunseen=False, selectonly=False, hde result += "\n" return result + @register.simple_tag def mboxes_menu(): """Mailboxes menu."""