'use strict';

(function() {
    CKEDITOR.plugins.add( 'variables', {
        requires: 'widget,dialog',
        icons: 'variables',
        hidpi: true,
        onLoad: function() {
            CKEDITOR.addCss('span.variable {\n' +
                '    padding: 2px 3px;\n' +
                '    margin: auto 2px;\n' +
                '    color: #D0021B;\n' +
                '    font-family: monospace, monospace;\n' +
                '}\n' +
                '.cke .cke_panel_frame {\n' +
                '    max-height: 320px;\n' +
                '    overflow-y: auto;\n' +
                '}'
            );
        },
        init: function(editor) {
            CKEDITOR.dialog.add('variables', this.path + 'dialogs/variables.js');
            editor.widgets.add('variables', {
                dialog: 'variables',
                pathName: "переменная",
                template: '<span class="variable" contenteditable="false">${}</span>',
                downcast: function() {
                    return new CKEDITOR.htmlParser.text('${' + this.data.name + '}');
                },
                init: function() {
                    this.setData('name', this.element.getText().slice(2, -1));
                },
                data: function() {
                    this.element.setText('${' + this.data.name + '}');
                },
                getLabel: function() {
                    return this.editor.lang.widget.label.replace(/%1/, this.data.name + ' переменная');
                }
            });

            editor.config.customValues.varKeyPressed = false;

            editor.ui.addButton( 'insertVariable', {
                label: 'Вставить паременную',
                command: 'variables',
                toolbar: 'insert,5',
                icon: 'variables'
            });

            editor.addCommand('autocompleteVariable', {
                exec: function(editor) {
                    let dummyElement = editor.document.createElement('span');
                    editor.insertElement(dummyElement);

                    let x = 0, y = 0, obj = dummyElement.$;
                    while (obj.offsetParent) {
                        x += obj.offsetLeft;
                        y += obj.offsetTop;
                        obj = obj.offsetParent;
                    }
                    x += obj.offsetLeft;
                    y += obj.offsetTop;

                    dummyElement.remove();
                    editor.contextMenu.show(editor.document.getBody(), null, x, y);
                }
            });

            let firstExecution = true, dataElement = {};
            editor.addCommand('reloadVariablesBox', {
                exec: function(editor) {

                    function getTextNodes( element ) {
                        var children = element.getChildren(),
                            textNodes = [],
                            child;

                        for ( var i = children.count(); i--; ) {
                            child = children.getItem( i );
                            if ( child.type == CKEDITOR.NODE_ELEMENT )
                                getTextNodes( child );
                            else if ( child.type == CKEDITOR.NODE_TEXT )
                                textNodes.push( child );
                        }
                        return textNodes;
                    }

                    if (editor.contextMenu) {
                        dataElement = {};
                        editor.addMenuGroup('variablesBoxGroup');
                        
                        $.each(editor.config.customValues.variablesList, function(i, variables) {

                            let variablesBoxItem = "variablesBoxItem" + i;
                            dataElement[variablesBoxItem] = CKEDITOR.TRISTATE_OFF;
                            editor.addMenuItem(variablesBoxItem, {
                                id: variables[1],
                                label: variables[0],
                                group: 'variablesBoxGroup',
                                icon: null,
                                onClick: function() {
                                    let selection = editor.getSelection();
                                    let element = selection.getStartElement();
                                    let ranges = selection.getRanges();
                                    ranges[0].setStart(element.getFirst(), 0);
                                    ranges[0].setEnd(element.getFirst(), 0);
                                    editor.insertText(this.id);
                                }
                            });
                        });

                        if (firstExecution == true) {
                            editor.contextMenu.addListener(function(element) {
                                return dataElement;
                            });
                            firstExecution = false;
                        }
                    }
                }
            });

            delete editor._.menuItems.paste;
        },
        afterInit: function(editor) {
            editor.dataProcessor.dataFilter.addRules({
                text: function(text, node) {
                    let dtd = node.parent && CKEDITOR.dtd[node.parent.name];
                    if (dtd && !dtd.span)
                        return;

                    return text.replace(/(\$\{[a-zA-z0-9_.]+\})+/g, function(match) {
                        let innerElement = new CKEDITOR.htmlParser.element('span', {
                            'class': 'variable',
                            'contenteditable': 'false'
                        });
                        innerElement.add(new CKEDITOR.htmlParser.text(match));

                        let widgetWrapper = editor.widgets.wrapElement(innerElement, 'variables');
                        return widgetWrapper.getOuterHtml();
                    });
                }
            });
            editor.on('key', function(evt) {

                if (evt.data.keyCode == CKEDITOR.SHIFT + 52)
                    editor.config.customValues.varKeyPressed = true;

                if (editor.config.customValues.varKeyPressed) {
                    if (evt.data.keyCode == CKEDITOR.SHIFT + 219) {
                        editor.execCommand('reloadVariablesBox');
                        editor.execCommand('autocompleteVariable');
                        editor.config.customValues.varKeyPressed = false;
                    }
                }
            });

        }
    });
})();