Skip to content

GitLab

T
tangled
Commit 39c0cf9c authored by Denis Kuznetsov's avatar Denis Kuznetsov Committed by Commit Bot
Browse files
Options

OOBE: Migrate Gaia password changed to oobe-dialog 

Bug: 981472
Change-Id: If149ecb5692c7f2e468cf50f91f85552272f1798
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2238835
Commit-Queue: Denis Kuznetsov [CET] <antrim@chromium.org>
Reviewed-by: default avatarRoman Sorokin [CET] <rsorokin@chromium.org>
Cr-Commit-Position: refs/heads/master@{#780285}
parent 1df570ee
Hide whitespace changes
Inline Side-by-side
Showing with 142 additions and 120 deletions
chrome/browser/chromeos/login/password_change_browsertest.cc
View file @ 39c0cf9c
......@@ -48,18 +48,15 @@ const char kUserEmail[] = "test-user@gmail.com";
const char kGaiaID[] = "111111";
const char kTokenHandle[] = "test_token_handle";
const test::UIPath kPasswordStep = {"gaia-password-changed", "oldPasswordCard"};
const test::UIPath kPasswordStep = {"gaia-password-changed", "passwordStep"};
const test::UIPath kOldPasswordInput = {"gaia-password-changed",
"oldPasswordInput"};
const test::UIPath kSendPasswordButton = {"gaia-password-changed",
"oldPasswordInputForm", "button"};
const test::UIPath kSendPasswordButton = {"gaia-password-changed", "next"};
const test::UIPath kForgotPassword = {"gaia-password-changed",
"forgot-password-link"};
const test::UIPath kTryAgain = {"gaia-password-changed", "try-again-link"};
const test::UIPath kProceedAnyway = {"gaia-password-changed",
"proceedAnywayBtn"};
const test::UIPath kCancel = {"gaia-password-changed", "navigation",
"closeButton"};
"forgotPasswordLink"};
const test::UIPath kTryAgain = {"gaia-password-changed", "tryAgain"};
const test::UIPath kProceedAnyway = {"gaia-password-changed", "proceedAnyway"};
const test::UIPath kCancel = {"gaia-password-changed", "cancel"};
} // namespace
......
chrome/browser/resources/chromeos/login/BUILD.gn
View file @ 39c0cf9c
......@@ -143,6 +143,8 @@ js_library("gaia_input_form") {
js_library("gaia_password_changed") {
deps = [
"components:login_screen_behavior",
"components:multi_step_behavior",
"components:oobe_dialog_host_behavior",
"components:oobe_i18n_behavior",
]
}
......
chrome/browser/resources/chromeos/login/active_directory_password_change.html
View file @ 39c0cf9c
......@@ -30,7 +30,7 @@
<dom-module id="active-directory-password-change">
<template>
<style include="oobe-common"></style>
<link rel="stylesheet" href="gaia_password_changed.css">
<link rel="stylesheet" href="active_directory_password_change.css">
<link rel="stylesheet" href="gaia_card_parameters.css">
<neon-animated-pages id="animatedPages" class="fit"
entry-animation="fade-in-animation" exit-animation="fade-out-animation"
......
chrome/browser/resources/chromeos/login/components/oobe_dialog_host.css
View file @ 39c0cf9c
......@@ -35,6 +35,16 @@
box-shadow: inset 0 0 4px 4px rgba(241, 243, 244, 0.5); /* #F1F3F4 */
}
.oobe-form {
/* 40px distance from subtitle (oobe forms spec) - 20px of footer-container */
padding-top: 20px;
}
cr-input.oobe-input {
max-width: 560px;
padding-bottom: 8px;
}
/* -- WebviewScrollShadowsHelper --
* Variables that are used for displaying scroll shadows in OOBE.
*/
......
chrome/browser/resources/chromeos/login/debug/debug.js
View file @ 39c0cf9c
......@@ -332,6 +332,7 @@ cr.define('cr.ui.login.debug', function() {
// GAIA password changed.
id: 'gaia-password-changed',
kind: ScreenKind.OTHER,
handledSteps: 'password',
data: {
email: 'someone@example.com',
},
......
chrome/browser/resources/chromeos/login/gaia_password_changed.html
View file @ 39c0cf9c
......@@ -5,102 +5,77 @@
<link rel="import" href="chrome://resources/html/polymer.html">
<link rel="import" href="chrome://resources/cr_elements/cr_input/cr_input.html">
<link rel="import" href="chrome://resources/cr_elements/icons.html">
<link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/animations/fade-in-animation.html">
<link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/animations/fade-out-animation.html">
<link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animatable.html">
<link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/neon-animated-pages.html">
<link rel="import" href="chrome://resources/polymer/v1_0/neon-animation/web-animations.html">
<link rel="import" href="chrome://resources/polymer/v1_0/paper-styles/color.html">
<!--
Password changed UI for the New Gaia flow.
Contains two cards with a fade transition between them:
1. Old password input form.
Password changed UI for the Gaia flow.
Contains cards with a transition between them:
1. Old password input form
2. Warning about data loss
3. Spinner with notice "Please wait";
3. Spinner with notice "Please wait"
Example:
<gaia-password-changed id="gaia-password-changed" hidden>
</gaia-password-changed>
Attributes:
'email' - displayed email in header.
Events:
'passwordEnter' - fired when user enters password. Fires with an argument
|password|.
'proceedAnyway' - fired when user decides to skip old password and
lose all the data in cryptohome.
'cancel' - fired when user press X-button.
Methods:
'invalidate' - mark password input as invalid.
'reset' - reset element, sets in on the first screen and enables
buttons.
'focus' - if current card is the first one it focuses password input.
-->
<dom-module id="gaia-password-changed">
<template>
<style include="oobe-common"></style>
<link rel="stylesheet" href="gaia_password_changed.css">
<link rel="stylesheet" href="gaia_card_parameters.css">
<neon-animated-pages id="animatedPages" class="fit"
entry-animation="fade-in-animation" exit-animation="fade-out-animation"
on-neon-animation-finish="onAnimationFinish_" selected="0">
<neon-animatable class="fit">
<gaia-card id="oldPasswordCard" class="fit">
<gaia-header slot="header" email="[[email]]">
</gaia-header>
<div slot="footer" class="gaia-body-text"
class="horizontal layout center">
<p>[[i18nDynamic(locale, 'passwordChangedTitle')]]</p>
</div>
<gaia-input-form slot="footer" id="oldPasswordInputForm"
disabled="[[disabled]]" on-submit="onPasswordSubmitted_"
button-text="[[i18nDynamic(locale,'nextButtonText')]]">
<cr-input slot="inputs" id="oldPasswordInput" type="password"
required label="[[i18nDynamic(locale, 'oldPasswordHint')]]"
error-message="[[i18nDynamic(locale, 'oldPasswordIncorrect')]]">
</cr-input>
<gaia-button id="forgot-password-link"
on-click="onForgotPasswordClicked_" link>
[[i18nDynamic(locale,'forgotOldPasswordButtonText')]]
</gaia-button>
</gaia-input-form>
</gaia-card>
</neon-animatable>
<neon-animatable class="fit">
<gaia-card class="fit">
<gaia-header slot="header" email="[[email]]">
</gaia-header>
<div slot="footer">
<div class="gaia-body-text horizontal layout center">
<iron-icon icon="cr:warning"></iron-icon>
<p class="flex">
[[i18nDynamic(locale,'passwordChangedProceedAnywayTitle')]]
</p>
</div>
<div class="horizontal layout justified center">
<gaia-button id="try-again-link"
on-click="onTryAgainClicked_" link>
[[i18nDynamic(locale,'passwordChangedTryAgain')]]
</gaia-button>
<gaia-button id="proceedAnywayBtn" on-click="onProceedClicked_">
[[i18nDynamic(locale,'proceedAnywayButton')]]
</gaia-button>
</div>
</div>
</gaia-card>
</neon-animatable>
<neon-animatable class="fit">
<throbber-notice class="fit" text-key="gaiaLoading">
<style include="oobe-dialog-host"></style>
<oobe-dialog role="dialog" has-buttons for-step="password" id="passwordStep"
subtitle-key="passwordChangedTitle">
<hd-iron-icon icon1x="oobe-32:avatar" icon2x="oobe-64:avatar"
slot="oobe-icon">
</hd-iron-icon>
<h1 slot="title">[[email]]</h1>
<div slot="footer" class="flex layout vertical oobe-form">
<cr-input type="password" id="oldPasswordInput" required
value="{{password_}}" invalid="{{passwordInvalid_}}"
class="focus-on-show oobe-input"
placeholder="[[i18nDynamic(locale, 'oldPasswordHint')]]"
error-message="[[i18nDynamic(locale, 'oldPasswordIncorrect')]]">
</cr-input>
<gaia-button id="forgotPasswordLink"
on-click="onForgotPasswordClicked_" link>
[[i18nDynamic(locale,'forgotOldPasswordButtonText')]]
</gaia-button>
</div>
<div slot="bottom-buttons" class="layout horizontal end-justified">
<oobe-text-button id="cancel" on-tap="onCancel_" text-key="cancel"
border>
</oobe-text-button>
<oobe-next-button id="next" on-tap="submit_" inverse
text-key="nextButtonText">
</oobe-next-button>
</div>
</oobe-dialog>
<oobe-dialog role="dialog" has-buttons for-step="forgot" id="forgotPassword"
subtitle-key="passwordChangedProceedAnywayTitle">
<hd-iron-icon icon1x="oobe-32:warning" icon2x="oobe-64:warning"
slot="oobe-icon">
</hd-iron-icon>
<h1 slot="title">[[email]]</h1>
<div slot="bottom-buttons" class="flex layout horizontal">
<oobe-text-button id="tryAgain" on-tap="onTryAgainClicked_"
text-key="passwordChangedTryAgain">
</oobe-text-button>
<div class="flex">
</div>
<oobe-text-button id="proceedAnyway" on-tap="onProceedClicked_"
text-key="proceedAnywayButton" inverse>
</oobe-text-button>
</div>
</oobe-dialog>
<oobe-dialog id="progress" role="dialog" no-header for-step="progress"
no-footer-padding>
<div slot="footer" class="flex layout vertical center center-justified">
<throbber-notice text-key="gaiaLoading">
</throbber-notice>
</neon-animatable>
</neon-animated-pages>
<navigation-bar id="navigation" disabled="[[disabled]]" close-visible
on-close="onClose_">
</navigation-bar>
</div>
</oobe-dialog>
</template>
</dom-module>
chrome/browser/resources/chromeos/login/gaia_password_changed.js
View file @ 39c0cf9c
......@@ -2,17 +2,56 @@
// Use of this source code is governed by a BSD-style license that can be
// found in the LICENSE file.
'use strict';
(function() {
/**
* UI mode for the dialog.
* @enum {string}
*/
const UIState = {
PASSWORD: 'password',
FORGOT: 'forgot',
PROGRESS: 'progress',
};
Polymer({
is: 'gaia-password-changed',
behaviors: [OobeI18nBehavior, LoginScreenBehavior],
behaviors: [
OobeI18nBehavior,
OobeDialogHostBehavior,
LoginScreenBehavior,
MultiStepBehavior,
],
properties: {
email: String,
email: {
type: String,
value: '',
},
password_: {
type: String,
value: '',
},
passwordInvalid_: {
type: Boolean,
value: false,
},
disabled: {type: Boolean, value: false},
},
defaultUIStep() {
return UIState.PASSWORD;
},
UI_STEPS: UIState,
/** @override */
ready() {
this.initializeLoginScreen('GaiaPasswordChangedScreen', {
......@@ -29,42 +68,36 @@ Polymer({
onBeforeShow(data) {
this.reset();
this.email = data && 'email' in data && data.email;
this.$.oldPasswordInput.invalid =
data && 'showError' in data && data.showError;
this.passwordInvalid_ = data && 'showError' in data && data.showError;
},
reset() {
this.$.animatedPages.selected = 0;
this.setUIStep(UIState.PASSWORD);
this.clearPassword();
this.disabled = false;
this.$.navigation.closeVisible = true;
this.$.oldPasswordCard.classList.remove('disabled');
},
focus() {
if (this.$.animatedPages.selected == 0)
this.$.oldPasswordInput.focus();
},
/** @private */
onPasswordSubmitted_() {
submit_() {
if (this.disabled)
return;
if (!this.$.oldPasswordInput.validate())
return;
this.$.oldPasswordCard.classList.add('disabled');
this.setUIStep(UIState.PROGRESS);
this.disabled = true;
chrome.send('migrateUserData', [this.$.oldPasswordInput.value]);
},
/** @private */
onForgotPasswordClicked_() {
this.setUIStep(UIState.FORGOT);
this.clearPassword();
this.$.animatedPages.selected += 1;
},
/** @private */
onTryAgainClicked_() {
this.$.oldPasswordInput.invalid = false;
this.$.animatedPages.selected -= 1;
this.setUIStep(UIState.PASSWORD);
},
/** @private */
......@@ -73,22 +106,25 @@ Polymer({
},
clearPassword() {
this.$.oldPasswordInput.value = '';
this.$.oldPasswordInput.invalid = false;
this.password_ = '';
this.passwordInvalid_ = false;
},
/** @private */
onProceedClicked_() {
if (this.disabled)
return;
this.setUIStep(UIState.PROGRESS);
this.disabled = true;
this.$.navigation.closeVisible = false;
this.$.animatedPages.selected = 2;
chrome.send('login.GaiaPasswordChangedScreen.userActed', ['resync']);
this.clearPassword();
this.userActed('resync');
},
/** @private */
onClose_() {
if (!this.disabled) {
chrome.send('login.GaiaPasswordChangedScreen.userActed', ['cancel']);
}
onCancel_() {
if (this.disabled)
return;
this.userActed('cancel');
}
});
})();
chrome/browser/resources/chromeos/login/saml_confirm_password.html
View file @ 39c0cf9c
......@@ -39,13 +39,14 @@
<div id="subtitle" slot="subtitle">
[[subtitleText_(locale, isManualInput)]]
</div>
<div slot="footer" class="flex layout vertical">
<div slot="footer" class="flex layout vertical oobe-form">
<cr-input type="password" id="passwordInput" required
class="focus-on-show"
class="focus-on-show oobe-input"
placeholder="[[passwordPlaceholder_(locale, isManualInput)]]"
error-message="[[passwordErrorText_(locale, isManualInput)]]">
</cr-input>
<cr-input type="password" id="confirmPasswordInput" required
class="oobe-input"
hidden="[[!isManualInput]]"
placeholder="[[i18nDynamic(locale, 'confirmPasswordLabel')]]"
error-message="[[i18nDynamic(locale, 'manualPasswordMismatch')]]">
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment