{"version":3,"sources":["keditor-component-form.js"],"names":["$","KEditor","keditor","flog","log","components","initFormBuilder","component","self","this","formBuilderArea","find","formData","formContent","prepend","btnEditForm","btnPreviewForm","formBuilder","disableInjectedStyle","showActionButtons","dataType","html","disableFields","disabledAttrs","typeUserDisabledAttrs","checkbox-group","on","e","preventDefault","hasClass","show","hide","addClass","removeClass","renderForm","data","formRender","actions","getData","children","each","div","dataGrid","attr","split","wrap","label","input","subDiv","length","init","contentArea","container","componentContent","append","getContent","remove","settingEnabled","settingTitle","initSettingForm","form","getSettingComponent","value","css","showSettingForm","layout","val","jQuery"],"mappings":"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","file":"keditor-component-form.min.js","sourcesContent":["(function ($) {\r\n    var KEditor = $.keditor;\r\n    var flog = KEditor.log;\r\n    \r\n    KEditor.components['form'] = {\r\n        initFormBuilder: function (component) {\r\n            var self = this;\r\n            \r\n            var formBuilderArea = component.find('.form-builder-area');\r\n            var formData = component.find('.form-data');\r\n            var formContent = component.find('.form-content');\r\n            \r\n            component.find('.keditor-component-content').prepend(\r\n                '<p class=\"form-builder-tools\" style=\"text-align: right;\">' +\r\n                '    <a href=\"#\" class=\"btn btn-primary btn-preview-form\">Preview form</a> ' +\r\n                '    <a href=\"#\" class=\"btn btn-info btn-edit-form disabled\">Edit form</a>' +\r\n                '</p>'\r\n            );\r\n            \r\n            var btnEditForm = component.find('.btn-edit-form');\r\n            var btnPreviewForm = component.find('.btn-preview-form');\r\n            \r\n            formBuilderArea.formBuilder({\r\n                disableInjectedStyle: true,\r\n                showActionButtons: false,\r\n                dataType: 'json',\r\n                formData: formData.html(),\r\n                disableFields: [\r\n                    'autocomplete',\r\n                    'paragraph',\r\n                    'header'\r\n                ],\r\n                disabledAttrs: ['access'],\r\n                \r\n                typeUserDisabledAttrs: {\r\n                    'checkbox-group': [\r\n                        'toggle',\r\n                        'inline'\r\n                    ]\r\n                }\r\n            });\r\n            \r\n            btnEditForm.on('click', function (e) {\r\n                e.preventDefault();\r\n                \r\n                if (!btnEditForm.hasClass('disabled')) {\r\n                    formBuilderArea.show();\r\n                    formContent.hide();\r\n                    btnEditForm.addClass('disabled');\r\n                    btnPreviewForm.removeClass('disabled');\r\n                }\r\n            });\r\n            \r\n            btnPreviewForm.on('click', function (e) {\r\n                e.preventDefault();\r\n                \r\n                if (!btnPreviewForm.hasClass('disabled')) {\r\n                    self.renderForm(component);\r\n                    \r\n                    formBuilderArea.hide();\r\n                    formContent.show();\r\n                    btnEditForm.removeClass('disabled');\r\n                    btnPreviewForm.addClass('disabled');\r\n                }\r\n            });\r\n        },\r\n        \r\n        renderForm: function (component, formBuilder) {\r\n            var formContent = component.find('.form-content');\r\n            \r\n            if (!formBuilder) {\r\n                var formBuilderArea = component.find('.form-builder-area');\r\n                formBuilder = formBuilderArea.data('formBuilder');\r\n            }\r\n            \r\n            formContent.formRender({\r\n                dataType: 'json',\r\n                formData: formBuilder.actions.getData('json')\r\n            });\r\n            \r\n            if (formContent.hasClass('form-horizontal')) {\r\n                formContent.children('div').each(function () {\r\n                    var div = $(this);\r\n                    var dataGrid = formContent.attr('data-grid') || '4-8';\r\n                    dataGrid = dataGrid.split('-');\r\n                    \r\n                    if (div.attr('class')) {\r\n                        if (div.hasClass('fb-button')) {\r\n                            div.find('button').wrap('<div class=\"col-sm-' + dataGrid[1] + ' col-sm-offset-' + dataGrid[0] + '\"></div>');\r\n                        } else {\r\n                            var label = div.children('label');\r\n                            var input = div.children('input, select, textarea');\r\n                            var subDiv = div.children('div');\r\n                            \r\n                            label.addClass('control-label col-sm-' + dataGrid[0]);\r\n                            \r\n                            if (subDiv.length > 0) {\r\n                                subDiv.addClass('col-sm-' + dataGrid[1]);\r\n                            } else {\r\n                                input.addClass('form-control').wrap('<div class=\"col-sm-' + dataGrid[1] + '\"></div>');\r\n                            }\r\n                        }\r\n                    }\r\n                });\r\n            }\r\n        },\r\n        \r\n        init: function (contentArea, container, component, keditor) {\r\n            flog('init \"form\" component', component);\r\n            \r\n            var componentContent = component.find('.keditor-component-content');\r\n            var formBuilder = component.find('.form-builder-area');\r\n            var formContent = component.find('.form-content');\r\n            var formData = component.find('.form-data');\r\n            \r\n            if (formData.length === 0) {\r\n                componentContent.append('<div class=\"form-data\" style=\"display: none !important;\"></div>')\r\n            }\r\n            \r\n            if (formContent.length === 0) {\r\n                componentContent.append('<form class=\"form-content\" style=\"display: none !important;\"></form>')\r\n            } else {\r\n                formContent.hide()\r\n            }\r\n            \r\n            if (formBuilder.length === 0) {\r\n                formBuilder = $('<div class=\"form-builder-area clearfix\"></div>');\r\n                componentContent.append(formBuilder);\r\n            }\r\n            \r\n            this.initFormBuilder(component);\r\n        },\r\n        \r\n        getContent: function (component, keditor) {\r\n            flog('getContent \"form\" component', component);\r\n            \r\n            var self = this;\r\n            var componentContent = component.find('.keditor-component-content');\r\n            var formData = component.find('.form-data');\r\n            var formBuilderArea = $('#' + component.attr('id')).find('.form-builder-area');\r\n            var formBuilder = formBuilderArea.data('formBuilder');\r\n            \r\n            self.renderForm(component, formBuilder);\r\n            formData.html(formBuilder.actions.getData('json'));\r\n            component.find('.form-builder-area, .form-builder-tools').remove();\r\n            component.find('.form-content').show();\r\n            \r\n            return componentContent.html();\r\n        },\r\n        \r\n        settingEnabled: true,\r\n        \r\n        settingTitle: 'Form Settings',\r\n        \r\n        initSettingForm: function (form, keditor) {\r\n            flog('initSettingForm \"form\" component');\r\n            \r\n            var self = this;\r\n            \r\n            form.html(\r\n                '<div class=\"form-horizontal\">' +\r\n                '    <div class=\"form-group\">' +\r\n                '        <label class=\"col-sm-12\">Action</label>' +\r\n                '        <div class=\"col-sm-12\">' +\r\n                '            <input type=\"text\" class=\"form-control txt-form-action\" />' +\r\n                '        </div>' +\r\n                '    </div>' +\r\n                '    <div class=\"form-group\">' +\r\n                '        <label class=\"col-sm-12\">Method</label>' +\r\n                '        <div class=\"col-sm-12\">' +\r\n                '            <select class=\"form-control select-method\">' +\r\n                '                <option value=\"get\">Get</option>' +\r\n                '                <option value=\"post\">Post</option>' +\r\n                '                <option value=\"put\">Put</option>' +\r\n                '                <option value=\"delete\">Delete</option>' +\r\n                '            </select>' +\r\n                '        </div>' +\r\n                '    </div>' +\r\n                '    <div class=\"form-group\">' +\r\n                '        <label class=\"col-sm-12\">Enctype</label>' +\r\n                '        <div class=\"col-sm-12\">' +\r\n                '            <select class=\"form-control select-enctype\">' +\r\n                '                <option value=\"text/plain\">text/plain</option>' +\r\n                '                <option value=\"multipart/form-data\">multipart/form-data</option>' +\r\n                '                <option value=\"application/x-www-form-urlencoded\">application/x-www-form-urlencoded</option>' +\r\n                '            </select>' +\r\n                '        </div>' +\r\n                '    </div>' +\r\n                '    <div class=\"form-group\">' +\r\n                '        <label class=\"col-sm-12\">Layout</label>' +\r\n                '        <div class=\"col-sm-12\">' +\r\n                '            <select class=\"form-control select-layout\">' +\r\n                '                <option value=\"\">Normal</option>' +\r\n                '                <option value=\"form-horizontal\">Horizontal</option>' +\r\n                '                <option value=\"form-inline\">Inline</option>' +\r\n                '            </select>' +\r\n                '        </div>' +\r\n                '    </div>' +\r\n                '    <div class=\"form-group select-grid-wrapper\">' +\r\n                '        <label class=\"col-sm-12\">Grid setting</label>' +\r\n                '        <div class=\"col-sm-12\">' +\r\n                '            <select class=\"form-control select-grid\">' +\r\n                '                <option value=\"2-10\">col-2 col-10</option>' +\r\n                '                <option value=\"3-9\">col-3 col-9</option>' +\r\n                '                <option value=\"4-8\">col-4 col-8</option>' +\r\n                '                <option value=\"5-7\">col-5 col-7</option>' +\r\n                '                <option value=\"6-6\">col-6 col-6</option>' +\r\n                '            </select>' +\r\n                '            <small class=\"help-block\">This setting is for width of label and control with number of cols as unit</small>' +\r\n                '        </div>' +\r\n                '    </div>' +\r\n                '</div>'\r\n            );\r\n            \r\n            \r\n            form.find('.txt-form-action').on('change', function () {\r\n                var component = keditor.getSettingComponent();\r\n                var formContent = component.find('.form-content');\r\n                \r\n                formContent.attr('action', this.value);\r\n            });\r\n            \r\n            form.find('.select-method').on('change', function () {\r\n                var component = keditor.getSettingComponent();\r\n                var formContent = component.find('.form-content');\r\n                \r\n                formContent.attr('action', this.value);\r\n            });\r\n            \r\n            form.find('.select-enctype').on('change', function () {\r\n                var component = keditor.getSettingComponent();\r\n                var formContent = component.find('.form-content');\r\n                \r\n                formContent.attr('enctype', this.value);\r\n            });\r\n            \r\n            form.find('.select-layout').on('change', function () {\r\n                var component = keditor.getSettingComponent();\r\n                var formContent = component.find('.form-content');\r\n                \r\n                formContent.removeClass('form-inline form-horizontal');\r\n                if (this.value) {\r\n                    formContent.addClass(this.value);\r\n                }\r\n                self.renderForm(component);\r\n                form.find('.select-grid-wrapper').css('display', this.value === 'form-horizontal' ? 'block' : 'none');\r\n            });\r\n            \r\n            form.find('.select-grid').on('change', function () {\r\n                var component = keditor.getSettingComponent();\r\n                var formContent = component.find('.form-content');\r\n                \r\n                formContent.attr('data-grid', this.value);\r\n                self.renderForm(component);\r\n            });\r\n        },\r\n        \r\n        showSettingForm: function (form, component, keditor) {\r\n            flog('showSettingForm \"form\" component', component);\r\n            var formContent = component.find('.form-content');\r\n            \r\n            var layout = '';\r\n            if (formContent.hasClass('form-inline')) {\r\n                layout = 'form-inline';\r\n            } else if (formContent.hasClass('form-horizontal')) {\r\n                layout = 'form-horizontal';\r\n            }\r\n            \r\n            form.find('.txt-form-action').val(formContent.attr('action') || '');\r\n            form.find('.select-method').val(formContent.attr('method') || 'get');\r\n            form.find('.select-enctype').val(formContent.attr('enctype'));\r\n            form.find('.select-layout').val(layout);\r\n            form.find('.select-grid-wrapper').css('display', layout === 'form-horizontal' ? 'block' : 'none');\r\n            form.find('.select-grid').val(formContent.attr('data-grid') || '4-8');\r\n        }\r\n    };\r\n    \r\n})(jQuery);\r\n"]}