diff --git a/dashboard-ui/collections.html b/dashboard-ui/collections.html index e91dc94146..586ff01c64 100644 --- a/dashboard-ui/collections.html +++ b/dashboard-ui/collections.html @@ -20,93 +20,6 @@ - -
-
- -
- ${TabView} - ${TabSort} - ${TabFilter} -
- -
- -
- - -
-
-
- - -
- -
-
-
- ${HeaderFilters} - - - - - - - - -
- -
- ${LabelFeatures} - - - - - - - - - - -
- -
-
-
- - ${HeaderSortBy} - - - - - - - - - - -
- -
- - ${HeaderSortOrder} - - - - - - - -
-
-
-
diff --git a/dashboard-ui/movies.html b/dashboard-ui/movies.html index 83220cb680..79ac95e44f 100644 --- a/dashboard-ui/movies.html +++ b/dashboard-ui/movies.html @@ -4,7 +4,7 @@ Emby -
+
@@ -101,7 +101,7 @@  
-
+
@@ -141,92 +141,6 @@
-
-
- -
- ${TabView} - ${TabSort} - ${TabFilter} -
- -
- -
- - -
-
-
- - -
- -
-
-
- ${HeaderFilters} - - - - - - - - -
- -
- ${LabelFeatures} - - - - - - - - - - -
- -
-
-
- - ${HeaderSortBy} - - - - - - - - - - -
- -
- - ${HeaderSortOrder} - - - - - - - -
-
-
-
@@ -503,49 +417,6 @@
-
-
- -
- ${TabView} - ${TabFilter} -
- -
- -
- - -
-
-
- - -
- -
-
-
- - ${HeaderFilters} - - - - - - - - - -
- -
-
-
@@ -586,40 +457,6 @@
-
-
- -
- ${TabView} - ${TabFilter} -
- -
- -
- - -
- -
-
-
- - ${HeaderFilters} - - - - - - - - - -
- -
-
-
diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index 64872b5d2b..c781d7a84c 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -15,10 +15,7 @@ return defaultValue; } - // Chrome seems to have virtualization built-in and can handle large lists easily - var isChrome = $.browser.chrome; - - return isChrome ? 200 : 100; + return 100; }, getDefaultItemsView: function (view, mobileView) { @@ -2359,6 +2356,34 @@ return [20, 50, 100, 200, 300, 400, 500]; }, + showLayoutMenu: function (button, currentLayout) { + + // Add banner and list once all screens support them + var views = ['Poster', 'PosterCard', 'Thumb', 'ThumbCard']; + + var menuItems = views.map(function (v) { + return { + name: Globalize.translate('Option' + v), + id: v, + ironIcon: currentLayout == v ? 'check' : null + }; + }); + + require(['actionsheet'], function () { + + ActionSheetElement.show({ + items: menuItems, + positionTo: button, + callback: function (id) { + + $(button).trigger('layoutchange', [id]); + } + }); + + }); + + }, + getQueryPagingHtml: function (options) { var startIndex = options.startIndex; @@ -2391,7 +2416,7 @@ html += ''; } - if (showControls || options.viewButton || options.addSelectionButton || options.additionalButtonsHtml) { + if (showControls || options.viewButton || options.addLayoutButton || options.addSelectionButton || options.additionalButtonsHtml) { html += '
'; @@ -2407,6 +2432,11 @@ html += ''; } + if (options.addLayoutButton) { + + html += ''; + } + if (options.viewButton) { //html += ''; diff --git a/dashboard-ui/scripts/moviecollections.js b/dashboard-ui/scripts/moviecollections.js index 2059e4dae7..07f61ef772 100644 --- a/dashboard-ui/scripts/moviecollections.js +++ b/dashboard-ui/scripts/moviecollections.js @@ -36,7 +36,7 @@ return getWindowUrl(); } - function reloadItems(page, viewPanel) { + function reloadItems(page) { Dashboard.showLoadingMsg(); @@ -54,22 +54,25 @@ var html = ''; + var view = getPageData().view; + $('.listTopPaging', page).html(LibraryBrowser.getQueryPagingHtml({ startIndex: query.StartIndex, limit: query.Limit, totalRecordCount: result.TotalRecordCount, - viewButton: true, + viewButton: false, showLimit: false, - viewPanelClass: 'collectionViewPanel' + updatePageSizeSetting: false, + addLayoutButton: true, + currentLayout: view })).trigger('create'); - updateFilterControls(page, viewPanel); + updateFilterControls(page); var trigger = false; if (result.TotalRecordCount) { - var view = getPageData().view; var context = getParameterByName('context'); if (view == "List") { @@ -143,12 +146,17 @@ $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; - reloadItems(page, viewPanel); + reloadItems(page); }); $('.btnPreviousPage', page).on('click', function () { query.StartIndex -= query.Limit; - reloadItems(page, viewPanel); + reloadItems(page); + }); + + $('.btnChangeLayout', page).on('layoutchange', function (e, layout) { + getPageData().view = layout; + reloadItems(page); }); LibraryBrowser.saveQueryValues(getSavedQueryKey(), query); @@ -157,135 +165,40 @@ }); } - function updateFilterControls(tabContent, viewPanel) { + function updateFilterControls(tabContent) { - var query = getQuery(); - // Reset form values using the last used query - $('.radioSortBy', viewPanel).each(function () { - - this.checked = (query.SortBy || '').toLowerCase() == this.getAttribute('data-sortby').toLowerCase(); - - }).checkboxradio('refresh'); - - $('.radioSortOrder', viewPanel).each(function () { - - this.checked = (query.SortOrder || '').toLowerCase() == this.getAttribute('data-sortorder').toLowerCase(); - - }).checkboxradio('refresh'); - - $('.chkStandardFilter', viewPanel).each(function () { - - var filters = "," + (query.Filters || ""); - var filterName = this.getAttribute('data-filter'); - - this.checked = filters.indexOf(',' + filterName) != -1; - - }).checkboxradio('refresh'); - - $('select.selectView', viewPanel).val(getPageData().view).selectmenu('refresh'); - - $('.chkTrailer', viewPanel).checked(query.HasTrailer == true).checkboxradio('refresh'); - $('.chkThemeSong', viewPanel).checked(query.HasThemeSong == true).checkboxradio('refresh'); - $('.chkThemeVideo', viewPanel).checked(query.HasThemeVideo == true).checkboxradio('refresh'); - - $('select.selectPageSize', viewPanel).val(query.Limit).selectmenu('refresh'); } - function initPage(tabContent, viewPanel) { + function initPage(tabContent) { - $('.radioSortBy', viewPanel).on('click', function () { - var query = getQuery(); - query.SortBy = this.getAttribute('data-sortby'); - reloadItems(tabContent, viewPanel); - }); - - $('.radioSortOrder', viewPanel).on('click', function () { - var query = getQuery(); - query.SortOrder = this.getAttribute('data-sortorder'); - reloadItems(tabContent, viewPanel); - }); - - $('.chkStandardFilter', viewPanel).on('change', function () { - - var query = getQuery(); - var filterName = this.getAttribute('data-filter'); - var filters = query.Filters || ""; - - filters = (',' + filters).replace(',' + filterName, '').substring(1); - - if (this.checked) { - filters = filters ? (filters + ',' + filterName) : filterName; - } - - query.StartIndex = 0; - query.Filters = filters; - - reloadItems(tabContent, viewPanel); - }); - - $('.chkTrailer', viewPanel).on('change', function () { - - var query = getQuery(); - query.StartIndex = 0; - query.HasTrailer = this.checked ? true : null; - - reloadItems(tabContent, viewPanel); - }); - - $('.chkThemeSong', viewPanel).on('change', function () { - - var query = getQuery(); - query.StartIndex = 0; - query.HasThemeSong = this.checked ? true : null; - - reloadItems(tabContent, viewPanel); - }); - - $('.chkThemeVideo', viewPanel).on('change', function () { - - var query = getQuery(); - query.StartIndex = 0; - query.HasThemeVideo = this.checked ? true : null; - - reloadItems(tabContent, viewPanel); - }); - - $('select.selectView', viewPanel).on('change', function () { + $('select.selectView').on('change', function () { var newView = this.value; getPageData().view = newView; - reloadItems(tabContent, viewPanel); + reloadItems(tabContent); LibraryBrowser.saveViewSetting(getSavedQueryKey(), newView); }); - - $('select.selectPageSize', viewPanel).on('change', function () { - var query = getQuery(); - query.Limit = parseInt(this.value); - query.StartIndex = 0; - reloadItems(tabContent, viewPanel); - }); } - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; var index = 3; - var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); - var viewPanel = $('.collectionViewPanel', page); $(page.querySelector('neon-animated-pages')).on('tabchange', function () { if (parseInt(this.selected) == index) { + var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); + if (!tabContent.initComplete) { - initPage(tabContent, viewPanel); + initPage(tabContent); tabContent.initComplete = true; } if (LibraryBrowser.needsRefresh(tabContent)) { - reloadItems(tabContent, viewPanel); - updateFilterControls(viewPanel); + reloadItems(tabContent); } } }); @@ -296,19 +209,17 @@ var page = this; var content = page; - var viewPanel = page.querySelector('.viewPanel'); - initPage(content, viewPanel); + initPage(content); }).on('pagebeforeshowready', "#boxsetsPage", function () { var page = this; var content = page; - var viewPanel = page.querySelector('.viewPanel'); - reloadItems(content, viewPanel); - updateFilterControls(content, viewPanel); + reloadItems(content); + updateFilterControls(content); }); })(jQuery, document); \ No newline at end of file diff --git a/dashboard-ui/scripts/moviegenres.js b/dashboard-ui/scripts/moviegenres.js index ccc5dd71cf..53817df11b 100644 --- a/dashboard-ui/scripts/moviegenres.js +++ b/dashboard-ui/scripts/moviegenres.js @@ -35,7 +35,7 @@ return getWindowUrl(); } - function reloadItems(page, viewPanel) { + function reloadItems(page) { Dashboard.showLoadingMsg(); @@ -47,18 +47,20 @@ var html = ''; + var view = getPageData().view; $('.listTopPaging', page).html(LibraryBrowser.getQueryPagingHtml({ startIndex: query.StartIndex, limit: query.Limit, totalRecordCount: result.TotalRecordCount, - viewButton: true, + viewButton: false, showLimit: false, - viewPanelClass: 'genreViewPanel' + updatePageSizeSetting: false, + addLayoutButton: true, + currentLayout: view })).trigger('create'); updateFilterControls(page); - var view = getPageData().view; if (view == "Thumb") { html = LibraryBrowser.getPosterViewHtml({ @@ -112,12 +114,17 @@ $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; - reloadItems(page, viewPanel); + reloadItems(page); }); $('.btnPreviousPage', page).on('click', function () { query.StartIndex -= query.Limit; - reloadItems(page, viewPanel); + reloadItems(page); + }); + + $('.btnChangeLayout', page).on('layoutchange', function (e, layout) { + getPageData().view = layout; + reloadItems(page); }); LibraryBrowser.saveQueryValues(getSavedQueryKey(), query); @@ -128,67 +135,25 @@ function updateFilterControls(page) { - var query = getQuery(); - $('select.selectPageSize', page).val(query.Limit).selectmenu('refresh'); - $('select.selectView', page).val(getPageData().view).selectmenu('refresh'); } - function initPage(tabContent, viewPanel) { - - $('.chkStandardFilter', viewPanel).on('change', function () { - - var query = getQuery(); - var filterName = this.getAttribute('data-filter'); - var filters = query.Filters || ""; - - filters = (',' + filters).replace(',' + filterName, '').substring(1); - - if (this.checked) { - filters = filters ? (filters + ',' + filterName) : filterName; - } - - query.StartIndex = 0; - query.Filters = filters; - - reloadItems(tabContent, viewPanel); - }); - - $('select.selectPageSize', viewPanel).on('change', function () { - var query = getQuery(); - query.Limit = parseInt(this.value); - query.StartIndex = 0; - reloadItems(tabContent, viewPanel); - }); - - $('select.selectView', viewPanel).on('change', function () { - - var newView = this.value; - getPageData().view = newView; - - reloadItems(tabContent, viewPanel); - LibraryBrowser.saveViewSetting(getSavedQueryKey(), newView); - }); - } - - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; var index = 4; - var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); - var viewPanel = $('.genreViewPanel', page); $(page.querySelector('neon-animated-pages')).on('tabchange', function () { if (parseInt(this.selected) == index) { + var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); if (!tabContent.initComplete) { - initPage(tabContent, viewPanel); tabContent.initComplete = true; } if (LibraryBrowser.needsRefresh(tabContent)) { - reloadItems(tabContent, viewPanel); - updateFilterControls(viewPanel); + reloadItems(tabContent); + updateFilterControls(); } } }); diff --git a/dashboard-ui/scripts/moviepeople.js b/dashboard-ui/scripts/moviepeople.js index 0039505a68..6c3804d96b 100644 --- a/dashboard-ui/scripts/moviepeople.js +++ b/dashboard-ui/scripts/moviepeople.js @@ -159,17 +159,17 @@ }); } - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; var index = 5; - var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); - var viewPanel = $('.peopleViewPanel', page); $(page.querySelector('neon-animated-pages')).on('tabchange', function () { if (parseInt(this.selected) == index) { + var viewPanel = page.querySelector('.peopleViewPanel'); + var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); if (!tabContent.initComplete) { initPage(tabContent, viewPanel); tabContent.initComplete = true; diff --git a/dashboard-ui/scripts/movies.js b/dashboard-ui/scripts/movies.js index 4dbed508b1..134d110b54 100644 --- a/dashboard-ui/scripts/movies.js +++ b/dashboard-ui/scripts/movies.js @@ -442,16 +442,16 @@ }); } - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; var index = 1; - var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); - var viewPanel = $('.movieViewPanel', page); $(page.querySelector('neon-animated-pages')).on('tabchange', function () { if (parseInt(this.selected) == index) { + var viewPanel = page.querySelector('.viewPanel'); + var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); if (!tabContent.initComplete) { initPage(tabContent, viewPanel); tabContent.initComplete = true; diff --git a/dashboard-ui/scripts/moviesrecommended.js b/dashboard-ui/scripts/moviesrecommended.js index d925d87bdd..9c8a94977b 100644 --- a/dashboard-ui/scripts/moviesrecommended.js +++ b/dashboard-ui/scripts/moviesrecommended.js @@ -268,7 +268,7 @@ } } - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; @@ -299,7 +299,7 @@ loadTab(page, parseInt(this.selected)); }); - }).on('pageshowready', "#moviesRecommendedPage", function () { + }).on('pageshowready', "#moviesPage", function () { var page = this; diff --git a/dashboard-ui/scripts/moviestudios.js b/dashboard-ui/scripts/moviestudios.js index 16d2c871b8..0e4e40e310 100644 --- a/dashboard-ui/scripts/moviestudios.js +++ b/dashboard-ui/scripts/moviestudios.js @@ -32,7 +32,7 @@ return getWindowUrl(); } - function reloadItems(page, viewPanel) { + function reloadItems(page) { Dashboard.showLoadingMsg(); @@ -48,14 +48,14 @@ startIndex: query.StartIndex, limit: query.Limit, totalRecordCount: result.TotalRecordCount, - viewButton: true, - showLimit: false, - viewPanelClass: 'studioViewPanel' + viewButton: false, + updatePageSizeSetting: false, + showLimit: false }); page.querySelector('.listTopPaging').innerHTML = pagingHtml; - updateFilterControls(viewPanel); + updateFilterControls(); html = LibraryBrowser.getPosterViewHtml({ items: result.Items, @@ -73,12 +73,12 @@ $('.btnNextPage', page).on('click', function () { query.StartIndex += query.Limit; - reloadItems(page, viewPanel); + reloadItems(page); }); $('.btnPreviousPage', page).on('click', function () { query.StartIndex -= query.Limit; - reloadItems(page, viewPanel); + reloadItems(page); }); LibraryBrowser.saveQueryValues(getSavedQueryKey(), query); @@ -88,57 +88,25 @@ } function updateFilterControls(page) { - var query = getQuery(); - $('select.selectPageSize', page).val(query.Limit).selectmenu('refresh'); } - function initPage(tabContent, viewPanel) { - - $('.chkStandardFilter', viewPanel).on('change', function () { - - var query = getQuery(); - var filterName = this.getAttribute('data-filter'); - var filters = query.Filters || ""; - - filters = (',' + filters).replace(',' + filterName, '').substring(1); - - if (this.checked) { - filters = filters ? (filters + ',' + filterName) : filterName; - } - - query.StartIndex = 0; - query.Filters = filters; - - reloadItems(tabContent, viewPanel); - }); - - $('.selectPageSize', viewPanel).on('change', function () { - var query = getQuery(); - query.Limit = parseInt(this.value); - query.StartIndex = 0; - reloadItems(tabContent, viewPanel); - }); - } - - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; var index = 6; - var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); - var viewPanel = $('.studioViewPanel', page); $(page.querySelector('neon-animated-pages')).on('tabchange', function () { if (parseInt(this.selected) == index) { + var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); if (!tabContent.initComplete) { - initPage(tabContent, viewPanel); tabContent.initComplete = true; } if (LibraryBrowser.needsRefresh(tabContent)) { - reloadItems(tabContent, viewPanel); - updateFilterControls(viewPanel); + reloadItems(tabContent); + updateFilterControls(); } } }); diff --git a/dashboard-ui/scripts/movietrailers.js b/dashboard-ui/scripts/movietrailers.js index 8887b601dc..5bf9f3daf9 100644 --- a/dashboard-ui/scripts/movietrailers.js +++ b/dashboard-ui/scripts/movietrailers.js @@ -185,17 +185,17 @@ }); } - $(document).on('pageinitdepends', "#moviesRecommendedPage", function () { + $(document).on('pageinitdepends', "#moviesPage", function () { var page = this; var index = 2; - var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); - var viewPanel = $('.trailerViewPanel', page); $(page.querySelector('neon-animated-pages')).on('tabchange', function () { if (parseInt(this.selected) == index) { + var viewPanel = page.querySelector('.trailerViewPanel'); + var tabContent = page.querySelector('.pageTabContent[data-index=\'' + index + '\']'); if (!tabContent.initComplete) { initPage(page, tabContent, viewPanel); tabContent.initComplete = true; diff --git a/dashboard-ui/strings/javascript/javascript.json b/dashboard-ui/strings/javascript/javascript.json index 7fed92bf14..22a1fd6013 100644 --- a/dashboard-ui/strings/javascript/javascript.json +++ b/dashboard-ui/strings/javascript/javascript.json @@ -838,5 +838,12 @@ "ErrorValidatingSupporterInfo": "There was an error validating your Emby Supporter information. Please try again later.", "HeaderSync": "Sync", "LabelLocalSyncStatusValue": "Status: {0}", - "MessageSyncStarted": "Sync started" + "MessageSyncStarted": "Sync started", + "OptionPoster": "Poster", + "OptionPosterCard": "Poster card", + "OptionList": "List", + "OptionThumb": "Thumb", + "OptionThumbCard": "Thumb card", + "OptionBanner": "Banner" + }