udemy-go-web-2/cmd/web/templates/terminal.page.gohtml

96 lines
3.3 KiB
Plaintext
Raw Normal View History

2024-08-03 20:26:40 +00:00
{{ template "base" . }}
{{ define "title" }}
Virtual Terminal
{{ end }}
{{ define "content" }}
2024-08-04 12:40:32 +00:00
<h2 class="mt-3 text-center">Virtual Terminal</h2>
<hr>
2024-08-04 13:06:41 +00:00
<div class="alert alert-danger text-center d-none" id="card-messages"></div>
2024-08-11 10:30:57 +00:00
<form action="/virtual-terminal-payment-succeeded"
2024-08-04 12:40:32 +00:00
method="post"
name="charge_form"
id="charge_form"
class="d-blick needs-validation charge-form"
autocomplete="off"
novalidate="">
<div class="mb-3">
<label for="amount" class="form-label">Amount</label>
<input type="text"
id="charge_amount"
name="charge_amount"
autocomplete="charge_amount-new"
2024-08-04 12:40:32 +00:00
required=""
class="form-control">
<input type="hidden" id="amount" name="amount" value="value">
2024-08-04 12:40:32 +00:00
</div>
<div class="mb-3">
<label for="cardholder-name" class="form-label">Cardholder Name</label>
<input type="text"
id="cardholder-name"
name="cardholder_name"
autocomplete="cardholder-name-new"
required=""
class="form-control">
</div>
<div class="mb-3">
<label for="cardholder-email" class="form-label">Cardholder Email</label>
<input type="text"
id="cardholder-email"
name="cardholder_email"
autocomplete="cardholder-email-new"
required=""
class="form-control">
</div>
<!-- card number will be built by stripe -->
<div class="mb-3">
<label for="card-element" class="form-label">Credit Card</label>
<div class="form-control" id="card-element"></div>
<div class="alert-danger text-center" id="card-errors" role="alert"></div>
<div class="alert-success text-center" id="card-success" role="alert"></div>
</div>
<hr>
2024-08-11 20:51:34 +00:00
<a href="javascript:void(0)" id="pay-button" class="btn btn-primary">Charge Card</a>
2024-08-04 13:06:41 +00:00
<div class="text-center d-none" id="processing-payment">
<div class="spinner-border text-primary" role="status">
<span class="visually-hidden">Loading...</span>
</div>
</div>
2024-08-04 21:06:13 +00:00
<input id="payment_intent"
type="hidden"
name="payment_intent"
value="payment_intent">
<input id="payment_method"
type="hidden"
name="payment_method"
value="payment_method">
<input id="payment_amount"
type="hidden"
name="payment_amount"
value="payment_amount">
<input id="payment_currency"
type="hidden"
name="payment_currency"
value="payment_currency">
2024-08-04 12:40:32 +00:00
</form>
2024-08-03 20:26:40 +00:00
{{ end }}
{{ define "js" }}
<script src="https://js.stripe.com/v3/"></script>
2024-08-11 20:51:34 +00:00
<script type="module">
import {stripeInit} from "/static/js/common.js";
import {val} from "/static/js/stripe.js"
stripeInit('{{.StripePubKey}}');
2024-08-11 10:30:57 +00:00
document.getElementById("charge_amount").addEventListener("change", (evt) => {
if (evt.target.value !== "") {
document.getElementById("amount").value = parseInt((evt.target.value * 100), 10);
} else {
document.getElementById("amount").value = 0;
}
2024-08-11 10:30:57 +00:00
});
2024-08-11 20:51:34 +00:00
document.getElementById("pay-button").addEventListener("click", () => {
val({{.API}});
})
</script>
2024-08-03 20:26:40 +00:00
{{ end }}