492 lines
19 KiB
JavaScript
492 lines
19 KiB
JavaScript
|
// Retrieve the initial data
|
||
|
function temporary() {
|
||
|
attributesArray.length = 0;
|
||
|
$('.attributes').each(function() {
|
||
|
var attributesData = {},
|
||
|
$selectType = $('.dataType').data().type;
|
||
|
|
||
|
// Capture "attributes-body" within the input[type = "text"] val
|
||
|
$(this).find('.attributes-body').find('input[type="text"]').each(function(i) {
|
||
|
var $type = $(this).data().type;
|
||
|
attributesData[$type] = $(this).val();
|
||
|
});
|
||
|
|
||
|
// Capture "attributes-body" within the input[type = "radio"] checked
|
||
|
$(this).find('.attributes-body').find('input[type="radio"]').each(function(i) {
|
||
|
var $type = $(this).data().type;
|
||
|
attributesData[$type] = $(this).prop("checked");
|
||
|
});
|
||
|
|
||
|
// Capture "attributes-body" within the dataType selected
|
||
|
$(this).find('.attributes-body').find('.dataType').children("option:selected").each(function () {
|
||
|
attributesData[$selectType] = {};
|
||
|
attributesData[$selectType].index = $(this).index();
|
||
|
attributesData[$selectType].name = $(this).attr('ref');
|
||
|
if($(this).attr('ref') == 'typeB' || $(this).attr('ref') == 'typeE' || $(this).attr('ref') == 'typeF') {
|
||
|
attributesData[$selectType].option = [];
|
||
|
}
|
||
|
});
|
||
|
|
||
|
// Capture "field-type" within the input[type = "text"] val
|
||
|
$(this).find('.field-type').find('input[type="text"]').each(function(i) {
|
||
|
var $type = $(this).data().type;
|
||
|
if(!$type.match('option_lang')) {
|
||
|
attributesData[$selectType][$type] = $(this).val();
|
||
|
}
|
||
|
});
|
||
|
|
||
|
$(this).find('.field-type .add-target').find('.input-append').each(function() {
|
||
|
var append = []
|
||
|
$(this).children('input[type="text"]').each(function() {
|
||
|
var val = $(this).val();
|
||
|
append.push(val);
|
||
|
});
|
||
|
attributesData[$selectType].option.push(append);
|
||
|
})
|
||
|
|
||
|
// Capture "field-type" within the input[type = "checkbox"] checked
|
||
|
$(this).find('.field-type').find('input[type="checkbox"]').each(function() {
|
||
|
var $type = $(this).data().type;
|
||
|
attributesData[$selectType][$type] = $(this).prop("checked");
|
||
|
});
|
||
|
|
||
|
// Capture "field-type" within the input[type = "radio"] checked
|
||
|
$(this).find('.field-type').find('input[type="radio"]').each(function() {
|
||
|
var $type = $(this).data().type;
|
||
|
attributesData[$selectType][$type] = $(this).prop("checked");
|
||
|
});
|
||
|
|
||
|
// Capture "field-type" within the dataType selected
|
||
|
$(this).find('.field-type').find('select').children("option:selected").each(function () {
|
||
|
attributesData[$selectType].dateFormat = $(this).index();
|
||
|
});
|
||
|
|
||
|
attributesArray.push(attributesData);
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Determine the Append input length
|
||
|
function inputAppendLength() {
|
||
|
$('.add-target').each(function(i) {
|
||
|
if($(this).children('.input-append:not(:hidden)').length == 1 || $(this).children('.input-append').length == 1) {
|
||
|
$(this).children('.input-append').each(function() {
|
||
|
if($(this).children('div').hasClass('tab-content')) {
|
||
|
var btnLength = $(this).children('.btn').length;
|
||
|
$(this).find('.btn').eq(btnLength-2).addClass('last');
|
||
|
$(this).find('.remove-input').addClass('hide');
|
||
|
} else {
|
||
|
var mediumLength = $(this).children('.input-medium').length;
|
||
|
$(this).children('.input-medium').eq(mediumLength-1).addClass('last');
|
||
|
$(this).children('.remove-input').addClass('hide');
|
||
|
}
|
||
|
});
|
||
|
} else {
|
||
|
$(this).children('.input-append').each(function() {
|
||
|
if($(this).children('div').hasClass('tab-content')) {
|
||
|
$(this).find('.btn').removeClass('last');
|
||
|
$(this).find('.remove-input').removeClass('hide');
|
||
|
} else {
|
||
|
$(this).children('.input-medium').removeClass('last');
|
||
|
$(this).children('.remove-input').removeClass('hide');
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
|
||
|
// Role Attribute Template Data
|
||
|
function setData(l, type, ol) {
|
||
|
var fields = $('#info').length ? "info[attribute_fields]" : $('#sub_role').length ? "sub_role[attribute_fields]" : "role[attribute_fields]",
|
||
|
data = {
|
||
|
_add_more: ["add_more_" +l, fields+"["+l+"]["+type+"][add_more]"],
|
||
|
_calendar: ["calendar_" +l, fields+"["+l+"]["+type+"][calendar]"],
|
||
|
_cross_lang: ["cross_lang_" +l, fields+"["+l+"]["+type+"][cross_lang]"],
|
||
|
_disabled: ["disabled_" +l, fields+"["+l+"][disabled]"],
|
||
|
_format: ["format_" +l, fields+"["+l+"]["+type+"][format]"],
|
||
|
_initial: ["initial_" +l, fields+"["+l+"]["+type+"][initial]"],
|
||
|
_is_range: ["is_range_" +l, fields+"["+l+"]["+type+"][is_range]"],
|
||
|
_key: ["key_" +l, fields+"["+l+"][key]"],
|
||
|
_markup: fields+"["+l+"][markup]",
|
||
|
_option_list: ["option_list_"+l+"_"+ol, fields+"["+l+"]["+type+"][option_list]["+ol+"]", "option_list_"+ol],
|
||
|
_placeholder: ["placeholder_" +l, fields+"["+l+"]["+type+"][placeholder]"],
|
||
|
_title_translations: ["title_translations_" +l, fields+"["+l+"][title_translations]"],
|
||
|
_to_delete: ["to_delete_" +l, fields+"["+l+"][to_delete]"],
|
||
|
_to_search: ["to_search_" +l, fields+"["+l+"][to_search]"],
|
||
|
_to_show: ["to_show_" +l, fields+"["+l+"][to_show]"],
|
||
|
};
|
||
|
return data;
|
||
|
}
|
||
|
|
||
|
// Get Default Address Form
|
||
|
function getAddressForm(trigger, element, decide) {
|
||
|
if(decide) {
|
||
|
addressVal.length = addressArray.length = 0;
|
||
|
var addressAllVal = [];
|
||
|
var inputNameArray = [];
|
||
|
trigger.closest('.input-append').find('.tab-pane').each(function() {
|
||
|
var adderssText = $(this).children('input[type="text"]').val(),
|
||
|
addersshidden = '',
|
||
|
addressData = {},
|
||
|
inputName = [];
|
||
|
$(this).children('input:not(:first)').each(function(j) {
|
||
|
var name = $(this).attr('name'),
|
||
|
val = $(this).val();
|
||
|
addersshidden += val;
|
||
|
addressData[name] = val;
|
||
|
inputName.push(name);
|
||
|
});
|
||
|
addressArray.push(addressData);
|
||
|
addressAllVal.push(adderssText);
|
||
|
inputNameArray.push(inputName);
|
||
|
if(adderssText != addersshidden) {
|
||
|
addressVal.push(false);
|
||
|
} else {
|
||
|
addressVal.push(true);
|
||
|
}
|
||
|
});
|
||
|
element.find('.tab-pane').each(function(i) {
|
||
|
$(this).find('textarea, input[type="text"]').each(function(j) {
|
||
|
$(this).attr('name',inputNameArray[i][j]);
|
||
|
});
|
||
|
if(addressVal[i]) {
|
||
|
$(this).find('textarea, input[type="text"]').each(function(j) {
|
||
|
$(this).val(addressArray[i][$(this).attr('name')]);
|
||
|
});
|
||
|
} else {
|
||
|
$(this).find('textarea').val(addressAllVal[i]);
|
||
|
$(this).find('input[type="text"]').each(function(j) {
|
||
|
$(this).val('');
|
||
|
});
|
||
|
}
|
||
|
});
|
||
|
};
|
||
|
element.off('show');
|
||
|
};
|
||
|
|
||
|
// Return Address Form
|
||
|
function returnAddressForm(element, decide) {
|
||
|
if(decide) {
|
||
|
addressArray.length = 0;
|
||
|
element.find('.tab-pane').each(function(i) {
|
||
|
var addressData = {};
|
||
|
$(this).find('textarea, input[type="text"]').each(function(j) {
|
||
|
var name = $(this).attr('name'),
|
||
|
val = $(this).val();
|
||
|
addressData[name] = val;
|
||
|
});
|
||
|
addressArray.push(addressData);
|
||
|
});
|
||
|
$.map(addressInputId, function(n, i) {
|
||
|
var v = '';
|
||
|
$('#'+n).find('input[type="hidden"]').each(function() {
|
||
|
$(this).val(addressArray[i][$(this).attr('name')]);
|
||
|
v += addressArray[i][$(this).attr('name')]
|
||
|
});
|
||
|
$('#'+n).find('input[type="text"]').each(function() {
|
||
|
$(this).val(v);
|
||
|
});
|
||
|
});
|
||
|
};
|
||
|
returnDecide = false;
|
||
|
};
|
||
|
|
||
|
$(function() {
|
||
|
appendIndex = null;
|
||
|
if($('#user-forms').length) {
|
||
|
addressVal = [];
|
||
|
addressArray = [];
|
||
|
addressInputId = [];
|
||
|
roleType = null;
|
||
|
returnDecide = false;
|
||
|
$('.attributes').each(function() {
|
||
|
if($(this).find('.toggle-check').attr('value') == "true") {
|
||
|
$(this).addClass('disabled').children('.attributes-body').hide();
|
||
|
}
|
||
|
});
|
||
|
$('.returnDecide').on(clickEvent, function() {
|
||
|
returnDecide = true;
|
||
|
})
|
||
|
$('#address-field').on('hidden', function () {
|
||
|
$('.btn[data-toggle="modal"]').removeClass('active').blur();
|
||
|
$(this).find('.nav-tabs > li').removeClass('active').eq(0).addClass('active');
|
||
|
$(this).find('.tab-content > .tab-pane').removeClass('active in').eq(0).addClass('active in');
|
||
|
$(this).on('show', getAddressForm(null, $(this), false));
|
||
|
returnAddressForm($(this), returnDecide)
|
||
|
});
|
||
|
$('.control-group').delegate('.btn[data-toggle="modal"]', 'click', function() {
|
||
|
var $trigger = $(this);
|
||
|
addressInputId.length = 0;
|
||
|
$(this).closest('.input-append').find('.tab-pane').each(function() {
|
||
|
addressInputId.push($(this).attr('id'));
|
||
|
});
|
||
|
$('#address-field').on('show', getAddressForm($trigger, $('#address-field'), true));
|
||
|
});
|
||
|
$('#user-forms').delegate('.togglebox, .delete, .trigger, .remove-input', clickEvent, function(event) {
|
||
|
if($(this).hasClass('togglebox')) {
|
||
|
if($(this).hasClass('disable')) {
|
||
|
$(this).find('.toggle-check')
|
||
|
.attr('value', 'false')
|
||
|
.closest('.attributes')
|
||
|
.removeClass('disabled')
|
||
|
.children('.attributes-body')
|
||
|
.fadeIn(300);
|
||
|
} else {
|
||
|
$(this).find('.toggle-check')
|
||
|
.attr('value', 'true')
|
||
|
.closest('.attributes')
|
||
|
.addClass('disabled')
|
||
|
.children('.attributes-body')
|
||
|
.fadeOut(300);
|
||
|
}
|
||
|
$(this).toggleClass('disable');
|
||
|
};
|
||
|
if($(this).hasClass('remove-input')) {
|
||
|
$(this).closest('.input-append').fadeOut(300, function() {
|
||
|
$(this).remove();
|
||
|
inputAppendLength();
|
||
|
});
|
||
|
};
|
||
|
if($(this).hasClass('trigger')) {
|
||
|
appendIndex = $(this).closest('.controls').find('.input-append').length;
|
||
|
nameNumber = $(this).closest('.controls').find('.input-append:eq(0)').find('input').eq(0).attr('name');
|
||
|
nameNumber = nameNumber.match(/[^[\D\]]+(?=])/g)[0];
|
||
|
roleType = $(this).data('roles')
|
||
|
if($(this).hasClass('textInput')) {
|
||
|
$("#template-text").tmpl().appendTo($(this).closest('.controls').find('.add-target'));
|
||
|
} else if ($(this).hasClass('textLengInput')) {
|
||
|
$("#template-text-language").tmpl().appendTo($(this).closest('.controls').find('.add-target'));
|
||
|
} else if ($(this).hasClass('address')) {
|
||
|
$("#template-address").tmpl().appendTo($(this).closest('.controls').find('.add-target'));
|
||
|
}
|
||
|
inputAppendLength();
|
||
|
};
|
||
|
event.preventDefault();
|
||
|
});
|
||
|
inputAppendLength();
|
||
|
} else {
|
||
|
attributesArray = [];
|
||
|
attributesHeaderLength = null;
|
||
|
templateType = null;
|
||
|
attributeIndex = null;
|
||
|
if($('.add-target').length) {
|
||
|
inputAppendLength();
|
||
|
}
|
||
|
if(!$('.attributes').length) {
|
||
|
$('#attributes-area').addClass('clickHere');
|
||
|
} else {
|
||
|
temporary();
|
||
|
};
|
||
|
|
||
|
$('.add-attributes').on(clickEvent, function() {
|
||
|
if($('#attributes-area').hasClass('clickHere')) {
|
||
|
$('#attributes-area').removeClass('clickHere');
|
||
|
};
|
||
|
attributesHeaderLength = $('.attributes:not(:hidden)').length+1;
|
||
|
attributesLength = $('#attributes-area .attributes').length;
|
||
|
$("#template-attributes").tmpl(setData(attributesLength, templateType, appendIndex)).appendTo( "#attributes-area" );
|
||
|
$('.toggle-check').togglebox();
|
||
|
});
|
||
|
|
||
|
|
||
|
|
||
|
$('.attributes.default').each(function(i) {
|
||
|
$(this).children('.field-type').not('.default').hide();
|
||
|
$(this).find('input[type="text"]').on('keyup', function() {
|
||
|
$(this).trigger("checking");
|
||
|
});
|
||
|
$(this).find('input[type="radio"], input[type="checkbox"], select').change(function() {
|
||
|
$(this).trigger("checking");
|
||
|
});
|
||
|
$(this).delegate('input[type="text"], input[type="radio"], input[type="checkbox"], select', 'checking', function(e) {
|
||
|
var e = e.target.type,
|
||
|
$data = $(this).data().type;
|
||
|
switch(e) {
|
||
|
case 'text':
|
||
|
var val = $(this).val();
|
||
|
if(!$(this).closest('.field-type').length) {
|
||
|
$data = attributesArray[i][$data];
|
||
|
} else if(!$(this).closest('.add-target').length) {
|
||
|
$data = attributesArray[i].select[$data];
|
||
|
} else {
|
||
|
appendIndex = $(this).parent('.input-append').index()
|
||
|
optionIndex = $(this).index()
|
||
|
$data = attributesArray[i].select.option[appendIndex][optionIndex];
|
||
|
}
|
||
|
if(val != $data) {
|
||
|
$(this).closest('.attributes').find('.reply').removeClass('hide');
|
||
|
}
|
||
|
break;
|
||
|
case 'radio':
|
||
|
var checked = $(this).prop("checked");
|
||
|
$data = attributesArray[i][$data];
|
||
|
if(checked != $data) {
|
||
|
$(this).closest('.attributes').find('.reply').removeClass('hide');
|
||
|
}
|
||
|
break;
|
||
|
case 'checkbox':
|
||
|
var checked = $(this).prop("checked");
|
||
|
$data = attributesArray[i].select[$data];
|
||
|
if(checked != $data) {
|
||
|
$(this).closest('.attributes').find('.reply').removeClass('hide');
|
||
|
}
|
||
|
break;
|
||
|
case 'select-one':
|
||
|
var ref,
|
||
|
$data = attributesArray[i].select.name;
|
||
|
$(this).children("option:selected").each(function() {
|
||
|
ref = $(this).attr('ref');
|
||
|
});
|
||
|
if(ref != $data) {
|
||
|
$(this).closest('.attributes').find('.reply').removeClass('hide');
|
||
|
}
|
||
|
break;
|
||
|
};
|
||
|
});
|
||
|
$(this).delegate('.reply', clickEvent, function() {
|
||
|
var $bodyText = $(this).parent('.attributes-header').siblings('.attributes-body').find('input[type="text"]'),
|
||
|
$bodyRadio = $(this).parent('.attributes-header').siblings('.attributes-body').find('input[type="radio"]'),
|
||
|
$bodySelected = $(this).parent('.attributes-header').siblings('.attributes-body').find('.dataType').children("option"),
|
||
|
$fieldTypeO = $(this).parent('.attributes-header').siblings('.field-type.default'),
|
||
|
$fieldTypeN = $(this).parent('.attributes-header').siblings('.field-type').not('.default');
|
||
|
$bodyText.each(function() {
|
||
|
var $type = $(this).data().type;
|
||
|
$(this).val(attributesArray[i][$type]);
|
||
|
});
|
||
|
$bodyRadio.each(function() {
|
||
|
var $type = $(this).data().type;
|
||
|
$(this).prop("checked", attributesArray[i][$type])
|
||
|
});
|
||
|
$fieldTypeO.find('input[type="text"]').each(function() {
|
||
|
var $type = $(this).data().type;
|
||
|
if(!$type.match('option_lang')) {
|
||
|
$(this).val(attributesArray[i].select[$type]);
|
||
|
}
|
||
|
});
|
||
|
$fieldTypeO.find('.add-target').find('.input-append').each(function(k) {
|
||
|
$(this).children('input[type="text"]').each(function(j) {
|
||
|
$(this).val(attributesArray[i].select.option[k][j]);
|
||
|
// var val = $(this).val();
|
||
|
// append.push(val);
|
||
|
});
|
||
|
})
|
||
|
$fieldTypeO.find('input[type="checkbox"], input[type="radio"]').each(function() {
|
||
|
var $type = $(this).data().type;
|
||
|
$(this).prop("checked", attributesArray[i].select[$type]);
|
||
|
});
|
||
|
$fieldTypeO.find('select').children("option").eq(attributesArray[i].select.dateFormat).prop('selected',true);
|
||
|
$bodySelected.eq(attributesArray[i].select.index).prop('selected',true);
|
||
|
$fieldTypeO.show();
|
||
|
$fieldTypeN.empty().hide();
|
||
|
$(this).addClass('hide')
|
||
|
return false
|
||
|
})
|
||
|
});
|
||
|
$('#attributes-area').delegate('.togglebox, .delete, .trigger, .remove-input', clickEvent, function(event) {
|
||
|
if($(this).hasClass('togglebox')) {
|
||
|
if($(this).hasClass('disable')) {
|
||
|
$(this).find('.toggle-check')
|
||
|
.attr('value', 'false')
|
||
|
.closest('.attributes')
|
||
|
.removeClass('disabled')
|
||
|
.find('input, select')
|
||
|
.removeAttr('disabled')
|
||
|
.end('.attributes')
|
||
|
.find('.btn-group .btn')
|
||
|
.removeClass('disabled')
|
||
|
.end().find('.attribute_field_disabled').attr('value', 'false');
|
||
|
if($(this).closest('.attributes').find('.dataType').children("option:selected").attr('ref')) {
|
||
|
$(this).closest('.attributes').find('.field-type').addClass('in').find('.control-group').delay(150).fadeIn(300);
|
||
|
}
|
||
|
} else {
|
||
|
$(this).find('.toggle-check')
|
||
|
.attr('value', 'true')
|
||
|
.closest('.attributes')
|
||
|
.addClass('disabled')
|
||
|
.find('.attributes-body input, .attributes-body select')
|
||
|
.attr({'disabled': 'disabled'})
|
||
|
.end('.attributes')
|
||
|
.find('.btn-group .btn')
|
||
|
.addClass('disabled')
|
||
|
.end().find('.attribute_field_disabled').attr('value', 'true')
|
||
|
.end().find('.field-type .control-group').fadeOut(300, function() {
|
||
|
$(this).parent('.field-type').removeClass('in');
|
||
|
});
|
||
|
}
|
||
|
$(this).toggleClass('disable');
|
||
|
};
|
||
|
if($(this).hasClass('delete')) {
|
||
|
$(this).closest('.attributes').fadeOut(300, function() {
|
||
|
$('.attributes:not(:hidden)').each(function(i) {
|
||
|
$(this).find('.attributes-header h4 span').text(i+1);
|
||
|
});
|
||
|
attributesHeaderLength = $('.attributes:not(:hidden)').length+1;
|
||
|
if(!$('.attributes:not(:hidden)').length) {
|
||
|
$('#attributes-area').addClass('clickHere');
|
||
|
};
|
||
|
}).find('.attribute_field_to_delete').attr('value', 'true');;
|
||
|
};
|
||
|
if($(this).hasClass('trigger')) {
|
||
|
// appendIndex = $(this).closest('.controls').find('.input-append').length;
|
||
|
appendIndex = $(this).closest('.controls').find('.input-append:last-child').children('input:first-child').attr('name');
|
||
|
// appendIndex = appendIndex.split("][");
|
||
|
// appendIndex = parseInt(appendIndex[appendIndex.length-2])+1;
|
||
|
appendIndex = parseInt(appendIndex.match(/[^[\D\]]+(?=])/g)[1])+1;
|
||
|
console.log(appendIndex)
|
||
|
attributeIndex = $(this).closest('.attributes').index();
|
||
|
templateType = $(this).closest('.attributes').find('.dataType').children("option:selected").attr('ref');
|
||
|
$("#template-input-append").tmpl(setData(attributeIndex, templateType, appendIndex)).appendTo($(this).closest('.controls').find('.add-target'));
|
||
|
inputAppendLength();
|
||
|
};
|
||
|
if($(this).hasClass('remove-input')) {
|
||
|
$(this).parent('.input-append').fadeOut(300, function() {
|
||
|
$(this).remove()
|
||
|
inputAppendLength();
|
||
|
});
|
||
|
|
||
|
}
|
||
|
event.preventDefault();
|
||
|
});
|
||
|
$('#attributes-area').delegate('.dataType', 'change', function() {
|
||
|
$(this).children("option:selected").each(function () {
|
||
|
var target = $(this).closest('.attributes').find('.field-type').not('.default');
|
||
|
attributeIndex = $(this).closest('.attributes').index();
|
||
|
appendIndex = 0
|
||
|
// $(this).closest('.attributes').find('.add-target').find('.input-append').length;
|
||
|
if($(this).closest('.attributes').hasClass('default')){
|
||
|
var i = $(this).closest('.attributes').index()
|
||
|
if($(this).attr('ref') == attributesArray[i].select.name) {
|
||
|
$(this).closest('.attributes').find('.field-type.default').show()
|
||
|
target.empty().hide();
|
||
|
} else {
|
||
|
$(this).closest('.attributes').find('.field-type.default').hide()
|
||
|
if($(this).attr('ref')) {
|
||
|
templateType = $(this).attr('ref');
|
||
|
target.removeAttr('class').addClass('field-type fade in ' + templateType).empty();
|
||
|
$("#template-type").tmpl(setData(attributeIndex, templateType, appendIndex)).appendTo(target);
|
||
|
if(templateType == 'typeB' || templateType == 'typeE' || templateType == 'typeF') {
|
||
|
inputAppendLength();
|
||
|
}
|
||
|
} else {
|
||
|
target.removeAttr('class').addClass('field-type fade')
|
||
|
target.empty();
|
||
|
};
|
||
|
target.show();
|
||
|
}
|
||
|
} else {
|
||
|
if($(this).attr('ref')) {
|
||
|
templateType = $(this).attr('ref');
|
||
|
target.removeAttr('class').addClass('field-type fade in ' + templateType).empty();
|
||
|
$("#template-type").tmpl(setData(attributeIndex, templateType, appendIndex)).appendTo(target);
|
||
|
if(templateType == 'typeB' || templateType == 'typeE' || templateType == 'typeF') {
|
||
|
inputAppendLength();
|
||
|
}
|
||
|
} else {
|
||
|
target.removeAttr('class').addClass('field-type fade')
|
||
|
target.empty();
|
||
|
};
|
||
|
}
|
||
|
});
|
||
|
});
|
||
|
}
|
||
|
});
|