https://bggc.co.uk/wp-content/plugins/wp-express-checkout/assets/js/wpec-stripe.js?ver=2.5.4

1/* global ppecFrontVars, wpec_stripe_frontend_vars */
2
3class WPECStripeHandler {
4
5    constructor(btnData, wpecHandler) {
6        this.btnData = btnData;
7        this.wpecHandler = wpecHandler;
8        this.ajaxUrl = ppecFrontVars.ajaxUrl;
9        this.buttonId = btnData.id;
10
11        document.dispatchEvent(
12            new CustomEvent('wpec_before_render_stripe_button', {
13                detail: {
14                    handler: this,
15                }
16            })
17        );
18
19        this.render();
20    }
21
22    render() {
23        const checkoutBtnCont = document.getElementById(this.buttonId);
24
25        if (!checkoutBtnCont){
26            console.log("Unable to render stripe checkout button.");
27            return;
28        }
29
30        const checkoutBtn = document.createElement('button');
31
32        const btnWidth = this.btnData?.btnStyle?.width ? this.btnData.btnStyle.width + 'px' : '150px';
33        const btnText = this.btnData?.btnStyle?.label ? this.btnData.btnStyle.label : 'Stripe Checkout';
34        const btnClasses = this.btnData?.btn_classes ? this.btnData.btn_classes : [];
35
36        checkoutBtn.style.width = btnWidth;
37        checkoutBtn.innerText = btnText;
38        checkoutBtn.classList.add(...btnClasses);
39
40        checkoutBtn.addEventListener('click', this.onStripeCheckout);
41
42        checkoutBtnCont.appendChild(checkoutBtn);
43    }
44
45    onStripeCheckout = async (e) => {
46        e.preventDefault();
47
48        this.wpecHandler.calcTotal();
49
50        this.wpecHandler.displayErrors();
51        // Get first error input if there is any.
52        if (this.hasInputErrors()) {
53            return;
54        }
55
56        // console.log(this.wpecHandler.data)
57
58        e.target.disabled = true;
59
60        const order_data = {
61            total: this.wpecHandler.data.total,
62            quantity: this.wpecHandler.data.quantity,
63            currency_code: this.wpecHandler.data.currency,
64        };
65
66        const payload = {
67            action: 'wpec_stripe_create_checkout_session',
68            wpec_data: JSON.stringify(this.wpecHandler.data),
69            data: JSON.stringify(order_data),
70            nonce: wpec_stripe_frontend_vars?.nonce,
71        };
72
73        document.dispatchEvent(new CustomEvent('wpec_process_stripe_checkout', {
74            detail: {
75                handler: this,
76                paymentData: payload,
77            }
78        }));
79
80        try {
81            let response = await fetch(this.ajaxUrl, {
82                method: 'POST',
83                headers: {
84                    'Content-Type': 'application/x-www-form-urlencoded',
85                },
86                body: new URLSearchParams(payload),
87            });
88
89            if (!response.ok) {
90                alert('Stripe Checkout Error!');
91                console.log(response);
92                return;
93            }
94
95            response = await response.json();
96
97            // console.log(response);
98
99            if (!response.success) {
100                alert(response.data.message);
101                e.target.disabled = false;
102            }
103
104            // Redirect to process checkout session.
105            if (typeof response.data.redirect_url !== 'undefined') {
106                window.location.href = response.data.redirect_url;
107            }
108
109        } catch (error) {
110            alert("HTTP error occurred during AJAX request. Error code: " + e.status);
111            console.log(error.message);
112
113            e.target.disabled = false;
114        }
115    }
116
117    hasInputErrors() {
118        // const errInput = this.wpecHandler.getScCont().querySelector('.hasError');
119
120        const allErrorInputs = [...this.wpecHandler.getScCont().querySelectorAll('.hasError')];
121        const errInputs = allErrorInputs.filter(el => !el.closest('.wpec-manual-checkout-form')); // No need to validate mc form inputs.
122
123        const errInput = errInputs.length ? errInputs[0] : null;
124
125        if (errInput) {
126            errInput.focus();
127            errInput.dispatchEvent(new Event('change'));
128
129            return true;
130        }
131
132        return false;
133    }
134}