<reponame>yusuke-west/line_app<filename>front/plugins/processing.js<gh_stars>0/**
 * 処理中画面表示プラグイン
 *
 * @return {Object} 
 */
const VueProcessing = () => {
    const _id = "_id_loading_component";
    const _default = 0;
    const _svg = "se2xy1bknelxn4y8xzxu3trosptip3q5";

    const _loadingHtml = (type, message) => {
        let div = "";
        message = (typeof(message)=="undefined") ? "" : message;

        switch (type) {
        case 0:
            div = `
                <div id='${_id}' class='loader-wrap'>
                    <div class="loader">
                        <div class="inner one"></div>
                        <div class="inner two"></div>
                        <div class="inner three"></div>
                    </div>
                    <div class="loader-message"'>${message}</div>
                </div>`;
                break;
        case 1:
            div = `
                <div id='${_id}' class='loader-wrap'>
                    <div class='loader-image' style='position:absolute; margin:auto; left:0; top:0; right:0; bottom:0; width:80px; height:80px;'>
                        <img src='data:image/svg+xml;base64,${_svg}' style='width:80px; height=auto;' alt='${message}' />
                    </div>
                    <div class="loader-message"'>${message}</div>
                </div>`;
            break;
        }
    
        return div;
    }

    
    return {
        show(type, message) {
            type = (typeof(type)=="undefined") ? _default : type;
            let div = _loadingHtml(type, message);
            let element = document.createElement("div");
            element.innerHTML = div;
            document.body.appendChild(element);
            let elements = document.getElementsByClassName("loader-wrap");
            for (let element of elements) {
                element.style.display = "block";
            }
        },
        hide() {
            try { document.getElementById(_id).remove(); } catch (ex) {}
        }
    }
}

export default ({}, inject) => {
    inject("processing", VueProcessing());
}
