From fa9e2b476b89d5db6ec1d7cbd546ab979de63637 Mon Sep 17 00:00:00 2001 From: Matt Montgomery <33811686+ConfusedPolarBear@users.noreply.github.com> Date: Sun, 12 Apr 2020 00:44:30 -0500 Subject: [PATCH] Finish web UI --- .../quickconnectsettings.js | 65 +++++++++++++++++++ src/controllers/auth/login.js | 18 ++--- src/controllers/quickconnect.js | 57 ++++++++++++++++ src/controllers/user/menu.js | 1 + src/controllers/user/quickconnect.js | 41 ++++++++++++ src/libraries/apiclient/apiclientcore.js | 5 +- src/mypreferencesmenu.html | 10 +++ src/mypreferencesquickconnect.html | 12 ++++ src/quickconnect.html | 29 +++++++++ src/scripts/librarymenu.js | 6 ++ src/scripts/routes.js | 12 ++++ src/scripts/site.js | 1 + 12 files changed, 248 insertions(+), 9 deletions(-) create mode 100644 src/components/quickconnectsettings/quickconnectsettings.js create mode 100644 src/controllers/quickconnect.js create mode 100644 src/controllers/user/quickconnect.js create mode 100644 src/mypreferencesquickconnect.html create mode 100644 src/quickconnect.html diff --git a/src/components/quickconnectsettings/quickconnectsettings.js b/src/components/quickconnectsettings/quickconnectsettings.js new file mode 100644 index 0000000000..a30db441e6 --- /dev/null +++ b/src/components/quickconnectsettings/quickconnectsettings.js @@ -0,0 +1,65 @@ +define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loading', 'connectionManager', 'homeSections', 'dom', 'events', 'listViewStyle', 'emby-select', 'emby-checkbox'], function (require, appHost, layoutManager, focusManager, globalize, loading, connectionManager, homeSections, dom, events) { + "use strict"; + + function authorizeRequest(event) { + var lookup = event.data.lookup; + var apiClient = event.data.apiClient; + var url = ApiClient.getUrl("/QuickConnect/Authorize"); + apiClient.ajax({ + type: "POST", + url: url, + data: { + "Lookup": lookup + } + }, true); + } + + function list(apiClient) { + var elem = $("#quickConnectIncoming"); + elem.html(""); + apiClient.getJSON("/QuickConnect/List").then(json => { + console.debug("raw json", json); + for(var i = 0; i < json.length; i++) { + var current = json[i]; + var html = "
  • " + current.Code + " - " + current.FriendlyName + " - "; + + if(!current.Authenticated) { + html += "authorize"; + } + else { + html += " (already authorized)"; + } + + html += "
    • "; + elem.append(html); + $("#qc" + current.Lookup).click({ lookup: current.Lookup, apiClient: apiClient}, authorizeRequest); + } + }); + } + + function QuickConnectSettings(options) { + this.options = options; + } + + QuickConnectSettings.prototype.loadData = function () { + loading.show(); + + var apiClient = connectionManager.getApiClient(this.options.serverId); + + list(apiClient); + + console.debug("request list finished"); + + loading.hide(); + }; + + QuickConnectSettings.prototype.submit = function () { + return false; + }; + + QuickConnectSettings.prototype.destroy = function () { + this.options = null; + }; + + return QuickConnectSettings; +}); diff --git a/src/controllers/auth/login.js b/src/controllers/auth/login.js index 746384a64c..f5dc9b487b 100644 --- a/src/controllers/auth/login.js +++ b/src/controllers/auth/login.js @@ -152,10 +152,11 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout function loginQuickConnect() { var apiClient = getApiClient(); - var identifier = "" - var interval = 0; var friendlyName = "test"; - $.get('/QuickConnect/Initiate?FriendlyName=' + friendlyName).then(json => { + + var url = apiClient.getUrl("/QuickConnect/Initiate?FriendlyName=" + friendlyName); + apiClient.getJSON(url) + .then(json => { if (!json.Secret || !json.Code) { Dashboard.alert({ message: json.Error, @@ -171,11 +172,12 @@ define(["apphost", "appSettings", "dom", "connectionManager", "loading", "layout loading.show(); - identifier = json.Secret; - interval = setInterval(() => { - $.get('/QuickConnect/Connect?Secret=' + identifier).then(x => { - if(x.Authenticated) { - apiClient.quickConnect(x.Authentication).then((result) => { + var interval = setInterval(() => { + var url = apiClient.getUrl('/QuickConnect/Connect?Secret=' + json.Secret); + apiClient.getJSON(url) + .then(data => { + if(data.Authenticated) { + apiClient.quickConnect(data.Authentication).then((result) => { var user = result.User; var serverId = getParameterByName("serverid"); var newUrl; diff --git a/src/controllers/quickconnect.js b/src/controllers/quickconnect.js new file mode 100644 index 0000000000..e3d1f76054 --- /dev/null +++ b/src/controllers/quickconnect.js @@ -0,0 +1,57 @@ +define(["jQuery", "loading", "libraryMenu", "fnchecked"], function ($, loading, libraryMenu) { + "use strict"; + + function loadPage(page, status) { + var active = (status == "Active"); + var available = (status == "Available") || active; + + $("#quickConnectStatus").text(status.toLocaleLowerCase()); + $("#chkQuickConnectAvailable").checked(available); + $("#chkQuickConnectActive").checked(active); + + loading.hide(); + } + + function onSubmit() { + loading.show(); + + var available = $("#chkQuickConnectAvailable").is(":checked") ? "Available" : "Unavailable"; + var url = ApiClient.getUrl("/QuickConnect/Available"); + + ApiClient.ajax({ + type: "POST", + data: { + "Status": available + }, + url: url + }, true).then(() => { + if($("#chkQuickConnectActive").is(":checked")) { + url = ApiClient.getUrl("/QuickConnect/Activate"); + ApiClient.ajax({ + type: "POST", + url: url + }, true); + } + + Dashboard.alert({ + message: "Settings saved", + title: "Saved" + }); + }); + + loading.hide(); + return false; + } + + $(document).on("pageinit", "#quickConnectPage", function () { + $("#quickConnectPage").off("submit", onSubmit).on("submit", onSubmit); + $("#btnQuickConnectSubmit").click(onSubmit); + }).on("pageshow", "#quickConnectPage", function () { + loading.show(); + var page = this; + var promise1 = ApiClient.getQuickConnect("Status"); + Promise.all([promise1]).then(function (responses) { + loadPage(page, responses[0]); + }); + }); +}); diff --git a/src/controllers/user/menu.js b/src/controllers/user/menu.js index e7d816fb6f..ff8db72681 100644 --- a/src/controllers/user/menu.js +++ b/src/controllers/user/menu.js @@ -24,6 +24,7 @@ define(["apphost", "connectionManager", "layoutManager", "listViewStyle", "emby- page.querySelector(".lnkHomePreferences").setAttribute("href", "mypreferenceshome.html?userId=" + userId); page.querySelector(".lnkPlaybackPreferences").setAttribute("href", "mypreferencesplayback.html?userId=" + userId); page.querySelector(".lnkSubtitlePreferences").setAttribute("href", "mypreferencessubtitles.html?userId=" + userId); + page.querySelector(".lnkQuickConnectPreferences").setAttribute("href", "mypreferencesquickconnect.html?userId=" + userId); if (window.NativeShell && window.NativeShell.AppHost.supports("clientsettings")) { page.querySelector(".clientSettings").classList.remove("hide"); diff --git a/src/controllers/user/quickconnect.js b/src/controllers/user/quickconnect.js new file mode 100644 index 0000000000..d6f2ae25c1 --- /dev/null +++ b/src/controllers/user/quickconnect.js @@ -0,0 +1,41 @@ +define(["quickConnectSettings", "dom", "globalize", "loading", "userSettings", "autoFocuser", "listViewStyle"], function (QuickConnectSettings, dom, globalize, loading, userSettings, autoFocuser) { + "use strict"; + + return function (view, params) { + var quickConnectSettingsInstance = null; + var hasChanges; + var userId = params.userId || ApiClient.getCurrentUserId(); + var currentSettings = userId === ApiClient.getCurrentUserId() ? userSettings : new userSettings(); + view.addEventListener("viewshow", function () { + console.debug("defining instance"); + + quickConnectSettingsInstance = new QuickConnectSettings({ + serverId: ApiClient.serverId(), + userId: userId, + element: view.querySelector(".quickConnectSettingsContainer"), + userSettings: currentSettings, + enableSaveButton: false, + enableSaveConfirmation: false, + autoFocus: autoFocuser.isEnabled() + }); + + quickConnectSettingsInstance.loadData(); + }); + view.addEventListener("change", function () { + hasChanges = true; + }); + view.addEventListener("viewbeforehide", function () { + hasChanges = false; + + if (quickConnectSettingsInstance) { + quickConnectSettingsInstance.submit(); + } + }); + view.addEventListener("viewdestroy", function () { + if (quickConnectSettingsInstance) { + quickConnectSettingsInstance.destroy(); + quickConnectSettingsInstance = null; + } + }); + }; +}); diff --git a/src/libraries/apiclient/apiclientcore.js b/src/libraries/apiclient/apiclientcore.js index 80be946a60..04421b8372 100644 --- a/src/libraries/apiclient/apiclientcore.js +++ b/src/libraries/apiclient/apiclientcore.js @@ -377,7 +377,10 @@ define(["events", "appStorage"], function(events, appStorage) { instance.onAuthenticated ? instance.onAuthenticated(instance, result).then(afterOnAuthenticated) : afterOnAuthenticated() }, reject) }) - }, ApiClient.prototype.ensureWebSocket = function() { + }, ApiClient.prototype.getQuickConnect = function(verb) { + var url = this.getUrl("/QuickConnect/" + verb); + return this.getJSON(url); + }, ApiClient.prototype.ensureWebSocket = function() { if (!this.isWebSocketOpenOrConnecting() && this.isWebSocketSupported()) try { this.openWebSocket() } catch (err) { diff --git a/src/mypreferencesmenu.html b/src/mypreferencesmenu.html index 4219059dd0..c8db1d17f3 100644 --- a/src/mypreferencesmenu.html +++ b/src/mypreferencesmenu.html @@ -48,6 +48,16 @@ + + +
    + +
    +
    Quick Connect
    +
    +
    +     +
    diff --git a/src/mypreferencesquickconnect.html b/src/mypreferencesquickconnect.html new file mode 100644 index 0000000000..326ce51b48 --- /dev/null +++ b/src/mypreferencesquickconnect.html @@ -0,0 +1,12 @@ +
    + + + Incoming login requests: +
    +
      +
    • Failed to load incoming requests
      • +
    +
    +
    diff --git a/src/quickconnect.html b/src/quickconnect.html new file mode 100644 index 0000000000..770796a10e --- /dev/null +++ b/src/quickconnect.html @@ -0,0 +1,29 @@ +
    +
    +
    +
    +
    +

    Quick Connect

    +
    +
    + + Quick connect is: Failed to load status + +
    + + +
    If unchecked, users will have to click the Activate button in their profile before initiating a quick connect login.
    +
    + + +
    +
    +
    \ No newline at end of file diff --git a/src/scripts/librarymenu.js b/src/scripts/librarymenu.js index 11c89b01da..930df8be49 100644 --- a/src/scripts/librarymenu.js +++ b/src/scripts/librarymenu.js @@ -349,6 +349,12 @@ define(["dom", "layoutManager", "inputManager", "connectionManager", "events", " href: "devices.html", pageIds: ["devicesPage", "devicePage"], icon: "devices" + }); + links.push({ + name: "Quick Connect", + href: "quickconnect.html", + pageIds: ["quickConnectPage", "quickConnectPage"], + icon: "devices" }); links.push({ name: globalize.translate("HeaderActivity"), diff --git a/src/scripts/routes.js b/src/scripts/routes.js index 9c3db58a7f..1520e96632 100644 --- a/src/scripts/routes.js +++ b/src/scripts/routes.js @@ -72,6 +72,12 @@ define([ transition: "fade", controller: "user/subtitles" }); + defineRoute({ + path: "/mypreferencesquickconnect.html", + autoFocus: false, + transition: "fade", + controller: "user/quickconnect" + }); defineRoute({ path: "/dashboard.html", @@ -103,6 +109,12 @@ define([ roles: "admin", controller: "device" }); + defineRoute({ + path: "/quickconnect.html", + autoFocus: false, + roles: "admin", + controller: "quickconnect" + }); defineRoute({ path: "/dlnaprofile.html", autoFocus: false, diff --git a/src/scripts/site.js b/src/scripts/site.js index 3b992eaf2b..311478c019 100644 --- a/src/scripts/site.js +++ b/src/scripts/site.js @@ -829,6 +829,7 @@ var AppInfo = {}; define("displaySettings", [componentsPath + "/displaysettings/displaysettings"], returnFirstDependency); define("playbackSettings", [componentsPath + "/playbacksettings/playbacksettings"], returnFirstDependency); define("homescreenSettings", [componentsPath + "/homescreensettings/homescreensettings"], returnFirstDependency); + define("quickConnectSettings", [componentsPath + "/quickconnectsettings/quickconnectsettings"], returnFirstDependency); define("playbackManager", [componentsPath + "/playback/playbackmanager"], getPlaybackManager); define("layoutManager", [componentsPath + "/layoutManager", "apphost"], getLayoutManager); define("homeSections", [componentsPath + "/homesections/homesections"], returnFirstDependency);