(function (define) {
    "use strict";
    define('form_builder', function (require, exports) {
        var $ = require('$'),
        _ = require('_');
        var elements = [],
        with_wrapper = true,
        forms = [],
        elements_boxes = [],
        mouse_event = 'release',
        dragging_el_btn = null,
        mouse_in_form = null,
        form_el_row = '<div class="form_el_row" name="form_el_row" ></div>',
        place_holder = null,
        form_data_recovering = null,
        form_data_recovering_key = null;
        function main(){
            /**
             * {
             *   'btn': '单行文本',
             *   'field': '<input />'
             * }
             */
            elements = [];
            forms = [];
            elements_boxes = [];
        }
        var attrs = {
            /**
             * after function for element dropped to the form.
             * */
            element_appended_callback: function(after) {
                this.element_appended = after;
            },
            element_appended_before_allback: function(before) {
                this.element_before_append = before;
            },
            insert_element: function(data){
                var uid = dragging_el_btn.attr('uid');
                var element = _.filter(elements, function(element){
                    return element.uid === uid;
                });
                if(this.element_before_append)
                    this.element_before_append.apply(this, [element, place_holder, data])
                var $el = $(element[0].field);
                if(place_holder && place_holder.is(forms.join(' ,'))){
                    place_holder.append($el);
                }else{
                    $el.insertAfter(place_holder);
                }
                if(with_wrapper){
                    $el.wrap(form_el_row);
                    $el.wrap('<div></div>');
                }
                $el.data('tag', element[0]);
                this.element_appended.apply(this, [element, $el, place_holder, data]);
                dragging_el_btn = null;
                place_holder = null;
                return $el;
            },
            highlight_place_holder: function(el){
                var $el = $(el);
                $el.addClass('place_holder_after');
            },
            rm_highlight_place_holder: function(){
                $(forms.join(' ,')).find('div').removeClass('place_holder_after');
            },
            mouseover_element: function(event){
                var $target = $(event.target);
                var _forms = forms.join(' ,');
                if($target.is(forms.join(' ,'))){
                    if($target.children('div.form_el_row').length){
                        place_holder = $target.children('div.form_el_row').last();
                        this.highlight_place_holder(place_holder);
                    }else{
                        place_holder = $target;
                    }
                }else if($target.closest(forms.join(' ,')).length){
                    if($target.is('div[name="form_el_row"]')){
                        place_holder = $target;
                    }else{
                        place_holder = $target.closest('div[name="form_el_row"]');
                    }
                    this.highlight_place_holder(place_holder);
                }
                event.stopPropagation();
            },
            drag_add: function(){
                var _this = this;
                $(elements_boxes.join(' ,')).children().each(function(i, obj){
                    $(obj).on('mousedown', function(event){
                        mouse_event = 'dragging';
                        dragging_el_btn = $(this).clone();
                        dragging_el_btn.css({
                            'top': event.pageY+12, 
                            'left': event.pageX-80,
                            'position': 'absolute',
                            'z-index': 99999
                        });
                        $('body').append(dragging_el_btn);
                        event.stopPropagation();
                    });
                });
                
                $(document).on('mousemove', function(event){
                    if(mouse_event === 'dragging'){
                        dragging_el_btn.css({
                            'top': event.pageY+12, 
                            'left': event.pageX-80,
                            'position': 'absolute',
                            'z-index': 99999
                        });
                        _this.rm_highlight_place_holder();
                        _this.mouseover_element(event);
                    }
                });
                
                $(document).on('mouseup', function(){
                    mouse_event = 'release';
                    if(dragging_el_btn){
                        dragging_el_btn.remove();
                        _this.insert_element();
                        _this.rm_highlight_place_holder();
                    }
                    //sort columns
                    
                    $( forms.join(' ,') ).sortable({
                        connectWith: "div.main",
                        stop: function(event, ui) {
                            
                        }
                    });
                });
            },
            init_els_box: function(){
                var _this = this;
                _.each(elements, function(el){
                    var $el = $(el.btn);
                    var uid = _.uniqueId(new Date().getTime());
                    el.uid = uid;
                    _.each(elements_boxes, function(el_box){
                        $(el_box).append($el);
                        $el.attr('uid', uid);
                        $el.attr('type', el.type);
                    })
                });
            },
            recover_form_data: function(form_data, type_key){
                form_data_recovering = form_data;
                form_data_recovering_key = type_key;
            },
            recover: function(el_data, g_placeholder){
                var _this = this;
                var data_el_key = form_data_recovering_key;
                var type = _.get(el_data, data_el_key),
                    btn_el = $(elements_boxes.join(' ,')).find('button[type="'+type+'"]');
                if(btn_el.length){
                    dragging_el_btn = btn_el;
                    place_holder = g_placeholder;
                    return _this.insert_element(el_data);
                }else{
                    return false;
                }
            },
            recover_form: function(){
                if(!form_data_recovering) return false;
                var _this = this, field,
                _elements = form_data_recovering['child'];
                _.each(_elements, function(el_data){
                    var type = _.get(el_data, form_data_recovering_key),
                    $el_appended = _this.recover(el_data, $(forms[0])),
                    el_btn_data = _.filter(elements, function(el){
                        return _.eq(_.get(el, 'type'), type);
                    });
                    if(el_btn_data.length){
                        field = el_btn_data[0]['field'];
                    }
                    if($(field).is('div')){
                        var sub_form_data = el_data['child'];
                        _.each(sub_form_data, function(sub_form_el_data){
                            _this.recover(sub_form_el_data, $el_appended);
                        })
                    }
                });
            },
            bootstrap: function(){
                this.init_els_box();
                this.drag_add();
                this.recover_form();
            },
            add_elements: function(els){
                elements = _.concat(elements, els);
            },
            add_forms: function(form){
            	
                forms.push(form);
            },
            add_elements_box: function(el_box){
                elements_boxes.push(el_box);
            },
            no_wrapper: function(bool){
                with_wrapper = bool;
            }

        }
        
        _.extend(main.prototype, attrs);

        $.extend(exports, {
            create: main
        })
    });
}(typeof define === 'function' && define.amd ? define : function (id, factory) {
    if (typeof exports !== 'undefined') {
        factory(require, exports);
    } else {
        factory(function(value) {
            return window[value];
        }, (window[id] = {}));
    }
}));
(function (define) {
    "use strict";
    define('form_builder_s', function (require, exports) {
        var $ = require('$'),
        _ = require('_');
        var elements = [],
        with_wrapper = true,
        forms = [],
        elements_boxes = [],
        mouse_event = 'release',
        dragging_el_btn = null,
        mouse_in_form = null,
        form_el_row = '<div class="form_el_row" name="form_el_row" ></div>',
        place_holder = null,
        form_data_recovering = null,
        form_data_recovering_key = null;
        function main(){
            /**
             * {
             *   'btn': '单行文本',
             *   'field': '<input />'
             * }
             */
            elements = [];
            forms = [];
            elements_boxes = [];
        }
        var attrs = {
            /**
             * after function for element dropped to the form.
             * */
            element_appended_callback: function(after) {
                this.element_appended = after;
            },
            element_appended_before_allback: function(before) {
                this.element_before_append = before;
            },
            insert_element: function(data){
                var uid = dragging_el_btn.attr('uid');
                var element = _.filter(elements, function(element){
                    return element.uid === uid;
                });
                if(this.element_before_append)
                    this.element_before_append.apply(this, [element, place_holder, data])
                var $el = $(element[0].field);
                if(place_holder && place_holder.is(forms.join(' ,'))){
                    place_holder.append($el);
                }else{
                    $el.insertAfter(place_holder);
                }
                if(with_wrapper){
                    $el.wrap(form_el_row);
                    $el.wrap('<div></div>');
                }
                $el.data('tag', element[0]);
                this.element_appended.apply(this, [element, $el, place_holder, data]);
                dragging_el_btn = null;
                place_holder = null;
                return $el;
            },
            highlight_place_holder: function(el){
                var $el = $(el);
                $el.addClass('place_holder_after');
            },
            rm_highlight_place_holder: function(){
                $(forms.join(' ,')).find('div').removeClass('place_holder_after');
            },
            mouseover_element: function(event){
                var $target = $(event.target);
                var _forms = forms.join(' ,');
                if($target.is(forms.join(' ,'))){
                    if($target.children('div.form_el_row').length){
                        place_holder = $target.children('div.form_el_row').last();
                        this.highlight_place_holder(place_holder);
                    }else{
                        place_holder = $target;
                    }
                }else if($target.closest(forms.join(' ,')).length){
                    if($target.is('div[name="form_el_row"]')){
                        place_holder = $target;
                    }else{
                        place_holder = $target.closest('div[name="form_el_row"]');
                    }
                    this.highlight_place_holder(place_holder);
                }
                event.stopPropagation();
            },
            drag_add: function(){
                var _this = this;
                $(elements_boxes.join(' ,')).children().each(function(i, obj){
                    $(obj).on('mousedown', function(event){
                        mouse_event = 'dragging';
                        dragging_el_btn = $(this).clone();
                        dragging_el_btn.css({
                            'top': event.pageY+12, 
                            'left': event.pageX-80,
                            'position': 'absolute',
                            'z-index': 99999
                        });
                        $('body').append(dragging_el_btn);
                        event.stopPropagation();
                    });
                });
                
                $(document).on('mousemove', function(event){
                    if(mouse_event === 'dragging'){
                        dragging_el_btn.css({
                            'top': event.pageY+12, 
                            'left': event.pageX-80,
                            'position': 'absolute',
                            'z-index': 99999
                        });
                        _this.rm_highlight_place_holder();
                        _this.mouseover_element(event);
                    }
                });
                
                $(document).on('mouseup', function(){
                    mouse_event = 'release';
                    if(dragging_el_btn){
                        dragging_el_btn.remove();
                        _this.insert_element();
                        _this.rm_highlight_place_holder();
                    }
                    //sort columns
                    $( forms.join(' ,') ).sortable({
                        connectWith: "div.main",
                        stop: function(event, ui) {
                            
                        }
                    });
                });
            },
            init_els_box: function(){
                var _this = this;
                _.each(elements, function(el){
                    var $el = $(el.btn);
                    var uid = _.uniqueId(new Date().getTime());
                    el.uid = uid;
                    _.each(elements_boxes, function(el_box){
                        $(el_box).append($el);
                        $el.attr('uid', uid);
                        $el.attr('type', el.type);
                    })
                });
            },
            recover_form_data: function(form_data, type_key){
                form_data_recovering = form_data;
                form_data_recovering_key = type_key;
            },
            recover: function(el_data, g_placeholder){
                var _this = this;
                var data_el_key = form_data_recovering_key;
                var type = _.get(el_data, data_el_key),
                    btn_el = $(elements_boxes.join(' ,')).find('button[type="'+type+'"]');
                if(btn_el.length){
                    dragging_el_btn = btn_el;
                    place_holder = g_placeholder;
                    return _this.insert_element(el_data);
                }else{
                    return false;
                }
            },
            recover_form: function(){
                if(!form_data_recovering) return false;
                var _this = this, field,
                _elements = form_data_recovering['child'];
                _.each(_elements, function(el_data){
                    var type = _.get(el_data, form_data_recovering_key),
                    $el_appended = _this.recover(el_data, $(forms[0])),
                    el_btn_data = _.filter(elements, function(el){
                        return _.eq(_.get(el, 'type'), type);
                    });
                    if(el_btn_data.length){
                        field = el_btn_data[0]['field'];
                    }
                    if($(field).is('div')){
                        var sub_form_data = el_data['child'];
                        _.each(sub_form_data, function(sub_form_el_data){
                            _this.recover(sub_form_el_data, $el_appended);
                        })
                    }
                });
            },
            bootstrap: function(){
                this.init_els_box();
                this.drag_add();
                this.recover_form();
            },
            add_elements: function(els){
                elements = _.concat(elements, els);
            },
            add_forms: function(form){
            	
                forms.push(form);
            },
            add_elements_box: function(el_box){
                elements_boxes.push(el_box);
            },
            no_wrapper: function(bool){
                with_wrapper = bool;
            }

        }
        
        _.extend(main.prototype, attrs);

        $.extend(exports, {
            create: main
        })
    });
}(typeof define === 'function' && define.amd ? define : function (id, factory) {
    if (typeof exports !== 'undefined') {
        factory(require, exports);
    } else {
        factory(function(value) {
            return window[value];
        }, (window[id] = {}));
    }
}));