gasgasgas/js/index.html

163 lines
4.7 KiB
HTML

<html>
<head>
<title>gas3</title>
<script defer src="node_modules/alpinejs/dist/cdn.min.js"></script>
<script src="node_modules/openpgp/dist/openpgp.min.js"></script>
<script src="node_modules/MimeJS/src/base64.js"></script>
<script src="node_modules/MimeJS/dist/mime-js.min.js"></script>
<script src="node_modules/jssha/dist/sha256.js"></script>
<script src="run.js"></script>
<script src="booteth/wallet.js"></script>
<script src="booteth/session.js"></script>
<script src="booteth/eip1193.js"></script>
<script src="registry.js"></script>
<script src="wala.js"></script>
<script src="promise.js"></script>
<script src="rpc.js"></script>
<script type="module">
import { ethers } from "./node_modules/ethers/dist/ethers.min.js";
register_ethers(ethers);
</script>
<script src="main.js"></script>
<script>
wallet_fallback = sessionwallet_create;
wallet_detect(ethers);
</script>
<link rel="stylesheet" type="text/css" href="style.css"></link>
</head>
<body x-data='{
needKey: false,
error: "",
lock: true,
menuSelected: "main",
}
' >
<ul id="menu"
x-data='{
keyTitle: "unlock key",
}'>
<li><a href="javascript:void(null);" id="menuKey" x-text='keyTitle' @click='menuSelected="main"' ></a>
<li><a href="javascript:void(null);" id="menuStatus" @click='menuSelected="state"'>status</a>
<li><a href="javascript:void(null);" id="menuPromise" @click='menuSelected="promise"'>promises</a>
<div id="main"
x-show='needKey && menuSelected == "main"'
@messagestatechange.window='
if (checkState(STATE.LOCAL_KEY_PROBE, $event.detail.state)) {
needKey = true;
}
if (checkState(STATE.LOCAL_KEY_REQUEST | STATE.LOCAL_KEY_UNLOCK, $event.detail.state)) {
error = undefined;
}
if (checkState(STATE.LOCAL_KEY_REJECT, $event.detail.state)) {
error = $event.detail.s;
}
if (checkState(STATE.LOCAL_KEY_UNLOCK, $event.detail.state)) {
needKey = false;
lock = false;
}
'
>
<form onSubmit='return false;'>
<input type="password" name="passphrase" id="passphrase" /><br/>
<button id="passphraseUnlock"
x-data='{
keyTitle: "enter new pin",
}
'
x-text='keyTitle'
@messagestatechange.window='
if (checkState(STATE.LOCAL_KEY, $event.detail.state)) {
keyTitle = "unlock key with pin";
}
'
x-on:click='stateChange("unlock key request", STATE.LOCAL_KEY_REQUEST);'
></button>
<form>
<br/><span id="keyError" class="error"
x-text='error'
></span>
</div>
<div id="state"
x-show='menuSelected == "state"'
x-data='{
stateKey: "locked",
stateEvm: "disconnected",
stateBalance: "0",
stateAddress: "unknown",
stateContractRegistry: "unknown",
stateContractAccountsIndex: "unknown",
stateContractFaucet: "unknown",
}
'
@messagestatechange.window='
dirty = false;
if (checkState(STATE.LOCAL_KEY_UNLOCK, $event.detail.state)) {
stateKey = "unlocked";
dirty = true;
}
if (checkState(STATE.RPC_CONNECT, $event.detail.state)) {
stateEvm = $event.detail.s["network"];
dirty = true;
}
if (checkState(STATE.RPC_PING, $event.detail.state)) {
stateBalance = $event.detail.s["balance"];
stateAddress = $event.detail.s["address"];
stateChange("reset ping", 0, STATE.RPC_PING);
dirty = true;
}
if (checkState(STATE.EVM_REGISTRY, $event.detail.state)) {
stateContractRegistry = $event.detail.s.registry;
stateContractAccountsIndex = $event.detail.s.accounts;
stateContractFaucet = $event.detail.s.faucet;
stateChange("reset ping", 0, STATE.EVM_REGISTRY);
}
if (checkState(STATE.RPC_CHANGE, $event.detail.state)) {
stateEvm = $event.detail.s["chainId"];
}
if (dirty) {
stateChange("reset ping", 0, STATE.RPC_PING | STATE.RPC_CONNECT | STATE.RPC_CHANGE | STATE.EVM_REGISTRY | STATE.LOCAL_KEY_UNLOCK);
}
'
>
<dl>
<dt>Key</dt>
<dd x-text='stateKey'>
<dt>Address</dt>
<dd x-text='stateAddress'>
<dt>Balance</dt>
<dd x-text='stateBalance'>
<dt>Chain id</dt>
<dd x-text='stateEvm'>
<dt>Registry contract</dt>
<dd x-text='stateContractRegistry'>
<dt>Accounts index contract</dt>
<dd x-text='stateContractAccountsIndex'>
<dt>Faucet contract</dt>
<dd x-text='stateContractFaucet'>
</dl>
</div>
<div id="promise"
x-show='menuSelected == "promise"'
>
<ul id="promiseList"></ul>
<h2>Add promise</h2>
<form onSubmit='return false;' id="promiseForm">
<input type="text" name="label" id="promiseLabel" /><br/>
<textarea name="description" id="promiseDescription" ></textarea><br/>
<button id="promiseSubmit"
x-data='{
promiseTitle: "create",
}'
x-text='promiseTitle'
x-on:click='stateChange("new promise", STATE.PROMISE_NEW);'
></button>
</form>
</div>
</body>
</html>