Finished implementing upload and mount by github repo. This includes a checked dialog for configuration. This is reusable for zip / appstore as well

js/apps/system/aardvark/aardvark.js

@@ -123,7 +123,9 @@ controller.post("/foxxes/gitinstall", function (req, res) {
   res.json({
     error: false,
     configuration: app.manifest.configuration || {},
-    app: appID
+    app: appID,
+    name: app.name,
+    version: app.version
   });
 }).summary("Installs a foxx or update existing")
 .notes("This function is used to install or update a (new) foxx.");

js/apps/system/aardvark/frontend/js/collections/foxxCollection.js

@@ -45,13 +45,13 @@
         contentType: "application/json",
         processData: false,
         success: function(data) {
-          result = true;
+          result = data;
         },
         error: function(data) {
-          if (data.responseText.indexOf() !== -1) {
+          console.log(data);
-            alert("Already newest app version installed.");
+          result = {
-          }
+            error: true 
-          result = false;
+          };
         }
       });
       return result;

js/apps/system/aardvark/frontend/js/templates/modalApplicationMount.ejs

@@ -32,14 +32,6 @@
               <input type="text" id="tag" value="" placeholder="master">
             </th>
           </tr>
-          <tr class="tableRow">
-            <th class="collectionInfoTh">
-              Mount*:
-            </th>
-            <th class="collectionInfoTh">
-              <input type="text" id="tag" value="" placeholder="/foxx/app">
-            </th>
-          </tr>
         </table>
         <button id="installGithub" class="button-success pull-right" style="margin-right:8px">Install</button>
       </div>
@@ -57,14 +49,6 @@
               <input id="zip-file" name="zip-file" type="file"/>
             </th>
           </tr>
-          <tr class="tableRow">
-            <th class="collectionInfoTh">
-              Mount*:
-            </th>
-            <th class="collectionInfoTh">
-              <input type="text" id="tag" value="" placeholder="/foxx/app">
-            </th>
-          </tr>
         </table>
         <button id="installZip" class="button-success pull-right" style="margin-right:8px">Install</button>
       </div>

js/apps/system/aardvark/frontend/js/views/applicationsView.js

@@ -1,367 +1,636 @@
 /*jshint browser: true */
 /*jshint strict: false, unused: false */
 /*global Backbone, $, window, arangoHelper, templateEngine, Joi, _*/
