ZhongMianAdmin/__test__/bim/js/ui/Dialog.js

/**
 * Dialog.js
 *
 * @author realor
 */

import { Controls } from './Controls.js'
import { I18N } from '../i18n/I18N.js'

class Dialog {
    constructor(title) {
        this.title = title
        this.i18n = null

        this.curtainElem = document.createElement('div')
        this.curtainElem.className = 'dialog_curtain'

        this.dialogElem = document.createElement('div')
        this.dialogElem.className = 'dialog'

        this.headerElem = document.createElement('div')
        I18N.set(this.headerElem, 'innerHTML', title)
        this.headerElem.className = 'header'
        this.dialogElem.appendChild(this.headerElem)

        this.bodyElem = document.createElement('div')
        this.bodyElem.className = 'body'
        this.dialogElem.appendChild(this.bodyElem)

        this.footerElem = document.createElement('div')
        this.footerElem.className = 'footer'
        this.dialogElem.appendChild(this.footerElem)

        this.setSize(300, 200)
    }

    setSize(width, height) {
        this.dialogElem.style.width = width + 'px'
        this.dialogElem.style.height = height + 'px'
        return this
    }

    setI18N(i18n) {
        this.i18n = i18n
        return this
    }

    setClassName(className) {
        this.bodyElem.classList.add(className)
        return this
    }

    show(parentNode) {
        if (!this.dialogElem.parentNode) {
            if (this.i18n) {
                this.i18n.updateTree(this.dialogElem)
            }
            parentNode = parentNode || document.body
            parentNode.appendChild(this.curtainElem)
            parentNode.appendChild(this.dialogElem)
            if (this.onShow) this.onShow()
        }
        return this
    }

    hide() {
        const parentNode = this.dialogElem.parentNode
        if (parentNode) {
            parentNode.removeChild(this.dialogElem)
            parentNode.removeChild(this.curtainElem)
            if (this.onHide) this.onHide()
        }
        return this
    }

    addText(text, className) {
        return Controls.addText(this.bodyElem, text, className)
    }

    addTextWithArgs(text, args, className) {
        return Controls.addTextWithArgs(this.bodyElem, text, args, className)
    }

    addCode(text, className) {
        return Controls.addCode(this.bodyElem, text, className)
    }

    addTextField(name, label, value, className) {
        return Controls.addTextField(this.bodyElem, name, label, value, className || 'text_field')
    }

    addNumberField(name, label, value, className) {
        return Controls.addNumberField(this.bodyElem, name, label, value, className || 'text_field')
    }

    addTextAreaField(name, label, value, className) {
        return Controls.addTextAreaField(this.bodyElem, name, label, value, className || 'text_field')
    }

    addPasswordField(name, label, value, className) {
        return Controls.addPasswordField(this.bodyElem, name, label, value, className || 'text_field')
    }

    addSelectField(name, label, options, value, className) {
        return Controls.addSelectField(this.bodyElem, name, label, options, value, className || 'select_field')
    }

    addCheckBoxField(name, label, checked, className) {
        return Controls.addCheckBoxField(this.bodyElem, name, label, checked, className || 'checkbox_field')
    }

    addRadioButtons(name, options, value, className) {
        return Controls.addRadioButtons(this.bodyElem, name, options, value, className || 'radio_buttons')
    }

    addButton(name, label, action) {
        return Controls.addButton(this.footerElem, name, label, action)
    }

    addCodeEditor(name, label, value, options) {
        return Controls.addCodeEditor(this.bodyElem, name, label, value, options)
    }
}

export { Dialog }