mirror of
https://codeberg.org/keyoxide/keyoxide-web.git
synced 2024-12-23 07:19:28 -07:00
Add search, improve all forms
This commit is contained in:
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
|
// Verify all claims
|
||||||
const claims = document.querySelectorAll('kx-claim');
|
const claims = document.querySelectorAll('kx-claim');
|
||||||
claims.forEach(function(claim) {
|
claims.forEach(function(claim) {
|
||||||
|
if (claim.hasAttribute('data-skip') && claim.getAttribute('data-skip')) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
claim.verify();
|
claim.verify();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
@ -46,64 +49,90 @@ document.querySelectorAll('dialog').forEach(function(d) {
|
||||||
|
|
||||||
// Register form listeners
|
// Register form listeners
|
||||||
const elFormEncrypt = document.body.querySelector("#dialog--encryptMessage form");
|
const elFormEncrypt = document.body.querySelector("#dialog--encryptMessage form");
|
||||||
elFormEncrypt.onsubmit = async function (evt) {
|
if (elFormEncrypt) {
|
||||||
evt.preventDefault();
|
elFormEncrypt.onsubmit = async function (evt) {
|
||||||
|
evt.preventDefault();
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// Fetch a key if needed
|
// Fetch a key if needed
|
||||||
await fetchProfileKey();
|
await fetchProfileKey();
|
||||||
|
|
||||||
// Encrypt the message
|
// Encrypt the message
|
||||||
encrypted = await openpgp.encrypt({
|
encrypted = await openpgp.encrypt({
|
||||||
message: openpgp.message.fromText(elFormEncrypt.querySelector('.input').value),
|
message: openpgp.message.fromText(elFormEncrypt.querySelector('.input').value),
|
||||||
publicKeys: window.kx.key.object
|
publicKeys: window.kx.key.object
|
||||||
});
|
});
|
||||||
elFormEncrypt.querySelector('.output').value = encrypted.data;
|
elFormEncrypt.querySelector('.output').value = encrypted.data;
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
console.error(e);
|
console.error(e);
|
||||||
elFormEncrypt.querySelector('.output').value = `Could not encrypt message!\n==========================\n${e.message ? e.message : e}`;
|
elFormEncrypt.querySelector('.output').value = `Could not encrypt message!\n==========================\n${e.message ? e.message : e}`;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
};
|
}
|
||||||
|
|
||||||
const elFormVerify = document.body.querySelector("#dialog--verifySignature form");
|
const elFormVerify = document.body.querySelector("#dialog--verifySignature form");
|
||||||
elFormVerify.onsubmit = async function (evt) {
|
if (elFormVerify) {
|
||||||
evt.preventDefault();
|
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 {
|
try {
|
||||||
signature = await openpgp.message.readArmored(elFormVerify.querySelector('.input').value);
|
// Fetch a key if needed
|
||||||
} catch(e) {
|
await fetchProfileKey();
|
||||||
readError = e;
|
|
||||||
}
|
|
||||||
try {
|
|
||||||
signature = await openpgp.cleartext.readArmored(elFormVerify.querySelector('.input').value);
|
|
||||||
} catch(e) {
|
|
||||||
readError = e;
|
|
||||||
}
|
|
||||||
if (signature == null) { throw(readError) };
|
|
||||||
|
|
||||||
// Verify the signature
|
// Try two different methods of signature reading
|
||||||
verified = await openpgp.verify({
|
let signature = null, verified = null, readError = null;
|
||||||
message: signature,
|
try {
|
||||||
publicKeys: window.kx.key.object
|
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) {
|
// Verify the signature
|
||||||
elFormVerify.querySelector('.output').value = `The message was signed by the profile's key.`;
|
verified = await openpgp.verify({
|
||||||
} else {
|
message: signature,
|
||||||
elFormVerify.querySelector('.output').value = `The message was NOT signed by the profile's key.`;
|
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() {
|
const fetchProfileKey = async function() {
|
||||||
if (window.kx.key.object && window.kx.key.object instanceof openpgp.key.Key) {
|
if (window.kx.key.object && window.kx.key.object instanceof openpgp.key.Key) {
|
||||||
return;
|
return;
|
||||||
|
|
|
@ -1,14 +1,28 @@
|
||||||
extends templates/base.pug
|
extends templates/base.pug
|
||||||
|
|
||||||
block js
|
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/openpgp.min.js' charset='utf-8')
|
||||||
script(type='application/javascript' src='/static/doip.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/kx-claim.js' charset='utf-8')
|
||||||
|
script(type='application/javascript' src='/static/scripts.js' charset='utf-8')
|
||||||
|
|
||||||
block content
|
block content
|
||||||
.demo.narrow
|
.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
|
if highlights.length > 0
|
||||||
h2 Highlights
|
h2 Highlights
|
||||||
|
@ -22,7 +36,7 @@ block content
|
||||||
span.details= hl.description
|
span.details= hl.description
|
||||||
.spacer
|
.spacer
|
||||||
p
|
p
|
||||||
a(href=`/${hl.fingerprint}`) View profile
|
a(href=`/${hl.fingerprint}`).button.full-width View profile
|
||||||
- var n = 0
|
- var n = 0
|
||||||
while n < 3-highlights.length
|
while n < 3-highlights.length
|
||||||
.card.card--small-profile-dummy
|
.card.card--small-profile-dummy
|
||||||
|
|
|
@ -37,7 +37,7 @@ block content
|
||||||
div
|
div
|
||||||
form(method='post')
|
form(method='post')
|
||||||
textarea.input(name='message' placeholder='Message')
|
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)
|
textarea.output(name='message' placeholder='Waiting for input' readonly)
|
||||||
form(method="dialog")
|
form(method="dialog")
|
||||||
input(type="submit" value="Close")
|
input(type="submit" value="Close")
|
||||||
|
@ -46,7 +46,7 @@ block content
|
||||||
div
|
div
|
||||||
form(method='post')
|
form(method='post')
|
||||||
textarea.input(name='signature' placeholder='Signature')
|
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)
|
textarea.output(name='message' placeholder='Waiting for input' readonly)
|
||||||
form(method="dialog")
|
form(method="dialog")
|
||||||
input(type="submit" value="Close")
|
input(type="submit" value="Close")
|
||||||
|
@ -58,7 +58,8 @@ block content
|
||||||
a#qr--altLink
|
a#qr--altLink
|
||||||
|
|
||||||
if (isSignature)
|
if (isSignature)
|
||||||
#profileSigInput.card.card--form
|
#profileSigInput.form-wrapper.card
|
||||||
|
h2 Signature profile
|
||||||
form#formGenerateSignatureProfile(method='post')
|
form#formGenerateSignatureProfile(method='post')
|
||||||
label(for="signature") Please enter the raw profile signature below and press "Generate profile".
|
label(for="signature") Please enter the raw profile signature below and press "Generate profile".
|
||||||
textarea#signature(name='signature')= signature
|
textarea#signature(name='signature')= signature
|
||||||
|
@ -72,16 +73,16 @@ block content
|
||||||
li= error
|
li= error
|
||||||
else
|
else
|
||||||
unless (isSignature && !signature)
|
unless (isSignature && !signature)
|
||||||
#profileHeader.card.card--profileHeader
|
#profileHeader.card.card--transparent.card--profileHeader
|
||||||
a.avatar(href="#")
|
a.avatar(href="#")
|
||||||
img#profileAvatar(src=data.extra.avatarURL alt="avatar")
|
img#profileAvatar(src=data.extra.avatarURL alt="avatar")
|
||||||
|
|
||||||
p#profileName= data.keyData.users[data.keyData.primaryUserIndex].userData.name
|
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--encryptMessage').showModal();") Encrypt message
|
||||||
button(onClick="document.querySelector('#dialog--verifySignature').showModal();") Verify signature
|
button(onClick="document.querySelector('#dialog--verifySignature').showModal();") Verify signature
|
||||||
|
|
||||||
#profileProofs.card
|
#profileProofs.card.card--transparent
|
||||||
h2 Key
|
h2 Key
|
||||||
kx-key(data-keydata=data.keyData)
|
kx-key(data-keydata=data.keyData)
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue