| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103 |
- extends ../layout-website-redesign
- include ../_mixins/recaptcha
- include ../_mixins/notification
- include ../_mixins/ciam_mixins
- block vars
- - var suppressNavbar = true
- - var suppressFooter = true
- - var suppressSkipToContent = true
- - isWebsiteRedesign = true
- block content
- - var showCaptcha = settings.recaptcha && settings.recaptcha.siteKey && !(settings.recaptcha.disabled && settings.recaptcha.disabled.passwordReset)
- if showCaptcha
- script(
- type='text/javascript'
- nonce=scriptNonce
- src='https://www.recaptcha.net/recaptcha/api.js?render=explicit'
- )
- div(
- id='recaptcha'
- class='g-recaptcha'
- data-sitekey=settings.recaptcha.siteKey
- data-size='invisible'
- data-badge='inline'
- )
- .ciam-enabled.ciam-layout.ciam-password-reset(
- data-ol-captcha-retry-trigger-area=''
- )
- +ciamLogo
- .ciam-container
- main#main-content.ciam-card
- form(
- name='passwordResetForm'
- captcha-action-name=showCaptcha ? 'passwordReset' : false
- data-ciam-form
- data-ol-async-form
- action='/user/password/reset'
- method='POST'
- captcha=showCaptcha ? '' : false
- )
- if error === 'password_reset_token_expired'
- h1 #{translate("sorry_your_token_expired")}
- else
- h1(data-ol-not-sent) #{translate("reset_your_password")}
- h1(hidden data-ol-sent) #{translate("check_your_inbox")}
- div(data-ol-not-sent)
- +formMessagesNewStyle
- if error && error !== 'password_reset_token_expired'
- +ciamErrorNotification
- p #{translate(error)}
- div(data-ol-custom-form-message='no-password-allowed-due-to-sso' hidden)
- +ciamErrorNotification
- p !{translate('you_cant_reset_password_due_to_sso', {}, [{ name: 'a', attrs: { href: '/sso-login' } }])}
- if error === 'password_reset_token_expired'
- p.intro-p(data-ol-not-sent) #{translate('please_request_a_new_password_reset_email_and_follow_the_link')}.
- else
- p.intro-p(data-ol-not-sent) #{translate("enter_your_email_and_we_will_send_reset_instructions")}
- div(data-ol-not-sent)
- input(name='_csrf' type='hidden' value=csrfToken)
- .form-group.form-group-ds
- label.form-label(for='email') #{translate("email")}
- input#email.form-control.form-control-ds.form-control-lg(
- name='email'
- type='email'
- required
- autocomplete='username'
- autofocus
- )
- .actions
- button.btn.btn-ds.btn-lg.btn-primary.w-100(
- type='submit'
- data-ol-disabled-inflight
- data-ol-spinner-inflight
- aria-label=translate('send_reset_link')
- )
- +ciamButtonContentLoading(`${translate('requesting_password_reset')}…`)= translate('send_reset_link')
- p.ciam-login-text
- a(href='/login') #{translate("back_to_log_in")}
- div(hidden data-ol-sent)
- p.intro-p !{translate('if_theres_an_account_youll_get_reset_email', {email: '<strong id="sent-email-display">your email</strong>'})}
- p.ciam-login-text.text-start
- a(href='/login') #{translate('back_to_log_in')}
- if showCaptcha
- .ciam-disclaimers
- +ciamRecaptchaConditions
- +ciamCardFooter(true)
- // retrieve and display the email used for password reset after form is sent
- script(nonce=scriptNonce).
- document.querySelector('form[name="passwordResetForm"]').addEventListener('sent', function () {
- const email = this.querySelector('input[name="email"]').value
- const display = document.getElementById('sent-email-display')
- if (display) display.textContent = email
- })
|
