2020-10-09 22:37:16 +03:00
<!DOCTYPE html>
< html lang = "en" >
2020-05-24 17:34:32 +03:00
{{ template "head.tpl.html" . }}
2021-12-19 13:23:09 +03:00
< script >
2021-12-16 21:30:09 +03:00
// Constants
const defaultAvatarUrl = 'assets/images/unknown.svg'
const avatarUrlTemplate = {{ avatarUrlTemplate }}
function guessTimezone() {
return Intl.DateTimeFormat().resolvedOptions().timeZone
}
< / script >
2021-12-19 13:23:09 +03:00
< script type = "module" src = "assets/js/components/signup.js" > < / script >
2021-12-16 21:30:09 +03:00
2021-12-16 00:46:02 +03:00
< body class = "bg-gray-900 text-gray-700 p-4 pt-10 flex flex-col min-h-screen max-w-screen-lg mx-auto justify-center" >
2021-04-05 23:57:57 +03:00
{{ template "header.tpl.html" . }}
2020-05-24 17:34:32 +03:00
{{ template "alerts.tpl.html" . }}
2021-12-16 21:30:09 +03:00
< main class = "mt-10 flex-grow flex justify-center w-full" id = "signup-page" >
2021-12-16 00:46:02 +03:00
< div class = "flex-grow max-w-lg mt-10" >
< div class = "mb-8" >
2021-12-19 15:04:00 +03:00
< h1 class = "h1" > Sign up to Wakapi< / h1 >
< p class = "h1-subcaption" >
2021-12-16 00:46:02 +03:00
Welcome to Wakapi! Your first step is to create an account.
Afterwards, make sure to set up the < a href = "https://wakatime.com" target = "_blank" rel = "noopener noreferrer" class = "text-gray-300 hover:text-gray-400" > WakaTime< / a > client tools.
Instruction can be found in our < a href = "https://github.com/muety/wakapi#-client-setup" target = "_blank"
2020-10-09 22:37:16 +03:00
rel="noopener noreferrer"
2021-12-16 00:46:02 +03:00
class="text-gray-300 hover:text-gray-400">README< / a > .
2020-05-24 22:42:15 +03:00
< / p >
< / div >
2021-12-16 00:46:02 +03:00
< div >
< / div >
2020-05-24 22:42:15 +03:00
< form class = "mt-10" action = "signup" method = "post" >
2021-12-16 21:30:09 +03:00
< input type = "hidden" name = "location" id = "input-location" v-model = "timezone" >
2021-04-25 21:02:45 +03:00
2021-12-16 00:46:02 +03:00
< div class = "flex space-x-4" >
< div class = "mt-1" >
2021-12-16 21:30:09 +03:00
< img v-cloak id = "avatar" :src = "avatarUrl" width = "96px" class = "rounded-full border-4 border-green-700 cursor-pointer" alt = "User Profile Avatar" title = "Your Avatar" / >
2021-12-16 00:46:02 +03:00
< / div >
< div >
< div class = "mb-4" >
2021-12-19 15:04:00 +03:00
< input class = "input-default"
2021-12-16 21:30:09 +03:00
v-model="username"
2021-12-16 00:46:02 +03:00
type="text" id="username"
name="username" placeholder="Choose a username" minlength="1"
2021-12-16 21:30:09 +03:00
@keyup="updateAvatar"
2021-12-16 00:46:02 +03:00
required autofocus>
< / div >
< div class = "mb-4" >
2021-12-19 15:04:00 +03:00
< input class = "input-default"
2021-12-16 21:30:09 +03:00
v-model="email"
2021-12-16 00:46:02 +03:00
type="email" id="email"
2021-12-16 21:30:09 +03:00
name="email" @keyup="updateAvatar" placeholder="Your e-mail address">
2021-12-16 00:46:02 +03:00
< div class = "text-xs text-gray-600 mt-2" > E-Mail address is optional, but required for some weekly reports and password reset.< / div >
< / div >
< / div >
2021-02-21 15:02:11 +03:00
< / div >
2021-12-16 00:46:02 +03:00
< div class = "mb-4" >
2021-12-19 15:04:00 +03:00
< input class = "input-default"
2020-05-30 21:41:27 +03:00
type="password" id="password"
2020-05-24 22:42:15 +03:00
name="password" placeholder="Choose a password" minlength="6" required>
2020-05-24 17:34:32 +03:00
< / div >
2021-12-16 00:46:02 +03:00
< div class = "mb-4" >
2021-12-19 15:04:00 +03:00
< input class = "input-default"
2020-05-30 21:41:27 +03:00
type="password" id="password_repeat"
2021-12-16 00:46:02 +03:00
name="password_repeat" placeholder="And again..." minlength="6" required>
2020-05-24 17:34:32 +03:00
< / div >
2021-02-12 20:49:47 +03:00
{{ if eq .TotalUsers 0 }}
< p class = "text-sm text-gray-300 mt-4 mb-8" >
⚠️ < strong > Please note: < / strong > Since there are no users registered in the system, yet, the first user will have administrative privileges, while additional users won't.
< / p >
{{ end }}
2021-12-16 00:46:02 +03:00
< div class = "flex space-x-2 justify-end" >
< a href = "login" >
2021-12-22 17:44:37 +03:00
< button type = "button" class = "btn-default" > Log in< / button >
2021-12-16 00:46:02 +03:00
< / a >
2021-12-22 17:44:37 +03:00
< button type = "submit" class = "btn-primary" >
2020-05-30 21:41:27 +03:00
Create Account
< / button >
2020-05-24 17:34:32 +03:00
< / div >
< / form >
< / div >
< / main >
{{ template "footer.tpl.html" . }}
{{ template "foot.tpl.html" . }}
2021-04-25 21:02:45 +03:00
2020-05-24 17:34:32 +03:00
< / body >
< / html >