{{template "main-top" .}}

<div class="lgn-head">
    <h1>{{t "InitUser.Title"}}</h1>

    {{ template "user-profile" . }}

    <p>{{t "InitUser.Description"}}</p>
</div>

<form action="{{ initUserUrl }}" method="POST">

    {{ .CSRF }}

    <input type="hidden" name="authRequestID" value="{{ .AuthReqID }}" />
    <input type="hidden" name="userID" value="{{ .UserID }}" />
    <input type="hidden" name="passwordSet" value="{{ .PasswordSet }}" />
    <input type="hidden" name="orgID" value="{{ .OrgID }}" />
    <input type="text" name="loginname" value="{{ .LoginName }}" autocomplete="username" class="hidden" />

    <div class="fields">
        <div class="field">
            <label class="lgn-label" for="code">{{t "InitUser.CodeLabel"}}</label>
            <input class="lgn-input" {{if .ErrMessage}}shake {{end}} type="text" id="code" name="code" value="{{.Code}}" autocomplete="one-time-code" autofocus
                required>
        </div>

        {{ if not .PasswordSet }}
        <div class="field">
            <label class="lgn-label" for="password">{{t "InitUser.NewPasswordLabel"}}</label>
            <input data-minlength="{{ .MinLength }}" data-has-uppercase="{{ .HasUppercase }}"
                data-has-lowercase="{{ .HasLowercase }}" data-has-number="{{ .HasNumber }}"
                data-has-symbol="{{ .HasSymbol }}" class="lgn-input" type="password" id="password" name="password"
                autocomplete="new-password" autofocus required>
        </div>
        <div class="field">
            <label class="lgn-label" for="passwordconfirm">{{t "InitUser.NewPasswordConfirm"}}</label>
            <input class="lgn-input" type="password" id="passwordconfirm" name="passwordconfirm"
                autocomplete="new-password" autofocus required>
            {{ template "password-complexity-policy-description" . }}
        </div>
        {{ end }}
    </div>

    {{ template "error-message" .}}

    <div class="lgn-actions lgn-reverse-order">
        <!-- position element in header -->
        <a class="lgn-icon-button lgn-left-action" href="{{ loginUrl }}">
            <i class="lgn-icon-arrow-left-solid"></i>
        </a>

        <button type="submit" id="init-button" name="resend" value="false"
            class="lgn-primary lgn-raised-button">{{t "InitUser.NextButtonText"}}</button>

        <span class="fill-space"></span>

        <button type="submit" name="resend" value="true" class="lgn-stroked-button" formnovalidate>{{t "InitUser.ResendButtonText"}}</button>
    </div>
</form>

{{ if not .PasswordSet }}
<script src="{{ resourceUrl "scripts/form_submit.js" }}"></script>
<script src="{{ resourceUrl "scripts/password_policy_check.js" }}"></script>
<script src="{{ resourceUrl "scripts/init_password_check.js" }}"></script>
{{ end }}

{{template "main-bottom" .}}