mirror of
https://codeberg.org/keyoxide/keyoxide-web.git
synced 2024-12-22 23:09:29 -07:00
Add search, improve all forms
This commit is contained in:
Yarmo Mackenbach
parent
d448cfdeb8
commit
637a0a5f5c
3 changed files with 99 additions and 55 deletions
|
|
@ -30,6 +30,9 @@ more information on this, and how to apply and follow the GNU AGPL, see <https:/
|
|||
// Verify all claims
|
||||
const claims = document.querySelectorAll('kx-claim');
|
||||
claims.forEach(function(claim) {
|
||||
if (claim.hasAttribute('data-skip') && claim.getAttribute('data-skip')) {
|
||||
return;
|
||||
}
|
||||
claim.verify();
|
||||
});
|
||||
|
||||
|
|
@ -46,64 +49,90 @@ document.querySelectorAll('dialog').forEach(function(d) {
|
|||
|
||||
// Register form listeners
|
||||
const elFormEncrypt = document.body.querySelector("#dialog--encryptMessage form");
|
||||
elFormEncrypt.onsubmit = async function (evt) {
|
||||
evt.preventDefault();
|
||||
if (elFormEncrypt) {
|
||||
elFormEncrypt.onsubmit = async function (evt) {
|
||||
evt.preventDefault();
|
||||
|
||||
try {
|
||||
// Fetch a key if needed
|
||||
await fetchProfileKey();
|
||||
try {
|
||||
// Fetch a key if needed
|
||||
await fetchProfileKey();
|
||||
|
||||
// Encrypt the message
|
||||
encrypted = await openpgp.encrypt({
|
||||
message: openpgp.message.fromText(elFormEncrypt.querySelector('.input').value),
|
||||
publicKeys: window.kx.key.object
|
||||
});
|
||||
elFormEncrypt.querySelector('.output').value = encrypted.data;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
elFormEncrypt.querySelector('.output').value = `Could not encrypt message!\n==========================\n${e.message ? e.message : e}`;
|
||||
// Encrypt the message
|
||||
encrypted = await openpgp.encrypt({
|
||||
message: openpgp.message.fromText(elFormEncrypt.querySelector('.input').value),
|
||||
publicKeys: window.kx.key.object
|
||||
});
|
||||
elFormEncrypt.querySelector('.output').value = encrypted.data;
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
elFormEncrypt.querySelector('.output').value = `Could not encrypt message!\n==========================\n${e.message ? e.message : e}`;
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
const elFormVerify = document.body.querySelector("#dialog--verifySignature form");
|
||||
elFormVerify.onsubmit = async function (evt) {
|
||||
evt.preventDefault();
|
||||
if (elFormVerify) {
|
||||
elFormVerify.onsubmit = async function (evt) {
|
||||
evt.preventDefault();
|
||||
|
||||
try {
|
||||
// Fetch a key if needed
|
||||
await fetchProfileKey();
|
||||
|
||||
// Try two different methods of signature reading
|
||||
let signature = null, verified = null, readError = null;
|
||||
try {
|
||||
signature = await openpgp.message.readArmored(elFormVerify.querySelector('.input').value);
|
||||
} catch(e) {
|
||||
readError = e;
|
||||
}
|
||||
try {
|
||||
signature = await openpgp.cleartext.readArmored(elFormVerify.querySelector('.input').value);
|
||||
} catch(e) {
|
||||
readError = e;
|
||||
}
|
||||
if (signature == null) { throw(readError) };
|
||||
// Fetch a key if needed
|
||||
await fetchProfileKey();
|
||||
|
||||
// Verify the signature
|
||||
verified = await openpgp.verify({
|
||||
message: signature,
|
||||
publicKeys: window.kx.key.object
|
||||
});
|
||||
// Try two different methods of signature reading
|
||||
let signature = null, verified = null, readError = null;
|
||||
try {
|
||||
signature = await openpgp.message.readArmored(elFormVerify.querySelector('.input').value);
|
||||
} catch(e) {
|
||||
readError = e;
|
||||
}
|
||||
try {
|
||||
signature = await openpgp.cleartext.readArmored(elFormVerify.querySelector('.input').value);
|
||||
} catch(e) {
|
||||
readError = e;
|
||||
}
|
||||
if (signature == null) { throw(readError) };
|
||||
|
||||
if (verified.signatures[0].valid) {
|
||||
elFormVerify.querySelector('.output').value = `The message was signed by the profile's key.`;
|
||||
} else {
|
||||
elFormVerify.querySelector('.output').value = `The message was NOT signed by the profile's key.`;
|
||||
// Verify the signature
|
||||
verified = await openpgp.verify({
|
||||
message: signature,
|
||||
publicKeys: window.kx.key.object
|
||||
});
|
||||
|
||||
if (verified.signatures[0].valid) {
|
||||
elFormVerify.querySelector('.output').value = `The message was signed by the profile's key.`;
|
||||
} else {
|
||||
elFormVerify.querySelector('.output').value = `The message was NOT signed by the profile's key.`;
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
elFormVerify.querySelector('.output').value = `Could not verify signature!\n===========================\n${e.message ? e.message : e}`;
|
||||
}
|
||||
} catch (e) {
|
||||
console.error(e);
|
||||
elFormVerify.querySelector('.output').value = `Could not verify signature!\n===========================\n${e.message ? e.message : e}`;
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
const elFormSearch = document.body.querySelector("#search");
|
||||
if (elFormSearch) {
|
||||
elFormSearch.onsubmit = function (evt) {
|
||||
evt.preventDefault();
|
||||
}
|
||||
|
||||
const elSearchRadio = elFormSearch.querySelectorAll("input[type='radio']");
|
||||
elSearchRadio.forEach(function (el) {
|
||||
el.oninput = function (evt) {
|
||||
evt.preventDefault();
|
||||
|
||||
if (evt.target.getAttribute('id') === 'protocol-sig') {
|
||||
elFormSearch.querySelector("input[type='search']").setAttribute('disabled', true);
|
||||
} else {
|
||||
elFormSearch.querySelector("input[type='search']").removeAttribute('disabled');
|
||||
}
|
||||
}
|
||||
});
|
||||
elFormSearch.querySelector("input[type='radio']:checked").dispatchEvent(new Event('input'));
|
||||
}
|
||||
|
||||
// Functions
|
||||
const fetchProfileKey = async function() {
|
||||
if (window.kx.key.object && window.kx.key.object instanceof openpgp.key.Key) {
|
||||
return;
|
||||
|
|
|
|||
|
|
@ -1,14 +1,28 @@
|
|||
extends templates/base.pug
|
||||
|
||||
block js
|
||||
//- script(type='application/javascript' src='/static/dialog-polyfill.js' charset='utf-8')
|
||||
script(type='application/javascript' src='/static/openpgp.min.js' charset='utf-8')
|
||||
script(type='application/javascript' src='/static/doip.js' charset='utf-8')
|
||||
script(type='application/javascript' src='/static/kx-claim.js' charset='utf-8')
|
||||
script(type='application/javascript' src='/static/scripts.js' charset='utf-8')
|
||||
|
||||
block content
|
||||
.demo.narrow
|
||||
kx-claim(data-claim= demoData)
|
||||
kx-claim(data-claim= demoData data-skip="true")
|
||||
|
||||
.narrow
|
||||
#search.form-wrapper.card
|
||||
h2 Generate a profile
|
||||
form(action="post")
|
||||
input(type="search" name="query" placeholder="3637202523e7c1309ab79e99ef2dc5827b445f4b, test@doip.rocks")
|
||||
div.radio-wrapper
|
||||
input#protocol-hkp(type="radio" name="protocol" value="hkp" checked="true")
|
||||
label(for="protocol-hkp") HKP
|
||||
input#protocol-wkd(type="radio" name="protocol" value="wkd")
|
||||
label(for="protocol-wkd") WKD
|
||||
input#protocol-sig(type="radio" name="protocol" value="sig")
|
||||
label(for="protocol-sig") Signature
|
||||
input(type="submit" value="Generate profile")
|
||||
|
||||
if highlights.length > 0
|
||||
h2 Highlights
|
||||
|
|
@ -22,7 +36,7 @@ block content
|
|||
span.details= hl.description
|
||||
.spacer
|
||||
p
|
||||
a(href=`/${hl.fingerprint}`) View profile
|
||||
a(href=`/${hl.fingerprint}`).button.full-width View profile
|
||||
- var n = 0
|
||||
while n < 3-highlights.length
|
||||
.card.card--small-profile-dummy
|
||||
|
|
|
|||
|
|
@ -37,7 +37,7 @@ block content
|
|||
div
|
||||
form(method='post')
|
||||
textarea.input(name='message' placeholder='Message')
|
||||
input(type='submit' name='submit' value='ENCRYPT MESSAGE')
|
||||
input.no-margin(type='submit' name='submit' value='ENCRYPT MESSAGE')
|
||||
textarea.output(name='message' placeholder='Waiting for input' readonly)
|
||||
form(method="dialog")
|
||||
input(type="submit" value="Close")
|
||||
|
|
@ -46,7 +46,7 @@ block content
|
|||
div
|
||||
form(method='post')
|
||||
textarea.input(name='signature' placeholder='Signature')
|
||||
input(type='submit' name='submit' value='VERIFY SIGNATURE')
|
||||
input.no-margin(type='submit' name='submit' value='VERIFY SIGNATURE')
|
||||
textarea.output(name='message' placeholder='Waiting for input' readonly)
|
||||
form(method="dialog")
|
||||
input(type="submit" value="Close")
|
||||
|
|
@ -58,7 +58,8 @@ block content
|
|||
a#qr--altLink
|
||||
|
||||
if (isSignature)
|
||||
#profileSigInput.card.card--form
|
||||
#profileSigInput.form-wrapper.card
|
||||
h2 Signature profile
|
||||
form#formGenerateSignatureProfile(method='post')
|
||||
label(for="signature") Please enter the raw profile signature below and press "Generate profile".
|
||||
textarea#signature(name='signature')= signature
|
||||
|
|
@ -72,16 +73,16 @@ block content
|
|||
li= error
|
||||
else
|
||||
unless (isSignature && !signature)
|
||||
#profileHeader.card.card--profileHeader
|
||||
#profileHeader.card.card--transparent.card--profileHeader
|
||||
a.avatar(href="#")
|
||||
img#profileAvatar(src=data.extra.avatarURL alt="avatar")
|
||||
|
||||
p#profileName= data.keyData.users[data.keyData.primaryUserIndex].userData.name
|
||||
.buttons
|
||||
.button-wrapper
|
||||
button(onClick="document.querySelector('#dialog--encryptMessage').showModal();") Encrypt message
|
||||
button(onClick="document.querySelector('#dialog--verifySignature').showModal();") Verify signature
|
||||
|
||||
#profileProofs.card
|
||||
#profileProofs.card.card--transparent
|
||||
h2 Key
|
||||
kx-key(data-keydata=data.keyData)
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue