File: /var/www/lipovac/wp-content/plugins/js_composer/assets/js/backend/composer-automapper.js
/* =========================================================
* composer-automapper.js v0.2.1
* =========================================================
* Copyright 2013 Wpbakery
*
* Visual composer automapper for shortcodes
* ========================================================= */
var vc_am = {
current_form: false
};
(function ( $ ) {
"use strict";
_.extend( wp.shortcode.prototype, {
taggedString: function () {
var text = '[<span class="vc_preview-tag">' + this.tag + '</span>';
_.each( this.attrs.numeric, function ( value ) {
if ( /\s/.test( value ) ) {
text += ' <span class="vc_preview-param">"' + value + '"</span>';
} else {
text += ' <span class="vc_preview-param">' + value + '</span>';
}
} );
_.each( this.attrs.named, function ( value, name ) {
text += ' <span class="vc_preview-param">' + name + '="' + value + '"</span>';
} );
// If the tag is marked as `single` or `self-closing`, close the
// tag and ignore any additional content.
if ( 'single' === this.type ) {
return text + ']';
} else if ( 'self-closing' === this.type ) {
return text + ' /]';
}
// Complete the opening tag.
text += ']';
if ( this.content ) {
text += '<span class="vc_preview-content">' + this.content + '</span>';
}
// Add the closing tag.
return text + '[/<span class="vc_preview-tag">' + this.tag + '</span>]';
}
} );
wp.shortcode.atmPreview = function ( options ) {
return new wp.shortcode( options ).taggedString();
};
var message_timer, show_message = function ( text, type ) {
if ( message_timer ) {
window.clearTimeout( message_timer );
$( '.vc_settings-automapper' ).remove();
message_timer = false;
}
var $message = $( '<div class="vc_atm-message updated' + (type ? ' vc_message-' + type : '') + '" style="display: none;"></div>' );
$message.text( text );
$message.prependTo( $( '#vc_settings-automapper' ) ).fadeIn( 500, function () {
var $message = $( this );
window.setTimeout( function () {
$message.remove();
}, 2000 );
} );
},
template_options = {
evaluate: /<#([\s\S]+?)#>/g,
interpolate: /\{\{\{([\s\S]+?)\}\}\}/g,
escape: /\{\{([^\}]+?)\}\}(?!\})/g
},
to_title = function ( string ) {
string = string.replace( /_|-/, ' ' );
return string.charAt( 0 ).toUpperCase() + string.slice( 1 );
};
var showMessageMore = function ( text, typeClass, timeout, remove ) {
if ( remove ) {
$( '.vc_atm-message' ).remove();
}
var $message = $( '<div class="vc_atm-message ' + (typeClass ? typeClass : '') + '" style="display: none;"></div>' );
$message.text( text );
if ( ! _.isUndefined( timeout ) ) {
window.setTimeout( function () {
$message.remove();
}, timeout );
}
return $message;
};
var showValidationError = function ( text, $el ) {
if ( _.isUndefined( $el ) || ! $el.length ) {
$el = $( '.tab_intro' );
}
showMessageMore( text, 'error', undefined, true ).insertBefore( $el ).fadeIn( 500 );
};
var request_url = window.ajaxurl + '?vc_action=automapper',
sync_callback = function ( method, model, options ) {
var data;
if ( method === 'create' ) {
model.set( 'id', window.vc_guid() );
data = {
vc_action: 'create',
data: model.toJSON()
};
} else if ( method === 'update' ) {
data = {
vc_action: 'update',
id: model.get( 'id' ),
data: model.toJSON()
};
} else if ( method === 'delete' ) {
data = {
vc_action: 'delete',
id: model.get( 'id' )
};
} else {
data = {
vc_action: 'read'
};
}
$.ajax( {
method: 'POST',
url: request_url,
dataType: 'json',
data: _.extend( data, { action: 'vc_automapper' } ),
context: this
} ).done( function ( data ) {
var result = model;
if ( data && method === 'read' ) {
result = data;
}
// Response
if ( result ) {
(method === 'read') && options.success( result );
} else {
options.error( "Not found" );
}
} ).error( function ( data ) {
} );
};
var ShortcodeModel = Backbone.Model.extend( {
defaults: function () {
return {
tag: '',
name: '',
category: '',
description: '',
params: []
};
},
sync: sync_callback
} );
var ShortcodesCollection = Backbone.Collection.extend( {
model: ShortcodeModel,
sync: sync_callback
} );
vc_am.shortcodes = new ShortcodesCollection;
var ShortcodeView = Backbone.View.extend( {
tagName: 'li',
// className: 'vc_automapper-item',
className: 'widget',
events: {
'click .vc_automapper-edit-btn': 'edit',
'click h4, widget-action': 'edit',
'click .vc_automapper-delete-btn': 'clear'
},
template_html: $( '#vc_automapper-item-tpl' ).html() || '<span>{{ tag }}</span>',
initialize: function () {
this.listenTo( this.model, 'change', this.render );
this.listenTo( this.model, 'destroy', this.removeView )
},
render: function () {
this.$el.html( _.template( this.template_html,
this.model.toJSON(),
template_options ) ).attr( 'data-item-id', this.model.get( 'id' ) );
return this;
},
edit: function ( e ) {
e && e.preventDefault();
new EditFormView( { model: this.model } ).render();
},
clear: function ( e ) {
e && e.preventDefault();
if ( confirm( window.i18nLocaleVcAutomapper.are_you_sure_delete ) ) {
this.model.destroy();
}
},
removeView: function () {
this.$el.remove();
}
} );
var FormView = Backbone.View.extend( {
render: function () {
vc_am.current_form && vc_am.current_form.close();
vc_am.current_form = this;
return this;
},
getType: function () {
return 'form';
},
validate: function ( attrs ) {
var result = false;
if ( ! attrs.name ) {
return window.i18nLocaleVcAutomapper.error_shortcode_name_is_required;
}
if ( ! attrs.tag || ! attrs.tag.match( /^\S+$/ ) ) {
return window.i18nLocaleVcAutomapper.error_enter_valid_shortcode_tag;
}
var fields_required = [
'param_name',
'heading',
'type'
];
_.each( attrs.params, function ( param ) {
_.each( fields_required, function ( field ) {
if ( param[ field ] === '' ) {
result = window.i18nLocaleVcAutomapper.error_enter_required_fields // '';
} else if ( field == 'param_name' && ! param[ field ].match( /^[a-z0-9_]+$/g ) ) {
result = window.i18nLocaleVcAutomapper.error_enter_required_fields;
}
}, this );
}, this );
return result || null;
},
isValid: function ( data ) {
this.validationError = this.validate( data );
return this.validationError ? false : true;
},
close: function ( e ) {
e && e.preventDefault();
vc_am.current_form = false;
this.remove();
}
} );
var ComplexShortcodeView = Backbone.View.extend( {
_$widget_title: false,
_$form_view: false,
edit_view: false,
tagName: 'li',
className: 'widget',
events: {
'click .vc_automapper-edit-btn': 'edit',
'click h4, .widget-action': 'edit'
},
template_html: $( '#vc_automapper-item-complex-tpl' ).html() || '<span>{{ tag }}</span>',
header_template_html: '<h4>{{ name }}<span class="in-widget-title"></span></h4>',
initialize: function () {
_.bindAll( this, 'removeEditForm' );
// this.listenTo(this.model, 'change', this.renderTitle);
this.listenTo( this.model, 'destroy', this.removeView );
this.model.view = this;
},
render: function () {
this.$el.html( _.template( this.template_html,
this.model.toJSON(),
template_options ) ).attr( 'data-item-id', this.model.get( 'id' ) );
return this;
},
renderTitle: function () {
this.$widgetTitle().html( _.template( this.header_template_html, this.model.toJSON(), template_options ) );
},
edit: function ( e ) {
e && e.preventDefault();
if ( this.$editForm().is( ':animated' ) ) {
return false;
}
this.$el.addClass( 'vc_opened' );
if ( this.edit_view ) {
this.close();
} else {
this.edit_view = new EditFormInnerView( { model: this.model } ).render();
}
},
$widgetTitle: function () {
if ( ! this._$widget_title ) {
this._$widget_title = this.$el.find( '.widget-title' );
}
return this._$widget_title;
},
$editForm: function () {
if ( ! this._$edit_form ) {
this._$edit_form = this.$el.find( '.widget-inside' );
}
return this._$edit_form;
},
removeEditForm: function () {
this.edit_view && this.edit_view.remove();
this.edit_view = false;
},
beforeSave: function () {
this.$el.find( '#vc_atm-name' ).val( $( '#vc_atm-header-name' ).val() );
},
close: function () {
vc_am.current_form = false;
this.$el.removeClass( 'vc_opened' );
this.renderTitle();
this.$editForm().slideUp( 200 );
this.removeEditForm(); // delayed call causes bug with empty params(remove called with delay)
},
clear: function ( e ) {
e && e.preventDefault();
this.model.destroy();
},
removeView: function () {
this.remove();
}
} );
var AddFormView = FormView.extend( {
className: 'vc_add-form-atm',
template_html: $( '#vc_automapper-add-form-tpl' ).html(),
events: {
'click #vc_atm-parse-string': 'parseShortcode',
'click .vc_atm-cancel': 'close'
},
getType: function () {
return 'create';
},
render: function () {
AddFormView.__super__.render.call( this );
this.$el.html( _.template( this.template_html, {}, template_options ) );
this.$el.insertAfter( '.vc_automapper-toolbar' );
return this;
},
parseShortcode: function ( e ) {
var string, matches, data, params = [], attr;
e && e.preventDefault && e.preventDefault();
string = $( '#vc_atm-shortcode-string' ).val();
if ( _.isEmpty( string ) ) {
this.$el.addClass( 'form-invalid' );
showValidationError( window.i18nLocaleVcAutomapper.error_enter_valid_shortcode, this.$el );
return false;
}
matches = string.match( vc_regexp_shortcode() );
if ( ! matches ) {
this.$el.addClass( 'form-invalid' );
showValidationError( window.i18nLocaleVcAutomapper.error_enter_valid_shortcode, this.$el );
return false;
}
attr = wp.shortcode.attrs( matches[ 3 ] );
_.each( attr.named, function ( value, key ) {
params.push( {
param_name: key,
type: "textfield",
heading: to_title( key ),
description: 'Example: ' + value,
value: value
} );
}, this );
if ( matches[ 5 ] ) {
params.push( {
param_name: 'content',
type: "textarea",
heading: 'Content',
description: '',
value: matches[ 5 ]
} );
}
data = {
tag: matches[ 2 ],
name: to_title( matches[ 2 ] ),
category: window.i18nLocaleVcAutomapper.my_shortcodes_category,
params: params
};
if ( this.isValid( data ) ) {
vc_am.shortcodes.create( data );
show_message( window.i18nLocaleVcAutomapper.new_shortcode_mapped, 'success' );
// new EditFormView({model: vc_am.shortcodes.last()}).render();
$( '.vc_atm-message' ).remove();
vc_am.shortcodes.last().view.edit();
} else {
this.$el.addClass( 'form-invalid' );
showValidationError( this.validationError );
}
}
} );
var EditFormView = FormView.extend( {
className: 'vc_edit-form',
active_preview: false,
events: {
'click #vc_atm-save': 'save',
'click .vc_atm-cancel': 'close',
'click .vc_atm-delete': 'clear',
'click #vc_atm-add-param': 'addParam',
'click .vc_delete-param': 'deleteParam',
'change #vc_atm-is-container': 'setContentParam',
'keyup .vc_param-name, .vc_param-value, #vc_atm-tag': 'setPreview',
'focus #vc_atm-tag': 'setTagFieldActive',
'focus .vc_params input, .vc_params textarea': 'setParamFieldActive',
'focus .vc_param.vc_content input, .vc_param.vc_content textarea': 'setContentParamFieldActive',
'blur #vc_atm-tag, vc_param input': 'unsetFieldActive',
'change .vc_param-field [name="type"]': 'changeParamType'
},
new: false,
template_html: $( '#vc_automapper-form-tpl' ).html(),
param_template_html: $( '#vc_atm-form-param-tpl' ).html(),
getType: function () {
return 'edit';
},
render: function () {
EditFormView.__super__.render.call( this );
this.$el.html( _.template( this.template_html, this.model.toJSON(), template_options ) );
this.$el.insertAfter( $( '[data-item-id=' + this.model.id + ']' ).hide() );
this.addAllParams();
return this;
},
changeParamType: function ( e ) {
var $this, $parent;
$this = $( e.currentTarget );
$parent = $this.parents( '.vc_fields' );
if ( $this.val() === 'hidden' ) {
$parent.find( '[name="heading"]' ).attr( 'disabled', true );
$parent.find( '[name="description"]' ).attr( 'disabled', true );
} else {
$parent.find( '[name="heading"]' ).attr( 'disabled', false );
$parent.find( '[name="description"]' ).attr( 'disabled', false );
}
},
setTagFieldActive: function ( e ) {
this.active_preview && $( this.active_preview ).removeClass( 'vc_active' );
this.active_preview = '#vc_shortcode-preview .vc_preview-tag';
$( this.active_preview ).addClass( 'vc_active' );
},
setParamFieldActive: function ( e ) {
var $control = $( e.currentTarget ),
index = $control.parents( '.vc_param:first' ).index();
this.active_preview && $( this.active_preview ).removeClass( 'vc_active' );
this.active_preview = '#vc_shortcode-preview .vc_preview-param:eq(' + index + ')';
$( this.active_preview ).addClass( 'vc_active' );
},
setContentParamFieldActive: function ( e ) {
this.active_preview && $( this.active_preview ).removeClass( 'vc_active' );
this.active_preview = '#vc_shortcode-preview .vc_preview-content';
$( this.active_preview ).addClass( 'vc_active' );
},
unsetFieldActive: function ( e ) {
$( this.active_preview ).removeClass( 'vc_active' );
this.active_preview = false;
},
/***
* Escape double quotes in params value.
* @param value
* @return {*}
*/
escapeParam: function ( value ) {
return value && value.replace( /"/g, '``' );
},
getPreview: function ( data ) {
var params = data.params,
content = false,
params_to_string = {};
_.each( params, function ( value, key ) {
if ( value.param_name !== 'content' ) {
params_to_string[ value.param_name ] = this.escapeParam( value.value );
} else {
content = value.value;
}
}, this );
return wp.shortcode.atmPreview( {
tag: data.tag,
attrs: params_to_string,
content: content,
type: content === false ? 'single' : ''
} );
},
setPreview: function () {
var data = {
params: this.getParams(),
tag: $( '#vc_atm-tag' ).val()
};
$( '#vc_shortcode-preview' ).html( this.getPreview( data ) );
this.active_preview && $( this.active_preview ).addClass( 'vc_active' );
},
save: function ( e ) {
e && e.preventDefault && e.preventDefault();
this.$el.find( '.vc_error' ).removeClass( 'vc_error' );
var data = {
tag: $( '#vc_atm-tag' ).val(),
name: $( '#vc_atm-name' ).val(),
category: $( '#vc_atm-category' ).val(),
description: $( '#vc_atm-description' ).val(),
params: this.getParams()
};
if ( this.isValid( data ) ) {
this.model.save( data );
show_message( window.i18nLocaleVcAutomapper.shortcode_updated, 'success' );
this.close();
} else {
showValidationError( this.validationError, this.$el.find( '#vc_atm-save' ) );
}
},
validate: function ( attrs ) {
$( '.vc_error,.form-invalid' ).removeClass( 'vc_error form-invalid' );
var result = false, added_param_names = {};
if ( ! attrs.name ) {
$( '#vc_atm-name' ).addClass( 'vc_error' );
$( '#vc_atm-header-name' ).parent().addClass( 'form-invalid' );
return window.i18nLocaleVcAutomapper.error_shortcode_name_is_required;
}
if ( ! attrs.tag || ! attrs.tag.match( /^\S+$/ ) ) {
$( '#vc_atm-tag' ).addClass( 'vc_error' ).parent().addClass( 'form-invalid' );
return window.i18nLocaleVcAutomapper.error_enter_valid_shortcode_tag;
}
var fields_required = [
'param_name',
'heading',
'type'
];
_.each( attrs.params, function ( param, index ) {
var $field_el = $( '#vc_atm-params-list [name=param_name]:eq(' + index + ')' );
if ( param.param_name === 'content' && ! $field_el.data( 'system' ) ) {
result = window.i18nLocaleVcAutomapper.error_content_param_not_manually;
$field_el.addClass( 'vc_error' );
$field_el.closest( '.vc_param-field' ).addClass( 'form-invalid' );
return;
}
if ( _.isBoolean( added_param_names[ param.param_name ] ) && added_param_names[ param.param_name ] == true ) {
$field_el.addClass( 'vc_error' );
$field_el.closest( '.vc_param-field' ).addClass( 'form-invalid' );
if ( ! result ) {
result = window.i18nLocaleVcAutomapper.error_param_already_exists.replace( /\%s/,
param.param_name );
}
}
added_param_names[ param.param_name ] = true;
_.each( fields_required, function ( field ) {
if ( (param.type !== 'hidden' && param[ field ] === '') || (param.type === 'hidden' && field !== 'heading' && param[ field ] === '') ) {
$( '#vc_atm-params-list [name=' + field + ']:eq(' + index + ')' )
.addClass( 'vc_error' )
.closest( '.vc_param-field' )
.addClass( 'form-invalid' );
if ( ! result ) {
result = window.i18nLocaleVcAutomapper.error_enter_required_fields;
}
} else if ( field == 'param_name' && ! param[ field ].match( /^[a-z0-9_]+$/g ) ) {
$field_el
.addClass( 'vc_error' )
.closest( '.vc_param-field' )
.addClass( 'form-invalid' );
if ( ! result ) {
result = window.i18nLocaleVcAutomapper.error_wrong_param_name;
}
}
}, this );
}, this );
return result || null;
},
setContentParam: function ( e ) {
var $control = $( e.currentTarget );
if ( $control.is( ':checked' ) ) {
this.addParamField( {
type: 'textarea',
heading: 'Content',
description: '',
param_name: 'content',
value: ''
} );
this.setParamSorting();
} else {
this.removeParamField( 'content' );
}
this.setPreview();
},
addAllParams: function () {
$( '#vc_atm-params-list' ).empty();
_.each( this.model.get( 'params' ), function ( param ) {
this.addParamField( param );
if ( param.param_name === 'content' ) {
$( '#vc_atm-is-container' ).prop( 'checked', true );
}
}, this );
this.setParamSorting();
},
getParams: function () {
var params = [];
_.each( $( '.vc_param' ), function ( param ) {
var $param = $( param );
params.push( {
param_name: $param.find( '[name=param_name]' ).val(),
type: $param.find( '[name=type]' ).val(),
description: $param.find( '[name=description]' ).val(),
heading: $param.find( '[name=heading]' ).val(),
value: $param.find( '[name=value]' ).val()
} );
}, this );
return params;
},
addParam: function ( e ) {
e && e.preventDefault();
this.addParamField( { type: '', heading: '', description: '', param_name: '', value: '' } );
this.setPreview();
},
removeParamField: function ( name ) {
$( '.vc_param-name[value="' + name + '"]' ).parents( '.vc_param' ).remove();
},
addParamField: function ( attr ) {
var $block = $( '<div class="vc_param wpb_vc_row' + ( attr.param_name === 'content' ? ' vc_content' : '' ) + '"/>' ).appendTo( '#vc_atm-params-list' );
$block.html( _.template( this.param_template_html, attr, template_options ) );
},
setParamSorting: function () {
$( '#vc_atm-params-list' ).sortable( {
items: '> .vc_param',
tolerance: "pointer",
handle: '.vc_move-param',
update: this.setPreview,
placeholder: "vc_sortable-placeholder"
} );
},
deleteParam: function ( e ) {
var $control;
e && e.preventDefault();
if ( confirm( window.i18nLocaleVcAutomapper.are_you_sure_delete_param ) ) {
$control = $( e.currentTarget );
$control.parents( '.vc_param' ).remove();
this.setPreview();
}
},
close: function ( e ) {
e && e.preventDefault();
this.model && $( '[data-item-id=' + this.model.get( 'id' ) + ']' ).show();
vc_am.current_form = false;
$( '.vc_atm-message' ).remove();
this.remove();
},
clear: function ( e ) {
e && e.preventDefault();
if ( confirm( window.i18nLocaleVcAutomapper.are_you_sure_delete ) ) {
this.model.destroy();
this.close();
}
}
} );
var EditFormInnerView = EditFormView.extend( {
template_html: $( '#vc_automapper-form-tpl' ).html(),
getType: function () {
return 'edit';
},
initialize: function () {
_.bindAll( this, 'setPreview' );
},
render: function () {
var params, content,
parent = this.model.view;
params = this.model.get( 'params' );
EditFormView.__super__.render.call( this );
this.$el.html( _.template( this.template_html,
_.extend( { shortcode_preview: this.getPreview( this.model.toJSON() ) }, this.model.toJSON() ),
template_options ) );
this.$el.appendTo( parent.$editForm() );
parent.$widgetTitle().html( '<span class="vc_atm-header"><input type="text" name="name" value="" id="vc_atm-header-name" class="vc_header-name"></span><span class="in-widget-title"></span>' );
$( '#vc_atm-header-name' ).val( this.model.get( 'name' ) );
this.addAllParams();
parent.$editForm().slideDown();
return this;
},
save: function ( e ) {
e && e.preventDefault();
this.model.view.beforeSave();
EditFormInnerView.__super__.save.call( this );
},
close: function ( e ) {
e && e.preventDefault();
vc_am.current_form = false;
this.model.view.close();
},
clear: function ( e ) {
e && e.preventDefault();
if ( confirm( window.i18nLocaleVcAutomapper.are_you_sure_delete ) ) {
this.model.view.clear();
this.remove();
}
}
} );
var AppView = Backbone.View.extend( {
events: {
'click #vc_automapper-add-btn': 'create',
'submit': 'formSubmit'
},
className: 'vc_atm-form',
addFormView: false,
initialize: function () {
this.listenTo( vc_am.shortcodes, 'add', this.addOne );
this.listenTo( vc_am.shortcodes, 'reset', this.addAll );
this.listenTo( vc_am.shortcodes, 'all', this.render );
this.$list = $( '.vc_automapper-list' );
vc_am.shortcodes.fetch();
},
formSubmit: function ( e ) {
e && e.preventDefault && e.preventDefault();
if ( _.isObject( e ) && this.addFormView && ! _.isEmpty( e.currentTarget ) && ! _.isEmpty( e.currentTarget[ 0 ] ) ) {
var node, $el;
node = e.currentTarget[ 0 ];
$el = $( node );
if ( $el.is( '#vc_atm-shortcode-string' ) ) {
this.addFormView.parseShortcode();
}
}
},
addAll: function ( models ) {
models.each( function ( model ) {
this.addOne( model );
}, this );
},
addOne: function ( model ) {
var view = new ComplexShortcodeView( { model: model } );
this.$list.append( view.render().el );
},
create: function ( e ) {
e && e.preventDefault && e.preventDefault();
if ( ! vc_am.current_form || vc_am.current_form.getType() !== 'create' ) {
this.addFormView = new AddFormView().render();
}
},
render: function () {
}
} );
new AppView( { el: $( '#vc_settings-automapper' ) } );
})( window.jQuery );