made sidebar menus react to current page/section

openid-connect-server-webapp/src/main/webapp/resources/js/admin.js

@@ -496,6 +496,8 @@ var AppRouter = Backbone.Router.extend({
             {text:"Home", href:""},
             {text:"Manage Clients", href:"manage/#admin/clients"}
         ]);
+        
+        this.updateSidebar('admin/clients');
 
         var view = new ClientListView({model:this.clientList, stats: this.clientStats, systemScopeList: this.systemScopeList, whiteListList: this.whiteListList});
         
@@ -521,7 +523,9 @@ var AppRouter = Backbone.Router.extend({
             {text:"New", href:""}
         ]);
 
-    	var client = new ClientModel();
+        this.updateSidebar('admin/clients');
+
+        var client = new ClientModel();
     	
         var view = new ClientFormView({model:client, systemScopeList: this.systemScopeList});
         view.load(function() {
@@ -560,8 +564,8 @@ var AppRouter = Backbone.Router.extend({
             {text:"Edit", href:"manage/#admin/client/" + id}
         ]);
 
-        // TODO: this won't load on its own anymore, need to dynamically load the client in question first (don't need to load the rest)
+        this.updateSidebar('admin/clients');
-        
+
         var client = this.clientList.get(id);
         
         if (client == null) {
@@ -625,7 +629,9 @@ var AppRouter = Backbone.Router.extend({
     		return;
     	}
 
-    	this.breadCrumbView.collection.reset();
+        this.updateSidebar('admin/whitelists');
+
+        this.breadCrumbView.collection.reset();
         this.breadCrumbView.collection.add([
             {text:"Home", href:""},
             {text:"Manage Whitelisted Sites", href:"manage/#admin/whitelists"}
@@ -651,7 +657,9 @@ var AppRouter = Backbone.Router.extend({
     		return;
     	}
 
-    	var client = this.clientList.get(cid);
+        this.updateSidebar('admin/whitelists');
+
+        var client = this.clientList.get(cid);
 
         // if there's no client this is an error
         if (client != null) {
@@ -693,6 +701,8 @@ var AppRouter = Backbone.Router.extend({
             {text:"Manage Whitelisted Sites", href:"manage/#admin/whitelist/" + id}
         ]);
         
+        this.updateSidebar('admin/whitelists');
+
         var whiteList = this.whiteListList.get(id);
         if (whiteList != null) {
             var client = app.clientList.getByClientId(whiteList.get('clientId'));
@@ -718,7 +728,9 @@ var AppRouter = Backbone.Router.extend({
             {text:"Manage Approved Sites", href:"manage/#user/approve"}
         ]);
 
-    	var view = new ApprovedSiteListView({model:this.approvedSiteList, clientList: this.clientList, systemScopeList: this.systemScopeList});
+        this.updateSidebar('user/approved');
+
+        var view = new ApprovedSiteListView({model:this.approvedSiteList, clientList: this.clientList, systemScopeList: this.systemScopeList});
     	
     	view.load( 
     		function(collection, response, options) {
@@ -736,6 +748,8 @@ var AppRouter = Backbone.Router.extend({
             {text:"Manage Active Tokens", href:"manage/#user/tokens"}
         ]);
         
+        this.updateSidebar('user/tokens');
+
         var view = new TokenListView({model: {access: this.accessTokensList, refresh: this.refreshTokensList}, clientList: this.clientList, systemScopeList: this.systemScopeList});
         
         view.load(
@@ -752,7 +766,10 @@ var AppRouter = Backbone.Router.extend({
         this.breadCrumbView.collection.add([
             {text:"Home", href:""}
         ]);
-    		$('#content').html("<h2>Not implemented yet.</h2>");
+        
+        this.updateSidebar('none');
+        
+   		$('#content').html("<h2>Not implemented yet.</h2>");
     },
     
     blackList:function() {
@@ -768,6 +785,8 @@ var AppRouter = Backbone.Router.extend({
             {text:"Manage Blacklisted Sites", href:"manage/#admin/blacklist"}
         ]);
         
+        this.updateSidebar('admin/blacklist');
+        
         var view = new BlackListListView({model:this.blackListList});
         
         view.load(
@@ -791,6 +810,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"Manage System Scopes", href:"manage/#admin/scope"}
         ]);
     	
+        this.updateSidebar('admin/scope');
+        
     	var view = new SystemScopeListView({model:this.systemScopeList});
     	
     	view.load(function() {
@@ -815,6 +836,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"New", href:"manage/#admin/scope/new"}
         ]);
     	
+        this.updateSidebar('admin/scope');
+        
     	var scope = new SystemScopeModel();
     	
     	this.systemScopeFormView = new SystemScopeFormView({model:scope});
@@ -837,6 +860,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"Edit", href:"manage/#admin/scope/" + sid}
         ]);
 
+        this.updateSidebar('admin/scope');
+        
     	var scope = this.systemScopeList.get(sid);
     	
     	this.systemScopeFormView = new SystemScopeFormView({model:scope});
@@ -854,6 +879,8 @@ var AppRouter = Backbone.Router.extend({
     	
     	var view = new DynRegRootView({systemScopeList: this.systemScopeList});
     	
+        this.updateSidebar('dev/dynreg');
+        
     	view.load(function() {
     			$('#content').html(view.render().el);
     			
@@ -870,6 +897,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"New", href:"manage/#dev/dynreg/new"}
         ]);
     	
+        this.updateSidebar('dev/dynreg');
+        
     	var client = new DynRegClient();
     	var view = new DynRegEditView({model: client, systemScopeList:this.systemScopeList});
     	
@@ -901,6 +930,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"Edit", href:"manage/#dev/dynreg/edit"}
         ]);
     	
+        this.updateSidebar('dev/dynreg');
+        
     	setPageTitle("Edit a Dynamically Registered Client");
     	// note that this doesn't actually load the client, that's supposed to happen elsewhere...
     },
@@ -912,6 +943,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"Protected Resource Registration", href:"manage/#dev/resource"}
         ]);
     	
+        this.updateSidebar('dev/resource');
+        
     	var view = new ResRegRootView({systemScopeList: this.systemScopeList});
     	view.load(function() {
     			$('#content').html(view.render().el);
@@ -929,6 +962,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"New", href:"manage/#dev/resource/new"}
         ]);
     	
+        this.updateSidebar('dev/resource');
+        
     	var client = new ResRegClient();
     	var view = new ResRegEditView({model: client, systemScopeList:this.systemScopeList});
     	
@@ -955,6 +990,8 @@ var AppRouter = Backbone.Router.extend({
              {text:"Edit", href:"manage/#dev/resource/edit"}
         ]);
     	
+        this.updateSidebar('dev/resource');
+        
     	setPageTitle("Edit a Dynamically Registered Protected Resource");
     	// note that this doesn't actually load the client, that's supposed to happen elsewhere...
     },
@@ -966,14 +1003,20 @@ var AppRouter = Backbone.Router.extend({
              {text:"Profile", href:"manage/#user/profile"}
         ]);
     
+        this.updateSidebar('user/profile');
+        
     	this.userProfileView = new UserProfileView({model: getUserInfo()});
     	$('#content').html(this.userProfileView.render().el);
     	
     	setPageTitle("View User Profile");
     	
+    },
+    
+    updateSidebar:function(item) {
+    	$('.sidebar-nav li.active').removeClass('active');
+    	
+    	$('.sidebar-nav li a[href^="manage/#' + item + '"]').parent().addClass('active');
     }
-
-
 });
 
 // holds the global app.
@@ -1005,11 +1048,6 @@ $(function () {
     // grab all hashed URLs and send them through the app router instead
     $(document).on('click', 'a[href^="manage/#"]', function(event) {
     	event.preventDefault();
-    	
-    	$('.sidebar-nav li.active').removeClass('active');
-    	
-    	$(this).parent().addClass('active');
-    	
     	app.navigate(this.hash.slice(1), {trigger: true});
     });