Added url routing and basic view for package and resource details vie…

…w. Refactord all AdminViews into one base Class.
iRail · Sep 26, 2011 · f25ff84 · f25ff84
1 parent fcb817c
commit f25ff84
Show file tree

Hide file tree

Showing 2 changed files with 58 additions and 37 deletions.
diff --git a/static/admin.js b/static/admin.js
@@ -10,6 +10,21 @@ window.App = (function ($, _, Backbone) {
         },
     });
 
+    window.AdminView = jQueryView.extend({
+        initialize: function() {
+            // Super
+            jQueryView.prototype.initialize.call(this);
+        },
+
+        render: function() {
+            this.el.removeClass('hidden');
+        },
+
+        hide: function() {
+            this.el.addClass('hidden');
+        },
+    });
+
     window.ModalBox = Backbone.View.extend({
         el: '#admin-package-remove-modal',
     });
@@ -34,13 +49,6 @@ window.App = (function ($, _, Backbone) {
 
         initialize: function() {
             this._menu = $('#admin-menu li');
-            // Fill packages and resources.
-            //Packages.fetch({success: function() {
-                //console.log('fetch pkg');
-            //}});
-            //Resources.fetch({success: function() {
-                //console.log('fetch res');
-            //}});
         },
 
         activatePage: function(page) {
@@ -64,7 +72,9 @@ window.App = (function ($, _, Backbone) {
         routes: {
             '': 'index',
             'packages': 'packages',
+            'packages/:name', 'packageDetails',
             'resources': 'resources',
+            'resources/:name', 'resourceDetails',
             'profile': 'profile',
         },
 
@@ -84,6 +94,10 @@ window.App = (function ($, _, Backbone) {
             this.activatePage(this._packages);
         },
 
+        packageDetails: function(name) {
+
+        },
+
         resources: function() {
             if (!this._resources) {
                 this._resources = new ResourceAdminView();
@@ -92,6 +106,10 @@ window.App = (function ($, _, Backbone) {
             this.activatePage(this._resources);
         },
 
+        resourceDetails: function(name) {
+
+        },
+
         profile: function() {
             if (!this._profile) {
                 this._profile = new ProfileAdminView();
@@ -111,16 +129,14 @@ window.App = (function ($, _, Backbone) {
 
     /*** Index ***/
 
-    window.IndexAdminView = jQueryView.extend({
+    window.IndexAdminView = AdminView.extend({
         el: '#admin-admin',
 
-        render: function() {
-            this.el.removeClass('hidden');
+        initialize: function() {
+            // Super
+            AdminView.prototype.initialize.call(this);
         },
 
-        hide: function() {
-            this.el.addClass('hidden');
-        },
     });
 
     /*** Package ***/
@@ -208,8 +224,6 @@ window.App = (function ($, _, Backbone) {
 
         removePackage: function() {
             var modal = new PackageRemoveModal({model: this.model});
-            //$('body').append(this.removeModalTemplate.tmpl());
-            //$('body').append('<div class="modal fade"><div class="modal-header"> <a href="#" class="close">&times;</a> <h3>Modal Heading</h3> </div> <div class="modal-body"> <p>One fine body…</p> </div> <div class="modal-footer"> <a href="#" class="btn primary">Primary</a> <a href="#" class="btn secondary">Secondary</a> </div></div>');
         },
 
         detailPackage: function() {
@@ -222,13 +236,12 @@ window.App = (function ($, _, Backbone) {
         },
     });
 
-    window.PackageAdminView = jQueryView.extend({
+    window.PackageAdminView = AdminView.extend({
         el: '#admin-package',
-        //_packageView: null,
 
         initialize: function() {
-            // super
-            jQueryView.prototype.initialize.call(this);
+            // Super
+            AdminView.prototype.initialize.call(this);
 
             Packages.bind('add',   this.addOne, this);
             Packages.bind('reset', this.addAll, this);
@@ -286,6 +299,16 @@ window.App = (function ($, _, Backbone) {
         },
     });
 
+    window.PackageDetailsAdminView = AdminView.extend({
+        el: 'admin-package-details',
+
+        initialize: function() {
+            // Super
+            AdminView.prototype.initialize.call(this);
+        },
+    });
+
+
     /*** Resources ***/
 
     window.Resource = Backbone.Model.extend({
@@ -344,12 +367,12 @@ window.App = (function ($, _, Backbone) {
         },
     });
 
-    window.ResourceAdminView = jQueryView.extend({
+    window.ResourceAdminView = AdminView.extend({
         el: '#admin-resource',
 
         initialize: function() {
-            // super
-            jQueryView.prototype.initialize.call(this);
+            // Super
+            AdminView.prototype.initialize.call(this);
 
             Resources.bind('add',   this.addOne, this);
             Resources.bind('reset', this.addAll, this);
@@ -464,27 +487,16 @@ window.App = (function ($, _, Backbone) {
         addAll: function() {
             Resources.each(this.addOne);
         },
-
-        render: function() {
-            this.el.removeClass('hidden');
-        },
-
-        hide: function() {
-            this.el.addClass('hidden');
-        },
     });
 
     /*** Profile ***/
 
-    window.ProfileAdminView = jQueryView.extend({
+    window.ProfileAdminView = AdminView.extend({
         el: '#admin-profile',
 
-        render: function() {
-            this.el.removeClass('hidden');
-        },
-
-        hide: function() {
-            this.el.addClass('hidden');
+        initialize: function() {
+            // Super
+            AdminView.prototype.initialize.call(this);
         },
     })
 

diff --git a/templates/admin.html b/templates/admin.html
@@ -168,6 +168,10 @@ <h1>Packages</h1>
                 </form>
             </div>
 
+            <div id="admin-package-details" class="hidden">
+                <h1>Package details</h1>
+            </div>
+
             <div id="admin-resource" class="hidden">
                 <h1>Resources</h1>
                 <table class="zebra-striped">
@@ -254,6 +258,11 @@ <h1>Resources</h1>
                         </div>
                     </form>
                 </div>
+            </div>
+
+            <div id="admin-resource-details" class="hidden">
+                <h1>Resource details</h1>
+            </div>
 
             <div id="admin-profile" class="hidden">
                 <h1>Profile</h1>