Add links to download one or all attachments

Also removed the contextual menu over file attachments and changed the
label color when moving over the file attachments.

UI/WebServerResources/MailerUI.css

@@ -374,21 +374,21 @@ TR.mailer_listcell_regular TD A
 }
 
 /* mail viewer */
-INPUT#editDraftButton
+#editDraftButton
 {
   position: absolute;
   top: 2.5em;
   right: 1em;
 }
 
-INPUT#loadImagesButton
+#loadImagesButton
 {
   position: absolute;
   top: 2.5em;
   right: 1em;
 }
 
-.popup INPUT#loadImagesButton
+.popup #loadImagesButton
 {
   top: 9.0em;
   right: 1em;
@@ -434,7 +434,8 @@ DIV.mailer_mailcontent TABLE
 }
 
 /* collapsable header */
-TD.mailer_fieldname IMG
+TD.mailer_fieldname IMG.collapse,
+TD.mailer_fieldname IMG.expand
 { cursor: pointer;
   padding-right: 5px; }
 TD.mailer_fieldvalue SPAN.collapse
@@ -577,7 +578,7 @@ DIV.linked_attachment_meta
 {
   color: #444444;
   border-width: 0;
-  padding: 2px;
+  padding: 2px 4px;
 }
 
 TABLE.linked_attachment_meta
@@ -585,6 +586,25 @@ TABLE.linked_attachment_meta
   color: #444444;
 }
 
+.linked_attachment_body a:hover
+{
+  text-decoration: none;
+}
+
+.linked_attachment_body a:hover .linked_attachment_meta
+{
+  background-color: #9ABCD8;
+  color: #fff;
+  -webkit-border-radius: 5px;
+  -moz-border-radius: 5px;
+  border-radius: 5px;
+}
+
+.linked_attachment_body a:hover .muted
+{
+  color: #fff !important;
+}
+
 DIV.linked_attachment_body HR
 {
   border: 0px;

UI/WebServerResources/MailerUI.js

@@ -1357,13 +1357,27 @@ function configureLinksInMessage() {
             anchor.observe("contextmenu", onEmailAddressClick);
             anchor.writeAttribute("moz-do-not-send", false);
         }
-        else
+        else if (!anchor.id)
             anchor.observe("click", onMessageAnchorClick);
     }
 
-    var attachments = messageDiv.select ("DIV.linked_attachment_body");
-    for (var i = 0; i < attachments.length; i++)
-        $(attachments[i]).observe("contextmenu", onAttachmentClick);
+    var attachmentsMenu = $("attachmentsMenu");
+    if (attachmentsMenu) {
+        var options = attachmentsMenu.select("li");
+        var callbacks = [];
+        for (var i = 0; i < options.length; i++) {
+            if (options[i].className == 'separator')
+                callbacks.push(null);
+            else
+                callbacks.push(saveAttachment);
+        }
+        initMenu(attachmentsMenu, callbacks);
+        $("attachmentsHref").on("click", function (event) {
+            popupMenu(event, 'attachmentsMenu', this);
+            preventDefault(event);
+            return false;
+        });
+    }
 
     var images = messageDiv.select("IMG.mailer_imagecontent");
     for (var i = 0; i < images.length; i++)
@@ -1371,12 +1385,11 @@ function configureLinksInMessage() {
 
     var editDraftButton = $("editDraftButton");
     if (editDraftButton)
-        editDraftButton.observe("click",
-                                onMessageEditDraft.bindAsEventListener(editDraftButton));
+        editDraftButton.on("click", onMessageEditDraft);
 
     var loadImagesButton = $("loadImagesButton");
     if (loadImagesButton)
-        $(loadImagesButton).observe("click", onMessageLoadImages);
+        loadImagesButton.on("click", onMessageLoadImages);
 
     configureiCalLinksInMessage();
 }
