WEBUI JS: Aligh time properly in EPG/DVR dialogs

tvheadend · Nov 19, 2014 · a2dfb05 · a2dfb05
1 parent 8aee579
commit a2dfb05
Show file tree

Hide file tree

Showing 4 changed files with 30 additions and 4 deletions.
diff --git a/src/webui/static/app/dvr.js b/src/webui/static/app/dvr.js
@@ -26,8 +26,8 @@ tvheadend.dvrDetails = function(uuid) {
 
         content += '<div class="x-epg-title">' + title + '</div>';
         content += '<div class="x-epg-title">' + episode + '</div>';
-        content += '<div class="x-epg-time"><div class="x-epg-prefix">Scheduled Start Time:</div> ' + new Date(start_real * 1000).toLocaleString() + '</div>';
-        content += '<div class="x-epg-time"><div class="x-epg-prefix">Scheduled Stop Time:</div> ' + new Date(stop_real * 1000).toLocaleString() + '</div>';
+        content += '<div class="x-epg-time"><div class="x-epg-prefix">Scheduled Start Time:</div> ' + tvheadend.niceDate(start_real * 1000) + '</div>';
+        content += '<div class="x-epg-time"><div class="x-epg-prefix">Scheduled Stop Time:</div> ' + tvheadend.niceDate(stop_real * 1000) + '</div>';
         content += '<div class="x-epg-time"><div class="x-epg-prefix">Duration:</div> ' + parseInt(duration / 60) + ' min</div>';
         content += '<div class="x-epg-desc">' + desc + '</div>';
         content += '<hr>';

diff --git a/src/webui/static/app/epg.js b/src/webui/static/app/epg.js
@@ -89,6 +89,10 @@ tvheadend.durationLookupRange = function(value) {
 tvheadend.epgDetails = function(event) {
 
     var content = '';
+    var duration = 0;
+
+    if (event.start && event.stop && event.stop - event.start > 0)
+        duration = (event.stop - event.start) / 1000;
 
     if (event.channelIcon != null && event.channelIcon.length > 0)
         content += '<img class="x-epg-chicon" src="' + event.channelIcon + '">';
@@ -100,9 +104,11 @@ tvheadend.epgDetails = function(event) {
     if (event.episodeOnscreen)
         content += '<div class="x-epg-title">' + event.episodeOnscreen + '</div>';
     if (event.start)
-      content += '<div class="x-epg-meta"><div class="x-epg-prefix">Start Time:</div> ' + new Date(event.start).toLocaleString() + '</div>';
+      content += '<div class="x-epg-meta"><div class="x-epg-prefix">Start Time:</div> ' + tvheadend.niceDate(event.start) + '</div>';
     if (event.stop)
-      content += '<div class="x-epg-meta"><div class="x-epg-prefix">Stop Time:</div> ' + new Date(event.stop).toLocaleString() + '</div>';
+      content += '<div class="x-epg-meta"><div class="x-epg-prefix">Stop Time:</div> ' + tvheadend.niceDate(event.stop) + '</div>';
+    if (duration)
+      content += '<div class="x-epg-meta"><div class="x-epg-prefix">Duration:</div> ' + parseInt(duration / 60) + ' min</div>';
     if (event.summary)
       content += '<div class="x-epg-summary">' + event.summary + '</div>';
     if (event.description)

diff --git a/src/webui/static/app/ext.css b/src/webui/static/app/ext.css
@@ -510,6 +510,17 @@
     width: 100px;
 }
 
+.x-date-date {
+    display: inline-block;
+    width: 6em;
+}
+
+.x-date-time {
+    display: inline-block;
+    width: 4em;
+    text-align: right;
+}
+
 .x-epg-title {
     margin: 5px;
     font: normal 16px arial, tahoma, helvetica, sans-serif;

diff --git a/src/webui/static/app/tvheadend.js b/src/webui/static/app/tvheadend.js
@@ -151,6 +151,15 @@ Ext.Ajax.request({
     }
 });
 
+/*
+ *
+ */
+tvheadend.niceDate = function(dt) {
+    var d = new Date(dt);
+    return '<div class="x-date-date">' + d.toLocaleDateString() + '</div>' +
+           '<div class="x-date-time">' + d.toLocaleTimeString() + '</div>';
+}
+
 /**
  * Displays a mediaplayer using the html5 video element
  */