NoLog.cz/anon
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity

always reveal generated code; refactor

Browse source
This commit is contained in:
bain 2024-06-02 13:53:48 +02:00
parent 53ee349dfd
commit 83bf3d41e1
Signed by: bain
GPG key ID: 31F0F25E3BED0B9B
1 changed files with 42 additions and 53 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

95
src/authorization.html
View file

@ -92,11 +92,11 @@
width: min-content;
}
.container[data-valid="true"] {
form[data-valid="true"] > .container {
border-color: var(--success);
}
.container[data-valid="false"] {
form[data-valid="false"] > .container {
border-color: var(--caution);
}
@ -124,11 +124,6 @@
background: var(--primary);
}
.generate-text {
text-align: center;
margin: 1.5rem 0;
}
a {
color: inherit;
}
@ -143,16 +138,8 @@
padding: 1rem;
border-radius: 5px;
box-sizing: border-box;
transition: ease 0.4s;
overflow: hidden;
}
.info-accounts.hidden {
height: 0;
opacity: 0;
}
button[data-state="password"] .closed {
display: none;
}
@ -161,19 +148,15 @@
display: none;
}
@media (prefers-color-scheme: light) {
:root {
--background: #fefefe;
--text: #2f2f2f;
--primary: #b0b0b0;
--secondary: #d9d9d9;
--success: #76B041;
--caution: #FF6B6C;
--caution-darker: #c83033;
}
.info-accounts {
color: #fefefe;
}
form[data-valid="true"] .generate {
display: none;
}
.login-once {
display: none;
}
form[data-valid="true"] .login-once {
display: block;
}
.login-action-container {
@ -205,6 +188,21 @@
width: max-content;
margin: 1.5em auto;
}
@media (prefers-color-scheme: light) {
:root {
--background: #fefefe;
--text: #2f2f2f;
--primary: #b0b0b0;
--secondary: #d9d9d9;
--success: #76B041;
--caution: #FF6B6C;
--caution-darker: #c83033;
}
.info-accounts {
color: #fefefe;
}
}
</style>
</head>
@ -219,7 +217,7 @@
<span style="font-weight:normal"> {{client_name}}</span>
</h1>
<form id="loginForm" name="login" method="post" enctype="application/x-www-form-urlencoded" >
<form id="loginForm" name="login" method="post" enctype="application/x-www-form-urlencoded" data-valid="pending">
<div class="container" id="accInputCont">
<input id="accInput" name="account" inputmode="numeric" autocomplete="current-password" autofocus type="password"
class="account-number-input" placeholder="0000000000000000" maxlength="16" required />
@ -239,8 +237,8 @@
<a id="newAccountButton" href="/new-account" target="_blank">
<span class="generate" lang="en">Generate new account</span>
<span class="generate" lang="cs" hidden>Generovat nový účet</span>
<span class="login-once hidden" lang="en">Log in once</span>
<span class="login-once hidden" lang="cs" hidden>Přihlásit se jednou</span>
<span class="login-once" lang="en">Log in once</span>
<span class="login-once" lang="cs" hidden>Přihlásit se jednou</span>
</a>
<button id="loginButton" class="login-button">
<!-- this will get changed to "Log in" by JS -->
@ -250,7 +248,7 @@
</div>
</form>
<p id="infoBox" hidden class="info-accounts hidden">
<p id="infoBox" class="info-accounts" hidden>
<span lang="en">
<b>Careful!</b> This code is the only way to access your accounts. Keep it
somewhere safe and out of sight!
@ -263,10 +261,10 @@
<p class="info-accounts notice">{{notice}}</p>
</main>
</div>
<footer>
<a href="/" target="_blank">What is this?</a>
<span id="forgetAccountButton" hidden> · <a href="javascript:forget()">Forget account</a></span>
</footer>
<footer>
<a href="/" target="_blank">What is this?</a>
<span id="forgetAccountButton" hidden> · <a href="javascript:forget()">Forget account</a></span>
</footer>
<script>
accInput.addEventListener("input", ev => {
@ -274,9 +272,9 @@
if (p.length == 16) {
const payload = p.slice(0, p.length - 1);
accInputCont.dataset.valid = p[0].toLowerCase() == 'a' && calculateChecksum(payload) == p[p.length - 1].toLowerCase();
loginForm.dataset.valid = p[0].toLowerCase() == 'a' && calculateChecksum(payload) == p[p.length - 1].toLowerCase();
} else {
accInputCont.dataset.valid = "pending";
loginForm.dataset.valid = "pending";
}
updateSecondaryAction();
@ -285,7 +283,7 @@
});
loginForm.addEventListener("submit", ev => {
if (accInputCont.dataset.valid != "true") {
if (loginForm.dataset.valid != "true") {
ev.preventDefault();
return;
}
@ -300,7 +298,6 @@
function formatInput() {
const caret = accInput.selectionStart;
const formatted = [...accInput.value.replace(/ +/g, "")].map((c, i) => i != 0 && i % 4 == 0 ? " " + c : c).join("");
if (formatted != accInput.value) {
@ -330,16 +327,7 @@
function updateSecondaryAction() {
newAccountButton.target = "_self";
if (accInputCont.dataset.valid == 'true') {
document.querySelectorAll('.generate').forEach(el => el.classList.add('hidden'))
document.querySelectorAll('.login-once').forEach(el => el.classList.remove('hidden'))
newAccountButton.href = 'javascript:loginForm.submit()';
} else {
document.querySelectorAll('.generate').forEach(el => el.classList.remove('hidden'))
document.querySelectorAll('.login-once').forEach(el => el.classList.add('hidden'))
newAccountButton.href = 'javascript:generateAccountHandler()';
}
newAccountButton.href = loginForm.dataset.valid == 'true' ? 'javascript:loginForm.submit()' : 'javascript:generateAccountHandler()';
}
function parseDigit(d) {
@ -383,13 +371,14 @@
function generateAccountHandler() {
accInput.value = generateAccount();
accInputCont.dataset.valid = true;
loginForm.dataset.valid = true;
showCodeButton.dataset.state == "password" && toggleInputType();
formatInput();
updateSecondaryAction();
infoBox.hidden = false;
setTimeout(() => infoBox.classList.toggle("hidden", false), 0);
}
function forget() {
@ -408,7 +397,7 @@
const savedCode = window.localStorage.getItem("code");
if (savedCode) {
accInput.value = savedCode;
accInputCont.dataset.valid = true;
loginForm.dataset.valid = true;
forgetAccountButton.hidden = false;
}