format attachment size

Issue #573

7 files changed, 41 insertions, 11 deletions

diff --git a/web-ui/app/js/helpers/view_helper.js b/web-ui/app/js/helpers/view_helper.js
index 8d841cc7..e4e9277d 100644
--- a/web-ui/app/js/helpers/view_helper.js
+++ b/web-ui/app/js/helpers/view_helper.js
@@ -121,11 +121,19 @@ define(
     }
   }
 
+  function formatSize(bytes) {
+    var e = Math.floor(Math.log(bytes) / Math.log(1024));
+    return (bytes / Math.pow(1024, e)).toFixed(2) + ' ' + ' KMGTP'.charAt(e) + 'b';
+  }
+
+
   Handlebars.registerHelper('formatDate', formatDate);
+  Handlebars.registerHelper('formatSize', formatSize);
   Handlebars.registerHelper('formatStatusClasses', formatStatusClasses);
 
   return {
     formatStatusClasses: formatStatusClasses,
+    formatSize: formatSize,
     formatMailBody: formatMailBody,
     moveCaretToEndOfText: moveCaretToEndOfText,
     quoteMail: quoteMail,
diff --git a/web-ui/app/js/mail_view/ui/attachment_list.js b/web-ui/app/js/mail_view/ui/attachment_list.js
index 32a48d0b..632242ca 100644
--- a/web-ui/app/js/mail_view/ui/attachment_list.js
+++ b/web-ui/app/js/mail_view/ui/attachment_list.js
@@ -17,10 +17,11 @@
 
 define(
     [
-        'page/events'
+        'page/events',
+        'helpers/view_helper'
     ],
 
-    function (events) {
+    function (events, viewHelper) {
         'use strict';
 
         function attachmentList() {
@@ -54,7 +55,7 @@ define(
 
             this.buildAttachmentListItem = function (attachment) {
                 return '<a href="' + this.attr.attachmentBaseUrl + '/' + attachment.ident + '?filename=' +
-                    attachment.name + '&encoding=' + attachment.encoding + '">' + attachment.name + ' (' + humanReadable(attachment.size) + ')' +
+                    attachment.name + '&encoding=' + attachment.encoding + '">' + attachment.name + ' (' + viewHelper.formatSize(attachment.size) + ')' +
                     '</a>';
             };
 
diff --git a/web-ui/app/js/mail_view/ui/mail_view.js b/web-ui/app/js/mail_view/ui/mail_view.js
index 76c5b7d9..093f498d 100644
--- a/web-ui/app/js/mail_view/ui/mail_view.js
+++ b/web-ui/app/js/mail_view/ui/mail_view.js
@@ -56,10 +56,6 @@ define(
           encrypted = undefined;
         }
 
-        var attachments = _.map(data.mail.attachments, function(a){
-            return { 'encoding': a.encoding, 'name': a.name, 'ident': a.ident };
-        });
-
         this.$node.html(templates.mails.fullView({
           header: data.mail.header,
           body: [],
@@ -68,7 +64,7 @@ define(
           tags: data.mail.tags,
           encryptionStatus: encrypted,
           signatureStatus: signed,
-          attachments: attachments
+          attachments: data.mail.attachments
         }));
 
         this.$node.find('.bodyArea').html(viewHelpers.formatMailBody(data.mail));
diff --git a/web-ui/app/templates/compose/compose_box.hbs b/web-ui/app/templates/compose/compose_box.hbs
index 902221e0..eb204501 100644
--- a/web-ui/app/templates/compose/compose_box.hbs
+++ b/web-ui/app/templates/compose/compose_box.hbs
@@ -36,7 +36,7 @@
             <ul id="attachment-list-item">
                 {{#each attachments }}
                     <li>
-                        <a href="/attachment/{{ this.ident }}?encoding={{ this.encoding }}&filename={{ this.name }}">{{ this.name }} ({{ this.size}})
+                        <a href="/attachment/{{ this.ident }}?encoding={{ this.encoding }}&filename={{ this.name }}">{{ this.name }} ({{ formatSize this.size}})
                             <i class="fa fa-arrow-down download-icon"></i></a>
                     </li>
                 {{/each }}
diff --git a/web-ui/app/templates/mails/full_view.hbs b/web-ui/app/templates/mails/full_view.hbs
index a925fe5d..cf797ce6 100644
--- a/web-ui/app/templates/mails/full_view.hbs
+++ b/web-ui/app/templates/mails/full_view.hbs
@@ -73,7 +73,7 @@
           <ul>
           {{#each attachments }}
             <li>
-              <a href="/attachment/{{ this.ident }}?encoding={{ this.encoding }}&filename={{ this.name }}">{{ this.name }}<i class="fa fa-arrow-down download-icon"></i></a>
+              <a href="/attachment/{{ this.ident }}?encoding={{ this.encoding }}&filename={{ this.name }}">{{ this.name }} ({{ formatSize this.size}})<i class="fa fa-arrow-down download-icon"></i></a>
             </li>
           {{/each }}
           </ul>
diff --git a/web-ui/test/spec/helpers/view_helper.spec.js b/web-ui/test/spec/helpers/view_helper.spec.js
index 655ba181..92a31a1f 100644
--- a/web-ui/test/spec/helpers/view_helper.spec.js
+++ b/web-ui/test/spec/helpers/view_helper.spec.js
@@ -51,6 +51,31 @@ define(['helpers/view_helper'], function (viewHelper) {
       });
     });
 
+    describe('formatSize', function() {
+      var template;
+      beforeEach(function () {
+        template = Handlebars.compile('{{formatSize size}}');
+      });
+
+      it('formats size to bytes', function() {
+        var bytes = 42;
+        var result = template({ size: bytes });
+        expect(result).toEqual('42.00  b');
+      });
+
+      it('formats size to kilobytes', function() {
+        var bytes = 4200;
+        var result = template({ size: bytes });
+        expect(result).toEqual('4.10 Kb');
+      });
+
+      it('formats size to megabytes', function() {
+        var bytes = 4200000;
+        var result = template({ size: bytes });
+        expect(result).toEqual('4.01 Mb');
+      });
+    });
+
     describe('format status classes', function () {
       it('formats all the status of the email to css classes', function () {
         var statuses = ['read', 'banana'];
diff --git a/web-ui/test/spec/mixins/with_mail_edit_base.spec.js b/web-ui/test/spec/mixins/with_mail_edit_base.spec.js
index f9e5600a..2b35d4f5 100644
--- a/web-ui/test/spec/mixins/with_mail_edit_base.spec.js
+++ b/web-ui/test/spec/mixins/with_mail_edit_base.spec.js
@@ -56,7 +56,7 @@ describeMixin('mixins/with_mail_edit_base', function () {
       setTimeout(function () {
         expect(saveDraftSpy).not.toHaveBeenTriggeredOn(document);
         done();
-      }, 10);
+      }, 12);
     });
   });