aljaz/btcpayserver
1
0
Fork 0
mirror of https://github.com/aljazceru/btcpayserver.git synced 2026-02-15 19:24:31 +01:00
Code Issues Packages Projects Releases Wiki Activity

Showing loader for better UX when switching currencies

Browse Source
This commit is contained in:
lepipele
2018-03-03 00:11:08 -06:00
parent b0c810398c
commit acd98aad32
3 changed files with 33 additions and 2 deletions
Download Patch File Download Diff File Expand all files Collapse all files

7
BTCPayServer/Views/Invoice/Checkout.cshtml
View File

@@ -183,6 +183,13 @@
</a>
</div>
</div>
<div class="payment__spinner">
<bp-spinner>
<svg xml:space="preserve" style="enable-background:new 0 0 50 50;" version="1.1" viewBox="0 0 50 50" x="0px" xmlns="http://www.w3.org/2000/svg" y="0px">
<path d="M11.1,29.6c-0.5-1.5-0.8-3-0.8-4.6c0-8.1,6.6-14.7,14.7-14.7S39.7,16.9,39.7,25c0,1.6-0.3,3.2-0.8,4.6l6.1,2c0.7-2.1,1.1-4.3,1.1-6.6c0-11.7-9.5-21.2-21.2-21.2S3.8,13.3,3.8,25c0,2.3,0.4,4.5,1.1,6.6L11.1,29.6z"></path>
</svg>
</bp-spinner>
</div>
<div class="bp-view payment manual-flow enter-contact-email active" id="emailAddressView">
<form class="manual__step-one refund-address-form contact-email-form" id="emailAddressForm" name="emailAddressForm" novalidate="">
<div class="manual__step-one__header">

14
BTCPayServer/wwwroot/css/normalizer.css
View File

@@ -10892,6 +10892,20 @@ bp-spinner {
display: flex;
}
.payment__spinner {
margin-top: 140px;
display: none;
}
.payment__spinner > bp-spinner > svg {
margin: auto auto;
height: 60px;
width: 60px;
fill: gray;
animation: spin 0.55s linear infinite;
opacity: .85;
}
bp-refund-address.ng-valid .bitcoin-logo {
opacity: 1;
margin-left: 0;

14
BTCPayServer/wwwroot/js/core.js
View File

@@ -193,13 +193,23 @@ function onDataCallback(jsonData) {
window.parent.postMessage({ "invoiceId": srvModel.invoiceId, "status": newStatus }, "*");
}
// restoring qr code view only when currency is switched
if (jsonData.paymentMethodId == srvModel.paymentMethodId) {
$("#scan").show();
$(".payment__spinner").hide();
}
// updating ui
checkoutCtrl.srvModel = jsonData;
}
function changeCurrency(currency) {
srvModel.paymentMethodId = currency;
fetchStatus();
if (srvModel.paymentMethodId != currency) {
$("#scan").hide();
$(".payment__spinner").show();
srvModel.paymentMethodId = currency;
fetchStatus();
}
return false;
}