diff --git a/static-src/styles.css b/static-src/styles.css
index 6bc684e..8b61063 100644
--- a/static-src/styles.css
+++ b/static-src/styles.css
@@ -501,6 +501,11 @@ a.button.button--liberapay {
a.button.button--liberapay:hover {
background-color: #fff463;
}
+button.inline {
+ min-height: auto;
+ margin: 0;
+ padding: 2px 8px;
+}
/* DIALOGS */
dialog {
diff --git a/static-src/ui.js b/static-src/ui.js
index f8652cd..e9c4246 100644
--- a/static-src/ui.js
+++ b/static-src/ui.js
@@ -345,10 +345,24 @@ const runArgon2GenerationUtility = () => {
}
const elInput = elUtilArgon2Generation.querySelector(".input"),
- elOutput = elUtilArgon2Generation.querySelector(".output");
+ elOutput = elUtilArgon2Generation.querySelector(".output"),
+ elFeedback = elUtilArgon2Generation.querySelector(".feedback");
elInput.addEventListener("input", async function(evt) {
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 openpgp4fpr:.
";
+ }
+ if (!(elInput.value === elInput.value.toLowerCase())) {
+ feedbackContent += "❗ Valid proofs must be lowercase.
";
+ }
+ elFeedback.innerHTML = feedbackContent;
+ }
});
elInput.dispatchEvent(new Event("input"));
@@ -379,16 +393,36 @@ const runArgon2VerificationUtility = () => {
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 = () => {
elUtilBcryptGeneration.onsubmit = function (evt) {
evt.preventDefault();
}
const elInput = elUtilBcryptGeneration.querySelector(".input"),
- elOutput = elUtilBcryptGeneration.querySelector(".output");
+ elOutput = elUtilBcryptGeneration.querySelector(".output"),
+ elFeedback = elUtilBcryptGeneration.querySelector(".feedback");
elInput.addEventListener("input", async function(evt) {
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 openpgp4fpr:.
";
+ }
+ if (!(elInput.value === elInput.value.toLowerCase())) {
+ feedbackContent += "❗ Valid proofs must be lowercase.
";
+ }
+ elFeedback.innerHTML = feedbackContent;
+ }
});
elInput.dispatchEvent(new Event("input"));
@@ -417,4 +451,10 @@ const runBcryptVerificationUtility = () => {
elHash.addEventListener("input", onInput);
elInput.dispatchEvent(new Event("input"));
-}
\ No newline at end of file
+}
+
+window.kx__fixBcryptInput = () => {
+ const elInput = document.querySelector('#form-util-bcrypt-generate .input');
+ elInput.value = `openpgp4fpr:${elInput.value.toLowerCase()}`;
+ elInput.dispatchEvent(new Event("input"));
+}
diff --git a/views/util/argon2.pug b/views/util/argon2.pug
index e799ce4..97b9177 100644
--- a/views/util/argon2.pug
+++ b/views/util/argon2.pug
@@ -17,6 +17,7 @@ block content
h3 Hash
pre
code.output.full-width.select-all Waiting for input…
+ p.feedback
h2 Verify Argon2 hash
form#form-util-argon2-verify(method='post')
diff --git a/views/util/bcrypt.pug b/views/util/bcrypt.pug
index 050038a..2895c87 100644
--- a/views/util/bcrypt.pug
+++ b/views/util/bcrypt.pug
@@ -17,6 +17,7 @@ block content
h3 Hash
pre
code.output.full-width.select-all Waiting for input…
+ p.feedback
h2 Verify bcrypt hash
form#form-util-bcrypt-verify(method='post')