Skip to content

Commit a448707

Browse files
ruojianllruojianll
committed
sponsor
1 parent 08bbc02 commit a448707

File tree

1 file changed

+131
-0
lines changed

1 file changed

+131
-0
lines changed

‎docs/sponsor/one-time.html

Lines changed: 131 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,131 @@
1+
<html>
2+
3+
<head></head>
4+
5+
<body>
6+
<div id="smart-button-container">
7+
<div style="text-align: center"><label for="description">Github name: </label><input type="text"
8+
name="descriptionInput" id="description" maxlength="127" value=""></div>
9+
<p id="descriptionError" style="visibility: hidden; color:red; text-align: center;">Please enter a description
10+
</p>
11+
<div style="text-align: center"><label for="amount">Amount: </label><input name="amountInput" type="number"
12+
id="amount" value=""><span> USD</span></div>
13+
<p id="priceLabelError" style="visibility: hidden; color:red; text-align: center;">Please enter a price</p>
14+
<div id="invoiceidDiv" style="text-align: center; display: none;"><label for="invoiceid"> </label><input
15+
name="invoiceid" maxlength="127" type="text" id="invoiceid" value=""></div>
16+
<p id="invoiceidError" style="visibility: hidden; color:red; text-align: center;">Please enter an Invoice ID</p>
17+
<div style="text-align: center; margin-top: 0.625rem;" id="paypal-button-container"></div>
18+
</div>
19+
<script src="https://www.paypal.com/sdk/js?client-id=sb&enable-funding=venmo&currency=USD"
20+
data-sdk-integration-source="button-factory"></script>
21+
<script>
22+
function initPayPalButton() {
23+
var description = document.querySelector('#smart-button-container #description');
24+
var amount = document.querySelector('#smart-button-container #amount');
25+
var descriptionError = document.querySelector('#smart-button-container #descriptionError');
26+
var priceError = document.querySelector('#smart-button-container #priceLabelError');
27+
var invoiceid = document.querySelector('#smart-button-container #invoiceid');
28+
var invoiceidError = document.querySelector('#smart-button-container #invoiceidError');
29+
var invoiceidDiv = document.querySelector('#smart-button-container #invoiceidDiv');
30+
31+
var elArr = [description, amount];
32+
33+
if (invoiceidDiv.firstChild.innerHTML.length > 1) {
34+
invoiceidDiv.style.display = "block";
35+
}
36+
37+
var purchase_units = [];
38+
purchase_units[0] = {};
39+
purchase_units[0].amount = {};
40+
41+
function validate(event) {
42+
return event.value.length > 0;
43+
}
44+
45+
paypal.Buttons({
46+
style: {
47+
color: 'gold',
48+
shape: 'pill',
49+
label: 'paypal',
50+
layout: 'vertical',
51+
52+
},
53+
54+
onInit: function (data, actions) {
55+
actions.disable();
56+
57+
if (invoiceidDiv.style.display === "block") {
58+
elArr.push(invoiceid);
59+
}
60+
61+
elArr.forEach(function (item) {
62+
item.addEventListener('keyup', function (event) {
63+
var result = elArr.every(validate);
64+
if (result) {
65+
actions.enable();
66+
} else {
67+
actions.disable();
68+
}
69+
});
70+
});
71+
},
72+
73+
onClick: function () {
74+
if (description.value.length < 1) {
75+
descriptionError.style.visibility = "visible";
76+
} else {
77+
descriptionError.style.visibility = "hidden";
78+
}
79+
80+
if (amount.value.length < 1) {
81+
priceError.style.visibility = "visible";
82+
} else {
83+
priceError.style.visibility = "hidden";
84+
}
85+
86+
if (invoiceid.value.length < 1 && invoiceidDiv.style.display === "block") {
87+
invoiceidError.style.visibility = "visible";
88+
} else {
89+
invoiceidError.style.visibility = "hidden";
90+
}
91+
92+
purchase_units[0].description = description.value;
93+
purchase_units[0].amount.value = amount.value;
94+
95+
if (invoiceid.value !== '') {
96+
purchase_units[0].invoice_id = invoiceid.value;
97+
}
98+
},
99+
100+
createOrder: function (data, actions) {
101+
return actions.order.create({
102+
purchase_units: purchase_units,
103+
});
104+
},
105+
106+
onApprove: function (data, actions) {
107+
return actions.order.capture().then(function (orderData) {
108+
109+
// Full available details
110+
console.log('Capture result', orderData, JSON.stringify(orderData, null, 2));
111+
112+
// Show a success message within this page, e.g.
113+
const element = document.getElementById('paypal-button-container');
114+
element.innerHTML = '';
115+
element.innerHTML = '<h3>Thank you for your payment!</h3>';
116+
117+
// Or go to another URL: actions.redirect('thank_you.html');
118+
119+
});
120+
},
121+
122+
onError: function (err) {
123+
console.log(err);
124+
}
125+
}).render('#paypal-button-container');
126+
}
127+
initPayPalButton();
128+
</script>
129+
</body>
130+
131+
</html>

0 commit comments

Comments
 (0)