Merge pull request #384 from LightningTipBot/webapp/test2

Webapp/test2
This commit is contained in:
calle 2022-08-28 20:43:45 +02:00 committed by GitHub
commit 55ba146592
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 106 additions and 21 deletions

View file

@ -58,6 +58,17 @@
pointer-events: none;
}
input {
font-size: 14px;
text-align: center;
padding: 12px 20px;
margin: 15px 0;
border: none;
border-radius: 4px;
background-color: var(--tg-theme-secondary-bg-color, #f5f5f5);
color: var(--tg-theme-text-color, #1a1a1a);
}
section {
padding: 5px 5px 65px;
text-align: center;
@ -200,13 +211,21 @@
width: 100% !important;
height: 100% !important;
}
.wrapper {
display: grid;
grid-template-columns: 3fr 2fr;
padding: 12px 20px;
column-gap: 10px;
row-gap: 1em;
}
</style>
</head>
<body>
<section>
<h1>{{.Username}}@ln.tips</h1>
<h1 id="greeting"></h1>
<div class="qr-container">
<div class="qr" id="qr">
@ -214,39 +233,104 @@
</div>
<div id="buttons">
<button onclick="webviewClose();">Close</button>
<!-- <button onclick="webviewClose();">Close</button> -->
<div class="wrapper">
<div>
<input type="number" id="invoiceAmount" placeholder="amount in sat" style="width: 80%"></input>
</div>
<div>
<button onclick="getInvoice(this, {{.Callback}});" style="display: inline;" id="requestInvoice">Invoice</button>
</div>
</div>
</div>
</section>
<script type="application/javascript">
Telegram.WebApp.ready();
const qr = document.getElementById('qr');
if ( qr ) {
const qrGfx = kjua({
text: {{.LNURLPay}},
rounded: 50,
size: 500,
render: 'canvas',
});
qr.appendChild( qrGfx );
}
// render the LNURL pay QR code
var s = "{{.LNURLPay}}";
renderQr(s);
// data passed form telegram server
const initData = Telegram.WebApp.initData || '';
const initDataUnsafe = Telegram.WebApp.initDataUnsafe || {};
document.querySelector('#greeting').innerHTML = `Hi, ${initDataUnsafe.user.first_name}!`;
document.querySelector('#initData').innerHTML = JSON.stringify(initData, null, 2);
document.querySelector('#initDataUnsafe').innerHTML = JSON.stringify(initDataUnsafe, null, 2);
document.querySelector('#themeData').html(JSON.stringify(Telegram.WebApp.themeParams, null, 2));
document.querySelector('#greeting').innerHTML = "{{.Username}}@ln.tips";
// document.querySelector('#initData').innerHTML = JSON.stringify(initData, null, 2);
// document.querySelector('#initDataUnsafe').innerHTML = JSON.stringify(initDataUnsafe, null, 2);
Telegram.WebApp.onEvent('themeChanged', function() {
document.querySelector('#themeData').innerHTML = JSON.stringify(Telegram.WebApp.themeParams, null, 2);
// react to theme changes
try {
document.querySelector('#themeData').html(JSON.stringify(Telegram.WebApp.themeParams, null, 2));
Telegram.WebApp.onEvent('themeChanged', function() {
document.querySelector('#themeData').innerHTML = JSON.stringify(Telegram.WebApp.themeParams, null, 2);
});
} catch (error) {
console.error(error);
}
// listen for enter in input field
var el = document.getElementById("invoiceAmount");
el.addEventListener("keydown", function(event) {
if (event.key === "Enter") {
document.getElementById("requestInvoice").click();
}
document.getElementById("requestInvoice").innerHTML = "Invoice"
});
// ------------------ functions ------------------
function webviewClose() {
Telegram.WebApp.close();
}
function renderQr(payload) {
const qr = document.getElementById('qr');
qr.innerHTML = '';
if ( qr ) {
const qrGfx = kjua({
text: payload,
rounded: 50,
size: 500,
render: 'canvas',
});
qr.appendChild( qrGfx );
}
}
function getInvoice(el, callback) {
fetch(callback)
.then(data => {
return data.json();
})
.then(r => {
console.log(r);
var invoiceAmount = document.getElementById("invoiceAmount").value;
if (invoiceAmount == "") {
invoiceAmount = 1000;
console.warn("overwriting invoiceAmount with " + invoiceAmount);
}
console.log("requesting invoice with amount " + invoiceAmount);
fetch(r.callback + '?amount='+ invoiceAmount * 1000).then(data => {
return data.json();
})
.then(r => {
console.log(r);
if (r.status == "OK"){
// update qr code
renderQr(r.pr);
document.querySelector('#greeting').innerHTML = "Pay " + invoiceAmount + " sat";
} else {
document.getElementById("requestInvoice").innerHTML = "Error"
}
})
})
}
</script>
</body>
</html>

View file

@ -105,7 +105,8 @@ func (s Service) UserWebAppHandler(w http.ResponseWriter, r *http.Request) {
if err := qr_tmpl.ExecuteTemplate(w, "webapp", struct {
Username string
LNURLPay string
}{username, lnurlEncode}); err != nil {
Callback string
}{username, lnurlEncode, callback}); err != nil {
log.Errorf("failed to render template")
}
}

View file

@ -184,7 +184,7 @@ func (w Lnurl) serveLNURLpSecond(username string, amount_msat int64, comment str
return &lnurl.LNURLPayValues{
LNURLResponse: lnurl.LNURLResponse{
Status: api.StatusError,
Reason: fmt.Sprintf("Amount out of bounds (min: %d mSat, max: %d mSat).", MinSendable, MinSendable)},
Reason: fmt.Sprintf("Amount out of bounds (min: %d sat, max: %d sat).", MinSendable/1000, MaxSendable/1000)},
}, fmt.Errorf("amount out of bounds")
}
// check comment length