update recording layout

2025-03-30 19:56:21 +00:00 · 2016-09-05 01:39:14 -04:00 · 2016-09-05 01:39:14 -04:00 · 25dbf665dd
commit 25dbf665dd
parent 80948f62fa
24 changed files with 341 additions and 256 deletions
--- a/dashboard-ui/bower_components/emby-webcomponents/.bower.json
+++ b/dashboard-ui/bower_components/emby-webcomponents/.bower.json
@ -14,12 +14,12 @@
  },
  "devDependencies": {},
  "ignore": [],
-  "version": "1.4.212",
-  "_release": "1.4.212",
+  "version": "1.4.213",
+  "_release": "1.4.213",
  "_resolution": {
    "type": "version",
-    "tag": "1.4.212",
-    "commit": "45cf1768cae1cc5bf3761a7154c429dffbd78378"
+    "tag": "1.4.213",
+    "commit": "5db5ff0f3a13742f310688474a22b44e0d38cee5"
  },
  "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
  "_target": "^1.2.1",
--- a/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/actionsheet/actionsheet.js
@ -238,17 +238,6 @@
        //var eventName = browser.firefox ? 'mousedown' : 'click';
        var selectedId;

-        dlg.addEventListener('click', function (e) {
-
-            var actionSheetMenuItem = dom.parentWithClass(e.target, 'actionSheetMenuItem');
-
-            if (actionSheetMenuItem) {
-                selectedId = actionSheetMenuItem.getAttribute('data-id');
-                dialogHelper.close(dlg);
-            }
-
-        });
-
        var timeout;
        if (options.timeout) {
            timeout = setTimeout(function () {
@ -258,6 +247,25 @@

        return new Promise(function (resolve, reject) {

+            var isResolved;
+
+            dlg.addEventListener('click', function (e) {
+
+                var actionSheetMenuItem = dom.parentWithClass(e.target, 'actionSheetMenuItem');
+
+                if (actionSheetMenuItem) {
+                    selectedId = actionSheetMenuItem.getAttribute('data-id');
+
+                    if (options.resolveOnClick) {
+                        resolve(selectedId);
+                        isResolved = true;
+                    }
+
+                    dialogHelper.close(dlg);
+                }
+
+            });
+
            dlg.addEventListener('close', function () {

                if (layoutManager.tv) {
@ -269,6 +277,7 @@
                    timeout = null;
                }

+                if (!isResolved) {
                    if (selectedId != null) {
                        if (options.callback) {
                            options.callback(selectedId);
@ -278,6 +287,7 @@
                    } else {
                        reject();
                    }
+                }
            });

            dialogHelper.open(dlg);
--- a/dashboard-ui/bower_components/emby-webcomponents/browserdeviceprofile.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/browserdeviceprofile.js
@ -395,7 +395,7 @@ define(['browser'], function (browser) {
                Container: 'mkv',
                Type: 'Video',
                AudioCodec: videoAudioCodecs.join(','),
-                VideoCodec: 'h264',
+                VideoCodec: 'copy',
                Context: 'Streaming',
                CopyTimestamps: copyTimestamps
            });
--- a/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/cardbuilder/cardbuilder.js
@ -861,10 +861,8 @@ define(['datetime', 'imageLoader', 'connectionManager', 'itemHelper', 'mediaInfo

                if (options.showProgramAirInfo) {

-                    var date = datetime.parseISO8601Date(item.StartDate, true);
-
                    var text = item.StartDate ?
-                        date.toLocaleString() :
+                        datetime.toLocaleString(datetime.parseISO8601Date(item.StartDate, true)) :
                        '';

                    lines.push(text || '&nbsp;');
--- a/dashboard-ui/bower_components/emby-webcomponents/datetime.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/datetime.js
@ -103,6 +103,14 @@
        return false;
    }();

+    function toLocaleString(date) {
+        var currentLocale = globalize.getCurrentLocale();
+
+        return currentLocale && toLocaleTimeStringSupportsLocales ?
+            date.toLocaleString(currentLocale) :
+            date.toLocaleString();
+    }
+
    function toLocaleDateString(date) {

        var currentLocale = globalize.getCurrentLocale();
@ -178,6 +186,7 @@
        parseISO8601Date: parseISO8601Date,
        getDisplayRunningTime: getDisplayRunningTime,
        toLocaleDateString: toLocaleDateString,
+        toLocaleString: toLocaleString,
        getDisplayTime: getDisplayTime,
        isRelativeDay: isRelativeDay
    };
--- a/dashboard-ui/bower_components/emby-webcomponents/pagejs/page.js
+++ b/dashboard-ui/bower_components/emby-webcomponents/pagejs/page.js
@ -559,6 +559,11 @@ define([], function () {
    }

    page.pushState = function (state, title, url) {
+
+        if (hashbang) {
+            url = '#!' + url;
+        }
+
        history.pushState(state, title, url);
        previousPopState = state;
    };
--- a/dashboard-ui/bower_components/polymer/.bower.json
+++ b/dashboard-ui/bower_components/polymer/.bower.json
@ -32,14 +32,14 @@
    "iron-component-page": "polymerElements/iron-component-page#^1.1.6"
  },
  "private": true,
-  "homepage": "https://github.com/polymer/polymer",
+  "homepage": "https://github.com/Polymer/polymer",
  "_release": "1.6.1",
  "_resolution": {
    "type": "version",
    "tag": "v1.6.1",
    "commit": "1f197d9d7874b1e5808b2a5c26f34446a7d912fc"
  },
-  "_source": "git://github.com/polymer/polymer.git",
+  "_source": "git://github.com/Polymer/polymer.git",
  "_target": "^1.1.0",
-  "_originalSource": "polymer/polymer"
+  "_originalSource": "Polymer/polymer"
 }
--- a/dashboard-ui/bower_components/requirejs/.bower.json
+++ b/dashboard-ui/bower_components/requirejs/.bower.json
@ -1,6 +1,6 @@
 {
  "name": "requirejs",
-  "version": "2.2.0",
+  "version": "2.3.0",
  "ignore": [],
  "homepage": "http://requirejs.org",
  "authors": [
@ -14,13 +14,13 @@
  "license": [
    "MIT"
  ],
-  "_release": "2.2.0",
+  "_release": "2.3.0",
  "_resolution": {
    "type": "version",
-    "tag": "2.2.0",
-    "commit": "1da07057390909f5422c5fd4fb18b6b57cf92b66"
+    "tag": "2.3.0",
+    "commit": "49ddc059ef857de683315001bb8721d17c1686d6"
  },
-  "_source": "git://github.com/jrburke/requirejs-bower.git",
+  "_source": "https://github.com/jrburke/requirejs-bower.git",
  "_target": "^2.1.22",
  "_originalSource": "requirejs"
 }
--- a/dashboard-ui/bower_components/requirejs/bower.json
+++ b/dashboard-ui/bower_components/requirejs/bower.json
@ -1,6 +1,6 @@
 {
  "name": "requirejs",
-  "version": "2.2.0",
+  "version": "2.3.0",
  "ignore": [],
  "homepage": "http://requirejs.org",
  "authors": [
--- a/dashboard-ui/bower_components/requirejs/require.js
+++ b/dashboard-ui/bower_components/requirejs/require.js
@ -1,6 +1,6 @@
 /** vim: et:ts=4:sw=4:sts=4
- * @license RequireJS 2.2.0 Copyright jQuery Foundation and other contributors.
- * Released under MIT license, http://github.com/requirejs/requirejs/LICENSE
+ * @license RequireJS 2.3.0 Copyright jQuery Foundation and other contributors.
+ * Released under MIT license, https://github.com/requirejs/requirejs/blob/master/LICENSE
 */
 //Not using strict: uneven strict support in browsers, #392, and causes
 //problems with requirejs.exec()/transpiler plugins that may not be strict.
@ -8,11 +8,11 @@
 /*global window, navigator, document, importScripts, setTimeout, opera */

 var requirejs, require, define;
-(function (global) {
+(function (global, setTimeout) {
    var req, s, head, baseElement, dataMain, src,
        interactiveScript, currentlyAddingScript, mainScript, subPath,
-        version = '2.2.0',
-        commentRegExp = /(\/\*([\s\S]*?)\*\/|([^:]|^)\/\/(.*)$)/mg,
+        version = '2.3.0',
+        commentRegExp = /\/\*[\s\S]*?\*\/|([^:"'=]|^)\/\/.*$/mg,
        cjsRequireRegExp = /[^.]\s*require\s*\(\s*["']([^'"\s]+)["']\s*\)/g,
        jsSuffixRegExp = /\.js$/,
        currDirRegExp = /^\.\//,
@ -36,7 +36,7 @@ var requirejs, require, define;
        useInteractive = false;

    //Could match something like ')//comment', do not lose the prefix to comment.
-    function commentReplace(match, multi, multiText, singlePrefix) {
+    function commentReplace(match, singlePrefix) {
        return singlePrefix || '';
    }

@ -2139,4 +2139,4 @@ var requirejs, require, define;

    //Set up with config info.
    req(cfg);
-}(this));
+}(this, setTimeout));
--- a/dashboard-ui/dashboard/dashboardgeneral.js
+++ b/dashboard-ui/dashboard/dashboardgeneral.js
@ -36,10 +36,8 @@

        if (systemInfo.CanSelfUpdate) {
            $('.fldAutomaticUpdates', page).show();
-            page.querySelector('#selectAutomaticUpdateLevel').setLabel(Globalize.translate('LabelAutomaticUpdateLevel'));
        } else {
            $('.fldAutomaticUpdates', page).hide();
-            page.querySelector('#selectAutomaticUpdateLevel').setLabel(Globalize.translate('LabelAutomaticUpdateLevelForPlugins'));
        }

        $('#chkEnableAutomaticServerUpdates', page).checked(config.EnableAutoUpdate);
@ -51,8 +49,6 @@
            $('#fldEnableAutomaticRestart', page).hide();
        }

-        $('#selectAutomaticUpdateLevel', page).val(config.SystemUpdateLevel).trigger('change');
-
        $('#chkEnableDashboardResponseCache', page).checked(config.EnableDashboardResponseCaching);
        $('#chkEnableMinification', page).checked(config.EnableDashboardResourceMinification);
        $('#txtDashboardSourcePath', page).val(config.DashboardSourcePath).trigger('change');
@ -82,7 +78,6 @@
            config.EnableAnonymousUsageReporting = $('#chkUsageData', form).checked();
            config.RunAtStartup = $('#chkRunAtStartup', form).checked();

-            config.SystemUpdateLevel = $('#selectAutomaticUpdateLevel', form).val();
            config.EnableAutomaticRestart = $('#chkEnableAutomaticRestart', form).checked();
            config.EnableAutoUpdate = $('#chkEnableAutomaticServerUpdates', form).checked();

@ -117,16 +112,6 @@

    return function (view, params) {

-        $('#selectAutomaticUpdateLevel', view).on('change', function () {
-
-            if (this.value == "Dev") {
-                $('#devBuildWarning', view).show();
-            } else {
-                $('#devBuildWarning', view).hide();
-            }
-
-        });
-
        $('#btnSelectCachePath', view).on("click.selectDirectory", function () {

            require(['directorybrowser'], function (directoryBrowser) {
--- a/dashboard-ui/dashboardgeneral.html
+++ b/dashboard-ui/dashboardgeneral.html
@ -65,16 +65,6 @@
                            <input is="emby-checkbox" type="checkbox" id="chkEnableAutomaticServerUpdates" />
                            <span>${OptionEnableAutomaticServerUpdates}</span>
                        </label>
-                        <div class="selectContainer">
-                            <select is="emby-select" id="selectAutomaticUpdateLevel" label="${LabelAutomaticUpdateLevel}">
-                                <option value="Release">${OptionRelease}</option>
-                                <option value="Beta">${OptionBeta}</option>
-                                <option value="Dev">${OptionDev}</option>
-                            </select>
-                            <div id="devBuildWarning" class="fieldDescription warningFieldDescription" style="display: none;">
-                                ${DevBuildWarning}
-                            </div>
-                        </div>
                        <div id="fldEnableAutomaticRestart" style="display: none;" class="checkboxContainer checkboxContainer-withDescription">
                            <label>
                                <input is="emby-checkbox" type="checkbox" id="chkEnableAutomaticRestart" />
--- a/dashboard-ui/livetv.html
+++ b/dashboard-ui/livetv.html
@ -37,7 +37,7 @@
        <div id="upcomingTvMovies" class="homePageSection" style="margin-top: 1em;">
            <div>
                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderUpcomingMovies}</h1>
-                <a href="livetvitems.html?type=movies" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
+                <a href="livetvitems.html?type=Programs&IsMovie=true" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
            </div>
            <div is="emby-itemscontainer" class="upcomingTvMovieItems itemsContainer"></div>
            <br />
@ -45,7 +45,7 @@
        <div id="upcomingSports" class="homePageSection" style="margin-top: 1em;">
            <div>
                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderUpcomingSports}</h1>
-                <a href="livetvitems.html?type=sports" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
+                <a href="livetvitems.html?type=Programs&IsSports=true" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
            </div>
            <div is="emby-itemscontainer" class="upcomingSportsItems itemsContainer"></div>
            <br />
@ -53,7 +53,7 @@
        <div id="upcomingKids" class="homePageSection" style="margin-top: 1em;">
            <div>
                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderUpcomingForKids}</h1>
-                <a href="livetvitems.html?type=kids" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
+                <a href="livetvitems.html?type=Programs&IsKids=true" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
            </div>
            <div is="emby-itemscontainer" class="upcomingKidsItems itemsContainer"></div>
            <br />
@ -77,20 +77,37 @@
        <div id="latestRecordings" class="homePageSection hide">
            <div>
                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderLatestRecordings}</h1>
+                <button is="emby-button" type="button" class="raised more mini" data-type="latest">${ButtonMore}</button>
                <button is="emby-button" type="button" class="raised submit mini categorySyncButton" data-category="Latest">
-                    <i class="md-icon">sync</i>
                    <span>${ButtonSync}</span>
                </button>
            </div>
            <div is="emby-itemscontainer" class="recordingItems itemsContainer"></div>
            <br />
        </div>
-        <div id="recordingGroups" class="hide homePageSection">
+        <div id="movieRecordings" class="homePageSection hide">
            <div>
-                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderAllRecordings}</h1>
-                <a href="livetvrecordinglist.html" class="clearLink" style="margin-left: 1em; vertical-align: middle;"><button is="emby-button" type="button" class="raised more mini noIcon">${ButtonMoreItems}</button></a>
+                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderRecordedMovies}</h1>
+                <button is="emby-button" type="button" class="raised more mini" data-type="movies">${ButtonMore}</button>
            </div>
-            <div id="recordingGroupItems"></div>
+            <div is="emby-itemscontainer" class="recordingItems itemsContainer"></div>
+            <br />
+        </div>
+        <div id="episodeRecordings" class="homePageSection hide">
+            <div>
+                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderRecordedEpisodes}</h1>
+                <button is="emby-button" type="button" class="raised more mini" data-type="episodes">${ButtonMore}</button>
+            </div>
+            <div is="emby-itemscontainer" class="recordingItems itemsContainer"></div>
+            <br />
+        </div>
+        <div id="programRecordings" class="homePageSection hide">
+            <div>
+                <h1 class="listHeader" style="display: inline-block; vertical-align: middle;">${HeaderRecordedPrograms}</h1>
+                <button is="emby-button" type="button" class="raised more mini" data-type="programs">${ButtonMore}</button>
+            </div>
+            <div is="emby-itemscontainer" class="recordingItems itemsContainer"></div>
+            <br />
        </div>
    </div>
    <div class="pageTabContent ehsContent" id="scheduleTab" data-index="4">
--- a/dashboard-ui/livetvitems.html
+++ b/dashboard-ui/livetvitems.html
@ -4,7 +4,7 @@
        <div class="viewSettings">
            <div class="listTopPaging"></div>
        </div>
-        <div is="emby-itemscontainer" id="items" class="itemsContainer paddedItemsContainer vertical-wrap"></div>
+        <div is="emby-itemscontainer" id="items" class="itemsContainer vertical-wrap centered"></div>
    </div>

 </div>
--- a/dashboard-ui/scripts/chromecast.js
+++ b/dashboard-ui/scripts/chromecast.js
@ -843,6 +843,7 @@

        self.tryPair = function (target) {

+            castPlayer.launchApp();
            return new Promise(function (resolve, reject) {
                if (castPlayer.deviceState != DEVICE_STATE.ACTIVE && castPlayer.isInitialized) {

@ -866,6 +867,7 @@
        castPlayer = new CastPlayer();

        var registeredPlayer = new chromecastPlayer();
+        window.CCastPlayer = registeredPlayer;
        MediaController.registerPlayer(registeredPlayer);

        // To allow the native android app to override
--- a/dashboard-ui/scripts/dashboardpage.js
+++ b/dashboard-ui/scripts/dashboardpage.js
@ -115,7 +115,12 @@

                page.querySelector('.serverNameHeader').innerHTML = systemInfo.ServerName;

-                $('#appVersionNumber', page).html(Globalize.translate('LabelVersionNumber').replace('{0}', systemInfo.Version));
+                var localizedVersion = Globalize.translate('LabelVersionNumber', systemInfo.Version);
+                if (systemInfo.SystemUpdateLevel && systemInfo.SystemUpdateLevel != 'Release') {
+                    localizedVersion += " " + Globalize.translate('Option' + systemInfo.SystemUpdateLevel).toLowerCase();
+                }
+
+                $('#appVersionNumber', page).html(localizedVersion);

                if (systemInfo.SupportsHttps) {
                    $('#ports', page).html(Globalize.translate('LabelRunningOnPorts', '<b>' + systemInfo.HttpServerPortNumber + '</b>', '<b>' + systemInfo.HttpsPortNumber + '</b>'));
--- a/dashboard-ui/scripts/livetvitems.js
+++ b/dashboard-ui/scripts/livetvitems.js
@ -1,17 +1,22 @@
 define(['cardBuilder', 'emby-itemscontainer'], function (cardBuilder) {

-    var currentDate = new Date();
-    currentDate.setHours(0, 0, 0, 0);
+    return function (view, params) {

        // The base query options
        var query = {
            UserId: Dashboard.getCurrentUserId(),
-        SortBy: "StartDate,SortName",
-        SortOrder: "Ascending",
            StartIndex: 0,
-        HasAired: false
+            Fields: "ChannelInfo"
        };

+        if (params.type == 'Recordings') {
+            query.IsInProgress = false;
+        } else {
+            query.HasAired = false;
+            query.SortBy = 'StartDate,SortName';
+            query.SortOrder = 'Ascending';
+        }
+
        function getSavedQueryKey() {
            return LibraryBrowser.getSavedQueryKey();
        }
@ -20,7 +25,11 @@

            Dashboard.showLoadingMsg();

-        ApiClient.getLiveTvPrograms(query).then(function (result) {
+            var promise = params.type == 'Recordings' ?
+                ApiClient.getLiveTvRecordings(query) :
+                ApiClient.getLiveTvPrograms(query);
+
+            promise.then(function (result) {

                // Scroll back up so they can see the results from the beginning
                window.scrollTo(0, 0);
@ -37,15 +46,16 @@

                html = cardBuilder.getCardsHtml({
                    items: result.Items,
-                shape: query.IsMovie ? 'portrait' : "auto",
+                    shape: query.IsMovie ? 'portrait' : "backdrop",
                    context: 'livetv',
-                showTitle: false,
                    centerText: true,
                    lazy: true,
-                showStartDateIndex: true,
                    overlayText: false,
-                showProgramAirInfo: true,
-                overlayMoreButton: true
+                    showTitle: true,
+                    showParentTitle: query.IsSeries !== false && !query.IsMovie,
+                    showProgramAirInfo: params.type != 'Recordings',
+                    overlayMoreButton: true,
+                    showYear: query.IsMovie && params.type == 'Recordings'
                });

                var elem = page.querySelector('.itemsContainer');
@ -81,7 +91,7 @@
            });
        }

-    pageIdOn('pagebeforeshow', "liveTvItemsPage", function () {
+        view.addEventListener('viewbeforeshow', function () {

            query.ParentId = LibraryMenu.getTopParentId();

@ -94,9 +104,24 @@
                query.StartIndex = 0;
            }

-        query.IsMovie = getParameterByName('type') == 'movies' ? true : null;
-        query.IsSports = getParameterByName('type') == 'sports' ? true : null;
-        query.IsKids = getParameterByName('type') == 'kids' ? true : null;
+            if (params.IsMovie == 'true') {
+                query.IsMovie = true;
+            }
+            else if (params.IsMovie == 'true') {
+                query.IsMovie = false;
+            }
+            if (params.IsSports == 'true') {
+                query.IsSports = true;
+            }
+            else if (params.IsSports == 'true') {
+                query.IsSports = false;
+            }
+            if (params.IsKids == 'true') {
+                query.IsKids = true;
+            }
+            else if (params.IsKids == 'true') {
+                query.IsKids = false;
+            }

            var viewkey = getSavedQueryKey();

@ -104,5 +129,5 @@

            reloadItems(page);
        });
-
+    };
 });
--- a/dashboard-ui/scripts/livetvrecordings.js
+++ b/dashboard-ui/scripts/livetvrecordings.js
@ -1,64 +1,10 @@
 define(['components/categorysyncbuttons', 'cardBuilder', 'scripts/livetvcomponents', 'emby-button', 'listViewStyle', 'emby-itemscontainer'], function (categorysyncbuttons, cardBuilder) {

-    function getRecordingGroupHtml(group) {
-
-        var html = '';
-
-        html += '<div class="listItem">';
-
-        html += '<button type="button" is="emby-button" class="fab mini autoSize blue" item-icon><i class="md-icon">live_tv</i></button>';
-
-        html += '<div class="listItemBody two-line">';
-        html += '<a href="livetvrecordinglist.html?groupid=' + group.Id + '" class="clearLink">';
-
-        html += '<div>';
-        html += group.Name;
-        html += '</div>';
-
-        html += '<div class="secondary">';
-        if (group.RecordingCount == 1) {
-            html += Globalize.translate('ValueItemCount', group.RecordingCount);
-        } else {
-            html += Globalize.translate('ValueItemCountPlural', group.RecordingCount);
-        }
-        html += '</div>';
-
-        html += '</a>';
-        html += '</div>';
-        html += '</div>';
-
-        return html;
-    }
-
-    function renderRecordingGroups(context, groups) {
-
-        if (groups.length) {
-            context.querySelector('#recordingGroups').classList.remove('hide');
-        } else {
-            context.querySelector('#recordingGroups').classList.add('hide');
-        }
-
-        var html = '';
-
-        html += '<div class="paperList">';
-
-        for (var i = 0, length = groups.length; i < length; i++) {
-
-            html += getRecordingGroupHtml(groups[i]);
-        }
-
-        html += '</div>';
-
-        context.querySelector('#recordingGroupItems').innerHTML = html;
-
-        Dashboard.hideLoadingMsg();
-    }
-
    function enableScrollX() {
        return browserInfo.mobile && AppInfo.enableAppLayouts;
    }

-    function renderRecordings(elem, recordings) {
+    function renderRecordings(elem, recordings, cardOptions) {

        if (recordings.length) {
            elem.classList.remove('hide');
@ -76,7 +22,7 @@
            recordingItems.classList.add('vertical-wrap');
        }

-        recordingItems.innerHTML = cardBuilder.getCardsHtml({
+        recordingItems.innerHTML = cardBuilder.getCardsHtml(Object.assign({
            items: recordings,
            shape: (enableScrollX() ? 'autooverflow' : 'auto'),
            showTitle: true,
@ -85,7 +31,7 @@
            lazy: true,
            cardLayout: true,
            allowBottomPadding: !enableScrollX()
-        });
+        }, cardOptions || {}));

        ImageLoader.lazyChildren(recordingItems);
    }
@ -125,15 +71,75 @@

        ApiClient.getLiveTvRecordings({

-            userId: Dashboard.getCurrentUserId(),
-            limit: enableScrollX() ? 12 : 4,
+            UserId: Dashboard.getCurrentUserId(),
+            Limit: enableScrollX() ? 12 : 8,
            IsInProgress: false,
-            Fields: 'CanDelete,PrimaryImageAspectRatio',
+            Fields: 'CanDelete,PrimaryImageAspectRatio,BasicSyncInfo',
            EnableTotalRecordCount: false

        }).then(function (result) {

            renderRecordings(context.querySelector('#latestRecordings'), result.Items);
+
+            Dashboard.hideLoadingMsg();
+        });
+    }
+
+    function renderMovieRecordings(context) {
+
+        ApiClient.getLiveTvRecordings({
+
+            UserId: Dashboard.getCurrentUserId(),
+            Limit: enableScrollX() ? 12 : 8,
+            IsInProgress: false,
+            Fields: 'CanDelete,PrimaryImageAspectRatio,BasicSyncInfo',
+            EnableTotalRecordCount: false,
+            IsMovie: true
+
+        }).then(function (result) {
+
+            renderRecordings(context.querySelector('#movieRecordings'), result.Items, {
+                showYear: true,
+                showParentTitle: false
+            });
+        });
+    }
+
+    function renderEpisodeRecordings(context) {
+
+        ApiClient.getLiveTvRecordings({
+
+            UserId: Dashboard.getCurrentUserId(),
+            Limit: enableScrollX() ? 12 : 8,
+            IsInProgress: false,
+            Fields: 'CanDelete,PrimaryImageAspectRatio,BasicSyncInfo',
+            EnableTotalRecordCount: false,
+            IsSeries: true
+
+        }).then(function (result) {
+
+            renderRecordings(context.querySelector('#episodeRecordings'), result.Items);
+        });
+    }
+
+    function renderProgramRecordings(context) {
+
+        ApiClient.getLiveTvRecordings({
+
+            UserId: Dashboard.getCurrentUserId(),
+            Limit: enableScrollX() ? 12 : 8,
+            IsInProgress: false,
+            Fields: 'CanDelete,PrimaryImageAspectRatio,BasicSyncInfo',
+            EnableTotalRecordCount: false,
+            IsMovie: false,
+            IsSeries: false
+
+        }).then(function (result) {
+
+            renderRecordings(context.querySelector('#programRecordings'), result.Items, {
+                showYear: true,
+                showParentTitle: false
+            });
        });
    }

@ -161,15 +167,31 @@

        renderActiveRecordings(context);
        renderLatestRecordings(context);
+        renderMovieRecordings(context);
+        renderEpisodeRecordings(context);
+        renderProgramRecordings(context);
+    }

-        ApiClient.getLiveTvRecordingGroups({
+    function onMoreClick(e) {

-            userId: Dashboard.getCurrentUserId()
+        var type = this.getAttribute('data-type');

-        }).then(function (result) {
-
-            renderRecordingGroups(context, result.Items);
-        });
+        switch(type) {
+            case 'latest':
+                Dashboard.navigate('livetvitems.html?type=Recordings');
+                break;
+            case 'movies':
+                Dashboard.navigate('livetvitems.html?type=Recordings&IsMovie=true');
+                break;
+            case 'episodes':
+                Dashboard.navigate('livetvitems.html?type=Recordings&IsSeries=true');
+                break;
+            case 'programs':
+                Dashboard.navigate('livetvitems.html?type=Recordings&IsSeries=false&IsMovie=false');
+                break;
+            default:
+                break;
+        }
    }

    return function (view, params, tabContent) {
@ -177,6 +199,11 @@
        var self = this;

        categorysyncbuttons.init(tabContent);
+
+        var moreButtons = tabContent.querySelectorAll('.more');
+        for (var i = 0, length = moreButtons.length; i < length; i++) {
+            moreButtons[i].addEventListener('click', onMoreClick);
+        }
 
        tabContent.querySelector('#activeRecordings .recordingItems').addEventListener('timercancelled', function () {
            reload(tabContent);
        });
--- a/dashboard-ui/scripts/livetvsuggested.js
+++ b/dashboard-ui/scripts/livetvsuggested.js
@ -109,7 +109,8 @@
            lazy: true,
            overlayMoreButton: overlayButton != 'play',
            overlayPlayButton: overlayButton == 'play',
-            allowBottomPadding: !enableScrollX()
+            allowBottomPadding: !enableScrollX(),
+            showProgramAirInfo: true
        });

        var elem = page.querySelector('.' + sectionClass);
--- a/dashboard-ui/scripts/mediacontroller.js
+++ b/dashboard-ui/scripts/mediacontroller.js
@ -1,4 +1,4 @@
-define(['appStorage', 'events'], function (appStorage, events) {
+define(['appStorage', 'events', 'browser'], function (appStorage, events, browser) {

    var currentDisplayInfo;
    var datetime;
@ -103,8 +103,13 @@
                    title: Globalize.translate('HeaderSelectPlayer'),
                    items: menuItems,
                    positionTo: button,
-                    enableHistory: enableHistory !== false,
-                    callback: function (id) {
+
+                    // Unfortunately we can't allow the url to change or chromecast will throw a security error
+                    // Might be able to solve this in the future by moving the dialogs to hashbangs
+                    enableHistory: enableHistory !== false && !browser.chrome,
+                    resolveOnClick: true
+
+                }).then(function (id) {

                    var target = targets.filter(function (t) {
                        return t.id == id;
@ -113,7 +118,7 @@
                    MediaController.trySetActivePlayer(target.playerName, target);

                    mirrorIfEnabled();
-                    }
+
                });
            });
        });
@ -313,6 +318,11 @@
                console.log('Active player: ' + JSON.stringify(currentTargetInfo));

                triggerPlayerChange(player, targetInfo, previousPlayer);
+            }, function () {
+
+                if (currentPairingId == targetInfo.id) {
+                    currentPairingId = null;
+                }
            });
        };

--- a/dashboard-ui/scripts/movies.js
+++ b/dashboard-ui/scripts/movies.js
@ -18,7 +18,7 @@
                        SortOrder: "Ascending",
                        IncludeItemTypes: "Movie",
                        Recursive: true,
-                        Fields: "PrimaryImageAspectRatio,MediaSourceCount,SortName,BasicSyncInfo",
+                        Fields: "PrimaryImageAspectRatio,MediaSourceCount,BasicSyncInfo",
                        ImageTypeLimit: 1,
                        EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
                        StartIndex: 0,
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@ -2137,7 +2137,8 @@ var AppInfo = {};
        defineRoute({
            path: '/livetvitems.html',
            dependencies: [],
-            autoFocus: false
+            autoFocus: false,
+            controller: 'scripts/livetvitems'
        });

        defineRoute({
--- a/dashboard-ui/scripts/tvshows.js
+++ b/dashboard-ui/scripts/tvshows.js
@ -18,7 +18,7 @@
                        SortOrder: "Ascending",
                        IncludeItemTypes: "Series",
                        Recursive: true,
-                        Fields: "PrimaryImageAspectRatio,SortName,BasicSyncInfo",
+                        Fields: "PrimaryImageAspectRatio,BasicSyncInfo",
                        ImageTypeLimit: 1,
                        EnableImageTypes: "Primary,Backdrop,Banner,Thumb",
                        StartIndex: 0,
--- a/dashboard-ui/thirdparty/paper-button-style.css
+++ b/dashboard-ui/thirdparty/paper-button-style.css
@ -20,17 +20,17 @@ button.emby-button.submit {
    color: #52B54B;
 }

-button.emby-button.raised.submit, button.emby-button.raised:not(.subdued):not(.cancel) {
+button.emby-button.raised.submit, button.emby-button.raised:not(.subdued):not(.cancel):not(.more) {
    background: #52B54B;
    color: #fff;
 }

 button.emby-button.more {
-    color: #EC407A;
+    color: #3388cc;
 }

 button.emby-button.raised.more {
-    background: #EC407A;
+    background: #3388cc;
    color: #fff;
 }