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 */
/* Basic Reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
font-family: "Open Sans", sans-serif;
font-size: 16px;
line-height: 1.6;
color: #333333;
background-color: #ffffff;
padding: 20px;
word-wrap: break-word;
}
/* Global Styles */
h1,
h2 {
margin-bottom: 20px;
color: #0056b3; /* Example Primary Color */
}
p {
margin-bottom: 15px;
}
button {
display: block;
margin-bottom: 15px;
padding: 12px 15px;
border: none;
border-radius: 5px;
background-color: #0056b3; /* Example Primary Color */
color: #ffffff;
cursor: pointer;
transition: background-color 0.3s;
width: 100%;
max-width: 200px;
}
button:hover {
background-color: #003d82; /* Darker Shade for Hover */
}
input[type="number"],
input[type="text"] {
display: inline;
margin-bottom: 15px;
padding: 10px;
border: 1px solid #cccccc;
border-radius: 5px;
transition: border-color 0.3s;
}
input[type="number"]:focus,
input[type="text"]:focus {
outline: none;
border-color: #0056b3; /* Example Primary Color */
}
.container {
margin-bottom: 20px;
padding: 20px;
border: 1px solid #cccccc;
border-radius: 5px;
background-color: #f9f9f9; /* Light Background for Container */
width: 100%;
max-width: 600px;
word-wrap: break-word;
}
/* mnemonic import input */
#mnemonicImport {
width: 100%;
margin-bottom: 15px;
padding: 10px;
border: 1px solid #cccccc;
border-radius: 5px;
transition: border-color 0.3s;
}
/* Media Queries */
@media screen and (max-width: 600px) {
.container {
padding: 10px;
}
input[type="number"],
input[type="text"] {
width: 100%;
}
}
</style>
</head>
<body>
<h1>EZ BSV Keys</h1>
<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>
<div class="container" id="addresses">
<h2>21 Addresses</h2>
<button id="generate21Addresses">Generate 21 Addresses</button>
<p id="addresses"></p>
</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;
});
const generate21Addresses = () => {
const addresses = [];
const coinPath = document.getElementById("coinPath").value;
for (let i = 0; i < 21; i++) {
const keys = generateKeys(coinPath, 0, 0, i);
addresses.push(keys.address);
}
return addresses;
};
document
.getElementById("generate21Addresses")
.addEventListener("click", () => {
const addresses = generate21Addresses();
const addressDiv = document.getElementById("addresses");
const addressArray = addresses.map((address) => {
return `<a href="https://whatsonchain.com/address/${address}" target="_blank">${address}</a>`;
});
// wait 5 seconds to avoid rate limit
// await new Promise((resolve) => setTimeout(resolve, 5000)); get balance
for (let i = 0; i < addressArray.length; i++) {
const address = addresses[i];
const addressElement = document.createElement("p");
addressElement.innerHTML = address;
addressElement.title = `Click to get balance.`;
addressElement.addEventListener("click", async () => {
const balance = await getBalance(address);
console.log(balance);
const total = balance.confirmed + balance.unconfirmed;
addressElement.innerHTML = `${address} -</br>${total} satoshis`;
});
addressDiv.appendChild(addressElement);
}
});
</script>
</body>
</html>
text/htmlutf-8|"1PuQa7K62MiKCtssSLKy1kh56WWU7MtUR5SETapp
utxo-cloudtypewebsiteauthor"1Ky8DbJFyt79pqnYKdLCuZTzKL2n3ifGPo
https://whatsonchain.com/tx/076946d6d60836c7ea3efdc09d0ef3aa8978eba93e14de8d8c7f7e29b5faa329