function showMultiOptions(element)
{
    $('#multiOptions, #multiOptions-element, #multiOptions-label').hide();
    $.ajax({
            url: BASE_URL + '/' + CURRENT_PAGE,
            dataType: 'json',
            type: 'POST',
            data: {
                action: 'getElementOption',
                id: element.value
            },
            success: function (options) {
                if (options == true){
                    showMultiOptionsGrid();
                }
            }
    });
    /*$('input[name*=property_]').hide();
    $.ajax({
            url: BASE_URL + '/' + CURRENT_PAGE,
            dataType: 'json',
            type: 'POST',
            data: {
                action: 'getElementProperties',
                id: element.value
            },
            success: function (options) {
                for (var key in options){
                    $('#property_'+options[key].id).show();
                }
            }
    });*/
}

function initMultiOptions()
{
    $('#idFieldType').change();
}

function showMultiOptionsGrid()
{
    $('#multiOptions, #multiOptions-element, #multiOptions-label').show();
}

function changeCloneAttribsGroup(group)
{
    var i = 0;
    $(group).children('DIV').each(function(){
        var id = $(this).attr('id').split('-');
        var elementPos = 0;
        $(this).attr('id', id[0]  + '-' + i).find('input, select, textarea').each(function(){
            $(this).attr('id', id[0] + '_' + i + '_' + elementPos);
            $(this).attr('name', id[0] + '[' + i + ']' + '[' + elementPos + ']');
            $(this).parent().find('label').each(function(){
                if ($(this).html().indexOf('{i}') > 0 || typeof($(this).children('span')) != 'undefined'){
                    if ($(this).children('span').attr('class') != 'replaced'){
                        $(this).html($(this).html().replace('{i}', '<span class="replaced">{i}').replace('{i}', '{i}</span>'));
                    }
                    if ($(this).children('span').attr('class') == 'replaced'){
                        $(this).children('span').html(i+1);
                    }
                }
            });
            elementPos++;
        });
        i++;
    });
}

function changeCloneAttribs(element)
{
    var name = $(element).attr('name').split('[');
    var $i = 0;
    $($(element).attr('tagName')+'[name*='+name[0]+']').each(function(){
        $(this).attr('id', name[0] + '_' + $i);
        $(this).attr('name', name[0] + '[' + $i + ']');
        $i++;
    })
}

function initCloneElements()
{
    $('.cloned').each(function(){
        if ($(this).attr('tagName') == 'DIV'){
            changeCloneAttribsGroup($(this).parent());
            initCloneElementValueGroup($(this).parent());
            $(this).find('input, textarea').each(function(){
                $(this).keyup(function(){
                    cloningGroup(this);
                    elementFocus(this);
                })

            });
        } else {
            changeCloneAttribs(this);
            initCloneElementValue(this);
            $(this).keyup(function(){
                cloning(this);
            });
        }
    })
}

function initCloneElementValueGroup(group)
{
    var id = $(group).attr('id').split('_');
    var name = id[0];
    id = id[1].split('-');
    var elementValue = $('#clonedValue_' + id[0]).val();
    if (typeof(elementValue) != 'undefined'){
        var valueObj = eval('(' + elementValue + ')');
        var i = 0;
        for (var key in valueObj){
            var elementPos = 0;
            if (i == 0){
                $(group).children('DIV').find('select, input, textarea').each(function(){
                    $(this).val(valueObj[key][elementPos]);
                    elementPos++;
                });
            } else {
                cloningGroup($('#' + name + '_' + id[0] + '_' + (i-1) + '_' + '0'), valueObj[key]);
            }
            i++;
        }
    }

}

/**
 * Focus in IE for element after cloning and change cursor position
 */
function elementFocus(element)
{
    if ($.browser.msie){
        $(element).focus();
        $(element).val($(element).val());
    }
}

function initCloneElementValue(element)
{
    var name = $(element).attr('name').split('[');
    var id = name[0].split('_');
    var elementValue = $('#clonedValue_' + id[1]).val();
    if (typeof(elementValue) != 'undefined'){
        var valueObj = eval('(' + elementValue + ')');
        var i = 0;
        for(var key in valueObj){
            if (i == 0){
                $(element).val(valueObj[key]);
            } else {
                var idArray = $(element).attr('id').split('_');
                var newId = idArray[0] + '_' + idArray[1] + '_' + (i-1);
                cloneElement($('#' + newId), valueObj[key]);
                changeCloneAttribs(element);
            }
            i++;
        }
    }
}

