window.addEventListener("load", (event) => {
    initDepoOver()
    console.log('Script loaded from Window Event Listener');
})
initDepoOver()
function initDepoOver() {
    let currentScript = null;
    const scripts = document.getElementsByTagName('script');
    for (let i = 0; i < scripts.length; i++) {
        if (scripts[i].getAttribute('data-min-value')) {
            currentScript = scripts[i];
            break;
        }
    }
    if (window.location.href.indexOf("deposit") !== -1 && window.location.pathname.includes("BANK")) {
        if (currentScript) {
            const depoMin = currentScript.dataset.minValue
            depoAdjustment(Number(depoMin))
        } else {
            depoAdjustment(50)
        }
        const detectChanges = document.querySelector('#available_payment_accounts_popup')
        detectChanges.addEventListener('click', () => {
            if (currentScript) {
                const depoMin = currentScript.dataset.minValue
                depoAdjustment(Number(depoMin))
            } else {
                depoAdjustment(50)
            }
        })
    }
    if (window.location.href.indexOf("deposit") !== -1 && window.location.pathname.includes("QR")) {
        const depoAmt = new URLSearchParams(window.location.search).get('amt')
        if (depoAmt) {
            depoQR(depoAmt)
        }
    }
}
function depoAdjustment(value) {
    const depoLabel = $('#deposit_amount_range_label')
    if (depoLabel.length > 0) {
        depoLabel.html('Min: ' + value + ',000.00 | Max: 100,000,000.00<br>* Nominal di bawah ' + value + ',000 dapat menggunakan metode QRIS');
    }
    const depoSubmit = document.querySelector('input[type="submit"]')
    const depoContainer = document.getElementsByClassName('deposit-container')
    const depoForm = document.getElementById('deposit_form')

    const errorModal = document.createElement('div')
    // Based Modal
    errorModal.id = 'errorModal'
    errorModal.className = 'modal fade'
    // Modal Dialog
    const modalDialog = document.createElement('div')
    modalDialog.className = 'modal-dialog modal-md'
    // Modal Content
    const modalContent = document.createElement('div')
    modalContent.className = 'modal-content'
    modalContent.style.border = 'none'
    modalContent.style.backgroundColor = '#161616'
    modalContent.style.fontSize = '14px'
    // Modal Header
    const modalHeader = document.createElement('div')
    modalHeader.className = 'modal-header'
    modalHeader.style.borderBottom = '1px solid #242424'
    modalHeader.style.background = 'transparent'
    const modalClose = document.createElement('button')
    modalClose.className = 'close'
    modalClose.setAttribute('data-dismiss', 'modal')
    modalClose.setAttribute('aria-label', 'Close')
    // Modal Body
    const modalBody = document.createElement('div')
    modalBody.className = 'modal-body'
    modalBody.style.textAlign = 'center'
    modalBody.style.backgroundColor = 'transparent'
    modalBody.style.color = '#bbb'
    const modalCloseSpan = document.createElement('span')
    modalCloseSpan.setAttribute('aria-hidden', 'true')
    modalCloseSpan.textContent = 'x'
    const errorModalIcon = document.createElement('div')
    errorModalIcon.className = 'modal-icon'
    errorModalIcon.style.display = 'flex'
    errorModalIcon.style.alignItems = 'center'
    errorModalIcon.style.justifyContent = 'center'
    const errorModalIconItem = document.createElement('span')
    errorModalIconItem.textContent = '!'
    errorModalIconItem.style.color = '#FF0000'
    errorModalIconItem.style.width = '30px'
    errorModalIconItem.style.display = 'flex'
    errorModalIconItem.style.height = '30px'
    errorModalIconItem.style.alignItems = 'center'
    errorModalIconItem.style.justifyContent = 'center'
    errorModalIconItem.style.background = 'linear-gradient(to left, yellow, orange)'
    errorModalIconItem.style.borderRadius = '100%'
    errorModalIconItem.style.fontSize = '20px'
    errorModalIconItem.style.color = 'black'
    errorModalIcon.appendChild(errorModalIconItem)
    const errorModalTitle = document.createElement('h5')
    errorModalTitle.style.color = 'white'
    errorModalTitle.style.fontSize = '20px'
    errorModalTitle.style.fontWeight = '700'
    errorModalTitle.style.margin = '15px 0'
    const errorModalDesc = document.createElement('p')
    const errorModalRedirect = document.createElement('a')
    errorModalRedirect.style.display = 'inline-block'
    errorModalRedirect.style.border = '1px solid #505050'
    errorModalRedirect.style.padding = '8px 20px'
    errorModalRedirect.style.marginTop = '20px'
    errorModalRedirect.style.borderRadius = '10px'
    errorModalRedirect.style.color = '#ffd30e'
    errorModalRedirect.style.letterSpacing = '1px'
    errorModalRedirect.style.lineHeight = '1'
    errorModalTitle.innerHTML = 'Deposit Bank Transfer<br>Minimum Rp.' + value + ',000.00'
    errorModalRedirect.textContent = 'DEPO KILAT DENGAN QRIS'


    depoSubmit.addEventListener('click', (event) => {
        event.preventDefault()
        const depoInput = Number(document.querySelector('#Amount').value)
        const isDepoContainer = $('.alert-danger')
        const errorContainer = document.createElement('div')
        errorContainer.className = 'form-group error-msg'
        const errorMsg = document.createElement('div')
        errorMsg.className = 'alert-danger'


        const valueThousand = Number(value) * 1000
        if (depoInput === 0) {
            depoForm.requestSubmit()
        } else if (depoInput > 0 && depoInput < valueThousand) {
            if (isDepoContainer.length > 0) {
                isDepoContainer.text('Untuk transaksi dengan nominal di bawah ' + value + ',000 mohon gunakan metode QRIS agar dapat diproses lebih cepat')
            } else {
                errorMsg.textContent = 'Untuk transaksi dengan nominal di bawah ' + value + ',000 mohon gunakan metode QRIS agar dapat diproses lebih cepat'
                errorContainer.appendChild(errorMsg)
                depoContainer[0].prepend(errorContainer)
            }
            window.scrollTo({
                top: 0,
                left: 0, // Optional: Scrolls to the far left as well
                behavior: 'smooth'
            });
            errorModalDesc.textContent = 'Untuk deposit Rp. ' + depoInput / 1000 + ',000.00, silahkan gunakan QRIS.'
            errorModalRedirect.href = window.location.pathname.replace("BANK", "QR") + '?amt=' + depoInput / 1000
            // Append Modal
            modalClose.appendChild(modalCloseSpan)
            modalHeader.appendChild(modalClose)
            modalContent.appendChild(modalHeader)
            modalContent.appendChild(modalBody)
            modalDialog.appendChild(modalContent)
            errorModal.appendChild(modalDialog)
            modalBody.appendChild(errorModalIcon)
            modalBody.appendChild(errorModalTitle)
            modalBody.appendChild(errorModalDesc)
            modalBody.appendChild(errorModalRedirect)
            errorModal.appendChild(modalDialog)
            document.body.appendChild(errorModal)
            $('#errorModal').modal('show')
        } else {
            isDepoContainer.remove()
            depoForm.requestSubmit()
        }
    })
}
function depoQR(value) {
    const depoInput = document.querySelector('#Amount')
    const depoDisplay = document.querySelector('.deposit_amount_display')
    depoInput.value = Number(value) * 1000
    depoDisplay.value = value
    $('.deposit_amount_display').keyup()
    var clean_uri = location.protocol + "//" + location.host + location.pathname;
    window.history.replaceState({}, document.title, clean_uri);
}