<script>
    $(document).ready(function() {
        function createAndShowModal(url, image_url, content, button_text) {
            const modalHtml = `
                <div id="popup" class="modal" tabindex="-1" role="dialog" align="center">
                    <div class="modal-dialog modal-dialog-centered" role="document">
                        <div class="modal-content">
                            <div class="modal-body" align="left" style="padding: 0px;">
                                ${image_url ? `<img src="${image_url}" class="img-fluid" loading="eager" style="border-radius: 5px 5px 0px 0px;">` : ''}
                                ${content ? `<div class="popup-text" style="padding: 15px 10px; font-weight: 400; font-size: 16px; color: var(--primary-font-color);">${content}</div>` : ''}
                                ${url ? `<a class="btn theme-btn" style="margin: 0px 10px 45px 10px" href="${url}">${button_text}</a>` : ''}
                            </div>
                            <div>
                                <button type="button" class="" style="padding: 8px 20px; width: 40%; border-radius: 40px; background: var(--theme-color); color: #ffffff; position: absolute; bottom: -15px; right: 30%;" data-bs-dismiss="modal" aria-label="Close">✗ CLOSE</button>
                            </div>
                        </div>
                    </div>
                </div>
            `;
            const modal = $(modalHtml);
            $('body').append(modal);
            modal.modal('show');
        }

        function fetchPopups() {
            const popupRoute = '<?php echo e(route('popup')); ?>';

            fetch(popupRoute)
                .then(response => {
                    if (!response.ok) {
                        throw new Error(`Error fetching popups from ${popupRoute}: ${response.statusText}`);
                    }
                    return response.json();
                })
                .then(data => {
                    const popups = data.popups;
                    popups.forEach(popup => {
                        createAndShowModal(popup.url, popup.image_url, popup.content, popup
                            .button_text);
                    });
                })
                .catch(error => {
                    console.error('Error fetching popups:', error.message);
                });
        }

        fetchPopups();
      
    });
</script><?php /**PATH /home/jrsmulti/autouidtopup.com/core/resources/views/scripts/popup.blade.php ENDPATH**/ ?>