readded item info display

components/embyactions.js

@@ -238,6 +238,9 @@
         setWaitingBackdrop(backdropUrl);
 
         setLogo(getLogoUrl(item, serverAddress) || '');
+        setOverview(item.Overview || '');
+        setGenres(item.Genres.join(' / '));
+        setDisplayName(getDisplayName(item));
         document.getElementById('miscInfo').innerHTML = getMiscInfoHtml(item, datetime) || '';
         document.getElementById('detailRating').innerHTML = getRatingHtml(item);
 
@@ -258,7 +261,14 @@
         }
 
         if (item.UserData.PlayedPercentage && item.UserData.PlayedPercentage < 100 && !item.IsFolder) {
+            setHasPlayedPercentage(false);
+            setPlayedPercentage(item.UserData.PlayedPercentage);
+
             detailImageUrl += "&PercentPlayed=" + parseInt(item.UserData.PlayedPercentage);
+
+        } else {
+            setHasPlayedPercentage(false);
+            setPlayedPercentage(0);
         }
 
         setDetailImage(detailImageUrl);

components/maincontroller.js

@@ -14,8 +14,6 @@
     // media content buffered. Default is 10.
     playbackConfig.autoResumeDuration = 5;
 
-    setInterval(updateTimeOfDay, 40000);
-
     // According to cast docs this should be disabled when not needed
     //cast.receiver.logger.setLevelValue(cast.receiver.LoggerLevel.ERROR);
 

helpers.js

@@ -460,38 +460,6 @@ function getStreamByIndex(streams, type, index) {
     })[0];
 }
 
-function updateTimeOfDay() {
-
-    var now = new Date();
-
-    var time = now.toLocaleTimeString().toLowerCase();
-
-    var text = time.split(':');
-    var suffix = '';
-
-    if (text.length == 3) {
-
-        // Fix for toLocaleTimeString returning wrong hour
-        if (time.indexOf('pm') != -1 || time.indexOf('am') != -1) {
-            text[0] = (now.getHours() % 12) || 12;
-        }
-
-        text = text[0] + ':' + text[1];
-
-        if (time.indexOf('pm') != -1) {
-            suffix = 'pm';
-        }
-        else if (time.indexOf('am') != -1) {
-            suffix = 'am';
-        }
-
-        time = text;
-    }
-
-    setInnerHTML('.timePrefix', time);
-    setInnerHTML('.timeSuffix', suffix);
-}
-
 function getSecurityHeaders(accessToken, userId) {
 
     var auth = 'MediaBrowser Client="Chromecast", Device="' + deviceInfo.deviceName + '", DeviceId="' + deviceInfo.deviceId + '", Version="' + deviceInfo.versionNumber + '"';
@@ -989,6 +957,18 @@ function setAppStatus(status) {
     $scope.status = status;
     document.body.className = status;
 }
+function setDisplayName(name) {
+    $scope.displayName = name;
+    document.querySelector('.displayName').innerHTML = name || '';
+}
+function setGenres(name) {
+    $scope.genres = name;
+    document.querySelector('.genres').innerHTML = name || '';
+}
+function setOverview(name) {
+    $scope.overview = name;
+    document.querySelector('.overview').innerHTML = name || '';
+}
 function setInnerHTML(selector, html, autoHide) {
     var elems = document.querySelectorAll(selector);
     for (var i = 0, length = elems.length; i < length; i++) {
@@ -1004,6 +984,10 @@ function setInnerHTML(selector, html, autoHide) {
         }
     }
 }
+function setPlayedPercentage(value) {
+    $scope.playedPercentage = value;
+    document.querySelector('.itemProgressBar').value = value || 0;
+}
 
 function setStartPositionTicks(value) {
     $scope.startPositionTicks = value;
@@ -1013,12 +997,20 @@ function setWaitingBackdrop(src) {
     document.querySelector('#waiting-container-backdrop').style.backgroundImage = src ? 'url(' + src + ')' : ''
 }
 
+function setHasPlayedPercentage(value) {
+    if (value) {
+        document.querySelector('.detailImageProgressContainer').classList.remove('hide');
+    } else {
+        document.querySelector('.detailImageProgressContainer').classList.add('hide');
+    }
+}
+
 function setLogo(src) {
-    //document.querySelector('.detailLogo').style.backgroundImage = src ? 'url(' + src + ')' : ''
+    document.querySelector('.detailLogo').style.backgroundImage = src ? 'url(' + src + ')' : ''
 }
 
 function setDetailImage(src) {
-    //document.querySelector('.detailImage').style.backgroundImage = src ? 'url(' + src + ')' : ''
+    document.querySelector('.detailImage').style.backgroundImage = src ? 'url(' + src + ')' : ''
 }
 
 function extend(target, source) {

index.html

@@ -16,6 +16,21 @@
         </div>
     </div>
     <cast-media-player id="video-player" crossorigin="anonymous" preload="auto"></cast-media-player>
+    <div class="detailContent">		
+        <div class="detailImage">
+            <div id="playedIndicator"></div>
+			
+            <div class="detailImageProgressContainer"><progress class="itemProgressBar" min="0" max="100"></progress></div>
+        </div>
+		
+        <div class="detailInfo">
+            <p class="displayNameContainer"><span class="displayName"></span><span id="miscInfo"></span></p>
+            <div id="detailRating"></div>
+            <p class="genres"></p>
+            <p class="overview"></p>
+        </div>
+    </div>
+    <div class="detailLogo"></div>
     <script src="jellyfin-web/src/bower_components/requirejs/require.js"></script>
     <script>
         require(['app.js?t=' + new Date().getTime()]);