var letterTemplate_form = {
    settings: {
        company_autocomplete_url: ''
    },
    init: function() {
        this.initAutocomplete();
        this.initCKEditor();
        this.initEmail();
    },
    initAutocomplete: function() {
        global.autocomplete.bind(letterTemplate_form.settings.company_autocomplete_url, '#letterTemplate_company_description', '#letterTemplate_company');
    },
    initCKEditor: function () {
        const editor1 = CKEDITOR.replace('letterTemplate_faxCoverBody');
        editor1.on('change', function () {
            editor1.updateElement();
        });

        const editor2 = CKEDITOR.replace('letterTemplate_body');
        editor2.on('change', function () {
            editor2.config.fillEmptyBlocks = false;
            editor2.updateElement();
        });

        const editor3 = CKEDITOR.replace('letterTemplate_emailBody');
        editor3.on('change', function () {
            editor3.config.fillEmptyBlocks = false;
            editor3.updateElement();
        });
    },
    initEmail : function () {
        let initialIdx = jQ(".cc_row").length;
        let bindRemoveCc = function(){
            jQ(".letterTemplate_removeEmail_btn").unbind('click').bind('click', function(e){
                let idx = parseInt(jQ(this).data('idx'));
                jQ(`.cc_row[data-idx="${idx}"]`).remove();
            });
            console.debug('bind remove');
        };

        jQ("#letterTemplate_addEmail_btn").unbind('click').bind('click', function(e){
            let lastIdx = initialIdx;
            jQ(".cc_row").each(function(i, el){
                lastIdx = parseInt(jQ(el).data('idx'));
            });
            let idx = lastIdx + 1,
                row = jQ("<div>").attr({
                    class: 'cc_row row',
                    'data-idx': idx,
                }),
                col1 = jQ("<div>").attr({
                    class: 'cc_col1 small-6 columns',
                    'data-idx': idx,
                }),
                col2 = jQ("<div>").attr({
                    class: 'cc_col2 small-6 columns',
                    'data-idx': idx,
                }),
                closeBtn = `<span class="letterTemplate_removeEmail_btn" data-idx="${idx}"><i class="fa fa-times-circle"></i></span>`,
                descriptionLabel = jQ("<label>").attr({
                    for: `letterTemplate_letterTemplateEmail_${idx}_desc`,
                    class: `hidden-cc-${idx}`,
                    id: `letterTemplate_letterTemplateEmail_${idx}_desc`
                }).html('Description'),
                descriptionTxt = jQ("<input>").attr({
                    type: 'text',
                    name: `letterTemplate[letterTemplateEmails][${idx}][description]`,
                    id: `letterTemplate_letterTemplateEmail_${idx}_desc`,
                    class: `letterTemplate_letterTemplateEmail_desc hidden-cc-${idx}`,
                }),
                emailLabel = jQ("<label>").attr({
                    for: `letterTemplate_letterTemplateEmail_${idx}_email`,
                    class: `hidden-cc-${idx}`,
                    id: `letterTemplate_letterTemplateEmail_${idx}_email`
                }).html('Email'),
                emailTxt = jQ("<input>").attr({
                    type: 'text',
                    name: `letterTemplate[letterTemplateEmails][${idx}][email]`,
                    id: `letterTemplate_letterTemplateEmail_${idx}_email`,
                    class: `letterTemplate_letterTemplateEmail_desc hidden-cc-${idx}`,
                });
            descriptionLabel.appendTo(col1);
            descriptionTxt.appendTo(col1);
            emailLabel.appendTo(col2);
            emailTxt.appendTo(col2);
            col1.appendTo(row);
            emailLabel.append(closeBtn);
            // idTxt.appendTo(col2);
            col2.appendTo(row);
            row.appendTo("#cc_container");

            bindRemoveCc();
            console.debug('bind add');
        });

        bindRemoveCc();
    }
};