%PDF- %PDF-
| Direktori : /home/infra/new-ong/bethemeold/visual-builder/assets/js/forms/fields/ |
| Current File : //home/infra/new-ong/bethemeold/visual-builder/assets/js/forms/fields/switch.js |
function mfn_field_switch(field) {
let classes = ['form-group', 'segmented-options'];
let ul_classes = [];
let value= '';
if( _.has(field, 'std') ){
value = field.std;
}
if( _.has(field, 'value') ){
value = field.value;
}
if( _.has(edited_item['attr'], field.old_id) || _.has(edited_item['attr'], field.id) ){
// deprecated id with style
if( _.has(edited_item['attr'], field.old_id) ){
value = edited_item['attr'][field.old_id];
}else if(_.has(edited_item['attr'], field.id)){
if( _.has(edited_item['attr'][field.id], 'val') ){
value = edited_item['attr'][field.id]['val'];
}else{
value = edited_item['attr'][field.id];
}
}
}else if( (edited_item.jsclass == 'pageoption' || edited_item.jsclass == 'themeoption') && _.has(edited_item, field.id) ){
// themeoption
//value = edited_item[field.id];
if( _.has(edited_item[field.id], 'val') ){
value = edited_item[field.id]['val'];
}else{
value = edited_item[field.id];
}
}
if( _.has(field, 'visual_options') ){
classes.push('visual-segmented-options');
}
if( _.has(field, 'version') && field.version == 'multiple' ){
classes.push('multiple-segmented-options');
}else{
classes.push('single-segmented-option');
}
classes.push('checkboxes-list');
if( _.has(field, 'invert') ){
classes.push('invert');
}
if( _.has(field, 'class') ){
classes.push(field.class);
}
if( _.has(field, 'active_tooltip') ){
classes.push('active-tooltip-ready');
}
if( _.has(field, 'preview') ){
ul_classes.push('preview-'+field.preview);
}
if( _.has(field, 'id') ){
ul_classes.push('preview-'+field.id+'input');
}
let html = `<div class="form-content"><div class="${classes.join(' ')}">
<div class="form-control">
<ul class="${ul_classes.join(' ')}">
${ !_.has(field, 'kl_options') && _.has(field, 'options') ? _.map(field.options, function(opt, o) {
let data_tags = '';
let checked = false;
if( _.has(field, 'visual_options') ) {
data_tags = `data-tooltip="${opt.replace('<span>', '').replace('</span>', '')}"`;
}
if( _.has(field, 'active_tooltip') ) {
data_tags += ` data-tooltip-active="${field['active_tooltip'][o].replace('<span>', '').replace('</span>', '').replace('<br>', '')}"`;
}
if( _.has(field, 'version') && field.version == 'multiple' ){
let exploded = value.split(' ');
if( value.includes(o) ) checked = true;
}else if( value == o ){
checked = true;
}
return `<li ${ checked ? 'class="active"' : '' } ${data_tags}>
<fieldset>
<input ${ checked ? 'checked' : '' } type="checkbox" class="mfn-field-value" value="${o}" name="${field.id}" autocomplete="off" />
${ _.has(field, 'visual_options') ? `<a href="#"><span class="img img-${o}">${ field['visual_options'][o] ? field['visual_options'][o] : '' }</span></a>` : `<a href="#"><span class="text">${opt}</span></a>` }
</fieldset>
</li>`;
}).join('') : '' }
${ _.has(field, 'kl_options') ? _.map(field.kl_options, function(opt, o) {
let data_tags = '';
let checked = false;
if( _.has(field, 'visual_options') ) {
data_tags = `data-tooltip="${opt.label.replace('<span>', '').replace('</span>', '')}"`;
}
if( _.has(field, 'active_tooltip') ) {
data_tags += ` data-tooltip-active="${field['active_tooltip'][opt.key].replace('<span>', '').replace('</span>', '').replace('<br>', '')}"`;
}
if( _.has(field, 'version') && field.version == 'multiple' ){
let exploded = value.split(' ');
if( value.includes(opt.key) ) checked = true;
}else if( value == opt.key ){
checked = true;
}
return `<li ${ checked ? 'class="active"' : '' } ${data_tags}>
<fieldset>
<input ${ checked ? 'checked' : '' } type="checkbox" class="mfn-field-value" value="${opt.key}" name="${field.id}" autocomplete="off" />
${ _.has(field, 'visual_options') ? `<a href="#"><span class="img img-${opt.key}">${ field['visual_options'][opt.key] ? field['visual_options'][opt.key] : '' }</span></a>` : `<a href="#"><span class="text">${opt.label}</span></a>` }
</fieldset>
</li>`;
}).join('') : '' }
</ul>
</div>
</div></div>`;
return html;
}