Add script to locally serve application
This commit is contained in:
lash
parent
f345404416
commit
e3d2d58950
GPG Key ID:
21D2E7BB88C2A746
33
js/build.sh
Normal file
33
js/build.sh
Normal file
@ -0,0 +1,33 @@
|
||||
#!/bin/bash
|
||||
|
||||
PUP_BIN=/home/lash/src/build/pup/pup
|
||||
cat node_modules/openpgp/dist/openpgp.min.js node_modules/MimeJS/src/base64.js node_modules/MimeJS/dist/mime-js.min.js node_modules/jssha/dist/sha256.js run.js booteth/wallet.js booteth/session.js booteth/eip1193.js registry.js wala.js promise.js rpc.js > tmp.js
|
||||
node node_modules/uglify-js/bin/uglifyjs tmp.js > src.js
|
||||
|
||||
echo -n "<html><head>" > standalone.html
|
||||
cat index.html | $PUP_BIN "head title" >> standalone.html
|
||||
cat index.html | $PUP_BIN "head style" >> standalone.html
|
||||
echo -n "<script defer src='data:text/javascript;base64," >> standalone.html
|
||||
base64 node_modules/alpinejs/dist/cdn.min.js -w0 >> standalone.html
|
||||
echo -n "'></script>" >> standalone.html
|
||||
#echo -n "<script>" >> standalone.html
|
||||
#cat src.js >> standalone.html
|
||||
#echo "</script><script type='module'>" >> standalone.html
|
||||
|
||||
echo -n "<script src='data:text/javascript;base64," >> standalone.html
|
||||
base64 src.js -w0 >> standalone.html
|
||||
echo "'></script><script type='module'>" >> standalone.html
|
||||
echo -n "import { ethers } from 'data:text/javascript;base64," >> standalone.html
|
||||
base64 node_modules/ethers/dist/ethers.min.js -w0 >> standalone.html
|
||||
echo -en "';\nregister_ethers(ethers);\n</script><script type='module' src='data:text/javascript;base64," >> standalone.html
|
||||
node node_modules/uglify-js/bin/uglifyjs main.js | base64 -w0 >> standalone.html
|
||||
echo -n "'></script>" >> standalone.html
|
||||
cat <<eof >> standalone.html
|
||||
<script>
|
||||
wallet_fallback = sessionwallet_create;
|
||||
wallet_detect(ethers);
|
||||
</script>
|
||||
</head>
|
||||
eof
|
||||
cat index.html | $PUP_BIN "body" >> standalone.html
|
||||
echo -n "</html>" >> standalone.html
|
||||
@ -5,13 +5,20 @@
|
||||
<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" src="main.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);
|
||||
@ -31,8 +38,9 @@ wallet_detect(ethers);
|
||||
x-data='{
|
||||
keyTitle: "unlock key",
|
||||
}'>
|
||||
<li><a id="menuKey" href="javascript:void(null);" x-text='keyTitle' @click='menuSelected="main"' ></a>
|
||||
<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='
|
||||
@ -79,21 +87,39 @@ if (checkState(STATE.LOCAL_KEY, $event.detail.state)) {
|
||||
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 = "connected";
|
||||
stateEvm = $event.detail.s["network"];
|
||||
dirty = true;
|
||||
}
|
||||
console.debug("state", $event.detail.s);
|
||||
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);
|
||||
}
|
||||
'
|
||||
>
|
||||
@ -104,7 +130,33 @@ if (checkState(STATE.RPC_PING, $event.detail.state)) {
|
||||
<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>
|
||||
|
||||
73
js/main.js
73
js/main.js
@ -1,8 +1,6 @@
|
||||
import { ethers } from "./node_modules/ethers/dist/ethers.min.js";
|
||||
register_ethers(ethers);
|
||||
|
||||
var connect = connect_manual_session;
|
||||
|
||||
|
||||
async function checkKey() {
|
||||
const r = localStorage.getItem(KEY_STORAGEKEY);
|
||||
if (r) {
|
||||
@ -10,32 +8,46 @@ async function checkKey() {
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// router
|
||||
var initRouter = async (e) => {
|
||||
if (checkState(STATE.LOCAL_KEY_REQUEST, e.detail.state)) {
|
||||
stateChange('process key unlock request', 0, STATE.LOCAL_KEY_REQUEST | STATE.LOCAL_KEY_PROBE | STATE.LOCAL_KEY_REJECT);
|
||||
checkKey();
|
||||
const v = document.getElementById('passphrase').value;
|
||||
checkKey(); const v = document.getElementById('passphrase').value;
|
||||
const r = await connect(v);
|
||||
if (r) {
|
||||
stateChange('key request finished', STATE.LOCAL_KEY_UNLOCK, );
|
||||
}
|
||||
}
|
||||
if (checkState(STATE.RPC_CHANGE, e.detail.state)) {
|
||||
scan_rpc();
|
||||
stateChange('reset rpc change', 0, STATE.RPC_CHANGE);
|
||||
g_poll_rpc = 3000;
|
||||
}
|
||||
if (checkState(STATE.RPC_GONE, e.detail.state)) {
|
||||
//stateChange('reset rpc change', 0, STATE.RPC_CHANGE);
|
||||
g_poll_rpc = 1000;
|
||||
}
|
||||
if (checkState(STATE.PROMISE_NEW, e.detail.state)) {
|
||||
stateChange('reset rpc change', 0, STATE.PROMISE_NEW);
|
||||
const o = {
|
||||
label: document.getElementById('promiseLabel').value,
|
||||
description: document.getElementById('promiseDescription').value,
|
||||
};
|
||||
handlePromise(o);
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
async function scan_rpc(pw) {
|
||||
const contracts = await scanRegistry(g_registry);
|
||||
stateChange(contracts, STATE.EVM_REGISTRY);
|
||||
}
|
||||
|
||||
|
||||
async function connect_manual_session(pw) {
|
||||
let provider = undefined;
|
||||
let wallet = undefined;
|
||||
try {
|
||||
provider = await provider_connect('default');
|
||||
} catch(e) {
|
||||
console.error(e);
|
||||
}
|
||||
if (!provider) {
|
||||
stateChange('no provider', STATE.RPC_GONE, STATE.LOCAL_KEY_REQUEST);
|
||||
return;
|
||||
}
|
||||
|
||||
try {
|
||||
wallet = await wallet_connect('default', SESSION_ID, pw);
|
||||
} catch(e) {
|
||||
@ -45,16 +57,36 @@ async function connect_manual_session(pw) {
|
||||
stateChange('wallet unlock fail', STATE.LOCAL_KEY_REJECT, STATE.LOCAL_KEY_REQUEST);
|
||||
return;
|
||||
}
|
||||
checkRpc();
|
||||
scanRegistry(g_registry);
|
||||
checkWallet();
|
||||
return wallet;
|
||||
}
|
||||
|
||||
|
||||
async function handlePromise(o) {
|
||||
console.debug('processing promise', o);
|
||||
await putPromise(o);
|
||||
scanPromises();
|
||||
}
|
||||
|
||||
function checkWallet() {
|
||||
pingWallet();
|
||||
setTimeout(checkWallet, g_poll_wallet);
|
||||
}
|
||||
|
||||
|
||||
function checkRpc() {
|
||||
pingRpc();
|
||||
setTimeout(checkRpc, 3000);
|
||||
setTimeout(checkRpc, g_poll_rpc);
|
||||
}
|
||||
|
||||
|
||||
function checkPersist() {
|
||||
g_persist.forEach((v) => {
|
||||
v.put('foo');
|
||||
});
|
||||
}
|
||||
|
||||
|
||||
window.addEventListener('load', () => {
|
||||
window.addEventListener('messagestatechange', initRouter);
|
||||
if (DEBUG) {
|
||||
@ -63,5 +95,8 @@ window.addEventListener('load', () => {
|
||||
});
|
||||
}
|
||||
stateChange('init key', STATE.LOCAL_KEY_PROBE);
|
||||
const w = new Wala('http://localhost:8081');
|
||||
g_persist.push(w);
|
||||
checkPersist();
|
||||
checkRpc();
|
||||
});
|
||||
|
||||
|
||||
@ -9,5 +9,8 @@
|
||||
"jsqr": "^1.4.0",
|
||||
"qrcode": "1.5.3",
|
||||
"ethers": "6.5.1"
|
||||
},
|
||||
"devDependencies": {
|
||||
"uglify-js": "^3.17.4"
|
||||
}
|
||||
}
|
||||
|
||||
32
js/promise.js
Normal file
32
js/promise.js
Normal file
@ -0,0 +1,32 @@
|
||||
async function putPromise(o) {
|
||||
let c = 0;
|
||||
const v = JSON.stringify(o);
|
||||
const h = new jsSHA("SHA-256", "TEXT", { encoding: "UTF8" });
|
||||
h.update(v);
|
||||
const z = h.getHash("HEX");
|
||||
g_persistIndex.push(z);
|
||||
localStorage.setItem('persist', JSON.stringify(g_persistIndex));
|
||||
for (let i = 0; i < g_persist.length; i++) {
|
||||
const o = g_persist[i];
|
||||
const r = await o.put(v);
|
||||
c++;
|
||||
stateChange(r, STATE.PROMISE_PERSIST);
|
||||
}
|
||||
}
|
||||
|
||||
async function scanPromises() {
|
||||
const promises = localStorage.getItem('persist');
|
||||
const o = JSON.parse(promises);
|
||||
const eList = document.createElement('ul');
|
||||
eList.setAttribute('id', 'promiseList');
|
||||
o.forEach(async (v) => {
|
||||
const r = await g_persist[0].get(v); // replace with fadfada
|
||||
const o = JSON.parse(r);
|
||||
console.debug('o', o);
|
||||
const eItem = document.createElement('li');
|
||||
eItem.innerText = o.label;
|
||||
eList.appendChild(eItem);
|
||||
});
|
||||
document.getElementById('promiseList').remove();
|
||||
document.getElementById('promise').prepend(eList);
|
||||
}
|
||||
@ -1,5 +1,23 @@
|
||||
const registryInterface = [{"inputs":[{"internalType":"bytes32[]","name":"_identifiers","type":"bytes32[]"}],"stateMutability":"nonpayable","type":"constructor"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"bytes32","name":"_key","type":"bytes32"},{"indexed":false,"internalType":"address","name":"_address","type":"address"}],"name":"AddressKey","type":"event"},{"anonymous":false,"inputs":[{"indexed":true,"internalType":"address","name":"_previousOwner","type":"address"},{"indexed":true,"internalType":"address","name":"_newOwner","type":"address"}],"name":"OwnershipTransferred","type":"event"},{"inputs":[{"internalType":"bytes32","name":"_identifier","type":"bytes32"}],"name":"addressOf","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"uint256","name":"","type":"uint256"}],"name":"identifier","outputs":[{"internalType":"bytes32","name":"","type":"bytes32"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"identifierCount","outputs":[{"internalType":"uint256","name":"","type":"uint256"}],"stateMutability":"view","type":"function"},{"inputs":[],"name":"owner","outputs":[{"internalType":"address","name":"","type":"address"}],"stateMutability":"view","type":"function"},{"inputs":[{"internalType":"bytes32","name":"_identifier","type":"bytes32"},{"internalType":"address","name":"_address","type":"address"}],"name":"set","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"nonpayable","type":"function"},{"inputs":[{"internalType":"bytes4","name":"_sum","type":"bytes4"}],"name":"supportsInterface","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"pure","type":"function"},{"inputs":[{"internalType":"address","name":"_newOwner","type":"address"}],"name":"transferOwnership","outputs":[{"internalType":"bool","name":"","type":"bool"}],"stateMutability":"nonpayable","type":"function"}];
|
||||
|
||||
|
||||
function fromIdentifier(s) {
|
||||
let r = '';
|
||||
if (s.substr(0, 2) == '0x') {
|
||||
s = s.substr(2);
|
||||
}
|
||||
for (let i = 0; i < 64; i += 2) {
|
||||
const v = s.substring(i, i+2);
|
||||
if (v == '00') {
|
||||
break;
|
||||
}
|
||||
r += String.fromCharCode(parseInt(v, 16));
|
||||
console.log('v', v, r);
|
||||
}
|
||||
return r;
|
||||
}
|
||||
|
||||
|
||||
async function scanRegistry(registry) {
|
||||
const o = new ethers.Contract(registry, registryInterface, current_provider);
|
||||
let i = 0;
|
||||
@ -15,8 +33,9 @@ async function scanRegistry(registry) {
|
||||
break;
|
||||
}
|
||||
const v = await o.addressOf(identifier);
|
||||
r[identifier] = v;
|
||||
console.debug('found ' + identifier + '=' + v + ' in registry ' + registry);
|
||||
const identifierString = fromIdentifier(identifier);
|
||||
r[identifierString] = v;
|
||||
console.debug('found ' + identifierString + ' = ' + v + ' in registry ' + registry);
|
||||
i++;
|
||||
}
|
||||
return r;
|
||||
|
||||
21
js/rpc.js
21
js/rpc.js
@ -1,4 +1,4 @@
|
||||
async function pingRpc() {
|
||||
async function pingWallet() {
|
||||
const address = await current_signer.getAddress();
|
||||
const balance = await current_provider.getBalance(address);
|
||||
let set = STATE.RPC_PING;
|
||||
@ -14,3 +14,22 @@ async function pingRpc() {
|
||||
}
|
||||
stateChange(r, set, rst);
|
||||
}
|
||||
|
||||
async function pingRpc() {
|
||||
let provider = undefined;
|
||||
try {
|
||||
provider = await provider_connect('default');
|
||||
} catch(e) {
|
||||
console.error(e);
|
||||
}
|
||||
if (!provider) {
|
||||
stateChange('no provider', STATE.RPC_GONE, STATE.LOCAL_KEY_REQUEST);
|
||||
return;
|
||||
}
|
||||
const network = await current_provider.getNetwork();
|
||||
console.debug('chainid', network.chainId);
|
||||
if (network.chainId != g_chainId) {
|
||||
g_chainId = network.chainId;
|
||||
stateChange({'chainId': g_chainId}, STATE.RPC_CHANGE | STATE.RPC_CONNECT);
|
||||
}
|
||||
}
|
||||
|
||||
11
js/run.js
11
js/run.js
@ -10,19 +10,28 @@ var STATE = {
|
||||
RPC_GONE: 1 << 8,
|
||||
RPC_PING: 1 << 9,
|
||||
EVM_BALANCE_LOW: 1 << 10,
|
||||
EVM_REGISTRY: 1 << 11,
|
||||
PROMISE_NEW: 1 << 12,
|
||||
PROMISE_PERSIST: 1 << 13,
|
||||
};
|
||||
const STATE_KEYS = Object.keys(STATE);
|
||||
var g_state = 0;
|
||||
var g_chainId = 1337;
|
||||
var g_chainId = 0;
|
||||
var g_balance = 0;
|
||||
var g_minBalance = 10000000;
|
||||
var g_poll_wallet = 3000;
|
||||
var g_poll_rpc = 1000;
|
||||
var g_registry = '0xb708175e3f6cd850643aaf7b32212afad50e2549';
|
||||
var g_persist = []
|
||||
var g_persistIndex = [];
|
||||
|
||||
const DEBUG = true;
|
||||
const SESSION_ID = 'gasgasgas';
|
||||
const KEY_STORAGEKEY = 'sessionKey_' + SESSION_ID;
|
||||
const PERSIST_STORAGEKEY = 'persistKey_' + SESSION_ID; // replace with addressdeclarator
|
||||
|
||||
const qp = new URLSearchParams(window.location.search);
|
||||
console.debug('uuid', qp.get("u"));
|
||||
|
||||
// borrowed from forro
|
||||
async function stateChange(s, set_states, rst_states) {
|
||||
|
||||
35
js/wala.js
Normal file
35
js/wala.js
Normal file
@ -0,0 +1,35 @@
|
||||
function Wala(url) {
|
||||
this._url = url;
|
||||
}
|
||||
|
||||
Wala.prototype.put = async function(v, filename, mimetype) {
|
||||
let headers = {};
|
||||
if (filename !== undefined) {
|
||||
headers['X-Filename'] = filename;
|
||||
}
|
||||
let r = await fetch(this._url, {
|
||||
method: 'put',
|
||||
headers: headers,
|
||||
body: v,
|
||||
});
|
||||
if (!r.ok) {
|
||||
throw ('failed put');
|
||||
}
|
||||
return r.text();
|
||||
}
|
||||
|
||||
Wala.prototype.get = async function(k, binary=false) {
|
||||
const url = this.url(k)
|
||||
let r = await fetch(url);
|
||||
if (!r.ok) {
|
||||
throw ('failed get');
|
||||
}
|
||||
if (binary) {
|
||||
return r.blob();
|
||||
}
|
||||
return r.text();
|
||||
}
|
||||
|
||||
Wala.prototype.url = function(k) {
|
||||
return this._url + '/' + k;
|
||||
}
|
||||
Loading…
Reference in New Issue
Block a user