ayushya/watchparty
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

v1.7.0/finalize donations

Browse Source
This commit is contained in:
ayushya
2020-09-07 01:53:11 -04:00
parent bae5e156d9
commit e7d8519c11
3 changed files with 45 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
website/donate/index.html
+20 -5
View File
@@ -96,7 +96,9 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
}
</style>
<title>Watch Party | Donate</title>
<script src="https://www.paypal.com/sdk/js?client-id=AS8qXxrxPOe9yb0yyJwQY_fRkRuXB8AFgeSmCLtkU0_ag9OVYTB3VeNjGwtL34KJZ9EdRYwEC89wfYZE"></script>
<!-- AS8qXxrxPOe9yb0yyJwQY_fRkRuXB8AFgeSmCLtkU0_ag9OVYTB3VeNjGwtL34KJZ9EdRYwEC89wfYZE live -->
<script src="https://www.paypal.com/sdk/js?client-id=ASTxEXKWhaXzdXe4CG6wkest7Hmi_agjiPqHjY524USsslz9fnLul_wrG8tauvZ6PCAxIQEanDPvazkh&disable-funding=credit"></script>
<script>
/*
* G O O G L E
@@ -145,7 +147,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
shape: 'pill',
},
onInit: function(data, actions) {
document.querySelector('#paypal-donate').style.opacity= "0.4";
document.querySelector('#paypal-donate').style.opacity= "0.4";
actions.disable();
document.querySelector('#donate input').addEventListener('input', function (ev) {
validateAndUpdate(ev, actions);
@@ -153,6 +155,7 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
document.querySelector('#donate input').addEventListener('change', function (ev) {
validateAndUpdate(ev, actions, true);
});
document.querySelector('#paypal-donate').parentElement.style.display = "flex";
},
createOrder: function(data, actions) {
return actions.order.create({
@@ -165,7 +168,10 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
},
onApprove: function(data, actions) {
return actions.order.capture().then(function(details) {
alert('Transaction completed by ' + details.payer.name.given_name);
document.querySelector('.info.alert').querySelector('h1.sub-title').innerText += details.payer.name.given_name.toUpperCase() + "!";
document.querySelector('.info.alert').querySelector('p.body').innerHTML += `<br /> You donated (${details.purchase_units[0].amount.currency_code}) ${details.purchase_units[0].amount.value}.`;
document.querySelector('.info.alert').querySelector('a.underlink').setAttribute('href', `mailto:admin@chromewatchparty.com?subject=Question About Donation&body=DONATION DETAILS%0D%0A NAME: ${details.payer.name.given_name + " " + details.payer.name.surname}%0D%0A EMAIL: ${details.payer.email_address}%0D%0A DONATION: (${details.purchase_units[0].amount.currency_code}) ${details.purchase_units[0].amount.value}%0D%0A DATE: ${details.create_time}`);
document.querySelector('.info.alert').setAttribute('data-active', true);
});
},
})
@@ -254,14 +260,23 @@ COPIED, EDITED, OR REPRODUCED WITHOUT PERMISSION.
<h1 class="title" data-font="sans-bold">DONATE</h1>
</div>
</div>
<div class="info alert" data-if="success">
<div class="info-text">
<div>
<h1 class="sub-title" data-font="sans-bold">🎉 THANK YOU FOR YOUR DONATION, </h1>
<p class="body" data-font="sans">You helped keep Watch Party alive and free for everyone.</p>
<a target="_blank" class="underlink" href="mailto:admin@chromewatchparty.com?subject=Question About Donation" data-font="sans-bold">QUESTION ABOUT DONATION</a>
</div>
</div>
</div>
<div class="info">
<div class="info-text">
<div>
<h4 class="sub-title" data-font="sans-bold">AMOUNT <code>$(US)</code></h4>
<input step="0.5" type="number" data-font="sans-bold" value="1.00" min="1.00" required />
<input step="0.5" type="number" data-font="sans-bold" value="0.00" min="1.00" required />
<a style="display: block;" data-font="sans-bold" class="underlink">MINIMUM DONATION OF $1.00</a>
</div>
<div class="description">
<div style="display: none; flex-direction: column;" class="description">
<div id="paypal-donate"></div>
<a data-font="sans-bold" class="underlink">
WATCH PARTY DOES NOT HANDLE ANY OF YOUR BILLING INFORMATION
website/styles/extrasmall.css
+20
View File
@@ -160,6 +160,17 @@ a.big-button::after {
margin-bottom: 10rem;
}
.info.alert {
background-color: var(--color-secondary);
padding-bottom: 2.5rem;
padding-left: 10rem;
max-width: calc(100% - 12.5rem);
border-left: 2.5rem solid var(--color-bright);
padding-top: 2.5rem;
border-radius: 2.5rem;
display: none;
}
.info .info-card {
background-color: var(--color-dim);
border-radius: 2.5rem;
@@ -171,6 +182,10 @@ a.big-button::after {
align-items: center;
}
.info.alert[data-active=true] {
display: block;
}
.info .info-card {
color: var(--color-primary);
font-size: 15rem;
@@ -303,6 +318,11 @@ a.big-button::after {
#paypal-donate {
margin-top: 5rem;
display: flex;
flex: 1;
background-color: var(--color-dim);
padding: 2.5rem;
border-radius: 2.5rem;
margin-bottom: 2.5rem;
}
footer {
website/styles/large.css
+5
View File
@@ -29,6 +29,11 @@ body {
display: inline-table;
}
.info.alert {
padding-top: 0;
max-width: calc(100% - 12.5rem) !important;
}
.info:not(:last-of-type) {
margin-right: 6rem;
}