mirror of
https://github.com/ChuckNorrison/LightningTipBot.git
synced 2026-08-13 12:33:14 +02:00
add bootstrap
This commit is contained in:
parent
ab82b49ff5
commit
62c2cbab5f
1 changed files with 26 additions and 14 deletions
|
|
@ -13,6 +13,8 @@
|
|||
<meta name="MobileOptimized" content="176" />
|
||||
<meta name="HandheldFriendly" content="True" />
|
||||
<meta name="robots" content="noindex,nofollow" />
|
||||
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
|
||||
|
||||
<title>LNURL</title>
|
||||
<script src="https://unpkg.com/kjua@0.6.0/dist/kjua.min.js"></script>
|
||||
<script src="https://telegram.org/js/telegram-web-app.js?1"></script>
|
||||
|
|
@ -43,10 +45,7 @@
|
|||
display: block;
|
||||
width: 100%;
|
||||
font-size: 14px;
|
||||
margin: 15px 0;
|
||||
padding: 12px 20px;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background-color: var(--tg-theme-button-color, #50a8eb);
|
||||
color: var(--tg-theme-button-text-color, #ffffff);
|
||||
cursor: pointer;
|
||||
|
|
@ -61,10 +60,7 @@
|
|||
input {
|
||||
font-size: 14px;
|
||||
text-align: center;
|
||||
padding: 12px 20px;
|
||||
margin: 15px 0;
|
||||
border: none;
|
||||
border-radius: 4px;
|
||||
background-color: var(--tg-theme-bg-color, #f5f5f5);
|
||||
color: var(--tg-theme-text-color, #1a1a1a);
|
||||
}
|
||||
|
|
@ -218,6 +214,7 @@
|
|||
padding: 12px 20px;
|
||||
column-gap: 10px;
|
||||
row-gap: 1em;
|
||||
align-items: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
|
@ -235,11 +232,15 @@
|
|||
<div id="buttons">
|
||||
<!-- <button onclick="webviewClose();">Close</button> -->
|
||||
<div class="wrapper">
|
||||
<div>
|
||||
<input type="number" min="1" inputmode="numeric" pattern="[0-9]*" id="invoiceAmount" placeholder="amount in sat" style="width: 80%"></input>
|
||||
<label class="sr-only" for="inlineFormInputGroup">Username</label>
|
||||
<div class="input-group">
|
||||
<input type="number" class="form-control" min="1" inputmode="numeric" pattern="[0-9]*" id="invoiceAmount" placeholder="amount">
|
||||
<div class="input-group-append">
|
||||
<div class="input-group-text">sat</div>
|
||||
</div>
|
||||
</div>
|
||||
<div>
|
||||
<button onclick="invoiceButtonClick();" style="display: inline;" id="requestInvoice">Invoice</button>
|
||||
<button class="btn btn-primary" onclick="invoiceButtonClick();" style="display: inline;" id="requestInvoice">Invoice</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -271,8 +272,6 @@
|
|||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// listen for enter in input field
|
||||
var el = document.getElementById("invoiceAmount");
|
||||
el.addEventListener("keydown", function(event) {
|
||||
|
|
@ -280,6 +279,8 @@
|
|||
document.getElementById("requestInvoice").click();
|
||||
}
|
||||
document.getElementById("requestInvoice").innerHTML = "Invoice"
|
||||
// revert color of button
|
||||
$('#requestInvoice').removeClass('btn-danger').addClass('btn-primary');
|
||||
});
|
||||
|
||||
// ------------------ functions ------------------
|
||||
|
|
@ -292,6 +293,13 @@
|
|||
window.scrollTo(0, 0);
|
||||
}
|
||||
|
||||
function invoiceButtonDisplayError(message) {
|
||||
btn = document.getElementById("requestInvoice")
|
||||
btn.innerHTML = message
|
||||
// update color of button
|
||||
$('#requestInvoice').removeClass('btn-primary').addClass('btn-danger');
|
||||
}
|
||||
|
||||
function webviewClose() {
|
||||
Telegram.WebApp.close();
|
||||
}
|
||||
|
|
@ -319,8 +327,8 @@
|
|||
console.log(r);
|
||||
var invoiceAmount = Number(document.getElementById("invoiceAmount").value);
|
||||
if (!Number.isInteger(invoiceAmount) || invoiceAmount < 1) {
|
||||
document.getElementById("requestInvoice").innerHTML = "Error"
|
||||
return true;
|
||||
invoiceButtonDisplayError("Invalid")
|
||||
return false;
|
||||
}
|
||||
console.log("requesting invoice with amount " + invoiceAmount);
|
||||
fetch(r.callback + '?amount='+ invoiceAmount * 1000).then(data => {
|
||||
|
|
@ -333,13 +341,17 @@
|
|||
renderQr(r.pr);
|
||||
document.querySelector('#greeting').innerHTML = "Pay " + invoiceAmount + " sat";
|
||||
} else {
|
||||
document.getElementById("requestInvoice").innerHTML = "Error"
|
||||
invoiceButtonDisplayError("Error")
|
||||
return false;
|
||||
}
|
||||
|
||||
})
|
||||
})
|
||||
}
|
||||
</script>
|
||||
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/popper.js@1.12.9/dist/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
|
||||
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue