From 3aaa6e8696569eabf1bd8e4e8397c7a68bb0f747 Mon Sep 17 00:00:00 2001 From: Christian Pointner Date: Sat, 25 Jun 2016 00:07:48 +0200 Subject: added MVC style framework diff --git a/www/js/nextshows.js b/www/js/nextshows.js index 9ded238..39f61dd 100644 --- a/www/js/nextshows.js +++ b/www/js/nextshows.js @@ -21,26 +21,105 @@ 'use strict'; -function reloadShowList() { +var rh = rh || {}; + + + +/***************** models *****************/ + +var shows = null; + +rh.ShowList = function() { + this.$this = $(this); + this.shows = []; +}; + +rh.ShowList.prototype.fetch = function() { + var self = this; var yd = new Date((new Date()) - 24 * 3600 * 1000); var ydstr = yd.getFullYear() + '-' + Number(yd.getMonth() + 1).pad(2) + '-' + Number(yd.getDate()).pad(2); $.getJSON( "/rh-bin/schedules.json?DAYS=3&START=" + ydstr, function(data) { if(data.status == "OK") { - var list = $('#shows table') - $('tr.show', list).remove(); - + self.shows = []; $(data.shows).each(function(index, show) { - var title = $('').addClass('show-title').text(show.id + ' | ' + show.title); - var start = $('').addClass('show-start').text(show.start); - var duration = $('').addClass('show-duration').text(msToTimeString(show.len)); - - var entry = $('').addClass('show').append(start).append(title).append(duration); - list.append(entry); + self.shows.push(new rh.Show(show)); }); + self.$this.trigger('update'); } }); +}; + +rh.Show = function(show) { + this.id = show.id; + this.title = show.title; + this.start = new Date(show.start); + this.len = show.len; +}; + + + +/***************** views *****************/ + +var showListView = null; + +rh.ShowListView = function(model, len) { + this.model = model; + this.len = len; + + this.showViews = []; + + var self = this; + $(this.model).on('update', function() { + self.render(); + }); + this.model.fetch(); +}; + +rh.ShowListView.prototype.render = function() { + var list = $('#shows table'); + $('tr', list).remove(); + this.showViews = []; + + var self = this; + $(this.model.shows).each(function(index, show) { + var showView = new rh.ShowView(show, self); + self.showViews.push(showView); + showView.render(); + list.append(showView.$el); + }); +}; + + +rh.ShowView = function(model, listView) { + this.model = model; + this.listView = listView; + + this.$el = $(''); +}; + +rh.ShowView.prototype.render = function() { + var title = $('').addClass('show-title').text(this.model.title); + + var startstr = "Beginn: " + format_time(this.model.start); + var start = $('').addClass('show-start').text(startstr); + + var endstr = "Live"; + if(this.model.len > 0) { + var end = new Date(this.model.start.valueOf() + this.model.len); + endstr = "Ende: " + format_time(end); + } + var end = $('').addClass('show-end').text(endstr); + + this.$el.empty().addClass('show').append(start).append(title).append(end); } + + +/***************** controller *****************/ + function nextshows_init() { - reloadShowList(); + shows = new rh.ShowList(); + showListView = new rh.ShowListView(shows, 10); + + setInterval("shows.fetch()", 5000); } diff --git a/www/js/utils.js b/www/js/utils.js index a7fef1b..86c369b 100644 --- a/www/js/utils.js +++ b/www/js/utils.js @@ -54,6 +54,19 @@ monthname[11] = 'Dezember'; var monthname_short = new Array('Jan', 'Feb', 'Mär', 'Apr', 'Mai', 'Jun', 'Jul', 'Aug', 'Sep', 'Okt', 'Nov', 'Dez'); +function format_time(d) { + if(Object.prototype.toString.call(d) !== '[object Date]') { + return '-'; + } + if (d.toString() === 'Invalid Date') { + return '-'; + } + var timestr = Number(d.getHours()).pad(2); + timestr += ':' + Number(d.getMinutes()).pad(2); + timestr += ':' + Number(d.getSeconds()).pad(2); + return timestr; +} + function format_datetime(d) { if(Object.prototype.toString.call(d) !== '[object Date]') { return '-'; -- cgit v0.10.2