import '%/app.less';
import App from './index.vue';
import appJson from '%/app.json';

window.__smallAppFE = {
    APPID: APPID,
    COVERVIEWDATA: {}
}

Vue.mixin({
    beforeCreate () {
        SmallApp && SmallApp.register(this);
    },
    beforeDestroy () {
        if (!SmallApp.version) {return;}
        delete SmallApp.components[this._bili_id ||  this._uid];
    }
});

const defaultRemRatio = 20;

if (appJson.setRem) {
    const remRatio = normalizeRemRatio(appJson.setRem);

    setRem(remRatio);
    window.onresize = function () {
        setRem(remRatio);
    };
}

// 设置 rem 函数
function setRem (remRatio = defaultRemRatio) {
    let htmlWidth = document.documentElement.clientWidth || document.body.clientWidth;

    if (htmlWidth === 0) {
        setTimeout(() => {
            setRem(remRatio);
        }, 50);
        return;
    }

    let htmlDom = document.getElementsByTagName('html')[0];
    htmlDom.style.fontSize = htmlWidth / remRatio + 'px';
}


function normalizeRemRatio (remRatio) {
    if (typeof remRatio === 'boolean') {
        return defaultRemRatio;
    }

    if (Number.isNaN(+remRatio) || remRatio <= 0) {
        return defaultRemRatio;
    }

    return remRatio;
}

window.app = new Vue({
    el: '#app',
    render(h) {
        return h('app');
    },
    components: {
        App
    }
});

if (typeof SmallApp !== 'undefined' && typeof SmallApp.postMessage === 'function') {
    SmallApp.postMessage({type: 'render-loaded'});
}
