jr: popup now shows list of keypairs

generate button does not work, that's the next task

jrx/src/popup.ts

@@ -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);
+        }
+    }
+}