From 83d7b945d798dfd34e862b95265fe84c6b10101e Mon Sep 17 00:00:00 2001 From: Luke Pulverenti Date: Sat, 25 Oct 2014 14:32:58 -0400 Subject: [PATCH] connect updates --- dashboard-ui/connectlogin.html | 2 +- dashboard-ui/css/librarybrowser.css | 6 +- dashboard-ui/css/librarymenu.css | 47 ++--- dashboard-ui/css/notifications.css | 2 +- dashboard-ui/css/site.css | 5 +- dashboard-ui/scripts/aboutpage.js | 7 +- dashboard-ui/scripts/connectlogin.js | 92 ++------- dashboard-ui/scripts/externalplayer.js | 2 +- dashboard-ui/scripts/indexpage.js | 4 +- dashboard-ui/scripts/librarylist.js | 14 +- dashboard-ui/scripts/librarymenu.js | 58 ++++-- dashboard-ui/scripts/livetvchannel.js | 2 +- dashboard-ui/scripts/mediacontroller.js | 14 +- dashboard-ui/scripts/mediaplayer.js | 2 +- dashboard-ui/scripts/notifications.js | 61 ++++-- dashboard-ui/scripts/pluginspage.js | 22 +- dashboard-ui/scripts/remotecontrol.js | 97 +++++---- dashboard-ui/scripts/selectserver.js | 120 +++++++++++ dashboard-ui/scripts/site.js | 153 +++++++------- dashboard-ui/scripts/userprofilespage.js | 4 +- dashboard-ui/selectserver.html | 24 +++ .../thirdparty/apiclient/connectionmanager.js | 189 +++++++++++++++--- .../thirdparty/apiclient/credentials.js | 5 + .../apiclient/mediabrowser.apiclient.js | 64 ++++-- dashboard-ui/useredit.html | 2 +- 25 files changed, 686 insertions(+), 312 deletions(-) create mode 100644 dashboard-ui/scripts/selectserver.js create mode 100644 dashboard-ui/selectserver.html diff --git a/dashboard-ui/connectlogin.html b/dashboard-ui/connectlogin.html index c5e7b33dc2..6d5c93c339 100644 --- a/dashboard-ui/connectlogin.html +++ b/dashboard-ui/connectlogin.html @@ -3,7 +3,7 @@ ${TitleSignIn} - +
diff --git a/dashboard-ui/css/librarybrowser.css b/dashboard-ui/css/librarybrowser.css index ca6fd53851..fbf98d397c 100644 --- a/dashboard-ui/css/librarybrowser.css +++ b/dashboard-ui/css/librarybrowser.css @@ -12,16 +12,16 @@ margin-left: .5em; } -.libraryPage { +.libraryPage[data-theme='b'] { background-color: #202020; } .backdropPage { - background-color: rgba(15, 15,15, .86) !important; + background-color: rgba(20, 20,20, .86) !important; } .backdropPage:not(.lightBackdropPage) { - background-color: rgba(15, 15,15, .94) !important; + background-color: rgba(20, 20,20, .94) !important; } .backdropContainer { diff --git a/dashboard-ui/css/librarymenu.css b/dashboard-ui/css/librarymenu.css index 4b3235f4e9..00a613ab03 100644 --- a/dashboard-ui/css/librarymenu.css +++ b/dashboard-ui/css/librarymenu.css @@ -3,7 +3,7 @@ } .libraryPage:not(.metadataEditorPage):not(.noSecondaryNavPage) { - padding-top: 100px !important; + padding-top: 95px !important; } .libraryMenuDivider { @@ -149,23 +149,19 @@ left: 0; z-index: 1000; top: 0; - background-image: linear-gradient(#262626,#111); - border-bottom: 1px solid #111; border-top: 0; border-left: 0; border-right: 0; } .libraryViewNav { - height: 48px; + height: 45px; overflow: hidden; position: fixed; right: 0; left: 0; - top: 51px; + top: 50px; z-index: 1000; - background-image: linear-gradient(#1a1a1a,#1a1a1a); - border-bottom: 1px solid #111; text-align: center; font-size: 14px; white-space: nowrap; @@ -175,6 +171,14 @@ overflow: -moz-scrollbars-none; } +.viewMenuBar { + background-color: #000; +} + +.libraryViewNav { + background-color: #111; +} + .libraryViewNav::-webkit-scrollbar { height: 0 !important; display: none; @@ -182,7 +186,7 @@ .viewMenuLink { text-decoration: none; - color: #ccc !important; + color: #eee !important; padding: 7px .5em 6px; display: inline-block; vertical-align: middle; @@ -213,13 +217,13 @@ .viewMenuTextLink { display: block; - padding: .6em .5em .6em 38px !important; - font-size: 15px; + padding: .65em .5em .55em 38px !important; + font-size: 14px; font-weight: 300 !important; font-family: Roboto; background-repeat: no-repeat; - background-size: 14px 14px; - background-position: 13px center; + background-size: 13px 13px; + background-position: 12px center; } .musicViewMenu { @@ -227,7 +231,10 @@ } .homeViewMenu { - background-image: url(images/items/folders/home.png); + background-image: url(images/mblogoicon.png); + background-size: 39px 26px; + background-position: 10px center; + padding-left: 60px !important; } .tvshowsViewMenu, .livetvViewMenu { @@ -315,7 +322,7 @@ margin: 0 0; position: relative; font-weight: normal; - border-bottom: 5px solid transparent; + border-bottom: 4px solid transparent; } .libraryViewNav a:not(.ui-btn-active):hover { @@ -324,17 +331,7 @@ .libraryViewNavLinkContent { display: inline-block; - padding: 2px 15px 2px 15px; -} - -.libraryViewNav a + a .libraryViewNavLinkContent { - padding-left: 17px; -} - -.libraryViewNav a + a .libraryViewNavLinkContent { - border-left: 1px solid #333; - position: relative; - left: -2px; + padding: 1px 13px 1px 13px; } @media all and (max-width: 500px) { diff --git a/dashboard-ui/css/notifications.css b/dashboard-ui/css/notifications.css index c5b823bf84..0f617cfcf5 100644 --- a/dashboard-ui/css/notifications.css +++ b/dashboard-ui/css/notifications.css @@ -16,7 +16,7 @@ -moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; - padding: 4px 12px 5px; + padding: 4px 12px 4px; text-align: center; text-decoration: none !important; -moz-user-select: none; diff --git a/dashboard-ui/css/site.css b/dashboard-ui/css/site.css index c858579551..c009b42a37 100644 --- a/dashboard-ui/css/site.css +++ b/dashboard-ui/css/site.css @@ -64,10 +64,7 @@ body { h1, h1 a { font-weight: 300 !important; -} - -.libraryPage h1, .libraryPage h1 a { - font-weight: 100 !important; + font-size: 24px; } .ui-loader h1 { diff --git a/dashboard-ui/scripts/aboutpage.js b/dashboard-ui/scripts/aboutpage.js index c6991404bf..9cd8055a79 100644 --- a/dashboard-ui/scripts/aboutpage.js +++ b/dashboard-ui/scripts/aboutpage.js @@ -4,12 +4,9 @@ var page = this; - ApiClient.getSystemInfo().done(function (info) { + var elem = $('#appVersionNumber', page); - var elem = $('#appVersionNumber', page); - - elem.html(elem.html().replace('{0}', info.Version)); - }); + elem.html(elem.html().replace('{0}', ConnectionManager.appVersion())); }); })(jQuery, document); \ No newline at end of file diff --git a/dashboard-ui/scripts/connectlogin.js b/dashboard-ui/scripts/connectlogin.js index 57913524f9..d5e2891f71 100644 --- a/dashboard-ui/scripts/connectlogin.js +++ b/dashboard-ui/scripts/connectlogin.js @@ -2,89 +2,41 @@ function onLoggedIn() { - ConnectionManager.getServers().done(function (result) { + ConnectionManager.connect().done(function (result) { - if (result.length) { + Dashboard.hideLoadingMsg(); - connectToServerInstance(result[0]); + switch (result.State) { - } else { - Dashboard.alert('Coming soon'); + case MediaBrowser.ConnectionState.Unavilable: + // Login succeeded so this should never happen + break; + case MediaBrowser.ConnectionState.ServerSelection: + window.location = 'selectserver.html'; + break; + case MediaBrowser.ConnectionState.ServerSignIn: + // This should never happen in connect mode + break; + case MediaBrowser.ConnectionState.SignedIn: + window.location = 'selectserver.html'; + break; + default: + break; } }); } - function connectToServerInstance(server) { - - connectToServerAtUrl(server, server.Url).fail(function () { - - if (server.LocalAddress) { - connectToServerAtUrl(server, server.LocalAddress).fail(showServerConnectionFailure); - - } else { - showServerConnectionFailure(); - } - }); - } - - function showServerConnectionFailure() { - alert('Unable to communicate with your server.'); - } - - function connectToServerAtUrl(server, url) { - - var exchangeToken = server.AccessKey; - - return $.ajax({ - - type: "GET", - url: url + "/mediabrowser/Connect/Exchange?format=json&ConnectUserId=" + ConnectionManager.connectUserId(), - dataType: "json", - - error: function () { - // Don't show normal dashboard errors - }, - headers: { - "X-MediaBrowser-Token": exchangeToken - } - - - }).done(function (result) { - - Dashboard.serverAddress(url); - Dashboard.setCurrentUser(result.LocalUserId, result.AccessToken); - - window.location = 'index.html'; - - }); - } - function login(page, username, password) { - var md5 = CryptoJS.MD5(password).toString(); + Dashboard.showLoadingMsg(); - $.ajax({ - type: "POST", - url: "https://connect.mediabrowser.tv/service/user/authenticate", - data: { - userName: username, - password: md5 - }, - dataType: "json", - contentType: 'application/x-www-form-urlencoded; charset=UTF-8', - - error: function () { - // Don't show normal dashboard errors - } - - - }).done(function (result) { - - ConnectionManager.onConnectAuthenticated(result); + ConnectionManager.loginToConnect(username, password).done(function () { onLoggedIn(); - }).fail(function (result) { + }).fail(function () { + + Dashboard.hideLoadingMsg(); Dashboard.alert({ message: Globalize.translate('MessageInvalidUser'), diff --git a/dashboard-ui/scripts/externalplayer.js b/dashboard-ui/scripts/externalplayer.js index f3f11b9b48..4517502695 100644 --- a/dashboard-ui/scripts/externalplayer.js +++ b/dashboard-ui/scripts/externalplayer.js @@ -422,7 +422,7 @@ closePlayMenu(); - var html = '
'; + var html = '
'; html += '
    '; html += '
  • ' + Globalize.translate('HeaderSelectExternalPlayer') + '
    • '; diff --git a/dashboard-ui/scripts/indexpage.js b/dashboard-ui/scripts/indexpage.js index 5281dce20b..d4059b0e21 100644 --- a/dashboard-ui/scripts/indexpage.js +++ b/dashboard-ui/scripts/indexpage.js @@ -438,7 +438,7 @@ loadlibraryButtons: loadlibraryButtons }; -})(jQuery, document, ApiClient); +})(jQuery, document); (function ($, document) { @@ -595,4 +595,4 @@ }); -})(jQuery, document); \ No newline at end of file +})(jQuery, document); diff --git a/dashboard-ui/scripts/librarylist.js b/dashboard-ui/scripts/librarylist.js index 5af4525fdd..16de2f4b37 100644 --- a/dashboard-ui/scripts/librarylist.js +++ b/dashboard-ui/scripts/librarylist.js @@ -873,7 +873,7 @@ function onUserDataChanged(userData) { var cssClass = LibraryBrowser.getUserDataCssClass(userData.Key); - + if (!cssClass) { return; } @@ -904,6 +904,16 @@ } - $(ApiClient).on('websocketmessage', onWebSocketMessage); + function initializeApiClient(apiClient) { + $(apiClient).off('websocketmessage.librarylist', onWebSocketMessage).on('websocketmessage.librarylist', onWebSocketMessage); + } + + $(function () { + + $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { + + initializeApiClient(apiClient); + }); + }); })(jQuery, document, window); \ No newline at end of file diff --git a/dashboard-ui/scripts/librarymenu.js b/dashboard-ui/scripts/librarymenu.js index 0680532935..6132073d23 100644 --- a/dashboard-ui/scripts/librarymenu.js +++ b/dashboard-ui/scripts/librarymenu.js @@ -23,25 +23,31 @@ html += ''; html += '
'; html += ''; - + html += '
MEDIABROWSER
'; html += '
'; - html += ''; + if (user.localUser) { - html += ''; + html += ''; + + html += ''; + } else { + html += ''; + + } html += ''; var userButtonHeight = 21; - if (user.PrimaryImageTag) { + if (user.imageUrl) { - var url = ApiClient.getUserImageUrl(user.Id, { - height: userButtonHeight, - tag: user.PrimaryImageTag, - type: "Primary" - }); + var url = user.imageUrl; + + if (user.supportsImageParams) { + url += "height=" + userButtonHeight; + } html += ''; } else { @@ -50,7 +56,7 @@ html += ''; - if (user.Configuration.IsAdministrator) { + if (user.canManageServer) { html += ''; } @@ -118,9 +124,17 @@ function updateLibraryMenu(panel) { + var apiClient = ConnectionManager.currentApiClient(); + + if (!apiClient) { + + $('.adminMenuOptions').hide(); + return; + } + var userId = Dashboard.getCurrentUserId(); - ApiClient.getUserViews(userId).done(function (result) { + apiClient.getUserViews(userId).done(function (result) { var items = result.Items; @@ -136,7 +150,7 @@ else if (i.CollectionType == "livetv") { itemId = "livetv"; } - + if (i.Type == 'Channel') { viewMenuCssClass = 'channelsViewMenu'; } @@ -166,7 +180,7 @@ var requiresLibraryMenuRefresh = false; - function getLibraryMenu() { + function getLibraryMenu(user) { var panel = $('#libraryPanel'); @@ -178,7 +192,10 @@ html += '
'; - html += '' + Globalize.translate('ButtonHome') + ''; + var homeHref = ConnectionManager.currentApiClient() ? 'index.html' : 'selectserver.html'; + + html += '' + Globalize.translate('ButtonHome') + ''; + html += '
'; html += getViewsHtml(); @@ -364,7 +381,7 @@ var page = this; if (!$('.viewMenuBar').length) { - Dashboard.getCurrentUser().done(function (user) { + ConnectionManager.user().done(function (user) { renderHeader(user); @@ -379,7 +396,7 @@ } var jpage = $(page); - + if (jpage.hasClass('libraryPage')) { $(document.body).addClass('libraryDocument').removeClass('dashboardDocument'); } @@ -413,13 +430,20 @@ } }); + function initializeApiClient(apiClient) { + $(apiClient).off('websocketmessage.librarymenu', onWebSocketMessage).on('websocketmessage.librarymenu', onWebSocketMessage); + } + $(function () { $(MediaController).on('playerchange', function () { updateCastIcon(); }); - $(ApiClient).on('websocketmessage', onWebSocketMessage); + $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { + + initializeApiClient(apiClient); + }); }); })(window, document, jQuery); diff --git a/dashboard-ui/scripts/livetvchannel.js b/dashboard-ui/scripts/livetvchannel.js index fb19b0b6ef..b254c26951 100644 --- a/dashboard-ui/scripts/livetvchannel.js +++ b/dashboard-ui/scripts/livetvchannel.js @@ -335,4 +335,4 @@ programs = null; }); -})(jQuery, document, ApiClient); \ No newline at end of file +})(jQuery, document); \ No newline at end of file diff --git a/dashboard-ui/scripts/mediacontroller.js b/dashboard-ui/scripts/mediacontroller.js index 80d4e802ff..795f575f38 100644 --- a/dashboard-ui/scripts/mediacontroller.js +++ b/dashboard-ui/scripts/mediacontroller.js @@ -437,7 +437,19 @@ } } - $(ApiClient).on("websocketmessage", onWebSocketMessageReceived); + + + function initializeApiClient(apiClient) { + $(apiClient).on("websocketmessage", onWebSocketMessageReceived); + } + + $(function () { + + $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { + + initializeApiClient(apiClient); + }); + }); function getTargetsHtml(targets) { diff --git a/dashboard-ui/scripts/mediaplayer.js b/dashboard-ui/scripts/mediaplayer.js index 61a84d38eb..d751444005 100644 --- a/dashboard-ui/scripts/mediaplayer.js +++ b/dashboard-ui/scripts/mediaplayer.js @@ -27,7 +27,7 @@ var targets = [{ name: 'My Browser', - id: ApiClient.deviceId(), + id: ConnectionManager.deviceId(), playerName: self.name, playableMediaTypes: ['Audio', 'Video'], isLocalPlayer: true, diff --git a/dashboard-ui/scripts/notifications.js b/dashboard-ui/scripts/notifications.js index 4d42fc4184..f3f0739c3b 100644 --- a/dashboard-ui/scripts/notifications.js +++ b/dashboard-ui/scripts/notifications.js @@ -10,7 +10,13 @@ self.getNotificationsSummary = function () { - self.getNotificationsSummaryPromise = self.getNotificationsSummaryPromise || ApiClient.getNotificationSummary(Dashboard.getCurrentUserId()); + var apiClient = ConnectionManager.currentApiClient(); + + if (!apiClient) { + return; + } + + self.getNotificationsSummaryPromise = self.getNotificationsSummaryPromise || apiClient.getNotificationSummary(Dashboard.getCurrentUserId()); return self.getNotificationsSummaryPromise; }; @@ -21,7 +27,13 @@ return; } - self.getNotificationsSummary().done(function (summary) { + var promise = self.getNotificationsSummary(); + + if (!promise) { + return; + } + + promise.done(function (summary) { var item = $('.btnNotificationsInner').removeClass('levelNormal').removeClass('levelWarning').removeClass('levelError').html(summary.UnreadCount); @@ -95,11 +107,15 @@ function refreshNotifications(startIndex, limit, elem, btn, showPaging) { - return ApiClient.getNotifications(Dashboard.getCurrentUserId(), { StartIndex: startIndex, Limit: limit }).done(function (result) { + var apiClient = ConnectionManager.currentApiClient(); - listUnreadNotifications(result.Notifications, result.TotalRecordCount, startIndex, limit, elem, btn, showPaging); + if (apiClient) { + return apiClient.getNotifications(Dashboard.getCurrentUserId(), { StartIndex: startIndex, Limit: limit }).done(function (result) { - }); + listUnreadNotifications(result.Notifications, result.TotalRecordCount, startIndex, limit, elem, btn, showPaging); + + }); + } } function listUnreadNotifications(list, totalRecordCount, startIndex, limit, elem, btn, showPaging) { @@ -201,22 +217,33 @@ $(document).on('headercreated', function (e) { - $('
0
').insertAfter($('.headerUserButton')).on('click', Notifications.showNotificationsFlyout); - - Notifications.updateNotificationCount(); - }); - - $(ApiClient).on("websocketmessage", function (e, msg) { - - - if (msg.MessageType === "NotificationUpdated" || msg.MessageType === "NotificationAdded" || msg.MessageType === "NotificationsMarkedRead") { - - Notifications.getNotificationsSummaryPromise = null; + if (ConnectionManager.currentApiClient()) { + $('
0
').insertAfter($('.headerUserButton')).on('click', Notifications.showNotificationsFlyout); Notifications.updateNotificationCount(); } - }); + function initializeApiClient(apiClient) { + $(apiClient).on("websocketmessage", function (e, msg) { + + + if (msg.MessageType === "NotificationUpdated" || msg.MessageType === "NotificationAdded" || msg.MessageType === "NotificationsMarkedRead") { + + Notifications.getNotificationsSummaryPromise = null; + + Notifications.updateNotificationCount(); + } + + }); + } + + $(function () { + + $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { + + initializeApiClient(apiClient); + }); + }); })(jQuery, document, Dashboard, LibraryBrowser); \ No newline at end of file diff --git a/dashboard-ui/scripts/pluginspage.js b/dashboard-ui/scripts/pluginspage.js index b455df83a7..8a6fa4c828 100644 --- a/dashboard-ui/scripts/pluginspage.js +++ b/dashboard-ui/scripts/pluginspage.js @@ -19,6 +19,18 @@ }); }, + showNoConfigurationMessage: function() { + Dashboard.alert({ + message: Globalize.translate('NoPluginConfigurationMessage') + }); + }, + + showConnectMessage: function () { + Dashboard.alert({ + message: Globalize.translate('MessagePluginConfigurationRequiresLocalAccess') + }); + }, + populateList: function (page, plugins, pluginConfigurationPages) { plugins = plugins.sort(function (plugin1, plugin2) { @@ -39,10 +51,14 @@ html += "
  • "; - if (configPage) { + if (Dashboard.isConnectMode()) { + html += ""; + } + else if (configPage) { html += ""; - } else { - html += ""; + } + else { + html += ""; } html += "

    " + plugin.Name + "

    "; diff --git a/dashboard-ui/scripts/remotecontrol.js b/dashboard-ui/scripts/remotecontrol.js index 8ab76fcf8e..c8d70aa120 100644 --- a/dashboard-ui/scripts/remotecontrol.js +++ b/dashboard-ui/scripts/remotecontrol.js @@ -164,22 +164,28 @@ var deferred = $.Deferred(); - ApiClient.getSessions().done(function (sessions) { + var apiClient = ConnectionManager.currentApiClient(); - var currentTargetId = MediaController.getPlayerInfo().id; + if (apiClient) { + apiClient.getSessions().done(function (sessions) { - // Update existing data - //updateSessionInfo(popup, msg.Data); - var session = sessions.filter(function (s) { - return s.Id == currentTargetId; - })[0]; + var currentTargetId = MediaController.getPlayerInfo().id; - if (session) { - session = getPlayerState(session); - } + // Update existing data + //updateSessionInfo(popup, msg.Data); + var session = sessions.filter(function (s) { + return s.Id == currentTargetId; + })[0]; - deferred.resolveWith(null, [session]); - }); + if (session) { + session = getPlayerState(session); + } + + deferred.resolveWith(null, [session]); + }); + } else { + deferred.resolveWith(null, [{}]); + } return deferred.promise(); }; @@ -236,31 +242,37 @@ ControllableByUserId: Dashboard.getCurrentUserId() }; - ApiClient.getSessions(sessionQuery).done(function (sessions) { + var apiClient = ConnectionManager.currentApiClient(); - var targets = sessions.filter(function (s) { + if (apiClient) { + apiClient.getSessions(sessionQuery).done(function (sessions) { - return s.DeviceId != ApiClient.deviceId(); + var targets = sessions.filter(function (s) { - }).map(function (s) { - return { - name: s.DeviceName, - deviceName: s.DeviceName, - id: s.Id, - playerName: self.name, - appName: s.Client, - playableMediaTypes: s.PlayableMediaTypes, - isLocalPlayer: false, - supportedCommands: s.SupportedCommands - }; + return s.DeviceId != apiClient.deviceId(); + + }).map(function (s) { + return { + name: s.DeviceName, + deviceName: s.DeviceName, + id: s.Id, + playerName: self.name, + appName: s.Client, + playableMediaTypes: s.PlayableMediaTypes, + isLocalPlayer: false, + supportedCommands: s.SupportedCommands + }; + }); + + deferred.resolveWith(null, [targets]); + + }).fail(function () { + + deferred.reject(); }); - - deferred.resolveWith(null, [targets]); - - }).fail(function () { - - deferred.reject(); - }); + } else { + deferred.resolveWith(null, []); + } return deferred.promise(); }; @@ -290,6 +302,8 @@ function onWebSocketMessageReceived(e, msg) { + var apiClient = this; + if (msg.MessageType === "Sessions") { var currentTargetId = MediaController.getPlayerInfo().id; @@ -314,7 +328,7 @@ } else if (msg.MessageType === "PlaybackStart") { - if (msg.Data.DeviceId != ApiClient.deviceId()) { + if (msg.Data.DeviceId != apiClient.deviceId()) { if (MediaController.getPlayerInfo().id == msg.Data.Id) { firePlaybackEvent('playbackstart', msg.Data); } @@ -322,7 +336,7 @@ } else if (msg.MessageType === "PlaybackStopped") { - if (msg.Data.DeviceId != ApiClient.deviceId()) { + if (msg.Data.DeviceId != apiClient.deviceId()) { if (MediaController.getPlayerInfo().id == msg.Data.Id) { firePlaybackEvent('playbackstop', msg.Data); } @@ -330,6 +344,17 @@ } } - $(ApiClient).on("websocketmessage", onWebSocketMessageReceived).on("websocketopen", onWebSocketConnectionChange); + + function initializeApiClient(apiClient) { + $(apiClient).on("websocketmessage", onWebSocketMessageReceived).on("websocketopen", onWebSocketConnectionChange); + } + + $(function () { + + $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { + + initializeApiClient(apiClient); + }); + }); })(window, document, jQuery); \ No newline at end of file diff --git a/dashboard-ui/scripts/selectserver.js b/dashboard-ui/scripts/selectserver.js new file mode 100644 index 0000000000..3f6a66097c --- /dev/null +++ b/dashboard-ui/scripts/selectserver.js @@ -0,0 +1,120 @@ +(function () { + + function connectToServer(page, server) { + + Dashboard.showLoadingMsg(); + + ConnectionManager.connectToServer(server).done(function (result) { + + Dashboard.hideLoadingMsg(); + + switch (result.State) { + + case MediaBrowser.ConnectionState.Unavilable: + showServerConnectionFailure(); + break; + case MediaBrowser.ConnectionState.SignedIn: + { + var apiClient = result.ApiClient; + + Dashboard.serverAddress(apiClient.serverAddress()); + Dashboard.setCurrentUser(apiClient.getCurrentUserId(), apiClient.accessToken()); + window.location = 'index.html'; + } + break; + default: + break; + } + + }); + } + + function showServerConnectionFailure() { + + Dashboard.alert({ + message: Globalize.translate("MessageUnableToConnectToServer"), + title: Globalize.translate("HeaderConnectionFailure") + }); + } + + function renderServers(page, servers) { + + if (servers.length) { + $('.noServersMessage', page).hide(); + } else { + $('.noServersMessage', page).show(); + } + + var html = '    '; + + var elem = $('.serverList', page).html(html).trigger('create'); + + $('.lnkServer', elem).on('click', function () { + + var id = this.getAttribute('data-serverid'); + var server = servers.filter(function (s) { + return s.Id == id; + })[0]; + + connectToServer(page, server); + }); + } + + function loadPage(page) { + + Dashboard.showLoadingMsg(); + + ConnectionManager.getServers().done(function (servers) { + + renderServers(page, servers); + + Dashboard.hideLoadingMsg(); + }); + } + + $(document).on('pageshow', "#selectServerPage", function () { + + var page = this; + + loadPage(page); + + }); + + window.SelectServerPage = { + + onServerAddressEntrySubmit: function () { + + Dashboard.showLoadingMsg(); + + var form = this; + var page = $(form).parents('.page'); + + + // Disable default form submission + return false; + + } + + }; + +})(); \ No newline at end of file diff --git a/dashboard-ui/scripts/site.js b/dashboard-ui/scripts/site.js index b6302a217e..14fe062257 100644 --- a/dashboard-ui/scripts/site.js +++ b/dashboard-ui/scripts/site.js @@ -77,7 +77,7 @@ var Dashboard = { var userId = Dashboard.getCurrentUserId(); - Dashboard.getUserPromise = ApiClient.getUser(userId).fail(Dashboard.logout); + Dashboard.getUserPromise = ConnectionManager.currentApiClient().getUser(userId).fail(Dashboard.logout); } return Dashboard.getUserPromise; @@ -108,7 +108,7 @@ var Dashboard = { var address = store.getItem('serverAddress'); - if (!address) { + if (!address && !Dashboard.isConnectMode()) { var loc = window.location; address = loc.protocol + '//' + loc.hostname; @@ -146,7 +146,11 @@ var Dashboard = { store.setItem("userId", userId); store.setItem("token", token); - ApiClient.setCurrentUserId(userId, token); + var apiClient = ConnectionManager.currentApiClient(); + + if (apiClient) { + apiClient.setCurrentUserId(userId, token); + } Dashboard.getUserPromise = null; }, @@ -157,7 +161,6 @@ var Dashboard = { logout: function (logoutWithServer) { - ConnectionManager.logoutFromConnect(); store.removeItem("userId"); store.removeItem("token"); @@ -168,7 +171,7 @@ var Dashboard = { if (logoutWithServer === false) { window.location = loginPage; } else { - ApiClient.logout().done(function () { + ConnectionManager.logout().done(function () { window.location = loginPage; }); @@ -529,30 +532,28 @@ var Dashboard = { showUserFlyout: function (context) { - Dashboard.getCurrentUser().done(function (user) { + ConnectionManager.user().done(function (user) { var html = '
    '; html += '

    '; - if (user.PrimaryImageTag) { - var imageUrl = ApiClient.getUserImageUrl(user.Id, { + if (user.imageUrl) { + var url = user.imageUrl; - width: 28, - tag: user.PrimaryImageTag, - type: "Primary" + if (user.supportsImageParams) { + url += "width=" + 28; + } - }); - - html += ''; + html += ''; } - html += user.Name; + html += user.name; html += '

    '; html += '
    '; - if (user.Configuration.EnableUserPreferenceAccess) { - html += '

    ' + Globalize.translate('ButtonMyPreferences') + ''; + if (user.localUser && user.localUser.Configuration.EnableUserPreferenceAccess) { + html += '

    ' + Globalize.translate('ButtonMyPreferences') + ''; } html += '

    '; @@ -633,10 +634,6 @@ var Dashboard = { ensureToolsMenu: function (page, user) { - if (!page.hasClass('type-interior')) { - return; - } - var sidebar = $('.toolsSidebar', page); if (!sidebar.length) { @@ -785,16 +782,6 @@ var Dashboard = { ApiClient.openWebSocket(); }, - onWebSocketOpened: function () { - - ApiClient.reportCapabilities({ - PlayableMediaTypes: "Audio,Video", - - SupportedCommands: Dashboard.getSupportedRemoteCommands().join(',') - }); - - }, - processGeneralCommand: function (cmd) { // Full list @@ -1189,6 +1176,11 @@ var Dashboard = { "DisplayMessage" ]; + }, + + isServerlessPage: function() { + var url = getWindowUrl().toLowerCase(); + return url.indexOf('connectlogin.html') != -1 || url.indexOf('selectserver.html') != -1; } }; @@ -1231,43 +1223,57 @@ var Dashboard = { alert(Globalize.translate('MessageBrowserDoesNotSupportWebSockets')); } + function initializeApiClient(apiClient) { + + $(apiClient).off('.dashboard').on("websocketmessage.dashboard", Dashboard.onWebSocketMessageReceived); + + // TODO: Improve with http://webpjs.appspot.com/ + apiClient.supportsWebP($.browser.chrome); + } + var appName = "Dashboard"; var appVersion = window.dashboardVersion; var deviceName = generateDeviceName(); var deviceId = MediaBrowser.ApiClient.generateDeviceId(); + var credentialProvider = new MediaBrowser.CredentialProvider(); - window.ApiClient = new MediaBrowser.ApiClient(Dashboard.serverAddress(), appName, appVersion, deviceName, deviceId); - window.ConnectionManager = new MediaBrowser.ConnectionManager(new MediaBrowser.CredentialProvider(), appName, appVersion, deviceName, deviceId); + var capabilities = { + PlayableMediaTypes: "Audio,Video", - $(ApiClient).on("websocketopen", Dashboard.onWebSocketOpened) - .on("websocketmessage", Dashboard.onWebSocketMessageReceived); + SupportedCommands: Dashboard.getSupportedRemoteCommands().join(',') + }; - // TODO: Improve with http://webpjs.appspot.com/ - ApiClient.supportsWebP($.browser.chrome); + window.ConnectionManager = new MediaBrowser.ConnectionManager(credentialProvider, appName, appVersion, deviceName, deviceId, capabilities); + if (Dashboard.isConnectMode()) { - ApiClient.setCurrentUserId(Dashboard.getCurrentUserId(), Dashboard.getAccessToken()); + $(ConnectionManager).on('apiclientcreated', function (e, apiClient) { - //test(); + initializeApiClient(apiClient); + }); + + if (Dashboard.serverAddress() && Dashboard.getCurrentUserId() && Dashboard.getAccessToken() && !Dashboard.isServerlessPage()) { + window.ApiClient = new MediaBrowser.ApiClient(Dashboard.serverAddress(), appName, appVersion, deviceName, deviceId, capabilities); + + ApiClient.setCurrentUserId(Dashboard.getCurrentUserId(), Dashboard.getAccessToken()); + + initializeApiClient(ApiClient); + + ConnectionManager.addApiClient(ApiClient); + } + + } else { + + window.ApiClient = new MediaBrowser.ApiClient(Dashboard.serverAddress(), appName, appVersion, deviceName, deviceId, capabilities); + + ApiClient.setCurrentUserId(Dashboard.getCurrentUserId(), Dashboard.getAccessToken()); + + initializeApiClient(ApiClient); + + ConnectionManager.addApiClient(ApiClient); + } })(); -function test() { - - ConnectionManager.loginToConnect("luke", "ac501ac7111a1e5").done(function (result) { - - var promise = ConnectionManager.connect(); - - promise.done(function (r) { - alert(JSON.stringify(r)); - - }).fail(function() { - - alert('fail'); - }); - }); - -} - $(function () { var videoPlayerHtml = '