From 7aedc92a35afbc8865bde1f754579f5c07e9e363 Mon Sep 17 00:00:00 2001 From: Joffrey JAFFEUX Date: Fri, 10 May 2019 10:05:11 +0200 Subject: [PATCH] REFACTOR: login-controller (#7514) --- .../discourse/controllers/login.js.es6 | 166 +++++++++--------- 1 file changed, 80 insertions(+), 86 deletions(-) diff --git a/app/assets/javascripts/discourse/controllers/login.js.es6 b/app/assets/javascripts/discourse/controllers/login.js.es6 index 63326b87aa2..19da455a26e 100644 --- a/app/assets/javascripts/discourse/controllers/login.js.es6 +++ b/app/assets/javascripts/discourse/controllers/login.js.es6 @@ -60,13 +60,12 @@ export default Ember.Controller.extend(ModalFunctionality, { @computed("awaitingApproval", "hasAtLeastOneLoginButton") modalBodyClasses(awaitingApproval, hasAtLeastOneLoginButton) { - let classes = ["login-modal"]; + const classes = ["login-modal"]; if (awaitingApproval) classes.push("awaiting-approval"); if (hasAtLeastOneLoginButton) classes.push("has-alt-auth"); return classes.join(" "); }, - // Determines whether at least one login button is enabled @computed("canLoginLocalWithEmail") hasAtLeastOneLoginButton(canLoginLocalWithEmail) { return findAll().length > 0 || canLoginLocalWithEmail; @@ -84,10 +83,7 @@ export default Ember.Controller.extend(ModalFunctionality, { return canSignUp && !loggingIn && Ember.isEmpty(authenticate); }, - @computed("loggingIn", "authenticate") - showSpinner(loggingIn, authenticate) { - return loggingIn || authenticate; - }, + showSpinner: Ember.computed.or("loggingIn", "authenticate"), @computed("canLoginLocalWithEmail", "processingEmailLink") showLoginWithEmailLink(canLoginLocalWithEmail, processingEmailLink) { @@ -96,16 +92,12 @@ export default Ember.Controller.extend(ModalFunctionality, { actions: { login() { - const self = this; - if (this.get("loginDisabled")) { + if (this.loginDisabled) { return; } - if ( - Ember.isEmpty(this.get("loginName")) || - Ember.isEmpty(this.get("loginPassword")) - ) { - self.flash(I18n.t("login.blank_username_or_password"), "error"); + if (Ember.isEmpty(this.loginName) || Ember.isEmpty(this.loginPassword)) { + this.flash(I18n.t("login.blank_username_or_password"), "error"); return; } @@ -114,57 +106,66 @@ export default Ember.Controller.extend(ModalFunctionality, { ajax("/session", { type: "POST", data: { - login: this.get("loginName"), - password: this.get("loginPassword"), - second_factor_token: this.get("secondFactorToken"), - second_factor_method: this.get("secondFactorMethod") + login: this.loginName, + password: this.loginPassword, + second_factor_token: this.secondFactorToken, + second_factor_method: this.secondFactorMethod } }).then( - function(result) { + result => { // Successful login if (result && result.error) { - self.set("loggingIn", false); + this.set("loggingIn", false); if ( result.reason === "invalid_second_factor" && - !self.get("secondFactorRequired") + !this.secondFactorRequired ) { - $("#modal-alert").hide(); - self.setProperties({ + document.getElementById("modal-alert").style.display = "none"; + + this.setProperties({ secondFactorRequired: true, showLoginButtons: false, backupEnabled: result.backup_enabled, showSecondFactor: true }); - Ember.run.next(() => { - $("#second-factor input").focus(); - }); + Ember.run.schedule("afterRender", () => + document + .getElementById("second-factor") + .querySelector("input") + .focus() + ); return; } else if (result.reason === "not_activated") { - self.send("showNotActivated", { - username: self.get("loginName"), + this.send("showNotActivated", { + username: this.loginName, sentTo: escape(result.sent_to_email), currentEmail: escape(result.current_email) }); } else if (result.reason === "suspended") { - self.send("closeModal"); + this.send("closeModal"); bootbox.alert(result.error); } else { - self.flash(result.error, "error"); + this.flash(result.error, "error"); } } else { - self.set("loggedIn", true); + this.set("loggedIn", true); // Trigger the browser's password manager using the hidden static login form: - const $hidden_login_form = $("#hidden-login-form"); + const hiddenLoginForm = document.getElementById( + "hidden-login-form" + ); + const applyHiddenFormInputValue = (value, key) => { + if (!hiddenLoginForm) return; + + hiddenLoginForm.querySelector(`input[name=${key}]`).value = value; + }; + const destinationUrl = $.cookie("destination_url"); const ssoDestinationUrl = $.cookie("sso_destination_url"); - $hidden_login_form - .find("input[name=username]") - .val(self.get("loginName")); - $hidden_login_form - .find("input[name=password]") - .val(self.get("loginPassword")); + + applyHiddenFormInputValue(this.loginName, "username"); + applyHiddenFormInputValue(this.loginPassword, "password"); if (ssoDestinationUrl) { $.removeCookie("sso_destination_url"); @@ -173,39 +174,38 @@ export default Ember.Controller.extend(ModalFunctionality, { } else if (destinationUrl) { // redirect client to the original URL $.removeCookie("destination_url"); - $hidden_login_form - .find("input[name=redirect]") - .val(destinationUrl); + + applyHiddenFormInputValue(destinationUrl, "redirect"); } else { - $hidden_login_form - .find("input[name=redirect]") - .val(window.location.href); + applyHiddenFormInputValue(window.location.href, "redirect"); } - if ( - navigator.userAgent.match(/(iPad|iPhone|iPod)/g) && - navigator.userAgent.match(/Safari/g) - ) { - // In case of Safari on iOS do not submit hidden login form - window.location.href = $hidden_login_form - .find("input[name=redirect]") - .val(); - } else { - $hidden_login_form.submit(); + if (hiddenLoginForm) { + if ( + navigator.userAgent.match(/(iPad|iPhone|iPod)/g) && + navigator.userAgent.match(/Safari/g) + ) { + // In case of Safari on iOS do not submit hidden login form + window.location.href = hiddenLoginForm.querySelector( + "input[name=redirect]" + ).value; + } else { + hiddenLoginForm.submit(); + } } return; } }, - function(e) { + e => { // Failed to login if (e.jqXHR && e.jqXHR.status === 429) { - self.flash(I18n.t("login.rate_limit"), "error"); + this.flash(I18n.t("login.rate_limit"), "error"); } else if (!areCookiesEnabled()) { - self.flash(I18n.t("login.cookies_error"), "error"); + this.flash(I18n.t("login.cookies_error"), "error"); } else { - self.flash(I18n.t("login.error"), "error"); + this.flash(I18n.t("login.error"), "error"); } - self.set("loggingIn", false); + this.set("loggingIn", false); } ); @@ -226,10 +226,10 @@ export default Ember.Controller.extend(ModalFunctionality, { }, createAccount() { - const createAccountController = this.get("createAccount"); + const createAccountController = this.createAccount; if (createAccountController) { createAccountController.resetForm(); - const loginName = this.get("loginName"); + const loginName = this.loginName; if (loginName && loginName.indexOf("@") > 0) { createAccountController.set("accountEmail", loginName); } else { @@ -240,22 +240,19 @@ export default Ember.Controller.extend(ModalFunctionality, { }, forgotPassword() { - const forgotPasswordController = this.get("forgotPassword"); + const forgotPasswordController = this.forgotPassword; if (forgotPasswordController) { - forgotPasswordController.set( - "accountEmailOrUsername", - this.get("loginName") - ); + forgotPasswordController.set("accountEmailOrUsername", this.loginName); } this.send("showForgotPassword"); }, emailLogin() { - if (this.get("processingEmailLink")) { + if (this.processingEmailLink) { return; } - if (Ember.isEmpty(this.get("loginName"))) { + if (Ember.isEmpty(this.loginName)) { this.flash(I18n.t("login.blank_username"), "error"); return; } @@ -263,11 +260,11 @@ export default Ember.Controller.extend(ModalFunctionality, { this.set("processingEmailLink", true); ajax("/u/email-login", { - data: { login: this.get("loginName").trim() }, + data: { login: this.loginName.trim() }, type: "POST" }) .then(data => { - const loginName = escapeExpression(this.get("loginName")); + const loginName = escapeExpression(this.loginName); const isEmail = loginName.match(/@/); let key = `email_login.complete_${isEmail ? "email" : "username"}`; if (data.user_found === false) { @@ -284,40 +281,36 @@ export default Ember.Controller.extend(ModalFunctionality, { ); } }) - .catch(e => { - this.flash(extractError(e), "error"); - }) - .finally(() => { - this.set("processingEmailLink", false); - }); + .catch(e => this.flash(extractError(e), "error")) + .finally(() => this.set("processingEmailLink", false)); } }, @computed("authenticate") authMessage(authenticate) { if (Ember.isEmpty(authenticate)) return ""; + const method = findAll().findBy("name", authenticate); if (method) { - return method.get("message"); + return method.message; } }, authenticationComplete(options) { - const self = this; - function loginError(errorMsg, className, callback) { + const loginError = (errorMsg, className, callback) => { showModal("login"); Ember.run.next(() => { if (callback) callback(); - self.flash(errorMsg, className || "success"); - self.set("authenticate", null); + this.flash(errorMsg, className || "success"); + this.set("authenticate", null); }); - } + }; if ( options.awaiting_approval && - !this.get("canLoginLocal") && - !this.get("canLoginLocalWithEmail") + !this.canLoginLocal && + !this.canLoginLocalWithEmail ) { this.set("awaitingApproval", true); } @@ -329,14 +322,14 @@ export default Ember.Controller.extend(ModalFunctionality, { showLoginButtons: false }); - $("#login-account-password").focus(); + document.getElementById("login-account-password").focus(); }); } for (let i = 0; i < AuthErrors.length; i++) { const cond = AuthErrors[i]; if (options[cond]) { - return loginError(I18n.t("login." + cond)); + return loginError(I18n.t(`login.${cond}`)); } } @@ -360,13 +353,14 @@ export default Ember.Controller.extend(ModalFunctionality, { return; } - const createAccountController = this.get("createAccount"); + const createAccountController = this.createAccount; createAccountController.setProperties({ accountEmail: options.email, accountUsername: options.username, accountName: options.name, authOptions: Ember.Object.create(options) }); + showModal("createAccount"); } });