j"19HxigV4QyBv3tHpQVcUEQyq1pzZVdoAutM"<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>BSV Test HTML</title>
<script src="https://unpkg.com/bsv@1.5"></script>
<script src="https://cdn.jsdelivr.net/npm/bsv@1.5.0/bsv-message.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bsv@1.5.0/bsv-mnemonic.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bsv@1.5.0/bsv-ecies.min.js"></script>
<style>
/* Basic Reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: "Arial", sans-serif;
line-height: 1.6;
color: #333;
background-color: #f4f4f4;
padding: 20px;
word-wrap: break-word;
}
h1 {
text-align: center;
color: #444;
margin-bottom: 1rem;
}
/* Layout and Responsiveness */
.container {
width: 100%;
max-width: 960px;
margin: 0 auto;
padding: 0 20px;
word-wrap: break-word;
}
/* Form Elements */
input[type="number"],
input[type="text"] {
width: 100%;
padding: 10px;
margin: 10px 0;
border: 1px solid #ddd;
border-radius: 4px;
}
button {
background-color: #0056b3;
color: white;
padding: 10px 15px;
border: none;
border-radius: 5px;
cursor: pointer;
margin-top: 10px;
}
button:hover {
background-color: #004494;
}
/* Additional Styles */
p {
margin-bottom: 10px;
}
#importMnemonic {
display: flex;
align-items: center;
justify-content: space-between;
}
#changePath {
/* all on one line */
display: block;
width: 100%;
}
#changePath input {
width: 100px;
}
#balance {
font-weight: bold;
}
#storeKeysLocally {
margin-top: 20px;
}
#path,
#path1 {
width: 100px;
}
@media screen and (max-width: 600px) {
.container {
padding: 0 10px;
}
button,
input[type="number"],
input[type="text"] {
width: 100%;
}
}
</style>
</head>
<body>
<h1>EZ BSV Keys</h1>
<p>Open the console to see the results.</p>
<p>
<span id="changePath"
>Path: m/44'/<input
type="number"
id="coinPath"
min="0"
value="0"
/>'/<input type="number" id="path1" min="0" value="0" />'/<input
type="number"
id="path2"
min="0"
value="0"
/>/<input type="number" id="path3" min="0" value="0" />
</span>
</p>
<p id="currentPath"></p>
<button id="generate">Generate Keys</button>
<p id="mnemonic"></p>
<p id="privateKey"></p>
<p id="publicKey"></p>
<p id="address"></p>
<p id="balance"></p>
<button id="getBalance">Get Balance</button>
<button id="storeKeysLocally">Store Keys Locally</button>
<div id="importMnemonic">
<p>Import Mnemonic</p>
<input placeholder="mnemonic" type="text" id="mnemonicImport" />
<button id="import">Import</button>
</div>
<script>
const Buffer = bsv.deps.Buffer;
const hash = bsv.crypto.Hash;
let mnemonicString = "";
let keys = {};
const generateKeys = (coin = 0, p = 0, q = 0, r = 0) => {
let path = `m/44'/${coin}'/${p}'/${q}/${r}`;
if (mnemonicString == "") {
mnemonicString = bsv.Mnemonic.fromRandom().toString();
}
const mnemonic = bsv.Mnemonic.fromString(mnemonicString);
mnemonicString = mnemonic.toString();
const seed = mnemonic.toSeed();
const root = bsv.HDPrivateKey.fromSeed(seed);
const child = root.deriveChild(path);
const privateKey = child.privateKey;
const publicKey = bsv.PublicKey.fromPrivateKey(privateKey);
const address = bsv.Address.fromPublicKey(publicKey);
keys = {
mnemonic: mnemonic.toString(),
privateKey: privateKey.toString(),
publicKey: publicKey.toString(),
address: address.toString(),
};
const keysHash = hash.sha256(Buffer.from(JSON.stringify(keys)));
keys.keysHash = keysHash.toString("hex");
if (!localStorage.getItem("keys") && confirm("Store keys locally?")) {
localStorage.setItem("keys", JSON.stringify(keys));
}
document.getElementById("currentPath").innerHTML = path;
return keys;
};
const getBalance = async (address) => {
const response = await fetch(
`https://api.whatsonchain.com/v1/bsv/main/address/${address}/balance`
);
const data = await response.json();
return data;
};
document.getElementById("generate").addEventListener("click", () => {
const path1 = document.getElementById("path1").value;
const path2 = document.getElementById("path2").value;
const coinPath = document.getElementById("coinPath").value;
const path3 = document.getElementById("path3").value;
console.log(coinPath, path1, path2, path3);
keys = generateKeys(coinPath, path1, path2, path3);
document.getElementById("mnemonic").innerHTML = keys.mnemonic;
document.getElementById("privateKey").innerHTML = keys.privateKey;
document.getElementById("publicKey").innerHTML = keys.publicKey;
document.getElementById("address").innerHTML = keys.address;
});
document
.getElementById("getBalance")
.addEventListener("click", async () => {
if (!keys.address) {
alert("Generate keys first.");
return;
}
if (!keys.address) {
if (localStorage.getItem("keys")) {
keys = JSON.parse(localStorage.getItem("keys"));
} else {
alert("Generate keys first.");
return;
}
}
const balance = await getBalance(keys.address);
console.log(balance);
const total = balance.confirmed + balance.unconfirmed;
document.getElementById("balance").innerHTML = `${total} satoshis`;
});
document
.getElementById("storeKeysLocally")
.addEventListener("click", () => {
if (localStorage.getItem("keys")) {
if (!confirm("Keys already stored locally. Overwrite?")) {
return;
}
}
localStorage.setItem("keys", JSON.stringify(keys));
console.log("Keys stored locally.");
document.getElementById("storeKeysLocally").disabled = true;
});
document.getElementById("import").addEventListener("click", () => {
const mnemonic = document.getElementById("mnemonicImport").value;
if (!bsv.Mnemonic.isValid(mnemonic)) {
alert("Invalid mnemonic.");
return;
}
mnemonicString = mnemonic;
keys = generateKeys(0);
document.getElementById("mnemonic").innerHTML = keys.mnemonic;
document.getElementById("privateKey").innerHTML = keys.privateKey;
document.getElementById("publicKey").innerHTML = keys.publicKey;
document.getElementById("address").innerHTML = keys.address;
});
if (localStorage.getItem("keys")) {
keys = JSON.parse(localStorage.getItem("keys"));
mnemonicString = keys.mnemonic;
document.getElementById("mnemonic").innerHTML = keys.mnemonic;
document.getElementById("privateKey").innerHTML = keys.privateKey;
document.getElementById("publicKey").innerHTML = keys.publicKey;
document.getElementById("address").innerHTML = keys.address;
}
document.getElementById("path1").addEventListener("change", () => {
const path1 = document.getElementById("path1").value;
const path2 = document.getElementById("path2").value;
const coinPath = document.getElementById("coinPath").value;
const path3 = document.getElementById("path3").value;
const keys = generateKeys(coinPath, path1, path2, path3);
document.getElementById("mnemonic").innerHTML = keys.mnemonic;
document.getElementById("privateKey").innerHTML = keys.privateKey;
document.getElementById("publicKey").innerHTML = keys.publicKey;
document.getElementById("address").innerHTML = keys.address;
document.getElementById("currentPath").innerHTML = path;
});
</script>
</body>
</html>
text/htmlutf-8|"1PuQa7K62MiKCtssSLKy1kh56WWU7MtUR5SETapp
utxo-cloudtypewebsiteauthor"1Ky8DbJFyt79pqnYKdLCuZTzKL2n3ifGPo
https://whatsonchain.com/tx/a223e3f5f50dc71cd09082fda014d6e91a5d1cfd6c4f8c6a72b876822f5a3b2f