import moment from 'moment'
import Vue from 'vue';
import vSelect from 'vue-select';
import InfiniteLoading from 'vue-infinite-loading';
import VueClipboards from 'vue-clipboards';
import Dialog from 'vue-dialog-loading';
import store from './vue-store';

moment.locale('fr');
Vue.component('v-select', vSelect);

window.Vue = Vue;
Vue.prototype.moment = moment
Vue.prototype.$window = window
Vue.prototype.$displayStatus = 'Grid'

Vue.use(InfiniteLoading);
Vue.use(VueClipboards);
Vue.use(Dialog, {
    dialogBtnColor: '#0f0'
});

Vue.filter('str_limit', function (value, size) {
    if (!value) return '';
    value = value.toString();

    if (value.length <= size) {
        return value;
    }
    return value.substr(0, size) + '...';
});


// Register modules
const modules = require.context("./modules", true, /\.js$/i);
modules.keys().map(key => {
    Vue.mixin(modules(key).default)
});

document.addEventListener('DOMContentLoaded', () => {
    // Register components
    const vues = require.context("./components", true, /\.vue$/i)
    vues.keys().map(key => {
        let htmlKey = key.split('/')
            .pop()
            .split('.')[0]
            .replace(/\.?([A-Z])/g, function (x, y) {
                return '-' + y.toLowerCase();
            })
            .replace(/^-/, '')
            .replace('-component', '')

        let el = document.getElementById(htmlKey),
            elGroup = document.getElementsByClassName(htmlKey)
        if (el) {
            new Vue({
                store,
                el: el,
                json: el.dataset.json ?? {},
                // * For runtime vuejs
                render: createElement => createElement(vues(key).default)
            })
        }
        for (let grpEl of elGroup) {
            // * Hack to prevent loop weirdness
            setTimeout(() => {
                new Vue({
                    store,
                    el: grpEl,
                    json: grpEl.dataset.json,
                    // * For runtime vuejs
                    render: createElement => createElement(vues(key).default)
                })
            }, 1000)
        }
    })
})