add subpages to router

4 files changed, 62 insertions, 25 deletions

diff --git a/www/js/musicpools.js b/www/js/musicpools.js
index 400c0bd..065b4d8 100644
--- a/www/js/musicpools.js
+++ b/www/js/musicpools.js
@@ -26,9 +26,9 @@ var Rdxport = Rdxport || {};
 
 var musicpoolsView = null;
 
-function musicpools_init() {
+function musicpools_init(subpage) {
   var musicpools = new Rdxport.GroupList();
-  musicpoolsView = new Rdxport.MusicpoolsView(musicpools);
+  musicpoolsView = new Rdxport.MusicpoolsView(musicpools, subpage);
 }
 
 function musicpools_cleanup() {
@@ -36,11 +36,13 @@ function musicpools_cleanup() {
   musicpoolsView = null;
 }
 
-Rdxport.MusicpoolsView = function(model) {
+Rdxport.MusicpoolsView = function(model, subpage) {
   this.model = model;
 
   this.musicpoolViews = [];
-  this.currentPoolId = sessionStorage.getItem('currentPoolId');
+  this.currentPoolId = null;
+
+  this.setCurrentPoolId(subpage);
 
   var self = this;
   $(this.model).on('update', function() {
@@ -54,6 +56,16 @@ Rdxport.MusicpoolsView = function(model) {
 };
 
 Rdxport.MusicpoolsView.prototype.setCurrentPoolId = function(currentPoolId) {
+  if (!currentPoolId) {
+    return;
+  }
+  if (this.currentPoolId !== currentPoolId) {
+    if (this.currentPoolId) {
+      history.pushState(null, null, '/musicpools/' + currentPoolId + '/');
+    } else {
+      history.replaceState(null, null, '/musicpools/' + currentPoolId + '/');
+    }
+  }
   this.currentPoolId = currentPoolId;
   sessionStorage.setItem('currentPoolId', this.currentPoolId);
 };
@@ -91,8 +103,14 @@ Rdxport.MusicpoolsView.prototype.updateSelector = function() {
     $musicpoolSelector.append($('<option>').attr('value', musicpool.clock).text(name));
   });
 
-  if (this.currentPoolId === null) {
-    this.setCurrentPoolId(this.model.groups[0].clock);
+  // todo: maybe integrate this into setCurrentShowId?
+  if (!this.currentPoolId) {
+    var currentPoolId = sessionStorage.getItem('currentPoolId');
+    if (currentPoolId) {
+      this.setCurrentPoolId(currentPoolId);
+    } else {
+      this.setCurrentPoolId(this.model.groups[0].id);
+    }
   }
   $('option[value="' + this.currentPoolId + '"]', $musicpoolSelector).attr('selected', 'selected');
 
diff --git a/www/js/router.js b/www/js/router.js
index 62b9a77..d9d070f 100644
--- a/www/js/router.js
+++ b/www/js/router.js
@@ -69,9 +69,11 @@ Rdxport.Router.prototype.route = function(page, subpage) {
     //todo: add errors
   });*/
 
+  var href = ['', ''];
   if (!page && !subpage) {
-    page = locationHrefValue();
-    subpage = '';
+    href = locationHrefValue();
+    page = href[1];
+    subpage = href[2];
   }
 
   shows_cleanup();
@@ -90,8 +92,9 @@ Rdxport.Router.prototype.route = function(page, subpage) {
     var href = $(this).attr('href').split('/');
     self.route(href[1], href[2]);
   });
-  $(window).on('popstate', function(event) {
-    self.route(locationHrefValue(), '');
+  $(window).off('popstate').on('popstate', function(event) {
+    var href = locationHrefValue();
+    self.route(href[1], href[2]);
   });
 
   switch (page) {
@@ -115,10 +118,11 @@ Rdxport.Router.prototype.route = function(page, subpage) {
       break;
   }
 
-  if (locationHrefValue() !== page && page !== 'logout') {
+  href = locationHrefValue();
+  if (href[1] !== page && page !== 'logout' && (!href[2] || href[2] !== subpage)) {
     var url = '/' + page + '/';
     if (subpage) {
-      url +=+ subpage + '/';
+      url += subpage + '/';
     }
     history.pushState(null, null, url);
   }
@@ -149,7 +153,7 @@ Rdxport.Router.prototype.logout = function() {
 Rdxport.Router.prototype.shows = function(subpage) {
   $('#app-shows').show();
   $('#nav-btn-shows').addClass('active');
-  shows_init();
+  shows_init(subpage);
 };
 
 Rdxport.Router.prototype.jingles = function() {
@@ -161,7 +165,7 @@ Rdxport.Router.prototype.jingles = function() {
 Rdxport.Router.prototype.musicpools = function(subpage) {
   $('#app-musicpools').show();
   $('#nav-btn-musicpools').addClass('active');
-  musicpools_init();
+  musicpools_init(subpage);
 };
 
 Rdxport.Router.prototype.musicgrid = function() {
diff --git a/www/js/shows.js b/www/js/shows.js
index f0eb34e..bb8058d 100644
--- a/www/js/shows.js
+++ b/www/js/shows.js
@@ -26,9 +26,9 @@ var Rdxport = Rdxport || {};
 
 var showListView = null;
 
-function shows_init() {
+function shows_init(subpage) {
   var showList = new Rdxport.GroupList();
-  showListView = new Rdxport.ShowListView(showList);
+  showListView = new Rdxport.ShowListView(showList, subpage);
 
   drawClock('Do, 1.1.1970', '00:00:00', 0);
   clock_add_callback(drawClock);
@@ -39,11 +39,13 @@ function shows_cleanup() {
   importer.cancelAllUploads();
 }
 
-Rdxport.ShowListView = function(model) {
+Rdxport.ShowListView = function(model, subpage) {
   this.model = model;
 
   this.showViews = [];
-  this.currentShowId = sessionStorage.getItem('currentShowId');
+  this.currentShowId = null;
+
+  this.setCurrentShowId(subpage);
 
   var self = this;
   $(this.model).on('update', function() {
@@ -57,6 +59,16 @@ Rdxport.ShowListView = function(model) {
 };
 
 Rdxport.ShowListView.prototype.setCurrentShowId = function(currentShowId) {
+  if (!currentShowId) {
+    return;
+  }
+  if (this.currentShowId !== currentShowId) {
+    if (this.currentShowId) {
+      history.pushState(null, null, '/shows/' + currentShowId + '/');
+    } else {
+      history.replaceState(null, null, '/shows/' + currentShowId + '/');
+    }
+  }
   this.currentShowId = currentShowId;
   sessionStorage.setItem('currentShowId', this.currentShowId);
 };
@@ -68,9 +80,6 @@ Rdxport.ShowListView.prototype.getCurrentShowView = function() {
   if (this.showViews.length === 0) {
     return null;
   }
-  if (this.currentShowId === null) {
-    this.setCurrentShowId(this.model.groups[0].id);
-  }
   var self = this;
   var showViewFound = null;
   $(this.showViews).each(function(index, showView) {
@@ -94,8 +103,14 @@ Rdxport.ShowListView.prototype.updateSelector = function() {
     $showSelector.append($('<option>').attr('value', show.id).text(name));
   });
 
-  if (this.currentShowId === null) {
-    this.setCurrentShowId(this.model.groups[0].id);
+  // todo: maybe integrate this into setCurrentShowId?
+  if (!this.currentShowId) {
+    var currentShowId = sessionStorage.getItem('currentShowId');
+    if (currentShowId) {
+      this.setCurrentShowId(currentShowId);
+    } else {
+      this.setCurrentShowId(this.model.groups[0].id);
+    }
   }
   $('option[value="' + this.currentShowId + '"]', $showSelector).attr('selected', 'selected');
 
diff --git a/www/js/utils.js b/www/js/utils.js
index 26b0822..eaed673 100644
--- a/www/js/utils.js
+++ b/www/js/utils.js
@@ -108,8 +108,8 @@ function get_rd_week(msEpoch) {
 }
 
 function locationHrefValue() {
-  var value = window.location.href.match(/import.helsinki.at\/([a-z]+)\/?.*/);
-  return value ? value[1] : '';
+  var value = window.location.href.match(/import.helsinki.at\/([a-z]+)\/?([a-z0-9]+)?\/?.*/);
+  return value ? value : '';
 }
 
 /*