From ae5fa9d304d5388fcdbc91ee7b9233c4d5141c93 Mon Sep 17 00:00:00 2001 From: Matt Montgomery <33811686+ConfusedPolarBear@users.noreply.github.com> Date: Sun, 26 Jul 2020 23:57:28 -0500 Subject: [PATCH] Migrate to ES6 --- package.json | 3 + .../quickConnectSettings.js | 115 +++++------------- src/controllers/dashboard/quickconnect.js | 62 ++++++++++ src/controllers/quickConnect.js | 61 ---------- src/controllers/session/login/index.js | 17 +-- src/controllers/user/menu/index.js | 2 +- src/controllers/user/quickConnect.js | 53 -------- src/controllers/user/quickConnect/index.html | 17 +++ src/controllers/user/quickConnect/index.js | 78 ++++++++++++ src/myPreferencesQuickConnect.html | 11 -- src/{quickConnect.html => quickconnect.html} | 8 +- src/scripts/routes.js | 9 +- src/strings/en-us.json | 11 +- 13 files changed, 220 insertions(+), 227 deletions(-) create mode 100644 src/controllers/dashboard/quickconnect.js delete mode 100644 src/controllers/quickConnect.js delete mode 100644 src/controllers/user/quickConnect.js create mode 100644 src/controllers/user/quickConnect/index.html create mode 100644 src/controllers/user/quickConnect/index.js delete mode 100644 src/myPreferencesQuickConnect.html rename src/{quickConnect.html => quickconnect.html} (89%) diff --git a/package.json b/package.json index d1831b13ee..88a361d8ba 100644 --- a/package.json +++ b/package.json @@ -145,6 +145,7 @@ "src/components/playlisteditor/playlisteditor.js", "src/components/playmenu.js", "src/components/prompt/prompt.js", + "src/components/quickConnectSettings/quickConnectSettings.js", "src/components/sanatizefilename.js", "src/components/scrollManager.js", "src/components/search/searchfields.js", @@ -178,6 +179,7 @@ "src/controllers/dashboard/metadatanfo.js", "src/controllers/dashboard/networking.js", "src/controllers/dashboard/playback.js", + "src/controllers/dashboard/quickconnect.js", "src/controllers/dashboard/plugins/repositories/index.js", "src/controllers/dashboard/scheduledtasks/scheduledtask.js", "src/controllers/dashboard/scheduledtasks/scheduledtasks.js", @@ -204,6 +206,7 @@ "src/controllers/user/menu/index.js", "src/controllers/user/playback/index.js", "src/controllers/user/profile/index.js", + "src/controllers/user/quickConnect/index.js", "src/controllers/user/subtitles/index.js", "src/controllers/user/subtitles/index.js", "src/controllers/wizard/finish/index.js", diff --git a/src/components/quickConnectSettings/quickConnectSettings.js b/src/components/quickConnectSettings/quickConnectSettings.js index 45bfe815cc..35f051a121 100644 --- a/src/components/quickConnectSettings/quickConnectSettings.js +++ b/src/components/quickConnectSettings/quickConnectSettings.js @@ -1,115 +1,64 @@ -define(['require', 'apphost', 'layoutManager', 'focusManager', 'globalize', 'loading', 'connectionManager', 'listViewStyle', 'emby-select', 'emby-checkbox'], function (require, appHost, layoutManager, focusManager, globalize, loading, connectionManager) { - "use strict"; +import globalize from 'globalize'; +import toast from 'toast'; - function authorizeRequest(event) { - let lookup = event.data.lookup; - let url = ApiClient.getUrl("/QuickConnect/Authorize"); +export class QuickConnectSettings { + constructor() { } + + authorize(code) { + let url = ApiClient.getUrl('/QuickConnect/Authorize'); ApiClient.ajax({ - type: "POST", + type: 'POST', url: url, data: { - "Lookup": lookup + 'Code': code } - }, true); - - require(["toast"], function (toast) { - toast("Request authorized"); + }, true).then(() => { + require(['toast'], function (toast) { + toast(globalize.translate('QuickConnectAuthorizeSuccess')); + }); + }).catch(() => { + require(['toast'], function (toast) { + toast(globalize.translate('QuickConnectAuthorizeFail')); + }); }); // prevent bubbling return false; } - QuickConnectSettings.prototype.list = function(argPage) { - ApiClient.getJSON("/QuickConnect/List").then(json => { - let found = false; - let elem = argPage.querySelector('#quickConnectIncoming'); - elem.innerText = globalize.translate('QuickConnectNoPending'); - - for (let i = 0; i < json.length; i++) { - if (!found) { - elem.innerHTML = ""; - found = true; - } - - let current = json[i]; - - let html = '
'; - html += '
' + current.Code + '
'; - html += '
' + current.FriendlyName + '
'; - html += '
'; - - if (!current.Authenticated) { - html += '' + globalize.translate('Authorize') + ''; - } - - html += '
'; - elem.innerHTML += html; - - $("#qc" + current.Lookup).click({ lookup: current.Lookup }, authorizeRequest); - $("#div" + current.Lookup).click({ lookup: current.Lookup }, authorizeRequest); - } - - return true; - }).catch((e) => { - console.error("Unable to get quick connect login requests. error:", e); - }); - }; - - QuickConnectSettings.prototype.activate = function() { - let url = ApiClient.getUrl("/QuickConnect/Activate"); - ApiClient.ajax({ - type: "POST", + activate() { + let url = ApiClient.getUrl('/QuickConnect/Activate'); + return ApiClient.ajax({ + type: 'POST', url: url, - contentType: "application/json", - dataType: "json" + contentType: 'application/json', + dataType: 'json' }).then((json) => { let message = json.Error; - if (message && message !== "") { - console.error("Error activating quick connect. Error: ", json.Error); + if (message && message !== '') { + console.error('Error activating quick connect. Error: ', json.Error); Dashboard.alert({ - title: "Unable to activate quick connect", + title: 'Unable to activate quick connect', message: message }); return false; } - require(["toast"], function (toast) { - toast(globalize.translate("QuickConnectActivationSuccessful")); - }); + toast(globalize.translate('QuickConnectActivationSuccessful')); return true; }).catch((e) => { - console.error("Error activating quick connect. Error:", e); + console.error('Error activating quick connect. Error:', e); throw e; }); - }; - - function QuickConnectSettings(options) { - this.options = options; } - QuickConnectSettings.prototype.loadData = function () { - this.options.interval = setInterval(this.list, 5000, this.options.page); - this.list(this.options.page); - }; - - QuickConnectSettings.prototype.submit = function () { + submit() { return false; - }; + } +} - QuickConnectSettings.prototype.destroy = function () { - console.debug("clearing refresh interval", this.options.interval); - clearInterval(this.options.interval); - this.options = null; - }; - - QuickConnectSettings.prototype.interval = function (interval) { - this.options.interval = interval; - }; - - return QuickConnectSettings; -}); +export default QuickConnectSettings; diff --git a/src/controllers/dashboard/quickconnect.js b/src/controllers/dashboard/quickconnect.js new file mode 100644 index 0000000000..22f4781b7d --- /dev/null +++ b/src/controllers/dashboard/quickconnect.js @@ -0,0 +1,62 @@ +import loading from 'loading'; + +/* eslint-disable indent */ + + let page; + export default function(view) { + view.addEventListener('viewshow', function () { + page = this; + loading.show(); + page.querySelector('#btnQuickConnectSubmit').onclick = onSubmit; + updatePage(); + }); + } + + function loadPage(status) { + let available = status === 'Available' || status === 'Active'; + + page.querySelector('#quickConnectStatus').textContent = status.toLocaleLowerCase(); + page.querySelector('#chkQuickConnectAvailable').checked = available; + + loading.hide(); + } + + function onSubmit() { + loading.show(); + + let newStatus = page.querySelector('#chkQuickConnectAvailable').checked ? 'Available' : 'Unavailable'; + + let url = ApiClient.getUrl('/QuickConnect/Available'); + + ApiClient.ajax({ + type: 'POST', + data: { + 'Status': newStatus + }, + url: url + }, true).then(() => { + require(['toast'], function (toast) { + toast('Settings saved'); + }); + + setTimeout(updatePage, 500); + + return true; + }).catch((e) => { + console.error('Unable to set quick connect status. error:', e); + }); + + loading.hide(); + return false; + } + + function updatePage() { + ApiClient.getQuickConnect('Status').then((response) => { + loadPage(response); + return true; + }).catch((e) => { + console.error('Unable to get quick connect status. error:', e); + }); + } + +/* eslint-enable indent */ diff --git a/src/controllers/quickConnect.js b/src/controllers/quickConnect.js deleted file mode 100644 index 93b74a1b52..0000000000 --- a/src/controllers/quickConnect.js +++ /dev/null @@ -1,61 +0,0 @@ -define(["jQuery", "loading", "fnchecked"], function ($, loading) { - "use strict"; - - let page; - function loadPage(status) { - let available = status === "Available" || status === "Active"; - - page.querySelector("#quickConnectStatus").textContent = status.toLocaleLowerCase(); - page.querySelector("#chkQuickConnectAvailable").checked = available; - - loading.hide(); - } - - function onSubmit() { - loading.show(); - - let newStatus = page.querySelector("#chkQuickConnectAvailable").checked ? "Available" : "Unavailable"; - - let url = ApiClient.getUrl("/QuickConnect/Available"); - - ApiClient.ajax({ - type: "POST", - data: { - "Status": newStatus - }, - url: url - }, true).then(() => { - require(["toast"], function (toast) { - toast("Settings saved"); - }); - - setTimeout(updatePage, 500); - - return true; - }).catch((e) => { - console.error("Unable to set quick connect status. error:", e); - }); - - loading.hide(); - return false; - } - - function updatePage() { - let promise1 = ApiClient.getQuickConnect("Status"); - Promise.all([promise1]).then((responses) => { - loadPage(responses[0]); - return true; - }).catch((e) => { - console.error("Unable to get quick connect status. error:", e); - }); - } - - $(document).on("pageshow", "#quickConnectPage", function () { - loading.show(); - page = this; - - page.querySelector("#btnQuickConnectSubmit").onclick = onSubmit; - - updatePage(); - }); -}); diff --git a/src/controllers/session/login/index.js b/src/controllers/session/login/index.js index cdccdd5fb4..b1fdf1bc58 100644 --- a/src/controllers/session/login/index.js +++ b/src/controllers/session/login/index.js @@ -163,11 +163,7 @@ import 'emby-checkbox'; apiClient.getJSON(url) .then(json => { if (!json.Secret || !json.Code) { - Dashboard.alert({ - message: json.Error, - title: 'Error' - }); - + console.error('Malformed quick connect response', json); return false; } @@ -215,10 +211,17 @@ import 'emby-checkbox'; return true; }).catch((e) => { - console.error('Unable to initiate quick connect login request. Error:', e); + Dashboard.alert({ + message: Globalize.translate('QuickConnectNotActive'), + title: 'Error' + }); + + console.error('Quick connect error: ', e); + + return false; }); } - + view.querySelector('#divUsers').addEventListener('click', function (e) { const card = dom.parentWithClass(e.target, 'card'); const cardContent = card ? card.querySelector('.cardContent') : null; diff --git a/src/controllers/user/menu/index.js b/src/controllers/user/menu/index.js index 73e7012f19..6d0f5f8021 100644 --- a/src/controllers/user/menu/index.js +++ b/src/controllers/user/menu/index.js @@ -27,7 +27,7 @@ export default function (view, params) { 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); + page.querySelector('.lnkQuickConnectPreferences').setAttribute('href', 'mypreferencesquickconnect.html'); 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 deleted file mode 100644 index bee0c1b817..0000000000 --- a/src/controllers/user/quickConnect.js +++ /dev/null @@ -1,53 +0,0 @@ -define(["quickConnectSettings", "dom", "globalize", "loading", "userSettings", "autoFocuser", "listViewStyle"], function (QuickConnectSettings, dom, globalize, loading, userSettings, autoFocuser) { - "use strict"; - - return function (view) { - let quickConnectSettingsInstance = null; - - view.addEventListener("viewshow", function () { - quickConnectSettingsInstance = new QuickConnectSettings({ - page: view, - interval: 0 - }); - - view.querySelector("#btnQuickConnectActivate").addEventListener("click", () => { - quickConnectSettingsInstance.activate(quickConnectSettingsInstance); - }); - - quickConnectSettingsInstance.loadData(); - - ApiClient.getQuickConnect("Status").then((status) => { - let btn = view.querySelector("#btnQuickConnectActivate"); - - if (status === "Unavailable") { - btn.textContent = globalize.translate("QuickConnectNotAvailable"); - btn.disabled = true; - return false; - } else if (status === "Available") { - return false; - } - - btn.style.display = "none"; - return true; - }).catch((e) => { - throw e; - }); - }); - view.addEventListener("viewbeforehide", function () { - if (quickConnectSettingsInstance) { - quickConnectSettingsInstance.submit(); - } - onDestroy(); - }); - view.addEventListener("viewdestroy", function () { - onDestroy(); - }); - - function onDestroy() { - if (quickConnectSettingsInstance) { - quickConnectSettingsInstance.destroy(); - quickConnectSettingsInstance = null; - } - } - }; -}); diff --git a/src/controllers/user/quickConnect/index.html b/src/controllers/user/quickConnect/index.html new file mode 100644 index 0000000000..5f698a4a6b --- /dev/null +++ b/src/controllers/user/quickConnect/index.html @@ -0,0 +1,17 @@ +
+ + +
+
+ ${QuickConnectDescription} +
+
+ +
+ +
+
diff --git a/src/controllers/user/quickConnect/index.js b/src/controllers/user/quickConnect/index.js new file mode 100644 index 0000000000..80543a0b58 --- /dev/null +++ b/src/controllers/user/quickConnect/index.js @@ -0,0 +1,78 @@ +import QuickConnectSettings from 'quickConnectSettings'; +import globalize from 'globalize'; +import toast from 'toast'; + +export default function (view) { + let quickConnectSettingsInstance = null; + + view.addEventListener('viewshow', function () { + let codeElement = view.querySelector('#txtQuickConnectCode'); + + quickConnectSettingsInstance = new QuickConnectSettings({ + page: view, + interval: 0 + }); + + view.querySelector('#btnQuickConnectActivate').addEventListener('click', () => { + quickConnectSettingsInstance.activate(quickConnectSettingsInstance).then(() => { + renderPage(); + }); + }); + + view.querySelector('#btnQuickConnectAuthorize').addEventListener('click', () => { + if (!codeElement.validity.valid) { + toast(globalize.translate('QuickConnectInvalidCode')); + + return; + } + + let code = codeElement.value; + quickConnectSettingsInstance.authorize(code); + }); + + renderPage(); + }); + view.addEventListener('viewbeforehide', function () { + if (quickConnectSettingsInstance) { + quickConnectSettingsInstance.submit(); + } + onDestroy(); + }); + view.addEventListener('viewdestroy', function () { + onDestroy(); + }); + + function onDestroy() { + if (quickConnectSettingsInstance) { + quickConnectSettingsInstance.destroy(); + quickConnectSettingsInstance = null; + } + } + + function renderPage(forceActive = false) { + ApiClient.getQuickConnect('Status').then((status) => { + let btn = view.querySelector('#btnQuickConnectActivate'); + let container = view.querySelector('.quickConnectSettingsContainer'); + + // The activation button should only be visible when quick connect is unavailable (with the text replaced with an error) or when it is available (so it can be activated) + // The authorization container is only usable when quick connect is active, so it should be hidden otherwise + container.style.display = 'none'; + + if (status === 'Unavailable') { + btn.textContent = globalize.translate('QuickConnectNotAvailable'); + btn.disabled = true; + btn.classList.remove('button-submit'); + btn.classList.add('button'); + } else if (status === 'Active' || forceActive) { + container.style.display = ''; + btn.style.display = 'none'; + } + + return true; + }).catch((e) => { + throw e; + }); + } + + renderPage(); +} diff --git a/src/myPreferencesQuickConnect.html b/src/myPreferencesQuickConnect.html deleted file mode 100644 index 4f1f9febab..0000000000 --- a/src/myPreferencesQuickConnect.html +++ /dev/null @@ -1,11 +0,0 @@ -
- - -
-
-
${MessagePleaseWait}
- -
-
diff --git a/src/quickConnect.html b/src/quickconnect.html similarity index 89% rename from src/quickConnect.html rename to src/quickconnect.html index dff74eb836..671bb88d77 100644 --- a/src/quickConnect.html +++ b/src/quickconnect.html @@ -1,6 +1,6 @@
-
-
+
+

${QuickConnect}

@@ -19,6 +19,6 @@ -
+
-
\ No newline at end of file +
diff --git a/src/scripts/routes.js b/src/scripts/routes.js index 3472d66496..ec623a485c 100644 --- a/src/scripts/routes.js +++ b/src/scripts/routes.js @@ -94,10 +94,11 @@ define([ controller: 'user/home/index' }); defineRoute({ - path: '/myPreferencesQuickConnect.html', + alias: '/mypreferencesquickconnect.html', + path: '/controllers/user/quickConnect/index.html', autoFocus: false, transition: 'fade', - controller: 'user/quickConnect' + controller: 'user/quickConnect/index' }); defineRoute({ alias: '/mypreferencesplayback.html', @@ -145,10 +146,10 @@ define([ controller: 'dashboard/devices/device' }); defineRoute({ - path: '/quickConnect.html', + path: '/quickconnect.html', autoFocus: false, roles: 'admin', - controller: "quickConnect" + controller: 'dashboard/quickconnect' }); defineRoute({ path: '/dlnaprofile.html', diff --git a/src/strings/en-us.json b/src/strings/en-us.json index 57a025d8b7..17e4662d2a 100644 --- a/src/strings/en-us.json +++ b/src/strings/en-us.json @@ -48,7 +48,7 @@ "AuthProviderHelp": "Select an Authentication Provider to be used to authenticate this user's password.", "Auto": "Auto", "AutoBasedOnLanguageSetting": "Auto (based on language setting)", - "Authorize": "authorize", + "Authorize": "Authorize", "Backdrop": "Backdrop", "Backdrops": "Backdrops", "Banner": "Banner", @@ -816,6 +816,7 @@ "LabelPublicHttpPortHelp": "The public port number that should be mapped to the local HTTP port.", "LabelPublicHttpsPort": "Public HTTPS port number:", "LabelPublicHttpsPortHelp": "The public port number that should be mapped to the local HTTPS port.", + "LabelQuickConnectCode": "Quick connect code:", "LabelReadHowYouCanContribute": "Learn how you can contribute.", "LabelReasonForTranscoding": "Reason for transcoding:", "LabelRecord": "Record:", @@ -1322,8 +1323,12 @@ "QuickConnect": "Quick Connect", "QuickConnectActivationSuccessful": "Successfully activated", "QuickConnectAuthorizeCode": "Authorize request {0} to continue", - "QuickConnectNoPending": "No pending login requests", - "QuickConnectNotAvailable": "Quick connect is not available on this server", + "QuickConnectAuthorizeSuccess": "Request authorized", + "QuickConnectAuthorizeFail": "Unknown quick connect code", + "QuickConnectDescription": "To sign in with quick connect, select the Quick Connect button on the device you are logging in from and enter the displayed code below.", + "QuickConnectInvalidCode": "Invalid quick connect code", + "QuickConnectNotAvailable": "Ask your server administrator to enable quick connect", + "QuickConnectNotActive": "Quick connect is not active on this server", "Raised": "Raised", "Rate": "Rate", "RecentlyWatched": "Recently watched",