add new guide settings

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

@@ -14,12 +14,12 @@
   },
   "devDependencies": {},
   "ignore": [],
-  "version": "1.4.275",
+  "version": "1.4.277",
-  "_release": "1.4.275",
+  "_release": "1.4.277",
   "_resolution": {
     "type": "version",
-    "tag": "1.4.275",
+    "tag": "1.4.277",
-    "commit": "0cf87e2fcb9f535b73ecdba2d961ceb64e1c5e4f"
+    "commit": "721497f3b6225061614ee301e8b38a5eb5f34eb2"
   },
   "_source": "https://github.com/MediaBrowser/emby-webcomponents.git",
   "_target": "^1.2.1",

dashboard-ui/bower_components/emby-webcomponents/cardbuilder/card.css

@@ -511,7 +511,6 @@
     }
 }
 
-
 @media all and (min-width: 1600px) {
 
     .portraitCard-scalable {
@@ -521,6 +520,10 @@
     .smallBackdropCard-scalable {
         width: 12.5%;
     }
+
+    .backdropCard-scalable {
+        width: 20%;
+    }
 }
 
 @media all and (min-width: 1800px) {
@@ -582,3 +585,11 @@
 .layout-tv .personCard-scalable {
     width: 14.285714285714285714285714285714%;
 }
+
+
+@media all and (min-width: 1600px) {
+
+    .layout-tv .backdropCard-scalable {
+        width: 25%;
+    }
+}

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

@@ -43,13 +43,13 @@
     height: 16px;
     margin: 0;
     cursor: pointer;
-    border: 2px solid rgba(0,0,0, 0.54);
+    border: 2px solid currentcolor;
     border-radius: 50%;
     z-index: 2;
 }
 
 .mdl-radio__button:checked + .mdl-radio__label + .mdl-radio__outer-circle {
-    border: 2px solid rgb(63,81,181);
+    border: 2px solid rgb(82, 181, 75);
 }
 
 .mdl-radio__button:disabled + .mdl-radio__label + .mdl-radio__outer-circle {
@@ -75,7 +75,7 @@
     -webkit-transform: scale3d(0, 0, 0);
     transform: scale3d(0, 0, 0);
     border-radius: 50%;
-    background: rgb(63,81,181);
+    background: rgb(82, 181, 75);
 }
 
 .mdl-radio__button:checked + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle {
@@ -89,7 +89,7 @@
 }
 
 .mdl-radio__button:focus + .mdl-radio__label + .mdl-radio__outer-circle + .mdl-radio__inner-circle {
-    box-shadow: 0 0 0px 10px rgba(0, 0, 0, 0.1);
+    box-shadow: 0 0 0px 10px rgba(82, 181, 75, 0.26);
 }
 
 .mdl-radio__label {

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

@@ -1,21 +1,34 @@
-define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectionManager', 'require', 'loading', 'scrollHelper', 'emby-checkbox', 'css!./../formdialog', 'material-icons'], function (dialogHelper, globalize, userSettings, layoutManager, connectionManager, require, loading, scrollHelper) {
+define(['dialogHelper', 'globalize', 'userSettings', 'layoutManager', 'connectionManager', 'require', 'loading', 'scrollHelper', 'emby-checkbox', 'emby-radio', 'css!./../formdialog', 'material-icons'], function (dialogHelper, globalize, userSettings, layoutManager, connectionManager, require, loading, scrollHelper) {
 
     function save(context) {
 
+        var i, length;
+
         var chkIndicators = context.querySelectorAll('.chkIndicator');
-        for (var i = 0, length = chkIndicators.length; i < length; i++) {
+        for (i = 0, length = chkIndicators.length; i < length; i++) {
 
             var type = chkIndicators[i].getAttribute('data-type');
             userSettings.set('guide-indicator-' + type, chkIndicators[i].checked);
         }
 
         userSettings.set('guide-colorcodedbackgrounds', context.querySelector('.chkColorCodedBackgrounds').checked);
+        userSettings.set('livetv-favoritechannelsattop', context.querySelector('.chkFavoriteChannelsAtTop').checked);
+
+        var sortBys = context.querySelectorAll('.chkSortOrder');
+        for (i = 0, length = sortBys.length; i < length; i++) {
+            if (sortBys[i].checked) {
+                userSettings.set('livetv-channelorder', sortBys[i].value);
+                break;
+            }
+        }
     }
 
     function load(context) {
 
+        var i, length;
+
         var chkIndicators = context.querySelectorAll('.chkIndicator');
-        for (var i = 0, length = chkIndicators.length; i < length; i++) {
+        for (i = 0, length = chkIndicators.length; i < length; i++) {
 
             var type = chkIndicators[i].getAttribute('data-type');
 
@@ -27,6 +40,28 @@
         }
 
         context.querySelector('.chkColorCodedBackgrounds').checked = userSettings.get('guide-colorcodedbackgrounds') == 'true';
+        context.querySelector('.chkFavoriteChannelsAtTop').checked = userSettings.get('livetv-favoritechannelsattop') != 'false';
+
+        var sortByValue = userSettings.get('livetv-channelorder') || 'DatePlayed';
+
+        var sortBys = context.querySelectorAll('.chkSortOrder');
+        for (i = 0, length = sortBys.length; i < length; i++) {
+            sortBys[i].checked = sortBys[i].value == sortByValue;
+        }
+    }
+
+    function onSortByChange() {
+        var newValue = this.value;
+        if (this.checked) {
+            var changed = options.query.SortBy != newValue;
+
+            options.query.SortBy = newValue.replace('_', ',');
+            options.query.StartIndex = 0;
+
+            if (options.callback && changed) {
+                options.callback();
+            }
+        }
     }
 
     function showEditor() {

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

@@ -7,31 +7,39 @@
 <div class="formDialogContent smoothScrollY">
     <form class="dialogContentInner dialog-content-centered" style="padding-top:2em;">
 
+        <h3 class="checkboxListLabel">${SortChannelsBy}</h3>
+        <label class="radio-label-block"><input type="radio" is="emby-radio" name="ChannelSortOrder" value="Number" class="chkSortOrder" /><span>${ChannelNumber}</span></label>
+        <label class="radio-label-block"><input type="radio" is="emby-radio" name="ChannelSortOrder" value="DatePlayed" class="chkSortOrder" /><span>${RecentlyWatched}</span></label>
+        <br />
+        <label class="checkboxContainer">
+            <input type="checkbox" is="emby-checkbox" class="chkFavoriteChannelsAtTop" />
+            <span>${PlaceFavoriteChannelsAtBeginning}</span>
+        </label>
         <h3 class="checkboxListLabel">${ShowIndicatorsFor}</h3>
         <div class="checkboxList">
             <label>
-                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="hd"/>
+                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="hd" />
                 <span>${HDPrograms}</span>
             </label>
             <label>
-                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="live" data-default="true"/>
+                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="live" data-default="true" />
                 <span>${LiveBroadcasts}</span>
             </label>
             <label>
-                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="new"/>
+                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="new" />
                 <span>${NewEpisodes}</span>
             </label>
             <label>
-                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="premiere" data-default="true"/>
+                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="premiere" data-default="true" />
                 <span>${Premieres}</span>
             </label>
             <label>
-                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="repeat"/>
+                <input type="checkbox" is="emby-checkbox" class="chkIndicator" data-type="repeat" />
                 <span>${RepeatEpisodes}</span>
             </label>
         </div>
-        <br/>
+        <br />
-        <label>
+        <label class="checkboxContainer">
             <input type="checkbox" is="emby-checkbox" class="chkColorCodedBackgrounds" />
             <span>${EnableColorCodedBackgrounds}</span>
         </label>

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

@@ -158,7 +158,7 @@
             var channelQuery = {
 
                 StartIndex: 0,
-                EnableFavoriteSorting: true
+                EnableFavoriteSorting: userSettings.get('livetv-favoritechannelsattop') !== 'false'
             };
 
             channelQuery.UserId = apiClient.getCurrentUserId();
@@ -206,6 +206,14 @@
                     }
                 }
 
+                if (userSettings.get('livetv-channelorder') == 'Number') {
+                    channelQuery.SortBy = "SortName";
+                    channelQuery.SortOrder = "Ascending";
+                } else {
+                    channelQuery.SortBy = "DatePlayed";
+                    channelQuery.SortOrder = "Descending";
+                }
+
                 var date = newStartDate;
                 // Add one second to avoid getting programs that are just ending
                 date = new Date(date.getTime() + 1000);

dashboard-ui/bower_components/emby-webcomponents/strings/en-US.json

@@ -313,5 +313,9 @@
   "News": "News",
   "Movies": "Movies",
   "Kids": "Kids",
-  "EnableColorCodedBackgrounds": "Enable color coded backgrounds"
+  "EnableColorCodedBackgrounds": "Enable color coded backgrounds",
+  "SortChannelsBy": "Sort channels by:",
+  "RecentlyWatched": "Recently watched",
+  "ChannelNumber": "Channel number",
+  "PlaceFavoriteChannelsAtBeginning": "Place favorite channels at the beginning"
 }