function cloningGroup(element, value)
{
    if (typeof(value) != 'undefined'){
        var elementValue = value;
    } else {
        var elementValue = '';
    }
    var idArray = $(element).attr('id').split('_');
    var groupId = idArray[0] + '_' + idArray[1] + '-' + idArray[2];
    var disabled = '';
    if ($('#' + groupId).children(':last').prev().attr('type') != 'button'){
        var i = 0;
        $('#' + groupId).clone().insertAfter($('#' + groupId)).find('select, input, textarea').each(function(){
            var val = '';
            /*
             * fix for change default select value in safari
             */
            if ($(this).attr('tagName') == 'SELECT') {
                val = $(this).children('option:first').val();
            }
            if (typeof(elementValue[i]) != 'undefined'){
                val = elementValue[i];
            }
            if ($(this).attr('type') != 'button'){
                disabled = $(this).attr('disabled');
            }
            $(this).val(val);
            $(this).keyup(function(){
                cloningGroup(this);
                elementFocus(this);
            })
            i++;
        });
        $('#' + groupId).children(':last').after('&nbsp;<input class="btn btn_delete" type="button" ' + (disabled?'disabled="disabled"':'') + ' value="delete" name="removeRow" onclick="removeClonedGroupRow(this);"/><div class="clear"></div>');
        changeCloneAttribsGroup($('#' + groupId).parent());
        var classArray = $('#' + idArray[0] + '_' + idArray[1] + '-element').children('div').attr('class').split(' ');
        if (classArray[0] == 'contact'){
            App_Form_Element_Contact.init(idArray[0] + '_' + idArray[1]);
        }
    }
}

function cloning(element)
{
    if ($(element).next('input').size() == 0){
        cloneElement(element);
        elementFocus(element);
    }
    changeCloneAttribs(element);
}

function cloneElement(element, value)
{
    if (typeof(value) != 'undefined'){
        var elementValue = value;
    } else {
        var elementValue = '';
    }
    $(element).clone().insertAfter('#' + $(element).attr('id')).val(elementValue).keyup(function (){cloning(this)});
    $(element).after('&nbsp;<input type="button" ' + ($(element).attr('disabled')?'disabled="disabled"':'') + ' value="delete" name="removeRow" onclick="removeClonedRow(this);"/><br />')
}

function removeClonedRow(element)
{
     $(element).prev().remove();
     $(element).next('br').remove();
     $(element).remove();
}

function removeClonedGroupRow(element)
{
    var group = $(element).parent().parent();
    $(element).parent().remove();
    changeCloneAttribsGroup(group);
}

function initField4Shema()
{
	$('.fields_div').sortable({
		connectWith: '.fields_div',
		cursor: 'move',
		placeholder: 'placeholder',
		forcePlaceholderSize: true,
		opacity: 0.4,
		stop: function(event, ui){
            var item = $(ui.item);
            updateFieldsValue();
            if (item.parent().attr('id') != ''){
                item.find('.field_edit').css('display', 'block');
            }
            if (item.parent().attr('id') == ''){
                item.find('.field_edit').css('display', 'none');
				item.find('.field_properties').css('display', 'none');
            }
		}
	}).disableSelection();
    $('.field_edit').click(function(){
        var block = $(this).parent().children('div');
        var link = $(this);
        if (block.css('display') == 'none'){
            link.html('<img width="20" height="20" src="images/ico_save.png" alt="Hide field properties" title="Hide field properties" />');
            block.slideDown();
        } else {
            link.html('<img width="20" height="20" src="images/ico_edit.png" alt="Show field properties" title="Show field properties" />');
            block.slideUp();
        }
        return false;
    }).parent().children('div').children('a').click(function(){
        if ($(this).prev().attr('tagName') == 'INPUT'){
            if ($(this).prev().val()){
                $(this).text('edit').prev('input').replaceWith('<span>' + $(this).prev().val() + '</span>');
            } else {
                $(this).text('add field name').prev('input').replaceWith('<span class="empty"></span>');
                $(this).prev().prev().remove();
            }
        } else {
            var span = $(this).text('save').prev('span');
            if (span.attr('class') == 'empty'){
                span.replaceWith('<label>Field Name:</label> <input type="text" class="field_name" value="" />');
            } else {
                span.replaceWith('<input type="text" class="field_name" value="' + $(this).prev('span').text() + '" />');
            }
        }
        return false;
    });
    updateFieldsValue();
}

function updateFieldsValue()
{
    var items = new Object();
    $('.fields_div').each(function(){
        var itemorder=$(this).sortable('toArray');
        var columnId=$(this).attr('id');
        if (columnId && itemorder.length > 0){
            items[columnId] = new Object();
            for (var key in itemorder){
                if (itemorder[key] != 'clear'){
                    var item = new Object();
                    if ($('#' + itemorder[key]).find('.field_name').size()){
                        $('#' + itemorder[key]).find('.field_name').replaceWith('<span>' + $('#' + itemorder[key]).find('.field_name').val() + '</span>').next('a').text('edit');
                        $('#' + itemorder[key]).children('.field_properties').find('span').next('a').text('edit');
                    }
                    item['name'] = $('#' + itemorder[key]).children('.field_properties').find('span').text();
                    item['weight'] = $('#' + itemorder[key]).children('.field_properties').find('input[type=text]').val();
                    //item['questionnaireName'] = ($('#' + itemorder[key]).children('.field_properties').find('input[type=checkbox]').attr('checked')?'y':'n');
                    items[columnId][itemorder[key]] = item;
                }
            }
        }
    });
    var jsonString = json_encode(items);
    $('#fields_value').val(jsonString);
}