(function () {
    if (!Element.prototype.matches) {
        Element.prototype.matches = Element.prototype.msMatchesSelector || Element.prototype.webkitMatchesSelector;
    }
    
    if (!Element.prototype.closest) {
        Element.prototype.closest = function(s) {
            var el = this;
        
            do {
                if (el.matches(s)) return el;
                el = el.parentElement || el.parentNode;
            } while (el !== null && el.nodeType === 1);
            return null;
        };
    }

    window.onload = function () {
        var isMenuOpen = false;
        var isMyProfileOpen = false;

        var isLoginFormTogglerOpen = false;
        if (document.querySelector('.login-phone-container')) {
            isLoginFormTogglerOpen = !document.querySelector('.login-phone-container').classList.contains('is-hidden');
        }

        var menu = document.querySelector('.menu');
        var btnMenu = document.querySelector('.menu-btn');
        var myProfile = document.querySelector('.my-profile');
        var myProfileSource = document.querySelector('.my-profile-source');
        var btnMyProfile = document.querySelector('.menu-item-btn.profile');
        var btnMyProfileClose = document.querySelector('.my-profile-btn-close');
        var loginTogglerLink = document.querySelector('.login-toggler-link');
        var loginPhoneContainer = document.querySelector('.login-phone-container');
        var firstTimeLoginCookieName = "WasLoggedInBefore";

        function getCookie(cookieName) {
            let cookie = {};
            document.cookie.split(';').forEach(function (el) {
                let [key, value] = el.split('=');
                cookie[key.trim()] = value;
            })
            return cookie[cookieName];
        }

        function setCookie(name, value, exdays) {
            const d = new Date();
            d.setTime(d.getTime() + (exdays * 24 * 60 * 60 * 1000));
            let expires = "expires=" + d.toUTCString();
            document.cookie = name + "=" + value + ";" + expires + ";path=/";
        }

        function handleToggleMenu() {
            if (isMenuOpen) {
                btnMenu.classList.remove('active');
                menu.classList.remove('shown');
                myProfile.classList.remove('shown');
                isMyProfileOpen = false;
            } else {
                btnMenu.classList.add('active');
                menu.classList.add('shown');
            }
            isMenuOpen = !isMenuOpen;
        }

        function handleToggleMyProfile() {
            if (isMyProfileOpen) {
                btnMyProfile.classList.remove('active');
                myProfile.classList.remove('shown');
            } else {
                btnMyProfile.classList.add('active');
                myProfile.classList.add('shown');
            }
            isMyProfileOpen = !isMyProfileOpen;
        }

        function handleCloseMenu() {
            btnMenu.classList.remove('active');
            menu.classList.remove('shown');
            isMenuOpen = false;
        }

        function handleOpenMyProfile() {
            if (btnMyProfile) {
                btnMyProfile.classList.add('active');
            }
            if (myProfile) {
                myProfile.classList.add('shown');
            }
            isMyProfileOpen = true;
        }

        function handleCloseMyProfile() {
            btnMyProfile.classList.remove('active');
            myProfile.classList.remove('shown');
            isMyProfileOpen = false;
        }

        function handleToggleOtherLoginOptions() {
            if (isLoginFormTogglerOpen) {
                loginPhoneContainer.classList.add('is-hidden');
                isLoginFormTogglerOpen = false;
            } else {
                loginPhoneContainer.classList.remove('is-hidden');
                isLoginFormTogglerOpen = true;
            }
        }

        if (menu) {
            menu.onmousedown = function () {
                if (!event.target.closest('.menu-items')) {
                    handleCloseMyProfile();
                    handleCloseMenu();
                }
            };
        }

        if (myProfile) {
            myProfile.onmousedown = function () {
                if (!event.target.closest('.my-profile-inner') && event.target !== '.my-profile-inner') {
                    handleCloseMyProfile();
                    handleCloseMenu();
                }
            };
        }

        if (btnMenu) {
            btnMenu.onclick = function () {
                handleToggleMenu();
            };
        }

        if (btnMyProfile) {
            btnMyProfile.onclick = function () {
                handleToggleMyProfile();
            };
        }

        if (btnMyProfileClose) {
            btnMyProfileClose.onclick = function () {
                handleCloseMenu();
                handleCloseMyProfile();
            };
        }

        if (loginTogglerLink) {
            loginTogglerLink.onclick = function () {
                handleToggleOtherLoginOptions();
            };
        }

        if (getCookie(firstTimeLoginCookieName) !== 'true') {
            handleOpenMyProfile();
            myProfileSource?.setAttribute("data-source", "TheFirstEnter");
            setCookie(firstTimeLoginCookieName, true, 3000);
        }

        document.addEventListener('keyup', function (event) {
            if ((isMenuOpen || isMyProfileOpen) && event.keyCode === 27) {
                handleCloseMenu();
                handleCloseMyProfile();
                btnMenu.focus();
            }
        });
    };
})();