mirrors/btcpayserver
1
0
Fork 0
mirror of https://github.com/btcpayserver/btcpayserver.git synced 2024-11-19 18:11:36 +01:00
Code Issues Packages Projects Releases Wiki Activity

Modal option for Pay Button

Browse Source 
closes #796
This commit is contained in:
Kukks 2020-02-28 16:01:44 +01:00
parent 18aaa1a0c4
commit c3bfce7656
4 changed files with 48 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

10
BTCPayServer/Controllers/PublicController.cs
View File

@ -37,7 +37,6 @@ namespace BTCPayServer.Controllers
[HttpPost]
[Route("api/v1/invoices")]
[MediaTypeAcceptConstraintAttribute("text/html")]
[IgnoreAntiforgeryToken]
[EnableCors(CorsPolicies.All)]
public async Task<IActionResult> PayButtonHandle([FromForm]PayButtonViewModel model, CancellationToken cancellationToken)
@ -78,6 +77,15 @@ namespace BTCPayServer.Controllers
ModelState.AddModelError("Store", e.Message);
return View();
}
if (model.JsonResponse)
{
return Json(new
{
InvoiceId = invoice.Data.Id,
InvoiceUrl = invoice.Data.Url
});
}
if (string.IsNullOrEmpty(model.CheckoutQueryString))
{

2
BTCPayServer/Models/StoreViewModels/PayButtonViewModel.cs
View File

@ -41,5 +41,7 @@ namespace BTCPayServer.Models.StoreViewModels
public List<string> CurrencyDropdown { get; set; }
public string PayButtonImageUrl { get; set; }
public string PayButtonText { get; set; }
public bool UseModal { get; set; }
public bool JsonResponse { get; set; }
}
}

5
BTCPayServer/Views/Stores/PayButton.cshtml
View File

@ -47,6 +47,11 @@
<br />
<div class="row">
<div class="col-lg-7">
<div class="form-group">
<label>
<input type="checkbox" v-model="srvModel.useModal" v-on:change="inputChanges" class="form-check-inline"/>Use Modal
</label>
</div>
<div class="form-group">
<label>
<input type="checkbox" v-model="buttonInlineTextMode" v-on:change="inputChanges" class="form-check-inline"/> Customize text in button

34
BTCPayServer/wwwroot/paybutton/paybutton.js
View File

@ -41,6 +41,34 @@ function getStyles (styles) {
return document.getElementById(styles).innerHTML.trim().replace(/\s{2}/g, '') + '\n'
}
function getScripts(srvModel) {
return ""+
"<script>" +
"if(!window.btcpay){ " +
" var head = document.getElementsByTagName('head')[0];" +
" var script = document.createElement('script');" +
" script.src='"+esc(srvModel.urlRoot)+"modal/btcpay.js';" +
" script.type = 'text/javascript';" +
" head.append(script);" +
"}" +
"function onBTCPayFormSubmit(event){" +
" var xhttp = new XMLHttpRequest();" +
" xhttp.onreadystatechange = function() {" +
" if (this.readyState == 4 && this.status == 200) {" +
" if(this.status == 200 && this.responseText){" +
" var response = JSON.parse(this.responseText);" +
" window.btcpay.showInvoice(response.invoiceId);" +
" }" +
" }" +
" };" +
" xhttp.open(\"POST\", event.target.getAttribute('action'), true);" +
" xhttp.send(new FormData( event.target ));" +
"}" +
"</script>";
}
function inputChanges(event, buttonSize) {
if (buttonSize !== null && buttonSize !== undefined) {
srvModel.buttonSize = buttonSize;
@ -64,14 +92,16 @@ function inputChanges(event, buttonSize) {
width = "209px";
height = "57px";
}
var html =
//Scripts
(srvModel.useModal? getScripts(srvModel) :"") +
// Styles
getStyles('template-paybutton-styles') + (isSlider ? getStyles('template-slider-styles') : '') +
// Form
'<form method="POST" action="' + esc(srvModel.urlRoot) + 'api/v1/invoices" class="btcpay-form btcpay-form--' + (srvModel.fitButtonInline ? 'inline' : 'block') +'">\n' +
'<form method="POST" '+ ( srvModel.useModal? ' onsubmit="onBTCPayFormSubmit(event);return false" ' : '' )+' action="' + esc(srvModel.urlRoot) + 'api/v1/invoices" class="btcpay-form btcpay-form--' + (srvModel.fitButtonInline ? 'inline' : 'block') +'">\n' +
addInput("storeId", srvModel.storeId);
if (srvModel.useModal) html += addInput("jsonResponse", true);
if (srvModel.checkoutDesc) html += addInput("checkoutDesc", srvModel.checkoutDesc);
if (srvModel.orderId) html += addInput("orderId", srvModel.orderId);