new design, but not sure

index.html

@@ -33,6 +33,9 @@
     <script src="/js/lib/angular/angular-local-storage.js" charset="utf-8"></script>
     <script src="/js/lib/angular/angular-ui-router.min.js" charset="utf-8"></script>
     <script src="/js/lib/angular/angucomplete-alt.min.js" charset="utf-8"></script>
+    <script src="/js/lib/ez-file-tree/ez-file-tree.min.js" charset="utf-8"></script>
+    <script src="/js/lib/ez-file-tree/ez-object2array.min.js" charset="utf-8"></script>
+
     <!-- Core Files -->
     <script src="/js/app.js" charset="utf-8"></script>
     <!-- Services -->

js/app.js

@@ -1,4 +1,4 @@
-var app = angular.module('launchpad', ['oauth3.org', 'ui.router', 'LocalStorageModule', 'angucomplete-alt']);
+var app = angular.module('launchpad', ['oauth3.org', 'ui.router', 'LocalStorageModule', 'angucomplete-alt', 'ez.fileTree']);
 
 app.config(['$stateProvider', '$urlRouterProvider', 'localStorageServiceProvider',
   function ($stateProvider, $urlRouterProvider, localStorageServiceProvider) {

js/controllers/website-controller.js

@@ -339,6 +339,7 @@ app.controller('websiteCtrl', [
   vm.Sites.contents = function (r) {
     vm.showListFiles = true;
     var pkg = Auth.oauth3.pkg('www@daplie.com');
+
     return pkg.contents({
       hostname: r.domain
     , domain: r.domain
@@ -347,17 +348,8 @@ app.controller('websiteCtrl', [
     //, sub: r.sub
     , path: r.newPath
     }).then(function (result) {
-      vm.directories = [];
-      vm.files = [];
-      window.alert(JSON.stringify(result.data));
-      result.data.forEach(function(dir) {
-        if (dir.directory) {
-          debugger;
-          console.log('asdfasdfasdf');
-          vm.things = [];
-          vm.things.push(dir.name);
-        }
-      });
+      // window.alert(JSON.stringify(result.data));
+      vm.folderStructure = result;
     });
   };
   vm.Shares = {};
@@ -494,5 +486,43 @@ app.controller('websiteCtrl', [
     return matches;
   };
 
-
-}]);
+}])
+.filter('stringify', function() {
+  function getSerialize (fn, decycle) {
+    var seen = [], keys = [];
+    decycle = decycle || function(key, value) {
+    return '[Parent REFERENCE]: ' + value.id;
+    };
+    return function(key, value) {
+      var ret = value;
+      if (typeof value === 'object' && value) {
+        if (seen.indexOf(value) !== -1)
+          ret = decycle(key, value);
+        else {
+          seen.push(value);
+          keys.push(key);
+        }
+      }
+      if (fn) ret = fn(key, ret);
+      return ret;
+    };
+  }
+  function getPath (value, seen, keys) {
+    var index = seen.indexOf(value);
+    var path = [ keys[index] ];
+    for (index--; index >= 0; index--) {
+      if (seen[index][ path[0] ] === value) {
+        value = seen[index];
+        path.unshift(keys[index]);
+      }
+    }
+    return '~' + path.join('.');
+  }
+  function stringify(obj, fn, spaces, decycle) {
+    return JSON.stringify(obj, getSerialize(fn, decycle), spaces);
+  }
+  stringify.getSerialize = getSerialize;
+  return function(ob) {
+    return stringify(ob, undefined, 2);
+  };
+});

js/lib/ez-file-tree/ez-object2array.min.js

@@ -0,0 +1 @@
+angular.module("ez.object2array",[]).filter("object2array",[function(){return function(a){if("[object Array]"===Object.prototype.toString.call(a))return a;var b=[];for(var c in a)b.push(a[c]);return b}}]);

templates/website.html

@@ -180,22 +180,12 @@
             <div class="white-well" ng-show="vm.showListFiles">
               <button type="button" class="close" ng-click="vm.showListFiles = false" ng-show="vm.showListFiles"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button>
               <div class="text-left">
-                <h4>Directories</h4>
-                <ul class="ls-none" ng-repeat="directory in vm.directories track by $index">
-                  <li>{{ directory }}</li>
-                </ul>
-                <h4>Files</h4>
-                <ul class="ls-none" ng-repeat="file in vm.files track by $index">
-                  <li>{{ file }}</li>
-                </ul>
+                <div class="row">
+                  <div class="col-lg-12">
+                    <pre style="font-size: 10px;">{{ vm.folderStructure | stringify }}</pre>
+                  </div>
+                </div>
               </div>
-
-
-
-
-
-
-
             </div>
           </form>
           <div class="">