More intuitive message selection.

modoboa/extensions/amavis/static/amavis/css/quarantine.css

@@ -8,6 +8,10 @@
     z-index: 10;
 }
 
+#menubar input[type="checkbox"] {
+    margin: 0;
+}
+
 #listing { 
     position: fixed;
     padding: 0 15px;

modoboa/extensions/amavis/static/amavis/js/quarantine.js

@@ -19,6 +19,7 @@ Quarantine.prototype = {
         this.listen();
         this.set_msgtype();
 
+        $(document).on('click', '#selectall', this.toggle_selection);
         $("#searchfield").searchbar({navobj: this.navobj});
     },
 
@@ -92,20 +93,42 @@ Quarantine.prototype = {
         this.navobj.update();
     },
 
-    selectmsgs: function(e) {
-        e.preventDefault();
-        var type = $(e.target).attr("href");
-
-        if (type == "") {
+    /*
+     * Toggle message selection when the top checkbox's state is
+     * modified.
+     *
+     * If it is checked, all messages are selected. Otherwise, the
+     * current selection is resetted.
+     */
+    toggle_selection: function(e) {
+        if (!$('#selectall').prop('checked')) {
             $("#emails").htmltable("clear_selection");
             return;
         }
+        $("td[name=type]").each(function() {
+            var $this = $(this);
+            $("#emails").htmltable("select_row", $this.parent());
+        });
+    },
+
+    /*
+     * Select all messages of a specific type.
+     */
+    selectmsgs: function(e) {
+        e.preventDefault();
+        var type = get_target(e, 'a').attr("href");
+        var counter = 0;
+
         $("td[name=type]").each(function() {
             var $this = $(this);
             if ($this.find('span').html().trim() == type) {
                 $("#emails").htmltable("select_row", $this.parent());
+                counter++;
             }
         });
+        if (counter) {
+            $("#selectall").prop('checked', true);
+        }
     },
 
     /*
@@ -227,12 +250,28 @@ Quarantine.prototype = {
             $.proxy(this.viewmail_cb, this));
     },
 
+    activate_buttons: function($tr) {
+        $("a[name=release-multi]").removeClass('disabled');
+        $("a[name=delete-multi]").removeClass('disabled');
+    },
+
+    deactivate_buttons: function($tr) {
+        if (!this.htmltable.current_selection().length) {
+            $("a[name=release-multi]").addClass('disabled');
+            $("a[name=delete-multi]").addClass('disabled');
+        }
+    },
+
     listing_cb: function(data) {
         this.update_page(data);
         this.navobj.delparam("rcpt").update();
         this.set_msgtype();
-        $("#emails").htmltable();
+        $("#emails").htmltable({
+            tr_selected_event: this.activate_buttons,
+            tr_unselected_event: $.proxy(this.deactivate_buttons, this)
+        });
         this.htmltable = $("#emails").data("htmltable");
+        this.deactivate_buttons();
     },
 
     viewmail_cb: function(data) {

modoboa/extensions/amavis/templates/amavis/index.html

@@ -19,6 +19,6 @@ $(document).ready(function() {
 </script>
 {% endblock %}
 {% block fixed_content %}
-<div id="menubar">{% quar_menu user %}</div>
+<div id="menubar">{% quar_menu %}</div>
 <div id="listing"></div>
 {% endblock %}

modoboa/extensions/amavis/templates/amavis/main_action_bar.html

@@ -1,13 +1,38 @@
-{% extends "common/buttons_list.html" %}{% load i18n %}
-{% block extracontent %}{% include "common/email_searchbar.html" with extraopts=extraopts %}
+{% load lib_tags i18n %}
+<div class="btn-toolbar pull-left">
+  <div class="btn-group" title="{% trans 'Select' %}">
+    <a class="btn"><input type="checkbox" id="selectall" /></a>
+    <button class="btn dropdown-toggle" data-toggle="dropdown">
+      <span class="caret"></span>
+    </button>
+    <ul class="dropdown-menu">
+      <li><a name="selectmsgs" href="S">{% trans "Spam" %}</a></li>
+      <li><a name="selectmsgs" href="V">{% trans "Virus" %}</a></li>
+      <li><a name="selectmsgs" href="H">{% trans "Bad Header" %}</a></li>
+      <li><a name="selectmsgs" href="M">{% trans "Bad MIME" %}</a></li>
+      <li><a name="selectmsgs" href="B">{% trans "Banned" %}</a></li>
+    </ul>
+  </div>
+  <div class="btn-group">
+    <a name="release-multi" href="{% url 'modoboa.extensions.amavis.views.process' %}" class="btn btn-success">
+      <i class="icon-white icon-ok"></i> {% trans "Release" %}
+    </a>
+  </div>
+  <div class="btn-group">
+    <a name="delete-multi" href="{% url 'modoboa.extensions.amavis.views.process' %}" class="btn btn-danger">
+      <i class="icon-white icon-trash"></i> {% trans "Delete" %}
+    </a>
+  </div>
+  {% include "common/email_searchbar.html" with extraopts=extraopts %}
 </div>
 <div id="filters_bar" class="btn-toolbar pull-right">
+  <span class="label label-title">{% trans "Display" %}</span>
   <div id="filters" class="btn-group" data-toggle="buttons-radio">
-    <button name="msgtype_all" class="btn btn">{% trans "All" %}</button>
-    <button name="msgtype_S" class="btn btn btn-danger">S</button>
-    <button name="msgtype_V" class="btn btn btn-danger">V</button>
-    <button name="msgtype_H" class="btn btn btn-warning">H</button>
-    <button name="msgtype_M" class="btn btn btn-warning">M</button>
-    <button name="msgtype_B" class="btn btn btn-warning">B</button>
+    <button name="msgtype_all" class="btn" title="{% trans 'All messages' %}">{% trans "All" %}</button>
+    <button name="msgtype_S" class="btn btn-danger" title="{% trans 'Spam only' %}">S</button>
+    <button name="msgtype_V" class="btn btn-danger" title="{% trans 'Virus only' %}">V</button>
+    <button name="msgtype_H" class="btn btn-warning" title="{% trans 'Bad Header only' %}">H</button>
+    <button name="msgtype_M" class="btn btn-warning" title="{% trans 'Bad MIME only' %}">M</button>
+    <button name="msgtype_B" class="btn btn-warning" title="{% trans 'Banned only' %}">B</button>
   </div>
-{% endblock %}
+</div>

modoboa/extensions/amavis/templatetags/amavis_tags.py

@@ -66,41 +66,13 @@ def viewm_menu_simple(user, mail_id, rcpt, secret_id=""):
 
 
 @register.simple_tag
-def quar_menu(user):
-    entries = [
-        {"name": "release-multi",
-         "url": reverse('modoboa.extensions.amavis.views.process'),
-         "img": "icon-white icon-ok",
-         "class": "btn-success",
-         "label": _("Release")},
-        {"name": "delete-multi",
-         "img": "icon-white icon-trash",
-         "class": "btn-danger",
-         "url": reverse('modoboa.extensions.amavis.views.process'),
-         "label": _("Delete")},
-        {"name": "select",
-         "url": "",
-         "label": _("Content Class"),
-         "menu": [
-             {"name": "selectmsgs",
-              "url": "",
-              "label": _("Nothing")},
-             {"name": "selectmsgs",
-              "url": "S",
-              "label": _("Spam")},
-             {"name": "selectmsgs",
-              "url": "V",
-              "label": _("Virus")},
-             {"name": "selectmsgs",
-              "url": "H",
-              "label": _("Bad header")},
-             {"name": "selectmsgs",
-              "url": "M",
-              "label": _("Bad MIME")}
-         ]}
-    ]
-    extraopts = [{"name": "to", "label": _("To")}]   
+def quar_menu():
+    """Render the quarantine listing menu.
+
+    :rtype: str
+    :return: resulting HTML
+    """
+    extraopts = [{"name": "to", "label": _("To")}]
     return render_to_string('amavis/main_action_bar.html', {
-        'entries': entries, 'extraopts': extraopts,
-        'STATIC_URL': settings.STATIC_URL, 'extraclasses': 'pull-left'
+        'extraopts': extraopts
     })

modoboa/extensions/amavis/views.py

@@ -79,7 +79,7 @@ def _listing(request):
     paginbar = pagination_bar(page)
     ctx = getctx("ok", listing=content, paginbar=paginbar, page=page.number)
     if request.session.get('location', 'listing') != 'listing':
-        ctx['menu'] = quar_menu(request.user)
+        ctx['menu'] = quar_menu()
     request.session['location'] = 'listing'
     return HttpResponse(simplejson.dumps(ctx), mimetype="application/json")
 

modoboa/static/css/custom.css

@@ -120,4 +120,9 @@ body {
 .menubar-text {
     display: inline;
     vertical-align: middle;
+}
+
+.label-title {
+    vertical-align: middle;
+    margin: 0 10px;
 }

modoboa/static/js/jquery.htmltable.js

@@ -37,8 +37,14 @@
             this.last_selection = $tr;
             if ($tr.hasClass(this.options.tr_selected_class)) {
                 $tr.removeClass(this.options.tr_selected_class);
+                if (this.options.tr_unselected_event != undefined) {
+                    this.options.tr_unselected_event($tr);
+                }
             } else {
                 $tr.addClass(this.options.tr_selected_class);
+                if (this.options.tr_selected_event != undefined) {
+                    this.options.tr_selected_event($tr);
+                }
             }
         },