174 lines
4.7 KiB
HTML
174 lines
4.7 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
|
|
<title>JS-Waku light node example</title>
|
|
<link
|
|
href="https://cdn.jsdelivr.net/npm/water.css@2/out/water.css"
|
|
rel="stylesheet"
|
|
/>
|
|
<link href="style.css" rel="stylesheet" />
|
|
<link rel="apple-touch-icon" href="./favicon.png" />
|
|
<link rel="manifest" href="./manifest.json" />
|
|
<link rel="icon" href="./favicon.ico" />
|
|
</head>
|
|
|
|
<body>
|
|
<div class="row rcenter">
|
|
<h1>Waku RLN</h1>
|
|
<button id="connect-wallet" type="button">Connect Wallet</button>
|
|
</div>
|
|
|
|
<span id="status"></span>
|
|
|
|
<h2 class="mu1">Blockchain</h2>
|
|
<hr />
|
|
|
|
<div class="row rcenter">
|
|
<h4>Address</h4>
|
|
<code class="value" id="address"></code>
|
|
</div>
|
|
|
|
<div class="row mu1 rcenter">
|
|
<h4>Contract Data</h4>
|
|
<button disabled id="retrieve-rln-details" type="button">
|
|
Retrieve contract state from blockchain
|
|
</button>
|
|
</div>
|
|
|
|
<div class="row rcenter">
|
|
<h4>Latest membership id on contract</h4>
|
|
<code class="value" id="latest-membership-id">Not loaded yet</code>
|
|
</div>
|
|
|
|
<div class="row rcenter mu1">
|
|
<div>
|
|
<h2>Keystore</h2>
|
|
<span id="keystoreStatus"></span>
|
|
</div>
|
|
<div>
|
|
<button id="importKeystore" type="button">Import json</button>
|
|
<input type="file" id="importKeystoreInput" style="display: none" />
|
|
|
|
<button id="exportKeystore" type="button">Download json</button>
|
|
</div>
|
|
</div>
|
|
<hr />
|
|
|
|
<div class="row mu1">
|
|
<label for="keystorePassword"
|
|
>Password(used for reading/saving into Keystore):</label
|
|
>
|
|
<input
|
|
id="keystorePassword"
|
|
name="keystorePassword"
|
|
type="text"
|
|
style="width: 100%"
|
|
/>
|
|
</div>
|
|
|
|
<div class="row">
|
|
<div class="w50">
|
|
<h4>Generate new credentials from wallet:</h4>
|
|
<br />
|
|
<button
|
|
id="import-from-wallet-button"
|
|
type="button"
|
|
style="width: 100%"
|
|
>
|
|
Generate new credentials
|
|
</button>
|
|
<br />
|
|
<button disabled id="register-button" type="button">
|
|
Register credentials
|
|
</button>
|
|
</div>
|
|
<div class="w50">
|
|
<h4>Read from Keystore:</h4>
|
|
<br />
|
|
<select
|
|
id="keystoreOptions"
|
|
style="
|
|
width: 100%;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
"
|
|
></select>
|
|
<br />
|
|
<button id="readKeystore" type="button">Read credentials</button>
|
|
</div>
|
|
</div>
|
|
<div class="row rcenter mu1">
|
|
<h4>Keystore Hash</h4>
|
|
<code class="value" id="keystoreHash">none</code>
|
|
</div>
|
|
<div class="row rcenter">
|
|
<h4>Membership id</h4>
|
|
<code class="value" id="id">none</code>
|
|
</div>
|
|
<div class="row rcenter">
|
|
<h4>Secret Hash</h4>
|
|
<code class="value" id="secret-hash">none</code>
|
|
</div>
|
|
<div class="row rcenter">
|
|
<h4>Commitment</h4>
|
|
<code class="value" id="commitment">none</code>
|
|
</div>
|
|
<div class="row rcenter">
|
|
<h4>Nullifier</h4>
|
|
<code class="value" id="nullifier">none</code>
|
|
</div>
|
|
<div class="row rcenter">
|
|
<h4>Trapdoor</h4>
|
|
<code class="value" id="trapdoor">none</code>
|
|
</div>
|
|
|
|
<h2 class="mu1">Waku</h2>
|
|
<hr />
|
|
<div id="waku-status"></div>
|
|
|
|
<div class="row rcenter mu1 mf">
|
|
<label for="remote-multiaddr">Remote peer's multiaddr</label>
|
|
<input
|
|
id="remote-multiaddr"
|
|
type="text"
|
|
value="/dns4/node-01.ac-cn-hongkong-c.wakuv2.test.statusim.net/tcp/443/wss/p2p/16Uiu2HAkvWiyFsgRhuJEb9JfjYxEkoHLgnUQmr1N5mKWnYjxYRVm"
|
|
/>
|
|
<button disabled id="dial" type="button">Dial</button>
|
|
</div>
|
|
|
|
<div class="row rcenter mf">
|
|
<label for="nick-input">Your nickname</label>
|
|
<input
|
|
class="p100"
|
|
id="nick-input"
|
|
placeholder="Choose a nickname"
|
|
type="text"
|
|
/>
|
|
</div>
|
|
|
|
<div class="row rcenter mf">
|
|
<label for="textInput">Message text</label>
|
|
<input
|
|
class="p100"
|
|
disabled
|
|
id="textInput"
|
|
placeholder="Type your message here"
|
|
type="text"
|
|
/>
|
|
<button disabled id="sendButton" type="button">
|
|
Send message using Light Push
|
|
</button>
|
|
</div>
|
|
<span id="sending-status"></span>
|
|
|
|
<h4 class="mu1">Messages</h4>
|
|
<div id="messages"><ul id="messagesList"></ul></div>
|
|
|
|
<script src="https://unpkg.com/@multiformats/multiaddr@12.1.1/dist/index.min.js"></script>
|
|
<script type="module" src="./index.js"></script>
|
|
</body>
|
|
</html>
|