import THEMES from './conf'
import Constructor from './constructor'
const LABELS = [];
let theme = '';

import {
    createApp
} from 'vue'

import colorAnaly from "./colorAnaly";

const DIV = document.createElement('div');
DIV.className = 'vs-style--insert'
var BODY = document.body;
BODY.insertBefore(DIV, BODY.lastChild)

/**
 * 
 * @param {String} tem  主题信息,仅支持十六进制颜色值
 */

export function getTheme(tem = 'default') {
    theme = rColor(tem);
    colorAnaly(theme);
}

function rColor(tem) {
    if (tem.indexOf('#') !== -1) return tem;
    else return THEMES[tem]
}

/**
 * 
 * @param {String} label dom标签名 
 */
export function setStyle(label) {
    const item = label.replace('-', '').toUpperCase();
    if (isExist(item)) return;
    LABELS.push(item)
    const SPAN = document.createElement('span');
    SPAN.className = 'vs-style--insert--span'
    DIV.appendChild(SPAN);
    createApp(Constructor[item]).mount(SPAN);
}

/**
 * 判断是否存在该标签
 * @param {String} label  dom标签名 
 * @returns 
 */
function isExist(label) {
    return LABELS.some((item) => {
        return item === label
    })
}