CKEDITOR.plugins.add('signaturetemplates',
    {
        requires: ['richcombo'], //, 'styles' ],
        init: function (editor) {
            var config = editor.config,
                lang = editor.lang.format;

            // Gets the list of tags from the settings.
            var options = []; //new Array();
            var delimiter = '|^~^|';
            //this.add('value', 'drop_text', 'drop_label');
            //var tags = [];
            //tags[0] = ["[contact_name]", "Name", "Name"];
            //tags[1] = ["[contact_email]", "email", "email"];
            //tags[2] = ["[contact_user_name]", "User name", "User name"];

            // Create style objects for all defined styles.

            //var fnData = editor.config.fnData;

            //if (!fnData || typeof (fnData) != 'function')
            //    throw "You must provide a function to retrieve the list data.";

            editor.ui.addRichCombo('signaturetemplates',
                {
                    label: "Sila pilih template tandatangan",
                    title: "Sila pilih template tandatangan",
                    voiceLabel: "Choose template1",
                    toolbar: 'others',
                    // className: 'cke_format',
                    multiSelect: false,

                    panel:
                    {
                        css: [CKEDITOR.skin.getPath('editor')].concat(config.contentsCss),
                        //css: [config.contentsCss, CKEDITOR.getUrl(editor.skinPath + 'editor.css')],
                        voiceLabel: lang.panelVoiceLabel
                    },

                    init: function () {
                        var self = this;
                        self.startGroup("Signature Templates"); 
                        var retryCount = 0;
                        var delaySetDDLSelectedOption = function () {
                            if (editor.isTemplateLoaded == undefined && retryCount++ < 10) {
                                setTimeout(delaySetDDLSelectedOption, retryCount * 100);
                            } else {
                                self.setValue(editor.selTemplateHTML, editor.selSignatureName);
                            }
                        }

                        delaySetDDLSelectedOption();
                        //this.add('value', 'drop_text', 'drop_label');
                        //for (var this_tag in tags) {
                        //    this.add(tags[this_tag][0], tags[this_tag][1], tags[this_tag][2]);
                        //}

                        //var content = fnData();

                        //$.each(content, function (index, value) {
                        //    // value, html, text
                        //    self.add(value.name, value.name, value.name)
                        //});
                    },

                    onClick: function (value) {
                         
                        editor.focus();
                        editor.fire('saveSnapshot');
                        var arr = value.split(delimiter);
                        editor.selSignatureTplID = arr[0];
                        editor.selSignatureName = this._.items[value]; 
                        value = arr[1];
                        //editor.selSignature = '<br>' + arr[1];
                        editor.selSignature = arr[1];
                        if (editor.document.getById('emailSignature')) {
                            var range = editor.createRange();

                            range.setStart(editor.document.getById('emailSignature'), 0); 
                            range.setEnd(editor.document.getById('emailSignature'), range.startContainer.$.childNodes.length);  
                            //range.selectNodeContents();
                            range.startContainer[0];
                            range.deleteContents();
                            //editor.getSelection().selectRanges([range]);
                            //var element = CKEDITOR.dom.element.createFromHtml('<p id="emailSignature">' + value + '<p>');
                            //range.insertNode(node)
                            //range.moveToElementEditEnd(range.root);
                            editor.insertHtml(value, 'html', range);
                        } else { 
                            
                            //editor.insertElement(element);
                            var str = '<div id="emailSignature">' + value + '&nbsp;<div>';
                            editor.insertHtml(str, 'html');
                        }
                        editor.fire('saveSnapshot');
                         
                    },
                    onRender: function () {

                        editor.on("selectionChange", function (b) {

                            this.setValue(editor.selTemplateHTML, editor.selSignatureName);
                            //editor.focus();
                            //editor.fire('saveSnapshot');
                            return
                        }, this)
                    }
                });
        }
    });