diff --git a/src/components/themes/blueradiance/theme.css b/src/components/themes/blueradiance/theme.css index 3af56f79b7..f450404bea 100644 --- a/src/components/themes/blueradiance/theme.css +++ b/src/components/themes/blueradiance/theme.css @@ -49,7 +49,7 @@ html { } .backgroundContainer.withBackdrop { - opacity: .93 + opacity: .86 } @media (orientation:portrait) { diff --git a/src/components/themes/light/theme.css b/src/components/themes/light/theme.css index dfac15ec7c..6da511dfd2 100644 --- a/src/components/themes/light/theme.css +++ b/src/components/themes/light/theme.css @@ -48,7 +48,7 @@ html { } .backgroundContainer.withBackdrop { - background-color: rgba(255, 255, 255, .94) + background-color: rgba(255, 255, 255, .80) } .dialog { diff --git a/src/components/themes/purple-haze/theme.css b/src/components/themes/purple-haze/theme.css index 1bba1e6145..566af827ee 100644 --- a/src/components/themes/purple-haze/theme.css +++ b/src/components/themes/purple-haze/theme.css @@ -49,7 +49,7 @@ html { } .backgroundContainer.withBackdrop { - opacity: .93 + opacity: .86 } @media (orientation:portrait) { diff --git a/src/controllers/itemdetailpage.js b/src/controllers/itemdetailpage.js index 1ce35efe4c..53a36aa862 100644 --- a/src/controllers/itemdetailpage.js +++ b/src/controllers/itemdetailpage.js @@ -1,4 +1,4 @@ -define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuilder", "datetime", "mediaInfo", "backdrop", "listView", "itemContextMenu", "itemHelper", "dom", "indicators", "apphost", "imageLoader", "libraryMenu", "globalize", "browser", "events", "scrollHelper", "playbackManager", "libraryBrowser", "scrollStyles", "emby-itemscontainer", "emby-checkbox", "emby-button", "emby-playstatebutton", "emby-ratingbutton", "emby-scroller", "emby-select"], function (loading, appRouter, layoutManager, connectionManager, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, dom, indicators, appHost, imageLoader, libraryMenu, globalize, browser, events, scrollHelper, playbackManager, libraryBrowser) { +define(["loading", "appRouter", "layoutManager", "userSettings", "connectionManager", "cardBuilder", "datetime", "mediaInfo", "backdrop", "listView", "itemContextMenu", "itemHelper", "dom", "indicators", "apphost", "imageLoader", "libraryMenu", "globalize", "browser", "events", "scrollHelper", "playbackManager", "libraryBrowser", "scrollStyles", "emby-itemscontainer", "emby-checkbox", "emby-button", "emby-playstatebutton", "emby-ratingbutton", "emby-scroller", "emby-select"], function (loading, appRouter, layoutManager, userSettings, connectionManager, cardBuilder, datetime, mediaInfo, backdrop, listView, itemContextMenu, itemHelper, dom, indicators, appHost, imageLoader, libraryMenu, globalize, browser, events, scrollHelper, playbackManager, libraryBrowser) { "use strict"; function getPromise(apiClient, params) { @@ -445,6 +445,20 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild } } + function enabled() { + return userSettings.enableBackdrops(); + } + + function renderBackdrop(page, item, apiClient) { + if (enabled()) { + if (dom.getWindowSize().innerWidth >= 1000) { + backdrop.setBackdrops([item]); + } else { + backdrop.clear(); + } + } + } + function renderDetailPageBackdrop(page, item, apiClient) { var imgUrl; var screenWidth = screen.availWidth; @@ -520,13 +534,7 @@ define(["loading", "appRouter", "layoutManager", "connectionManager", "cardBuild setInitialCollapsibleState(page, item, apiClient, context, user); renderDetails(page, item, apiClient, context); renderTrackSelections(page, instance, item); - - if (dom.getWindowSize().innerWidth >= 1000) { - backdrop.setBackdrops([item]); - } else { - backdrop.clear(); - } - + renderBackdrop(page, item, apiClient); renderDetailPageBackdrop(page, item, apiClient); var canPlay = reloadPlayButtons(page, item);