blob: 47800e2600f369d1f47935fa1f44bd8e42cccbed (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
|
<link rel="import" href="chrome://resources/polymer/polymer/polymer.html">
<link rel="import" href="chrome://resources/polymer/polymer/layout.html">
<link rel="import" href="chrome://resources/polymer/core-animated-pages/core-animated-pages.html">
<link rel="import" href="chrome://resources/polymer/core-animated-pages/transitions/cross-fade.html">
<!--
SAML password confirmation UI for the New Gaia flow.
Contains two cards with a fade transition between them:
1. Password input form.
2. Spinner with notice "Please wait";
Example:
<saml-confirm-password id="saml-confirm-password" hidden>
</saml-confirm-password>
Attributes:
'email' - Displayed email in header.
Events:
'passwordEnter' - Fired when user enters password. Fires with an argument
|password|.
'cancel' - Fired when user presses the X-button and then presses YES
in the cancel confirmation dialog.
Methods:
'invalidate' - Mark password input as invalid.
'reset' - Reset element, switches to the first screen, closes
the confirm dialog, displays the close button,
empties password field and enables buttons.
'focus' - If the current card is the first one, focuses password input.
-->
<polymer-element name="saml-confirm-password" vertical layout
attributes="email">
<template>
<link rel="stylesheet" href="saml_confirm_password.css">
<core-animated-pages id="animatedPages" transitions="cross-fade-all" flex
on-core-animated-pages-transition-end="{{onTransitionEnd}}">
<section flex>
<gaia-card id="confirmPasswordCard">
<gaia-header class="header" email="{{email}}">
</gaia-header>
<div horizontal layout center class="footer gaia-body-text">
<p i18n-content="confirmPasswordTitle">
</p>
</div>
<gaia-input-form id="inputForm" class="footer"
on-submit="{{onPasswordSubmitted}}"
i18n-values="buttonText:nextButtonText">
<gaia-input id="passwordInput" type="password" required
i18n-values="error:confirmPasswordIncorrectPassword;
label:confirmPasswordLabel;">
</gaia-input>
</gaia-input-form>
<paper-action-dialog class="footer" id="cancelConfirmDlg"
layered="false">
<p i18n-content="accountSetupCancelDialogTitle"></p>
<gaia-paper-button class="dialog-action-button" affirmative
autofocus i18n-content="accountSetupCancelDialogNo">
</gaia-paper-button>
<gaia-paper-button id="confirmCancel" on-tap="{{onConfirmCancel}}"
class="dialog-action-button" affirmative
i18n-content="accountSetupCancelDialogYes">
</gaia-paper-button>
</paper-action-dialog>
</gaia-card>
</section>
<section flex vertical layout center-justified>
<throbber-notice i18n-values="text:gaiaLoadingNewGaia" self-center>
</throbber-notice>
</section>
</core-animated-pages>
<button id="closeButton" is="gaia-icon-button" icon="close"
on-click="{{onClose}}" i18n-values="aria-label:closeButton"
tabindex="0">
</button>
</template>
</polymer-element>
|