diff --git a/dashboard-ui/index.html b/dashboard-ui/index.html index 8c1abcd237..bc28eaec97 100644 --- a/dashboard-ui/index.html +++ b/dashboard-ui/index.html @@ -12,19 +12,7 @@
-
-
- - -

${HeaderLatestMedia}

- -
-
+
diff --git a/dashboard-ui/mypreferenceswebclient.html b/dashboard-ui/mypreferenceswebclient.html index 1f2dc4064c..037d7b143d 100644 --- a/dashboard-ui/mypreferenceswebclient.html +++ b/dashboard-ui/mypreferenceswebclient.html @@ -21,6 +21,38 @@
+
${HeaderThisDevice} diff --git a/dashboard-ui/scripts/indexpage.js b/dashboard-ui/scripts/indexpage.js index 84d5f77bcd..d6b0c34ab5 100644 --- a/dashboard-ui/scripts/indexpage.js +++ b/dashboard-ui/scripts/indexpage.js @@ -82,7 +82,23 @@ return html; } - function refreshMediaLibrary(page) { + function getDefaultSection(index) { + + switch (index) { + + case 0: + return 'librarybuttons'; + case 1: + return 'resume'; + case 2: + return 'latestmedia'; + default: + return ''; + } + + } + + function loadlibraryButtons(elem, userId, index) { var options = { @@ -90,10 +106,8 @@ Fields: "PrimaryImageAspectRatio" }; - var userId = Dashboard.getCurrentUserId(); - var promise1 = ApiClient.getItems(userId, options); - + var promise2 = ApiClient.getLiveTvInfo(); var promise3 = $.getJSON(ApiClient.getUrl("Channels", { @@ -103,7 +117,7 @@ limit: 0 })); - $.when(promise1, promise2, promise3).done(function(r1, r2, r3) { + $.when(promise1, promise2, promise3).done(function (r1, r2, r3) { var result = r1[0]; var liveTvInfo = r2[0]; @@ -122,7 +136,7 @@ var showLiveTv = liveTvInfo.EnabledUsers.indexOf(userId) != -1; if (showLiveTv) { - + result.Items.push({ Name: 'Live TV', CollectionType: 'livetv', @@ -131,59 +145,31 @@ }); } - $('.myLibrary', page).html(createMediaLinks({ + var html = ''; + + if (index) { + html += '

My Library

'; + } + html += '
'; + html += createMediaLinks({ items: result.Items, shape: 'myLibrary', showTitle: true, centerText: true - })); + }); + html += '
'; + + $(elem).html(html); }); } - $(document).on('pagebeforeshow', "#indexPage", function () { + function loadRecentlyAdded(elem, userId) { var screenWidth = $(window).width(); - var page = this; - - refreshMediaLibrary(page); - var options = { - SortBy: "DatePlayed", - SortOrder: "Descending", - MediaTypes: "Video", - Filters: "IsResumable", - Limit: screenWidth >= 1920 ? 5 : (screenWidth >= 1440 ? 4 : 3), - Recursive: true, - Fields: "PrimaryImageAspectRatio", - CollapseBoxSetItems: false, - ExcludeLocationTypes: "Virtual" - }; - - ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { - - if (result.Items.length) { - $('#resumableSection', page).show(); - } else { - $('#resumableSection', page).hide(); - } - - $('#resumableItems', page).html(LibraryBrowser.getPosterViewHtml({ - items: result.Items, - preferBackdrop: true, - shape: 'backdrop', - overlayText: screenWidth >= 600, - showTitle: true, - showParentTitle: true - - })).createPosterItemMenus(); - - }); - - options = { - SortBy: "DateCreated", SortOrder: "Descending", Limit: screenWidth >= 2400 ? 30 : (screenWidth >= 1920 ? 20 : (screenWidth >= 1440 ? 12 : (screenWidth >= 800 ? 12 : 8))), @@ -194,18 +180,139 @@ ExcludeLocationTypes: "Virtual,Remote" }; - ApiClient.getItems(Dashboard.getCurrentUserId(), options).done(function (result) { + ApiClient.getItems(userId, options).done(function (result) { - $('#recentlyAddedItems', page).html(LibraryBrowser.getPosterViewHtml({ + var html = ''; + html += '

Latest Media

'; + html += '
'; + html += LibraryBrowser.getPosterViewHtml({ items: result.Items, preferThumb: true, shape: 'backdrop', showTitle: true, centerText: true + }); + html += '
'; - })).createPosterItemMenus(); + $(elem).html(html).createPosterItemMenus(); }); + } + + function loadLibraryTiles(elem, userId) { + + var options = { + + SortBy: "SortName", + Fields: "PrimaryImageAspectRatio" + }; + + ApiClient.getItems(userId, options).done(function (result) { + + var html = ''; + + html += '

My Library

'; + html += '
'; + html += LibraryBrowser.getPosterViewHtml({ + items: result.Items, + preferThumb: true, + shape: 'backdrop', + showTitle: true, + centerText: true + }); + html += '
'; + + $(elem).html(html).createPosterItemMenus(); + }); + } + + function loadResume(elem, userId) { + + var screenWidth = $(window).width(); + + var options = { + + SortBy: "DatePlayed", + SortOrder: "Descending", + MediaTypes: "Video", + Filters: "IsResumable", + Limit: screenWidth >= 1920 ? 10 : (screenWidth >= 1440 ? 8 : 6), + Recursive: true, + Fields: "PrimaryImageAspectRatio", + CollapseBoxSetItems: false, + ExcludeLocationTypes: "Virtual" + }; + + ApiClient.getItems(userId, options).done(function (result) { + + var html = ''; + + html += '

Resume

'; + html += '
'; + html += LibraryBrowser.getPosterViewHtml({ + items: result.Items, + preferBackdrop: true, + shape: 'backdrop', + overlayText: screenWidth >= 600, + showTitle: true, + showParentTitle: true + }); + html += '
'; + + $(elem).html(html).createPosterItemMenus(); + }); + } + + function loadSection(page, userId, displayPreferences, index) { + + var section = displayPreferences.CustomPrefs['home' + index] || getDefaultSection(index); + + var elem = $('.section' + index, page); + + if (section == 'latestmedia') { + loadRecentlyAdded(elem, userId); + } + else if (section == 'librarytiles') { + loadLibraryTiles(elem, userId); + } + else if (section == 'resume') { + loadResume(elem, userId); + } + else if (section == 'librarybuttons') { + loadlibraryButtons(elem, userId, index); + } + } + + function loadSections(page, userId, displayPreferences) { + + var i, length; + var sectionCount = 3; + var html = ''; + + for (i = 0, length = sectionCount; i < length; i++) { + + html += '
'; + } + + $('.sections', page).html(html); + + for (i = 0, length = sectionCount; i < length; i++) { + + loadSection(page, userId, displayPreferences, i); + } + } + + $(document).on('pagebeforeshow', "#indexPage", function () { + + var page = this; + + var userId = Dashboard.getCurrentUserId(); + + ApiClient.getDisplayPreferences('home', userId, 'webclient').done(function (result) { + + loadSections(page, userId, result); + }); + }); })(jQuery, document, ApiClient); \ No newline at end of file diff --git a/dashboard-ui/scripts/mypreferenceswebclient.js b/dashboard-ui/scripts/mypreferenceswebclient.js index cf6b87d987..1ddfe1e3fd 100644 --- a/dashboard-ui/scripts/mypreferenceswebclient.js +++ b/dashboard-ui/scripts/mypreferenceswebclient.js @@ -1,22 +1,31 @@ (function ($, window, document) { - function loadForm(page, user) { + function loadForm(page, userId, displayPreferences) { - $('#selectThemeSong', page).val(LocalSettings.val('enableThemeSongs', user.Id) || '').selectmenu("refresh"); - $('#selectBackdrop', page).val(LocalSettings.val('enableBackdrops', user.Id) || '').selectmenu("refresh"); + $('#selectThemeSong', page).val(LocalSettings.val('enableThemeSongs', userId) || '').selectmenu("refresh"); + $('#selectBackdrop', page).val(LocalSettings.val('enableBackdrops', userId) || '').selectmenu("refresh"); + + $('#selectHomeSection1', page).val(displayPreferences.CustomPrefs.home0 || '').selectmenu("refresh"); + $('#selectHomeSection2', page).val(displayPreferences.CustomPrefs.home1 || '').selectmenu("refresh"); + $('#selectHomeSection3', page).val(displayPreferences.CustomPrefs.home2 || '').selectmenu("refresh"); Dashboard.hideLoadingMsg(); } - function saveUser(page, user) { + function saveUser(page, userId, displayPreferences) { - LocalSettings.val('enableThemeSongs', user.Id, $('#selectThemeSong', page).val()); - LocalSettings.val('enableBackdrops', user.Id, $('#selectBackdrop', page).val()); + LocalSettings.val('enableThemeSongs', userId, $('#selectThemeSong', page).val()); + LocalSettings.val('enableBackdrops', userId, $('#selectBackdrop', page).val()); - //ApiClient.updateUser(user).done(function () { - //Dashboard.alert(Globalize.translate("SettingsSaved")); - //}); - Dashboard.alert(Globalize.translate("SettingsSaved")); + displayPreferences.CustomPrefs.home0 = $('#selectHomeSection1', page).val(); + displayPreferences.CustomPrefs.home1 = $('#selectHomeSection2', page).val(); + displayPreferences.CustomPrefs.home2 = $('#selectHomeSection3', page).val(); + + ApiClient.updateDisplayPreferences('home', displayPreferences, userId, 'webclient').done(function () { + + Dashboard.alert(Globalize.translate("SettingsSaved")); + + }); } function onSubmit() { @@ -27,9 +36,9 @@ var userId = getParameterByName('userId') || Dashboard.getCurrentUserId(); - ApiClient.getUser(userId).done(function (result) { + ApiClient.getDisplayPreferences('home', userId, 'webclient').done(function (result) { - saveUser(page, result); + saveUser(page, userId, result); }); @@ -49,12 +58,11 @@ var userId = getParameterByName('userId') || Dashboard.getCurrentUserId(); - ApiClient.getUser(userId).done(function (user) { + ApiClient.getDisplayPreferences('home', userId, 'webclient').done(function (result) { - loadForm(page, user); + loadForm(page, userId, result); }); - }); window.WebClientPreferencesPage = { diff --git a/dashboard-ui/thirdparty/mediabrowser.apiclient.js b/dashboard-ui/thirdparty/mediabrowser.apiclient.js index 08dfc82ef4..7953f680fc 100644 --- a/dashboard-ui/thirdparty/mediabrowser.apiclient.js +++ b/dashboard-ui/thirdparty/mediabrowser.apiclient.js @@ -162,7 +162,7 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi self.sendWebSocketMessage("Identity", clientName + "|" + deviceId + "|" + applicationVersion + "|" + deviceName); $(self).trigger("websocketopen"); - + }, 500); }; webSocket.onerror = function () { @@ -186,7 +186,7 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi self.sendWebSocketMessage = function (name, data) { console.log('Sending web socket message: ' + name); - + var msg = { MessageType: name }; if (data) { @@ -873,6 +873,35 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi }); }; + self.getDisplayPreferences = function (id, userId, app) { + + var url = self.getUrl("DisplayPreferences/" + id, { + userId: userId, + client: app + }); + + return self.ajax({ + type: "GET", + url: url, + dataType: "json" + }); + }; + + self.updateDisplayPreferences = function (id, obj, userId, app) { + + var url = self.getUrl("DisplayPreferences/" + id, { + userId: userId, + client: app + }); + + return self.ajax({ + type: "POST", + url: url, + data: JSON.stringify(obj), + contentType: "application/json" + }); + }; + self.getSeasons = function (itemId, options) { var url = self.getUrl("Shows/" + itemId + "/Seasons", options); @@ -1761,7 +1790,7 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi throw new Error("File must be an image."); } - var url = self.getUrl("Items/" + itemId + "/Images"); + var url = self.getUrl("Items/" + itemId + "/Images"); url += "/" + imageType; @@ -2044,7 +2073,7 @@ MediaBrowser.ApiClient = function ($, navigator, JSON, WebSocket, setTimeout, wi if (ratio) { if (options.width) { - + options.width = Math.round(options.width * ratio); } if (options.height) {