Add sgFolderTree directive

UI/WebServerResources/js/Common/ui-mobile.js

@@ -46,8 +46,51 @@
   }];
 
   /* Angular module instanciation */
-  angular.module('SOGo.UIMobile', ['ionic'])
+  angular.module('SOGo.UIMobile', ['ionic', 'RecursionHelper'])
 
   /* Factory registration in Angular module */
-    .factory('sgDialog', Dialog.$factory);
+    .factory('sgDialog', Dialog.$factory)
+
+  /*
+   * sgFolderTree - Provides hierarchical folders tree
+   * @memberof SOGo.UIDesktop
+   * @restrict element
+   * @see https://github.com/marklagendijk/angular-recursion
+   * @example:
+
+     <sg-folder-tree data-ng-repeat="folder in folders track by folder.id"
+                     data-sg-root="account"
+                     data-sg-folder="folder"
+                     data-sg-set-folder="setCurrentFolder"><!-- tree --></sg-folder-tree>
+  */
+    .directive("sgFolderTree", function(RecursionHelper) {
+      return {
+        restrict: "E",
+        scope: {
+          root: '=sgRoot',
+          folder: '=sgFolder',
+          setFolder: '=sgSetFolder'
+        },
+        template:
+          '<ion-item option-buttons="buttons" class="item-icon-left item-icon-right"' +
+          '          ng-click="setFolder(root, folder)">' +
+          '  <i class="icon ion-folder"><!-- mailbox --></i>{{folder.name}}' +
+          '  <i class="icon ion-ios7-arrow-right"><!-- right arrow icon --></i>' +
+          '  <ion-option-button class="button-info"' +
+          '                     ng-click="edit(folder)">{{"Edit" | loc}}</ion-option-button>' +
+          '</ion-item>' +
+          '<div>' +
+          '  <span ng-repeat="child in folder.children track by child.id">' +
+          '    <sg-folder-tree sg-root="root" sg-folder="child" sg-set-folder="setFolder"></sg-folder-tree>' +
+          '  </span>' +
+          '</div>',
+        compile: function(element) {
+          return RecursionHelper.compile(element, function(scope, iElement, iAttrs, controller, transcludeFn) {
+            var level = scope.folder.path.split('/').length - 1;
+            iElement.find('ion-item').addClass('childLevel' + level);
+          });
+        }
+      };
+    });
+
 })();