BTCPrivate
/
lightningtip
mirror of https://github.com/BTCPrivate/lightningtip.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

reworked displaying of invoice

This commit is contained in:
michael1011 2018-03-30 19:30:09 +02:00
parent 8c2f331303
commit 6c69629eed
No known key found for this signature in database
GPG Key ID: 84D249BA71685D46
2 changed files with 23 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/lightningTip.css
View File

@ -1,3 +1,4 @@
/* TODO: add light theme */
.lightningTipInput { .lightningTipInput {
width: 100%; width: 100%;
@ -95,15 +96,15 @@
} }
#lightningTipInvoice { #lightningTipInvoice {
margin-top: 0.6em; margin-top: 1em;
margin-bottom: 1em; margin-bottom: 0.5em;
} }
#lightningTipTools { #lightningTipTools {
height: 100px; height: 100px;
} }
#lightningTipGetQR { #lightningTipCopy {
border-right: 1px solid #F5F5F5; border-right: 1px solid #F5F5F5;
border-top-right-radius: 0; border-top-right-radius: 0;

28
frontend/lightningTip.js
View File

@ -10,6 +10,7 @@ var qrCode;
var defaultGetInvoice; var defaultGetInvoice;
// TODO: solve this without JavaScript
// Fixes weird bug which moved the button up one pixel when its content was changed // Fixes weird bug which moved the button up one pixel when its content was changed
window.onload = function () { window.onload = function () {
var button = document.getElementById("lightningTipGetInvoice"); var button = document.getElementById("lightningTipGetInvoice");
@ -19,7 +20,7 @@ window.onload = function () {
}; };
// TODO: fix scaling on phones // TODO: fix scaling on phones
// TODO: maybe don't show full invoice // TODO: optimize creating bigger QR codes
// TODO: show price in dollar? // TODO: show price in dollar?
function getInvoice() { function getInvoice() {
if (running === false) { if (running === false) {
@ -50,26 +51,29 @@ function getInvoice() {
listenInvoiceSettled(hash); listenInvoiceSettled(hash);
// Update UI
invoice = json.Invoice; invoice = json.Invoice;
// Update UI
var wrapper = document.getElementById("lightningTip"); var wrapper = document.getElementById("lightningTip");
wrapper.innerHTML = "<a>Your tip request</a>"; wrapper.innerHTML = "<a>Your tip request</a>";
wrapper.innerHTML += "<textarea class='lightningTipInput' id='lightningTipInvoice' onclick='copyToClipboard(this)' readonly>" + json.Invoice + "</textarea>"; wrapper.innerHTML += "<input type='text' class='lightningTipInput' id='lightningTipInvoice' onclick='copyInvoiceToClipboard()' value='" + invoice + "' readonly>";
wrapper.innerHTML += "<div id='lightningTipQR'></div>"; wrapper.innerHTML += "<div id='lightningTipQR'></div>";
resizeInput(document.getElementById("lightningTipInvoice")); resizeInput(document.getElementById("lightningTipInvoice"));
showQRCode();
wrapper.innerHTML += "<div id='lightningTipTools'>" + wrapper.innerHTML += "<div id='lightningTipTools'>" +
"<button class='lightningTipButton' id='lightningTipGetQR' onclick='showQRCode()'>QR</button>" + "<button class='lightningTipButton' id='lightningTipCopy' onclick='copyInvoiceToClipboard()'>Copy</button>" +
"<button class='lightningTipButton' id='lightningTipOpen'>Open</button>" + "<button class='lightningTipButton' id='lightningTipOpen'>Open</button>" +
"<a id='lightningTipExpiry'></a>" + "<a id='lightningTipExpiry'></a>" +
"</div>"; "</div>";
starTimer(json.Expiry, document.getElementById("lightningTipExpiry")); starTimer(json.Expiry, document.getElementById("lightningTipExpiry"));
document.getElementById("lightningTipTools").style.height = document.getElementById("lightningTipGetQR").clientHeight + "px"; // Fixes bug which caused the content of #lightningTipTools to be visually outside of #lightningTip
document.getElementById("lightningTipTools").style.height = document.getElementById("lightningTipCopy").clientHeight + "px";
document.getElementById("lightningTipOpen").onclick = function () { document.getElementById("lightningTipOpen").onclick = function () {
location.href = "lightning:" + json.Invoice; location.href = "lightning:" + json.Invoice;
@ -130,7 +134,7 @@ function listenInvoiceSettled(hash) {
}; };
} catch (e) { } catch (e) {
console.info(e); console.error(e);
console.warn("Your browser does not support EventSource. Sending a request to the server every two second to check if the invoice is settled"); console.warn("Your browser does not support EventSource. Sending a request to the server every two second to check if the invoice is settled");
var interval = setInterval(function () { var interval = setInterval(function () {
@ -227,7 +231,7 @@ function showQRCode() {
createQRCode(10); createQRCode(10);
} }
element.style.marginBottom = "1em"; element.style.marginBottom = "0.8em";
element.innerHTML = qrCode; element.innerHTML = qrCode;
var size = document.getElementById("lightningTipInvoice").clientWidth + "px"; var size = document.getElementById("lightningTipInvoice").clientWidth + "px";
@ -267,7 +271,9 @@ function createQRCode(typeNumber) {
} }
function copyToClipboard(element) { function copyInvoiceToClipboard() {
var element = document.getElementById("lightningTipInvoice");
element.select(); element.select();
document.execCommand('copy'); document.execCommand('copy');
@ -296,5 +302,9 @@ function showErrorMessage(message) {
function resizeInput(element) { function resizeInput(element) {
element.style.height = "auto"; element.style.height = "auto";
element.style.height = (element.scrollHeight) + "px";
// Change the size only if
if (element.clientHeight !== element.scrollHeight) {
element.style.height = (element.scrollHeight) + "px";
}
} }