+(function() {
+  "use strict";
 
-window.ApplicationsView = Backbone.View.extend({
+  var splitSnakeCase = function(snakeCase) {
-  el: '#content',
+    var str = snakeCase.replace(/([a-z])([A-Z])/g, "$1 $2");
+    str = str.replace(/([a-z])([0-9])/gi, "$1 $2");
+    str = str.replace(/_+/, " ");
+    return _.map(str.split(/\s+/), function(s) {
+      return s.charAt(0).toUpperCase() + s.slice(1).toLowerCase();
+    }).join(" ");
+  };
 
-  template: templateEngine.createTemplate("applicationsView.ejs"),
+  window.ApplicationsView = Backbone.View.extend({
+    el: '#content',
 
-  events: {
+    template: templateEngine.createTemplate("applicationsView.ejs"),
-    "click #addApp"                : "createInstallModal",
-    "click #checkDevel"            : "toggleDevel",
-    "click #checkActive"           : "toggleActive",
-    "click .checkSystem"           : "toggleSystem",
-    "click #foxxToggle"            : "slideToggle",
-    "click #importFoxxToggle"      : "slideToggleImport",
-    "change #importFoxx"           : "uploadSetup",
-    "click #confirmFoxxImport"     : "importFoxx",
-    "click #installFoxxFromGithub" : "createGithubModal",
-    "click .css-label"             : "checkBoxes",
-    "change #appsDesc"             : "sorting"
-  },
 
-  checkBoxes: function (e) {
+    events: {
-    //chrome bugfix
+      "click #addApp"                : "createInstallModal",
-    var clicked = e.currentTarget.id;
+      "change #zip-file"             : "uploadSetup",
-    $('#'+clicked).click();
-  },
 
-  uploadSetup: function (e) {
+      "click #checkDevel"            : "toggleDevel",
-    var files = e.target.files || e.dataTransfer.files;
+      "click #checkActive"           : "toggleActive",
-    this.file = files[0];
+      "click .checkSystem"           : "toggleSystem",
-    this.allowUpload = true;
+      "click #foxxToggle"            : "slideToggle",
-  },
+      "click #importFoxxToggle"      : "slideToggleImport",
+      "change #importFoxx"           : "uploadSetup",
+      "click #confirmFoxxImport"     : "importFoxx",
+      "click #installFoxxFromGithub" : "createGithubModal",
+      "click .css-label"             : "checkBoxes",
+      "change #appsDesc"             : "sorting"
+    },
 
-  sorting: function() {
-    if ($('#appsDesc').is(":checked")) {
-      this.collection.setSortingDesc(true);
-    }
-    else {
-      this.collection.setSortingDesc(false);
-    }
 
-    this.render();
+    checkBoxes: function (e) {
-  },
+      //chrome bugfix
+      var clicked = e.currentTarget.id;
+      $('#'+clicked).click();
+    },
 
-  createGithubModal: function() {
+    uploadSetup: function (e) {
-    var buttons = [], tableContent = [];
+      var files = e.target.files || e.dataTransfer.files;
-    tableContent.push(
+      this.file = files[0];
-      window.modalView.createTextEntry(
+      this.allowUpload = true;
-        'github-url',
+    },
-        'Github information',
-        '',
-        'Your Github link comes here: username/application-name',
-        "username/application-name",
-        false,
-        [
-          {
-            rule: Joi.string().regex(/^[a-zA-Z0-9]+[\/]/),
-            msg: "No valid github link given."
-          },
-          {
-            rule: Joi.string().required(),
-            msg: "No github link given."
-          }
-        ]
-    ));
-    tableContent.push(
-      window.modalView.createTextEntry(
-        'github-version',
-        'Version (optional)',
-        '',
-        'Example: v1.1.2 for version 1.1.2 - if no version is commited, master is used',
-        'master',
-        false,
-        /[<>&'"]/
-    ));
-    buttons.push(
-      window.modalView.createSuccessButton('Install', this.submitGithubFoxx.bind(this))
-    );
-    window.modalView.show(
-      'modalTable.ejs', 'Install Foxx from Github', buttons, tableContent, undefined, undefined
-    );
-  },
 
-  closeGithubModal: function() {
+    sorting: function() {
-    window.modalView.hide();
+      if ($('#appsDesc').is(":checked")) {
-  },
+        this.collection.setSortingDesc(true);
+      }
+      else {
+        this.collection.setSortingDesc(false);
+      }
 
-  submitGithubFoxx: function() {
+      this.render();
-    var name, url, version, result;
+    },
 
-    //fetch needed information, need client side verification
+    createGithubModal: function() {
-    //remove name handling on server side because not needed
+      var buttons = [], tableContent = [];
-    name = "";
+      tableContent.push(
-    url = $('#github-url').val();
+        window.modalView.createTextEntry(
-    version = $('#github-version').val();
+          'github-url',
+          'Github information',
+          '',
+          'Your Github link comes here: username/application-name',
+          "username/application-name",
+          false,
+          [
+            {
+              rule: Joi.string().regex(/^[a-zA-Z0-9]+[\/]/),
+              msg: "No valid github link given."
+            },
+            {
+              rule: Joi.string().required(),
+              msg: "No github link given."
+            }
+          ]
+      ));
+      tableContent.push(
+        window.modalView.createTextEntry(
+          'github-version',
+          'Version (optional)',
+          '',
+          'Example: v1.1.2 for version 1.1.2 - if no version is commited, master is used',
+          'master',
+          false,
+          /[<>&'"]/
+      ));
+      buttons.push(
+        window.modalView.createSuccessButton('Install', this.submitGithubFoxx.bind(this))
+      );
+      window.modalView.show(
+        'modalTable.ejs', 'Install Foxx from Github', buttons, tableContent, undefined, undefined
+      );
+    },
 
-    if (version === '') {
+    closeGithubModal: function() {
-      version = "master";
+      window.modalView.hide();
-    }
+    },
 
-    //send server req through collection
+    submitGithubFoxx: function() {
-    result = this.collection.installFoxxFromGithub(url, name, version);
+      var name, url, version, result;
-    if (result === true) {
-      this.closeGithubModal();
-      this.reload();
-    }
-  },
 
-  importFoxx: function() {
+      //fetch needed information, need client side verification
-    var self = this;
+      //remove name handling on server side because not needed
-    if (this.allowUpload) {
+      name = "";
-      this.showSpinner();
+      url = $('#repository').val();
-      $.ajax({
+      version = $('#tag').val();
-        type: "POST",
+
-        async: false,
+      if (version === '') {
-        url: '/_api/upload',
+        version = "master";
-        data: self.file,
+      }
-        processData: false,
+
-        contentType: 'application/octet-stream',
+      //send server req through collection
-        complete: function(res) {
+      result = this.collection.installFoxxFromGithub(url, name, version);
-          if (res.readyState === 4) {
+      if (result === true) {
-            if (res.status === 201) {
+        window.modalView.hide();
-              $.ajax({
+        this.reload();
-                type: "POST",
+      }
-                async: false,
+    },
-                url: "/_admin/aardvark/foxxes/inspect",
+
-                data: res.responseText,
+    importFoxx: function() {
-                contentType: "application/json"
+      var self = this;
-              }).done(function(res) {
+      if (this.allowUpload) {
+        this.showSpinner();
+        $.ajax({
+          type: "POST",
+          async: false,
+          url: '/_api/upload',
+          data: self.file,
+          processData: false,
+          contentType: 'application/octet-stream',
+          complete: function(res) {
+            if (res.readyState === 4) {
+              if (res.status === 201) {
                 $.ajax({
                   type: "POST",
                   async: false,
-                  url: '/_admin/foxx/fetch',
+                  url: "/_admin/aardvark/foxxes/inspect",
-                  data: JSON.stringify({
+                  data: res.responseText,
-                    name: res.name,
+                  contentType: "application/json"
-                    version: res.version,
+                }).done(function(res) {
-                    filename: res.filename
+                  $.ajax({
-                  }),
+                    type: "POST",
-                  processData: false
+                    async: false,
-                }).done(function () {
+                    url: '/_admin/foxx/fetch',
-                  self.reload();
+                    data: JSON.stringify({
-                }).fail(function (err) {
+                      name: res.name,
+                      version: res.version,
+                      filename: res.filename
+                    }),
+                    processData: false
+                  }).done(function () {
+                    self.reload();
+                  }).fail(function (err) {
+                    self.hideSpinner();
+                    var error = JSON.parse(err.responseText);
+                    arangoHelper.arangoError("Error: " + error.errorMessage);
+                  });
+                }).fail(function(err) {
                   self.hideSpinner();
                   var error = JSON.parse(err.responseText);
-                  arangoHelper.arangoError("Error: " + error.errorMessage);
+                  arangoHelper.arangoError("Error: " + error.error);
                 });
-              }).fail(function(err) {
+                delete self.file;
+                self.allowUpload = false;
                 self.hideSpinner();
-                var error = JSON.parse(err.responseText);
+                self.hideImportModal();
-                arangoHelper.arangoError("Error: " + error.error);
+                return;
-              });
+              }
-              delete self.file;
-              self.allowUpload = false;
-              self.hideSpinner();
-              self.hideImportModal();
-              return;
             }
+            self.hideSpinner();
+            arangoHelper.arangoError("Upload error");
           }
-          self.hideSpinner();
+        });
-          arangoHelper.arangoError("Upload error");
+      }
+    },
+
+    showSpinner: function() {
+      $('#uploadIndicator').show();
+    },
+
+    hideSpinner: function() {
+      $('#uploadIndicator').hide();
+    },
+
+    toggleDevel: function() {
+      var self = this;
+      this._showDevel = !this._showDevel;
+      _.each(this._installedSubViews, function(v) {
+        v.toggle("devel", self._showDevel);
+      });
+    },
+
+    toggleActive: function() {
+      var self = this;
+      this._showActive = !this._showActive;
+      _.each(this._installedSubViews, function(v) {
+        v.toggle("active", self._showActive);
+      });
+    },
+
+    toggleSystem: function() {
+      this._showSystem = !this._showSystem;
+      var self = this;
+      _.each(this._installedSubViews, function(v) {
+        v.toggle("system", self._showSystem);
+      });
+      this.createSubViews();
+      this.renderSubViews();
+    },
+
+    hideImportModal: function() {
+      $('#foxxDropdownImport').hide();
+    },
+
+    hideSettingsModal: function() {
+      $('#foxxDropdownOut').hide();
+    },
+
+    slideToggleImport: function() {
+      $('#foxxToggle').removeClass('activated');
+      $('#importFoxxToggle').toggleClass('activated');
+      $('#foxxDropdownImport').slideToggle(200);
+      this.hideSettingsModal();
+    },
+
+    slideToggle: function() {
+      //apply sorting to checkboxes
+      $('#appsDesc').attr('checked', this.collection.sortOptions.desc);
+
+      $('#importFoxxToggle').removeClass('activated');
+      $('#foxxToggle').toggleClass('activated');
+      $('#foxxDropdownOut').slideToggle(200);
+      this.hideImportModal();
+    },
+
+    reload: function() {
+      var self = this;
+
+      // unbind and remove any unused views
+      _.each(this._installedSubViews, function (v) {
+        v.undelegateEvents();
+      });
+      _.each(this._availableSubViews, function (v) {
+        v.undelegateEvents();
+      });
+
+      this.collection.fetch({
+        success: function() {
+          self.createSubViews();
+          self.render();
         }
       });
-    }
+    },
-  },
 
-  showSpinner: function() {
+    createSubViews: function() {
-    $('#uploadIndicator').show();
+      var self = this;
-  },
+      this._installedSubViews = { };
+      this._availableSubViews = { };
 
-  hideSpinner: function() {
+      self.collection.each(function (foxx) {
-    $('#uploadIndicator').hide();
+        if (foxx.get('isSystem') && ! self._showSystem) {
-  },
+          return;
-
+        }
-  toggleDevel: function() {
+        var subView;
-    var self = this;
+        if (foxx.get("type") === "app") {
-    this._showDevel = !this._showDevel;
+          subView = new window.FoxxInstalledView({
-    _.each(this._installedSubViews, function(v) {
+            model: foxx,
-      v.toggle("devel", self._showDevel);
+            appsView: self
-    });
-  },
-
-  toggleActive: function() {
-    var self = this;
-    this._showActive = !this._showActive;
-    _.each(this._installedSubViews, function(v) {
-      v.toggle("active", self._showActive);
-    });
-  },
-
-  toggleSystem: function() {
-    this._showSystem = !this._showSystem;
-    var self = this;
-    _.each(this._installedSubViews, function(v) {
-      v.toggle("system", self._showSystem);
-    });
-    this.createSubViews();
-    this.renderSubViews();
-  },
-
-  hideImportModal: function() {
-    $('#foxxDropdownImport').hide();
-  },
-
-  hideSettingsModal: function() {
-    $('#foxxDropdownOut').hide();
-  },
-
-  slideToggleImport: function() {
-    $('#foxxToggle').removeClass('activated');
-    $('#importFoxxToggle').toggleClass('activated');
-    $('#foxxDropdownImport').slideToggle(200);
-    this.hideSettingsModal();
-  },
-
-  slideToggle: function() {
-    //apply sorting to checkboxes
-    $('#appsDesc').attr('checked', this.collection.sortOptions.desc);
-
-    $('#importFoxxToggle').removeClass('activated');
-    $('#foxxToggle').toggleClass('activated');
-    $('#foxxDropdownOut').slideToggle(200);
-    this.hideImportModal();
-  },
-
-  reload: function() {
-    var self = this;
-
-    // unbind and remove any unused views
-    _.each(this._installedSubViews, function (v) {
-      v.undelegateEvents();
-    });
-    _.each(this._availableSubViews, function (v) {
-      v.undelegateEvents();
-    });
-
-    this.collection.fetch({
-      success: function() {
-        self.createSubViews();
-        self.render();
-      }
-    });
-  },
-
-  createSubViews: function() {
-    var self = this;
-    this._installedSubViews = { };
-    this._availableSubViews = { };
-
-    self.collection.each(function (foxx) {
-      if (foxx.get('isSystem') && ! self._showSystem) {
-        return;
-      }
-      var subView;
-      if (foxx.get("type") === "app") {
-        subView = new window.FoxxInstalledView({
-          model: foxx,
-          appsView: self
-        });
-        self._availableSubViews[foxx.get('_id')] = subView;
-      } else if (foxx.get("type") === "mount") {
-        subView = new window.FoxxActiveView({
-          model: foxx,
-          appsView: self
-        });
-        self._installedSubViews[foxx.get('_id')] = subView;
-      }
-    });
-  },
-
-  initialize: function() {
-    this._installedSubViews = {};
-    this._availableSubViews = {};
-    this._showDevel = true;
-    this._showActive = true;
-    this._showSystem = true;
-    this.reload();
-  },
-
-  render: function() {
-    this.collection.sort();
-
-    $(this.el).html(this.template.render({}));
-    this.renderSubViews();
-    this.delegateEvents();
-    $('#checkActive').attr('checked', this._showActive);
-    $('#checkDevel').attr('checked', this._showDevel);
-    $('.checkSystem').attr('checked', this._showSystem);
-    
-    var self = this;
-    _.each(this._installedSubViews, function(v) {
-      v.toggle("devel", self._showDevel);
-      v.toggle("active", self._showActive);
-      v.toggle("system", self._showSystem);
-    });
-
-    arangoHelper.fixTooltips("icon_arangodb", "left");
-    return this;
-  },
-
-  renderSubViews: function () {
-    _.each(this._installedSubViews, function (v) {
-      $("#installedList").append(v.render());
-    });
-
-    var versions = { };
-    _.each(this._availableSubViews, function (v) {
-      var name = v.model.get("name");
-
-      //look which installed apps have multiple versions
-      if (versions[name]) {
-        versions[name].counter++;
-        versions[name].versions.push(v.model.get("version"));
-      }
-      else {
-        versions[name] = {
-          counter: 1,
-          versions: [v.model.get("version")]
-        };
-      }
-    });
-
-    _.each(this._availableSubViews, function (v) {
-      var name = v.model.get("name"),
-      version = v.model.get("version");
-      if (versions[name].counter > 1 ) {
-        //here comes special render for multiple versions view
-
-        var highestVersion = "0.0.0";
-        var selectOptions = [];
-
-        _.each(versions[name].versions, function(x) {
-          selectOptions.push({
-            value: x,
-            label: x
           });
-          if (x > highestVersion) {
+          self._availableSubViews[foxx.get('_id')] = subView;
-            highestVersion = x;
+        } else if (foxx.get("type") === "mount") {
+          subView = new window.FoxxActiveView({
+            model: foxx,
+            appsView: self
+          });
+          self._installedSubViews[foxx.get('_id')] = subView;
+        }
+      });
+    },
+
+    initialize: function() {
+      this._installedSubViews = {};
+      this._availableSubViews = {};
+      this._showDevel = true;
+      this._showActive = true;
+      this._showSystem = true;
+      this.reload();
+    },
+
+    render: function() {
+      this.collection.sort();
+
+      $(this.el).html(this.template.render({}));
+      this.renderSubViews();
+      this.delegateEvents();
+      $('#checkActive').attr('checked', this._showActive);
+      $('#checkDevel').attr('checked', this._showDevel);
+      $('.checkSystem').attr('checked', this._showSystem);
+      
+      var self = this;
+      _.each(this._installedSubViews, function(v) {
+        v.toggle("devel", self._showDevel);
+        v.toggle("active", self._showActive);
+        v.toggle("system", self._showSystem);
+      });
+
+      arangoHelper.fixTooltips("icon_arangodb", "left");
+      return this;
+    },
+
+    renderSubViews: function () {
+      _.each(this._installedSubViews, function (v) {
+        $("#installedList").append(v.render());
+      });
+
+      var versions = { };
+      _.each(this._availableSubViews, function (v) {
+        var name = v.model.get("name");
+
+        //look which installed apps have multiple versions
+        if (versions[name]) {
+          versions[name].counter++;
+          versions[name].versions.push(v.model.get("version"));
+        }
+        else {
+          versions[name] = {
+            counter: 1,
+            versions: [v.model.get("version")]
+          };
+        }
+      });
+
+      _.each(this._availableSubViews, function (v) {
+        var name = v.model.get("name"),
+        version = v.model.get("version");
+        if (versions[name].counter > 1 ) {
+          //here comes special render for multiple versions view
+
+          var highestVersion = "0.0.0";
+          var selectOptions = [];
+
+          _.each(versions[name].versions, function(x) {
+            selectOptions.push({
+              value: x,
+              label: x
+            });
+            if (x > highestVersion) {
+              highestVersion = x;
+            }
+          });
+
+          if (version === highestVersion) {
+            v.model.set("highestVersion", highestVersion);
+            v.model.set("versions", versions[name].versions);
+            v.model.set("selectOptions", selectOptions);
+
+            $("#availableList").append(v.render());
           }
-        });
+        }
-
+        else {
-        if (version === highestVersion) {
-          v.model.set("highestVersion", highestVersion);
-          v.model.set("versions", versions[name].versions);
-          v.model.set("selectOptions", selectOptions);
-
           $("#availableList").append(v.render());
         }
-      }
+      });
-      else {
+    },
-        $("#availableList").append(v.render());
-      }
-    });
-  },
 
-  createInstallModal: function(event) {
+    installFoxxFromZip: function() {
-    event.preventDefault();
+      var self = this;
-    var buttons = [];
+      if (this.allowUpload) {
-    window.modalView.show(
+        this.showSpinner();
-      "modalApplicationMount.ejs",
+        $.ajax({
-      "Pijotr",
+          type: "POST",
-      buttons
+          async: false,
-    );
+          url: '/_api/upload',
-  }
+          data: self.file,
+          processData: false,
+          contentType: 'application/octet-stream',
+          complete: function(res) {
+            if (res.readyState === 4) {
+              if (res.status === 201) {
+                $.ajax({
+                  type: "POST",
+                  async: false,
+                  url: "/_admin/aardvark/foxxes/inspect",
+                  data: res.responseText,
+                  contentType: "application/json"
+                }).done(function(res) {
+                  $.ajax({
+                    type: "POST",
+                    async: false,
+                    url: '/_admin/foxx/fetch',
+                    data: JSON.stringify({
+                      name: res.name,
+                      version: res.version,
+                      filename: res.filename
+                    }),
+                    processData: false
+                  }).done(function () {
+                    self.reload();
+                  }).fail(function (err) {
+                    self.hideSpinner();
+                    var error = JSON.parse(err.responseText);
+                    arangoHelper.arangoError("Error: " + error.errorMessage);
+                  });
+                }).fail(function(err) {
+                  self.hideSpinner();
+                  var error = JSON.parse(err.responseText);
+                  arangoHelper.arangoError("Error: " + error.error);
+                });
+                delete self.file;
+                self.allowUpload = false;
+                self.hideSpinner();
+                self.hideImportModal();
+                return;
+              }
+            }
+            self.hideSpinner();
+            arangoHelper.arangoError("Upload error");
+          }
+        });
+      }
+    },
 
-});
+    installFoxxFromStore: function() {
+      //Todo
+    },
+
+    installFoxxFromGithub: function() {
+      var name, url, version, result;
+
+      //fetch needed information, need client side verification
+      //remove name handling on server side because not needed
+      name = "";
+      url = $('#repository').val();
+      version = $('#tag').val();
+
+      if (version === '') {
+        version = "master";
+      }
+
+      //send server req through collection
+      result = this.collection.installFoxxFromGithub(url, name, version);
+      console.log(result);
+      if (result.error === false) {
+        window.modalView.hide();
+        this.showConfigureDialog(result.configuration, result.name, result.version);
+      }
+    },
+
+    showConfigureDialog: function(config, name, version) {
+      var buttons = [],
+          tableContent = [],
+          entry;
+      tableContent.push(
+        window.modalView.createTextEntry(
+          "mount-point",
+          "Mount",
+          "",
+          "The path the App will be mounted. Has to start with /. Is not allowed to start with /_",
+          "/my/app",
+          true,
+          //TODO nochmal schauen
+          [
+            {
+              rule: Joi.string().required(),
+              msg: "No mountpoint given."
+            },
+            {
+              rule: Joi.string().regex(/^\/[^_]/),
+              msg: "Mountpoints with _ are reserved for internal use."
+            },
+            {
+              rule: Joi.string().regex(/^(\/[a-zA-Z0-9_\-%]+)+$/),
+              msg: "Mountpoints have to start with / and can only contain [a-zA-Z0-9_-%]"
+            }
+          ]
+        )
+      );
+      _.each(config, function(obj, name) {
+        var def;
+        var check;
+        switch (obj.type) {
+          case "boolean":
+          case "bool":
+            def = obj.default || false;
+            entry = window.modalView.createCheckboxEntry(
+              "app_config_" + name,
+              name,
+              def,
+              obj.description,
+              def
+            );
+            break;
+          case "integer":
+            check = [{
+              rule: Joi.number().integer(),
+              msg: "Has to be an integer."
+            }];
+          default:
+            if (check === undefined) {
+              check = [{
+                rule: Joi.string(),
+                msg: "Has to be non-empty."
+              }];
+            }
+            if (obj.default === undefined) {
+              def = "";
+            } else {
+              def = String(obj.default);
+            }
+            entry = window.modalView.createTextEntry(
+              "app_config_" + name,
+              name,
+              def,
+              obj.description,
+              def,
+              true,
+              check
+            );
+        }
+        tableContent.push(entry);
+      });
+      buttons.push(
+        window.modalView.createSuccessButton("Configure", this.mountFoxx.bind(this, config, name, version))
+      );
+      window.modalView.show(
+        "modalTable.ejs", "Configure Application", buttons, tableContent
+      );
+
+    },
+
+    mountFoxx: function(config, name, version) {
+      var cfg = {};
+      try {
+        _.each(config, function(opt, key) {
+          var $el = $("#app_config_" + key);
+          var val = $el.val();
+          if (opt.type === "boolean") {
+            cfg[key] = $el.is(":checked");
+            return;
+          }
+          if (val === "" && !opt.hasOwnProperty("default")) {
+            throw new SyntaxError(
+              "Must specify value for field \"" +
+                (opt.label || splitSnakeCase(key)) +
+                "\"!"
+            );
+          }
+          if (opt.type === "number") {
+            cfg[key] = parseFloat(val);
+          } else if (opt.type === "integer") {
+            cfg[key] = parseInt(val, 10);
+          } else {
+            cfg[key] = val;
+            return;
+          }
+          if (_.isNaN(cfg[key])) {
+            throw new SyntaxError(
+              "Invalid value for field \"" +
+                (opt.label || splitSnakeCase(key)) +
+                "\"!"
+            );
+          }
+          if (opt.type === "integer" && cfg[key] !== Math.floor(parseFloat(val))) {
+            throw new SyntaxError(
+              "Expected non-decimal value in field \"" +
+                (opt.label || splitSnakeCase(key)) +
+                "\"!"
+            );
+          }
+        });
+      } catch (err) {
+        if (err instanceof SyntaxError) {
+          alert(err.message);
+          return false;
+        }
+        throw err;
+      }
+      var self = this;
+      this.collection.create({
+        mount: $("#mount-point").val(),
+        name: name,
+        version: version,
+        options: {
+          configuration: cfg
+        }
+      },
+      {
+        success: function() {
+          window.modalView.hide();
+          self.reload();
+        },
+        error: function(e, info) {
+          if (info.responseText.indexOf("already used by") > -1) {
+            alert("Mount-Path already in use.");
+          } else if (info.responseText.indexOf("app is not defined") > -1) {
+            //temp ignore this message, fix needs to be server-side
+            window.modalView.hide();
+            self.reload();
+          } else {
+            alert(info.statusText);
+          }
+        }
+      });
+    },
+
+    installFoxx: function() {
+
+      this.reload();
+    },
+
+    createInstallModal: function(event) {
+      event.preventDefault();
+      var buttons = [];
+      var modalEvents = {
+        "click #installGithub"         : this.installFoxxFromGithub.bind(this),
+        "click #installZip"         : this.submitGithubFoxx.bind(this),
+        "click .install-app"         : this.submitGithubFoxx.bind(this),
+      };
+      window.modalView.show(
+        "modalApplicationMount.ejs",
+        "Install Application",
+        buttons,
+        undefined,
+        undefined,
+        modalEvents
+      );
+    }
+
+  });
+
+}());

js/apps/system/aardvark/frontend/js/views/foxxInstalledView.js

@@ -400,8 +400,7 @@
       var opts = this.model.get("manifest").configuration;
       if (opts && _.keys(opts).length) {
         try {
-          _.each(_.keys(opts), function(key) {
+          _.each(opts, function(opt, key) {
-            var opt = opts[key];
             var $el = $("#foxx_configs_" + key);
             var val = $el.val();
             if (opt.type === "boolean") {
@@ -453,7 +452,6 @@
         version: version
       });
 
-      //this.model.collection.create({
       toCreate.collection.create({
         mount: mountPoint,
         name: toCreate.get("name"),

js/apps/system/aardvark/frontend/js/views/modalView.js

@@ -14,22 +14,22 @@
     };
   };
 
-  var createTextStub = function(type, label, value, info, placeholder, mandatory, regexp,
+  var createTextStub = function(type, label, value, info, placeholder, mandatory, joiObj,
                                 addDelete, addAdd, maxEntrySize, tags) {
     var obj = {
       type: type,
       label: label
     };
-    if (value) {
+    if (value !== undefined) {
       obj.value = value;
     }
-    if (info) {
+    if (info !== undefined) {
       obj.info = info;
     }
-    if (placeholder) {
+    if (placeholder !== undefined) {
       obj.placeholder = placeholder;
     }
-    if (mandatory) {
+    if (mandatory !== undefined) {
       obj.mandatory = mandatory;
     }
     if (addDelete !== undefined) {
@@ -44,11 +44,11 @@
     if (tags !== undefined) {
       obj.tags = tags;
     }
-    if (regexp){
+    if (joiObj){
       // returns true if the string contains the match
-      obj.validateInput = function(el){
+      obj.validateInput = function() {
-        //return regexp.test(el.val());
+        // return regexp.test(el.val());
-        return regexp;
+        return joiObj;
       };
     }
     return obj;
@@ -311,14 +311,14 @@
       self.testInput = (function(){
         _.each(completeTableContent,function(r){
 
-          if(r.validateInput) {
+          if(r.validateInput !== undefined) {
             //catch result of validation and act
             $('#' + r.id).on('keyup focusout', function(e){
 
               var validation = r.validateInput($('#' + r.id));
               var error = false, msg;
 
-              _.each(validation, function(validator, key) {
+              _.each(validation, function(validator) {
 
                 var schema = Joi.object().keys({
                   toCheck: validator.rule
@@ -334,8 +334,7 @@
                   toCheck: valueToCheck
                 },
                 schema,
-                function (err, value) {
+                function (err) {
-
                   if (err) {
                     msg = validator.msg;
                     error = true;