/**
 * Toggle class
 */
let KWysiwyg: any = {

    publishes: true,
    widgetContainerIndex: 1,
    block: true,
    priority: 4000,

    bind: function (el: any) {

        let observer = this.observer;

        if (!this.callback) {
            this.callback = function (event: any) {
                let data = event.detail;
                if (data.components && data.components.length > 0)
                    observer.setValue(data);
                else
                    observer.setValue(null);
            };
        }


        // Synchronise our model on wysiwyg events
        el.addEventListener("wysiwyg", this.callback);

    },


    // Populate with inner html
    routine: function (el: any, value: any) {

        el.innerHTML = value != null && value.html ? value.html : ''
        el.setAttribute("wysiwyg", "container-" + (++KWysiwyg.widgetContainerIndex));
        el.boundObject = value;
        el.kinisiteModel = this.view.models;
        el.dispatchEvent(new Event('wysiwygUpdated'));

        // Bind once
        if (el.boundView) {
            el.boundView.unbind();
        }
        el.boundView = (<any>window)["tinybind"].bind(el, this.view.models);


    }

};

export default KWysiwyg;