From f085be23da4eab4dc4369fea9e13dc827f12bf4f Mon Sep 17 00:00:00 2001 From: Olivier Dony Date: Fri, 25 Sep 2020 18:15:34 +0000 Subject: [IMP] base, totp: simplify form layout and improve responsiveness Some of the TOTP-related forms contained an attempt at making a centered modal pop-up, using a bootstrap `card` that would also serve to emphasize that the interaction was sensitive and security-related. Some of the "footer buttons" were moved inside the form to make it more obvious that they were part of the interaction flow. However some of this caused breakages of responsiveness and did not yield a really satisfactory result anyway. This commit switches back to using regular non-centered forms. It looks quite ugly because the content is better suited for a narrow modal, but it means less surprises in terms of layout and less responsiveness issues. closes odoo/odoo#58541 Signed-off-by: Olivier Dony (odo) --- addons/auth_totp/static/tests/totp_flow.js | 6 ++-- addons/auth_totp/views/templates.xml | 9 +++++- addons/auth_totp/views/user_preferences.xml | 21 +++++++------ .../static/src/js/totp_frontend.js | 10 ++----- .../auth_totp_portal/static/tests/totp_portal.js | 4 +-- addons/portal/static/src/js/portal.js | 3 ++ addons/portal/static/src/xml/portal_security.xml | 29 +++++------------- odoo/addons/base/views/res_users_views.xml | 35 +++++++--------------- .../test_apikeys/static/tests/apikey_flow.js | 2 +- 9 files changed, 50 insertions(+), 69 deletions(-) diff --git a/addons/auth_totp/static/tests/totp_flow.js b/addons/auth_totp/static/tests/totp_flow.js index 575e847f4f7..eea245041a9 100644 --- a/addons/auth_totp/static/tests/totp_flow.js +++ b/addons/auth_totp/static/tests/totp_flow.js @@ -42,7 +42,7 @@ tour.register('totp_tour_setup', { trigger: 'button[name=totp_enable_wizard]', }, { content: "Check that we have to enter enhanced security mode", - trigger: '.card-title:contains("confirm your password")', + trigger: 'div:contains("confirm your password")', run: () => {}, }, { content: "Input password", @@ -126,7 +126,7 @@ tour.register('totp_login_enabled', { trigger: 'button[name=totp_disable]', }, { content: "Check that we have to enter enhanced security mode", - trigger: '.card-title:contains("confirm your password")', + trigger: 'div:contains("confirm your password")', run: () => {}, }, { content: "Input password", @@ -225,7 +225,7 @@ tour.register('totp_admin_disables', { trigger: 'a.dropdown-item:contains(Disable TOTP on users)' }, { // enhanced security yo content: "Check that we have to enter enhanced security mode", -trigger: '.card-title:contains("confirm your password")', +trigger: 'div:contains("confirm your password")', run: () => {}, }, { content: "Input password", diff --git a/addons/auth_totp/views/templates.xml b/addons/auth_totp/views/templates.xml index 6100317eeed..100dbbc4452 100644 --- a/addons/auth_totp/views/templates.xml +++ b/addons/auth_totp/views/templates.xml @@ -20,12 +20,19 @@ -
+
+
+ + Open the two-factor authentication app on your + device to obtain a code and verify your identity +
+
+
-
+
+
diff --git a/addons/auth_totp_portal/static/src/js/totp_frontend.js b/addons/auth_totp_portal/static/src/js/totp_frontend.js index cb249e63d65..5f55970344c 100644 --- a/addons/auth_totp_portal/static/src/js/totp_frontend.js +++ b/addons/auth_totp_portal/static/src/js/totp_frontend.js @@ -13,7 +13,7 @@ function fromField(f, record) { switch (f.getAttribute('name')) { case 'qrcode': const qrcode = document.createElement('img'); - qrcode.setAttribute('class', 'img img-fluid offset-1 offset-lg-2'); + qrcode.setAttribute('class', 'img img-fluid offset-1'); qrcode.setAttribute('src', 'data:image/png;base64,' + record['qrcode']); return qrcode; case 'url': @@ -24,7 +24,7 @@ function fromField(f, record) { case 'code': const code = document.createElement('input'); code.setAttribute('name', 'code'); - code.setAttribute('class', 'form-control'); + code.setAttribute('class', 'form-control col-10 col-md-6'); code.setAttribute('placeholder', '6-digit code'); code.required = true; code.maxLength = 6; @@ -108,10 +108,6 @@ class Button { // because Dialog doesnt' call() click on the descriptor object this.click = this._click.bind(this); } - if (!button_node.closest('footer')) { - // remove non-footer buttons, otherwise they will appear twice - button_node.parentNode.removeChild(button_node); - } } async _click() { if (!this.input.reportValidity()) { @@ -191,7 +187,7 @@ publicWidget.registry.TOTPButton = publicWidget.Widget.extend({ codeInput.addEventListener('input', () => codeInput.setCustomValidity('')); const buttons = []; - for(const button of body.querySelectorAll('button')) { + for(const button of doc.querySelectorAll('footer button')) { buttons.push(new Button(this, model, record.id, codeInput, button)); } diff --git a/addons/auth_totp_portal/static/tests/totp_portal.js b/addons/auth_totp_portal/static/tests/totp_portal.js index ec26366e9ad..6424647aabe 100644 --- a/addons/auth_totp_portal/static/tests/totp_portal.js +++ b/addons/auth_totp_portal/static/tests/totp_portal.js @@ -12,7 +12,7 @@ tour.register('totportal_tour_setup', { trigger: 'button#auth_totp_portal_enable', }, { content: "Check that we have to enter enhanced security mode", - trigger: '.card-title:contains("confirm your password")', + trigger: 'div:contains("confirm your password")', run: () => {}, }, { content: "Input password", @@ -84,7 +84,7 @@ tour.register('totportal_login_enabled', { trigger: 'button#auth_totp_portal_disable', }, { content: "Check that we have to enter enhanced security mode", - trigger: '.card-title:contains("confirm your password")', + trigger: 'div:contains("confirm your password")', run: () => {}, }, { content: "Input password", diff --git a/addons/portal/static/src/js/portal.js b/addons/portal/static/src/js/portal.js index 7499a798851..610e58b505f 100644 --- a/addons/portal/static/src/js/portal.js +++ b/addons/portal/static/src/js/portal.js @@ -215,6 +215,9 @@ function handleCheckIdentity(rpc, wrapped) { } }, { text: _t('Cancel'), close: true + }, { + text: _t('Forgot password?'), classes: 'btn btn-link', + click() { window.location.href = "/web/reset_password/"; } }] }).on('close', null, () => { // unlink wizard object? diff --git a/addons/portal/static/src/xml/portal_security.xml b/addons/portal/static/src/xml/portal_security.xml index 1f905563ede..ff5e62e895a 100644 --- a/addons/portal/static/src/xml/portal_security.xml +++ b/addons/portal/static/src/xml/portal_security.xml @@ -1,27 +1,12 @@ -
-
-
-
-
- - Security Control -
-
- Forgot password? -

Please confirm your password to continue

-

- This is necessary for security-related changes. The authorization will last for a few minutes. -

-
- - -
-
-
-
+ +

Please confirm your password to continue

+

This is necessary for security-related changes. The authorization will last for a few minutes.

+
+ +
diff --git a/odoo/addons/base/views/res_users_views.xml b/odoo/addons/base/views/res_users_views.xml index 51866fc0bef..a8982fe1142 100644 --- a/odoo/addons/base/views/res_users_views.xml +++ b/odoo/addons/base/views/res_users_views.xml @@ -40,32 +40,19 @@ res.users.identitycheck
- -
-
-
-
-   - Security Control -
-
- Forgot password? -

Please confirm your password to continue

-

- This is necessary for security-related changes. The authorization will last for a few minutes. -

-
-
-
-
-
+ +

Please confirm your password to continue

+

This is necessary for security-related changes. The authorization will last for a few minutes.

+
+
-
+ diff --git a/odoo/addons/test_apikeys/static/tests/apikey_flow.js b/odoo/addons/test_apikeys/static/tests/apikey_flow.js index 906ea63c005..8507f3e4001 100644 --- a/odoo/addons/test_apikeys/static/tests/apikey_flow.js +++ b/odoo/addons/test_apikeys/static/tests/apikey_flow.js @@ -24,7 +24,7 @@ tour.register('apikeys_tour_setup', { trigger: 'button:contains("New API Key")', }, { content: "Check that we have to enter enhanced security mode", - trigger: '.card-title:contains("confirm your password")', + trigger: 'div:contains("confirm your password")', run: () => {}, }, { content: "Input password", -- cgit v1.2.3