jr: popup now shows list of keypairs

generate button does not work, that's the next task
This commit is contained in:
2024-03-18 21:44:38 -06:00
parent 0e84ddcc3b
commit a1d0112337
3 changed files with 114 additions and 55 deletions
+6 -3
View File
@@ -33,8 +33,11 @@
</table>
<!-- hidden if there are keypairs -->
<p id="no-keypairs">You have no keypairs yet. Either generate a new one or
recover one you already have.</p>
<!-- hidden by default -->
<p id="no-keypairs" hidden>
No keypairs yet. Either generate one or recover one below using a
GajuPhrase.
</p>
<!-- keypairs added dynamically from page script -->
<ul id="keypairs"></ul>
@@ -86,6 +89,6 @@
-->
<script type="module" src="./dist/popup.js"></script>
<script type="module" src="../dist/popup.js"></script>
</body>
</html>
+39
View File
@@ -60,11 +60,13 @@ import * as vdk_binary from './jex_include/local-vdk_binary-0.1.0/dist/vdk_bina
export type {
// global types
// popup script call/return data
p_data
};
export {
// popup script api
p_get_data,
// background script api
b_main
};
@@ -92,6 +94,12 @@ let TX_SIGN_TIMEOUT = 30*GB_MIN;
//=============================================================================
//=============================================================================
/**
* data that is displayed in the popup window
*/
type p_data =
{pubkey_ak_strs : Array<string>};
//=============================================================================
//=============================================================================
@@ -99,6 +107,37 @@ let TX_SIGN_TIMEOUT = 30*GB_MIN;
//=============================================================================
//=============================================================================
/**
* Called by the popup script to get the data it's supposed to show
*/
async function
p_get_data
()
: Promise<p_data>
{
console.log('popup p_data');
// type bi_state
// = {keypairs: Array<bi_nacl_keypair>};
// type bi_nacl_keypair
// = {secretKey : Uint8Array,
// publicKey : Uint8Array};
let jr_state : bi_state = await bi_get_state();
// accumulator
let akstrs : Array<string> = [];
for (let this_keypair of jr_state.keypairs) {
let this_pubkey : Uint8Array = this_keypair.publicKey;
let this_ak_str : string = await vdk_aeser.pubkey2ak_str(this_pubkey);
akstrs.push(this_ak_str);
}
// type p_data =
// {pubkey_ak_strs : Array<string>};
return {pubkey_ak_strs: akstrs};
}
//=============================================================================
//=============================================================================
+69 -52
View File
@@ -2,6 +2,8 @@
* This is the script for the popup window
*/
import * as b_lib from './b_lib.js';
p_main();
/**
@@ -28,62 +30,77 @@ p_main
{
//let scratch = document.getElementById('scratch')!;
//scratch.innerText += 'line 17 hello\n';
console.log('popup main');
await pi_repop();
//function onSuccessCase(response_from_bg: any) {
// console.log('jr popup response from background script success', response_from_bg);
//}
//function onErrorCase(error_from_bg: any) {
// console.log('jr popup response from background script error', error_from_bg);
//}
//browser.runtime
// .sendMessage({frum: 'popup',
// data: 'init'})
// .then(onSuccessCase,
// onErrorCase);
//// add hooks for each button
//document.getElementById('generate-btn')!.addEventListener('click', onclick_generate);
//document.getElementById('faert-btn')!.addEventListener('click', onclick_faert);
////document.getElementById('seed-btn')!.addEventListener('click', onclick_seed);
// add hooks for each button
let onclick_generate =
async function () {
console.log('popup p_main onclick_generate');
// await b_lib.p_generate_keypair();
pi_repop();
};
document
.getElementById('generate-btn')!
.addEventListener('click', onclick_generate);
}
/**
* query background library for popup display data and populate fields with it
*/
async function
pi_repop
()
: Promise<void>
{
console.log('popup pi_repop');
let popup_data: b_lib.p_data = await b_lib.p_get_data();
///**
// * Runs when the user clicks the "generate" button
// */
//async function
//onclick_generate
// ()
// : Promise<void>
//{
// console.log('onclick_generate');
//}
//
//
//
///**
// * Runs when the user clicks the "recover from faert phrase" button
// */
//async function
//onclick_faert
// ()
// : Promise<void>
//{
// console.log('onclick_faert');
//}
//
//
//
/////**
//// * Runs when the user clicks the "recover from seed phrase" button
//// */
////async function
////onclick_seed
//// ()
////{
//// console.log('onclick_seed');
////}
// type p_data =
// {pubkey_ak_strs : Array<string>};
// show keypairs
// step 1: delete the existing list of keypairs
let kill_all_children =
function (elt : HTMLElement) {
// from: https://www.geeksforgeeks.org/remove-all-the-child-elements-of-a-dom-node-in-javascript/
// kill the last child repeatedly
let child = elt.lastElementChild;
while (child) {
elt.removeChild(child);
child = elt.lastElementChild;
}
};
// get the ul
let pubkeys_ul = document.getElementById('keypairs')!;
// delete the existing list of keypairs
// we will repopulate it in a minute
// this isn't necessary right now but in the future we will add a delete
// keypair function so this is prophylaxis
kill_all_children(pubkeys_ul);
// keypairs
let akstrs : Array<string> = popup_data.pubkey_ak_strs;
let akstrs_empty : boolean = (0 === akstrs.length);
// if the keypairs are empty unhide the "no keypairs" paragraph
if (akstrs_empty)
document.getElementById('no-keypairs')!.hidden = false;
// if the keypairs are not empty
else {
// hide the "no keypairs" paragraph
document.getElementById('no-keypairs')!.hidden = true;
// for each keypair
// each one of these is an ak_... string
for (let this_akstr of akstrs) {
// make an li
let this_li = document.createElement('li');
// make inner text the key
this_li.innerHTML = this_akstr;
// add it to the list
pubkeys_ul.appendChild(this_li);
}
}
}