summaryrefslogtreecommitdiff
path: root/www
diff options
context:
space:
mode:
Diffstat (limited to 'www')
-rw-r--r--www/index.html53
-rw-r--r--www/js/apps.js157
-rw-r--r--www/js/auth.js162
-rw-r--r--www/js/clock.js24
-rw-r--r--www/js/importer.js6
-rw-r--r--www/js/musicpools.js30
-rw-r--r--www/js/router.js176
-rw-r--r--www/js/shows.js35
-rw-r--r--www/js/utils.js4
-rw-r--r--www/styles/main-style.css8
-rw-r--r--www/styles/shows.css5
11 files changed, 351 insertions, 309 deletions
diff --git a/www/index.html b/www/index.html
index 68b2d36..ec7ba8b 100644
--- a/www/index.html
+++ b/www/index.html
@@ -15,20 +15,6 @@
<link href="/styles/jingles.css" rel="stylesheet">
<link href="/styles/musicpools.css" rel="stylesheet">
<link href="/styles/musicgrid.css" rel="stylesheet">
- <script src="/javascript/jquery/jquery.min.js"></script>
- <script src="/javascript/bootstrap/js/bootstrap.min.js"></script>
- <script src="/js/dropzone.js"></script>
- <script src="/js/rdxport.js"></script>
- <script src="/js/rdxport.rh.js"></script>
- <script src="/js/utils.js"></script>
- <script src="/js/clock.js"></script>
- <script src="/js/importer.js"></script>
- <script src="/js/auth.js"></script>
- <script src="/js/apps.js"></script>
- <script src="/js/shows.js"></script>
- <script src="/js/jingles.js"></script>
- <script src="/js/musicpools.js"></script>
- <script src="/js/musicgrid.js"></script>
</head>
<body>
@@ -40,7 +26,7 @@
<img class="visible-xs-block" src="/img/helsinki-small.png" alt="radio helsinki logo" />
<div class="loginspacer hidden-xs">&nbsp;</div>
<div class="loginspacer hidden-xs hidden-sm">&nbsp;</div>
- <img class="hidden-xs" src="/img/helsinki.png" alt="radio helsinki logo" />
+ <img class="hidden-xs" src="/img/helsinki.png" alt="radio helsinki logo" width="176" height="176" />
<h1 class="form-auth-heading">Radio Helsinki - Import</h1>
<input id="username" type="text" class="form-control" placeholder="Benutzername" required autofocus>
<input id="password" type="password" class="form-control" placeholder="Passwort" required>
@@ -67,16 +53,16 @@
<div class="collapse navbar-collapse" id="navbar-collapse-1">
<div class="navbar-left">
<ul class="nav navbar-nav">
- <li id="nav-btn-shows"><a href="/shows/" onclick="event.preventDefault(); apps_select('shows')">Sendungen</a></li>
- <li id="nav-btn-jingles"><a href="/jingles/" onclick="event.preventDefault(); apps_select('jingles')">Jingles</a></li>
- <li id="nav-btn-musicpools"><a href="/musicpools/" onclick="event.preventDefault(); apps_select('musicpools')">Musikpools</a></li>
- <li id="nav-btn-musicgrid"><a href="/musicgrid/" onclick="event.preventDefault(); apps_select('musicgrid')">Musikgrid</a></li>
+ <li id="nav-btn-shows"><a href="/shows/">Sendungen</a></li>
+ <li id="nav-btn-jingles"><a href="/jingles/">Jingles</a></li>
+ <li id="nav-btn-musicpools"><a href="/musicpools/">Musikpools</a></li>
+ <li id="nav-btn-musicgrid"><a href="/musicgrid/">Musikgrid</a></li>
</ul>
</div>
<div class="navbar-right">
<p class="navbar-text">angemeldet als <strong id="username-field">UNKNOWN</strong></p>
- <button type="button" class="btn btn-danger navbar-btn" onclick="auth_logout()">
+ <button type="button" class="btn btn-danger navbar-btn logout">
<span class="glyphicon glyphicon-log-out" aria-hidden="true"></span>&nbsp;&nbsp;Abmelden
</button>
</div>
@@ -128,7 +114,7 @@
</div>
</div>
- <div id="app-shows" class="container-fluid">
+ <div id="app-shows" class="container-fluid app-tab">
<div class="alertbox"></div>
<div class="row">
<div class="col-md-10">
@@ -194,7 +180,7 @@
</div>
</div>
- <div id="app-jingles" class="container-fluid">
+ <div id="app-jingles" class="container-fluid app-tab">
<div class="alertbox"></div>
<div class="groups">
@@ -203,7 +189,7 @@
</div>
- <div id="app-musicpools" class="container-fluid">
+ <div id="app-musicpools" class="container-fluid app-tab">
<div class="alertbox"></div>
<div class="row">
<form class="well form-inline">
@@ -220,7 +206,7 @@
</div>
</div>
- <div id="app-musicgrid" class="container-fluid">
+ <div id="app-musicgrid" class="container-fluid app-tab">
<div class="alertbox"></div>
<h1>Musikgrid</h1>
<table class="table table-striped">
@@ -430,11 +416,20 @@
</div>
- <script type="text/javascript">
- auth_init();
- apps_init();
- clock_init();
- </script>
+ <script src="/javascript/jquery/jquery.min.js"></script>
+ <script src="/javascript/bootstrap/js/bootstrap.min.js"></script>
+ <script src="/js/dropzone.js"></script>
+ <script src="/js/rdxport.js"></script>
+ <script src="/js/rdxport.rh.js"></script>
+ <script src="/js/utils.js"></script>
+ <script src="/js/clock.js"></script>
+ <script src="/js/importer.js"></script>
+ <script src="/js/auth.js"></script>
+ <script src="/js/shows.js"></script>
+ <script src="/js/jingles.js"></script>
+ <script src="/js/musicpools.js"></script>
+ <script src="/js/musicgrid.js"></script>
+ <script src="/js/router.js"></script>
</body>
</html>
diff --git a/www/js/apps.js b/www/js/apps.js
deleted file mode 100644
index 945b454..0000000
--- a/www/js/apps.js
+++ /dev/null
@@ -1,157 +0,0 @@
-/*
- * rhwebimport
- *
- * Copyright (C) 2014-2016 Christian Pointner <equinox@helsinki.at>
- * Copyright (C) 2015-2016 Peter Grassberger <petertheone@gmail.com>
- *
- * This file is part of rhwebimport.
- *
- * rhwebimport is free software: you can redistribute it and/or modify
- * it under the terms of the GNU Affero General Public License as published by
- * the Free Software Foundation, either version 3 of the License, or
- * any later version.
- *
- * rhwebimport is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
- * GNU Affero General Public License for more details.
- *
- * You should have received a copy of the GNU Affero General Public License
- * along with rhwebimport. If not, see <http://www.gnu.org/licenses/>.
- */
-
-'use strict';
-
-var Rdxport = Rdxport || {};
-
-var apps_current = null;
-var rdxport = null;
-var importer = null;
-
-function apps_select(app) {
- if (importer && importer.isUploading()) {
- alert('Achtung: Es laufen noch imports.');
- return;
- }
-
- $('.container').removeClass('fullWidth');
-
- shows_cleanup();
- jingles_cleanup();
- musicpools_cleanup();
- musicgrid_cleanup();
-
- switch(app) {
- case "musicgrid":
- $('#app-shows').hide();
- $('#nav-btn-shows').removeClass('active');
- $('#app-jingles').hide();
- $('#nav-btn-jingles').removeClass('active');
- $('#app-musicpools').hide();
- $('#nav-btn-musicpools').removeClass('active');
-
- $('.container').addClass('fullWidth');
- $('#app-musicgrid').show();
- $('#nav-btn-musicgrid').addClass('active');
-
- apps_current = app;
- musicgrid_init();
- break;
- case "musicpools":
- $('#app-shows').hide();
- $('#nav-btn-shows').removeClass('active');
- $('#app-jingles').hide();
- $('#nav-btn-jingles').removeClass('active');
- $('#app-musicgrid').hide();
- $('#nav-btn-musicgrid').removeClass('active');
-
- $('#app-musicpools').show();
- $('#nav-btn-musicpools').addClass('active');
-
- apps_current = app;
- musicpools_init();
- break;
- case "jingles":
- $('#app-shows').hide();
- $('#nav-btn-shows').removeClass('active');
- $('#app-musicpools').hide();
- $('#nav-btn-musicpools').removeClass('active');
- $('#app-musicgrid').hide();
- $('#nav-btn-musicgrid').removeClass('active');
-
- $('#app-jingles').show();
- $('#nav-btn-jingles').addClass('active');
-
- apps_current = app;
- jingles_init();
- break;
- default:
- $('#app-jingles').hide();
- $('#nav-btn-jingles').removeClass('active');
- $('#app-musicpools').hide();
- $('#nav-btn-musicpools').removeClass('active');
- $('#app-musicgrid').hide();
- $('#nav-btn-musicgrid').removeClass('active');
-
- $('#app-shows').show();
- $('#nav-btn-shows').addClass('active');
-
- apps_current = app = 'shows';
- shows_init();
- }
- if (locationHrefValue() !== app) {
- history.pushState(null, null, '/' + app + '/');
- }
-}
-
-function apps_init() {
-
- apps_current = locationHrefValue();
-
- if(auth_token && auth_username) {
- // todo: do this at a central place
- importer = new Rdxport.Importer(auth_username, auth_token);
-
- rdxport = new Rdxport.Rdxport(auth_username, auth_token, '/rd-bin/rdxport.cgi');
- rdxport.setListDropboxesEndpoint('/rh-bin/listdropboxes.cgi');
- rdxport.setMusicgridEndpoint('/rh-bin/musicgrid.cgi');
-
- apps_select(apps_current);
- }
-
- $(window).on('popstate', function(event) {
- if(auth_token && auth_username) {
- // todo: do this at a central place
- importer = new Rdxport.Importer(auth_username, auth_token);
-
- rdxport = new Rdxport.Rdxport(auth_username, auth_token, '/rd-bin/rdxport.cgi');
- rdxport.setListDropboxesEndpoint('/rh-bin/listdropboxes.cgi');
- rdxport.setMusicgridEndpoint('/rh-bin/musicgrid.cgi');
-
- apps_select(locationHrefValue());
- }
- });
-
- $(document).ajaxError(function(event, jqXHR, settings, thrownError) {
- //todo: add errors
- });
-
- window.onbeforeunload = function(e) {
- if (importer && importer.isUploading()) {
- return 'Achtung: Es laufen noch imports.';
- }
- };
-}
-
-function apps_cleanup() {
- shows_cleanup();
- jingles_cleanup();
- musicpools_cleanup();
- musicgrid_cleanup();
-
- $(window).off('popstate');
-
- importer = null;
- rdxport = null;
- apps_current = null;
-}
diff --git a/www/js/auth.js b/www/js/auth.js
index dd21e39..3931022 100644
--- a/www/js/auth.js
+++ b/www/js/auth.js
@@ -24,96 +24,84 @@
var Rdxport = Rdxport || {};
-var auth_username = null;
-var auth_fullname = null;
-var auth_token = null;
-
-function auth_loginSuccess(data) {
- if (data.status == 'OK') {
- auth_username = data.username;
- auth_fullname = data.fullname;
- auth_token = data.token;
-
- sessionStorage.setItem("auth_username", auth_username);
- sessionStorage.setItem("auth_fullname", auth_fullname);
- sessionStorage.setItem("auth_token", auth_token);
-
- // todo: do this at a central place
- importer = new Rdxport.Importer(auth_username, auth_token);
-
- rdxport = new Rdxport.Rdxport(auth_username, auth_token, '/rd-bin/rdxport.cgi');
- rdxport.setListDropboxesEndpoint('/rh-bin/listdropboxes.cgi');
- rdxport.setMusicgridEndpoint('/rh-bin/musicgrid.cgi');
-
- apps_select(apps_current);
-
- $('#username-field').html(auth_fullname + ' (' + auth_username + ')');
- $('#loginbox').slideUp();
- $('#mainwindow').fadeIn();
- } else {
- alertbox.error('loginbox', "Fehler beim Login", data.errorstring);
- auth_cleanup();
- }
-}
-
-function auth_loginError(req, status, error) {
- var message = req.status + ': ' + error;
- if(req.status == 401) {
- message = "Benutzer und/oder Passwort sind falsch!";
- }
- alertbox.error('loginbox', "Fehler beim Login", message);
- $("#password").val('');
-}
-
-function auth_logout() {
- if (importer && importer.isUploading()) {
- alert('Achtung: Es laufen noch imports.');
- return;
- }
-
- auth_cleanup();
- apps_cleanup();
+Rdxport.Auth = function() {
+ this.username = sessionStorage.getItem('auth_username');
+ this.fullname = sessionStorage.getItem('auth_fullname');
+ this.token = sessionStorage.getItem('auth_token');
+};
+
+Rdxport.Auth.prototype.isLoggedIn = function() {
+ return this.username && this.fullname && this.token;
+};
+
+Rdxport.Auth.prototype.set = function(username, fullname, token) {
+ this.username = username;
+ this.fullname = fullname;
+ this.token = token;
+
+ sessionStorage.setItem('auth_username', this.username);
+ sessionStorage.setItem('auth_fullname', this.fullname);
+ sessionStorage.setItem('auth_token', this.token);
+};
+
+Rdxport.Auth.prototype.cleanup = function() {
+ sessionStorage.removeItem('auth_username');
+ sessionStorage.removeItem('auth_fullname');
+ sessionStorage.removeItem('auth_token');
+
+ this.username = null;
+ this.fullname = null;
+ this.token = null;
+};
+
+Rdxport.AuthView = function(model) {
+ this.model = model;
+};
+
+Rdxport.AuthView.prototype.renderLoggedIn = function() {
+ $('#loginbox').slideUp();
+ $('#mainwindow').fadeIn();
+ $('#username-field').html(this.model.fullname + ' (' + this.model.username + ')');
+
+ $('button.logout').off().on('click', function() {
+ router.route('logout');
+ });
+};
- $(".alert").alert('close');
- $("#username").val('');
- $("#password").val('');
- $("#mainwindow").fadeOut();
- $('#username-field').html('');
+Rdxport.AuthView.prototype.renderLoginForm = function() {
+ $('.alert').alert('close');
$('#loginbox').slideDown();
-}
+ $('#mainwindow').fadeOut();
+ $('#username-field').empty();
-function auth_init() {
- auth_username = sessionStorage.getItem("auth_username");
- auth_fullname = sessionStorage.getItem("auth_fullname");
- auth_token = sessionStorage.getItem("auth_token");
-
- if(auth_token && auth_username && auth_fullname) {
- $("#loginbox").hide();
- $('#username-field').html(auth_fullname + ' (' + auth_username + ')');
- } else {
- $("#mainwindow").hide();
- }
- $("#loginform").submit(function(event) {
+ var self = this;
+ $('#loginform').on('submit', function(event) {
event.preventDefault();
-
Rdxport.Rdxport.authLogin(
- '/rh-bin/authtoken.json',
- $("#username").val(),
- $("#password").val(),
- auth_loginSuccess
- ).fail(auth_loginError);
+ '/rh-bin/authtoken.json',
+ $("#username").val(),
+ $("#password").val(),
+ function(data) {
+ if (data.status == 'OK') {
+ self.model.set(
+ data.username,
+ data.fullname,
+ data.token
+ );
+
+ router.route();
+ } else {
+ alertbox.error('loginbox', "Fehler beim Login", data.errorstring);
+ self.model.cleanup();
+ }
+ }
+ ).fail(function(req, status, error) {
+ var message = req.status + ': ' + error;
+ if(req.status == 401) {
+ message = "Benutzer und/oder Passwort sind falsch!";
+ }
+ alertbox.error('loginbox', "Fehler beim Login", message);
+ $("#password").val('');
+ });
});
-}
-
-function auth_cleanup() {
- sessionStorage.removeItem("auth_username");
- sessionStorage.removeItem("auth_fullname");
- sessionStorage.removeItem("auth_token");
-
- auth_username = null;
- auth_fullname = null;
- auth_token = null;
-
- $("#username").val('').focus();
- $("#password").val('');
-}
+};
diff --git a/www/js/clock.js b/www/js/clock.js
index 96ec9e4..3562b1e 100644
--- a/www/js/clock.js
+++ b/www/js/clock.js
@@ -44,11 +44,11 @@ function Clock() {
time_str += (rdtime.getUTCSeconds() > 9 ? ':' : ':0') + rdtime.getUTCSeconds();
this.draw_callbacks.fireWith(window, [date_str, time_str, get_rd_week(rdtime_ms)]);
- }
+ };
this.addCallback = function(cb) {
this.draw_callbacks.add(cb);
- }
+ };
this.ntp_update = function(event) {
var t4 = (+new Date());
@@ -59,18 +59,18 @@ function Clock() {
this.clock_offset = ((msg.t2 - msg.t1) + (msg.t3 - msg.t4)) / 2;
this.clock_rtt = (msg.t4 - msg.t1) - (msg.t3 - msg.t2);
// console.log('got new ntp message from rhrdtime (rtt=' + this.clock_rtt + ' ms): new offset = ' + this.clock_offset + ' ms');
- }
+ };
this.ntp_request = function() {
this.sock.send(JSON.stringify({ t1: (+new Date()), t2: 0, t3: 0, t4: 0, tz_offset: 0, week: 0 }));
- }
+ };
this.sock_onopen = function() {
// console.log('clock websocket connection established');
this.state = 'CONNECTED';
this.ntp_request();
this.interval_request = setInterval(this.ntp_request.bind(this), 2000);
- }
+ };
this.sock_onclose = function(event) {
if(this.state == 'STOPPED') {
@@ -84,7 +84,7 @@ function Clock() {
setTimeout(this.connect.bind(this), 1000);
this.state = 'RECONNECTING';
}
- }
+ };
this.connect = function() {
this.sock = new WebSocket('wss://' + window.location.host + '/ntp');
@@ -92,12 +92,12 @@ function Clock() {
this.sock.onopen = this.sock_onopen.bind(this);
this.sock.onclose = this.sock_onclose.bind(this);
this.state = 'CONNECTING';
- }
+ };
this.start = function() {
this.connect();
this.interval_redraw = setInterval(this.redraw.bind(this), 200);
- }
+ };
this.stop = function() {
this.state = 'STOPPED';
@@ -106,13 +106,7 @@ function Clock() {
clearInterval(this.interval_request);
delete this.interval_request;
this.sock.close();
- }
-}
-
-var clock = new Clock();
-
-function clock_init() {
- clock.start();
+ };
}
function clock_add_callback(cb) {
diff --git a/www/js/importer.js b/www/js/importer.js
index 6803921..b34c4b6 100644
--- a/www/js/importer.js
+++ b/www/js/importer.js
@@ -57,7 +57,7 @@ Rdxport.Importer.prototype.initWebSocket = function() {
webSocket.onopen = function() {
console.log('open');
- console.log('send list');
+ console.log('send new');
var sendOptions = {
COMMAND: Rdxport.Importer.CMD_NEW,
LOGIN_NAME: importer.username,
@@ -336,8 +336,8 @@ Rdxport.Upload.prototype.addCut = function(file) {
file.cutNumber = cutNumberLeading;
formData.append('COMMAND', 2);
- formData.append('LOGIN_NAME', auth_username);
- formData.append('PASSWORD', auth_token);
+ formData.append('LOGIN_NAME', auth.username);
+ formData.append('PASSWORD', auth.token);
formData.append('CART_NUMBER', self.cart.number);
formData.append('CUT_NUMBER', cutNumber);
formData.append('CHANNELS', 2);
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
new file mode 100644
index 0000000..cfeaf23
--- /dev/null
+++ b/www/js/router.js
@@ -0,0 +1,176 @@
+/*
+ * rhwebimport
+ *
+ * Copyright (C) 2014-2016 Christian Pointner <equinox@helsinki.at>
+ * Copyright (C) 2015-2016 Peter Grassberger <petertheone@gmail.com>
+ *
+ * This file is part of rhwebimport.
+ *
+ * rhwebimport is free software: you can redistribute it and/or modify
+ * it under the terms of the GNU Affero General Public License as published by
+ * the Free Software Foundation, either version 3 of the License, or
+ * any later version.
+ *
+ * rhwebimport is distributed in the hope that it will be useful,
+ * but WITHOUT ANY WARRANTY; without even the implied warranty of
+ * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+ * GNU Affero General Public License for more details.
+ *
+ * You should have received a copy of the GNU Affero General Public License
+ * along with rhwebimport. If not, see <http://www.gnu.org/licenses/>.
+ */
+
+'use strict';
+
+var clock = null;
+var auth = null;
+var router = null;
+var importer = null;
+var rdxport = null;
+
+$(document).ready(function() {
+ clock = new Clock();
+ clock.start();
+ auth = new Rdxport.Auth();
+ router = new Rdxport.Router(auth);
+ router.route();
+});
+
+Rdxport.Router = function(auth) {
+ this.auth = auth;
+ this.authView = new Rdxport.AuthView(this.auth);
+};
+
+Rdxport.Router.prototype.route = function(page, subpage) {
+ if (!this.auth.isLoggedIn()) {
+ this.login();
+ return;
+ }
+ if (importer && importer.isUploading()) {
+ alert('Achtung: Es laufen noch imports.');
+ return;
+ }
+
+ if (!importer) {
+ importer = new Rdxport.Importer(this.auth.username, this.auth.token);
+ window.onbeforeunload = function(event) {
+ if (importer.isUploading()) {
+ return 'Achtung: Es laufen noch imports.';
+ }
+ };
+ }
+ if (!rdxport) {
+ rdxport = new Rdxport.Rdxport(this.auth.username, this.auth.token, '/rd-bin/rdxport.cgi');
+ rdxport.setListDropboxesEndpoint('/rh-bin/listdropboxes.cgi');
+ rdxport.setMusicgridEndpoint('/rh-bin/musicgrid.cgi');
+ }
+
+ /*$(document).ajaxError(function(event, jqXHR, settings, thrownError) {
+ //todo: add errors
+ });*/
+
+ var href = ['', ''];
+ if (!page && !subpage) {
+ href = locationHrefValue();
+ page = href[1];
+ subpage = href[2];
+ }
+
+ shows_cleanup();
+ jingles_cleanup();
+ musicpools_cleanup();
+ musicgrid_cleanup();
+
+ this.authView.renderLoggedIn();
+ $('.navbar-nav li').removeClass('active');
+ $('.app-tab').hide();
+ $('.container').removeClass('fullWidth');
+
+ var self = this;
+ $('.navbar-nav li a').off().on('click', function(event) {
+ event.preventDefault();
+ var href = $(this).attr('href').split('/');
+ self.route(href[1], href[2]);
+ });
+ $(window).off('popstate').on('popstate', function(event) {
+ var href = locationHrefValue();
+ self.route(href[1], href[2]);
+ });
+
+ switch (page) {
+ default :
+ page = 'shows';
+ // fallthrough
+ case 'shows':
+ this.shows(subpage);
+ break;
+ case 'jingles':
+ this.jingles();
+ break;
+ case 'musicpools':
+ this.musicpools(subpage);
+ break;
+ case 'musicgrid':
+ this.musicgrid();
+ break;
+ case 'logout':
+ this.logout();
+ break;
+ }
+
+ href = locationHrefValue();
+ if (href[1] !== page && page !== 'logout' && (!href[2] || href[2] !== subpage)) {
+ var url = '/' + page + '/';
+ if (subpage) {
+ url += subpage + '/';
+ }
+ history.pushState(null, null, url);
+ }
+};
+
+Rdxport.Router.prototype.login = function() {
+ this.authView.renderLoginForm();
+};
+
+Rdxport.Router.prototype.logout = function() {
+ if (importer && importer.isUploading()) {
+ alert('Achtung: Es laufen noch imports.');
+ return;
+ }
+
+ shows_cleanup();
+ jingles_cleanup();
+ musicpools_cleanup();
+ musicgrid_cleanup();
+ this.auth.cleanup();
+
+ importer = null;
+ rdxport = null;
+
+ this.login();
+};
+
+Rdxport.Router.prototype.shows = function(subpage) {
+ $('#app-shows').show();
+ $('#nav-btn-shows').addClass('active');
+ shows_init(subpage);
+};
+
+Rdxport.Router.prototype.jingles = function() {
+ $('#app-jingles').show();
+ $('#nav-btn-jingles').addClass('active');
+ jingles_init();
+};
+
+Rdxport.Router.prototype.musicpools = function(subpage) {
+ $('#app-musicpools').show();
+ $('#nav-btn-musicpools').addClass('active');
+ musicpools_init(subpage);
+};
+
+Rdxport.Router.prototype.musicgrid = function() {
+ $('.container').addClass('fullWidth');
+ $('#app-musicgrid').show();
+ $('#nav-btn-musicgrid').addClass('active');
+ musicgrid_init();
+};
diff --git a/www/js/shows.js b/www/js/shows.js
index 1086620..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');
@@ -202,7 +217,7 @@ Rdxport.ShowView.prototype.render = function() {
case 4: s.addClass('label-danger'); break;
}
} else {
- $('#show-rhythm-w' + (w+1)).attr('class', 'label label-default')
+ $('#show-rhythm-w' + (w+1)).attr('class', 'label label-disabled')
}
}
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 : '';
}
/*
diff --git a/www/styles/main-style.css b/www/styles/main-style.css
index fc7e357..969dcc6 100644
--- a/www/styles/main-style.css
+++ b/www/styles/main-style.css
@@ -32,6 +32,14 @@ body {
width: 100% !important;
}
+#loginbox, #mainwindow {
+ display: none;
+}
+
+#app-shows, #app-jingles, #app-musicpools, #app-musicgrid {
+ display: none;
+}
+
.progress {
margin-bottom: 0;
}
diff --git a/www/styles/shows.css b/www/styles/shows.css
index 2daa8b6..c977334 100644
--- a/www/styles/shows.css
+++ b/www/styles/shows.css
@@ -28,3 +28,8 @@
margin-top: 1.5em;
margin-bottom: 1em;
}
+
+.label-disabled {
+ background-color: #EEE;
+ color: #888;
+}