var SplitItModal;
SplitItModal = {
    init: function () {
        this.messageSelector = ".splitit-message";
        this.modalSelector = ".splitit-modal";
        this.isSuccess();
        this.bindEvents();
    },
    bindEvents: function () {
        this.closeButtonClickEventHandler();
    },
    closeButtonClickEventHandler: function () {
        var me = this;

        document.querySelector('body').addEventListener('click', function(e) {
           if (e.target.classList.contains("splitit-close-button")) {
               me.removeModal();
           }
        });
    },
    removeModal: function () {
        document.querySelector(this.modalSelector).remove();
    },
    isSuccess: function () {
        var url_string = window.location.href;
        var url = new URL(url_string);
        var splititSuccess = url.searchParams.get("splitit");
        this.splititOrderId = url.searchParams.get("orderId");

        if (splititSuccess == 'success') {
            this.appendModal();
        }
    },
    appendModal: function () {
        var body = document.querySelector("body");
        var modal = document.createElement('div');
        var content = document.createElement('div');
        var close = document.createElement('span');
        var thanks = document.createElement('h2');
        var text1 = document.createElement('p');
        var text2 = document.createElement('p');

        modal.className = 'splitit-modal';
        modal.style.cssText = 'z-index: 9999;position: fixed;left: 0;top: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);opacity: 1;visibility: visible;transform: scale(1.0);transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s;';

        content.className = 'splitit-modal-content';
        content.style.cssText = 'position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);background-color: white;padding: 1rem 1.5rem;width: 24rem;border-radius: 0.5rem;';

        close.className = 'splitit-close-button';
        close.style.cssText = 'float: right;width: 1.5rem;line-height: 1.5rem;text-align: center;cursor: pointer;border-radius: 0.25rem;background-color: lightgray;';
        close.textContent = 'X';

        thanks.textContent = 'Thank you!';

        text1.textContent = 'Your order number is ' + this.splititOrderId;

        text2.textContent = 'An email will be sent containing information about your purchase.';

        content.appendChild(close);
        content.appendChild(thanks);
        content.appendChild(text1);
        content.appendChild(text2);
        modal.appendChild(content);
        body.appendChild(modal);
    }
}
document.addEventListener("DOMContentLoaded", function(event) {
    SplitItModal.init();
});