import Vue from 'vue';
import {
    ROUTE_CHANGE
} from 'store/yoho/types';
import FastClick from 'fastclick';
import {createApp} from './app';
import {createApi} from 'create-api';
import {createYoRouter} from 'common/router.js';
import yoho from '../public/js/yoho';
import message from 'components/message';
import 'statics/scss/common.scss';
import 'statics/scss/animation.scss';
import 'statics/font/iconfont.css';
import 'statics/scss/font.scss';

FastClick.attach(document.body);


const {app, router, store} = createApp();

if (window.__INITIAL_STATE__) {
    store.replaceState(window.__INITIAL_STATE__);
}
Vue.prop('yoho', yoho);
Vue.prop('message', message);
Vue.prop('bus', new Vue());
Vue.prop('api', createApi());
Vue.prop('yoRouter', createYoRouter(router, store));

router.onReady(() => {
    router.beforeResolve((to, from, next) => {
        const matched = router.getMatchedComponents(to);

        store.commit(ROUTE_CHANGE, to);

        Promise.all(matched.map(({asyncData}) =>
            asyncData && asyncData({store, router: to})))
            .then(next)
            .catch(next);
    });
    app.$mount('#app');
});