Merge pull request #1729 from MediaBrowser/dev

Dev

dashboard-ui/bower_components/emby-webcomponents/.bower.json

@@ -16,12 +16,12 @@
   },
   "devDependencies": {},
   "ignore": [],
-  "version": "1.2.72",
+  "version": "1.2.87",
-  "_release": "1.2.72",
+  "_release": "1.2.87",
   "_resolution": {
     "type": "version",
-    "tag": "1.2.72",
+    "tag": "1.2.87",
-    "commit": "bd5ee371f1d5340371aedff26b6ad8b7912c66f3"
+    "commit": "21a6cacb0ec2cf301045a5fb35192753efd71025"
   },
   "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
   "_target": "^1.2.0",

dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'layoutManager', 'dialogText', 'paper-button', 'css!./actionsheet'], function (dialogHelper, layoutManager, dialogText) {
+define(['dialogHelper', 'layoutManager', 'dialogText', 'paper-button', 'css!./actionsheet', 'html!./../icons/nav.html'], function (dialogHelper, layoutManager, dialogText) {
 
     function parentWithClass(elem, className) {
 
@@ -132,7 +132,7 @@
         html += '<div class="actionSheetScroller">';
 
         options.items.forEach(function (o) {
-            o.ironIcon = o.selected ? 'check' : null;
+            o.ironIcon = o.selected ? 'nav:check' : null;
         });
 
         var itemsWithIcons = options.items.filter(function (o) {

dashboard-ui/bower_components/emby-webcomponents/alert/alert.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'layoutManager', 'dialogText', 'html!./../prompt/icons.html', 'css!./../prompt/style.css', 'paper-button', 'paper-icon-button-light', 'paper-input'], function (dialogHelper, layoutManager, dialogText) {
+define(['dialogHelper', 'layoutManager', 'dialogText', 'html!./../icons/nav.html', 'css!./../prompt/style.css', 'paper-button', 'paper-icon-button-light', 'paper-input'], function (dialogHelper, layoutManager, dialogText) {
 
     function getIcon(icon, cssClass, canFocus, autoFocus) {
 
@@ -72,7 +72,7 @@ define(['dialogHelper', 'layoutManager', 'dialogText', 'html!./../prompt/icons.h
 
         var buttonText = options.type == 'error' ? 'Ok' : 'GotIt';
         if (raisedButtons) {
-            html += '<paper-button raised class="btnSubmit"><iron-icon icon="dialog:check"></iron-icon><span>' + dialogText.get(buttonText) + '</span></paper-button>';
+            html += '<paper-button raised class="btnSubmit"><iron-icon icon="nav:check"></iron-icon><span>' + dialogText.get(buttonText) + '</span></paper-button>';
         } else {
             html += '<div class="buttons" style="text-align:right;">';
             html += '<paper-button class="btnSubmit">' + dialogText.get(buttonText) + '</paper-button>';

dashboard-ui/bower_components/emby-webcomponents/guide/guide.css

@@ -83,37 +83,6 @@
     background-color: #0B487D;
 }
 
-.timerCircle {
-    display: inline-block;
-    width: 1em;
-    height: 1em;
-    border-radius: 50%;
-    background: #cc0000;
-    border: 1px solid #cc3333;
-    margin-left: 1em;
-}
-
-.seriesTimerCircle {
-    position: relative;
-    margin-left: 0;
-    left: 21px;
-    opacity: .3;
-}
-
-.itemMiscInfo .seriesTimerCircle:first-child {
-    margin-left: 1em;
-}
-
-.seriesTimerCircle + .seriesTimerCircle {
-    opacity: .65;
-    left: 0;
-}
-
-    .seriesTimerCircle + .seriesTimerCircle + .seriesTimerCircle {
-        opacity: 1;
-        left: -21px;
-    }
-
 .channelTimeslotHeader {
     float: left;
 }
@@ -122,10 +91,6 @@
     white-space: nowrap;
 }
 
-.mobileGuide .timeslotHeaders {
-    overflow-x: hidden;
-}
-
 .programContainer {
     white-space: nowrap;
     position: relative;

dashboard-ui/bower_components/emby-webcomponents/guide/guide.js

@@ -1,4 +1,4 @@
-define(['globalize', 'connectionManager', 'loading', 'scrollHelper', 'datetime', 'focusManager', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'registrationservices', 'clearButtonStyle', 'css!./guide.css', 'html!./icons.html', 'scrollStyles'], function (globalize, connectionManager, loading, scrollHelper, datetime, focusManager, imageLoader, events, layoutManager, itemShortcuts, registrationServices) {
+define(['globalize', 'connectionManager', 'loading', 'scrollHelper', 'datetime', 'focusManager', 'imageLoader', 'events', 'layoutManager', 'itemShortcuts', 'registrationservices', 'clearButtonStyle', 'css!./guide.css', 'html!./../icons/mediainfo.html', 'html!./../icons/nav.html', 'scrollStyles'], function (globalize, connectionManager, loading, scrollHelper, datetime, focusManager, imageLoader, events, layoutManager, itemShortcuts, registrationServices) {
 
     var baseUrl;
 
@@ -271,14 +271,14 @@
                 html += '</div>';
 
                 if (program.IsHD) {
-                    html += '<iron-icon icon="guide:hd"></iron-icon>';
+                    html += '<iron-icon icon="mediainfo:hd"></iron-icon>';
                 }
 
                 if (program.SeriesTimerId) {
-                    html += '<iron-icon class="seriesTimerIcon" icon="guide:fiber-smart-record"></iron-icon>';
+                    html += '<iron-icon class="seriesTimerIcon" icon="mediainfo:fiber-smart-record"></iron-icon>';
                 }
                 else if (program.TimerId) {
-                    html += '<iron-icon class="timerIcon" icon="guide:fiber-manual-record"></iron-icon>';
+                    html += '<iron-icon class="timerIcon" icon="mediainfo:fiber-manual-record"></iron-icon>';
                 }
 
                 if (addAccent) {

dashboard-ui/bower_components/emby-webcomponents/guide/tvguide.template.html

@@ -18,5 +18,5 @@
 
 <div class="guideRequiresUnlock readOnlyContent hide" style="margin:1em auto;text-align:center;padding:1em;flex-shrink:0;">
     <p class="unlockText"></p>
-    <paper-button raised class="secondary block btnUnlockGuide"><iron-icon icon="check"></iron-icon><span>${ButtonUnlockGuide}</span></paper-button>
+    <paper-button raised class="secondary block btnUnlockGuide"><iron-icon icon="nav:check"></iron-icon><span>${ButtonUnlockGuide}</span></paper-button>
 </div>

dashboard-ui/bower_components/emby-webcomponents/icons/mediainfo.html

@@ -31,12 +31,15 @@ See [iron-iconset](#iron-iconset) and [iron-iconset-svg](#iron-iconset-svg) for
 @demo demo/index.html
 -->
 
-<iron-iconset-svg name="guide" size="24">
+<iron-iconset-svg name="mediainfo" size="24">
     <svg>
         <defs>
             <g id="fiber-manual-record"><circle cx="12" cy="12" r="8" /></g>
             <g id="fiber-smart-record"><g><circle cx="9" cy="12" r="8" /><path d="M17 4.26v2.09c2.33.82 4 3.04 4 5.65s-1.67 4.83-4 5.65v2.09c3.45-.89 6-4.01 6-7.74s-2.55-6.85-6-7.74z" /></g></g>
             <g id="hd"><path d="M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm-8 12H9.5v-2h-2v2H6V9h1.5v2.5h2V9H11v6zm2-6h4c.55 0 1 .45 1 1v4c0 .55-.45 1-1 1h-4V9zm1.5 4.5h2v-3h-2v3z" /></g>
+            <g id="closed-caption"><path d="M19 4H5c-1.11 0-2 .9-2 2v12c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm-8 7H9.5v-.5h-2v3h2V13H11v1c0 .55-.45 1-1 1H7c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1zm7 0h-1.5v-.5h-2v3h2V13H18v1c0 .55-.45 1-1 1h-3c-.55 0-1-.45-1-1v-4c0-.55.45-1 1-1h3c.55 0 1 .45 1 1v1z" /></g>
+            <g id="star"><path d="M12 17.27L18.18 21l-1.64-7.03L22 9.24l-7.19-.61L12 2 9.19 8.63 2 9.24l5.46 4.73L5.82 21z" /></g>
+            <g id="star-half"><path d="M22 9.74l-7.19-.62L12 2.5 9.19 9.13 2 9.74l5.46 4.73-1.64 7.03L12 17.77l6.18 3.73-1.63-7.03L22 9.74zM12 15.9V6.6l1.71 4.04 4.38.38-3.32 2.88 1 4.28L12 15.9z" /></g>
         </defs>
     </svg>
 </iron-iconset-svg>

dashboard-ui/bower_components/emby-webcomponents/icons/nav.html

@@ -31,7 +31,7 @@ See [iron-iconset](#iron-iconset) and [iron-iconset-svg](#iron-iconset-svg) for
 @demo demo/index.html
 -->
 
-<iron-iconset-svg name="dialog" size="24">
+<iron-iconset-svg name="nav" size="24">
     <svg>
         <defs>
             <g id="arrow-back"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z" /></g>

dashboard-ui/bower_components/emby-webcomponents/itemhelper.js

@@ -0,0 +1,54 @@
+define([], function () {
+
+    function getDisplayName(item, options) {
+
+        if (!item) {
+            throw new Error("null item passed into getDisplayName");
+        }
+
+        options = options || {};
+
+        var name = item.EpisodeTitle || item.Name || '';
+
+        if (item.Type == "TvChannel") {
+
+            if (item.Number) {
+                return item.Number + ' ' + name;
+            }
+            return name;
+        }
+        if (/*options.isInlineSpecial &&*/ item.Type == "Episode" && item.ParentIndexNumber == 0) {
+
+            name = Globalize.translate('core#ValueSpecialEpisodeName', name);
+
+        } else if ((item.Type == "Episode" || item.Type == 'Program') && item.IndexNumber != null && item.ParentIndexNumber != null) {
+
+            var displayIndexNumber = item.IndexNumber;
+
+            var number = "E" + displayIndexNumber;
+
+            if (options.includeParentInfo !== false) {
+                number = "S" + item.ParentIndexNumber + ", " + number;
+            }
+
+            if (item.IndexNumberEnd) {
+
+                displayIndexNumber = item.IndexNumberEnd;
+                number += "-" + displayIndexNumber;
+            }
+
+            name = number + " - " + name;
+
+        }
+
+        if (item.EpisodeTitle) {
+            name = item.Name + ' ' + name;
+        }
+
+        return name;
+    }
+
+    return {
+        getDisplayName: getDisplayName
+    };
+});

dashboard-ui/bower_components/emby-webcomponents/mediainfo/mediainfo.css

@@ -0,0 +1,65 @@
+.mediaInfoItem {
+    margin: 0 1em 0 0;
+}
+
+iron-icon.mediaInfoItem {
+    width: 3vh;
+    height: 3vh;
+    margin-right: .6em;
+}
+
+.mediaInfoItem:last-child {
+    margin-right: 0;
+}
+
+.starRatingContainer {
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    vertical-align: middle;
+    padding-top: 0;
+    padding-bottom: 0;
+}
+
+    .starRatingContainer iron-icon {
+        color: #CB272A;
+        width: 3vh;
+        height: 3vh;
+    }
+
+.mediaInfoItem.criticRating {
+    padding-left: 3.15vh;
+    background-position: left center;
+    background-repeat: no-repeat;
+    background-size: auto 2.6vh;
+    min-height: 2.6vh;
+    display: flex;
+    align-items: center;
+}
+
+.mediaInfoItem.criticRatingFresh {
+    background-image: url(fresh.png);
+}
+
+.mediaInfoItem.criticRatingRotten {
+    background-image: url(rotten.png);
+}
+
+.mediaInfoItem.timerIcon {
+    color: #CB272A;
+}
+
+.mediaInfoProgramAttribute {
+    color: yellow;
+    text-transform: uppercase;
+}
+
+.layout-tv iron-icon.mediaInfoItem {
+    width: 4vh;
+    height: 4vh;
+}
+
+.layout-tv .starRatingContainer iron-icon {
+    width: 3.4vh;
+    height: 3.4vh;
+}

dashboard-ui/bower_components/emby-webcomponents/mediainfo/mediainfo.js

@@ -0,0 +1,464 @@
+define(['datetime', 'globalize', 'embyRouter', 'html!./../icons/mediainfo.html', 'css!./mediainfo.css'], function (datetime, globalize, embyRouter) {
+
+    function getProgramInfoHtml(item, options) {
+        var html = '';
+
+        var miscInfo = [];
+        var text, date;
+
+        if (item.ChannelName) {
+
+            if (options.interactive && item.ChannelId) {
+                miscInfo.push('<a class="lnkChannel" data-id="' + item.ChannelId + '" data-serverid="' + item.ServerId + '" href="#">' + item.ChannelName + '</a>');
+            } else {
+                miscInfo.push(item.ChannelName);
+            }
+        }
+
+        if (item.StartDate) {
+
+            try {
+                date = datetime.parseISO8601Date(item.StartDate);
+
+                text = date.toLocaleDateString();
+
+                text += ', ' + datetime.getDisplayTime(date);
+
+                if (item.EndDate) {
+                    date = datetime.parseISO8601Date(item.EndDate);
+                    text += ' - ' + datetime.getDisplayTime(date);
+                }
+
+                miscInfo.push(text);
+            }
+            catch (e) {
+                console.log("Error parsing date: " + item.PremiereDate);
+            }
+        }
+
+        if (item.ChannelNumber) {
+            miscInfo.push('CH ' + item.ChannelNumber);
+        }
+
+        if (item.SeriesTimerId) {
+            miscInfo.push({
+                html: '<iron-icon class="mediaInfoItem timerIcon" icon="mediainfo:fiber-smart-record"></iron-icon>'
+            });
+        }
+        else if (item.TimerId) {
+            miscInfo.push({
+                html: '<iron-icon class="mediaInfoItem timerIcon" icon="mediainfo:fiber-manual-record"></iron-icon>'
+            });
+        }
+
+        html += miscInfo.map(function (m) {
+            return getMediaInfoItem(m);
+        }).join('');
+
+        return html;
+    }
+
+    function getMediaInfoHtml(item, options) {
+        var html = '';
+
+        var miscInfo = [];
+        options = options || {};
+        var text, date, minutes;
+
+        if (item.Type == "MusicAlbum" || item.MediaType == 'MusicArtist' || item.MediaType == 'Playlist' || item.MediaType == 'MusicGenre') {
+
+            var count = item.SongCount || item.ChildCount;
+
+            if (count) {
+
+                miscInfo.push(globalize.translate('core#TrackCount', count));
+            }
+
+            if (item.CumulativeRunTimeTicks) {
+
+                miscInfo.push(datetime.getDisplayRunningTime(item.CumulativeRunTimeTicks));
+            }
+        }
+
+        else if (item.Type == "PhotoAlbum" || item.Type == "BoxSet") {
+
+            var count = item.ChildCount;
+
+            if (count) {
+
+                miscInfo.push(globalize.translate('core#ItemCount', count));
+            }
+        }
+
+        if (item.Type == "Episode" || item.MediaType == 'Photo') {
+
+            if (item.PremiereDate) {
+
+                try {
+                    date = datetime.parseISO8601Date(item.PremiereDate);
+
+                    text = date.toLocaleDateString();
+                    miscInfo.push(text);
+                }
+                catch (e) {
+                    console.log("Error parsing date: " + item.PremiereDate);
+                }
+            }
+        }
+
+        if (item.StartDate && item.Type != 'Program') {
+
+            try {
+                date = datetime.parseISO8601Date(item.StartDate);
+
+                text = date.toLocaleDateString();
+                miscInfo.push(text);
+
+                if (item.Type != "Recording") {
+                    text = datetime.getDisplayTime(date);
+                    miscInfo.push(text);
+                }
+            }
+            catch (e) {
+                console.log("Error parsing date: " + item.PremiereDate);
+            }
+        }
+
+        if (item.ProductionYear && item.Type == "Series") {
+
+            if (item.Status == "Continuing") {
+                miscInfo.push(globalize.translate('core#ValueSeriesYearToPresent', item.ProductionYear));
+
+            }
+            else if (item.ProductionYear) {
+
+                text = item.ProductionYear;
+
+                if (item.EndDate) {
+
+                    try {
+
+                        var endYear = datetime.parseISO8601Date(item.EndDate).getFullYear();
+
+                        if (endYear != item.ProductionYear) {
+                            text += "-" + datetime.parseISO8601Date(item.EndDate).getFullYear();
+                        }
+
+                    }
+                    catch (e) {
+                        console.log("Error parsing date: " + item.EndDate);
+                    }
+                }
+
+                miscInfo.push(text);
+            }
+        }
+
+        if (item.Type == 'Program') {
+
+            if (item.IsLive) {
+                miscInfo.push({
+                    html: '<div class="mediaInfoProgramAttribute mediaInfoItem">' + globalize.translate('core#AttributeLive') + '</div>'
+                });
+            }
+            else if (item.IsPremiere) {
+                miscInfo.push({
+                    html: '<div class="mediaInfoProgramAttribute mediaInfoItem">' + globalize.translate('core#AttributePremiere') + '</div>'
+                });
+            }
+            else if (item.IsSeries && !item.IsRepeat) {
+                miscInfo.push({
+                    html: '<div class="mediaInfoProgramAttribute mediaInfoItem">' + globalize.translate('core#AttributeNew') + '</div>'
+                });
+            }
+
+            if (item.PremiereDate) {
+
+                try {
+                    date = datetime.parseISO8601Date(item.PremiereDate);
+                    text = globalize.translate('core#OriginalAirDateValue', date.toLocaleDateString());
+                    miscInfo.push(text);
+                }
+                catch (e) {
+                    console.log("Error parsing date: " + item.PremiereDate);
+                }
+            } else if (item.ProductionYear) {
+                text = globalize.translate('core#ReleaseYearValue', item.ProductionYear);
+                miscInfo.push(text);
+            }
+        }
+
+        if (item.Type != "Series" && item.Type != "Episode" && item.Type != "Person" && item.MediaType != 'Photo' && item.Type != 'Program') {
+
+            if (item.ProductionYear) {
+
+                miscInfo.push(item.ProductionYear);
+            }
+            else if (item.PremiereDate) {
+
+                try {
+                    text = datetime.parseISO8601Date(item.PremiereDate).getFullYear();
+                    miscInfo.push(text);
+                }
+                catch (e) {
+                    console.log("Error parsing date: " + item.PremiereDate);
+                }
+            }
+        }
+
+        if (item.RunTimeTicks && item.Type != "Series" && item.Type != 'Program' && options.runtime !== false) {
+
+            if (item.Type == "Audio") {
+
+                miscInfo.push(datetime.getDisplayRunningTime(item.RunTimeTicks));
+
+            } else {
+                minutes = item.RunTimeTicks / 600000000;
+
+                minutes = minutes || 1;
+
+                miscInfo.push(Math.round(minutes) + " mins");
+            }
+        }
+
+        if (item.OfficialRating && item.Type !== "Season" && item.Type !== "Episode") {
+            miscInfo.push({
+                text: item.OfficialRating,
+                cssClass: 'mediaInfoOfficialRating'
+            });
+        }
+
+        if (item.Video3DFormat) {
+            miscInfo.push("3D");
+        }
+
+        if (item.MediaType == 'Photo' && item.Width && item.Height) {
+            miscInfo.push(item.Width + "x" + item.Height);
+        }
+
+        html += miscInfo.map(function (m) {
+            return getMediaInfoItem(m);
+        }).join('');
+
+        html += getStarIconsHtml(item);
+
+        if (item.HasSubtitles && options.subtitles !== false) {
+            html += '<iron-icon class="mediaInfoItem closedCaptionIcon" icon="mediainfo:closed-caption"></iron-icon>';
+        }
+
+        if (item.CriticRating && options.criticRating !== false) {
+
+            if (item.CriticRating >= 60) {
+                html += '<div class="mediaInfoItem criticRating criticRatingFresh">' + item.CriticRating + '</div>';
+            } else {
+                html += '<div class="mediaInfoItem criticRating criticRatingRotten">' + item.CriticRating + '</div>';
+            }
+        }
+
+        if (options.endsAt !== false) {
+
+            var endsAt = getEndsAt(item);
+            if (endsAt) {
+                html += getMediaInfoItem(endsAt, 'endsAt');
+            }
+        }
+
+        return html;
+    }
+
+    function getEndsAt(item) {
+
+        if (item.MediaType == 'Video' && item.RunTimeTicks) {
+
+            if (!item.StartDate) {
+                var endDate = new Date().getTime() + (item.RunTimeTicks / 10000);
+                endDate = new Date(endDate);
+
+                var displayTime = datetime.getDisplayTime(endDate);
+                return globalize.translate('core#EndsAtValue', displayTime);
+            }
+        }
+
+        return null;
+    }
+
+    function getEndsAtFromPosition(runtimeTicks, positionTicks, includeText) {
+
+        var endDate = new Date().getTime() + ((runtimeTicks - (positionTicks || 0)) / 10000);
+        endDate = new Date(endDate);
+
+        var displayTime = datetime.getDisplayTime(endDate);
+
+        if (includeText === false) {
+            return displayTime;
+        }
+        return globalize.translate('core#EndsAtValue', displayTime);
+    }
+
+    function getMediaInfoItem(m, cssClass) {
+
+        cssClass = cssClass ? (cssClass + ' mediaInfoItem') : 'mediaInfoItem';
+        var mediaInfoText = m;
+
+        if (typeof (m) !== 'string' && typeof (m) !== 'number') {
+
+            if (m.html) {
+                return m.html;
+            }
+            mediaInfoText = m.text;
+            cssClass += ' ' + m.cssClass;
+        }
+        return '<div class="' + cssClass + '">' + mediaInfoText + '</div>';
+    }
+
+    function getStarIconsHtml(item) {
+
+        var html = '';
+
+        var rating = item.CommunityRating;
+
+        if (rating) {
+            html += '<div class="starRatingContainer mediaInfoItem">';
+
+            html += '<iron-icon icon="mediainfo:star"></iron-icon>';
+            html += rating;
+            html += '</div>';
+        }
+
+        return html;
+    }
+
+    function dynamicEndTime(elem, item) {
+
+        var interval = setInterval(function () {
+
+            if (!document.body.contains(elem)) {
+
+                clearInterval(interval);
+                return;
+            }
+
+            elem.innerHTML = getEndsAt(item);
+
+        }, 60000);
+    }
+
+    function fillPrimaryMediaInfo(elem, item, options) {
+        var html = getPrimaryMediaInfoHtml(item, options);
+
+        elem.innerHTML = html;
+        afterFill(elem, item, options);
+    }
+
+    function fillSecondaryMediaInfo(elem, item, options) {
+        var html = getSecondaryMediaInfoHtml(item, options);
+
+        elem.innerHTML = html;
+        afterFill(elem, item, options);
+    }
+
+    function afterFill(elem, item, options) {
+
+        var endsAtElem = elem.querySelector('.endsAt');
+        if (endsAtElem) {
+            dynamicEndTime(endsAtElem, item);
+        }
+
+        var lnkChannel = elem.querySelector('.lnkChannel');
+        if (lnkChannel) {
+            lnkChannel.addEventListener('click', onChannelLinkClick);
+        }
+    }
+
+    function onChannelLinkClick(e) {
+
+        var channelId = this.getAttribute('data-id');
+        var serverId = this.getAttribute('data-serverid');
+
+        embyRouter.showItem(channelId, serverId);
+
+        e.preventDefault();
+        return false;
+    }
+
+    function getDisplayName(item, options) {
+
+        if (!item) {
+            throw new Error("null item passed into getDisplayName");
+        }
+
+        options = options || {};
+
+        var name = item.EpisodeTitle || item.Name || '';
+
+        if (item.Type == "TvChannel") {
+
+            if (item.Number) {
+                return item.Number + ' ' + name;
+            }
+            return name;
+        }
+        if (options.isInlineSpecial && item.Type == "Episode" && item.ParentIndexNumber == 0) {
+
+            name = globalize.translate('core#ValueSpecialEpisodeName', name);
+
+        } else if (item.Type == "Episode" && item.IndexNumber != null && item.ParentIndexNumber != null) {
+
+            var displayIndexNumber = item.IndexNumber;
+
+            var number = "E" + displayIndexNumber;
+
+            if (options.includeParentInfo !== false) {
+                number = "S" + item.ParentIndexNumber + ", " + number;
+            }
+
+            if (item.IndexNumberEnd) {
+
+                displayIndexNumber = item.IndexNumberEnd;
+                number += "-" + displayIndexNumber;
+            }
+
+            name = number + " - " + name;
+
+        }
+
+        return name;
+    }
+
+    function getPrimaryMediaInfoHtml(item, options) {
+
+        options = options || {};
+        if (options.interactive == null) {
+            options.interactive = false;
+        }
+        if (item.Type == 'Program') {
+            return getProgramInfoHtml(item, options);
+        }
+
+        return getMediaInfoHtml(item, options);
+    }
+
+    function getSecondaryMediaInfoHtml(item, options) {
+
+        options = options || {};
+        if (options.interactive == null) {
+            options.interactive = false;
+        }
+        if (item.Type == 'Program') {
+            return getMediaInfoHtml(item, options);
+        }
+
+        return '';
+    }
+
+    return {
+        getMediaInfoHtml: getPrimaryMediaInfoHtml,
+        fill: fillPrimaryMediaInfo,
+        getEndsAt: getEndsAt,
+        getEndsAtFromPosition: getEndsAtFromPosition,
+        getPrimaryMediaInfoHtml: getPrimaryMediaInfoHtml,
+        getSecondaryMediaInfoHtml: getSecondaryMediaInfoHtml,
+        fillPrimaryMediaInfo: fillPrimaryMediaInfo,
+        fillSecondaryMediaInfo: fillSecondaryMediaInfo
+    };
+});

dashboard-ui/bower_components/emby-webcomponents/prompt/prompt.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'layoutManager', 'dialogText', 'html!./icons.html', 'css!./style.css', 'paper-button', 'paper-icon-button-light', 'paper-input'], function (dialogHelper, layoutManager, dialogText) {
+define(['dialogHelper', 'layoutManager', 'dialogText', 'html!./../icons/nav.html', 'css!./style.css', 'paper-button', 'paper-icon-button-light', 'paper-input'], function (dialogHelper, layoutManager, dialogText) {
 
     function getIcon(icon, cssClass, canFocus, autoFocus) {
 
@@ -64,7 +64,7 @@ define(['dialogHelper', 'layoutManager', 'dialogText', 'html!./icons.html', 'css
 
         html += '<br/>';
         if (raisedButtons) {
-            html += '<paper-button raised class="btnSubmit"><iron-icon icon="dialog:check"></iron-icon><span>' + dialogText.get('Ok') + '</span></paper-button>';
+            html += '<paper-button raised class="btnSubmit"><iron-icon icon="nav:check"></iron-icon><span>' + dialogText.get('Ok') + '</span></paper-button>';
         } else {
             html += '<div class="buttons">';
             html += '<paper-button class="btnSubmit">' + dialogText.get('Ok') + '</paper-button>';

dashboard-ui/bower_components/emby-webcomponents/router.js

@@ -167,6 +167,11 @@ define(['loading', 'viewManager', 'skinManager', 'pluginManager', 'backdrop', 'b
     var currentViewLoadRequest;
     function sendRouteToViewManager(ctx, next, route, controllerFactory) {
 
+        if (isDummyBackToHome && route.type == 'home') {
+            isDummyBackToHome = false;
+            return;
+        }
+
         cancelCurrentLoadRequest();
 
         var isBackNav = ctx.isBack;
@@ -203,7 +208,6 @@ define(['loading', 'viewManager', 'skinManager', 'pluginManager', 'backdrop', 'b
                 return;
             }
         }
-
         viewManager.tryRestoreView(currentRequest).then(function () {
 
             // done
@@ -331,21 +335,21 @@ define(['loading', 'viewManager', 'skinManager', 'pluginManager', 'backdrop', 'b
     }
 
     var isHandlingBackToDefault;
+    var isDummyBackToHome;
+
     function handleBackToDefault() {
 
+        isDummyBackToHome = true;
         skinManager.loadUserSkin();
 
         if (isHandlingBackToDefault) {
             return;
         }
 
-        isHandlingBackToDefault = true;
-
         // This must result in a call to either 
         // skinManager.loadUserSkin();
         // Logout
         // Or exit app
-
         skinManager.getCurrentSkin().showBackMenu().then(function () {
 
             isHandlingBackToDefault = false;
@@ -481,12 +485,14 @@ define(['loading', 'viewManager', 'skinManager', 'pluginManager', 'backdrop', 'b
         return show(pluginManager.mapRoute(skin, homeRoute));
     }
 
-    function showItem(item) {
+    function showItem(item, serverId) {
 
         if (typeof (item) === 'string') {
             require(['connectionManager'], function (connectionManager) {
-                var apiClient = connectionManager.currentApiClient();
+                var apiClient = serverId ? connectionManager.getApiClient(serverId) : connectionManager.currentApiClient();
-                apiClient.getItem(apiClient.getCurrentUserId(), item).then(showItem);
+                apiClient.getItem(apiClient.getCurrentUserId(), item).then(function (item) {
+                    embyRouter.showItem(item);
+                });
             });
         } else {
             skinManager.getCurrentSkin().showItem(item);

dashboard-ui/bower_components/iron-meta/.bower.json

@@ -26,14 +26,14 @@
     "webcomponentsjs": "webcomponents/webcomponentsjs#^0.7.0"
   },
   "main": "iron-meta.html",
-  "homepage": "https://github.com/polymerelements/iron-meta",
+  "homepage": "https://github.com/PolymerElements/iron-meta",
   "_release": "1.1.1",
   "_resolution": {
     "type": "version",
     "tag": "v1.1.1",
     "commit": "e171ee234b482219c9514e6f9551df48ef48bd9f"
   },
-  "_source": "git://github.com/polymerelements/iron-meta.git",
+  "_source": "git://github.com/PolymerElements/iron-meta.git",
   "_target": "^1.0.0",
-  "_originalSource": "polymerelements/iron-meta"
+  "_originalSource": "PolymerElements/iron-meta"
 }

dashboard-ui/bower_components/iron-selector/.bower.json

@@ -36,7 +36,7 @@
     "tag": "v1.5.1",
     "commit": "e3e34408fad8f7cde59c4255cf3fe90f7dcf91d8"
   },
-  "_source": "git://github.com/PolymerElements/iron-selector.git",
+  "_source": "git://github.com/polymerelements/iron-selector.git",
   "_target": "^1.0.0",
-  "_originalSource": "PolymerElements/iron-selector"
+  "_originalSource": "polymerelements/iron-selector"
 }

dashboard-ui/bower_components/paper-behaviors/.bower.json

@@ -45,7 +45,7 @@
     "tag": "v1.0.11",
     "commit": "e3c1ab0c72905b58fb4d9adc2921ea73b5c085a5"
   },
-  "_source": "git://github.com/polymerelements/paper-behaviors.git",
+  "_source": "git://github.com/PolymerElements/paper-behaviors.git",
   "_target": "^1.0.0",
-  "_originalSource": "polymerelements/paper-behaviors"
+  "_originalSource": "PolymerElements/paper-behaviors"
 }

dashboard-ui/bower_components/paper-ripple/.bower.json

@@ -32,14 +32,14 @@
     "iron-test-helpers": "PolymerElements/iron-test-helpers#^1.0.0"
   },
   "ignore": [],
-  "homepage": "https://github.com/polymerelements/paper-ripple",
+  "homepage": "https://github.com/PolymerElements/paper-ripple",
   "_release": "1.0.5",
   "_resolution": {
     "type": "version",
     "tag": "v1.0.5",
     "commit": "d72e7a9a8ab518b901ed18dde492df3b87a93be5"
   },
-  "_source": "git://github.com/polymerelements/paper-ripple.git",
+  "_source": "git://github.com/PolymerElements/paper-ripple.git",
   "_target": "^1.0.0",
-  "_originalSource": "polymerelements/paper-ripple"
+  "_originalSource": "PolymerElements/paper-ripple"
 }

dashboard-ui/components/directorybrowser/directorybrowser.js

@@ -137,7 +137,7 @@
         html += '<div>';
         html += '<paper-input id="txtDirectoryPickerPath" type="text" required="required" style="width:82%;display:inline-block;" label="' + Globalize.translate('LabelCurrentPath') + '"></paper-input>';
 
-        html += '<button is="paper-icon-button-light" class="btnRefreshDirectories" title="' + Globalize.translate('ButtonRefresh') + '"><iron-icon icon="refresh"></iron-icon></button>';
+        html += '<button type="button" is="paper-icon-button-light" class="btnRefreshDirectories" title="' + Globalize.translate('ButtonRefresh') + '"><iron-icon icon="refresh"></iron-icon></button>';
         html += '</div>';
 
         html += '<div class="results paperList" style="height: 180px; overflow-y: auto;"></div>';

dashboard-ui/components/metadataeditor/metadataeditor.js

@@ -669,14 +669,12 @@
             $('#tagsCollapsible', context).hide();
             $('#metadataSettingsCollapsible', context).hide();
             $('#fldPremiereDate', context).hide();
-            $('#fldSortName', context).hide();
             $('#fldDateAdded', context).hide();
             $('#fldYear', context).hide();
         } else {
             $('#tagsCollapsible', context).show();
             $('#metadataSettingsCollapsible', context).show();
             $('#fldPremiereDate', context).show();
-            $('#fldSortName', context).show();
             $('#fldDateAdded', context).show();
             $('#fldYear', context).show();
         }

dashboard-ui/components/metadataeditor/metadataeditor.template.html

@@ -29,7 +29,7 @@
             <div id="fldOriginalName">
                 <paper-input id="txtOriginalName" type="text" label="${LabelOriginalTitle}"></paper-input>
             </div>
-            <div id="fldSortName" style="display: none;">
+            <div>
                 <paper-input id="txtSortName" type="text" label="${LabelSortTitle}"></paper-input>
             </div>
             <div id="fldDateAdded" style="display: none;">

dashboard-ui/components/recordingcreator/recordingcreator.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'jQuery', 'scripts/livetvcomponents', 'livetvcss', 'paper-checkbox', 'paper-input', 'paper-icon-button-light'], function (dialogHelper, $) {
+define(['dialogHelper', 'jQuery', 'mediaInfo', 'scripts/livetvcomponents', 'livetvcss', 'paper-checkbox', 'paper-input', 'paper-icon-button-light'], function (dialogHelper, $, mediaInfo) {
 
     var currentProgramId;
     var currentDialog;
@@ -243,7 +243,8 @@
 
         $('.itemEpisodeName', context).html(program.EpisodeTitle || '');
 
-        $('.itemMiscInfo', context).html(LibraryBrowser.getMiscInfoHtml(program));
+        $('.itemMiscInfoPrimary', context).html(mediaInfo.getPrimaryMediaInfoHtml(program));
+        $('.itemMiscInfoSecondary', context).html(mediaInfo.getSecondaryMediaInfoHtml(program));
 
         $('.itemMiscInfo a').each(function () {
             $(this).replaceWith(this.innerHTML);

dashboard-ui/components/recordingcreator/recordingcreator.template.html

@@ -7,9 +7,10 @@
 
 <form class="liveTvNewRecordingForm" style="margin: 0 auto;">
 
-    <p><span class="itemName inlineItemName"></span></p>
+    <h1 class="itemName" style="margin:0;"></h1>
     <p class="itemEpisodeName"></p>
-    <p class="itemMiscInfo"></p>
+    <p class="itemMiscInfo itemMiscInfoPrimary"></p>
+    <p class="itemMiscInfo itemMiscInfoSecondary"></p>
 
     <div style="display: none;" id="eligibleForSeriesFields">
         <br />

dashboard-ui/components/recordingeditor/recordingeditor.js

@@ -1,4 +1,4 @@
-define(['dialogHelper', 'loading', 'jQuery', 'paper-checkbox', 'paper-input', 'emby-collapsible', 'paper-button', 'paper-icon-button-light'], function (dialogHelper, loading, $) {
+define(['dialogHelper', 'loading', 'jQuery', 'mediaInfo', 'paper-checkbox', 'paper-input', 'emby-collapsible', 'paper-button', 'paper-icon-button-light'], function (dialogHelper, loading, $, mediaInfo) {
 
     var currentDialog;
     var recordingUpdated = false;
@@ -12,8 +12,6 @@
 
         $('.itemEpisodeName', context).html(programInfo.EpisodeTitle || '');
 
-        $('.itemCommunityRating', context).html(LibraryBrowser.getRatingHtml(programInfo));
-
         LibraryBrowser.renderGenres($('.itemGenres', context), programInfo);
         LibraryBrowser.renderOverview(context.querySelectorAll('.itemOverview'), programInfo);
 
@@ -33,7 +31,8 @@
             $('.timerPageImageContainer', context).hide();
         }
 
-        $('.itemMiscInfo', context).html(LibraryBrowser.getMiscInfoHtml(programInfo));
+        $('.itemMiscInfoPrimary', context).html(mediaInfo.getPrimaryMediaInfoHtml(programInfo));
+        $('.itemMiscInfoSecondary', context).html(mediaInfo.getSecondaryMediaInfoHtml(programInfo));
 
         $('#txtPrePaddingMinutes', context).val(item.PrePaddingSeconds / 60);
         $('#txtPostPaddingMinutes', context).val(item.PostPaddingSeconds / 60);

dashboard-ui/components/recordingeditor/recordingeditor.template.html

@@ -16,12 +16,10 @@
         <div style="display: none; vertical-align: top; margin-right: 1em; padding-top: 1em;" class="timerPageImageContainer">
         </div>
         <div style="display: inline-block; vertical-align: middle;">
-            <p><span class="itemName inlineItemName"></span></p>
+            <h1 class="itemName" style="margin:0;"></h1>
             <p class="itemEpisodeName"></p>
-            <p class="itemMiscInfo miscTvProgramInfo"></p>
+            <p class="itemMiscInfo itemMiscInfoPrimary"></p>
-            <p>
+            <p class="itemMiscInfo itemMiscInfoSecondary"></p>
-                <span class="itemCommunityRating"></span>
-            </p>
             <p class="itemGenres"></p>
         </div>
     </div>

dashboard-ui/css/site.css

@@ -304,6 +304,11 @@ body {
         overflow-y: auto !important;
     }
 
+iron-icon {
+    min-width: 24px;
+    min-height: 24px;
+}
+
 /* Without this, no content will be displayed in mobile safari */
 .pageContainer {
     overflow-x: visible !important;

dashboard-ui/itemdetails.html

@@ -16,11 +16,10 @@
         </div>
         <div class="primaryDetailsContainer">
             <div class="detailNameContainer">
-                <div><span class="parentName"></span><span class="itemName inlineItemName"></span></div>
+                <div class="parentName"></div>
-                <div class="desktopDetails" style="margin-top:1em;">
+                <h1 class="itemName" style="margin:0;"></h1>
+                <div class="desktopDetails itemMiscInfo" style="margin-top:.5em;">
 
-                    <span class="itemMiscInfo"></span>
-                    <span class="itemCommunityRating" style="margin-left:1em;"></span>
                 </div>
             </div>
             <div class="desktopDetails" style="padding-top:5px;">
@@ -42,9 +41,7 @@
 
     <div class="mobileDetails" style="text-align:center;clear:both;">
         <div style="height:10px;"></div>
-        <div>
+        <div class="itemMiscInfo">
-            <span class="itemMiscInfo"></span>
-            <span class="itemCommunityRating" style="margin-left:1em;"></span>
         </div>
         <div class="detailButtonsContainer">
             <br />
@@ -70,7 +67,6 @@
                 <p id="itemBirthLocation"></p>
                 <p id="itemDeathDate"></p>
                 <p id="seriesAirTime"></p>
-                <p class="airDate"></p>
                 <p class="itemOverview topOverview"></p>
             </div>
             <div class="collectionItems"></div>

dashboard-ui/livetvseriestimer.html

@@ -3,7 +3,7 @@
     <div data-role="content">
 
         <div class="readOnlyContent" style="margin:auto; max-width: 720px;">
-            <p><span class="itemName inlineItemName"></span></p>
+            <h1 class="itemName" style="margin:0;"></h1>
 
             <p class="channel" style="margin-top: 2em;"></p>
             <p class="time"></p>

dashboard-ui/scripts/editorsidebar.js

@@ -147,7 +147,12 @@
 
     function loadLiveTvChannels(service, openItems, callback) {
 
-        ApiClient.getLiveTvChannels({ ServiceName: service, AddCurrentProgram: false }).then(function (result) {
+        ApiClient.getLiveTvChannels({
+
+            ServiceName: service,
+            AddCurrentProgram: false
+
+        }).then(function (result) {
 
             var nodes = result.Items.map(function (i) {
 

dashboard-ui/scripts/itemdetailpage.js

@@ -1,4 +1,4 @@
-define(['layoutManager', 'datetime', 'jQuery', 'scrollStyles'], function (layoutManager, datetime, $) {
+define(['layoutManager', 'datetime', 'jQuery', 'mediaInfo', 'scrollStyles'], function (layoutManager, datetime, $, mediaInfo) {
 
     var currentItem;
 
@@ -171,8 +171,6 @@
                 $('.chapterSettingsButton', page).hide();
             }
 
-            LiveTvHelpers.renderOriginalAirDate($('.airDate', page), item);
-
             if (item.Type == "Person" && item.PremiereDate) {
 
                 try {
@@ -467,11 +465,13 @@
             bottomOverview.classList.add('hide');
         }
 
-        $('.itemCommunityRating', page).html(LibraryBrowser.getRatingHtml(item));
-
         LibraryBrowser.renderAwardSummary($('#awardSummary', page), item);
 
-        $('.itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item));
+        $('.itemMiscInfo', page).each(function () {
+            mediaInfo.fillPrimaryMediaInfo(this, item, {
+                interactive: true
+            });
+        });
 
         LibraryBrowser.renderGenres($('.itemGenres', page), item, null, isStatic);
         LibraryBrowser.renderStudios($('.itemStudios', page), item, isStatic);
@@ -1319,7 +1319,7 @@
             IncludeItemTypes: "MusicVideo",
             Recursive: true,
             Fields: "DateCreated,SyncInfo,CanDelete",
-            Albums: item.Name
+            AlbumNames: item.Name
 
         }).then(function (result) {
             if (result.Items.length) {

dashboard-ui/scripts/librarybrowser.js

@@ -1,4 +1,4 @@
-define(['playlistManager', 'appSettings', 'appStorage', 'apphost', 'datetime', 'jQuery', 'scrollStyles'], function (playlistManager, appSettings, appStorage, appHost, datetime, $) {
+define(['playlistManager', 'appSettings', 'appStorage', 'apphost', 'datetime', 'jQuery', 'itemHelper', 'mediaInfo', 'scrollStyles'], function (playlistManager, appSettings, appStorage, appHost, datetime, $, itemHelper, mediaInfo) {
 
     function parentWithClass(elem, className) {
 
@@ -695,7 +695,7 @@
                 return commands;
             },
 
-            canIdentify: function(user, itemType) {
+            canIdentify: function (user, itemType) {
 
                 if (itemType == "Movie" ||
                   itemType == "Trailer" ||
@@ -1332,7 +1332,7 @@
                         textlines.push(item.AlbumArtist || ' ');
                     }
 
-                    var displayName = LibraryBrowser.getPosterViewDisplayName(item);
+                    var displayName = itemHelper.getDisplayName(item);
 
                     if (options.showIndexNumber && item.IndexNumber != null) {
                         displayName = item.IndexNumber + ". " + displayName;
@@ -1359,11 +1359,13 @@
                     else if (item.Type == 'TvChannel') {
 
                         if (item.CurrentProgram) {
-                            textlines.push(LibraryBrowser.getPosterViewDisplayName(item.CurrentProgram));
+                            textlines.push(itemHelper.getDisplayName(item.CurrentProgram));
                         }
                     }
                     else {
-                        textlines.push(LibraryBrowser.getMiscInfoHtml(item));
+                        textlines.push('<div class="itemMiscInfo">' + mediaInfo.getPrimaryMediaInfoHtml(item, {
+                            endsAt: false
+                        }) + '</div>');
                     }
 
                     if (textlines.length > 2) {
@@ -2281,7 +2283,7 @@
                     html += "</div>";
                 }
 
-                var name = options.showTitle == 'auto' && !item.IsFolder && item.MediaType == 'Photo' ? '' : LibraryBrowser.getPosterViewDisplayName(item, options.displayAsSpecial);
+                var name = options.showTitle == 'auto' && !item.IsFolder && item.MediaType == 'Photo' ? '' : itemHelper.getDisplayName(item);
 
                 if (!imgUrl && !showTitle) {
                     html += "<div class='cardDefaultText'>";
@@ -2384,7 +2386,7 @@
                 if (item.Type == 'TvChannel') {
 
                     if (item.CurrentProgram) {
-                        lines.push(LibraryBrowser.getPosterViewDisplayName(item.CurrentProgram));
+                        lines.push(itemHelper.getDisplayName(item.CurrentProgram));
                     } else {
                         lines.push('');
                     }
@@ -2541,48 +2543,6 @@
                 return day;
             },
 
-            getPosterViewDisplayName: function (item, displayAsSpecial, includeParentInfo) {
-
-                if (!item) {
-                    throw new Error("null item passed into getPosterViewDisplayName");
-                }
-
-                var name = item.EpisodeTitle || item.Name || '';
-
-                if (item.Type == "TvChannel") {
-
-                    if (item.Number) {
-                        return item.Number + ' ' + name;
-                    }
-                    return name;
-                }
-                if (displayAsSpecial && item.Type == "Episode" && item.ParentIndexNumber == 0) {
-
-                    name = Globalize.translate('ValueSpecialEpisodeName', name);
-
-                } else if (item.Type == "Episode" && item.IndexNumber != null && item.ParentIndexNumber != null) {
-
-                    var displayIndexNumber = item.IndexNumber;
-
-                    var number = "E" + displayIndexNumber;
-
-                    if (includeParentInfo !== false) {
-                        number = "S" + item.ParentIndexNumber + ", " + number;
-                    }
-
-                    if (item.IndexNumberEnd) {
-
-                        displayIndexNumber = item.IndexNumberEnd;
-                        number += "-" + displayIndexNumber;
-                    }
-
-                    name = number + " - " + name;
-
-                }
-
-                return name;
-            },
-
             getOfflineIndicatorHtml: function (item) {
 
                 if (item.LocationType == "Offline") {
@@ -2735,7 +2695,9 @@
 
             renderName: function (item, nameElem, linkToElement, context) {
 
-                var name = LibraryBrowser.getPosterViewDisplayName(item, false, false);
+                var name = itemHelper.getDisplayName(item, {
+                    includeParentInfo: false
+                });
 
                 Dashboard.setPageTitle(name);
 
@@ -3032,44 +2994,6 @@
                 });
             },
 
-            getRatingHtml: function (item, metascore) {
-
-                var html = "";
-
-                if (item.CommunityRating) {
-
-                    html += "<div class='starRating' title='" + item.CommunityRating + "'></div>";
-                    html += '<div class="starRatingValue">';
-                    html += item.CommunityRating.toFixed(1);
-                    html += '</div>';
-                }
-
-                if (item.CriticRating != null) {
-
-                    if (item.CriticRating >= 60) {
-                        html += '<div class="fresh rottentomatoesicon" title="Rotten Tomatoes"></div>';
-                    } else {
-                        html += '<div class="rotten rottentomatoesicon" title="Rotten Tomatoes"></div>';
-                    }
-
-                    html += '<div class="criticRating" title="Rotten Tomatoes">' + item.CriticRating + '%</div>';
-                }
-
-                //if (item.Metascore && metascore !== false) {
-
-                //    if (item.Metascore >= 60) {
-                //        html += '<div class="metascore metascorehigh" title="Metascore">' + item.Metascore + '</div>';
-                //    }
-                //    else if (item.Metascore >= 40) {
-                //        html += '<div class="metascore metascoremid" title="Metascore">' + item.Metascore + '</div>';
-                //    } else {
-                //        html += '<div class="metascore metascorelow" title="Metascore">' + item.Metascore + '</div>';
-                //    }
-                //}
-
-                return html;
-            },
-
             getItemProgressBarHtml: function (item) {
 
 
@@ -3328,180 +3252,6 @@
                 detailImageProgressContainer.innerHTML = progressHtml || '';
             },
 
-            getMiscInfoHtml: function (item) {
-
-                var miscInfo = [];
-                var text, date;
-
-                if (item.IsSeries && !item.IsRepeat) {
-
-                    require(['livetvcss']);
-                    miscInfo.push('<span class="newTvProgram">' + Globalize.translate('AttributeNew') + '</span>');
-
-                }
-
-                if (item.IsLive) {
-
-                    miscInfo.push('<span class="liveTvProgram">' + Globalize.translate('AttributeLive') + '</span>');
-
-                }
-
-                if (item.ChannelId && item.ChannelName) {
-                    if (item.Type == 'Program' || item.Type == 'Recording') {
-                        miscInfo.push('<a class="textlink" href="itemdetails.html?id=' + item.ChannelId + '">' + item.ChannelName + '</a>');
-                    }
-                }
-
-                if (item.Type == "Episode" || item.MediaType == 'Photo') {
-
-                    if (item.PremiereDate) {
-
-                        try {
-                            date = datetime.parseISO8601Date(item.PremiereDate, true);
-
-                            text = date.toLocaleDateString();
-                            miscInfo.push(text);
-                        }
-                        catch (e) {
-                            console.log("Error parsing date: " + item.PremiereDate);
-                        }
-                    }
-                }
-
-                if (item.StartDate) {
-
-                    try {
-                        date = datetime.parseISO8601Date(item.StartDate, true);
-
-                        text = date.toLocaleDateString();
-                        miscInfo.push(text);
-
-                        if (item.Type != "Recording") {
-                            text = datetime.getDisplayTime(date);
-                            miscInfo.push(text);
-                        }
-                    }
-                    catch (e) {
-                        console.log("Error parsing date: " + item.PremiereDate);
-                    }
-                }
-
-                if (item.ProductionYear && item.Type == "Series") {
-
-                    if (item.Status == "Continuing") {
-                        miscInfo.push(Globalize.translate('ValueSeriesYearToPresent', item.ProductionYear));
-
-                    }
-                    else if (item.ProductionYear) {
-
-                        text = item.ProductionYear;
-
-                        if (item.EndDate) {
-
-                            try {
-
-                                var endYear = datetime.parseISO8601Date(item.EndDate, true).getFullYear();
-
-                                if (endYear != item.ProductionYear) {
-                                    text += "-" + datetime.parseISO8601Date(item.EndDate, true).getFullYear();
-                                }
-
-                            }
-                            catch (e) {
-                                console.log("Error parsing date: " + item.EndDate);
-                            }
-                        }
-
-                        miscInfo.push(text);
-                    }
-                }
-
-                if (item.Type != "Series" && item.Type != "Episode" && item.MediaType != 'Photo') {
-
-                    if (item.ProductionYear) {
-
-                        miscInfo.push(item.ProductionYear);
-                    }
-                    else if (item.PremiereDate) {
-
-                        try {
-                            text = datetime.parseISO8601Date(item.PremiereDate, true).getFullYear();
-                            miscInfo.push(text);
-                        }
-                        catch (e) {
-                            console.log("Error parsing date: " + item.PremiereDate);
-                        }
-                    }
-                }
-
-                var minutes;
-
-                if (item.RunTimeTicks && item.Type != "Series") {
-
-                    if (item.Type == "Audio") {
-
-                        miscInfo.push(datetime.getDisplayRunningTime(item.RunTimeTicks));
-
-                    } else {
-                        minutes = item.RunTimeTicks / 600000000;
-
-                        minutes = minutes || 1;
-
-                        miscInfo.push(Math.round(minutes) + "min");
-                    }
-                }
-
-                if (item.CumulativeRunTimeTicks && item.Type != "Series" && item.Type != "Season") {
-
-                    miscInfo.push(datetime.getDisplayRunningTime(item.CumulativeRunTimeTicks));
-                }
-
-                if (item.OfficialRating && item.Type !== "Season" && item.Type !== "Episode") {
-                    miscInfo.push(item.OfficialRating);
-                }
-
-                if (item.IsHD) {
-
-                    miscInfo.push(Globalize.translate('LabelHDProgram'));
-                }
-
-                //if (item.Audio) {
-
-                //    miscInfo.push(item.Audio);
-
-                //}
-
-                if (item.Video3DFormat) {
-                    miscInfo.push("3D");
-                }
-
-                if (item.MediaType == 'Photo' && item.Width && item.Height) {
-                    miscInfo.push(item.Width + "x" + item.Height);
-                }
-
-                if (item.SeriesTimerId) {
-                    var html = '';
-                    html += '<a href="livetvseriestimer.html?id=' + item.SeriesTimerId + '" title="' + Globalize.translate('ButtonViewSeriesRecording') + '">';
-                    html += '<div class="timerCircle seriesTimerCircle"></div>';
-                    html += '<div class="timerCircle seriesTimerCircle"></div>';
-                    html += '<div class="timerCircle seriesTimerCircle"></div>';
-                    html += '</a>';
-                    miscInfo.push(html);
-                    require(['livetvcss']);
-                }
-                else if (item.TimerId) {
-
-                    var html = '';
-                    html += '<button type="button" class="clearButton" onclick="LibraryBrowser.editTimer(\'' + item.TimerId + '\');">';
-                    html += '<div class="timerCircle"></div>';
-                    html += '</button>';
-                    miscInfo.push(html);
-                    require(['livetvcss']);
-                }
-
-                return miscInfo.join('&nbsp;&nbsp;&nbsp;&nbsp;');
-            },
-
             renderOverview: function (elems, item) {
 
                 for (var i = 0, length = elems.length; i < length; i++) {

dashboard-ui/scripts/librarylist.js

@@ -1,4 +1,4 @@
-define(['appSettings', 'appStorage', 'libraryBrowser', 'apphost', 'jQuery'], function (appSettings, appStorage, LibraryBrowser, appHost, $) {
+define(['appSettings', 'appStorage', 'libraryBrowser', 'apphost', 'jQuery', 'itemHelper', 'mediaInfo'], function (appSettings, appStorage, LibraryBrowser, appHost, $, itemHelper, mediaInfo) {
 
     var showOverlayTimeout;
 
@@ -81,7 +81,7 @@
         var isSquare = className.indexOf('square') != -1;
 
         var parentName = isSmallItem || isMiniItem || isPortrait ? null : item.SeriesName;
-        var name = LibraryBrowser.getPosterViewDisplayName(item, true);
+        var name = itemHelper.getDisplayName(item);
 
         html += '<div style="margin-bottom:1em;">';
         var logoHeight = isSmallItem || isMiniItem ? 20 : 26;
@@ -118,28 +118,22 @@
             html += name;
             html += '</p>';
         } else if (!isSmallItem && !isMiniItem) {
-            html += '<p class="itemMiscInfo" style="white-space:nowrap;">';
+            html += '<div class="itemMiscInfo">';
-            html += LibraryBrowser.getMiscInfoHtml(item);
+            html += mediaInfo.getPrimaryMediaInfoHtml(item, {
-            html += '</p>';
+                endsAt: false
+            });
+            html += '</div>';
         }
 
         if (!isMiniItem) {
             html += '<div style="margin:1em 0 .75em;">';
 
             if (isPortrait) {
-                html += '<div class="itemCommunityRating">';
-                html += LibraryBrowser.getRatingHtml(item, false);
-                html += '</div>';
-
                 html += '<div class="userDataIcons" style="margin:.5em 0 0em;">';
                 html += LibraryBrowser.getUserDataIconsHtml(item);
                 html += '</div>';
             } else {
 
-                html += '<span class="itemCommunityRating" style="vertical-align:middle;">';
-                html += LibraryBrowser.getRatingHtml(item, false);
-                html += '</span>';
-
                 html += '<span class="userDataIcons" style="vertical-align:middle;">';
                 html += LibraryBrowser.getUserDataIconsHtml(item);
                 html += '</span>';

dashboard-ui/scripts/livetvcomponents.js

@@ -114,25 +114,6 @@
             });
         },
 
-        renderOriginalAirDate: function (elem, item) {
-
-            var airDate = item.PremiereDate;
-
-            if (airDate && item.IsRepeat) {
-
-                try {
-                    airDate = datetime.parseISO8601Date(airDate, true).toLocaleDateString();
-                }
-                catch (e) {
-                    console.log("Error parsing date: " + airDate);
-                }
-
-
-                elem.html(Globalize.translate('ValueOriginalAirDate').replace('{0}', airDate)).show();
-            } else {
-                elem.hide();
-            }
-        },
         getTimersHtml: getTimersHtml
 
     };

dashboard-ui/scripts/livetvrecordings.js

@@ -98,7 +98,7 @@
         ApiClient.getLiveTvRecordings({
 
             userId: Dashboard.getCurrentUserId(),
-            limit: 12,
+            limit: 6,
             IsInProgress: false,
             Fields: 'CanDelete,PrimaryImageAspectRatio'
 

dashboard-ui/scripts/mediaplayer-video.js

@@ -1,4 +1,4 @@
-define(['appSettings', 'datetime', 'jQuery', 'scrollStyles', 'paper-icon-button-light'], function (appSettings, datetime, $) {
+define(['appSettings', 'datetime', 'jQuery', 'mediaInfo', 'scrollStyles', 'paper-icon-button-light'], function (appSettings, datetime, $, mediaInfo) {
 
     function createVideoPlayer(self) {
 
@@ -444,18 +444,12 @@
             var nameHtml = MediaController.getNowPlayingNameHtml(item, false);
             nameHtml = '<div class="videoNowPlayingName">' + nameHtml + '</div>';
 
-            var miscInfo = LibraryBrowser.getMiscInfoHtml(item);
+            var miscInfo = mediaInfo.getPrimaryMediaInfoHtml(item);
             if (miscInfo) {
 
                 nameHtml += '<div class="videoNowPlayingRating">' + miscInfo + '</div>';
             }
 
-            var ratingHtml = LibraryBrowser.getRatingHtml(item);
-            if (ratingHtml) {
-
-                nameHtml += '<div class="videoNowPlayingRating">' + ratingHtml + '</div>';
-            }
-
             if (item.Overview) {
 
                 nameHtml += '<div class="videoNowPlayingOverview">' + item.Overview + '</div>';

dashboard-ui/scripts/site.js

@@ -1790,12 +1790,14 @@ var AppInfo = {};
             focusManager: embyWebComponentsBowerPath + "/focusmanager",
             datetime: embyWebComponentsBowerPath + "/datetime",
             globalize: embyWebComponentsBowerPath + "/globalize",
+            itemHelper: embyWebComponentsBowerPath + '/itemhelper',
             itemShortcuts: embyWebComponentsBowerPath + "/shortcuts",
             imageLoader: embyWebComponentsBowerPath + "/images/imagehelper"
         };
 
         if (navigator.webkitPersistentStorage) {
             paths.imageFetcher = embyWebComponentsBowerPath + "/images/persistentimagefetcher";
+            //paths.imageFetcher = embyWebComponentsBowerPath + "/images/basicimagefetcher";
         } else if (Dashboard.isRunningInCordova()) {
             paths.imageFetcher = 'cordova/imagestore';
         } else {
@@ -1819,6 +1821,7 @@ var AppInfo = {};
 
         define("libjass", [bowerPath + "/libjass/libjass", "css!" + bowerPath + "/libjass/libjass"], returnFirstDependency);
 
+        define("mediaInfo", [embyWebComponentsBowerPath + "/mediainfo/mediainfo"], returnFirstDependency);
         define("backdrop", [embyWebComponentsBowerPath + "/backdrop/backdrop"], returnFirstDependency);
         define("fetchHelper", [embyWebComponentsBowerPath + "/fetchhelper"], returnFirstDependency);
 
@@ -3288,12 +3291,6 @@ pageClassOn('viewshow', "page", function () {
         page.classList.remove('ui-body-a');
     }
 
-    //if (currentTheme != 'a' && !browserInfo.mobile) {
-    //    document.documentElement.classList.add('darkScrollbars');
-    //} else {
-    //    document.documentElement.classList.remove('darkScrollbars');
-    //}
-
     var apiClient = window.ApiClient;
 
     Dashboard.ensureHeader(page);

dashboard-ui/shared.html

@@ -27,11 +27,10 @@
         </div>
         <div class="primaryDetailsContainer">
             <div class="detailNameContainer">
-                <div><span class="parentName"></span><span class="itemName inlineItemName"></span></div>
+                <div class="parentName"></div>
-                <div class="desktopDetails" style="margin-top:1em;">
+                <h1 class="itemName" style="margin:0;"></h1>
+                <div class="desktopDetails itemMiscInfo" style="margin-top:.5em;">
 
-                    <span class="itemMiscInfo"></span>
-                    <span class="itemCommunityRating" style="margin-left:1em;"></span>
                 </div>
             </div>
             <div class="desktopDetails" style="padding-top:5px;">
@@ -44,9 +43,7 @@
 
     <div class="mobileDetails" style="text-align:center;clear:both;">
         <div style="height:10px;"></div>
-        <div>
+        <div class="itemMiscInfo">
-            <span class="itemMiscInfo"></span>
-            <span class="itemCommunityRating" style="margin-left:1em;"></span>
         </div>
     </div>
 
@@ -63,7 +60,6 @@
                 <p id="itemBirthLocation"></p>
                 <p id="itemDeathDate"></p>
                 <p id="seriesAirTime"></p>
-                <p class="airDate"></p>
                 <p class="itemOverview topOverview"></p>
             </div>
             <div id="castCollapsible" style="display: none;" class="detailSection">

dashboard-ui/strings/en-US.json

@@ -1887,7 +1887,6 @@
   "OptionNewPlaylist": "New playlist...",
   "MessageAddedToPlaylistSuccess": "Ok",
   "ButtonViewSeriesRecording": "View series recording",
-  "ValueOriginalAirDate": "Original air date: {0}",
   "ButtonRemoveFromPlaylist": "Remove from playlist",
   "HeaderSpecials": "Specials",
   "HeaderTrailers": "Trailers",
@@ -2097,6 +2096,9 @@
   "LabelFullReview": "Full review:",
   "LabelShortRatingDescription": "Short rating summary:",
   "OptionIRecommendThisItem": "I recommend this item",
+  "EndsAtValue": "Ends at {0}",
+  "ReleaseYearValue": "Release year: {0}",
+  "OriginalAirDateValue": "Original air date: {0}",
   "WebClientTourContent": "View your recently added media, next episodes, and more. The green circles indicate how many unplayed items you have.",
   "WebClientTourMovies": "Play movies, trailers and more from any device with a web browser",
   "WebClientTourMouseOver": "Hold the mouse over any poster for quick access to important information",