function getScrollBarWidth() {
    var inner = document.createElement('p');
    inner.style.width = "100%";
    inner.style.height = "200px";

    var outer = document.createElement('div');
    outer.style.position = "absolute";
    outer.style.top = "0px";
    outer.style.left = "0px";
    outer.style.visibility = "hidden";
    outer.style.width = "200px";
    outer.style.height = "150px";
    outer.style.overflow = "hidden";
    outer.appendChild(inner);

    document.body.appendChild(outer);
    var w1 = inner.offsetWidth;
    outer.style.overflow = 'scroll';
    var w2 = inner.offsetWidth;
    if (w1 == w2) w2 = outer.clientWidth;

    document.body.removeChild(outer);

    return (w1 - w2);
};
// var screenHeight = 900;
// var	screenWidth = 1024;
var screenHeight = jQuery(window).height();
var screenWidth = jQuery(window).width() + getScrollBarWidth();
// Event handler ready
jQuery(document).on('ready', function () {
    // loadSiteplanXML();
});

// Event handlers for JetEngine Popup
jQuery(window).on('jet-popup/show-event/before-show', function (event, popupData) {
    console.log('JetEngine Popup fully opened!', popupData);
    loadSiteplanXML();
});
// Event when the popup starts to open
jQuery(document).on('elementor/popup/show', function (event, id, instance) {
    console.log('Popup opened! ID:', id);

    // Here is your code that should be executed when the popup is opened
    // For example:
    
    // If you need to check a specific popup by ID
    if (id === 204934 || id === 216211) {
		loadSiteplanXML();
    console.log(instance);

        // special logic for a specific popup
        // find video inside popup and play it if exist
        setTimeout(function () {
            var video = jQuery('.popup-video video')[0];
            console.log(video);
            if (video) {
                video.play();
                video.muted = false;
            }
        }, 1000);
    }
});

// Event when the popup is fully loaded
jQuery(document).on('jet-popup/render-content/ajax/success', function (event, popupData) {
    console.log('JetEngine Popup content loaded!', popupData);

    // Here is your code that should be executed when the content in the popup is fully loaded
    // Especially useful if you have dynamic content loaded via AJAX
});

// Event when the popup is fully opened (after animation)
jQuery(document).on('jet-popup/show-event/after', function (event, popupData) {
    console.log('JetEngine Popup fully opened!', popupData);

    // Here you can execute code when the popup is fully open (after animation)
    // At this point, it is guaranteed that the popup is visible and all elements in it are accessible.

    // Initialize the sitemap if it is a relevant popup
    initSitemapPopup(popupData);
});

// Popup close event
jQuery(document).on('jet-popup/close-event/before', function (event, popupData) {
    console.log('JetEngine Popup closing!', popupData);

    // Code to execute before closing the popup
});

/**
 * Initialization for a specific popup with a sitemap
 * @param {Object} popupData - popup data from JetEngine
 */
function initSitemapPopup(popupData) {
    // Checking if this is the popup we need (you can check by ID or class)
    // For example, if your popup has the class 'sitemap-popup'
    if (popupData && popupData.container && popupData.container.find('.sitemap-container').length) {
        console.log('Sitemap popup detected!');

        // Here we call the functions to initialize the sitemap
        // For example:
        // loadSiteplanXML();

        // Initializing sitemap elements
        initSitemapElements();
    }
}

/**
 * Initializing sitemap elements
 */
// function initSitemapElements() {
//     // Here is your code to initialize sitemap elements
//     console.log('Initializing sitemap elements');

//     // For example:
//     // jQuery('.sitemap-container a').on('click', function() {
//     //     // Processing clicks on sitemap elements
//     // });
// }

// jQuery(function ($) {
//     // Integration with Elementor
//     if (window.elementorFrontend) {
//         elementorFrontend.hooks.addAction('frontend/element_ready/global', function () {
//             console.log('Elementor frontend ready');
//         });
//     }
// });