diff --git a/ApiClient.js b/ApiClient.js index 9a75c12be0..25cbc98779 100644 --- a/ApiClient.js +++ b/ApiClient.js @@ -305,6 +305,42 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi url: url }); }; + + function getRemoteImagePrefix(options) { + + var urlPrefix; + + if (options.artist) { + urlPrefix = "Artists/" + encodeName(options.artist); + delete options.artist; + } + else if (options.person) { + urlPrefix = "Persons/" + encodeName(options.person); + delete options.person; + } + else if (options.genre) { + urlPrefix = "Genres/" + encodeName(options.genre); + delete options.genre; + } + else if (options.musicGenre) { + urlPrefix = "MusicGenres/" + encodeName(options.musicGenre); + delete options.musicGenre; + } + else if (options.gameGenre) { + urlPrefix = "GameGenres/" + encodeName(options.gameGenre); + delete options.gameGenre; + } + else if (options.studio) { + urlPrefix = "Studios/" + encodeName(options.studio); + delete options.studio; + } + else { + urlPrefix = "Items/" + options.itemId; + delete options.itemId; + } + + return urlPrefix; + } self.getAvailableRemoteImages = function (options) { @@ -312,14 +348,9 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi throw new Error("null options"); } - var urlPrefix = "Items/" + options.itemId; + var urlPrefix = getRemoteImagePrefix(options); - var imageType = options.imageType; - - delete options.itemId; - delete options.imageType; - - var url = self.getUrl(urlPrefix + "/RemoteImages/" + imageType, options); + var url = self.getUrl(urlPrefix + "/RemoteImages", options); return self.ajax({ type: "GET", @@ -328,6 +359,22 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi }); }; + self.downloadRemoteImage = function (options) { + + if (!options) { + throw new Error("null options"); + } + + var urlPrefix = getRemoteImagePrefix(options); + + var url = self.getUrl(urlPrefix + "/RemoteImages/Download", options); + + return self.ajax({ + type: "POST", + url: url + }); + }; + /** * Gets the current server status */ diff --git a/dashboard-ui/css/metadataeditor.css b/dashboard-ui/css/metadataeditor.css index 6ee5b156b4..8086497cf7 100644 --- a/dashboard-ui/css/metadataeditor.css +++ b/dashboard-ui/css/metadataeditor.css @@ -29,7 +29,7 @@ .availableImagesList { overflow-y: auto; width: 300px; - height: 500px; + height: 400px; text-align: center; } @@ -49,6 +49,7 @@ background-position: center bottom; background-repeat: no-repeat; background-size: contain; + display: block; } .remotePosterImage { @@ -61,6 +62,16 @@ height: 153px; } +.remoteBannerImage { + width: 272px; + height: 50px; +} + +.remoteDiscImage { + width: 180px; + height: 180px; +} + @media all and (min-width: 500px) { .availableImagesList { @@ -72,6 +83,7 @@ .availableImagesList { width: 500px; + height: 450px; } .editPageSidebar { @@ -89,6 +101,11 @@ float: right; width: 70%; } + + .remoteBannerImage { + width: 450px; + height: 83px; + } } @@ -155,34 +172,6 @@ } } -@media all and (min-width: 1600px) { - - .availableImagesList { - width: 1500px; - } -} - -@media all and (min-width: 1700px) { - - .availableImagesList { - width: 1600px; - } -} - -@media all and (min-width: 1800px) { - - .availableImagesList { - width: 1700px; - } -} - -@media all and (min-width: 1900px) { - - .availableImagesList { - width: 1800px; - } -} - @media all and (min-height: 800px) { .availableImagesList { @@ -196,4 +185,3 @@ height: 700px; } } - diff --git a/dashboard-ui/edititemimages.html b/dashboard-ui/edititemimages.html index 96ca27f262..662249b0bd 100644 --- a/dashboard-ui/edititemimages.html +++ b/dashboard-ui/edititemimages.html @@ -23,7 +23,7 @@
- Browse Images + Browse Online Images Upload Image
@@ -93,12 +93,20 @@ Close
-

Browse Images

+

Browse Online Images

