{{/* Account (mockup account.html): the signed-in user's own — name and e-mail,
     and password. Each form is its own POST and neither asks for the other's
     fields. Every role has this page; the instance's settings are on Server >
     Settings (settings.html). */}}
{{define "content"}}
{{template "page_head" .Head}}
{{if .Flash}}{{template "flash" .Flash}}{{end}}

<div class="columns">
  <div class="column is-6">
    {{template "box_open" .Profile}}
    {{template "body_open"}}
    <form class="sp-form" method="post" action="/account/profile">
      <div class="field"><label class="label" for="username">Username</label><div class="control has-icons-left"><input class="input" id="username" name="username" value="{{.Username}}" autocomplete="username" autocapitalize="none" spellcheck="false" required><span class="icon is-left"><i class="ti ti-user"></i></span></div></div>
      <div class="field"><label class="label" for="email">E-mail{{with .EmailTag}} {{template "tag" .}}{{end}}</label><div class="control has-icons-left"><input class="input" id="email" name="email" type="email" value="{{.Email}}" autocomplete="email" autocapitalize="none" spellcheck="false"><span class="icon is-left"><i class="ti ti-mail"></i></span></div>
        <p class="help">Your own address. Saving a new one sends it a link to confirm it; once confirmed it is where a link to reset your password can go. A domain's report address can be filled with it from Domain settings.</p></div>
      <div class="field"><label class="label" for="profile_password">Current password</label><div class="control"><input class="input" id="profile_password" name="current_password" type="password" autocomplete="current-password"></div>
        <p class="help">Needed only to change the e-mail.</p></div>
      <div class="field"><label class="checkbox"><input type="checkbox" name="notify"{{if .Notify}} checked{{end}}> Send me notifications</label>
        <p class="help">To this address, when something needs you: a DNS record of a domain stops matching, a rate limit refuses mail, the TLS certificate is about to expire, a message has waited in the queue for three days. <a href="/help#notifications">What is sent and when</a></p></div>
      <button type="submit" class="button is-primary">Save profile</button>
    </form>
    {{with .Resend}}<form class="sp-form mt-4" method="post" action="/account/email/confirm">
      <p class="help mb-3">{{if .Sent}}A link was sent to <span class="sp-mono">{{.Email}}</span> at {{.Sent}}; it works once, for 24 hours.{{else}}No link is waiting: send one to confirm <span class="sp-mono">{{.Email}}</span>.{{end}}</p>
      <button type="submit" class="button">Send the link again</button>
    </form>{{end}}
    {{template "body_close"}}
    {{template "box_close"}}
  </div>

  <div class="column is-6">
    {{template "box_open" .Password}}
    {{template "body_open"}}
    <form class="sp-form" method="post" action="/account/password">
      <div class="field"><label class="label" for="current_password">Current password</label><div class="control"><input class="input" id="current_password" name="current_password" type="password" autocomplete="current-password" required></div></div>
      <div class="sp-pair">
        <div class="field"><label class="label" for="new_password">New password</label><div class="control"><input class="input" id="new_password" name="new_password" type="password" autocomplete="new-password" required></div></div>
        <div class="field"><label class="label" for="new_password_confirm">Repeat</label><div class="control"><input class="input" id="new_password_confirm" name="new_password_confirm" type="password" autocomplete="new-password" required></div></div>
      </div>
      <p class="help mb-3">Changing it signs out every other session of this account; this one stays signed in.</p>
      <button type="submit" class="button">Change password</button>
    </form>
    {{template "body_close"}}
    {{template "box_close"}}
  </div>
</div>
{{end}}