diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index 0fcb0b2e0..cb5fbb8be 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -191,7 +191,7 @@ .tileItem { background: #333; - padding: 10px 10px 3px; + padding: 10px 7px 5px; margin: 3px 0; text-shadow: none; font-weight: normal!important; @@ -224,7 +224,7 @@ } .tileItem p { - margin: .35em 0; + margin: .35em 0 0; } .tileItem .imgUserItemRating { @@ -244,6 +244,9 @@ .tileName { font-weight: bold; + white-space: nowrap; + text-overflow: ellipsis; + overflow: hidden; } .tileItem .userDataIcons img { @@ -270,7 +273,7 @@ } } -@media all and (min-width: 850px) { +@media all and (min-width: 750px) { .tileItem { width: 46%; display: inline-block; @@ -279,7 +282,14 @@ } .tileImage { - height: 140px; + height: 88px; + } +} + +@media all and (min-width: 850px) { + + .tileImage { + height: 105px; } .tileItem .userDataIcons img { @@ -288,7 +298,7 @@ } .tileItem p { - margin: .75em 0; + margin: .75em 0 0; } .tileItem .itemProgress { @@ -297,6 +307,10 @@ } @media all and (min-width: 1200px) { + .tileImage { + height: 100px; + } + .tileItem { width: 31%; } @@ -307,9 +321,6 @@ } @media all and (min-width: 1440px) { - .tileImage { - height: 170px; - } } @@ -317,10 +328,6 @@ .tileItem { width: 31.5%; } - - .tileImage { - height: 200px; - } } @media all and (min-width: 2000px) { @@ -345,6 +352,7 @@ .centeredDetailTable { margin: auto; } + .stretchedDetailTable { width: 100%; } @@ -369,6 +377,7 @@ width: 18px; height: 18px; } + .userDataCell { width: 140px; -} \ No newline at end of file +} diff --git a/dashboard-ui/itembynamedetails.html b/dashboard-ui/itembynamedetails.html index 12e3cc8ca..1760e59ce 100644 --- a/dashboard-ui/itembynamedetails.html +++ b/dashboard-ui/itembynamedetails.html @@ -4,9 +4,84 @@ -
+
+
+ +
+

+

+ + + + + + +
diff --git a/dashboard-ui/scripts/Itemdetailpage.js b/dashboard-ui/scripts/Itemdetailpage.js index a9c9e7928..7c55d3dba 100644 --- a/dashboard-ui/scripts/Itemdetailpage.js +++ b/dashboard-ui/scripts/Itemdetailpage.js @@ -45,8 +45,9 @@ $('#seriesName', page).hide(); } - setInitialCollapsibleState(page, item); - renderDetails(page, item); + var context = getContext(item); + setInitialCollapsibleState(page, item, context); + renderDetails(page, item, context); if (MediaPlayer.canPlay(item)) { $('#btnPlayMenu', page).show(); @@ -64,6 +65,25 @@ Dashboard.hideLoadingMsg(); }); } + + function getContext(item) { + + // should return either movies, tv, music or games + + if (item.Type == "Episode" || item.Type == "Series" || item.Type == "Season") { + return "tv"; + } + if (item.Type == "Movie" || item.Type == "Trailer" || item.Type == "BoxSet") { + return "movies"; + } + if (item.Type == "Audio" || item.Type == "MusicAlbum" || item.Type == "MusicArtist" || item.Type == "Artist") { + return "music"; + } + if (item.MediaType == "Game") { + return "games"; + } + return ""; + } function enableCustomHeader(page, text) { var elem = $('.libraryPageHeader', page).show(); @@ -125,7 +145,7 @@ } } - function setInitialCollapsibleState(page, item) { + function setInitialCollapsibleState(page, item, context) { if (item.ChildCount && item.Type == "MusicAlbum") { $('#itemSongs', page).show(); @@ -176,11 +196,11 @@ $('#castCollapsible', page).hide(); } else { $('#castCollapsible', page).show(); - renderCast(page, item); + renderCast(page, item, context); } } - function renderDetails(page, item) { + function renderDetails(page, item, context) { if (item.Taglines && item.Taglines.length) { $('#itemTagline', page).html(item.Taglines[0]).show(); @@ -202,8 +222,8 @@ $('#itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item)); - LibraryBrowser.renderGenres($('#itemGenres', page), item); - LibraryBrowser.renderStudios($('#itemStudios', page), item); + LibraryBrowser.renderGenres($('#itemGenres', page), item, context); + LibraryBrowser.renderStudios($('#itemStudios', page), item, context); renderUserDataIcons(page, item); LibraryBrowser.renderLinks($('#itemLinks', page), item); } @@ -485,7 +505,7 @@ }); } - function renderCast(page, item) { + function renderCast(page, item, context) { var html = ''; var casts = item.People || []; @@ -494,7 +514,7 @@ var cast = casts[i]; - html += LibraryBrowser.createCastImage(cast); + html += LibraryBrowser.createCastImage(cast, context); } $('#castContent', page).html(html); diff --git a/dashboard-ui/scripts/boxsets.js b/dashboard-ui/scripts/boxsets.js index 2276f503f..f1db31923 100644 --- a/dashboard-ui/scripts/boxsets.js +++ b/dashboard-ui/scripts/boxsets.js @@ -25,7 +25,8 @@ html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, - useAverageAspectRatio: true + useAverageAspectRatio: true, + context: "movies" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/gamedetailpage.js b/dashboard-ui/scripts/gamedetailpage.js index 1f347a78d..c8c0e8189 100644 --- a/dashboard-ui/scripts/gamedetailpage.js +++ b/dashboard-ui/scripts/gamedetailpage.js @@ -70,8 +70,8 @@ $('#itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item)); - LibraryBrowser.renderGenres($('#itemGenres', page), item); - LibraryBrowser.renderStudios($('#itemStudios', page), item); + LibraryBrowser.renderGenres($('#itemGenres', page), item, "games"); + LibraryBrowser.renderStudios($('#itemStudios', page), item, "games"); renderUserDataIcons(page, item); LibraryBrowser.renderLinks($('#itemLinks', page), item); } diff --git a/dashboard-ui/scripts/gamegenrepage.js b/dashboard-ui/scripts/gamegenrepage.js index af34cdac9..7e0c8dae2 100644 --- a/dashboard-ui/scripts/gamegenrepage.js +++ b/dashboard-ui/scripts/gamegenrepage.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Game", - countNamePlural: "Games" + countNamePlural: "Games", + context: "games" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/gamespage.js b/dashboard-ui/scripts/gamespage.js index 19a2c323c..5b7039117 100644 --- a/dashboard-ui/scripts/gamespage.js +++ b/dashboard-ui/scripts/gamespage.js @@ -32,8 +32,8 @@ html += '' + item.Name + ''; html += '' + item.DisplayMediaType + ''; html += '' + item.ReleaseYear + ''; - html += '' + /*LibraryBrowser.renderGenres('', item)*/ + ''; - html += '' + /*LibraryBrowser.renderStudios('', item)*/ + ''; + html += '' + /*LibraryBrowser.renderGenres('', item, "games")*/ + ''; + html += '' + /*LibraryBrowser.renderStudios('', item, "games")*/ + ''; html += '' + /* */ + ''; html += ''; diff --git a/dashboard-ui/scripts/gamestudiospage.js b/dashboard-ui/scripts/gamestudiospage.js index 1c22b05cc..b675c5b6a 100644 --- a/dashboard-ui/scripts/gamestudiospage.js +++ b/dashboard-ui/scripts/gamestudiospage.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Game", - countNamePlural: "Games" + countNamePlural: "Games", + context: "games" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/gamesystempage.js b/dashboard-ui/scripts/gamesystempage.js index 6dafdf149..314f25654 100644 --- a/dashboard-ui/scripts/gamesystempage.js +++ b/dashboard-ui/scripts/gamesystempage.js @@ -35,8 +35,8 @@ $('#itemMiscInfo', page).html(LibraryBrowser.getMiscInfoHtml(item)); - LibraryBrowser.renderGenres($('#itemGenres', page), item); - LibraryBrowser.renderStudios($('#itemStudios', page), item); + LibraryBrowser.renderGenres($('#itemGenres', page), item, "games"); + LibraryBrowser.renderStudios($('#itemStudios', page), item, "games"); renderUserDataIcons(page, item); LibraryBrowser.renderLinks($('#itemLinks', page), item); } diff --git a/dashboard-ui/scripts/gamesystemspage.js b/dashboard-ui/scripts/gamesystemspage.js index 05ffc4800..32c111405 100644 --- a/dashboard-ui/scripts/gamesystemspage.js +++ b/dashboard-ui/scripts/gamesystemspage.js @@ -26,7 +26,8 @@ html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, - useAverageAspectRatio: true + useAverageAspectRatio: true, + context: "games" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/itembynamedetailpage.js b/dashboard-ui/scripts/itembynamedetailpage.js index eb1fbf246..b2502675f 100644 --- a/dashboard-ui/scripts/itembynamedetailpage.js +++ b/dashboard-ui/scripts/itembynamedetailpage.js @@ -45,6 +45,8 @@ currentItem = item; + renderHeader(page, item); + name = item.Name; $('#itemImage', page).html(LibraryBrowser.getDetailImageHtml(item)); @@ -60,6 +62,68 @@ }); } + function enableCustomHeader(page, text) { + var elem = $('.libraryPageHeader', page).show(); + + $('span', elem).html(text); + } + + function renderHeader(page, item) { + + var context = getParameterByName('context'); + + if (context == "movies") { + enableCustomHeader(page, "Movies"); + $('#standardLogo', page).hide(); + } + else if (context == "music") { + enableCustomHeader(page, "Music"); + $('#standardLogo', page).hide(); + } + else if (context == "tv") { + enableCustomHeader(page, "TV Shows"); + $('#standardLogo', page).hide(); + } + else if (context == "games") { + enableCustomHeader(page, "Games"); + $('#standardLogo', page).hide(); + } + else { + $('.libraryPageHeader', page).hide(); + $('#standardLogo', page).show(); + } + + $('.itemTabs', page).hide(); + + if (context == "movies" && item.Type == "Genre") { + $('#movieGenreTabs', page).show(); + } + + if (context == "movies" && item.Type == "Person") { + $('#moviePeopleTabs', page).show(); + } + + if (context == "movies" && item.Type == "Studio") { + $('#movieStudioTabs', page).show(); + } + + if (context == "tv" && item.Type == "Studio") { + $('#tvStudioTabs', page).show(); + } + + if (context == "tv" && item.Type == "Genre") { + $('#tvGenreTabs', page).show(); + } + + if (context == "tv" && item.Type == "Person") { + $('#tvPeopleTabs', page).show(); + } + + if (context == "music" && item.Type == "Genre") { + $('#musicGenreTabs', page).show(); + } + } + function renderTabs(page, item) { var promise; diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index a81b064c9..8fda7a995 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -27,7 +27,7 @@ var imgUrl; var isDefault = false; - html += ''; + html += ''; if (options.preferBackdrop && item.BackdropImageTags && item.BackdropImageTags.length) { @@ -208,7 +208,7 @@ } html += '' + (num || "") + ''; - html += '' + (item.Name || "") + ''; + html += '' + (item.Name || "") + ''; if (options.showAlbum) { html += '' + item.Album + ''; @@ -234,7 +234,7 @@ return html; }, - getHref: function (item) { + getHref: function (item, itemByNameContext) { if (item.url) { return item.url; @@ -253,16 +253,16 @@ return "itemdetails.html?id=" + item.Id; } if (item.Type == "Genre") { - return "itembynamedetails.html?genre=" + item.Name; + return "itembynamedetails.html?genre=" + item.Name + "&context=" + itemByNameContext; } if (item.Type == "Studio") { - return "itembynamedetails.html?studio=" + item.Name; + return "itembynamedetails.html?studio=" + item.Name + "&context=" + itemByNameContext; } if (item.Type == "Person") { - return "itembynamedetails.html?person=" + item.Name; + return "itembynamedetails.html?person=" + item.Name + "&context=" + itemByNameContext; } if (item.Type == "Artist") { - return "itembynamedetails.html?artist=" + item.Name; + return "itembynamedetails.html?artist=" + item.Name + "&context=" + itemByNameContext; } return item.IsFolder ? (item.Id ? "itemList.html?parentId=" + item.Id : "#") : "itemdetails.html?id=" + item.Id; @@ -397,7 +397,7 @@ var cssClass = showText ? "posterViewItem posterViewItemWithDualText" : "posterViewItem posterViewItemWithNoText"; - html += "
"; + html += "
"; if (options.preferBackdrop && item.BackdropImageTags && item.BackdropImageTags.length) { html += "' + item.Studios[i] + ''; + html += '' + item.Studios[i] + ''; } elem.show().html(html).trigger('create'); @@ -1144,7 +1144,7 @@ } }, - renderGenres: function (elem, item) { + renderGenres: function (elem, item, context) { if (item.Genres && item.Genres.length) { var html = 'Genres:  '; @@ -1155,7 +1155,7 @@ html += '  /  '; } - html += '' + item.Genres[i] + ''; + html += '' + item.Genres[i] + ''; } elem.show().html(html).trigger('create'); @@ -1211,7 +1211,7 @@ var cssClass = showText ? "posterViewItem" : "posterViewItem posterViewItemWithNoText"; - html += "
"; + html += "
"; if (options.preferBackdrop && item.BackdropImageTags && item.BackdropImageTags.length) { html += "'; + html += ''; html += '
'; if (cast.PrimaryImageTag) { diff --git a/dashboard-ui/scripts/moviegenres.js b/dashboard-ui/scripts/moviegenres.js index 439dabecb..235075e0c 100644 --- a/dashboard-ui/scripts/moviegenres.js +++ b/dashboard-ui/scripts/moviegenres.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Movie", - countNamePlural: "Movies" + countNamePlural: "Movies", + context: "movies" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/moviepeople.js b/dashboard-ui/scripts/moviepeople.js index d033aa611..7254cf3f0 100644 --- a/dashboard-ui/scripts/moviepeople.js +++ b/dashboard-ui/scripts/moviepeople.js @@ -27,7 +27,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Movie", - countNamePlural: "Movies" + countNamePlural: "Movies", + context: "movies" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/movies.js b/dashboard-ui/scripts/movies.js index 4005f12fa..bc1c9ae07 100644 --- a/dashboard-ui/scripts/movies.js +++ b/dashboard-ui/scripts/movies.js @@ -28,13 +28,15 @@ html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, useAverageAspectRatio: true, - preferBackdrop: true + preferBackdrop: true, + context: "movies" }); } else if (view == "Poster") { html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, - useAverageAspectRatio: true + useAverageAspectRatio: true, + context: "movies" }); } diff --git a/dashboard-ui/scripts/moviestudios.js b/dashboard-ui/scripts/moviestudios.js index 15e7475ae..e9c041e3a 100644 --- a/dashboard-ui/scripts/moviestudios.js +++ b/dashboard-ui/scripts/moviestudios.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Movie", - countNamePlural: "Movies" + countNamePlural: "Movies", + context: "movies" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/movietrailers.js b/dashboard-ui/scripts/movietrailers.js index d3d2bfc08..968b34ee6 100644 --- a/dashboard-ui/scripts/movietrailers.js +++ b/dashboard-ui/scripts/movietrailers.js @@ -28,13 +28,15 @@ html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, useAverageAspectRatio: true, - preferBackdrop: true + preferBackdrop: true, + context: "movies" }); } else if (view == "Poster") { html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, - useAverageAspectRatio: true + useAverageAspectRatio: true, + context: "movies" }); } diff --git a/dashboard-ui/scripts/musicalbums.js b/dashboard-ui/scripts/musicalbums.js index 7e5189b78..718ff17db 100644 --- a/dashboard-ui/scripts/musicalbums.js +++ b/dashboard-ui/scripts/musicalbums.js @@ -24,7 +24,8 @@ html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, - useAverageAspectRatio: true + useAverageAspectRatio: true, + context: "music" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/musicartists.js b/dashboard-ui/scripts/musicartists.js index c547e21f3..f08541fea 100644 --- a/dashboard-ui/scripts/musicartists.js +++ b/dashboard-ui/scripts/musicartists.js @@ -27,7 +27,8 @@ useAverageAspectRatio: true, countNameSingular: "Song", countNamePlural: "Songs", - preferBackdrop: true + preferBackdrop: true, + context: "music" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/musicgenres.js b/dashboard-ui/scripts/musicgenres.js index 19afb1ecc..667223e76 100644 --- a/dashboard-ui/scripts/musicgenres.js +++ b/dashboard-ui/scripts/musicgenres.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Song", - countNamePlural: "Songs" + countNamePlural: "Songs", + context: "music" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/tvgenres.js b/dashboard-ui/scripts/tvgenres.js index 179c05725..10f121e1e 100644 --- a/dashboard-ui/scripts/tvgenres.js +++ b/dashboard-ui/scripts/tvgenres.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Show", - countNamePlural: "Shows" + countNamePlural: "Shows", + context: "tv" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/tvpeople.js b/dashboard-ui/scripts/tvpeople.js index 5ba2f92f3..498983d14 100644 --- a/dashboard-ui/scripts/tvpeople.js +++ b/dashboard-ui/scripts/tvpeople.js @@ -27,7 +27,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Show", - countNamePlural: "Shows" + countNamePlural: "Shows", + context: "tv" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount); diff --git a/dashboard-ui/scripts/tvshows.js b/dashboard-ui/scripts/tvshows.js index 17bc77857..f3cd8cd6c 100644 --- a/dashboard-ui/scripts/tvshows.js +++ b/dashboard-ui/scripts/tvshows.js @@ -28,13 +28,15 @@ html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, useAverageAspectRatio: true, - preferBackdrop: true + preferBackdrop: true, + context: "tv" }); } else if (view == "Poster") { html += LibraryBrowser.getPosterDetailViewHtml({ items: result.Items, - useAverageAspectRatio: true + useAverageAspectRatio: true, + context: "tv" }); } diff --git a/dashboard-ui/scripts/tvstudios.js b/dashboard-ui/scripts/tvstudios.js index 27a5926d4..b3961addc 100644 --- a/dashboard-ui/scripts/tvstudios.js +++ b/dashboard-ui/scripts/tvstudios.js @@ -26,7 +26,8 @@ items: result.Items, useAverageAspectRatio: true, countNameSingular: "Show", - countNamePlural: "Shows" + countNamePlural: "Shows", + context: "tv" }); html += LibraryBrowser.getPagingHtml(query, result.TotalRecordCount);