diff --git a/dashboard-ui/boxset.html b/dashboard-ui/boxset.html
index ad4f138ff5..141c65bf7e 100644
--- a/dashboard-ui/boxset.html
+++ b/dashboard-ui/boxset.html
@@ -13,6 +13,7 @@
Suggested
Movies
Box Sets
+ Trailers
Genres
People
Studios
diff --git a/dashboard-ui/boxsets.html b/dashboard-ui/boxsets.html
index 54f0c44a75..79548f816a 100644
--- a/dashboard-ui/boxsets.html
+++ b/dashboard-ui/boxsets.html
@@ -12,6 +12,7 @@
Suggested
Movies
Box Sets
+ Trailers
Genres
People
Studios
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css
index 74a22f4730..b6260a9a81 100644
--- a/dashboard-ui/css/librarybrowser.css
+++ b/dashboard-ui/css/librarybrowser.css
@@ -279,3 +279,15 @@
max-height: 200px;
}
}
+
+@media all and (min-width: 2000px) {
+ .posterDetailViewItem {
+ width: 23.5%;
+ }
+}
+
+@media all and (min-width: 2540px) {
+ .posterDetailViewItem {
+ width: 18.75%;
+ }
+}
\ No newline at end of file
diff --git a/dashboard-ui/moviegenres.html b/dashboard-ui/moviegenres.html
index 0c99af2675..ca8b23a37f 100644
--- a/dashboard-ui/moviegenres.html
+++ b/dashboard-ui/moviegenres.html
@@ -12,6 +12,7 @@
Suggested
Movies
Box Sets
+ Trailers
Genres
People
Studios
diff --git a/dashboard-ui/moviepeople.html b/dashboard-ui/moviepeople.html
index b7fc595f92..187ac37d5d 100644
--- a/dashboard-ui/moviepeople.html
+++ b/dashboard-ui/moviepeople.html
@@ -12,6 +12,7 @@
Suggested
Movies
Box Sets
+ Trailers
Genres
People
Studios
diff --git a/dashboard-ui/movies.html b/dashboard-ui/movies.html
index 741cc5c8c7..76a89bebd7 100644
--- a/dashboard-ui/movies.html
+++ b/dashboard-ui/movies.html
@@ -12,6 +12,7 @@
Suggested
Movies
Box Sets
+ Trailers
Genres
People
Studios
diff --git a/dashboard-ui/moviesrecommended.html b/dashboard-ui/moviesrecommended.html
index f1edfe41a4..03a10b2c24 100644
--- a/dashboard-ui/moviesrecommended.html
+++ b/dashboard-ui/moviesrecommended.html
@@ -12,6 +12,7 @@
Suggested
Movies
Box Sets
+ Trailers
Genres
People
Studios
@@ -31,7 +32,7 @@
-
+
diff --git a/dashboard-ui/moviestudios.html b/dashboard-ui/moviestudios.html
index c8150a53de..bffbbee31c 100644
--- a/dashboard-ui/moviestudios.html
+++ b/dashboard-ui/moviestudios.html
@@ -12,6 +12,7 @@
Suggested
Movies
Box Sets
+
Trailers
Genres
People
Studios
diff --git a/dashboard-ui/movietrailers.html b/dashboard-ui/movietrailers.html
new file mode 100644
index 0000000000..e079471d07
--- /dev/null
+++ b/dashboard-ui/movietrailers.html
@@ -0,0 +1,109 @@
+
+
+
+
Media Browser
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
diff --git a/dashboard-ui/scripts/movietrailers.js b/dashboard-ui/scripts/movietrailers.js
new file mode 100644
index 0000000000..309b2b9d98
--- /dev/null
+++ b/dashboard-ui/scripts/movietrailers.js
@@ -0,0 +1,142 @@
+(function ($, document) {
+
+ var view = "Tile";
+
+ // The base query options
+ var query = {
+
+ SortBy: "SortName",
+ SortOrder: "Ascending",
+ IncludeItemTypes: "Trailer",
+ Recursive: true,
+ Fields: "PrimaryImageAspectRatio,UserData,DisplayMediaType,ItemCounts,DateCreated",
+ Limit: LibraryBrowser.getDetaultPageSize(),
+ StartIndex: 0
+ };
+
+ function reloadItems(page) {
+
+ Dashboard.showLoadingMsg();
+
+ ApiClient.getItems(Dashboard.getCurrentUserId(), query).done(function (result) {
+
+ var html = '';
+
+ var showPaging = result.TotalRecordCount > query.Limit;
+
+ if (showPaging) {
+ html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount, true);
+ }
+
+ if (view == "Tile") {
+ html += LibraryBrowser.getPosterDetailViewHtml({
+ items: result.Items,
+ useAverageAspectRatio: true,
+ preferBackdrop: true
+ });
+ }
+ else if (view == "Poster") {
+ html += LibraryBrowser.getPosterDetailViewHtml({
+ items: result.Items,
+ useAverageAspectRatio: true
+ });
+ }
+
+ if (showPaging) {
+ html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);
+ }
+
+ var elem = $('#items', page).html(html).trigger('create');
+
+ $('select', elem).on('change', function () {
+ query.StartIndex = (parseInt(this.value) - 1) * query.Limit;
+ reloadItems(page);
+ });
+
+ $('.btnNextPage', elem).on('click', function () {
+ query.StartIndex += query.Limit;
+ reloadItems(page);
+ });
+
+ $('.btnPreviousPage', elem).on('click', function () {
+ query.StartIndex -= query.Limit;
+ reloadItems(page);
+ });
+
+ Dashboard.hideLoadingMsg();
+ });
+ }
+
+ $(document).on('pageinit', "#movieTrailersPage", function () {
+
+ var page = this;
+
+ $('.radioSortBy', this).on('click', function () {
+ query.StartIndex = 0;
+ query.SortBy = this.getAttribute('data-sortby');
+ reloadItems(page);
+ });
+
+ $('.radioSortOrder', this).on('click', function () {
+ query.StartIndex = 0;
+ 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.StartIndex = 0;
+ query.Filters = filters;
+
+ reloadItems(page);
+ });
+
+ $('#selectView', this).on('change', function () {
+
+ view = this.value;
+
+ reloadItems(page);
+ });
+
+ }).on('pagebeforeshow', "#movieTrailersPage", function () {
+
+ reloadItems(this);
+
+ }).on('pageshow', "#movieTrailersPage", function () {
+
+
+ // 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');
+
+ $('#selectView', this).val(view).selectmenu('refresh');
+ });
+
+})(jQuery, document);
\ No newline at end of file