Files
Vanillae/jrx/pages/popup.html
T
pharpend 422fccfa88 [broken] jr: add spend feature
It does not work right now, and the blocker right now is that the public node
has debug endpoints turned off. No idea if it would work if said endpoints were
turned on.
2024-03-20 02:41:34 -06:00

189 lines
4.8 KiB
HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style type="text/css">
@import "gaju-colors.css";
body {
background: var(--b1);
color: --var(g8);
width: 400px;
font-family: monospace, sans-serif;
font-size: 0.7em;
}
#jr-hdr {
border: 2px solid var(--g4);
border-radius: 5px;
width: 100%;
background: var(--g2);
}
.psection {
background: var(--b2);
border: 1px solid var(--g4);
border-radius: 5px;
width: 97%;
padding: 5px;
margin-top: 5px;
}
.account-active {
background: var(--g1);
color: var(--g7);
}
.account-inactive {
background: var(--b4);
color: var(--b7);
}
.balance-found {
color: var(--g5);
}
.balance-not-found {
color: var(--b7);
}
a {
color: var(--g5);
}
</style>
</head>
<body>
<table id="jr-hdr">
<tr>
<td><img src="../art/jrx-icon-48.png" style="width: 32px; height: 32px;"></td>
<td style="font-size: 32px; text-align: center; font-weight: bold">
GAJUMARU WALLET
</td>
</tr>
</table>
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
ACCOUNTS
</td>
</tr>
</table>
<!-- hidden if there are keypairs -->
<!-- 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>
</div>
<!-- generate new keypair -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
GENERATE NEW KEYPAIR
</td>
</tr>
</table>
<form>
<label for="generate-name">Name:</label>
<input id="generate-name" value="default1"></input>
<br>
<button id="generate-btn">Generate New Keypair</button>
</form>
</div>
<!-- faert recovery -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
RECOVER KEYPAIR FROM GajuPhrase
</td>
</tr>
</table>
<!-- recover from faert phrase -->
<form>
<label for="faert-name">Name:</label>
<input id="faert-name"></input>
<br>
<label for="faert-input">GajuPhrase:</label>
<input id="faert-input"></input>
<br>
<button id="faert-btn">Recover Keypair from GajuPhrase</button>
</form>
</div>
<!-- network id -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
NETWORK ID
</td>
</tr>
</table>
<form id='netids'></form>
</div>
<!-- spend -->
<div class="psection">
<table >
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
SEND SOMEONE MONEY
</td>
</tr>
</table>
<form id="spend-params">
<label for="spend-recipient">Recipient Address:</label>
<input id="spend-recipient"></input>
<br>
<label for="spend-amount">Amount (gattos):</label>
<input id="spend-amount"></input>
<br>
<button type="button" id="spend-btn">Send</button>
</form>
<p id='spend-result'></p>
</div>
<pre id="scratch"></pre>
<!--
<div style="margin-top: 5px; width: 95%; background: #d9ffd6; border: 1px solid #6c5d96; border-radius: 5px;">
<table>
<tr>
<td><img src="../art/keypair.svg" style="width: 32px; height: 32px;"></td>
<td style="justify-content: center; font-size: 28px; text-align: center; font-weight: bold">
KEYPAIRS
</td>
</tr>
</table>
</div>
-->
<script type="module" src="../dist/popup.js"></script>
</body>
</html>