diff --git a/dashboard-ui/collections.html b/dashboard-ui/collections.html index 6dc952ead7..9e10d5d7e6 100644 --- a/dashboard-ui/collections.html +++ b/dashboard-ui/collections.html @@ -30,8 +30,10 @@
+
Example: Star Wars Collection
+
diff --git a/dashboard-ui/css/posteritem.css b/dashboard-ui/css/posteritem.css index 9cfc0ad1cd..8b3d4958f2 100644 --- a/dashboard-ui/css/posteritem.css +++ b/dashboard-ui/css/posteritem.css @@ -1,5 +1,5 @@ .posterItem { - margin: 5px; + margin: 4px 5px; text-shadow: none; font-weight: normal!important; display: inline-block; @@ -132,11 +132,11 @@ } .squarePosterItem { - width: 142px; + width: 148px; } .squarePosterItem .posterItemImage { - height: 142px; + height: 148px; } .storeReviewCount { @@ -145,11 +145,11 @@ .backdropPosterItem { - width: 142px; + width: 148px; } .backdropPosterItem .posterItemImage { - height: 79.875px; + height: 83.25px; } .smallBackdropPosterItem { @@ -161,11 +161,11 @@ } .portraitPosterItem { - width: 90px; + width: 96px; } .portraitPosterItem .posterItemImage { - height: 135px; + height: 144px; } .posterItemProgress .itemProgressBar { @@ -194,19 +194,19 @@ @media all and (min-width: 540px) { .backdropPosterItem { - width: 260px; + width: 266px; } .backdropPosterItem .posterItemImage { - height: 146.25px; + height: 149.625px; } .smallBackdropPosterItem { - width: 184px; + width: 180px; } .smallBackdropPosterItem .posterItemImage { - height: 103.5px; + height: 101.25px; } } @@ -214,55 +214,32 @@ .squarePosterItem { - width: 164px; + width: 170px; } .squarePosterItem .posterItemImage { - height: 164px; + height: 170px; } .portraitPosterItem { - width: 122px; + width: 128px; } .portraitPosterItem .posterItemImage { - height: 183px; + height: 192px; } } @media all and (min-width: 650px) { .backdropPosterItem { - width: 276px; + width: 282px; } .backdropPosterItem .posterItemImage { - height: 155.25px; + height: 158.625px; } - .smallBackdropPosterItem { - width: 196px; - } - - .smallBackdropPosterItem .posterItemImage { - height: 110.25px; - } -} - -@media all and (min-width: 750px) { - - .portraitPosterItem { - width: 112px; - } - - .portraitPosterItem .posterItemImage { - height: 168px; - } -} - -@media all and (min-width: 1000px) { - - .smallBackdropPosterItem { width: 202px; } @@ -272,22 +249,37 @@ } } -@media all and (min-width: 1200px) { - - .backdropPosterItem { - width: 276px; - } - - .backdropPosterItem .posterItemImage { - height: 155.25px; - } +@media all and (min-width: 750px) { .portraitPosterItem { - width: 138px; + width: 118px; } .portraitPosterItem .posterItemImage { - height: 207px; + height: 177px; + } +} + +@media all and (min-width: 1000px) { + + + .smallBackdropPosterItem { + width: 208px; + } + + .smallBackdropPosterItem .posterItemImage { + height: 117px; + } +} + +@media all and (min-width: 1200px) { + + .portraitPosterItem { + width: 144px; + } + + .portraitPosterItem .posterItemImage { + height: 216px; } .storeReviewCount { @@ -298,19 +290,19 @@ @media all and (min-width: 1440px) { .squarePosterItem { - width: 174px; + width: 180px; } .squarePosterItem .posterItemImage { - height: 174px; + height: 180px; } .backdropPosterItem { - width: 292px; + width: 298px; } .backdropPosterItem .posterItemImage { - height: 164.25px; + height: 167.625px; } } @@ -325,10 +317,10 @@ } .squarePosterItem { - width: 184px; + width: 190px; } .squarePosterItem .posterItemImage { - height: 184px; + height: 190px; } } diff --git a/dashboard-ui/editcollectionitems.html b/dashboard-ui/editcollectionitems.html index a1989d4f48..7d7c1d1a09 100644 --- a/dashboard-ui/editcollectionitems.html +++ b/dashboard-ui/editcollectionitems.html @@ -59,7 +59,7 @@
-
+
'; html += '
' + item.Name + '
'; - html += ''; + if (item.ParentId != currentItem.Id) { + html += ''; + } html += ''; @@ -138,7 +140,15 @@ function renderSearchResults(page, items) { - var html = items.map(getSearchResultHtml).join(''); + var existingIds = $('.chkRemoveItem', page).get().map(function (c) { + return c.getAttribute('data-itemid'); + }); + + var html = items.filter(function (i) { + + return existingIds.indexOf(i.ItemId) == -1; + + }).map(getSearchResultHtml).join(''); var elem = $('.collectionItemSearchResults', page).html(html).trigger('create'); @@ -186,7 +196,7 @@ }); } - + function removeItemsFromCollection(page) { var items = $('.chkRemoveItem:checked', page).get().map(function (c) { diff --git a/dashboard-ui/scripts/itembynamedetailpage.js b/dashboard-ui/scripts/itembynamedetailpage.js index 9a5e9dd069..c9a058a37a 100644 --- a/dashboard-ui/scripts/itembynamedetailpage.js +++ b/dashboard-ui/scripts/itembynamedetailpage.js @@ -477,10 +477,11 @@ } else { - html += LibraryBrowser.getPosterDetailViewHtml({ + html = LibraryBrowser.getPosterViewHtml({ items: result.Items, - preferBackdrop: shape == "backdrop", - shape: shape + shape: "square", + useAverageAspectRatio: true, + showTitle: true }); } diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js index 3d5d174c48..afb52cf254 100644 --- a/dashboard-ui/scripts/itemdetailpage.js +++ b/dashboard-ui/scripts/itemdetailpage.js @@ -577,13 +577,7 @@ } else { - var shape = "smallPoster"; - - if (item.Type == "Season") { - shape = "smallBackdrop"; - } - - var html; + var html = ''; if (item.Type == "Series" || item.Type == "BoxSet") { html = LibraryBrowser.getPosterViewHtml({ @@ -613,15 +607,7 @@ centerText: true }); } - else { - html = LibraryBrowser.getPosterDetailViewHtml({ - items: result.Items, - useAverageAspectRatio: true, - shape: shape, - showParentName: false, - displayAsSpecial: item.Type == "Season" && item.IndexNumber - }); - } + $('#childrenContent', page).html(html).createPosterItemHoverMenu(); diff --git a/dashboard-ui/scripts/itemlistpage.js b/dashboard-ui/scripts/itemlistpage.js index f9c0cd1318..317ad1249e 100644 --- a/dashboard-ui/scripts/itemlistpage.js +++ b/dashboard-ui/scripts/itemlistpage.js @@ -34,14 +34,23 @@ $('.viewSummary', page).html(LibraryBrowser.getViewSummaryHtml(query, checkSortOption)).trigger('create'); if (view == "Backdrop") { - html += LibraryBrowser.getPosterDetailViewHtml({ + + html = LibraryBrowser.getPosterViewHtml({ items: result.Items, + shape: "smallBackdrop", + useAverageAspectRatio: true, + showTitle: true, + centerText: true, preferBackdrop: true }); } else if (view == "Poster") { - html += LibraryBrowser.getPosterDetailViewHtml({ - items: result.Items + html = LibraryBrowser.getPosterViewHtml({ + items: result.Items, + shape: "portrait", + useAverageAspectRatio: true, + showTitle: true, + centerText: true }); } diff --git a/dashboard-ui/scripts/librarybrowser.js b/dashboard-ui/scripts/librarybrowser.js index f25dcffd4d..9be7d5579a 100644 --- a/dashboard-ui/scripts/librarybrowser.js +++ b/dashboard-ui/scripts/librarybrowser.js @@ -71,219 +71,6 @@ return "" + d.getFullYear() + formatDigit(d.getMonth() + 1) + formatDigit(d.getDate()) + formatDigit(d.getHours()) + formatDigit(d.getMinutes()) + formatDigit(d.getSeconds()); }, - getPosterDetailViewHtml: function (options) { - - var items = options.items; - var currentIndexValue; - - if (!options.shape) { - options.shape = options.preferBackdrop ? "backdrop" : "poster"; - } - - var html = ''; - - for (var i = 0, length = items.length; i < length; i++) { - - var item = items[i]; - - if (options.timeline) { - var year = item.ProductionYear || "Unknown Year"; - - if (year != currentIndexValue) { - - html += '

' + year + '

'; - currentIndexValue = year; - } - } - - var imgUrl = null; - var isDefault = false; - var height = null; - - var cssClass = "tileItem"; - - if (options.shape) { - cssClass += " " + options.shape + "TileItem"; - } - - html += ''; - - if (options.preferBackdrop && item.BackdropImageTags && item.BackdropImageTags.length) { - - imgUrl = LibraryBrowser.getImageUrl(item, 'Backdrop', 0, { - height: 198, - width: 352 - }); - - } - else if (options.preferBackdrop && item.ImageTags && item.ImageTags.Thumb) { - - imgUrl = ApiClient.getImageUrl(item.Id, { - type: "Thumb", - height: 198, - width: 352, - tag: item.ImageTags.Thumb - }); - } - else if (item.ImageTags && item.ImageTags.Primary) { - - height = 300; - - imgUrl = LibraryBrowser.getImageUrl(item, 'Primary', 0, { - maxheight: height - }); - - } - else if (item.AlbumId && item.AlbumPrimaryImageTag) { - - height = 300; - - imgUrl = ApiClient.getImageUrl(item.AlbumId, { - type: "Primary", - height: 100, - tag: item.AlbumPrimaryImageTag - }); - - } - else if (item.BackdropImageTags && item.BackdropImageTags.length) { - - imgUrl = LibraryBrowser.getImageUrl(item, 'Backdrop', 0, { - height: 198, - width: 352 - }); - } - else if (item.MediaType == "Audio" || item.Type == "MusicAlbum" || item.Type == "MusicArtist") { - - imgUrl = "css/images/items/list/audio.png"; - isDefault = true; - } - else if (item.MediaType == "Video" || item.Type == "Season" || item.Type == "Series") { - - imgUrl = "css/images/items/list/video.png"; - isDefault = true; - } - else if (item.Type == "Person") { - - imgUrl = "css/images/items/list/person.png"; - isDefault = true; - } - else if (item.Type == "MusicArtist") { - - imgUrl = "css/images/items/list/audiocollection.png"; - isDefault = true; - } - else if (item.MediaType == "Game") { - - imgUrl = "css/images/items/list/game.png"; - isDefault = true; - } - else if (item.Type == "Studio" || item.Type == "Genre" || item.Type == "MusicGenre" || item.Type == "GameGenre") { - - if (options.context == "games") { - - imgUrl = "css/images/items/list/game.png"; - } - else if (options.context == "music") { - - imgUrl = "css/images/items/list/audio.png"; - } - else if (options.context == "movies") { - - imgUrl = "css/images/items/list/chapter.png"; - } - else { - imgUrl = "css/images/items/list/collection.png"; - } - isDefault = true; - } - else { - - imgUrl = "css/images/items/list/collection.png"; - isDefault = true; - } - - cssClass = isDefault ? "tileImage defaultTileImage" : "tileImage"; - - html += '
'; - - html += '
'; - - if (options.showParentName !== false) { - if (item.SeriesName || item.Album || item.AlbumArtist) { - var seriesName = item.SeriesName || item.Album || item.AlbumArtist; - html += '
' + seriesName + '
'; - } - } - - var name = LibraryBrowser.getPosterViewDisplayName(item, options.displayAsSpecial); - - html += '
' + name + '
'; - - if (item.CommunityRating || item.CriticRating) { - html += '

' + LibraryBrowser.getRatingHtml(item) + '

'; - } - - var childText = null; - - if (item.Type == "BoxSet") { - - childText = item.ChildCount == 1 ? "1 Movie" : item.ChildCount + " Movies"; - - html += '

' + childText + '

'; - } - else if (item.Type == "GameSystem") { - - childText = item.ChildCount == 1 ? "1 Game" : item.ChildCount + " Games"; - - html += '

' + childText + '

'; - } - else if (item.Type == "MusicAlbum") { - - //childText = item.ChildCount == 1 ? "1 Song" : item.ChildCount + " Songs"; - - //html += '

' + childText + '

'; - } - else if (item.Type == "Genre" || item.Type == "Studio" || item.Type == "Person" || item.Type == "MusicArtist" || item.Type == "MusicGenre" || item.Type == "GameGenre") { - - var itemCountHtml = LibraryBrowser.getItemCountsHtml(options, item); - - if (itemCountHtml) { - html += '

' + itemCountHtml + '

'; - } - } - else if (item.Type == "Game") { - - html += '

' + (item.GameSystem) + '

'; - } - else if (item.Type == "Episode") { - - // Skip it. Just clutter - } - else { - html += '

' + LibraryBrowser.getMiscInfoHtml(item) + '

'; - } - - if (item.Type == "MusicAlbum") { - - html += '

' + LibraryBrowser.getMiscInfoHtml(item) + '

'; - } - - html += '

' + LibraryBrowser.getUserDataIconsHtml(item) + '

'; - - html += '
'; - - if (item.LocationType == "Offline" || item.LocationType == "Virtual") { - html += LibraryBrowser.getOfflineIndicatorHtml(item); - } else { - html += LibraryBrowser.getPlayedIndicatorHtml(item); - } - - html += "
"; - } - - return html; - }, - getItemCountsHtml: function (options, item) { var counts = []; diff --git a/dashboard-ui/scripts/plugincatalogpage.js b/dashboard-ui/scripts/plugincatalogpage.js index f5431a580e..dea89b40b4 100644 --- a/dashboard-ui/scripts/plugincatalogpage.js +++ b/dashboard-ui/scripts/plugincatalogpage.js @@ -94,7 +94,7 @@ } html += ""; - html += "
"; + html += "
"; var installedPlugin = plugin.isApp ? null : installedPlugins.filter(function (ip) { return ip.Name == plugin.name; @@ -108,7 +108,7 @@ html += "
"; - html += "
"; + html += "
"; html += plugin.price > 0 ? "$" + plugin.price.toFixed(2) : "Free"; html += Dashboard.getStoreRatingHtml(plugin.avgRating, plugin.id, plugin.name);