var form = null;
    var loader = null;
    var errorText = null;
    var successText = null;
    var txIdText = null;

    var publicApiKey = 'epk-2A9FEC83-8E09-46AE-820C-9D3CB2E0012E';
    var fieldStyles = 'height: 40px; line-height: 1; border: 1px solid #c4c4c4; border-radius: 5px; color: #000; padding: 10px;';

    // Insert eWay script
    var script = document.createElement('script');
    script.src = 'https://secure.ewaypayments.com/scripts/eWAY.min.js';
    script.async = false;
    script.defer = false;
    document.head.appendChild(script);

    // Insert custom eWay form styling
    var link = document.createElement('link');
    link.rel = 'stylesheet';
    link.type = 'text/css';
    link.href = "https://bigcommerce.abweb.com.au/css/eway.css";
    document.head.appendChild(link);

    var WaitForEway = new Promise(function (resolve, reject) {
        var period = 100, waited = 0, wait = setInterval(() => {
            if (typeof eWAY !== 'undefined') {
                resolve();
            }

            if (waited > 5000) {
                reject();
            }

            waited += period;
        }, period);
    });

    WaitForEway.then(() => {
        var nameFieldConfig = {
                publicApiKey: publicApiKey,
                fieldDivId: 'eway-secure-field-name',
                fieldType: 'name',
                styles: fieldStyles
            };
        var cardFieldConfig = {
                publicApiKey: publicApiKey,
                fieldDivId: 'eway-secure-field-card',
                fieldType: 'card',
                styles: fieldStyles
            };
        var expiryFieldConfig = {
                publicApiKey: publicApiKey,
                fieldDivId: 'eway-secure-field-expiry',
                fieldType: 'expiry',
                styles: fieldStyles
            };
        var cvnFieldConfig = {
                publicApiKey: publicApiKey,
                fieldDivId: 'eway-secure-field-cvn',
                fieldType: 'cvn',
                styles: fieldStyles
            };

        const XHR = new XMLHttpRequest();

        XHR.addEventListener('load', function(event) {
            setTimeout(function () {
                response = JSON.parse(event.target.responseText);

                var gateway = document.getElementById('payment-gateway');

                gateway.innerHTML = response['html'];

                eWAY.setupSecureField(nameFieldConfig, secureFieldCallback);
                eWAY.setupSecureField(cardFieldConfig, secureFieldCallback);
                eWAY.setupSecureField(expiryFieldConfig, secureFieldCallback);
                eWAY.setupSecureField(cvnFieldConfig, secureFieldCallback);

                form = document.getElementById('payment_form');
                loader = document.getElementById('payment-loader');
                errorText = document.getElementById('tx-msg-error');
                successText = document.getElementById('tx-msg-success');
                txIdText = document.getElementById('tx-msg-id');

                form.addEventListener('submit', function (event) {
                    event.preventDefault();

                    loader.style.display = 'block';
                    errorText.style.display = 'none'
                    successText.style.display = 'none'
                    txIdText.style.display = 'none'
                    sendData();
                } );
            }, 100);
        });

        XHR.open('GET', 'https://bigcommerce.abweb.com.au/hostedpayments/view/eway');

        XHR.send();

        function secureFieldCallback(event) {
            if (!event.fieldValid) {
                alert(event.errors);
            } else {
                var s = document.getElementById('securefieldcode');
                s.value = event.secureFieldCode
            }
        }

        function sendData() {
            const XHR = new XMLHttpRequest();

            const FD = new FormData(form);

            XHR.addEventListener('load', function(event) {
                response = JSON.parse(event.target.responseText);

                setTimeout(function() {
                    if (response['success'] == true) {
                        if (response['redirectUrl'].length) {
                            window.location.href = response['redirectUrl'] + '?tx=' + response['txId'];
                            successText.innerHTML = 'Payment successful. Please wait while we redirect you.';
                        }
                        else {
                            loader.style.display = 'none';
                            successText.style.display = 'block';
                            successText.innerHTML = response['resultMsg'];
                            txIdText.style.display = 'block';
                            txIdText.innerHTML = 'Transaction ID: <b>' + response['txId'] + '</b>';
                        }
                    }
                    else {
                        loader.style.display = 'none';
                        errorText.style.display = 'block';
                        errorText.innerHTML = response['resultMsg'];
                    }
                }, 200);
            });

            XHR.addEventListener('error', function(event) {
                setTimeout(function() {
                    loader.style.display = 'none';
                    errorText.style.display = 'block';
                    errorText.innerHTML = 'An error has occured while attempting to process the payment.';
                }, 200);
            });

            XHR.open('POST', 'https://bigcommerce.abweb.com.au/hostedpayments/submit/rfBi6ccIHQxLAx33OV3B7VrOmujDTa2q');

            XHR.send(FD);
        }
    }).catch(() => {
        document.querySelector('#payment-gateway').innerHTML = 'Failed to load payment form: eWay could not be loaded.';
    });