diff --git a/dashboard-ui/scripts/autobackdrops.js b/dashboard-ui/scripts/autobackdrops.js
new file mode 100644
index 0000000000..f21bd7bf41
--- /dev/null
+++ b/dashboard-ui/scripts/autobackdrops.js
@@ -0,0 +1,115 @@
+define(['backdrop', 'appStorage'], function (backdrop, appStorage) {
+
+ function isEnabledByDefault() {
+
+ if (AppInfo.hasLowImageBandwidth) {
+
+ return false;
+ }
+
+ return false;
+ }
+
+ function enabled() {
+
+ var userId = Dashboard.getCurrentUserId();
+
+ var val = appStorage.getItem('enableBackdrops-' + userId);
+
+ // For bandwidth
+ return val == '1' || (val != '0' && isEnabledByDefault());
+ }
+
+ var cache = {};
+
+ function getBackdropItemIds(apiClient, userId, types, parentId) {
+
+ var key = 'backdrops2_' + userId + (types || '') + (parentId || '');
+
+ var data = cache[key];
+
+ if (data) {
+
+ console.log('Found backdrop id list in cache. Key: ' + key)
+ data = JSON.parse(data);
+ return Promise.resolve(data);
+ } else {
+
+ var options = {
+
+ SortBy: "IsFavoriteOrLiked,Random",
+ Limit: 20,
+ Recursive: true,
+ IncludeItemTypes: types,
+ ImageTypes: "Backdrop",
+ //Ids: "8114409aa00a2722456c08e298f90bed",
+ ParentId: parentId
+ };
+
+ return apiClient.getItems(Dashboard.getCurrentUserId(), options).then(function (result) {
+
+ var images = result.Items.map(function (i) {
+ return {
+ Id: i.Id,
+ tag: i.BackdropImageTags[0],
+ ServerId: i.ServerId
+ };
+ });
+
+ cache[key] = JSON.stringify(images);
+ return images;
+ });
+ }
+ }
+
+ function showBackdrop(type, parentId) {
+
+ var apiClient = window.ApiClient;
+
+ if (!apiClient) {
+ return;
+ }
+
+ getBackdropItemIds(apiClient, Dashboard.getCurrentUserId(), type, parentId).then(function (images) {
+
+ if (images.length) {
+
+ backdrop.setBackdrops(images.map(function (i) {
+ i.BackdropImageTags = [i.tag];
+ return i;
+ }));
+
+ } else {
+
+ backdrop.clear();
+ }
+ });
+ }
+
+ pageClassOn('pagebeforeshow', "page", function () {
+
+ var page = this;
+
+ // These pages self-manage their backdrops
+ if (page.classList.contains('selfBackdropPage')) {
+ return;
+ }
+
+ if (page.classList.contains('backdropPage')) {
+
+ if (enabled()) {
+ var type = page.getAttribute('data-backdroptype');
+
+ var parentId = page.classList.contains('globalBackdropPage') ? '' : LibraryMenu.getTopParentId();
+ showBackdrop(type, parentId);
+
+ } else {
+ page.classList.remove('backdropPage');
+ backdrop.clear();
+ }
+ } else {
+ backdrop.clear();
+ }
+
+ });
+});
\ No newline at end of file
diff --git a/dashboard-ui/scripts/backdrops.js b/dashboard-ui/scripts/backdrops.js
deleted file mode 100644
index c2e0bfbac2..0000000000
--- a/dashboard-ui/scripts/backdrops.js
+++ /dev/null
@@ -1,249 +0,0 @@
-define(['appStorage'], function (appStorage) {
-
- var pageBackgroundCreated;
-
- function getElement() {
-
- //var elem = $('.backdropContainer');
-
- //if (!elem.length) {
-
- // elem = $('
').prependTo(document.body);
- //}
-
- var elem = document.documentElement;
-
- elem.classList.add('backdropContainer');
- elem.classList.add('noFade');
-
- if (!pageBackgroundCreated) {
- pageBackgroundCreated = true;
- var div = document.createElement('div');
- div.classList.add('pageBackground');
- document.body.insertBefore(div, document.body.firstChild);
- }
-
- return elem;
- }
-
- function clearBackdrop() {
-
- var elem = document.documentElement;
- elem.classList.remove('backdropContainer');
- elem.removeAttribute('data-url');
- elem.style.backgroundImage = '';
- }
-
- function getRandom(min, max) {
- return Math.floor(Math.random() * (max - min) + min);
- }
-
- var cache = {};
-
- function getBackdropItemIds(apiClient, userId, types, parentId) {
-
- var key = 'backdrops2_' + userId + (types || '') + (parentId || '');
-
- var deferred = $.Deferred();
-
- var data = cache[key];
-
- if (data) {
-
- console.log('Found backdrop id list in cache. Key: ' + key)
- data = JSON.parse(data);
- deferred.resolveWith(null, [data]);
- } else {
-
- var options = {
-
- SortBy: "IsFavoriteOrLiked,Random",
- Limit: 20,
- Recursive: true,
- IncludeItemTypes: types,
- ImageTypes: "Backdrop",
- //Ids: "8114409aa00a2722456c08e298f90bed",
- ParentId: parentId
- };
-
- apiClient.getItems(Dashboard.getCurrentUserId(), options).then(function (result) {
-
- var images = result.Items.map(function (i) {
- return {
- id: i.Id,
- tag: i.BackdropImageTags[0]
- };
- });
-
- cache[key] = JSON.stringify(images);
- deferred.resolveWith(null, [images]);
- });
- }
-
- return deferred.promise();
- }
-
- function setBackdropImage(elem, url) {
-
- if (url == elem.getAttribute('data-url')) {
- return;
- }
-
- elem.setAttribute('data-url', url);
- ImageLoader.lazyImage(elem, url);
- }
-
- function showBackdrop(type, parentId) {
-
- var apiClient = window.ApiClient;
-
- if (!apiClient) {
- return;
- }
-
- getBackdropItemIds(apiClient, Dashboard.getCurrentUserId(), type, parentId).then(function (images) {
-
- if (images.length) {
-
- var index = getRandom(0, images.length - 1);
- var item = images[index];
-
- var screenWidth = $(window).width();
-
- var imgUrl = apiClient.getScaledImageUrl(item.id, {
- type: "Backdrop",
- tag: item.tag,
- maxWidth: screenWidth,
- quality: 50
- });
-
- setBackdropImage(getElement(), imgUrl);
-
- } else {
-
- clearBackdrop();
- }
- });
- }
-
- function setDefault(page) {
-
- var elem = getElement();
- elem.style.backgroundImage = "url(css/images/splash.jpg)";
- elem.setAttribute('data-url', 'css/images/splash.jpg');
- page = $(page)[0];
- page.classList.add('backdropPage');
- page.classList.add('staticBackdropPage');
- }
-
- function isEnabledByDefault() {
-
- if (AppInfo.hasLowImageBandwidth) {
-
- return false;
- }
-
- return false;
- }
-
- function enabled() {
-
- var userId = Dashboard.getCurrentUserId();
-
- var val = appStorage.getItem('enableBackdrops-' + userId);
-
- // For bandwidth
- return val == '1' || (val != '0' && isEnabledByDefault());
- }
-
- function setBackdrops(page, items) {
-
- var images = items.map(function (i) {
-
- if (i.BackdropImageTags.length > 0) {
- return {
- id: i.Id,
- tag: i.BackdropImageTags[0]
- };
- }
-
- if (i.ParentBackdropItemId && i.ParentBackdropImageTags && i.ParentBackdropImageTags.length) {
-
- return {
- id: i.ParentBackdropItemId,
- tag: i.ParentBackdropImageTags[0]
- };
- }
- return null;
-
- }).filter(function (i) {
- return i != null;
- });
-
- if (images.length) {
- page.classList.add('backdropPage');
-
- var index = getRandom(0, images.length - 1);
- var item = images[index];
-
- var screenWidth = $(window).width();
-
- var imgUrl = ApiClient.getScaledImageUrl(item.id, {
- type: "Backdrop",
- tag: item.tag,
- maxWidth: screenWidth,
- quality: 50
- });
-
- setBackdropImage(getElement(), imgUrl);
-
- } else {
- page.classList.remove('backdropPage');
- }
- }
-
- function setBackdropUrl(page, url) {
-
- if (url) {
- page.classList.add('backdropPage');
-
- setBackdropImage(getElement(), url);
-
- } else {
- page.classList.remove('backdropPage');
- clearBackdrop();
- }
- }
-
- pageClassOn('pagebeforeshow', "page", function () {
-
- var page = this;
-
- if (page.classList.contains('backdropPage')) {
-
- if (enabled()) {
- var type = page.getAttribute('data-backdroptype');
-
- var parentId = page.classList.contains('globalBackdropPage') ? '' : LibraryMenu.getTopParentId();
-
- showBackdrop(type, parentId);
-
- } else {
- page.classList.remove('backdropPage');
- clearBackdrop();
- }
- } else {
- clearBackdrop();
- }
-
- });
-
- window.Backdrops = {
-
- setBackdrops: setBackdrops,
- setBackdropUrl: setBackdropUrl,
- setDefault: setDefault,
- clear: clearBackdrop
- };
-
-});
\ No newline at end of file
diff --git a/dashboard-ui/scripts/itemdetailpage.js b/dashboard-ui/scripts/itemdetailpage.js
index 7654776f5f..af75d01fef 100644
--- a/dashboard-ui/scripts/itemdetailpage.js
+++ b/dashboard-ui/scripts/itemdetailpage.js
@@ -73,7 +73,9 @@
// For these types, make the backdrop a little smaller so that the items are more quickly accessible
if (item.Type == 'MusicArtist' || item.Type == "MusicAlbum" || item.Type == "Playlist" || item.Type == "BoxSet" || item.Type == "Audio") {
$('#itemBackdrop', page).addClass('noBackdrop').css('background-image', 'none');
- Backdrops.setBackdrops(page, [item]);
+ require(['backdrop'], function (backdrop) {
+ backdrop.setBackdrops([item]);
+ });
}
else {
//$('#itemBackdrop', page).addClass('noBackdrop').css('background-image', 'none');
diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js
index a8f66ec0f6..1e60f4cf0d 100644
--- a/dashboard-ui/scripts/site.js
+++ b/dashboard-ui/scripts/site.js
@@ -1767,6 +1767,8 @@ var AppInfo = {};
define("actionsheet", [embyWebComponentsBowerPath + "/actionsheet/actionsheet"], returnFirstDependency);
}
+ define("backdrop", [embyWebComponentsBowerPath + "/backdrop/backdrop"], returnFirstDependency);
+
// hack for an android test before browserInfo is loaded
if (Dashboard.isRunningInCordova() && window.MainActivity) {
paths.appStorage = "cordova/android/appstorage";
@@ -2242,7 +2244,6 @@ var AppInfo = {};
deps.push('scripts/search');
deps.push('scripts/librarylist');
- deps.push('scripts/backdrops');
deps.push('scripts/librarymenu');
deps.push('scripts/librarybrowser');
deps.push('jqm');
@@ -2262,6 +2263,7 @@ var AppInfo = {};
postInitDependencies.push('scripts/remotecontrol');
postInitDependencies.push('css!css/notifications.css');
postInitDependencies.push('css!css/chromecast.css');
+ postInitDependencies.push('scripts/autobackdrops');
if (Dashboard.isRunningInCordova()) {