361c1752a7
- disabled segwit and bech32 address shown in generation and retrieval (until broadcast issue if fixed for them)
209 lines
8.2 KiB
HTML
209 lines
8.2 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<title>BTC webWallet</title>
|
|
<style>
|
|
body {
|
|
background-color: grey;
|
|
}
|
|
|
|
table,
|
|
tr,
|
|
td,
|
|
th {
|
|
border: 1px solid black;
|
|
}
|
|
|
|
.unconfirmed-tx {
|
|
color: darkred;
|
|
}
|
|
</style>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
|
|
<script type="text/javascript" src="lib.js"></script>
|
|
<script type="text/javascript" src="lib_btc.js"></script>
|
|
</head>
|
|
|
|
<body>
|
|
<form id="generate-address">
|
|
<fieldset>
|
|
<legend>generate-address</legend>
|
|
<input type="button" value="generate" onclick="generateNew();">
|
|
Address: <input name="address" type="text" placeholder="Address" disabled /><br />
|
|
SegwitAddress: <input name="segwit" type="text" placeholder="SegwitAddress" disabled /><br />
|
|
Bech32Address: <input name="bech32" type="text" placeholder="Bech32Address" disabled /><br />
|
|
PrivateKey: <input name="private" type="text" placeholder="Private-Key" disabled /><br />
|
|
</fieldset>
|
|
</form>
|
|
<form id="retrieve-address">
|
|
<fieldset>
|
|
<legend>retrieve-address</legend>
|
|
<input name="private" type="text" placeholder="Private-Key" />
|
|
<input type="button" value="retrieve" onclick="retrieveAddress();"><br />
|
|
Address: <input name="address" type="text" placeholder="Address" disabled /><br />
|
|
SegwitAddress: <input name="segwit" type="text" placeholder="SegwitAddress" disabled /><br />
|
|
Bech32Address: <input name="bech32" type="text" placeholder="Bech32Address" disabled /><br />
|
|
</fieldset>
|
|
</form>
|
|
<form id="send-tx">
|
|
<fieldset>
|
|
<legend>send-tx</legend>
|
|
<input name="sender" type="text" placeholder="Sender" />
|
|
<input name="receiver" type="text" placeholder="Receiver" />
|
|
<input name="amount" type="number" placeholder="Amount" step="0.01" />
|
|
<input name="fee" type="number" placeholder="fee" step="0.000001" />
|
|
<input type="button" value="send" onclick="sendTx();">
|
|
</fieldset>
|
|
</form>
|
|
<form id="address-details">
|
|
<fieldset>
|
|
<legend>address-details</legend>
|
|
<input name="address" type="text" placeholder="Address" />
|
|
<input type="button" value="balance" onclick="checkBalance();">
|
|
<input type="button" value="details" onclick="viewAddress();">
|
|
<div>Balance: <input name="balance" disabled /></div>
|
|
<table>
|
|
<thead>
|
|
<tr>
|
|
<th></th>
|
|
<th>address</th>
|
|
<th>amount</th>
|
|
<th>time</th>
|
|
<th>txid</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="view-details"></tbody>
|
|
</table>
|
|
</fieldset>
|
|
</form>
|
|
</body>
|
|
<script>
|
|
function generateNew() {
|
|
let newKeys = btc_api.newKeys;
|
|
let form = document.forms['generate-address'];
|
|
form['private'].value = newKeys.wif;
|
|
form['address'].value = newKeys.address;
|
|
//form['segwit'].value = newKeys.segwitAddress;
|
|
//form['bech32'].value = newKeys.bech32Address;
|
|
}
|
|
|
|
function retrieveAddress() {
|
|
let form = document.forms['retrieve-address'];
|
|
let wif = form['private'].value;
|
|
form['address'].value = btc_api.address(wif);
|
|
//form['segwit'].value = btc_api.segwitAddress(wif);
|
|
//form['bech32'].value = btc_api.bech32Address(wif);
|
|
}
|
|
|
|
function checkBalance() {
|
|
let form = document.forms['address-details'];
|
|
let address = form["address"].value;
|
|
btc_api.getBalance(address)
|
|
.then(result => form["balance"].value = result)
|
|
.catch(error => console.error(error))
|
|
}
|
|
|
|
function sendTx() {
|
|
let form = document.forms['send-tx'];
|
|
let sender = form["sender"].value,
|
|
receiver = form["receiver"].value,
|
|
amount = parseFloat(form["amount"].value),
|
|
fee = parseFloat(form["fee"].value);
|
|
let privKey = prompt("Enter Private Key:");
|
|
btc_api.sendTx(sender, privKey, receiver, amount, fee).then(result => {
|
|
console.log(result);
|
|
alert("transaction id: " + result.txid);
|
|
}).catch(error => console.error(error))
|
|
}
|
|
|
|
function viewAddress() {
|
|
let form = document.forms['address-details']
|
|
let address = form['address'].value;
|
|
let table = document.getElementById("view-details");
|
|
table.innerHTML = '';
|
|
form['balance'].value = '';
|
|
getAddressDetails(address).then(result => {
|
|
console.debug(result);
|
|
form['balance'].value = result.balance;
|
|
result.txs.forEach(tx => {
|
|
let row = table.insertRow();
|
|
if (tx.type === "out") {
|
|
row.insertCell().innerHTML = '↗';
|
|
row.insertCell().textContent = tx.receiver;
|
|
} else if (tx.type === "in") {
|
|
row.insertCell().innerHTML = '↙';
|
|
row.insertCell().textContent = tx.sender;
|
|
} else if (tx.type === "self") {
|
|
row.insertCell().innerHTML = '⟲';
|
|
row.insertCell().textContent = tx.address;
|
|
}
|
|
row.insertCell().textContent = tx.amount;
|
|
row.insertCell().textContent = tx.time;
|
|
row.insertCell().textContent = tx.txid;
|
|
if (tx.block === null)
|
|
row.className = 'unconfirmed-tx';
|
|
});
|
|
}).catch(error => console.error(error))
|
|
}
|
|
|
|
function getAddressDetails(address) {
|
|
return new Promise((resolve, reject) => {
|
|
btc_api.getAddressData(address).then(data => {
|
|
console.debug(data);
|
|
let details = {};
|
|
details.balance = data.balance;
|
|
details.address = data.address;
|
|
details.txs = data.txs.map(tx => {
|
|
let d = {
|
|
txid: tx.txid,
|
|
time: tx.time,
|
|
block: tx.block_no
|
|
}
|
|
if (tx.outgoing) {
|
|
d.type = "out";
|
|
d.amount = 0;
|
|
d.receiver = [];
|
|
let change = 0;
|
|
tx.outgoing.outputs.forEach(o => {
|
|
if (o.address !== address) {
|
|
d.receiver.push(o.address)
|
|
d.amount += parseFloat(o.value)
|
|
} else
|
|
change += parseFloat(o.value)
|
|
});
|
|
d.fee = parseFloat((tx.outgoing.value - (d.amount + change)).toFixed(8))
|
|
if (!d.amount && change > 0) {
|
|
d.type = "self";
|
|
d.amount = change
|
|
delete d.receiver;
|
|
d.address = address;
|
|
}
|
|
} else if (tx.incoming) {
|
|
d.type = "in";
|
|
d.amount = parseFloat(tx.incoming.value);
|
|
d.sender = tx.incoming.inputs.map(i => i.address)
|
|
}
|
|
return d;
|
|
})
|
|
resolve(details);
|
|
}).catch(error => reject(error))
|
|
})
|
|
}
|
|
|
|
function testGenerator() {
|
|
let n = btc_api.newKeys;
|
|
let a1 = btc_api.address(n.wif);
|
|
let b1 = btc_api.bech32Address(n.wif);
|
|
let c1 = btc_api.segwitAddress(n.wif);
|
|
let p1 = btc_api.pubkey(n.wif);
|
|
let a2 = btc_api.address(n.privkey);
|
|
let b2 = btc_api.bech32Address(n.privkey);
|
|
let c2 = btc_api.segwitAddress(n.privkey);
|
|
let p2 = btc_api.pubkey(n.privkey);
|
|
console.log(n.pubkey === p1 && p2 === p1);
|
|
console.log(n.address === a1 && a1 === a2);
|
|
console.log(n.segwitAddress === c1 && c2 === c1);
|
|
console.log(n.bech32Address === b1 && b1 === b2);
|
|
}
|
|
</script>
|
|
|
|
</html> |