2024-01-03 19:21:15 -05:00
import * as tfrpc from '/tfrpc.js' ;
tfrpc . register ( async function get _private _key ( id ) {
return bip39Words ( await ssb . getPrivateKey ( id ) ) ;
} ) ;
2024-01-06 14:22:49 -05:00
tfrpc . register ( async function create _id ( id ) {
return await ssb . createIdentity ( ) ;
} ) ;
2024-01-03 20:17:30 -05:00
tfrpc . register ( async function add _id ( id ) {
return await ssb . addIdentity ( bip39Bytes ( id ) ) ;
} ) ;
2024-01-06 14:22:49 -05:00
tfrpc . register ( async function delete _id ( id ) {
return await ssb . deleteIdentity ( id ) ;
} ) ;
tfrpc . register ( async function reload ( ) {
await main ( ) ;
} ) ;
2024-01-03 19:21:15 -05:00
async function main ( ) {
let ids = await ssb . getIdentities ( ) ;
2024-02-24 11:09:34 -05:00
await app . setDocument (
2024-04-28 11:57:35 -04:00
`
< head >
< link rel = "stylesheet" href = "w3.css" > < / l i n k >
< style >
/* "2018 Sargasso Sea" */
. w3 - theme - l5 { color : # 000 ! important ; background - color : # f3f4f7 ! important }
. w3 - theme - l4 { color : # 000 ! important ; background - color : # d7dbe3 ! important }
. w3 - theme - l3 { color : # 000 ! important ; background - color : # b0b6c8 ! important }
. w3 - theme - l2 { color : # fff ! important ; background - color : # 8892 ac ! important }
. w3 - theme - l1 { color : # fff ! important ; background - color : # 636 f8e ! important }
. w3 - theme - d1 { color : # fff ! important ; background - color : # 40485 c ! important }
. w3 - theme - d2 { color : # fff ! important ; background - color : # 394052 ! important }
. w3 - theme - d3 { color : # fff ! important ; background - color : # 323848 ! important }
. w3 - theme - d4 { color : # fff ! important ; background - color : # 2 b303d ! important }
. w3 - theme - d5 { color : # fff ! important ; background - color : # 242833 ! important }
. w3 - theme - light { color : # 000 ! important ; background - color : # f3f4f7 ! important }
. w3 - theme - dark { color : # fff ! important ; background - color : # 242833 ! important }
. w3 - theme - action { color : # fff ! important ; background - color : # 242833 ! important }
. w3 - theme { color : # fff ! important ; background - color : # 485167 ! important }
. w3 - text - theme { color : # 485167 ! important }
. w3 - border - theme { border - color : # 485167 ! important }
. w3 - hover - theme : hover { color : # fff ! important ; background - color : # 485167 ! important }
. w3 - hover - text - theme : hover { color : # 485167 ! important }
. w3 - hover - border - theme : hover { border - color : # 485167 ! important }
< / s t y l e >
< / h e a d >
2024-04-29 12:24:35 -04:00
< body class = "w3-theme-l3" >
2024-01-06 14:22:49 -05:00
< script > const handler = { } ; < / s c r i p t >
2024-01-03 19:21:15 -05:00
< script type = "module" >
import * as tfrpc from '/static/tfrpc.js' ;
2024-01-06 14:22:49 -05:00
handler . export _id = async function export _id ( event ) {
let id = event . srcElement . dataset . id ;
2024-01-06 13:40:57 -05:00
let element = document . createElement ( 'textarea' ) ;
element . value = await tfrpc . rpc . get _private _key ( id ) ;
2024-04-28 11:57:35 -04:00
element . style = 'width: 100%; height: auto; read-only: true; resize: none' ;
element . classList . add ( 'w3-input' ) ;
2024-01-06 13:40:57 -05:00
element . readOnly = true ;
2024-01-06 14:22:49 -05:00
event . srcElement . parentElement . appendChild ( element ) ;
event . srcElement . onclick = event => handler . hide _id ( event , element ) ;
2024-01-03 19:21:15 -05:00
}
2024-01-06 14:22:49 -05:00
handler . add _id = async function add _id ( event ) {
2024-01-03 20:17:30 -05:00
let id = document . getElementById ( 'add_id' ) . value ;
2024-01-06 14:22:49 -05:00
try {
let new _id = await tfrpc . rpc . add _id ( id ) ;
alert ( 'Successfully imported: ' + new _id ) ;
await tfrpc . rpc . reload ( ) ;
} catch ( e ) {
alert ( 'Error importing identity: ' + e ) ;
}
2024-01-03 20:17:30 -05:00
}
2024-01-06 14:22:49 -05:00
handler . create _id = async function create _id ( event ) {
try {
let id = await tfrpc . rpc . create _id ( ) ;
alert ( 'Successfully created: ' + id ) ;
await tfrpc . rpc . reload ( ) ;
} catch ( e ) {
alert ( 'Error creating identity: ' + e ) ;
}
}
handler . hide _id = function hide _id ( event , element ) {
2024-01-06 13:40:57 -05:00
element . parentNode . removeChild ( element ) ;
2024-01-06 14:22:49 -05:00
event . srcElement . onclick = handler . export _id ;
2024-01-06 13:40:57 -05:00
}
2024-01-06 14:22:49 -05:00
handler . delete _id = async function delete _id ( event ) {
let id = event . srcElement . dataset . id ;
try {
if ( prompt ( 'Are you sure you want to delete "' + id + '"? It cannot be recovered without the exported phrase.\\n\\nEnter the word "DELETE" to confirm you wish to delete it.' ) === 'DELETE' ) {
if ( await tfrpc . rpc . delete _id ( id ) ) {
alert ( 'Successfully deleted ID: ' + id ) ;
}
await tfrpc . rpc . reload ( ) ;
2024-01-03 20:17:30 -05:00
}
2024-01-06 14:22:49 -05:00
} catch ( e ) {
alert ( 'Error deleting ID: ' + e ) ;
2024-01-03 19:21:15 -05:00
}
2024-01-06 14:22:49 -05:00
}
2024-01-03 20:17:30 -05:00
< / s c r i p t >
2024-04-29 12:24:35 -04:00
< header class = "w3-theme w3-padding" > < h1 > SSB Identity Management < / h 1 > < / h e a d e r >
2024-04-28 11:57:35 -04:00
< div class = "w3-card-4 w3-margin" >
< header class = "w3-container w3-theme-l2" > < h2 > Create a new identity < / h 2 > < / h e a d e r >
< footer class = "w3-padding" >
< button id = "create_id" onclick = "handler.create_id()" class = "w3-button w3-theme" > Create Identity < / b u t t o n >
< / f o o t e r >
< / d i v >
< div class = "w3-card-4 w3-margin" >
< header class = "w3-container w3-theme-l2" > < h2 > Import an SSB Identity from 12 BIP39 English Words < / h 2 > < / h e a d e r >
< textarea id = "add_id" style = "width: 100%" rows = "4" class = "w3-input" > < / t e x t a r e a >
< footer class = "w3-padding" >
< button id = "add" onclick = "handler.add_id(event)" class = "w3-button w3-theme" > Import Identity < / b u t t o n >
< / f o o t e r >
< / d i v >
< div class = "w3-card-4 w3-margin" >
< header class = "w3-container w3-theme-l2" > < h2 > Identities < / h 2 > < / h e a d e r >
< ul class = "w3-ul" > ` +
ids
. map (
2024-04-29 12:24:35 -04:00
( id ) => ` <li style="overflow: hidden; text-wrap: nowrap; text-overflow: ellipsis">
2024-04-28 11:57:35 -04:00
< button onclick = "handler.export_id(event)" data - id = "${id}" class = "w3-button w3-theme" > Export Identity < / b u t t o n >
< button onclick = "handler.delete_id(event)" data - id = "${id}" class = "w3-button w3-theme" > Delete Identity < / b u t t o n >
$ { id }
< / l i > `
)
. join ( '\n' ) +
` </ul>
< / d i v >
2024-02-24 11:09:34 -05:00
< / b o d y > `
) ;
2024-01-03 19:21:15 -05:00
}
2024-01-06 14:52:14 -05:00
main ( ) ;
