hrfee/jfa-go
1
0
Fork 0
mirror of https://github.com/hrfee/jfa-go.git synced 2024-12-22 17:10:10 +00:00
Code Issues Projects Releases Wiki Activity
97db4d714a
jfa-go/html/form.html

155 lines
9.5 KiB
HTML
Raw Normal View History

Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
<!DOCTYPE html>
<html lang="en" class="{{ .cssClass }}">
<head>
prefix css with version to avoid cache conflict
2022-01-08 16:42:36 +00:00
<link rel="stylesheet" type="text/css" href="css/{{ .cssVersion }}bundle.css">
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
{{ template "header.html" . }}
form: add CAPTCHAs Enabled in Settings > Captchas, shows a captcha on the account creation form.
2022-01-10 01:55:48 +00:00
{{ if .passwordReset }}
<title>{{ .strings.passwordReset }}</title>
{{ else }}
<title>{{ .strings.pageTitle }}</title>
{{ end }}
add option to auto redirect to jellyfin (or given link) if enabled (General>Auto redirect on success), the user will not have to click "continue" on the form or creation success page and will insted be redirected. For #242.
2023-02-02 10:34:22 +00:00
<script>
window.redirectToJellyfin = {{ .redirectToJellyfin }};
</script>
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
</head>
<body class="max-w-full overflow-x-hidden section">
<div id="modal-success" class="modal">
Optimised modals for mobile.
2022-01-28 22:34:34 +00:00
<div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3">
fix some padding issues
2021-12-31 00:22:28 +00:00
<span class="heading mb-4">{{ if .passwordReset }}{{ .strings.passwordReset }}{{ else }}{{ .strings.successHeader }}{{ end }}</span>
<p class="content mb-4">{{ if .passwordReset }}{{ .strings.youCanLoginPassword }}{{ else }}{{ .successMessage }}{{ end }}</p>
form: add notice about userpage on success modal, userpage title uses new strings in the form lang section.
2023-06-22 09:11:56 +00:00
{{ if .userPageEnabled }}<p class="content mb-4" id="modal-success-user-page-area" my-account-term="{{ .strings.myAccount }}">{{ .strings.userPageSuccessMessage }}</p>{{ end }}
tailwind: upgrade a17t, somewhat functional dark mode instead of adding dark: variants to each element, a preprocessor script adds them. still needs to be implemented to typescript.
2021-12-30 00:49:43 +00:00
<a class="button ~urge @low full-width center supra submit" href="{{ .jfLink }}" id="create-success-button">{{ .strings.continue }}</a>
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
</div>
</div>
Add optional email confirmation If enabled, a confirmation email will be sent before the user can create their account.
2021-01-30 19:19:12 +00:00
<div id="modal-confirmation" class="modal">
Optimised modals for mobile.
2022-01-28 22:34:34 +00:00
<div class="card relative mx-auto my-[10%] w-4/5 lg:w-1/3">
fix some padding issues
2021-12-31 00:22:28 +00:00
<span class="heading mb-4">{{ .strings.confirmationRequired }}</span>
<p class="content mb-4">{{ .strings.confirmationRequiredMessage }}</p>
Add optional email confirmation If enabled, a confirmation email will be sent before the user can create their account.
2021-01-30 19:19:12 +00:00
</div>
</div>
discord: pad, underline invite link
2023-06-19 17:03:35 +00:00
{{ template "account-linking.html" . }}
fix form layout
2021-12-31 18:52:03 +00:00
<div class="top-4 left-4 absolute">
<span class="dropdown" tabindex="0" id="lang-dropdown">
<span class="button ~urge dropdown-button">
<i class="ri-global-line"></i>
<span class="ml-2 chev"></span>
</span>
<div class="dropdown-display">
<div class="card ~neutral @low" id="lang-list">
</div>
add language selector to form
2021-01-11 19:17:43 +00:00
</div>
fix form layout
2021-12-31 18:52:03 +00:00
</span>
Added better mobile support for sign-up form.
2022-01-27 01:58:24 +00:00
</div>
almost complete telegram user verification When signing up, the user is given a pin code which they send to a telegram bot. This provides user verification, but more importantly allows the bot to message the user, as the Telegram API requires the user to interact with the bot before it can do the opposite. The bot should recognize the correct language, but a /lang command is also provided to change it. The verification process is pretty much functional but ui is still broken, and it isn't properly integrated yet.
2021-05-07 00:08:12 +00:00
<div id="notification-box"></div>
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
<div class="page-container">
fix form layout
2021-12-31 18:52:03 +00:00
<div class="card dark:~d_neutral @low">
form: fix header alignment
2023-06-15 17:20:46 +00:00
<div class="flex flex-col md:flex-row gap-3 inline align-baseline">
Optimised modals for mobile.
2022-01-28 22:34:34 +00:00
<span class="heading mr-5">
PWR: Add option to set new password from magic link For #103. Enable in Settings > Password Resets. Also changes the user's ombi password.
2021-06-07 12:46:46 +00:00
{{ if .passwordReset }}
{{ .strings.passwordReset }}
{{ else }}
{{ .strings.createAccountHeader }}
{{ end }}
</span>
Optimised modals for mobile.
2022-01-28 22:34:34 +00:00
<span class="subheading">
PWR: Add option to set new password from magic link For #103. Enable in Settings > Password Resets. Also changes the user's ombi password.
2021-06-07 12:46:46 +00:00
{{ if .passwordReset }}
{{ .strings.enterYourPassword }}
{{ else }}
{{ .helpMessage }}
{{ end }}
</span>
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
</div>
Optimised modals for mobile.
2022-01-28 22:34:34 +00:00
<div class="flex flex-col md:flex-row gap-3">
<div class="flex-1">
implement user expiry functionality All works now, but i'll add a field on the accounts tab for users with an expiry, as well as a 'disabled' badge.
2021-02-28 15:41:06 +00:00
{{ if .userExpiry }}
<aside class="col aside sm ~warning" id="user-expiry-message"></aside>
implement frontend for user expiry/duration this will add an optional validity period to users, where their account will be disabled (or deleted) a specified amount of time after they created it.
2021-02-28 00:44:28 +00:00
{{ end }}
fix form layout
2021-12-31 18:52:03 +00:00
<form class="card dark:~d_neutral @low" id="form-create" href="">
PWR: Add option to set new password from magic link For #103. Enable in Settings > Password Resets. Also changes the user's ombi password.
2021-06-07 12:46:46 +00:00
{{ if not .passwordReset }}
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
<label class="label supra">
move validationStrings out of strings in lang/form
2021-01-18 22:06:50 +00:00
{{ .strings.username }}
fix form layout
2021-12-31 18:52:03 +00:00
<input type="text" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.username }}" id="create-username" aria-label="{{ .strings.username }}">
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
</label>
Added better mobile support for sign-up form.
2022-01-27 01:58:24 +00:00
move validationStrings out of strings in lang/form
2021-01-18 22:06:50 +00:00
<label class="label supra" for="create-email">{{ .strings.emailAddress }}</label>
fix form layout
2021-12-31 18:52:03 +00:00
<input type="email" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.emailAddress }}" id="create-email" aria-label="{{ .strings.emailAddress }}" value="{{ .email }}">
almost complete telegram user verification When signing up, the user is given a pin code which they send to a telegram bot. This provides user verification, but more importantly allows the bot to message the user, as the Telegram API requires the user to interact with the bot before it can do the opposite. The bot should recognize the correct language, but a /lang command is also provided to change it. The verification process is pretty much functional but ui is still broken, and it isn't properly integrated yet.
2021-05-07 00:08:12 +00:00
{{ if .telegramEnabled }}
form: reliably disable submit button, communicate if account linking is required
2022-01-27 16:48:46 +00:00
<span class="button ~info @low full-width center mb-4" id="link-telegram">{{ .strings.linkTelegram }} {{ if .telegramRequired }}({{ .strings.required }}){{ end }}</span>
PIN verification, notifications, multiple notif providers Discord, Email & Telegram can be enabled, although email is always enabled right now (will fix). Also apparently markdown hyperlinks don't work in Discord, eventually will implement something to convert them to embeds.
2021-05-21 20:35:25 +00:00
{{ end }}
{{ if .discordEnabled }}
form: reliably disable submit button, communicate if account linking is required
2022-01-27 16:48:46 +00:00
<span class="button ~info @low full-width center mb-4" id="link-discord">{{ .strings.linkDiscord }} {{ if .discordRequired }}({{ .strings.required }}){{ end }}</span>
PIN verification, notifications, multiple notif providers Discord, Email & Telegram can be enabled, although email is always enabled right now (will fix). Also apparently markdown hyperlinks don't work in Discord, eventually will implement something to convert them to embeds.
2021-05-21 20:35:25 +00:00
{{ end }}
Matrix: Setup bot, add PIN verification PIN is verified but not used currently. Works a little different than the others, you input your matrix user ID and then the PIN is sent to you. The bot doesn't support E2EE, so the bot being the first one to message ensures the chat is unencrypted.
2021-05-29 16:43:11 +00:00
{{ if .matrixEnabled }}
form: reliably disable submit button, communicate if account linking is required
2022-01-27 16:48:46 +00:00
<span class="button ~info @low full-width center mb-4" id="link-matrix">{{ .strings.linkMatrix }} {{ if .matrixRequired }}({{ .strings.required }}){{ end }}</span>
Matrix: Setup bot, add PIN verification PIN is verified but not used currently. Works a little different than the others, you input your matrix user ID and then the PIN is sent to you. The bot doesn't support E2EE, so the bot being the first one to message ensures the chat is unencrypted.
2021-05-29 16:43:11 +00:00
{{ end }}
{{ if or (.telegramEnabled) (or .discordEnabled .matrixEnabled) }}
telegram: Fix UI and store useful Telegram info Creation now works, and language preferences made before signup are kept. telegram file storage now uses the Jellyfin ID as a key, which makes much more sense. Also added radios to select preferred notification method (email/telegram) as well, which the admin will soon be able to change also.
2021-05-07 13:32:51 +00:00
<div id="contact-via" class="unfocused">
form: show radios for only linked contact methods
2022-01-27 16:56:13 +00:00
<label class="row switch pb-4 unfocused">
<input type="radio" name="contact-via" value="email" id="contact-via-email" class="mr-2"><span>Contact through Email</span>
telegram: Fix UI and store useful Telegram info Creation now works, and language preferences made before signup are kept. telegram file storage now uses the Jellyfin ID as a key, which makes much more sense. Also added radios to select preferred notification method (email/telegram) as well, which the admin will soon be able to change also.
2021-05-07 13:32:51 +00:00
</label>
PIN verification, notifications, multiple notif providers Discord, Email & Telegram can be enabled, although email is always enabled right now (will fix). Also apparently markdown hyperlinks don't work in Discord, eventually will implement something to convert them to embeds.
2021-05-21 20:35:25 +00:00
{{ if .telegramEnabled }}
form: show radios for only linked contact methods
2022-01-27 16:56:13 +00:00
<label class="row switch pb-4 unfocused">
discord: add role to user on signup This requires an extra permission, so you'll have to modify your bot settings, kick it from your server and re-add it for this to work. The role you select must also be lower in hierarchy than the bot's group.
2022-01-13 22:34:47 +00:00
<input type="radio" name="contact-via" value="telegram" id="contact-via-telegram" class="mr-2"><span>Contact through Telegram</span>
telegram: Fix UI and store useful Telegram info Creation now works, and language preferences made before signup are kept. telegram file storage now uses the Jellyfin ID as a key, which makes much more sense. Also added radios to select preferred notification method (email/telegram) as well, which the admin will soon be able to change also.
2021-05-07 13:32:51 +00:00
</label>
PIN verification, notifications, multiple notif providers Discord, Email & Telegram can be enabled, although email is always enabled right now (will fix). Also apparently markdown hyperlinks don't work in Discord, eventually will implement something to convert them to embeds.
2021-05-21 20:35:25 +00:00
{{ end }}
{{ if .discordEnabled }}
form: show radios for only linked contact methods
2022-01-27 16:56:13 +00:00
<label class="row switch pb-4 unfocused">
discord: add role to user on signup This requires an extra permission, so you'll have to modify your bot settings, kick it from your server and re-add it for this to work. The role you select must also be lower in hierarchy than the bot's group.
2022-01-13 22:34:47 +00:00
<input type="radio" name="contact-via" value="discord" id="contact-via-discord" class="mr-2"><span>Contact through Discord</span>
PIN verification, notifications, multiple notif providers Discord, Email & Telegram can be enabled, although email is always enabled right now (will fix). Also apparently markdown hyperlinks don't work in Discord, eventually will implement something to convert them to embeds.
2021-05-21 20:35:25 +00:00
</label>
{{ end }}
Matrix: Setup bot, add PIN verification PIN is verified but not used currently. Works a little different than the others, you input your matrix user ID and then the PIN is sent to you. The bot doesn't support E2EE, so the bot being the first one to message ensures the chat is unencrypted.
2021-05-29 16:43:11 +00:00
{{ if .matrixEnabled }}
form: show radios for only linked contact methods
2022-01-27 16:56:13 +00:00
<label class="row switch pb-4 unfocused">
discord: add role to user on signup This requires an extra permission, so you'll have to modify your bot settings, kick it from your server and re-add it for this to work. The role you select must also be lower in hierarchy than the bot's group.
2022-01-13 22:34:47 +00:00
<input type="radio" name="contact-via" value="matrix" id="contact-via-matrix" class="mr-2"><span>Contact through Matrix</span>
Matrix: Setup bot, add PIN verification PIN is verified but not used currently. Works a little different than the others, you input your matrix user ID and then the PIN is sent to you. The bot doesn't support E2EE, so the bot being the first one to message ensures the chat is unencrypted.
2021-05-29 16:43:11 +00:00
</label>
{{ end }}
telegram: Fix UI and store useful Telegram info Creation now works, and language preferences made before signup are kept. telegram file storage now uses the Jellyfin ID as a key, which makes much more sense. Also added radios to select preferred notification method (email/telegram) as well, which the admin will soon be able to change also.
2021-05-07 13:32:51 +00:00
</div>
almost complete telegram user verification When signing up, the user is given a pin code which they send to a telegram bot. This provides user verification, but more importantly allows the bot to message the user, as the Telegram API requires the user to interact with the bot before it can do the opposite. The bot should recognize the correct language, but a /lang command is also provided to change it. The verification process is pretty much functional but ui is still broken, and it isn't properly integrated yet.
2021-05-07 00:08:12 +00:00
{{ end }}
PWR: Add option to set new password from magic link For #103. Enable in Settings > Password Resets. Also changes the user's ombi password.
2021-06-07 12:46:46 +00:00
{{ end }}
move validationStrings out of strings in lang/form
2021-01-18 22:06:50 +00:00
<label class="label supra" for="create-password">{{ .strings.password }}</label>
fix form layout
2021-12-31 18:52:03 +00:00
<input type="password" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.password }}" id="create-password" aria-label="{{ .strings.password }}">
Added better mobile support for sign-up form.
2022-01-27 01:58:24 +00:00
move validationStrings out of strings in lang/form
2021-01-18 22:06:50 +00:00
<label class="label supra" for="create-reenter-password">{{ .strings.reEnterPassword }}</label>
fix form layout
2021-12-31 18:52:03 +00:00
<input type="password" class="input ~neutral @high mt-2 mb-4" placeholder="{{ .strings.password }}" id="create-reenter-password" aria-label="{{ .strings.reEnterPassword }}">
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
<label>
<input type="submit" class="unfocused">
tailwind: upgrade a17t, somewhat functional dark mode instead of adding dark: variants to each element, a preprocessor script adds them. still needs to be implemented to typescript.
2021-12-30 00:49:43 +00:00
<span class="button ~urge @low full-width center supra submit">
PWR: Add option to set new password from magic link For #103. Enable in Settings > Password Resets. Also changes the user's ombi password.
2021-06-07 12:46:46 +00:00
{{ if .passwordReset }}
{{ .strings.reset }}
{{ else }}
{{ .strings.createAccountButton }}
{{ end }}
</span>
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
</label>
</form>
</div>
captcha: recaptcha respects dark mode also removed the ugly border around it.
2023-06-15 16:35:51 +00:00
<div class="flex-initial">
fix form layout
2021-12-31 18:52:03 +00:00
<div class="card ~neutral @low mb-4">
userpage: implement change password functionality
2023-06-22 19:54:52 +00:00
<span class="label supra">{{ .strings.passwordRequirementsHeader }}</span>
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
<ul>
{{ range $key, $value := .requirements }}
<li class="" id="requirement-{{ $key }}" min="{{ $value }}">
<span class="badge lg ~positive requirement-valid"></span> <span class="content requirement-content"></span>
</li>
{{ end }}
</ul>
</div>
form: add CAPTCHAs Enabled in Settings > Captchas, shows a captcha on the account creation form.
2022-01-10 01:55:48 +00:00
{{ if .captcha }}
<div class="card ~neutral @low mb-4">
captcha: recaptcha respects dark mode also removed the ugly border around it.
2023-06-15 16:35:51 +00:00
<span class="label supra mb-2">CAPTCHA {{ if not .reCAPTCHA }}<span id="captcha-regen" title="{{ .strings.refresh }}" class="badge lg @low ~info ml-2 float-right"><i class="ri-refresh-line"></i></span><span id="captcha-success" class="badge lg @low ~critical ml-2 float-right"><i class="ri-close-line"></i></span>{{ end }}</span>
signup: add reCAPTCHA can be enabled in settings > captcha, requires a site key & secret key from google. New wiki article explains getting these. currently a little ugly looking on the page itself, hopefully fixable.
2023-06-15 16:11:27 +00:00
<div id="captcha-img" class="mt-2 mb-2 {{ if .reCAPTCHA }}g-recaptcha{{ end }}"></div>
{{ if not .reCAPTCHA }}
form: add CAPTCHAs Enabled in Settings > Captchas, shows a captcha on the account creation form.
2022-01-10 01:55:48 +00:00
<input class="field ~neutral @low" id="captcha-input" class="mt-2" placeholder="CAPTCHA">
signup: add reCAPTCHA can be enabled in settings > captcha, requires a site key & secret key from google. New wiki article explains getting these. currently a little ugly looking on the page itself, hopefully fixable.
2023-06-15 16:11:27 +00:00
{{ end }}
form: add CAPTCHAs Enabled in Settings > Captchas, shows a captcha on the account creation form.
2022-01-10 01:55:48 +00:00
</div>
{{ end }}
functional continue button in form, hide empty contactMessage box
2021-01-09 00:07:19 +00:00
{{ if .contactMessage }}
fix form layout
2021-12-31 18:52:03 +00:00
<aside class="col aside sm ~info mt-4">{{ .contactMessage }}</aside>
functional continue button in form, hide empty contactMessage box
2021-01-09 00:07:19 +00:00
{{ end }}
Merge a17t-redesign, kinda ts-ify setup.js the web ui has been redesigned with the a17t toolkit, which imo looks a lot better than bootstrap. This also brought a complete rework of the web code, which now makes a lot more sense hopefully. the setup page is still stuck with bootstrap, its not much of a priority but i'll rewrite it eventually.
2021-01-05 18:16:23 +00:00
</div>
</div>
</div>
</div>
{{ template "form-base" . }}
</body>
</html>
Reference in New Issue Copy Permalink