Improve JavaScript of Mail module

- activated file uploader of mail editor
- renamed method $update to $reload
- automatically mark messages as read
- use ui-sref-active from ui-router instead of ng-class

UI/WebServerResources/js/Mailer/mailbox-model.js

@@ -149,12 +149,12 @@
   };
 
   /**
-   * @function $update
+   * @function $reload
    * @memberof Mailbox.prototype
    * @desc Fetch the messages metadata of the mailbox.
    * @returns a promise of the HTTP operation
    */
-  Mailbox.prototype.$update = function() {
+  Mailbox.prototype.$reload = function() {
     var futureMailboxData;
 
     futureMailboxData = Mailbox.$$resource.post(this.id, 'view', {sortingAttributes: {sort: 'date', asc: false}});

UI/WebServerResources/js/Mailer/message-model.js

@@ -157,12 +157,12 @@
   };
 
   /**
-   * @function $update
+   * @function $reload
    * @memberof Message.prototype
    * @desc Fetch the viewable message body along with other metadata such as the list of attachments.
    * @returns a promise of the HTTP operation
    */
-  Message.prototype.$update = function() {
+  Message.prototype.$reload = function() {
     var futureMessageData;
 
     futureMessageData = Message.$$resource.fetch(this.id, 'view');
@@ -191,7 +191,7 @@
     return Message.$$resource.save(this.$absolutePath({asDraft: true}), data).then(function(response) {
       Message.$log.debug('save = ' + JSON.stringify(response, undefined, 2));
       _this.$setUID(response.uid);
-      _this.$update(); // fetch a new viewable version of the message
+      _this.$reload(); // fetch a new viewable version of the message
     });
   };
 
@@ -247,6 +247,13 @@
         _this.$formatFullAddresses();
         deferred.resolve(_this);
       });
+      if (!_this.isread) {
+        Message.$$resource.fetch(_this.id, 'markMessageRead').then(function() {
+          Message.$timeout(function() {
+            _this.isread = true;
+          });
+        });
+      }
     }, function(data) {
       angular.extend(_this, data);
       _this.isError = true;

UI/WebServerResources/js/MailerUI.js

@@ -7,7 +7,7 @@
   angular.module('SOGo.Common', []);
   angular.module('SOGo.ContactsUI', []);
 
-  angular.module('SOGo.MailerUI', ['ngSanitize', 'ui.router', 'mm.foundation', 'vs-repeat', 'ck', 'ngTagsInput', 'SOGo.Common', 'SOGo.UICommon', 'SOGo.UIDesktop', 'SOGo.ContactsUI'])
+  angular.module('SOGo.MailerUI', ['ngSanitize', 'ui.router', 'mm.foundation', 'vs-repeat', 'ck', 'ngTagsInput', 'angularFileUpload', 'SOGo.Common', 'SOGo.UICommon', 'SOGo.UIDesktop', 'SOGo.ContactsUI'])
 
     .constant('sgSettings', {
       baseURL: ApplicationBaseURL,
@@ -84,7 +84,7 @@
               return _find(stateAccount.$mailboxes);
             }],
             stateMessages: ['stateMailbox', function(stateMailbox) {
-              return stateMailbox.$update();
+              return stateMailbox.$reload();
             }]
           }
         })
@@ -97,12 +97,15 @@
             }
           },
           resolve: {
-            stateMessage: ['$stateParams', 'stateMailbox', 'stateMessages', function($stateParams, stateMailbox, stateMessages) {
+            stateMessage: ['$stateParams', '$state', 'stateMailbox', 'stateMessages', function($stateParams, $state, stateMailbox, stateMessages) {
               var message = _.find(stateMessages, function(messageObject) {
                 return messageObject.uid == $stateParams.messageId;
               });
 
-              return message.$update();
+              if (message)
+                return message.$reload();
+              else
+                $state.go('mail.account.mailbox', { accountId: stateMailbox.$account.id, mailboxId: encodeUriFilter(stateMailbox.path) });
             }]
           }
         })
@@ -230,7 +233,7 @@
       };
     }])
 
-    .controller('MessageEditorCtrl', ['$scope', '$rootScope', '$stateParams', '$state', '$q', 'stateAccounts', 'stateMessage', '$timeout', '$modal', 'sgFocus', 'sgDialog', 'sgAccount', 'sgMailbox', 'sgAddressBook', function($scope, $rootScope, $stateParams, $state, $q, stateAccounts, stateMessage, $timeout, $modal, focus, Dialog, Account, Mailbox, AddressBook) {
+    .controller('MessageEditorCtrl', ['$scope', '$rootScope', '$stateParams', '$state', '$q', 'FileUploader', 'stateAccounts', 'stateMessage', '$timeout', '$modal', 'sgFocus', 'sgDialog', 'sgAccount', 'sgMailbox', 'sgAddressBook', function($scope, $rootScope, $stateParams, $state, $q, FileUploader, stateAccounts, stateMessage, $timeout, $modal, focus, Dialog, Account, Mailbox, AddressBook) {
       if (angular.isDefined(stateMessage)) {
         $scope.message = stateMessage;
       }
@@ -250,6 +253,22 @@
         });
         return deferred.promise;
       };
+      $scope.uploader = new FileUploader({
+        url: stateMessage.$absolutePath({asDraft: true}) + '/save',
+        autoUpload: true,
+        alias: 'attachments',
+        onProgressItem: function(item, progress) {
+          console.debug(item); console.debug(progress);
+        },
+        onSuccessItem: function(item, response, status, headers) {
+          stateMessage.$setUID(response.uid);
+          stateMessage.$reload();
+          console.debug(item); console.debug('success = ' + JSON.stringify(response, undefined, 2));
+        },
+        onErrorItem: function(item, response, status, headers) {
+          console.debug(item); console.debug('error = ' + JSON.stringify(response, undefined, 2));
+        }
+      });
     }]);
 
 })();

UI/WebServerResources/js/mobile/MailerUI.js

@@ -96,7 +96,7 @@
               return _find(stateAccount.$mailboxes);
             }],
             stateMessages: ['stateMailbox', function(stateMailbox) {
-              return stateMailbox.$update();
+              return stateMailbox.$reload();
             }]
           }
         })

UI/WebServerResources/scss/MailerUI.scss

@@ -215,6 +215,9 @@ $column-gutter: 0;
                         font-weight: normal;
                         font-size: smaller;
                     }
+                    &._selected {
+                        background-color: #fff;
+                    }
                 }
                 &.unread {
                     a {
@@ -227,23 +230,8 @@ $column-gutter: 0;
                 }
                 &:hover,
                 &:active {
-                    background-color: $f-dropdown-list-hover-bg;
-                    //background-color: scale-color($f-dropdown-list-hover-bg, $lightness: 28%);
                     background-color: #fff;
                 }
-                &._selected,
-                &._selected span {
-                    //background-color: $module-light-color;
-                    //background-color: $sub-nav-active-bg-hover;
-                    //background-color: $f-dropdown-list-hover-bg;
-                    background-color: $module-color;
-                    background-color: #fff;
-                    //color: $module-color;
-                    //color: $module-secondary-color;
-                    .name {
-                        //color: #fff;
-                    }
-                }
             }
         }
     }