{{define "content"}}
{{$p := .Data.Profile}}
<h2>Profile</h2>
<form method="post" action="/settings/profile" class="stack">
<label>Bio <textarea name="bio" rows="3" maxlength="1000">{{$p.Bio}}</textarea></label>
<label>Location <input name="location" value="{{$p.Location}}" maxlength="100"></label>
<label>Workplace <input name="workplace" value="{{$p.Workplace}}" maxlength="100"></label>
<label>Website <input name="website" value="{{$p.Website}}" maxlength="200" placeholder="https://"></label>
<button>Save profile</button>
</form>
<h2>Avatar</h2>
<form method="post" action="/settings/avatar" enctype="multipart/form-data" class="stack" id="avatarform">
{{if $p.Avatar}}<img class="avatar" src="/~{{.User.Name}}/avatar" alt="">{{end}}
<label>Image <input type="file" name="avatar" accept="image/png,image/jpeg,image/gif,image/webp" required></label>
<div class="cropper" hidden><canvas></canvas><p class="muted">Drag to move the square, scroll or use the slider to resize.</p><input type="range" min="10" max="100" value="100"></div>
<input type="hidden" name="x"><input type="hidden" name="y"><input type="hidden" name="size">
<button>Upload avatar</button>
</form>
{{if $p.Avatar}}<form method="post" action="/settings/avatar/delete"><button class="danger">Remove avatar</button></form>{{end}}
<script src="/static/crop.js" defer></script>
<h2>SSH keys</h2>
{{if .Data.Keys}}<table class="keys">{{range .Data.Keys}}<tr><td>{{.Title}}</td><td><code>{{.Fingerprint}}</code></td><td class="when">{{ago .Created}}</td><td><form method="post" action="/settings/keys/{{.ID}}/delete"><button class="danger">Remove</button></form></td></tr>{{end}}</table>{{end}}
<form method="post" action="/settings/keys" class="stack">
<label>Title <input name="title" placeholder="laptop"></label>
<label>Public key <textarea name="key" rows="3" required placeholder="ssh-ed25519 AAAA..."></textarea></label>
<button>Add key</button>
</form>
<h2>Access tokens</h2>
<p class="muted">Use a token as the password when pushing over HTTPS.</p>
{{with .Data.NewToken}}<p class="notice">New token, shown once: <code>{{.}}</code></p>{{end}}
{{if .Data.Tokens}}<table class="keys">{{range .Data.Tokens}}<tr><td>{{.Title}}</td><td class="when">{{ago .Created}}</td><td><form method="post" action="/settings/tokens/{{.ID}}/delete"><button class="danger">Revoke</button></form></td></tr>{{end}}</table>{{end}}
<form method="post" action="/settings/tokens" class="stack">
<label>Title <input name="title" placeholder="ci"></label>
<button>Create token</button>
</form>
<h2>Password</h2>
<form method="post" action="/settings/password" class="stack">
<label>Current password <input name="current" type="password" required autocomplete="current-password"></label>
<label>New password <input name="password" type="password" required minlength="8" autocomplete="new-password"></label>
<button>Change password</button>
</form>
{{end}}