diff --git a/dashboard-ui/collections.html b/dashboard-ui/collections.html index 74ec7aacab..c84d7b7e8d 100644 --- a/dashboard-ui/collections.html +++ b/dashboard-ui/collections.html @@ -25,7 +25,15 @@
+
+ +
+
+
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index 98d5d8a8d8..96032e4e6c 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -1254,14 +1254,14 @@ a.itemTag:hover { } .itemsListview .ui-li-aside { - right: 1.5em; + right: 1.3em; font-weight: normal; font-size: 13px; font-family: "Open Sans"; } .itemsListview .ui-li-count { - right: 1.2em; + right: 1em; top: 70%; background: rgba(82, 181, 75, .8); border: 0; diff --git a/dashboard-ui/episodes.html b/dashboard-ui/episodes.html index 042dfced3b..94dedf7e07 100644 --- a/dashboard-ui/episodes.html +++ b/dashboard-ui/episodes.html @@ -20,6 +20,12 @@
+
+ +
diff --git a/dashboard-ui/scripts/episodes.js b/dashboard-ui/scripts/episodes.js index f293e4c338..613adf6ad9 100644 --- a/dashboard-ui/scripts/episodes.js +++ b/dashboard-ui/scripts/episodes.js @@ -1,5 +1,7 @@ (function ($, document) { + var view = LibraryBrowser.getDefaultItemsView('Poster', 'List'); + // The base query options var query = { @@ -7,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "Episode", Recursive: true, - Fields: "SeriesInfo,PrimaryImageAspectRatio", + Fields: "PrimaryImageAspectRatio,SortName", StartIndex: 0, IsMissing: false, IsVirtualUnaired: false @@ -35,15 +37,25 @@ var screenWidth = $(window).width(); - html += LibraryBrowser.getPosterViewHtml({ - items: result.Items, - shape: "backdrop", - showTitle: true, - showParentTitle: true, - overlayText: screenWidth >= 600, - selectionPanel: true, - lazy: true - }); + if (view == "List") { + + html = LibraryBrowser.getListViewHtml({ + items: result.Items, + context: 'tv', + sortBy: query.SortBy + }); + } + else if (view == "Poster") { + html += LibraryBrowser.getPosterViewHtml({ + items: result.Items, + shape: "backdrop", + showTitle: true, + showParentTitle: true, + overlayText: screenWidth >= 600, + selectionPanel: true, + lazy: true + }); + } $('.itemsContainer', page).removeClass('timelineItemsContainer'); @@ -107,6 +119,8 @@ }).checkboxradio('refresh'); + $('#selectView', page).val(view).selectmenu('refresh'); + $('#chkHD', page).checked(query.IsHD == true).checkboxradio('refresh'); $('#chkSD', page).checked(query.IsHD == false).checkboxradio('refresh'); @@ -272,8 +286,18 @@ }); + $('#selectView', this).on('change', function () { + + view = this.value; + + reloadItems(page); + + LibraryBrowser.saveViewSetting(getSavedQueryKey(), view); + }); + }).on('pagebeforeshow', "#episodesPage", function () { + var page = this; query.ParentId = LibraryMenu.getTopParentId(); var limit = LibraryBrowser.getDefaultPageSize(); @@ -284,7 +308,9 @@ query.StartIndex = 0; } - LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query); + var viewkey = getSavedQueryKey(); + + LibraryBrowser.loadSavedQueryValues(viewkey, query); var filters = getParameterByName('filters'); if (filters) { @@ -301,7 +327,14 @@ query.SortOrder = sortorder; } - reloadItems(this); + LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) { + + if (val) { + $('#selectView', page).val(val).selectmenu('refresh').trigger('change'); + } else { + reloadItems(page); + } + }); }).on('pageshow', "#episodesPage", function () { diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index 6d70f3bfce..834276be96 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -24,6 +24,12 @@ return 20; }, + getDefaultItemsView: function (view, mobileView) { + + return $.browser.mobile ? mobileView : view; + + }, + loadSavedQueryValues: function (key, query) { var values = localStorage.getItem(key + '_' + Dashboard.getCurrentUserId()); @@ -492,6 +498,65 @@ return ApiClient.getScaledImageUrl(item.Id || item.ItemId, options); }, + + getListViewIndex: function(item, sortBy) { + + sortBy = (sortBy || '').toLowerCase(); + + if (sortBy.indexOf('sortname') == 0) { + + if (item.Type == 'Episode') return ''; + + // SortName + var name = (item.SortName || item.Name)[0]; + + if (!isNaN(name)) { + return '#'; + } + return name.toUpperCase(); + } + if (sortBy.indexOf('officialrating') == 0) { + + return item.OfficialRating || 'Unrated'; + } + if (sortBy.indexOf('communityrating') == 0) { + + if (item.CommunityRating == null) { + return 'Unrated'; + } + + return Math.floor(item.CommunityRating); + } + if (sortBy.indexOf('criticrating') == 0) { + + if (item.CriticRating == null) { + return 'Unrated'; + } + + return Math.floor(item.CriticRating); + } + if (sortBy.indexOf('metascore') == 0) { + + if (item.Metascore == null) { + return 'Unrated'; + } + + return Math.floor(item.Metascore); + } + if (sortBy.indexOf('albumartist') == 0) { + + // SortName + if (!item.AlbumArtist) return ''; + + var albumartist = item.AlbumArtist[0]; + + if (!isNaN(albumartist)) { + return '#'; + } + return albumartist.toUpperCase(); + } + return ''; + }, getListViewHtml: function (options) { @@ -499,19 +564,36 @@ outerHtml += ''; + index++; return outerHtml; }, diff --git a/dashboard-ui/scripts/librarylist.js b/dashboard-ui/scripts/librarylist.js index 3f66c8f2f9..c988ddc2b8 100644 --- a/dashboard-ui/scripts/librarylist.js +++ b/dashboard-ui/scripts/librarylist.js @@ -353,8 +353,10 @@ if (latestItem.ImageTags.Primary) { + // Scaling 400w episode images to 80 doesn't turn out very well + var width = latestItem.Type == 'Episode' ? 160 : 80; imgUrl = ApiClient.getScaledImageUrl(latestItem.Id, { - width: 80, + width: width, tag: latestItem.ImageTags.Primary, type: "Primary", index: 0 diff --git a/dashboard-ui/scripts/moviecollections.js b/dashboard-ui/scripts/moviecollections.js index 9b6e5147d7..a9f4336b3d 100644 --- a/dashboard-ui/scripts/moviecollections.js +++ b/dashboard-ui/scripts/moviecollections.js @@ -1,5 +1,7 @@ (function ($, document) { + var view = LibraryBrowser.getDefaultItemsView('Poster', 'List'); + // The base query options var query = { @@ -7,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "BoxSet", Recursive: true, - Fields: "PrimaryImageAspectRatio", + Fields: "PrimaryImageAspectRatio,SortName", StartIndex: 0 }; @@ -33,17 +35,28 @@ if (result.TotalRecordCount) { - html = LibraryBrowser.getPosterViewHtml({ - items: result.Items, - shape: "portrait", - context: 'movies', - showTitle: true, - centerText: true, - lazy: true - }); + if (view == "List") { + + html = LibraryBrowser.getListViewHtml({ + items: result.Items, + context: 'movies', + sortBy: query.SortBy + }); + } + else if (view == "Poster") { + html = LibraryBrowser.getPosterViewHtml({ + items: result.Items, + shape: "portrait", + context: 'movies', + showTitle: true, + centerText: true, + lazy: true + }); + } html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); $('.noItemsMessage', page).hide(); + } else { $('.noItemsMessage', page).show(); @@ -97,6 +110,8 @@ }).checkboxradio('refresh'); + $('#selectView', page).val(view).selectmenu('refresh'); + $('#chkTrailer', page).checked(query.HasTrailer == true).checkboxradio('refresh'); $('#chkThemeSong', page).checked(query.HasThemeSong == true).checkboxradio('refresh'); $('#chkThemeVideo', page).checked(query.HasThemeVideo == true).checkboxradio('refresh'); @@ -173,6 +188,15 @@ reloadItems(page); }); + $('#selectView', this).on('change', function () { + + view = this.value; + + reloadItems(page); + + LibraryBrowser.saveViewSetting(getSavedQueryKey(), view); + }); + }).on('pagebeforeshow', "#boxsetsPage", function () { var page = this; @@ -197,9 +221,18 @@ query.StartIndex = 0; } - LibraryBrowser.loadSavedQueryValues(getSavedQueryKey(), query); + var viewkey = getSavedQueryKey(); - reloadItems(this); + LibraryBrowser.loadSavedQueryValues(viewkey, query); + + LibraryBrowser.getSavedViewSetting(viewkey).done(function (val) { + + if (val) { + $('#selectView', page).val(val).selectmenu('refresh').trigger('change'); + } else { + reloadItems(page); + } + }); }).on('pageshow', "#boxsetsPage", function () { diff --git a/dashboard-ui/scripts/movies.js b/dashboard-ui/scripts/movies.js index c3170036af..5be7e7ab4d 100644 --- a/dashboard-ui/scripts/movies.js +++ b/dashboard-ui/scripts/movies.js @@ -1,6 +1,6 @@ (function ($, document) { - var view = "Poster"; + var view = LibraryBrowser.getDefaultItemsView('Poster', 'List'); // The base query options var query = { @@ -9,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "Movie", Recursive: true, - Fields: "PrimaryImageAspectRatio", + Fields: "PrimaryImageAspectRatio,SortName", StartIndex: 0 }; @@ -59,7 +59,8 @@ html = LibraryBrowser.getListViewHtml({ items: result.Items, - context: 'movies' + context: 'movies', + sortBy: query.SortBy }); $('.itemsContainer', page).removeClass('timelineItemsContainer'); } diff --git a/dashboard-ui/scripts/musicalbums.js b/dashboard-ui/scripts/musicalbums.js index 8c1b220dfb..c90e3d58f2 100644 --- a/dashboard-ui/scripts/musicalbums.js +++ b/dashboard-ui/scripts/musicalbums.js @@ -1,6 +1,6 @@ (function ($, document) { - var view = "Poster"; + var view = LibraryBrowser.getDefaultItemsView('Poster', 'List'); // The base query options var query = { @@ -9,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "MusicAlbum", Recursive: true, - Fields: "PrimaryImageAspectRatio", + Fields: "PrimaryImageAspectRatio,SortName", StartIndex: 0 }; @@ -48,7 +48,8 @@ html = LibraryBrowser.getListViewHtml({ items: result.Items, - context: 'music' + context: 'music', + sortBy: query.SortBy }); $('.itemsContainer', page).removeClass('timelineItemsContainer'); } diff --git a/dashboard-ui/scripts/tvshows.js b/dashboard-ui/scripts/tvshows.js index 09f99c70ea..0c2b69ba49 100644 --- a/dashboard-ui/scripts/tvshows.js +++ b/dashboard-ui/scripts/tvshows.js @@ -1,6 +1,6 @@ (function ($, document) { - var view = "Thumb"; + var view = LibraryBrowser.getDefaultItemsView('Thumb', 'List'); // The base query options var query = { @@ -9,7 +9,7 @@ SortOrder: "Ascending", IncludeItemTypes: "Series", Recursive: true, - Fields: "SeriesInfo,PrimaryImageAspectRatio", + Fields: "PrimaryImageAspectRatio,SortName", StartIndex: 0 }; @@ -72,7 +72,8 @@ html = LibraryBrowser.getListViewHtml({ items: result.Items, - context: 'tv' + context: 'tv', + sortBy: query.SortBy }); $('.itemsContainer', page).removeClass('timelineItemsContainer'); }