supertestnet/inscriboor
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Update index.html

Browse Source
This commit is contained in:
supertestnet authored and GitHub committed 2023-03-14 00:26:47 -05:00
1 parent ecccaa36a8
commit 7ebcc3d2a6
1 file changed
+92 -12
Download Patch File Download Diff File Expand all files Collapse all files
index.html
+92 -12
View File
@@ -74,6 +74,26 @@
.checking_mempool, .checking_mempool span {
color: lightgreen;
}
.feerates {
display: flex;
justify-content: space-around;
}
.fee {
width: 100%;
max-width: 6rem;
margin-right: 2rem;
margin-left: 0px;
text-align: center;
cursor: pointer;
}
.fee .num {
background-color: grey;
border: 1px solid white;
padding: .3rem;
}
.maxfee .num {
background-color: green;
}
@media screen and (max-width: 600px) {
}
</style>
@@ -184,18 +204,36 @@
</head>
<body>
<h1>Welcome to the online inscriber</h1>
<p>First enter a bitcoin addresses from an ordinal wallet</p>
<!-- <p><input class="address" value="tb1padwymyc6x2dfc3cwzvpxxcqsr3c46cjx9zxg0jmcuf44fjuwljxs7x68fm"></p> -->
<p>First enter a <span class="type_of_address">taproot</span> address from an ordinal wallet</p>
<p><input class="address"></p>
<p>Then upload a file you want that address to own</p>
<form>
<p><input type="file" class="form" /></p>
<p>Select a feerate (measured in sats per byte)</p>
<div class="feerates"><div class="fee minfee"><div class="num">...</div><div class="name">Min</div></div><div class="fee midfee"><div class="num">...</div><div class="name">Mid</div></div><div class="fee maxfee"><div class="num">...</div><div class="name">Max</div></div></div>
<div id="sliderange">
<p>Sats per byte: <span id="sats_per_byte">1</span></p>
<input id="sats_range" type="range" min="1" max="100" value="1">
</div>
<script>
var slider = document.getElementById( "sats_range" );
var output = document.getElementById( "sats_per_byte" );
output.innerHTML = slider.value;
slider.oninput = function() {
output.innerHTML = this.value;
sessionStorage[ "feerate" ] = this.value;
$$( '.fee .num' ).forEach( function( item ) {
item.style.backgroundColor = "grey";
});
}
</script>
</form>
<p><button class="submit">Submit</button></p>
<div class="display"></div>
<div style="display: none;" class="file"></div>
<script>
sessionStorage.clear();
const privkey = bytesToHex( cryptoUtils.Noble.utils.randomPrivateKey() );
$( '.form' ).addEventListener( "change", async function() {
if ( this.files[ 0 ].size < 90000 ) {
var b64 = await encodeBase64( this );
@@ -213,7 +251,6 @@
const hex = $( '.file' ).innerText;
const data = hexToBytes( hex );
const KeyPair = cryptoUtils.KeyPair;
const privkey = bytesToHex( cryptoUtils.Noble.utils.randomPrivateKey() );
const seckey = new KeyPair(privkey);
const pubkey = seckey.pub.rawX;
const mimetype = ec.encode( sessionStorage[ "mimetype" ] );
@@ -231,7 +268,11 @@
var decodedToAddress = "5120" + BTON.Tap.decodeAddress( toAddress ).hex;
console.log('To address decoded:', decodedToAddress );
var txsize = 200 + ( hex.length / 2 );
var feerate = await getMinFeeRate();
if ( sessionStorage[ "feerate" ] ) {
var feerate = Number( sessionStorage[ "feerate" ] );
} else {
var feerate = await getMaxFeeRate();
}
var fee = feerate * txsize;
var btc_price = sessionStorage[ "bitcoin_price" ];
var sats_price = await satsToDollars( fee + 1000 );
@@ -250,13 +291,13 @@
var txid = txinfo[ 0 ];
var vout = txinfo[ 1 ];
var amt = txinfo[ 2 ];
if ( !txid || !vout || !amt ) {
await waitSomeSeconds( 2 );
txinfo = await addressReceivedMoneyInThisTx( fundingAddress );
txid = txinfo[ 0 ];
vout = txinfo[ 1 ];
amt = txinfo[ 2 ];
}
// if ( !txid || !vout || !amt ) {
// await waitSomeSeconds( 2 );
// txinfo = await addressReceivedMoneyInThisTx( fundingAddress );
// txid = txinfo[ 0 ];
// vout = txinfo[ 1 ];
// amt = txinfo[ 2 ];
// }
// var amt = prompt( "give me the amount you sent" );
// amt = Number( amt );
// var txid = prompt( "give me the txid" );
@@ -293,7 +334,7 @@
$( '.modal' ).style.display = "block";
$( '.black-bg' ).style.display = "block";
});
async function getMinFeeRate() {
async function getMaxFeeRate() {
var fees = await getData( "https://mempool.space/api/v1/fees/recommended" );
fees = JSON.parse( fees );
// if ( !( "minimumFee" in fees ) ) return "error -- site down";
@@ -302,6 +343,18 @@
var minfee = fees[ "fastestFee" ];
return minfee;
}
function isValidTaprootAddress( address ) {
try {
BTON.Tap.decodeAddress( address ).hex;
return true;
} catch( e ) {}
return;
}
async function getAllFeeRates() {
var fees = await getData( "https://mempool.space/api/v1/fees/recommended" );
fees = JSON.parse( fees );
return fees;
}
function getData( url ) {
return new Promise( async function( resolve, reject ) {
function inner_get( url ) {
@@ -458,8 +511,35 @@
$( ".black-bg" ).style.display = "none";
$( ".modal" ).style.display = "none";
}
$$( '.fee' ).forEach( function( item ) {
item.onclick = function() {
$$( '.fee .num' ).forEach( function( item2 ) {
item2.style.backgroundColor = "grey";
});
this.getElementsByClassName( "num" )[ 0 ].style.backgroundColor = "green";
sessionStorage[ "feerate" ] = this.getElementsByClassName( "num" )[ 0 ].innerText;
}
});
function checkAddress() {
if ( !isValidTaprootAddress( $( '.address' ).value ) ) {
$( '.address' ).style.backgroundColor = "#ff5252";
$( '.address' ).style.border = "2px solid red";
$( '.type_of_address' ).style.border = "1px solid white";
} else {
$( '.address' ).style.backgroundColor = "initial";
$( '.address' ).style.border = "1px solid white";
$( '.type_of_address' ).style.borderStyle = "none";
}
}
$( '.address' ).onchange = checkAddress;
$( '.address' ).onpaste = checkAddress;
$( '.address' ).onkeyup = checkAddress;
async function init() {
sessionStorage[ "bitcoin_price" ] = await getBitcoinPrice();
var allrates = await getAllFeeRates();
$( '.minfee .num' ).innerText = allrates[ "minimumFee" ];
$( '.midfee .num' ).innerText = allrates[ "hourFee" ];
$( '.maxfee .num' ).innerText = allrates[ "fastestFee" ];
await waitSomeSeconds( 10 );
init();
}