import Vue from 'vue';
import { ready } from '@site/js/utils/dom.js';
import Overlay from '@site_scripts/mtc_overlay.js';

/**
 * Sidebar navigation Vue component + help-link overlay binding (vanilla).
 *
 * The component itself is plain Vue with no DOM library. The init
 * binds the vanilla Overlay class to any `.js_helpOverlay` link
 * rendered in the mini header.
 */

Vue.component('sidebar-navigation', {

    data() {
        return {
            pages: [],
            currentPage: 0,
            loading: false,
        };
    },

    created() {
        window.EventBus.$on('initSidebarNav', (pages, currentPage) => {
            this.pages = pages;
            this.currentPage = currentPage;
        });
        window.EventBus.$on('updateSidebarNav', (currentPage) => {
            this.currentPage = currentPage;
        });
    },

});

ready(() => {
    if (document.querySelector('.js_helpOverlay')) {
        Overlay.attach('.js_helpOverlay');
    }
});
