Frontend: Added Edit-Icon to running foxxes, but no functionality yet, Foxxes are now reloaded whenever application is opened, no reload of Admin-Interface necessary anymore.

html/admin/css/foxxView.css

@@ -2,7 +2,7 @@
   padding-top: 30px;
 }
 .foxxDescription {
-  width:190px;
+  width:170px;
   float: left;
   text-align: left;
   word-wrap: break-word;

html/admin/js/routers/router.js

@@ -164,7 +164,7 @@ $(document).ready(function() {
           collection: this.foxxList
         });
       }
-      this.applicationsInstalledView.render();
+      this.applicationsInstalledView.reload();
       this.naviView.selectMenuItem('applications-menu');
     },
     
@@ -177,7 +177,7 @@ $(document).ready(function() {
           collection: this.foxxList
         });
       }
-      this.applicationsActiveView.render();
+      this.applicationsActiveView.reload();
       this.naviView.selectMenuItem('applications-menu');
     },
     

html/admin/js/templates/foxxActiveView.ejs

@@ -2,6 +2,9 @@
   <div class="plain">
     <% var appInfos = attributes.app.split(":"); %>
     <h5 class="applicationName"><%= appInfos[1] %></h5>
+    <div class="pull-right">
+        <i class="icon-edit" alt="Properties" title="Change foxx properties"></i>
+    </div>
     <img src="img/icon_arango.png" alt="icon" class="foxxIcon"/>
     <p class="foxxDescription">
       <!--Description: <%=attributes.description %><br /> -->

html/admin/js/views/foxxActiveListView.js

@@ -16,11 +16,27 @@ var FoxxActiveListView = Backbone.View.extend({
           self._subViews[foxx.get('_id')] = subView;
         });
         self.render();
+      },
+      error: function() {
+        console.log("Erroreoror!!");
       }
     });
     this.render();
   },
   
+  reload: function() {
+    var self = this;
+    this.collection.fetch({
+      success: function() {
+        self._subViews = {};
+        _.each(self.collection.where({type: "mount"}), function (foxx) {
+          var subView = new window.FoxxActiveView({model: foxx});
+          self._subViews[foxx.get('_id')] = subView;
+        });
+        self.render();
+      }
+    });
+  },
   
   render: function() {
     $(this.el).html(this.template.text);

html/admin/js/views/foxxActiveView.js

@@ -4,13 +4,17 @@ window.FoxxActiveView = Backbone.View.extend({
   template: new EJS({url: '/_admin/html/js/templates/foxxActiveView.ejs'}),
   
   events: {
-    // 'click button#add': 'callback'
+    'click .icon-edit': 'editFoxx'
   },
   
   initialize: function(){
     _.bindAll(this, 'render');
   },
   
+  editFoxx: function() {
+    alert("Functionality will be added soon: You will be able to configure your foxx here.")
+  },
+    
   render: function(){
     $(this.el).html(this.template.render(this.model));
     return $(this.el);

html/admin/js/views/foxxInstalledListView.js

@@ -20,6 +20,20 @@ var FoxxInstalledListView = Backbone.View.extend({
     });
   },
   
+  reload: function() {
+    var self = this;
+    this.collection.fetch({
+      success: function() {
+        self._subViews = {};
+        _.each(self.collection.where({type: "app"}), function (foxx) {
+          var subView = new window.FoxxInstalledView({model: foxx});
+          self._subViews[foxx.get('_id')] = subView;
+        });
+        self.render();
+      }
+    });
+  },
+  
   
   render: function() {
     $(this.el).html(this.template.text);