Commit 744c966f authored by Aral Balkan's avatar Aral Balkan

Add confirmation dialogue for cancel command

parent 0c443342
/* Fix buttons so they appear centered. */
.swal2-actions {
text-align: center;
}
\ No newline at end of file
......@@ -11,6 +11,8 @@
background-color: white;
font-family: sans-serif;
}
${styles}
</style>
</head>
<body>
......@@ -64,6 +66,7 @@
const subscriptionId = '${subscriptionId}'
const currentAmount = ${patronageAmount}
${sweetAlert2}
${clientSideJavaScript}
</script>
......
window.addEventListener('load', _ => {
$ = document.querySelector.bind(document)
const SweetAlert2 = Swal
const socket = new WebSocket(`wss://${window.location.hostname}/patron`)
......@@ -18,29 +19,50 @@ window.addEventListener('load', _ => {
// Interface
//
$('#update').addEventListener('submit', event => {
event.preventDefault()
socket.send(JSON.stringify({
action: 'update',
subscriptionId,
amount: $('#patronageAmount').value
}))
})
$('#pause').addEventListener('submit', event => {
event.preventDefault()
socket.send(JSON.stringify({
action: 'pause',
subscriptionId
}))
})
$('#cancel').addEventListener('submit', event => {
event.preventDefault()
socket.send(JSON.stringify({
action: 'cancel',
subscriptionId
}))
})
function confirmCancellation () {
// return window.confirm('Are you sure you want to cancel your patronage?')
return SweetAlert2.fire({
title: 'Are you sure you want to cancel your patronage?',
text: "",
type: 'warning',
showCancelButton: true,
confirmButtonColor: '#3085d6',
cancelButtonColor: '#d33',
confirmButtonText: 'Yes',
cancelButtonText: 'No'
})
}
function handleCommand (commandName) {
$(`#${commandName}`).addEventListener('submit', async event => {
event.preventDefault()
const command = {
action: commandName,
subscriptionId,
}
if (commandName === 'update') command.amount = $('#patronageAmount').value
let confirm = false
if (commandName === 'cancel') confirm = await confirmCancellation()
console.log('confirm', confirm)
if (!confirm.value) return
socket.send(JSON.stringify(command))
// Swal.fire(
// 'Patronage canceled',
// 'Thank you for supporting us. If you have any feedback, please contact hello@small-tech.org.',
// 'success'
// )
})
}
handleCommand('update')
handleCommand('pause')
handleCommand('cancel')
})
This diff is collapsed.
......@@ -6,6 +6,8 @@ stripe.setTelemetryEnabled(false)
const htmlTemplate = fs.readFileSync('.dynamic/client/patron.html')
const clientSideJavaScript = fs.readFileSync('.dynamic/client/patron.js')
const sweetAlert2 = fs.readFileSync('.dynamic/client/sweetalert2.min.js')
const styles = fs.readFileSync('.dynamic/client/patron.css')
// Converts a Stripe (Unix) timestamp string to a JavaScript date object.
// (JS expects the timestamp in miliseconds so we pad three decimal places).
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment