group file into folder in select file

css/modals.css

@@ -34,11 +34,11 @@
   width: 80px;
 }
 
-.selectFiles > div > .control-label {
+.selectFiles div .control-label {
   font-weight: normal;
   margin-left: 30px;
 }
 
-.selectFiles > div > .controls {
+.selectFiles div .controls {
   margin-left: 30px;
 }

index.html

@@ -1028,6 +1028,36 @@
     <button class="btn btn-default btn-primary" ng-click="$close()">{{ 'Start' | translate }}</button>
   </div>
 </script>
+<!-- }}} -->
+
+  <!-- {{{ select files checkbox modal -->
+<script type="text/ng-template" id="selectFilesCheckBox.html">
+  <div ng-repeat="(folder,file) in files">
+    <!--is's a folder-->
+    <div ng-if="!file.index || file.index.toString().indexOf('object') >= 0">
+      <div class="controls">
+        <label class="checkbox">
+          <input type="checkbox"/>{{folder}}
+        </label>
+        <div class="form-group selectFiles" ng-include="'selectFilesCheckBox.html'" ng-init="files=file">
+        </div>
+      </div>
+    </div>
+
+    <!--is's a file-->
+    <div ng-if="file.index && file.index.toString().indexOf('object') < 0">
+      <label class="control-label">{{ 'Select to download' | translate }}</label>
+
+      <div class="controls">
+        <label class="checkbox">
+          <input type="checkbox" ng-model="file.selected"/>{{file.relpath}}
+        </label>
+      </div>
+      <br/>
+      <br/>
+    </div>
+  </div>
+</script>
 <!-- }}} -->
 
 <!-- {{{ select file modal -->
@@ -1039,17 +1069,7 @@
 
   <form class="form-horizontal modal-body">
     <fieldset>
-      <div class="form-group selectFiles">
+      <div class="form-group selectFiles" ng-include="'selectFilesCheckBox.html'" ng-init="files=selectFiles.groupedFiles">
-        <div ng-repeat="file in selectFiles.files">
-          <label class="control-label">{{ 'Select to download' | translate }}</label>
-
-          <div class="controls">
-            <label class="checkbox">
-              <input type="checkbox" ng-model="file.selected"/>{{file.relpath}}
-            </label>
-          </div>
-          <br /><br />
-        </div>
       </div>
     </fieldset>
   </form>

js/ctrls/modal.js

@@ -123,6 +123,23 @@ angular
       var self = this;
 
 	  this.files = _.cloneDeep(files);
+      var groupFile = function (files) {
+          var i, j, str, arr, folder = {}, tmp = folder;
+          for (i = 0; i < files.length; i++) {
+              str = files[i].relpath;
+              arr = str.split("/");
+              for (j = 0; j < arr.length - 1; j++) {
+                  if (!tmp[arr[j]]) {
+                      tmp[arr[j]] = {};
+                  }
+                  tmp = tmp[arr[j]];
+              }
+              tmp[arr[arr.length - 1]] = files[i];
+              tmp = folder;
+          }
+          return folder;
+      };
+      this.groupedFiles = groupFile(this.files);
       this.inst = $modal.open({
         templateUrl: "selectFiles.html",
         scope: scope,