1 files changed, 40 insertions, 19 deletions

diff --git a/www/js/musicpools.js b/www/js/musicpools.js
index 400c0bd..5b3d491 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);
 };
@@ -84,22 +96,31 @@ Rdxport.MusicpoolsView.prototype.updateSelector = function() {
   var $musicpoolSelector = $('#musicpool-selector');
 
   $musicpoolSelector.off();
-  $('option', $musicpoolSelector).remove();
-
-  $(this.model.groups).each(function(index, musicpool) {
-    var name = musicpool.title + ' (' + musicpool.clock + ')';
-    $musicpoolSelector.append($('<option>').attr('value', musicpool.clock).text(name));
+  $('li', $musicpoolSelector).remove();
+
+  $(this.model.groups).sort(function(a, b) {
+    return a.title.toLowerCase() >= b.title.toLowerCase()
+  }).each(function(index, musicpool) {
+    var name = '<strong>' + musicpool.title + '</strong> (' + musicpool.clock + ')';
+    var link = $('<a>').attr('href', '#').html(name).click(function() {
+      self.setCurrentPoolId(musicpool.clock);
+      self.getCurrentPoolView().model.fetchCarts();
+    });
+    $musicpoolSelector.append($('<li>').append(link));
   });
-
-  if (this.currentPoolId === null) {
-    this.setCurrentPoolId(this.model.groups[0].clock);
+  if($musicpoolSelector.children().length == 0) {
+    $musicpoolSelector.append($('<li>').append($('<a>').text('Keinen Musikpool gefunden!')));
   }
-  $('option[value="' + this.currentPoolId + '"]', $musicpoolSelector).attr('selected', 'selected');
 
-  $musicpoolSelector.on('change', function() {
-    self.setCurrentPoolId($('option:selected', $musicpoolSelector).attr('value'));
-    self.getCurrentPoolView().model.fetchCarts();
-  });
+  // 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);
+    }
+  }
 
   this.getCurrentPoolView().model.fetchCarts();
 };
@@ -136,7 +157,7 @@ Rdxport.MusicpoolView.prototype.render = function() {
   this.$el = $('#hiddenTemplates .musicpoolTemplate').clone().removeClass('musicpoolTemplate');
   $('#app-musicpools .musicpoolContainer').html(this.$el);
 
-  $('h2', this.$el).html(this.model.title);
+  $('#musicpool-title').text(this.model.title);
   $('table tbody tr', this.$el).remove();
 
   this.cartViews = [];
@@ -184,7 +205,7 @@ Rdxport.MusicpoolView.prototype.uploadError = function(upload, file, msg, xhr, a
   //var msg = $(xmlDoc);
   //var responseCode = msg.find('ResponseCode').text();
   //var errorString = msg.find('ErrorString').text();
-  var reason = $('<span>').addClass('label').addClass('label-danger').text(responseCode).after($('<b>').html('&nbsp;' + errorString));
+  var reason = $('<span>').addClass('label').addClass('label-danger').text(responseCode).after($('<b>').text('&nbsp;' + errorString));
 
   var dismiss_button = '<button class="btn btn-info btn-xs">' +
     '<span class="glyphicon glyphicon-remove"></span>&nbsp;&nbsp;Ok</button>';