diff --git a/ApiClient.js b/ApiClient.js index 3606396652..9a75c12be0 100644 --- a/ApiClient.js +++ b/ApiClient.js @@ -306,16 +306,20 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi }); }; - self.getAvailableRemoteImages = function (itemId, imageType) { + self.getAvailableRemoteImages = function (options) { - if (!itemId) { - throw new Error("null itemId"); - } - if (!imageType) { - throw new Error("null imageType"); + if (!options) { + throw new Error("null options"); } - var url = self.getUrl("Items/" + itemId + "/RemoteImages/" + imageType); + var urlPrefix = "Items/" + options.itemId; + + var imageType = options.imageType; + + delete options.itemId; + delete options.imageType; + + var url = self.getUrl(urlPrefix + "/RemoteImages/" + imageType, options); return self.ajax({ type: "GET", diff --git a/dashboard-ui/css/metadataeditor.css b/dashboard-ui/css/metadataeditor.css index 3cf2391178..6ee5b156b4 100644 --- a/dashboard-ui/css/metadataeditor.css +++ b/dashboard-ui/css/metadataeditor.css @@ -26,8 +26,54 @@ top: -2px; } +.availableImagesList { + overflow-y: auto; + width: 300px; + height: 500px; + text-align: center; +} + +.remoteImageContainer { + display: inline-block; + border: 1px solid #ccc; + margin: 5px; + vertical-align: top; +} + +.remoteImageDetails { + background: #eee; + padding: 3px 5px; +} + +.remoteImage { + background-position: center bottom; + background-repeat: no-repeat; + background-size: contain; +} + +.remotePosterImage { + width: 150px; + height: 225px; +} + +.remoteBackdropImage { + width: 272px; + height: 153px; +} + +@media all and (min-width: 500px) { + + .availableImagesList { + width: 400px; + } +} + @media all and (min-width: 600px) { + .availableImagesList { + width: 500px; + } + .editPageSidebar { position: fixed; top: 36px; @@ -44,3 +90,110 @@ width: 70%; } } + + +@media all and (min-width: 700px) { + + .availableImagesList { + width: 600px; + } +} + +@media all and (min-width: 800px) { + + .availableImagesList { + width: 700px; + } +} + +@media all and (min-width: 900px) { + + .availableImagesList { + width: 800px; + } +} + +@media all and (min-width: 1000px) { + + .availableImagesList { + width: 900px; + } +} + +@media all and (min-width: 1100px) { + + .availableImagesList { + width: 1000px; + } +} + +@media all and (min-width: 1200px) { + + .availableImagesList { + width: 1100px; + } +} + +@media all and (min-width: 1300px) { + + .availableImagesList { + width: 1200px; + } +} + +@media all and (min-width: 1400px) { + + .availableImagesList { + width: 1300px; + } +} + +@media all and (min-width: 1500px) { + + .availableImagesList { + width: 1400px; + } +} + +@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 { + height: 600px; + } +} + +@media all and (min-height: 900px) { + + .availableImagesList { + height: 700px; + } +} + diff --git a/dashboard-ui/edititemimages.html b/dashboard-ui/edititemimages.html index e824101475..96ca27f262 100644 --- a/dashboard-ui/edititemimages.html +++ b/dashboard-ui/edititemimages.html @@ -23,7 +23,8 @@
-