improved html5 element usage

1 files changed, 17 insertions, 10 deletions

diff --git a/www/js/specials.js b/www/js/specials.js
index 5d8b855..51d83f1 100644
--- a/www/js/specials.js
+++ b/www/js/specials.js
@@ -121,24 +121,31 @@ rh.ShowView = function(model, listView) {
 };
 
 rh.ShowView.prototype.render = function() {
-  var id = $('<span>').addClass('show-start').text(this.model.id);
-  var pvstr = "unused";
+  var id = $('<span>').addClass('show-id').text(this.model.id);
+
+  var showlink = $('<a>').attr('href', "https://import.helsinki.at/shows/" + this.model.id)
+                         .attr('target', "import").text(this.model.title);
+  var title = $('<span>').addClass('show-title').append(showlink);
+
   if(this.model.pv_id >= 0) {
+    var pvlink = $('<a>').attr('href', "https://pv.helsinki.at/admin/program/show/" + this.model.pv_id)
+                         .attr('target', "import").text(this.model.pv_name);
+
+    var pvtitle = $('<span>').addClass('pv-title').append(pvlink);
+
     var start_end = format_datetime(this.model.pv_start) + " - ";
     if(compare_date(this.model.pv_start, this.model.pv_end)) {
       start_end += format_time(this.model.pv_end);
     } else {
       start_end += format_datetime(this.model.pv_end);
     }
-    pvstr = this.model.pv_id + " | " + this.model.pv_name + " (" + start_end + ")";
-  }
-  var len = $('<span>').addClass('show-len').text(pvstr);
-
-  var showlink = $('<a>').attr('href', "https://import.helsinki.at/shows/" + this.model.id)
-                         .attr('target', "import").text(this.model.title);
-  var title = $('<span>').addClass('show-title').append(showlink);
+    var pvtimes = $('<span>').addClass('pv-time').text(start_end);
 
-  this.$el.empty().addClass('show').append(id).append(title).append(len);
+    this.$el.empty().addClass('show').append(id).append(title).append(pvtitle).append(pvtimes);
+  } else {
+    var pv = $('<span>').addClass('pv-unused').text("unused");
+    this.$el.empty().addClass('show').append(id).append(title).append(pv);
+  }
 }