Improve lists in sidenav

- the ripple effect is now visible when clicking on list items;
- the fab icon has been moved over the items list;
- colorized the checkboxes of the calendars list.

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

@@ -83,6 +83,7 @@
     else {
       Account.$Mailbox.$find(this).then(function(data) {
         _this.$mailboxes = data;
+        _this.$flattenMailboxes({reload: true});
         deferred.resolve(_this.$mailboxes);
       });
     }
@@ -90,23 +91,30 @@
     return deferred.promise;
   };
 
-  Account.prototype.$flattenMailboxes = function() {
+  /**
+   * @function $flattenMailboxes
+   * @memberof Account.prototype
+   * @desc Get a flatten array of the mailboxes.
+   * @param {object} [options] - force a reload
+   * @returns an array of Mailbox instances
+   */
+  Account.prototype.$flattenMailboxes = function(options) {
     var _this = this,
         allMailboxes = [],
-        _visit = function(level, mailboxes) {
+        _visit = function(mailboxes) {
           _.each(mailboxes, function(o) {
-            allMailboxes.push({ id: o.id, path: o.path, name: o.name, level: level });
+            allMailboxes.push(o);
             if (o.children && o.children.length > 0) {
-              _visit(level+1, o.children);
+              _visit(o.children);
             }
           });
         };
 
-    if (this.$$flattenMailboxes) {
+    if (this.$$flattenMailboxes && !(options && options.reload)) {
       allMailboxes = this.$$flattenMailboxes;
     }
     else {
-      _visit(0, this.$mailboxes);
+      _visit(this.$mailboxes);
       _this.$$flattenMailboxes = allMailboxes;
     }
 

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

@@ -88,10 +88,11 @@
   Mailbox.$unwrapCollection = function(account, futureMailboxData) {
     var collection = [],
         // Local recursive function
-        createMailboxes = function(mailbox) {
+        createMailboxes = function(level, mailbox) {
           for (var i = 0; i < mailbox.children.length; i++) {
+            mailbox.children[i].level = level;
             mailbox.children[i] = new Mailbox(account, mailbox.children[i]);
-            createMailboxes(mailbox.children[i]);
+            createMailboxes(level+1, mailbox.children[i]);
           }
         };
     //collection.$futureMailboxData = futureMailboxData;
@@ -100,8 +101,9 @@
       return Mailbox.$timeout(function() {
         // Each entry is spun up as a Mailbox instance
         angular.forEach(data.mailboxes, function(data, index) {
+          data.level = 0;
           var mailbox = new Mailbox(account, data);
-          createMailboxes(mailbox); // recursively create all sub-mailboxes
+          createMailboxes(1, mailbox); // recursively create all sub-mailboxes
           collection.push(mailbox);
         });
         return collection;