Mirrors/keyoxide-web
1
0
Fork 1
mirror of https://codeberg.org/keyoxide/keyoxide-web.git synced 2024-12-22 14:59:29 -07:00
Code Issues Projects Releases Packages Wiki Activity

Add feedback to hash utilities

Browse source
This commit is contained in:
Yarmo Mackenbach 2022-10-05 10:52:30 +02:00
parent 04f4a65a09
commit c869d38d0b
No known key found for this signature in database
GPG key ID: 37367F4AF4087AD1
4 changed files with 50 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
static-src/styles.css
View file

@ -501,6 +501,11 @@ a.button.button--liberapay {
a.button.button--liberapay:hover { a.button.button--liberapay:hover {
background-color: #fff463; background-color: #fff463;
} }
button.inline {
min-height: auto;
margin: 0;
padding: 2px 8px;
}
/* DIALOGS */ /* DIALOGS */
dialog { dialog {

46
static-src/ui.js
View file

@ -345,10 +345,24 @@ const runArgon2GenerationUtility = () => {
} }
const elInput = elUtilArgon2Generation.querySelector(".input"), const elInput = elUtilArgon2Generation.querySelector(".input"),
elOutput = elUtilArgon2Generation.querySelector(".output"); elOutput = elUtilArgon2Generation.querySelector(".output"),
elFeedback = elUtilArgon2Generation.querySelector(".feedback");
elInput.addEventListener("input", async function(evt) { elInput.addEventListener("input", async function(evt) {
elOutput.innerText = await utils.generateArgon2Hash(elInput.value); elOutput.innerText = await utils.generateArgon2Hash(elInput.value);
if (elInput.value == "") {
elFeedback.innerHTML = "";
} else {
let feedbackContent = "";
if (!(/openpgp4fpr:[0-9a-zA-Z]+/.test(elInput.value))) {
feedbackContent += "❗ Valid proofs must begin with <strong>openpgp4fpr:</strong>. <button class='inline' onclick='window.kx__fixArgon2Input();'>Fix now</button><br>";
}
if (!(elInput.value === elInput.value.toLowerCase())) {
feedbackContent += "❗ Valid proofs must be lowercase. <button class='inline' onclick='window.kx__fixArgon2Input();'>Fix now</button><br>";
}
elFeedback.innerHTML = feedbackContent;
}
}); });
elInput.dispatchEvent(new Event("input")); elInput.dispatchEvent(new Event("input"));
@ -379,16 +393,36 @@ const runArgon2VerificationUtility = () => {
elInput.dispatchEvent(new Event("input")); elInput.dispatchEvent(new Event("input"));
} }
window.kx__fixArgon2Input = () => {
const elInput = document.querySelector('#form-util-argon2-generate .input');
elInput.value = `openpgp4fpr:${elInput.value.toLowerCase()}`;
elInput.dispatchEvent(new Event("input"));
}
const runBcryptGenerationUtility = () => { const runBcryptGenerationUtility = () => {
elUtilBcryptGeneration.onsubmit = function (evt) { elUtilBcryptGeneration.onsubmit = function (evt) {
evt.preventDefault(); evt.preventDefault();
} }
const elInput = elUtilBcryptGeneration.querySelector(".input"), const elInput = elUtilBcryptGeneration.querySelector(".input"),
elOutput = elUtilBcryptGeneration.querySelector(".output"); elOutput = elUtilBcryptGeneration.querySelector(".output"),
elFeedback = elUtilBcryptGeneration.querySelector(".feedback");
elInput.addEventListener("input", async function(evt) { elInput.addEventListener("input", async function(evt) {
elOutput.innerText = await utils.generateBcryptHash(elInput.value); elOutput.innerText = await utils.generateBcryptHash(elInput.value);
if (elInput.value == "") {
elFeedback.innerHTML = "";
} else {
let feedbackContent = "";
if (!(/openpgp4fpr:[0-9a-zA-Z]+/.test(elInput.value))) {
feedbackContent += "❗ Valid proofs must begin with <strong>openpgp4fpr:</strong>. <button class='inline' onclick='window.kx__fixBcryptInput();'>Fix now</button><br>";
}
if (!(elInput.value === elInput.value.toLowerCase())) {
feedbackContent += "❗ Valid proofs must be lowercase. <button class='inline' onclick='window.kx__fixBcryptInput();'>Fix now</button><br>";
}
elFeedback.innerHTML = feedbackContent;
}
}); });
elInput.dispatchEvent(new Event("input")); elInput.dispatchEvent(new Event("input"));
@ -417,4 +451,10 @@ const runBcryptVerificationUtility = () => {
elHash.addEventListener("input", onInput); elHash.addEventListener("input", onInput);
elInput.dispatchEvent(new Event("input")); elInput.dispatchEvent(new Event("input"));
} }
window.kx__fixBcryptInput = () => {
const elInput = document.querySelector('#form-util-bcrypt-generate .input');
elInput.value = `openpgp4fpr:${elInput.value.toLowerCase()}`;
elInput.dispatchEvent(new Event("input"));
}

1
views/util/argon2.pug
View file

@ -17,6 +17,7 @@ block content
h3 Hash h3 Hash
pre pre
code.output.full-width.select-all Waiting for input… code.output.full-width.select-all Waiting for input…
p.feedback
h2 Verify Argon2 hash h2 Verify Argon2 hash
form#form-util-argon2-verify(method='post') form#form-util-argon2-verify(method='post')

1
views/util/bcrypt.pug
View file

@ -17,6 +17,7 @@ block content
h3 Hash h3 Hash
pre pre
code.output.full-width.select-all Waiting for input… code.output.full-width.select-all Waiting for input…
p.feedback
h2 Verify bcrypt hash h2 Verify bcrypt hash
form#form-util-bcrypt-verify(method='post') form#form-util-bcrypt-verify(method='post')