diff --git a/dashboard-ui/boxsets.html b/dashboard-ui/boxsets.html new file mode 100644 index 0000000000..2f49b5970d --- /dev/null +++ b/dashboard-ui/boxsets.html @@ -0,0 +1,14 @@ + + + + Media Browser + + +
+

+ Movies

+
+
+
+ + diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index f4dbddd2bb..3b67e5eca3 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -1,4 +1,9 @@ -.libraryPage .header { +/* Fixes the issue of jqm panels altering the page background. */ +.ui-panel-content-wrap { + background: none!important; +} + +.libraryPage .header { padding-bottom: 0; } @@ -6,12 +11,12 @@ margin: -5px 0 0; } -.libraryPageHeader a { - margin-right: 20px; -} + .libraryPageHeader a { + margin-right: 20px; + } .libraryPage .ui-content { - padding: 15px 30px 100px; + padding: 10px; } .libraryPage, .itemListContent { @@ -31,12 +36,11 @@ } .firstListHeader { - margin-top: .5em; + margin-top: .75em; } .libraryViewNav { text-align: center; - margin-bottom: 1.5em!important; } .libraryViewNav .ui-btn-inner { @@ -48,13 +52,30 @@ margin: 0 auto; } +.viewSettings { + text-align: center; + margin: 1em 0; +} + +.libraryItemsGrid th { + text-align: left; +} + @media all and (min-width: 650px) { + .libraryPage .ui-content { + padding: 15px 30px 100px; + } } @media all and (min-width: 750px) { } @media all and (min-width: 1200px) { + + .libraryPage .ui-content { + padding-top: 0; + } + .ehsContent { max-width: 800px; } diff --git a/dashboard-ui/movies.html b/dashboard-ui/movies.html index 0cd4fb0804..64ef0d20c6 100644 --- a/dashboard-ui/movies.html +++ b/dashboard-ui/movies.html @@ -11,18 +11,91 @@
Recommended Movies - Box Sets + Box Sets Genres Actors Directors
- - - + +
+
+ +
+
+
+ +

Sort By:

+ + + + + + + + + + + + + + + + + + + + + + + + + +
+ +
+ +

Sort Order:

+ + + + + + + +
+
+
+
+
+
+
+ +

Filters:

+ + + + + + + + + + + + + + + + + + +
+
+
diff --git a/dashboard-ui/moviesrecommended.html b/dashboard-ui/moviesrecommended.html index 8d81b04ea8..f8504cc220 100644 --- a/dashboard-ui/moviesrecommended.html +++ b/dashboard-ui/moviesrecommended.html @@ -11,7 +11,7 @@
Recommended Movies - Box Sets + Box Sets Genres Actors Directors diff --git a/dashboard-ui/scripts/boxsets.js b/dashboard-ui/scripts/boxsets.js new file mode 100644 index 0000000000..5f282702bb --- /dev/null +++ b/dashboard-ui/scripts/boxsets.js @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js new file mode 100644 index 0000000000..5f282702bb --- /dev/null +++ b/dashboard-ui/scripts/librarybrowser.js @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/dashboard-ui/scripts/movies.js b/dashboard-ui/scripts/movies.js index 76b455d91e..2f2a6810d1 100644 --- a/dashboard-ui/scripts/movies.js +++ b/dashboard-ui/scripts/movies.js @@ -1,28 +1,131 @@ (function ($, document) { - $(document).on('pageshow', "#moviesPage", function () { + // The base query options + var query = { + + SortBy: "SortName", + SortOrder: "Ascending", + IncludeItemTypes: "Movie", + Recursive: true, + Fields: "PrimaryImageAspectRatio" + }; + + function getTableHtml(items) { + + var html = ''; + + html += ''; + + html += ''; + html += ''; + html += ''; + html += ''; + html += ''; + html += ''; + + html += ''; + + html += ''; + + for (var i = 0, length = items.length; i < length; i++) { + + html += getRowHtml(items[i]); + } + + html += ''; + + html += '
NameYearOfficial RatingRuntime
'; + + return html; + } + + function getRowHtml(item) { + + var html = ''; + + html += '' + (item.Name || "") + ''; + + html += '' + (item.ProductionYear || "") + ''; + + html += '' + (item.OfficialRating || "") + ''; + html += '' + (item.OfficialRating || "") + ''; + + html += ''; + return html; + } + + function reloadItems(page) { + + Dashboard.showLoadingMsg(); + + ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) { + + $('#items', page).html(Dashboard.getPosterViewHtml({ + + items: result.Items, + useAverageAspectRatio: true + + })).html(getTableHtml(result.Items)).trigger('create'); + + Dashboard.hideLoadingMsg(); + }); + } + + $(document).on('pageinit', "#moviesPage", function () { var page = this; - var options = { - - SortBy: "SortName", - SortOrder: "Ascending", - IncludeItemTypes: "Movie", - Recursive: true, - Fields: "PrimaryImageAspectRatio" - }; - - ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { - - $('#items', page).html(Dashboard.getPosterViewHtml({ - items: result.Items, - useAverageAspectRatio: true - })); - + $('.radioSortBy', this).on('click', function () { + query.SortBy = this.getAttribute('data-sortby'); + reloadItems(page); }); + $('.radioSortOrder', this).on('click', function () { + query.SortOrder = this.getAttribute('data-sortorder'); + reloadItems(page); + }); + + $('.chkStandardFilter', this).on('change', function () { + + 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.Filters = filters; + + reloadItems(page); + }); + + }).on('pageshow', "#moviesPage", function () { + + reloadItems(this); + + // Reset form values using the last used query + $('.radioSortBy', this).each(function () { + + this.checked = query.SortBy == this.getAttribute('data-sortby'); + + }).checkboxradio('refresh'); + + $('.radioSortOrder', this).each(function () { + + this.checked = query.SortOrder == this.getAttribute('data-sortorder'); + + }).checkboxradio('refresh'); + + $('.chkStandardFilter', this).each(function () { + + var filters = "," + (query.Filters || ""); + var filterName = this.getAttribute('data-filter'); + + this.checked = filters.indexOf(',' + filterName) != -1; + + }).checkboxradio('refresh'); }); - })(jQuery, document); \ No newline at end of file diff --git a/dashboard-ui/scripts/tvshows.js b/dashboard-ui/scripts/tvshows.js new file mode 100644 index 0000000000..5f282702bb --- /dev/null +++ b/dashboard-ui/scripts/tvshows.js @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/dashboard-ui/tvrecommended.html b/dashboard-ui/tvrecommended.html index 304a5fd1f2..9dea30e907 100644 --- a/dashboard-ui/tvrecommended.html +++ b/dashboard-ui/tvrecommended.html @@ -10,11 +10,24 @@
Recommended - Shows + Shows Genres Actors Favorites
+
+

Latest Episodes

+ +
+
+ + +
diff --git a/dashboard-ui/tvshows.html b/dashboard-ui/tvshows.html new file mode 100644 index 0000000000..0610c366f8 --- /dev/null +++ b/dashboard-ui/tvshows.html @@ -0,0 +1,14 @@ + + + + Media Browser + + +
+

+ TV Shows

+
+
+
+ +