+
+ +
+
+ +
diff --git a/dashboard-ui/scripts/edititemimages.js b/dashboard-ui/scripts/edititemimages.js index 016936bf5c..007995c4c7 100644 --- a/dashboard-ui/scripts/edititemimages.js +++ b/dashboard-ui/scripts/edititemimages.js @@ -15,18 +15,66 @@ $('#btnEditMetadata', page).attr('href', 'edititemmetadata.html?' + query); } + function getBaseRemoteOptions() { + var options = {}; + + if (currentItem.Type == "Artist") { + options.artist = currentItem.Name; + } + else if (currentItem.Type == "Artist") { + options.artist = currentItem.Name; + } + else if (currentItem.Type == "Person") { + options.person = currentItem.Name; + } + else if (currentItem.Type == "Genre") { + options.genre = currentItem.Name; + } + else if (currentItem.Type == "GameGenre") { + options.gameGenre = currentItem.Name; + } + else if (currentItem.Type == "MusicGenre") { + options.musicGenre = currentItem.Name; + } + else if (currentItem.Type == "Studio") { + options.studio = currentItem.Name; + } + else { + options.itemId = currentItem.Id; + } + + return options; + } + function reloadBrowsableImages(page) { - var options = { - itemId: currentItem.Id, - imageType: browsableImageType, - startIndex: browsableImageStartIndex, - limit: browsableImagePageSize - }; + Dashboard.showLoadingMsg(); + + var options = getBaseRemoteOptions(); + + options.type = browsableImageType; + options.startIndex = browsableImageStartIndex; + options.limit = browsableImagePageSize; + + var provider = $('#selectImageProvider', page).val(); + + if (provider) { + options.ProviderName = provider; + } ApiClient.getAvailableRemoteImages(options).done(function (result) { renderRemoteImages(page, currentItem, result, browsableImageType, options.startIndex, options.limit); + + $('#selectBrowsableImageType', page).val(browsableImageType).selectmenu('refresh'); + + var providersHtml = result.Providers.map(function (p) { + return ''; + }); + + $('#selectImageProvider', page).html('' + providersHtml).val(provider).selectmenu('refresh'); + + Dashboard.hideLoadingMsg(); }); } @@ -59,8 +107,29 @@ reloadBrowsableImages(page); }); + $('.btnDownloadRemoteImage', page).on('click', function () { + + downloadRemoteImage(page, this.getAttribute('data-imageurl'), this.getAttribute('data-imagetype'), this.getAttribute('data-imageprovider')); + }); + } + function downloadRemoteImage(page, url, type, provider) { + + var options = getBaseRemoteOptions(); + + options.Type = type; + options.ImageUrl = url; + options.ProviderName = provider; + + Dashboard.showLoadingMsg(); + + ApiClient.downloadRemoteImage(options).done(function () { + + $('#popupDownload', page).popup("close"); + reload(page); + }); + } function getRemoteImageHtml(image, imageType) { @@ -70,15 +139,21 @@ var cssClass = "remoteImage"; - if (imageType == "Backdrop") { + if (imageType == "Backdrop" || imageType == "Art" || imageType == "Thumb" || imageType == "Logo") { cssClass += " remoteBackdropImage"; } + else if (imageType == "Banner") { + cssClass += " remoteBannerImage"; + } + else if (imageType == "Disc") { + cssClass += " remoteDiscImage"; + } else { cssClass += " remotePosterImage"; } - html += '
'; - html += '
'; + html += ''; + html += ''; html += '
'; html += image.ProviderName; @@ -88,7 +163,7 @@ html += '
'; html += image.Width + 'x' + image.Height; - + if (image.Language) { html += ' • ' + image.Language; @@ -96,19 +171,30 @@ html += '
'; } - if (image.CommunityRating) { - html += '
'; - html += image.CommunityRating.toFixed(1); + if (image.CommunityRating != null) { - if (image.VoteCount) { - html += ' • ' + image.VoteCount + ' votes'; + html += '
'; + + if (image.RatingType == "Likes") { + html += image.CommunityRating + (image.CommunityRating == 1 ? " like" : " likes"); + } else { + + if (image.CommunityRating) { + html += image.CommunityRating.toFixed(1); + + if (image.VoteCount) { + html += ' • ' + image.VoteCount + ' votes'; + } + } else { + html += "Unrated"; + } } html += '
'; } - html += '
'; - + html += '
'; + html += '
'; return html; @@ -135,7 +221,7 @@ var recordsEnd = Math.min(startIndex + limit, totalRecordCount); // 20 is the minimum page size - var showControls = totalRecordCount > 20; + var showControls = totalRecordCount > limit; html += '
'; @@ -449,6 +535,13 @@ reloadBrowsableImages(page); }); + $('#selectImageProvider', page).on('change', function () { + + browsableImageStartIndex = 0; + + reloadBrowsableImages(page); + }); + }).on('pageshow', "#editItemImagesPage", function () { var page = this; diff --git a/packages.config b/packages.config index ba7498605a..fb2cf4df5b 100644 --- a/packages.config +++ b/packages.config @@ -1,6 +1,6 @@  - + \ No newline at end of file