@@ -1562,12 +1575,13 @@ function onMessageContentMenu(event) {
 }
 
 function onMessageEditDraft(event) {
+    Event.stop(event);
     return openMessageWindowsForSelection("edit", true);
 }
 
 function onMessageLoadImages(event) {
-    loadRemoteImages();
     Event.stop(event);
+    loadRemoteImages();
 }
 
 function loadRemoteImages() {
@@ -1613,12 +1627,6 @@ function onImageClick(event) {
     return false;
 }
 
-function onAttachmentClick (event) {
-    popupMenu (event, 'attachmentMenu', this);
-    preventDefault (event);
-    return false;
-}
-
 function handleReturnReceipt() {
     var input = $("shouldAskReceipt");
     if (input) {
@@ -1773,13 +1781,29 @@ function saveImage(event) {
     window.location.href = urlAsAttachment;
 }
 
-function saveAttachment(event) {
-    var div = document.menuTarget;
-    var link = div.select ("a").first ();
-    var url = link.getAttribute("href");
-    var urlAsAttachment = url.replace(/(\/[^\/]*)$/,"/asAttachment$1");
+/* Download a file using a temporary iframe that we delete once the download is started */
+function download(url) {
+    var form = createElement('form', null, 'hidden', { action: url, method: 'GET'});
+    $(document.body).appendChild(form);
+    var div = AIM.submit(form);
+    form.submit();
+    setTimeout(function () {
+        form.remove();
+        div.remove();
+    }, 2000);
+}
 
-    window.location.href = urlAsAttachment;
+function saveAttachment(event) {
+    var url = $(this).readAttribute('data-url');
+    if (url) {
+        download(url);
+    }
+    else {
+        $(this).up('ul').select('li[data-url]').each(function (item) {
+            url = $(item).readAttribute('data-url');
+            download(url);
+        });
+    }
 }
 
 /* contacts */
@@ -2820,7 +2844,6 @@ function getMenus() {
                             saveAs, null, null,
                             onMenuDeleteMessage ],
         imageMenu: [ saveImage ],
-        attachmentMenu: [ saveAttachment ],
         messageContentMenu: [ onMenuReplyToSender,
                               onMenuReplyToAll,
                               onMenuForwardMessage,

UI/WebServerResources/generic.css

@@ -251,7 +251,8 @@ DIV.contactSelector DIV.contactList
   padding-bottom: .15em;
   margin: 0px;
   width: auto;
-  white-space: nowrap; }
+  white-space: nowrap;
+  cursor: pointer; }
 
 .menu LI.disabled,
 .popuMenu LI.disabled,
@@ -283,10 +284,11 @@ UL.choiceMenu LI._chosen:hover
 { list-style-image: url("menu-check-hover.gif"); }
 
 .menu LI:hover,
+.menu LI:hover .muted,
 .menu LI.selected,
 .menu LI.submenu-selected
 { background-color: #9ABCD8;
-  color: #fff; }
+  color: #fff !important; }
 
 .menu LI.disabled:hover
 { background-color: inherit; }

UI/WebServerResources/generic.js

@@ -1925,7 +1925,7 @@ AIM = {
         d.innerHTML = '<iframe class="hidden" src="about:blank" id="'
             + n + '" name="' + n + '" onload="AIM.loaded(\'' + n + '\')"></iframe>';
         document.body.appendChild(d);
-        var i = $(n); // TODO: useful?
+        var i = $(n);
         if (c && typeof(c.onComplete) == 'function')
             i.onComplete = c.onComplete;
         return n;
@@ -1936,27 +1936,28 @@ AIM = {
     },
 
     submit: function(f, c) {
-        AIM.form(f, AIM.frame(c));
+        var id = AIM.frame(c);
+        AIM.form(f, id);
         if (c && typeof(c.onStart) == 'function')
             return c.onStart();
         else
-            return true;
+            return $(id);
     },
 
     loaded: function(id) {
         var i = $(id);
+        var d;
         if (i.contentDocument) {
-            var d = i.contentDocument;
+            d = i.contentDocument;
         }
         else if (i.contentWindow) {
-            var d = i.contentWindow.document;
+            d = i.contentWindow.document;
         }
         else {
-            var d = window.frames[id].document;
+            d = window.frames[id].document;
         }
         if (d.location.href == "about:blank")
             return;
-
         if (typeof(i.onComplete) == 'function') {
             i.onComplete(Element.allTextContent(d.body));
         }