declare let ResizeObserver;
declare let StickySidebar;

$(document).ready(function () {
    const reportsServiceName = '/reports/';
    const blazorTimeoutInMilliseconds = 1500;

    StickSidebarInitializer.initAllTimeout();

    if ((window as any).location.href.includes(reportsServiceName)) {
        // для блазора
        window.setTimeout(() => StickSidebarInitializer.init(), blazorTimeoutInMilliseconds);
    }
});

class StickSidebarInitializer {

    static readonly _sideMenuSelector = ".side-menu";
    static readonly _menuContentCssClassName = "content";

    static _stickyBar: any = undefined;

    public static initAllTimeout = (): void => {
        let existsUserSideMenuContainer = document.querySelectorAll('.side-menu .user-nav')[0];
        if (existsUserSideMenuContainer) {
            window.setTimeout(() => StickSidebarInitializer.init());
        }

        let existsSideMenuNewContainer = document.querySelectorAll('.side-menu .side-menu-nav')[0];
        if (existsSideMenuNewContainer) {
            window.setTimeout(() => StickSidebarInitializer.init());
        }

        let existsSideMenuContainer = document.querySelectorAll('.side-menu .side-menu__sections')[0];
        if (existsSideMenuContainer) {
            window.setTimeout(() => StickSidebarInitializer.init());
        }

        let chatSideMenuContainer = document.querySelectorAll('.user-nav')[0];
        if (chatSideMenuContainer) {
            window.setTimeout(() => StickSidebarInitializer.init(".user-nav"));
        }

        const resizeObserver = new ResizeObserver((entries: any) => {
            if (StickSidebarInitializer._stickyBar) {
                StickSidebarInitializer._stickyBar.updateSticky();
            }
        });

        const menuElem = document.getElementsByClassName(StickSidebarInitializer._menuContentCssClassName)[0];
        if (!menuElem) {
            return;
        }
        resizeObserver.observe(menuElem);
    }

    public static init(selector: any = null) {
        let menuSelector = !selector ? StickSidebarInitializer._sideMenuSelector : selector;
        let options: any = {
            topSpacing: 8,
            bottomSpacing: 8
        };

        if (!selector) {
            options.containerSelector = '.side-menu';
            options.innerWrapperSelector = '.side-menu__sections';
        }
        
        // Проверка наличия контейнера для стикбара
        const menu = document.querySelectorAll(menuSelector)[0];
        if (!menu) {
            return;
        }
        
        StickSidebarInitializer._stickyBar = new StickySidebar(menuSelector, options);

        const menuItems = (Array as any).from(menu.getElementsByTagName('*'));
        if (!menuItems?.length) {
            return;
        }

        const resizeObserver = new ResizeObserver(entries => {
            if (StickSidebarInitializer._stickyBar) {
                StickSidebarInitializer._stickyBar.updateSticky();
            }
        });
        menuItems.map(x => {
            resizeObserver.observe(x);
        });
    }
}