File: /home/greer489/public_html/wp-content/themes/betheme/visual-builder/assets/js/scripts.js
var $content;
var $builder;
var iframe;
let screen = 'desktop';
var inlineEditors = [];
let preventEdit = false;
var edited_item = false;
var ui_mode = jQuery('body').hasClass('mfn-dev-ui') ? 'dev' : 'default';
const devices = ['desktop', 'laptop', 'tablet', 'mobile'];
var MfnVbApp = (function($){
let $editpanel = $(document);
let prebuiltType = 'end';
let context_el;
let sample_img = mfn.themepath+'/muffin-options/svg/placeholders/image.svg';
let sample_icon = 'icon-lamp';
let mfnbuilder = localStorage.getItem('mfn-builder') ? JSON.parse(localStorage.getItem('mfn-builder')) : {};
let scroll_top = 0;
let formaction = $('.btn-save-form-primary').attr('data-action');
let savebutton = $('.btn-save-form-primary span').text();
let previewTab;
let pageid = mfn.pageid;
let samplecontentid = mfn.sample_content_id;
let wpnonce = mfn.wpnonce;
var builder_type = mfn.builder_type;
let $edited_div = false;
let inlineIndex = 0;
let $navigator = $('.mfn-navigator');
let winH = $(window).height();
let winW = $(window).width();
let item_name = false;
var elements_ver = 'default';
let $undo = $('.btn-undo.mfn-history-btn');
let $redo = $('.btn-redo.mfn-history-btn');
//localStorage.setItem('mfnhistory', []);
//console.log(mfn.pagedata);
// new elements objects
var elements = {
wrap: function(size) {
var uid = getUid();
var size_class = size;
if( size != 'divider' ) size_class = sizes.filter( s => s.key === size )[0];
var new_wrap = {};
new_wrap = JSON.parse( JSON.stringify(mfn.elements.wrap) );
new_wrap['title'] = 'Wrap';
if( builder_type == 'header' ) {
// header presets
new_wrap.attr['css_advanced_flex_grow'] = {val: {desktop: '1', laptop: '1', tablet: '1', mobile: '1'}, selector: '.mcb-section .mcb-wrap-mfnuidelement', style: 'flex-grow'};
new_wrap.attr['css_advanced_align_items'] = {val: {desktop: 'center', laptop: 'center', tablet: 'center', mobile: 'center'}, selector: '.mcb-section .mcb-wrap-mfnuidelement .mcb-wrap-inner', style: 'align-items'};
}
new_wrap.uid = uid;
new_wrap.size = size;
new_wrap.tablet_size = size;
new_wrap.laptop_size = size;
new_wrap.mobile_size = '1/1';
new_wrap.tablet_resized = "0";
mfn.pagedata.push(new_wrap);
var answer = {};
if( size == 'divider' ){
answer.html = '<div data-uid="'+uid+'" class="blink wrap mcb-wrap vb-item vb-item-wrap mcb-wrap-'+uid+' divider clearfix"><div class="mcb-wrap-inner mcb-wrap-inner-'+uid+'"><div class="wrap-header mfn-header mfn-header-grey"><a class="mfn-option-btn mfn-option-grey mfn-element-drag mfn-wrap-drag" title="Drag & Drop" data-tooltip="Drag" href="#"><span class="mfn-icon mfn-icon-drag"></span></a><a class="mfn-option-btn mfn-option-grey mfn-module-clone mfn-wrap-clone" title="Clone" data-tooltip="Clone" href="#"><span class="mfn-icon mfn-icon-clone"></span></a> <a class="mfn-option-btn mfn-option-grey mfn-element-delete" data-tooltip="Delete" title="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a> </div></div></div>';
}else{
answer.html = '<div data-uid="'+uid+'" data-desktop-size="'+size+'" data-laptop-size="'+size+'" data-tablet-size="'+size+'" data-mobile-size="1/1" data-desktop-col="'+size_class.desktop+'" data-tablet-col="'+size_class.tablet+'" data-laptop-col="'+size_class.laptop+'" data-mobile-col="'+size_class.mobile+'" class="blink wrap mcb-wrap mcb-wrap-new '+ ( builder_type == 'header' ? "mcb-header-wrap" : "" ) +' vb-item vb-item-wrap mcb-wrap-'+uid+' '+size_class.desktop+' '+size_class.tablet+' '+size_class.laptop+' mobile-one clearfix mfn-module"><div class="mfn-drag-helper mfn-dh-before placeholder-wrap"></div><div class="mfn-drag-helper mfn-dh-after placeholder-wrap"></div><div class="mcb-wrap-inner mcb-wrap-inner-'+uid+' empty mfn-module-wrapper mfn-wrapper-for-wraps"><a href="#" class="btn-item-add mfn-item-add mfn-icon-add-light mfn-wrap-add-item" data-tooltip="Add element">Add element</a><div class="wrap-header mfn-header mfn-header-grey"><a class="mfn-option-btn mfn-option-blue mfn-element-menu mfn-element-edit" href="#" data-tooltip="Edit wrap" data-position="right"><span class="mfn-icon mfn-icon-wrap"></span></a><a class="mfn-option-btn mfn-option-grey mfn-size-change mfn-size-decrease" title="Decrease" data-tooltip="Decrease" href="#"><span class="mfn-icon mfn-icon-dec"></span></a> <a class="mfn-option-btn mfn-option-grey mfn-size-change mfn-size-increase" title="Increase" data-tooltip="Increase" href="#"><span class="mfn-icon mfn-icon-inc"></span></a> <a class="mfn-option-btn mfn-option-text mfn-option-grey mfn-wrap-sort-handler mfn-size-label" title="Size" data-tooltip="Size"><span class="text mfn-element-size-label">'+size+'</span></a> <div class="mfn-option-dropdown"><a class="mfn-option-btn mfn-option-grey mfn-item-add mfn-option-text" title="Add" data-tooltip="Add" href="#"><span class="mfn-icon mfn-icon-add"></span><span class="text">Add</span></a><div class="dropdown-wrapper"><a class="mfn-dropdown-item mfn-add-element mfn-item-add" href="#"><span class="label">Element</span></a><a class="mfn-dropdown-item mfn-wrap-add" href="#"><span class="label">Wrap</span></a></div></div><a class="mfn-option-btn mfn-option-grey mfn-element-drag mfn-wrap-drag" title="Drag & Drop" data-tooltip="Drag" href="#"><span class="mfn-icon mfn-icon-drag"></span></a><a class="mfn-option-btn mfn-option-grey mfn-select-parent" title="Select parent" data-tooltip="Select Parent" href="#"><span class="mfn-icon mfn-icon-select-parent"></span></a><a class="mfn-option-btn mfn-option-grey mfn-element-edit" title="Edit" data-tooltip="Edit" href="#"><span class="mfn-icon mfn-icon-edit"></span></a><a class="mfn-option-btn mfn-option-grey mfn-module-clone mfn-wrap-clone" title="Clone" data-tooltip="Clone" href="#"><span class="mfn-icon mfn-icon-clone"></span></a> <a class="mfn-option-btn mfn-option-grey mfn-element-delete" data-tooltip="Delete" title="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a> </div><div class="mfn-wrap-new"><a href="#" class="mfn-item-add mfn-btn btn-icon-left btn-small mfn-btn-blank2"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add"></span>Add element</span></a> <a href="#" class="mfn-wrap-add mfn-btn btn-icon-left btn-small mfn-btn-blank2"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add"></span>Add wrap</span></a></div><div class="mcb-wrap-background-overlay"></div></div></div>';
}
answer.uid = uid;
return answer;
},
section: function() {
var uid = getUid();
//var new_section = {...mfn.elements.section};
var section_class = 'mfn-default-section';
var new_section = {};
new_section = JSON.parse( JSON.stringify(mfn.elements.section) );
new_section.uid = uid;
new_section.ver = elements_ver;
section_class = 'mfn-'+elements_ver+'-section';
if( builder_type == 'header' ) {
// header presets
new_section.attr['css_advanced_align_items'] = {val: {desktop: 'center'}, selector: '.mcb-section-mfnuidelement .section_wrapper', style: 'align-items'};
}
if( builder_type == 'megamenu' ){
// megamenu presets
new_section.attr['css_advanced_background_color'] = {val: '#ffffff', selector: '.mcb-section-mfnuidelement', style: 'background-color'};
new_section.attr['css_advanced_align_items'] = {val: 'flex-start', selector: '.mcb-section-mfnuidelement .section_wrapper', style: 'align-items'};
}
mfn.pagedata.push(new_section);
let global_sections_html = '';
if( !$content.find('body').hasClass('mfn-template-section') ) {
global_sections_html = '<a class="mfn-btn add-global-sections-button mfn-btn-green btn-icon-left" href="#"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add-light"></span>Global sections</span></a>';
}
var answer = {};
answer.html = '<div data-uid="'+uid+'" class="section mcb-section mcb-section-new '+section_class+' vb-item mcb-section-'+uid+' '+ ( builder_type == 'header' ? "mcb-header-section" : "" ) +' blink empty" data-title="Section"> <a href="#" data-tooltip="Add new section" class="btn-section-add mfn-icon-add-light mfn-section-add siblings prev" data-position="before">Add section</a> <div class="section-header mfn-section-sort-handler mfn-header header-large"> <a class="mfn-option-btn mfn-option-blue mfn-element-menu mfn-element-edit" href="#" data-tooltip="Edit section" data-position="right"><span class="mfn-icon mfn-icon-section"></span></a> <div class="options-group"> <a class="mfn-option-btn mfn-option-text mfn-option-green btn-large mfn-wrap-add" title="Add wrap" href="#"><span class="mfn-icon mfn-icon-add"></span><span class="text">Wrap</span></a> <a class="mfn-option-btn mfn-option-text mfn-option-green btn-large mfn-wrap-add mfn-divider-add" title="Add divider" href="#"><span class="mfn-icon mfn-icon-add"></span><span class="text">Divider</span></a> </div><div class="options-group"> <a class="mfn-option-btn mfn-option-green btn-large mfn-element-drag mfn-section-drag" title="Drag" data-tooltip="Drag" href="#"><span class="mfn-icon mfn-icon-drag"></span></a> <a class="mfn-option-btn mfn-option-green btn-large mfn-element-edit" title="Edit" data-tooltip="Edit" href="#"><span class="mfn-icon mfn-icon-edit"></span></a> <a class="mfn-option-btn mfn-option-green btn-large mfn-module-clone mfn-section-clone" title="Clone" data-tooltip="Clone" href="#"><span class="mfn-icon mfn-icon-clone"></span></a> <a class="mfn-option-btn mfn-option-green btn-large mfn-element-delete" data-tooltip="Delete" title="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a> <div class="mfn-option-dropdown"> <a class="mfn-option-btn mfn-option-green btn-large" title="More" href="#"><span class="mfn-icon mfn-icon-more"></span></a> <div class="dropdown-wrapper"> <h6>Actions</h6> <a class="mfn-dropdown-item mfn-section-hide" href="#" data-show="Show section" data-hide="Hide section"><span class="mfn-icon mfn-icon-hide"></span><span class="mfn-icon mfn-icon-show"></span><span class="label">Hide section</span></a> <a class="mfn-dropdown-item mfn-section-move-up" href="#"><span class="mfn-icon mfn-icon-move-up"></span> Move up</a><a class="mfn-dropdown-item mfn-section-move-down" href="#"><span class="mfn-icon mfn-icon-move-down"></span> Move down</a><a class="mfn-dropdown-item mfn-section-convert-to-global" href="#"><span class="mfn-icon mfn-icon-convert-section-to-global"></span> Convert to Global</a> <div class="mfn-dropdown-divider"></div><h6>Import / Export</h6> <a class="mfn-dropdown-item mfn-section-export" href="#"><span class="mfn-icon mfn-icon-export"></span> Export section</a> <a class="mfn-dropdown-item mfn-section-import mfn-section-import-replace" href="#"><span class="mfn-icon mfn-icon-import-after"></span> Import & replace</a> <a class="mfn-dropdown-item mfn-section-import mfn-section-import-before" href="#"><span class="mfn-icon mfn-icon-import-after"></span> Import before</a> <a class="mfn-dropdown-item mfn-section-import mfn-section-import-after" href="#"><span class="mfn-icon mfn-icon-import-before"></span> Import after</a> </div></div></div></div><div class="mcb-background-overlay"></div><div class="mfn-shape-divider mfn-shape-divider-top" data-bring-front="0" data-flip="0" data-invert="0" data-name="top"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none"><path></path></svg></div><div class="mfn-shape-divider mfn-shape-divider-bottom" data-bring-front="0" data-flip="0" data-invert="0" data-name="bottom"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1200 120" preserveAspectRatio="none"><path></path></svg></div><div class="section_wrapper mcb-section-inner mcb-section-inner-'+uid+' mfn-wrapper-for-wraps"> <div class="mfn-section-new"> <h5>Select a wrap layout</h5> <div class="wrap-layouts"> <div class="wrap-layout wrap-11" data-type="wrap-11" data-tooltip="1/1"></div><div class="wrap-layout wrap-12" data-type="wrap-12" data-tooltip="1/2 | 1/2"><span></span></div><div class="wrap-layout wrap-13" data-type="wrap-13" data-tooltip="1/3 | 1/3 | 1/3"><span></span><span></span></div><div class="wrap-layout wrap-14" data-type="wrap-14" data-tooltip="1/4 | 1/4 | 1/4 | 1/4"><span></span><span></span><span></span></div><div class="wrap-layout wrap-13-23" data-type="wrap-1323" data-tooltip="1/3 | 2/3"><span></span></div><div class="wrap-layout wrap-23-13" data-type="wrap-2313" data-tooltip="2/3 | 1/3"><span></span></div><div class="wrap-layout wrap-14-12-14" data-type="wrap-141214" data-tooltip="1/4 | 1/2 | 1/4"><span></span><span></span></div></div><p>or choose from</p><a class="mfn-btn prebuilt-button mfn-btn-green btn-icon-left" href="#"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add-light"></span>'+( builder_type == 'header' ? 'Pre-built headers' : 'Pre-built sections' )+'</span></a> '+ global_sections_html +' </div></div><a href="#" class="btn-section-add mfn-icon-add-light mfn-section-add siblings next" data-position="after">Add section</a><div class="mfn-drag-helper mfn-dh-after placeholder-section"></div></div>';
answer.uid = uid;
return answer;
},
item: function(name, alias) {
var script = false;
var uid = getUid();
// var new_item = {...mfn.elements[name]};
var new_item = {};
new_item = JSON.parse( JSON.stringify(renderMfnFields.items[name]) );
var html = `<div data-uid="${uid}" data-desktop-size="1/1" data-tablet-size="1/1" data-mobile-size="1/1" class="blink column mcb-column mfn-new-item vb-item vb-item-widget mcb-item-${uid} column_${name} one tablet-one mobile-one mfn-module"><div class="mcb-column-inner mcb-column-inner-${uid} mcb-item-${name}-inner mfn-module-wrapper"><div class="item-header mfn-header mfn-header-blue"><a data-tooltip="Edit element" class="mfn-option-btn mfn-option-blue mfn-element-menu mfn-element-edit" href="#"><span class="mfn-icon mfn-icon-item"></span></a><a class="mfn-option-btn mfn-option-blue mfn-size-change mfn-size-decrease" title="Decrease" data-tooltip="Decrease" href="#"><span class="mfn-icon mfn-icon-dec"></span></a> <a class="mfn-option-btn mfn-option-blue mfn-size-change mfn-size-increase" title="Increase" data-tooltip="Increase" href="#"><span class="mfn-icon mfn-icon-inc"></span></a> <a class="mfn-option-btn mfn-size-label mfn-option-text mfn-option-blue" title="Size" data-tooltip="Size"><span class="text mfn-element-size-label">1/1</span></a> <a class="mfn-option-btn mfn-option-blue mfn-element-drag mfn-column-drag" title="Drag & Drop" data-tooltip="Drag" href="#"><span class="mfn-icon mfn-icon-drag"></span></a> <a class="mfn-option-btn mfn-option-blue mfn-element-edit" title="Edit" data-tooltip="Edit" href="#"><span class="mfn-icon mfn-icon-edit"></span></a> <a class="mfn-option-btn mfn-option-blue mfn-module-clone mfn-element-clone" title="Clone" data-tooltip="Clone" href="#"><span class="mfn-icon mfn-icon-clone"></span></a> <a class="mfn-option-btn mfn-option-blue mfn-element-delete" data-tooltip="Delete" title="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a> </div>${_.has(new_item, 'html') ? new_item['html'] : ''}</div></div>`;
/*if( new_item.script ){
script = new_item.script;
}*/
if( !_.has(new_item, 'attr') || Array.isArray(new_item['attr'])) new_item['attr'] = {};
if(_.has(new_item, 'html')) {
delete new_item.html;
}else{
be_layout.drag_new.force_rerender = true;
}
if(_.has(new_item, 'script')) delete new_item.script;
if( name != alias && typeof aliases[alias] !== 'undefined' ){
aliases[alias].map(function(el) {
html = html.replace(new_item['attr'][el.key], el.val); // update html
new_item['attr'][el.key] = el.val; // update object
});
}
new_item.uid = uid;
new_item.size = '1/1';
new_item.tablet_size = '1/1';
new_item.laptop_size = '1/1';
new_item.mobile_size = '1/1';
new_item.tablet_resized = "0";
if( name == 'icon_2' ) {
new_item.attr['width_switcher'] = 'inline';
html = html.replace('vb-item', 'vb-item mfn-item-inline');
}
if( builder_type == 'header' ) {
if( name != 'header_logo' && name != 'header_search' && name != 'image' ) {
new_item.attr['width_switcher'] = 'inline';
html = html.replace('vb-item', 'vb-item mfn-item-inline');
}
if( name == 'header_logo' || name == 'image' ) {
new_item.attr['width_switcher'] = 'custom';
new_item.attr['css_advanced_flex'] = {val: '250px', selector: '.mcb-section .mcb-wrap .mcb-item-mfnuidelement', style: 'width'};
be_layout.drag_new.force_rerender = true;
}
if( name == 'header_search' ) {
new_item.attr['width_switcher'] = 'custom';
new_item.attr['css_advanced_flex'] = {val: '300px', selector: '.mcb-section .mcb-wrap .mcb-item-mfnuidelement', style: 'width'};
}
if( name == 'header_icon' ) {
new_item.attr['css_icon_count_top'] = {val: '-9px', selector: '.mcb-section .mcb-wrap .mcb-item-mfnuidelement .mfn-icon-box .icon-wrapper .header-cart-count,.mcb-section .mcb-wrap .mcb-item-mfnuidelement .mfn-icon-box .icon-wrapper .header-wishlist-count', style: 'top'};
new_item.attr['css_icon_count_right'] = {val: '-11px', selector: '.mcb-section .mcb-wrap .mcb-item-mfnuidelement .mfn-icon-box .icon-wrapper .header-cart-count,.mcb-section .mcb-wrap .mcb-item-mfnuidelement .mfn-icon-box .icon-wrapper .header-wishlist-count', style: 'right'};
}
}
mfn.pagedata.push(new_item);
return html;
}
};
function getUid(){
return Math.random().toString(36).substring(5);
}
// show shortcode add icon
$('.modal-add-shortcode .browse-icon .mfn-button-upload').on('click', function(e) {
e.preventDefault();
$('.mfn-modal.modal-select-icon .mfn-items-list li').removeClass('active');
$('.mfn-modal.modal-select-icon').addClass('show');
});
function backToWidgets(){
$('.mfn-visualbuilder .sidebar-panel .sidebar-panel-header .header-items .title-group .sidebar-panel-desc .sidebar-panel-title').text('Add element');
$('.mfn-visualbuilder .sidebar-panel .sidebar-panel-header .header-items .title-group .sidebar-panel-icon').attr('class', 'sidebar-panel-icon mfn-icon-add-big');
if($('.mfn-ui').hasClass('mfn-sidebar-hidden-footer')) $('.mfn-ui').removeClass('mfn-sidebar-hidden-footer');
$(".panel").hide();
$(".header").hide();
$(".panel-items").show();
$(".header-items").show();
$('.panel-edit-item .mfn-form');
$('.mfn-ui').removeClass('mfn-editing-section mfn-editing-wrap mfn-editing-element');
if( edited_item && typeof edited_item.jsclass !== 'undefined' ) $('.mfn-ui').removeClass('mfn-editing-'+edited_item.jsclass);
if( $builder.find('.mfn-current-editing').length ) $builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor-full') ) $('.mfn-ui').addClass('mfn-class-editor-full');
$('.panel-items .mfn-search').focus();
if( ui_mode == 'dev' ){
$('.topbar-nav #main-menu li').removeClass('active');
$('.topbar-nav #main-menu li.menu-items').addClass('active');
}
// resetSaveButton();
}
function showPrebuilts() {
$(".panel").hide();
$(".header").hide();
$(".panel-prebuilt-sections").show();
$(".header-prebuilt-sections").show();
if( ui_mode == 'dev' ){
$('li.menu-sections').siblings('li').removeClass('active');
$('li.menu-sections').addClass('active');
}
if( $('.panel-prebuilt-sections ul.prebuilt-sections-list li').length ) return;
var html = '';
_.map( mfnDbLists.prebuilts, (item, i) => html += `
<li class="category-all category-${item.category}" data-id="${i}">
<div class="photo"><img loading="lazy" src="${mfn.themepath}/functions/builder/pre-built/images/${i}.png" alt="" /></div>
<div class="desc"><h6>${item.title}</h6><a class="mfn-option-btn mfn-option-text btn-icon-left mfn-option-green mfn-btn-insert mfn-insert-prebuilt" title="Insert" data-tooltip="Insert to your project" href="#"><span class="mfn-icon mfn-icon-add"></span><span class="text">Insert</span></a></div>
</li>` ).join('');
$('.panel-prebuilt-sections ul.prebuilt-sections-list').html(html);
if( $('body').hasClass('mfn-template-builder-blog') || $('body').hasClass('mfn-template-builder-portfolio') ){
$('.header-prebuilt-sections').find('.mfn-dropdown-item[data-filter="category-tem"]').trigger('click');
}
}
function showYoast() {
$(".panel").hide();
$(".header").hide();
$(".panel-yoast-seo").show();
$(".header-yoast-seo").show();
if( ui_mode == 'dev' ){
$('.mfn-visualbuilder .mfn-topbar .topbar-nav nav ul li').removeClass('active');
}
}
function showGlobals( $section_uid ) {
$(".panel").hide();
$(".header").hide();
$(".panel-global-sections").show();
$(".header-global-sections").show();
$('.prebuilt-sections-list.global-sections').empty();
_.map(mfnDbLists['global_sections'], function(el, i){
if( i > 0 ){
$('.prebuilt-sections-list.global-sections').append(`<li style="display: block;" class="${ i == $section_uid ? 'active' : ''}" data-id="${i}"><div class="desc"><h6>${el}</h6><a class="mfn-option-btn mfn-option-text btn-icon-left mfn-option-green mfn-btn-insert mfn-insert-global-section" title="Insert" data-tooltip="Insert to your project" href="#"><span class="mfn-icon mfn-icon-add"></span><span class="text">${ i == $section_uid ? 'Selected' : 'Select'}</span></a></div></li>`);
}
});
if( !$('.prebuilt-sections-list.global-sections li').length ){
$('.prebuilt-sections-list.global-sections').append('<div class="mfn-form-row mfn-form-row "><div class="mfn-alert "><div class="alert-icon mfn-icon-information"></div><div class="alert-content"><p>No global sections have been created yet. If you would like to set global section, please <a target="_blank" href="'+mfn.adminurl+'edit.php?post_type=template&tab=section">create it first.</a></p></div></div></div>');
}
}
var enableBeforeUnload = function() {
if( !$('.mfn-form-options').is(':visible') && !$('.panel-view-themeoptions').is(':visible') ) {
window.onbeforeunload = function(e) {
return 'The changes you made will be lost if you navigate away from this page';
};
}
};
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li a').on('click', function(e) {
e.preventDefault();
});
$('.mfn-topbar .topbar-addons .mfn-option-dropdown.page-options > a').on('click', function(e) {
e.preventDefault();
});
document.addEventListener('keydown', function(event) {
catchShortcuts(event);
});
function catchShortcuts(e){
if((e.ctrlKey || e.metaKey) && e.key == "s") {
// ctr || cmd + s
e.preventDefault();
if( $('.mfn-ui').hasClass('mfn-class-editor') ){
$('.mfn-class-editor .mfn-class-editor-update').trigger('click');
}else if(!$('.btn-save-form-primary.btn-save-changes').hasClass('disabled')){
$('.btn-save-form-primary.btn-save-changes').trigger('click');
}
return false;
}else if((e.ctrlKey || e.metaKey) && e.key == "y") {
// ctr || cmd + y
if( !$('.mfn-field-value').is(':focus') ){
e.preventDefault();
if(!$redo.hasClass('loading') && !$redo.hasClass('inactive')){
$redo.trigger('click');
}
return false;
}else if( $('.panel-edit-item .mfn-field-value:focus').length ){
setTimeout(function() {
fieldUpdate($('.panel-edit-item .mfn-field-value:focus'));
}, 5);
}
}else if((e.ctrlKey || e.metaKey) && e.key == "i") {
// ctr || cmd + i
e.preventDefault();
$('.mfn-visualbuilder a.btn-navigator-switcher').trigger('click');
return false;
}else if(e.ctrlKey && e.shiftKey && e.key == "Z") {
// ctr || cmd + shift + z
if( !$('.mfn-field-value').is(':focus') ){
e.preventDefault();
if(!$redo.hasClass('loading') && !$redo.hasClass('inactive')){
$redo.trigger('click');
}
return false;
}else if( $('.panel-edit-item .mfn-field-value:focus').length ){
setTimeout(function() {
fieldUpdate($('.panel-edit-item .mfn-field-value:focus'));
}, 5);
}
}else if(e.metaKey && e.shiftKey && e.key == "z") {
// ctr || cmd + shift + z
if( !$('.mfn-field-value').is(':focus') ){
e.preventDefault();
if(!$redo.hasClass('loading') && !$redo.hasClass('inactive')){
$redo.trigger('click');
}
return false;
}else if( $('.panel-edit-item .mfn-field-value:focus').length ){
setTimeout(function() {
fieldUpdate($('.panel-edit-item .mfn-field-value:focus'));
}, 5);
}
}else if(e.ctrlKey && e.shiftKey && e.key === "P") {
// ctr || cmd + shift + p
e.preventDefault();
$('.mfn-visualbuilder a.mfn-preview-generate').trigger('click');
return false;
}else if(e.metaKey && e.shiftKey && e.key == "p") {
// ctr || cmd + shift + p
e.preventDefault();
$('.mfn-visualbuilder a.mfn-preview-generate').trigger('click');
return false;
}else if(e.ctrlKey && e.shiftKey && e.key === "M") {
// ctr || cmd + shift + m
e.preventDefault();
$('.mfn-visualbuilder .sidebar-panel .sidebar-panel-footer .btn-change-resolution .dropdown-wrapper a[data-preview="desktop"]').trigger('click');
return false;
}else if(e.metaKey && e.shiftKey && e.key == "m") {
// ctr || cmd + shift + m
e.preventDefault();
$('.mfn-visualbuilder .sidebar-panel .sidebar-panel-footer .btn-change-resolution .dropdown-wrapper a[data-preview="desktop"]').trigger('click');
return false;
}else if(e.metaKey && e.shiftKey && e.key == "h") {
// ctr || cmd + shift + h
e.preventDefault();
$('.mfn-visualbuilder ul li.menu-revisions a').trigger('click');
return false;
}else if(e.ctrlKey && e.shiftKey && e.key === "H") {
// ctr || cmd + shift + h
e.preventDefault();
$('.mfn-visualbuilder ul li.menu-revisions a').trigger('click');
return false;
}else if(e.ctrlKey && e.shiftKey && e.key === "V") {
// ctr || cmd + shift + v
e.preventDefault();
window.open( $('a.menu-viewpage').attr('href') );
return false;
}else if(e.metaKey && e.shiftKey && e.key == "v") {
// ctr || cmd + shift + v
e.preventDefault();
window.open( $('a.menu-viewpage').attr('href') );
return false;
}else if((e.ctrlKey || e.metaKey) && e.key == "z") {
// ctr || cmd + z
if( !$('.CodeMirror-code').is(':focus') && !$content.find('.mfn-current-editing .mfn-inline-editor').is(":focus") && !$('.panel-edit-item .mfn-field-value').is(':focus') ){
e.preventDefault();
if(!$undo.hasClass('loading') && !$undo.hasClass('inactive')){
$undo.trigger('click');
}
return false;
}else if( $('.panel-edit-item .mfn-field-value:focus').length ){
setTimeout(function() {
fieldUpdate($('.panel-edit-item .mfn-field-value:focus'));
}, 5);
}
}else if((e.ctrlKey || e.metaKey) && e.key == "c"){
// ctr || cmd + c
if( iframe.window.getSelection().toString() == '' && !$content.find('.mfn-current-editing .mfn-inline-editor').is(":focus") && !$content.find('input').is(':focus') && !$content.find('textarea').is(':focus') && !$('input').is(':focus') && !$('textarea').is(':focus') && !$('textarea').is(':focus') && !$('.CodeMirror-code').is(':focus') ){
e.preventDefault();
if( $content.find('.mfn-current-editing').length ){
context_el = $content.find('.mfn-current-editing').attr('data-uid');
copypaste.copy(context_el);
}
}
return false;
}else if((e.ctrlKey || e.metaKey) && e.key == "v"){
// ctr || cmd + v
if( !$('.components-modal__frame.yoast').length && !$content.find('.mfn-current-editing .mfn-inline-editor').is(":focus") && !$content.find('input').is(':focus') && !$content.find('textarea').is(':focus') && !$('input').is(':focus') && !$('textarea').is(':focus') && !$('.CodeMirror-code').is(':focus') ){
e.preventDefault();
if( $content.find('.mfn-current-editing').length ){
context_el = $content.find('.mfn-current-editing').attr('data-uid');
//let $el = $content.find('.vb-item[data-uid="'+context_el+'"]');
copypaste.parent = $content.find('.vb-item[data-uid="'+context_el+'"]');
copypaste.paste();
}
}
return false;
}else if( e.key == "Delete" ){
if( !$content.find('.mfn-current-editing .mfn-inline-editor').is(":focus") && !$('input').is(':focus') && !$('textarea').is(':focus') && !$('.CodeMirror-code').is(':focus') ){
e.preventDefault();
// Global Wraps -> Prevent removing wrap on template editor
if( $('body').hasClass('mfn-template-wrap') && $content.find('.mfn-current-editing').hasClass('mcb-section')) {
return;
}
$content.find('.mfn-current-editing').find('.mfn-header').first().find('.mfn-element-delete').trigger('click');
}
return false;
}else if( (e.ctrlKey || e.metaKey) && e.key == "d" ){
// Global Sections/Wraps -> Prevent duplicating wrap/section on page
if( ($('body').hasClass('mfn-template-builder-wrap') && $content.find('.mfn-current-editing').hasClass('mcb-wrap')) || ($('body').hasClass('mfn-template-builder-section') && $content.find('.mfn-current-editing').hasClass('mcb-section')) ){
return false;
}
if( $content.find('.mfn-current-editing').hasClass('mfn-global-wrap') || $content.find('.mfn-current-editing').hasClass('mfn-global-section') ) {
return false;
}
// duplicate
if( $content.find('.mfn-current-editing').length && !$('.mfn-field-value').is(':focus') ){
e.preventDefault();
$content.find('.mfn-current-editing').find('.mfn-header').first().find('.mfn-module-clone').trigger('click');
}
return false;
}else if( (e.ctrlKey || e.metaKey) && e.key == "p" ){
// show/hide left panel
e.preventDefault();
$('#mfn-sidebar-switcher').trigger('click');
return false;
}else if( e.key == "Enter" ){
// enter
if( $('.mfn-modal.show .btn-modal-confirm').length ){
e.preventDefault();
$('.mfn-modal.show .btn-modal-confirm').trigger('click');
}
if( $('.mfn-modal.modal-display-conditions.show .btn-modal-save').length ){
e.preventDefault();
$('.mfn-modal.modal-display-conditions.show .btn-modal-save').trigger('click');
}
return false;
}else if( e.key == "Escape" ){
// Escape
if( $('.mfn-modal.show .modalbox-header .btn-modal-close').length ){
e.preventDefault();
$('.mfn-modal.show .modalbox-header .btn-modal-close').trigger('click');
}
return false;
}else if( (e.ctrlKey || e.metaKey) && (e.key == "/" || e.key == "?" ) ) {
// ctr || cmd + /
e.preventDefault();
if(!$('.modal-shortcuts').hasClass('show')){
$('.modal-shortcuts').addClass('show');
}
return false;
}
}
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li a').contextmenu(function(e) {
if( builder_type == 'header' ) return;
e.preventDefault();
var type = $(this).closest('li').attr('data-type');
if( $('.mfn-visualbuilder .sidebar-panel-content ul.fav-items-list li[data-type="'+type+'"]').length ){
$('.mfn-items-list-contextmenu ul li a[data-action="love-it"] span.label').text('Remove');
}else{
$('.mfn-items-list-contextmenu ul li a[data-action="love-it"] span.label').text('Add to favourites');
}
item_name = $(e.target).closest('li').attr('data-type');
var $li = $('.mfn-visualbuilder .sidebar-panel-content ul.items-list li.mfn-item-'+item_name);
$('.mfn-items-list-contextmenu').show().css({'left':e.clientX, 'top': e.clientY});
$(document).bind('click', hideLeftItemsContext);
$content.find('body').bind('click', hideLeftItemsContext);
});
function hideLeftItemsContext(e) {
var context = $('.mfn-items-list-contextmenu');
if (!context.is(e.target) && context.has(e.target).length === 0){
$('.mfn-items-list-contextmenu').hide();
}
$(document).unbind('click', hideLeftItemsContext);
$content.find('body').unbind('click', hideLeftItemsContext);
}
$('.mfn-fav-items-wrapper h5').on('click', function(e) {
e.preventDefault();
$('.mfn-fav-items-wrapper').toggleClass('mfn-favs-closed');
if( $('.mfn-fav-items-wrapper').hasClass('mfn-favs-closed') ){
$('.mfn-fav-items-content').slideUp(300);
}else{
$('.mfn-fav-items-content').slideDown(300);
}
});
$('.mfn-items-list-contextmenu ul li a').on('click', function(e) {
e.preventDefault();
if (mfn.view == 'demo') {
$('.mfn-items-list-contextmenu').hide();
return;
}
var action = $(this).attr('data-action');
$('.mfn-items-list-contextmenu').hide();
if( action == 'love-it' ){
$.ajax( mfnajaxurl, {
type : "POST",
data : {
'mfn-builder-nonce': wpnonce,
action: 'mfn_builder_favorites',
item: item_name
}
}).done(function(response){
if( response == 'set'){
$('.mfn-fav-items-wrapper ul.fav-items-list').append( $('.mfn-visualbuilder .sidebar-panel-content ul.items-list li[data-type="'+item_name+'"]').clone(true) );
}else{
$('.mfn-fav-items-wrapper ul.fav-items-list li[data-type="'+item_name+'"]').remove();
}
if( !$('.mfn-fav-items-wrapper ul.fav-items-list li').length ){
$('.mfn-fav-items-wrapper').removeClass('isset-favs').addClass('empty-favs');
}else{
$('.mfn-fav-items-wrapper').addClass('isset-favs').removeClass('empty-favs');
}
});
}
});
function init() {
iframeReady(); // sections toolbar buttons
document.addEventListener("visibilitychange", handleVisibilityChange);
if( $content.find('.column_banner_box').length ){
mfnBannerBox();
}
page_options_tab.init();
uploader.browse();
uploader.delete();
uploader.deleteAllGallery();
uploader.sortable();
var mac = /(Mac)/i.test(navigator.platform);
if (mac) {
$content.find('body').addClass('mfn-mac');
$('body').addClass('mfn-mac');
}
if(window.location.hash && window.location.hash == '#page-options-tab') {
$(window.location.hash).trigger('click');
}
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li').on('mousedown', function(e) {
if (e.which != 3) calculateIframeHeight();
}).on('mouseup', resetIframeHeight);
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list').on('mouseenter', function() {
be_layout.drag_new.init();
});
if($content.find('.masonry').length){
$content.find('.masonry').each(function() {
$(this).addClass('mfn-initialized');
});
}
if($content.find('.isotope').length){
$content.find('.isotope').each(function() {
$(this).addClass('mfn-initialized');
});
}
/* theme options if template header || footer is active */
if( $content.find('#mfn-header-template').length ) $('body').addClass('mfn-to-disabled-with-header-tmpl');
if( $content.find('#mfn-footer-template').length ) $('body').addClass('mfn-to-disabled-with-footer-tmpl');
if(!mfnbuilder.clipboard){
$content.find('.section-header .mfn-section-import').addClass('mfn-disabled');
}
if( builder_type == 'standard' && $content.find('.mfn-shop-archive-tmpl-builder').length ){
$content.find('.mfn-shop-archive-tmpl-builder').addClass('block-pointer-inside').append('<a href="'+mfn.adminurl+'post.php?post='+$content.find('.mfn-shop-archive-tmpl-builder').attr("data-id")+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Shop Template" class="btn-edit-template" data-position="before">Edit shop template</a>');
}
if( builder_type == 'standard' && $content.find('.mfn-portfolio-tmpl-builder').length ){
$content.find('.mfn-portfolio-tmpl-builder').addClass('block-pointer-inside').append('<a href="'+mfn.adminurl+'post.php?post='+$content.find('.mfn-portfolio-tmpl-builder').attr("data-id")+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Portfolio Template" class="btn-edit-template" data-position="before">Edit Portfolio Template</a>');
}
if( $content.find('.mfn-main-slider.mfn-rev-slider').length ){
$content.find('.mfn-main-slider.mfn-rev-slider').append('<a href="'+mfn.adminurl+'admin.php?page=revslider&view=slide&alias='+mfn.rev_slider_id+'" target="_blank" data-tooltip="Edit with Slider Revolution" class="btn-edit-slider" data-position="before">Edit Slider</a>');
}
if( $content.find('.mfn-global-section').length ){
const globalSections = $content.find('.mfn-global-section');
globalSections.each( (index, item) => {
$(item).append('<a href="'+mfn.adminurl+'post.php?post='+$(item).attr('data-mfn-global')+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Global Section" class="btn-edit-section" data-position="before">Edit Global Section</a>');
})
}
if( $content.find('.mfn-global-wrap').length ){
const globalWraps = $content.find('.mfn-global-wrap');
globalWraps.each( (index, item) => {
$(item).append('<a href="'+mfn.adminurl+'post.php?post='+$(item).attr('data-mfn-global')+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Global Wrap" class="btn-edit-wrap" data-position="before">Edit Global Wrap</a>');
})
}
if( $content.find('#Footer').length ){
$content.find('#Footer').append('<a href="'+mfn.adminurl+'widgets.php" target="_blank" data-tooltip="Edit Footer" class="btn-edit-footer" data-position="before">Edit Footer</a>');
}
if( $content.find('#Header_creative').length ){
$content.find('#Header_creative').append('<a href="'+mfn.adminurl+'admin.php?page='+mfn.be_slug.replace('mfn', 'be')+'-options#header" target="_blank" data-tooltip="Edit Header" class="btn-edit-header" data-position="before">Edit Header</a>');
} else if( $content.find('#Top_bar').length ){
$content.find('#Top_bar').append('<a href="'+mfn.adminurl+'admin.php?page='+mfn.be_slug.replace('mfn', 'be')+'-options#header" target="_blank" data-tooltip="Edit Header" class="btn-edit-header" data-position="before">Edit Header</a>');
}
if( $content.find('.mfn-header-tmpl-builder:not(.mfn-builder-active)').length ){
if (mfn.view == 'demo'){
$content.find('.mfn-header-tmpl-builder:not(.mfn-builder-active)').append('<a href="https://muffingroup.com/betheme/header-builder/" target="_blank" data-tooltip="Customize every part of your site with Betheme’s new Header Builder. Learn more about it here." class="btn-edit-header" data-position="before">Edit Header</a>');
} else {
$content.find('.mfn-header-tmpl-builder:not(.mfn-builder-active)').append('<a href="'+mfn.adminurl+'post.php?post='+$content.find('.mfn-header-tmpl').attr("data-id")+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Header" class="btn-edit-header" data-position="before">Edit Header</a>');
}
}
if( $content.find('.mfn-footer-tmpl-builder:not(.mfn-builder-active)').length ){
if (mfn.view == 'demo'){
$content.find('.mfn-footer-tmpl-builder:not(.mfn-builder-active)').append('<a href="https://muffingroup.com/betheme/header-builder/" target="_blank" data-tooltip="Customize every part of your site with Betheme’s new Footer Builder. Learn more about it here." class="btn-edit-footer" data-position="before">Edit Footer</a>');
} else {
$content.find('.mfn-footer-tmpl-builder:not(.mfn-builder-active)').append('<a href="'+mfn.adminurl+'post.php?post='+$content.find('.mfn-footer-tmpl').attr("data-id")+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Footer" class="btn-edit-footer" data-position="before">Edit Footer</a>');
}
}
$('.mfn-preloader .loading-text').fadeOut(function() {
$('.mfn-preloader .loading-text').html('Generating page local CSS <div class="dots"></div>');
}).fadeIn();
be_layout.init();
Transforms.attachInitialMargins();
modernmenu.start();
settings.start();
dynamicData.init();
if( ui_mode == 'dev' ) anotherPagesModal.init();
historyStorage.init();
be_navigator.init();
mfn_conditional_logic.init();
// be_layout.drag_new.init();
be_layout.sortable.init();
$('.mfn-preloader').fadeOut(500, function() {
$('body').removeClass('mfn-preloader-active');
});
$(document).trigger('be:init');
}
function loopAllStyleFields(uid = false) {
var copied = [];
if( uid ) {
copied = JSON.parse( JSON.stringify(mfn.pagedata.filter( (item) => item.uid == uid )));
if($content.find('.mfn-local-style-'+uid+'').length) $content.find('.mfn-local-style-'+uid+'').remove();
} else {
copied = JSON.parse( JSON.stringify(mfn.pagedata));
}
//console.log('loop all style fields');
if( !uid ) {
$.each(mfn.page_options, function(i, v) {
if( i.includes('css_') ) {
if( typeof v == 'object' && _.has(v, 'selector') && _.has(v, 'val') ) {
if( typeof v['val'] == 'object' ) {
if( _.has(v['val'], 'desktop') || _.has(v['val'], 'laptop') || _.has(v['val'], 'tablet') || _.has(v['val'], 'mobile') ){
devices.map( (dvc) => _.has(v['val'], dvc) ? prepareCss(v['selector'], v['style'], v['val'][dvc], pageid, dvc) : null );
}else{
prepareCss(v['selector'], v['style'], v['val'], pageid, 'desktop');
}
}else{
prepareCss(v['selector'], v['style'], v['val'], pageid, 'desktop');
}
} else if(i.includes('style:')) {
var sel_ex = i.split(':');
prepareCss(sel_ex[1], sel_ex[2], v, pageid, 'desktop');
}
}
});
if( mfn.classes.length ){
copied = copied.concat(JSON.parse( JSON.stringify(mfn.classes)));
}
}
if( uid && !copied.length ) {
copied = mfn.classes.filter( (item) => item.uid == uid );
}
$.each(copied, function(i, v) {
if( v === null ) {
delete(mfn.pagedata[i]); delete(copied[i]);
}else{
$.each(v.attr, function(a, attr) {
if( a.includes('css_') && _.has(attr, 'val') ) {
if( _.has(attr, 'css_path') || _.has(attr, 'css_style') ) {
delete(mfn.pagedata[i]['attr'][a]);
delete(copied[i]['attr'][a]);
}else if( (_.has(attr, 'selector') && attr.selector == null) || (_.has(attr, 'style') && attr.style == null) ) {
delete(mfn.pagedata[i]['attr'][a]);
delete(copied[i]['attr'][a]);
}else{
if( typeof attr['val'] == 'object' ){
_.map(attr['val'], (y, x) => {
if( x == 'desktop' || x == 'laptop' || x == 'tablet' || x == 'mobile' ){
if( attr['style'] == 'transform' ) {
attr['val'][x]['string'] = `matrix(${attr['val'][x]['scaleX']}, ${attr['val'][x]['skewY']}, ${attr['val'][x]['skewX']}, ${attr['val'][x]['scaleY']}, ${attr['val'][x]['translateX']}, ${attr['val'][x]['translateY']}) rotate(${attr['val'][x]['rotate']}deg)`;
}
if( typeof y == 'object' ) {
_.map(y, (c, z) => {
let sn = z;
if( (attr['style'] == 'transform') && z != 'string' ) return;
if( attr['style'] != 'typography' ) sn = attr['style']+'-'+z;
if( attr['style'] == 'transform' ) sn = attr['style'];
prepareCss(attr['selector'], sn, c, v.uid, x);
});
}else{
prepareCss(attr['selector'], attr['style'], y, v.uid, x);
if( _.has( additional_css, a) ){
if( y && _.has( additional_css[a]['rewrites'], y) ) {
prepareCss( additional_css[a]['selector'].replace('mfnuidelement', v.uid), additional_css[a]['style'], additional_css[a]['rewrites'][y], v.uid, x);
}else{
prepareCss(additional_css[a]['selector'].replace('mfnuidelement', v.uid), additional_css[a]['style'], '', v.uid, x);
}
}
}
}else{
if( (attr['style'] == 'gradient' || attr['style'] == 'filter' || attr['style'] == 'backdrop-filter') && x != 'string' ) return;
let sn = x;
if( attr['style'] == 'gradient' || attr['style'] == 'filter' || attr['style'] == 'backdrop-filter' ) {
sn = attr['style'];
}
if( typeof y == 'object' && y.length ){
_.map(y, (c,z) => {
sn = z;
prepareCss(attr['selector'], sn, c, v.uid, 'desktop');
});
}else{
prepareCss(attr['selector'], sn, y, v.uid, 'desktop');
}
}
});
}else{
prepareCss(attr['selector'], attr['style'], attr['val'], v.uid, 'desktop');
}
}
}
if( v.jsclass == 'hotspot' && a == 'hotspots' ) {
$.each(attr, function(h, ht) {
$.each(ht['val'], function(s, st) {
if( _.has(st, 'val') && typeof st['val'] == 'object' ){
_.map(st['val'], (k, r) => {
prepareCss(st['selector'], st['style'], k, v.uid, r);
});
}else{
prepareCss(st['selector'], st['style'], attr['val'], v.uid, 'desktop');
}
});
});
}
});
}
});
copied = [];
}
$('#mfn-sidebar-switcher').on('click', function() {
var $sidebar = $('.mfn-visualbuilder .sidebar-wrapper');
var sidebarW = $sidebar.outerWidth();
if( $('.mfn-visualbuilder').hasClass('sidebar_hidden') ){
$('.mfn-visualbuilder').removeClass('sidebar_hidden');
$content.find('body').removeClass('sidebar_hidden');
$sidebar.css({ 'left': '0'});
$('.mfn-visualbuilder .preview-wrapper').css({'margin-left': sidebarW+'px'});
}else{
$('.mfn-visualbuilder').addClass('sidebar_hidden');
$sidebar.css({ 'left': '-'+sidebarW+'px'});
$('.mfn-visualbuilder .preview-wrapper').css({'margin-left': '0'});
$content.find('body').addClass('sidebar_hidden');
}
});
/* Sidebar Resizer */
var resizer = document.getElementById('mfn-sidebar-resizer');
var sidebar = document.getElementById('mfn-vb-sidebar');
var preview = document.getElementById('mfn-preview-wrapper-holder');
var startY, startX, startWidth, endWidth = ui_mode == 'dev' ? 360 : 420;
var resizer_base = ui_mode == 'dev' ? 360 : 420;
resizer.addEventListener('mousedown', initDrag, false);
function initDrag(e) {
startX = e.clientX;
sidebar.classList.add("resizing-active");
startWidth = ui_mode == 'dev' ? 360 : 420;
document.documentElement.addEventListener('mousemove', doDrag, false);
document.documentElement.addEventListener('mouseup', stopDrag, false);
}
function doDrag(e) {
endWidth = (startWidth + e.clientX - startX);
if(endWidth < 1200 && endWidth >= resizer_base) {
if( $('style.mfn-ui-sidebar-width-style').length ) $('style.mfn-ui-sidebar-width-style').remove();
$('body').append(`<style class="mfn-ui-sidebar-width-style">.mfn-${ui_mode == 'dev' ? 'dev' : 'default'}-ui .mfn-ui{--mfn-ui-sidebar-width: ${endWidth}px;}</style>`);
if( endWidth > 800 ){
$('.mfn-visualbuilder .sidebar-wrapper').addClass('mfn-items-4-columns').removeClass('mfn-items-3-columns');
}else if( endWidth > 550 ){
$('.mfn-visualbuilder .sidebar-wrapper').addClass('mfn-items-3-columns').removeClass('mfn-items-4-columns');
}else{
$('.mfn-visualbuilder .sidebar-wrapper').removeClass('mfn-items-3-columns mfn-items-4-columns');
}
}
}
function stopDrag(e) {
sidebar.classList.remove("resizing-active");
document.documentElement.removeEventListener('mousemove', doDrag, false);
document.documentElement.removeEventListener('mouseup', stopDrag, false);
}
let historyStorage = {
allow: true,
obj: [],
i: 0,
/*object: function() {
return localStorage.getItem('mfnhistory') ? JSON.parse(localStorage.getItem(`mfnhistory`)) : [];
},*/
init: function() {
setTimeout(historyStorage.add(), 500);
historyStorage.click();
},
add: function() {
// addHistory historyStorage.add()
if( !historyStorage.allow ) return;
//let history = historyStorage.object();
if( historyStorage.i > 0) {
//history = history.filter( (y,x) => x >= historyStorage.i );
historyStorage.obj = historyStorage.obj.filter( (y,x) => x >= historyStorage.i );
}
historyStorage.i = 0;
$('.mfn-history-btn.btn-undo').addClass('loading');
let new_hist = {
'obj': JSON.parse( JSON.stringify(mfn.pagedata) ),
'pageid': pageid,
'uid': edited_item ? edited_item.uid : false
};
if( !$('body').hasClass('mfn-history-ajax-mode') ) {
new_hist['html'] = $builder.html();
}else{
new_hist['form'] = prepareForm.get();
}
//console.log(new_hist);
historyStorage.obj.unshift( new_hist );
//console.log( 'add history ');
$('.mfn-history-btn.btn-undo').removeClass('loading');
historyStorage.index();
//console.log( historyStorage.obj );
},
click: function() {
$('.mfn-history-btn').on('click', function(e) {
e.preventDefault();
$el = $(this);
//let history = historyStorage.object();
if( !$el.hasClass('inactive') && !$el.hasClass('loading') ){
let historyAction = 'undo';
if( $el.hasClass('btn-redo') && historyStorage.i > 0 ){
historyAction = 'redo';
historyStorage.i--;
}else if( $el.hasClass('btn-undo') && historyStorage.i <= historyStorage.obj.length ){
historyStorage.i++;
}else{
$el.addClass('inactive');
return;
}
$el.addClass('loading');
$content.find('body').addClass('mfn-loading');
historyStorage.restore();
}
});
},
index: function() {
if(historyStorage.i < historyStorage.obj.length-1){
$undo.removeClass('inactive');
}else{
$undo.addClass('inactive');
}
if(historyStorage.i < 1){
$redo.addClass('inactive');
}else{
$redo.removeClass('inactive');
}
history = false;
},
restore: function() {
//let history = historyStorage.object();
var h_event = historyStorage.obj[historyStorage.i];
//console.log(h_event);
if( typeof h_event === 'undefined' ) {
historyStorage.index();
$('.mfn-history-btn').removeClass('loading');
$content.find('body').removeClass('mfn-loading');
return;
}
if( h_event.pageid != pageid ) return;
edited_item = false;
mfn.pagedata = h_event.obj;
if( typeof h_event.html !== 'undefined' ){
$builder.html( h_event.html );
historyStorage.after_restore(h_event);
}else{
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnsimplerenderhtml',
'mfn-builder-nonce': wpnonce,
sections: h_event.form,
id: pageid
},
type: 'POST',
success: function(response){
//console.log(response);
$builder.html( response );
historyStorage.after_restore(h_event);
}
});
}
},
after_restore: function(h_event) {
if( $builder.find('.mfn-initialized').length ){
$builder.find('.mfn-initialized').removeClass('mfn-initialized mfn-watchChanges mfn-blur-action mfn-focused').removeAttr('data-medium-editor-element medium-editor-index');
inlineEditors = [];
}
backToWidgets();
$('.mfn-history-btn').removeClass('loading');
$content.find('body').removeClass('mfn-loading');
$content.find("style.mfn-local-style").remove();
blink( true );
runAjaxElements();
inlineEditor();
loopAllStyleFields();
historyStorage.index();
be_layout.emptys.page();
be_layout.emptys.sections();
be_layout.emptys.wraps();
if( $('body').hasClass('mfn-navigator-active') ){
if( $('.mfn-navigator li a.active-element').length ){
be_navigator.show($('.mfn-navigator li a.active-element').attr('data-uid'));
}else{
be_navigator.show(h_event.uid);
}
}
if( h_event.uid ){
setTimeout(function() {
$builder.find('.vb-item[data-uid="'+h_event.uid+'"]').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
}, 50);
}
}
}
function calculateIframeHeight(){
var offset_top = $('iframe#mfn-vb-ifr').offset().top;
if( !$('.mfn-topbar').length && $('body').hasClass('mfn-preview-mode')) offset_top -= $('.mfn-preview-toolbar').outerHeight();
if( $('.mfn-topbar').length ) offset_top -= $('.mfn-topbar').outerHeight();
$content.find('body').addClass('hover');
scroll_top = $content.find("html, body").scrollTop();
if( builder_type != 'header' ) $('.frameOverlay').height( $content.find("body").height() );
$content.find("html").css({ 'overflow': 'hidden' });
$(window).scrollTop( scroll_top );
var mt = scroll_top + offset_top;
$('iframe#mfn-vb-ifr').css({ 'margin-top': mt });
$(window).on('scroll', function() {
$content.find('html, body').scrollTop( $(this).scrollTop() );
});
}
function resetIframeHeight() {
$(window).off('scroll');
if( builder_type == 'header' ){
$content.find("html").css({ 'overflow': 'hidden' });
}else{
$content.find("html").css({ 'overflow': 'auto' });
}
$content.find('html, body').scrollTop( scroll_top );
$('.frameOverlay').removeAttr('style');
$('iframe#mfn-vb-ifr').removeAttr('style');
$content.find('body').removeClass('hover');
}
function hideContext(e) {
var context = $content.find('.mfn-builder-area-contextmenu');
if (!context.is(e.target) && context.has(e.target).length === 0){
$content.find('.mfn-builder-area-contextmenu').hide();
}
$content.find('body').unbind('click', hideContext);
}
function hideContextEditor(e) {
var context = $('.mfn-builder-area-contextmenu');
if (!context.is(e.target) && context.has(e.target).length === 0){
$('.mfn-builder-area-contextmenu').hide();
}
$('body').unbind('click', hideContextEditor);
}
function handleVisibilityChange() {
if ( !document.hidden ) {
copypaste.ls_obj = localStorage.getItem("mfn_copy") ? JSON.parse(localStorage.getItem("mfn_copy")) : false;
}
}
function iframeReady(){
sliderInput.unitChange();
sliderInput.customValue();
presets.init();
$content.on('click', '.mfn-rev-slider a:not(.btn-edit-slider), .mcb-column-inner *:not(.mfn-header) a:not(.btn-edit-slider), .mcb-column-inner > a, .mfn-footer-stickymenu a', function(e) {
e.preventDefault();
});
document.getElementById('mfn-vb-ifr').contentWindow.addEventListener('keydown', function(event) {
catchShortcuts(event);
});
if( builder_type == 'header' ){
$builder = $content.find('.mfn-header-tmpl-builder');
headerTmpl.init();
$content.find("html").css({ 'overflow': 'hidden' });
}else if( builder_type == 'megamenu' ){
$builder = $content.find('.mfn-megamenu-tmpl-builder');
}else if( builder_type == 'sidemenu' ){
$builder = $content.find('.mfn-sidemenu-tmpl-builder');
}else if( builder_type == 'popup' ){
$builder = $content.find('.mfn-popup-tmpl-builder .mfn-popup-tmpl-content-wrapper');
}else if( builder_type == 'footer' ){
$builder = $content.find('.mfn-footer-tmpl-builder');
}else if( builder_type == 'shop-archive' ){
$builder = $content.find('.mfn-shop-archive-tmpl-builder');
}else if( builder_type == 'single-post' ){
$builder = $content.find('.mfn-single-post-tmpl-builder');
}else if( builder_type == 'blog' ){
$builder = $content.find('.mfn-blog-tmpl-builder');
}else if( builder_type == 'portfolio' ){
$builder = $content.find('.mfn-portfolio-tmpl-builder');
}else if( builder_type == 'single-portfolio' ){
$builder = $content.find('.mfn-single-portfolio-tmpl-builder');
}else if( builder_type == 'single-product' ){
$builder = $content.find('.mfn-single-product-tmpl-builder');
}else if( builder_type == 'cart' ){
$builder = $content.find('.mfn-cart-tmpl-builder');
cart_tmpl.init();
}else if( builder_type == 'checkout' ){
$builder = $content.find('.mfn-checkout-tmpl-builder');
}else if( builder_type == 'thanks' ){
$builder = $content.find('.mfn-thanks-tmpl-builder');
}else if( builder_type == 'default' ){
$builder = $content.find('.mfn-default-tmpl-builder');
}else if( builder_type == 'section' ){
$builder = $content.find('.mfn-section-tmpl-builder');
}else if( builder_type == 'wrap' ){
$builder = $content.find('.mfn-wrap-tmpl-builder');
}else{
$builder = $content.find('.mfn-default-content-buider');
}
mfn_hotspots_field.init();
$builder.addClass('mfn-builder-active');
if( builder_type == 'megamenu' ){
var page_options = mfn.page_options;
if( typeof page_options['megamenu_width'] !== "undefined" && page_options['megamenu_width'] == 'custom-width' ) {
$content.find('.mfn-megamenu-wrapper').css('width', page_options['megamenu_custom_width']);
}else if( typeof page_options['megamenu_width'] !== "undefined" && page_options['megamenu_width'] == 'full-width' ){
$content.find('.mfn-megamenu-wrapper').addClass('mfn-megamenu-full-width').removeAttr('style');
}
page_options = false;
}
// add element button in wrap
$builder.on('click', '.mfn-item-add', function(e) {
e.preventDefault();
backToWidgets();
});
if( $content && $content.find('.mcb-item-product_images-inner .woocommerce-product-gallery').length ){
$content.find('.mcb-item-product_images-inner .woocommerce-product-gallery').addClass('mfn-initialized');
}
editContentButton();
// sections context menu
$builder.on('click', '.section .mfn-option-dropdown .dropdown-wrapper a.mfn-dropdown-item', function(e) {
e.preventDefault();
let $it = $(this).closest('.mcb-section');
let sec_uid = $it.data('uid');
let sections_count = $content.find('.mcb-section').length-1;
if($(this).hasClass('mfn-section-hide')){
// hide
if($it.hasClass('hide')){
$(this).find('.label').text($(this).attr('data-hide'));
//$('.mfn-vb-'+sec_uid+' .mfn-type-section.hide input').val('');
if( typeof mfn.pagedata.filter( (item) => item.uid == sec_uid )[0]['attr']['hide'] !== 'undefined' ){
delete( mfn.pagedata.filter( (item) => item.uid == sec_uid )[0]['attr']['hide'] );
}
$('.mfn-navigator .navigator-tree li.nav-'+sec_uid+' .nav-item-tools .mfn-icon-hide').remove();
}else{
$(this).find('.label').text($(this).attr('data-show'));
//$('.mfn-vb-'+sec_uid+' .mfn-type-section.hide input').val('1');
mfn.pagedata.filter( (item) => item.uid == sec_uid )[0]['attr']['hide'] = '1';
if( $('body').hasClass('mfn-navigator-active') ){
$('.mfn-navigator .navigator-tree li.nav-'+sec_uid+' .nav-item-tools .navigator-arrow').before('<span class="mfn-icon mfn-icon-hide"></span>');
}
}
$it.toggleClass('hide');
}else if($(this).hasClass('mfn-section-move-down')){
// move down
if($it.next('.mcb-section').length){
$it.insertAfter($it.next());
historyStorage.add();
}
}else if($(this).hasClass('mfn-section-move-up')){
// move up
if($it.prev('.mcb-section').length){
$it.insertBefore($it.prev());
historyStorage.add();
}
}else if( $(this).hasClass('mfn-section-export') ){
// export
elementToClipboard(sec_uid);
}else if( !$(this).hasClass('mfn-disabled') && $(this).hasClass('mfn-section-import-before') ){
// import before
importFromClipboard(sec_uid, 'before');
}else if( !$(this).hasClass('mfn-disabled') && $(this).hasClass('mfn-section-import-after') ){
// import after
importFromClipboard(sec_uid, 'after');
}else if( !$(this).hasClass('mfn-disabled') && $(this).hasClass('mfn-section-import-replace') ){
// import & replace - for global sections
importFromClipboard(sec_uid, 'replace');
}else if( !$(this).hasClass('mfn-disabled') && $(this).hasClass('mfn-section-convert-to-global') ){
GlobalSections.convertToGlobal( sec_uid );
}
});
// add new section "+" addnewsection addsection
$builder.on('click', '.mfn-section-add', function(e) {
e.preventDefault();
if(!$content.find('.mfn-section-add').hasClass('loading')){
$content.find('.mfn-section-add').addClass('loading');
var new_element = elements.section();
//var navigator_html = be_navigator.item('Section', new_element.uid);
let uid = $(this).parent().data('uid');
let count = $content.find('.mcb-section').length;
let placement = 'next';
if($(this).hasClass('prev')){placement = 'prev';}
removeStartBuilding();
if (typeof(uid) !== 'undefined') {
if(placement == 'prev'){
$builder.find('.mcb-section[data-uid='+uid+']').before( new_element.html );
//$navigator.find('.navigator-tree .nav-'+uid).before(navigator_html);
}else{
$builder.find('.mcb-section[data-uid='+uid+']').after( new_element.html );
//$navigator.find('.navigator-tree .nav-'+uid).after(navigator_html);
}
}else{
$builder.prepend( new_element.html );
//$navigator.find('.navigator-tree').prepend(navigator_html);
}
$content.find('.mfn-section-add').removeClass('loading');
loopAllStyleFields(new_element.uid);
if($('body').hasClass('mfn-navigator-active')) be_navigator.show(new_element.uid);
$builder.find('.mcb-section-'+new_element.uid+ '.mfn-element-edit').trigger('click');
blink();
}
});
$builder.on('click', '.wrap-layout', function(e) {
e.preventDefault();
if(!$content.find('.wrap-layouts').hasClass('loading')){
//var navigator_tree = '';
$content.find('.wrap-layouts').addClass('loading');
let id = $(this).closest('.vb-item').attr('data-uid');
let type = $(this).data('type');
if($builder.find('.mcb-section-'+id+' .mfn-section-new').length){ $builder.find('.mcb-section-'+id+' .mfn-section-new').remove(); }
if( type == 'wrap-141214' ){
be_layout.new.wrap(id, false, '1/4');
be_layout.new.wrap(id, false, '1/2');
be_layout.new.wrap(id, false, '1/4');
}else if( type == 'wrap-2313' ){
be_layout.new.wrap(id, false, '2/3');
be_layout.new.wrap(id, false, '1/3');
}else if( type == 'wrap-1323' ){
be_layout.new.wrap(id, false, '1/3');
be_layout.new.wrap(id, false, '2/3');
}else if( type == 'wrap-14' ){
be_layout.new.wrap(id, false, '1/4');
be_layout.new.wrap(id, false, '1/4');
be_layout.new.wrap(id, false, '1/4');
be_layout.new.wrap(id, false, '1/4');
}else if( type == 'wrap-13' ){
be_layout.new.wrap(id, false, '1/3');
be_layout.new.wrap(id, false, '1/3');
be_layout.new.wrap(id, false, '1/3');
}else if( type == 'wrap-12' ){
be_layout.new.wrap(id, false, '1/2');
be_layout.new.wrap(id, false, '1/2');
}else{
be_layout.new.wrap(id, false, '1/1');
}
}
})
$builder.on('click', '.prebuilt-button', function(e) {
e.preventDefault();
showPrebuilts();
prebuiltType = $(this).closest('.mcb-section').data('uid');
});
$(document).on('click', '.mfn-yoast-tab', function(e) {
e.preventDefault();
if( $content.find('.vb-item.mfn-current-editing').length ) $content.find('.vb-item.mfn-current-editing').removeClass('mfn-current-editing');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor-full') ) $('.mfn-ui').addClass('mfn-class-editor-full');
showYoast();
});
$builder.on('click', '.add-global-sections-button', function(e) {
e.preventDefault();
showGlobals();
});
$content.find('body').append(`<div style="position: absolute; z-index: 999;" class="mfn-contextmenu mfn-builder-area-contextmenu"><h6 class="mfn-context-header">Section</h6><ul><li class="mfn-contextmenu-edit"><a href="#" data-action="edit"><span class="mfn-icon mfn-icon-edit"></span><span class="label">Edit</span></a></li><li class="mfn-contextmenu-copy"><a href="#" class="mfn-context-copy" data-action="copy"><span class="mfn-icon mfn-icon-copy"></span><span class="label">Copy</span></a></li><li class="mfn-contextmenu-paste"><a href="#" class="mfn-context-paste" data-action="paste"><span class="mfn-icon mfn-icon-paste"></span><span class="label">Paste</span></a></li><li class="mfn-contextmenu-copystyle"><a href="#" class="mfn-context-copy" data-action="copy"><span class="mfn-icon mfn-icon-copy-style"></span><span class="label">Copy style</span></a></li><li class="mfn-contextmenu-pastestyle"><a href="#" class="mfn-context-paste-style" data-action="paste-style"><span class="mfn-icon mfn-icon-paste-style"></span><span class="label">Paste style</span></a></li><li class="mfn-contextmenu-resetstyle"><a href="#" class="mfn-context-reset-style" data-action="reset-style"><span class="mfn-icon mfn-icon-reset-style"></span><span class="label">Reset style</span></a></li>${ $('body').hasClass('mfn-presets-enabled') ? '<li class="mfn-contextmenu-save-preset preset-action-button"><a href="#" data-action="save-preset"><span class="mfn-icon mfn-icon-preset"></span><span class="label">Save as preset</span></a></li>' : '' }<li class="mfn-contextmenu-save-class classes-action-button"><a href="#" class="mfn-save-new-class" data-action="save-class"><span class="mfn-icon mfn-icon-be-class"></span><span class="label">Save as global style</span></a></li><li class="mfn-contextmenu-convert-global-section global-section-action-button"><a href="#" data-action="convert-global-section"><span class="mfn-icon mfn-icon-convert-section-to-global"></span><span class="label">Convert to Global</span></a></li><li class="mfn-contextmenu-convert-global-wrap global-section-action-button"><a href="#" data-action="convert-global-wrap"><span class="mfn-icon mfn-icon-convert-section-to-global"></span><span class="label">Convert to Global</span></a></li><li class="mfn-contextmenu-navigator"><a href="#" data-action="navigator"><span class="mfn-icon mfn-icon-navigator"></span><span class="label">Navigator</span></a></li><li class="mfn-contextmenu-delete"><a href="#" data-action="delete"><span class="mfn-icon mfn-icon-delete-red"></span><span class="label">Delete</span></a></li></ul></div>`);
$builder.on('click', '.mfn-element-drag', function(e) { e.preventDefault(); });
$builder.on('click', '.mfn-header .mfn-option-dropdown a', function(e) { e.preventDefault(); });
// inline editor preven default
$builder.on('click', '.mfn-inline-editor a', function(e) {
e.preventDefault();
});
// Context menu for builder
$builder.contextmenu(function(e) {
if( $('#mfn-visualbuilder.mfn-ui').hasClass('sidebar_hidden') || $(e.target).closest('.mfn-global-section').length || $(e.target).closest('.mfn-global-wrap').length ) return;
e.preventDefault();
if(e.target.closest('.vb-item')){
var diff = iframe.window.jQuery('body').width() - e.pageX;
if( diff < 200 ){
$content.find('.mfn-builder-area-contextmenu').css({'right': 0, 'left': 'initial'});
}else{
$content.find('.mfn-builder-area-contextmenu').css({'left': e.pageX, 'right': 'initial'});
}
$content.find('.mfn-builder-area-contextmenu').show().css({top: e.pageY});
context_el = $(e.target).closest('.vb-item').attr('data-uid');
var this_el = mfn.pagedata.filter( (item) => item.uid == context_el )[0];
if( $(e.target).closest('.vb-item').hasClass('mcb-section')){
$content.find('.mfn-builder-area-contextmenu').attr('data-edited', 'Section');
$content.find('.mfn-builder-area-contextmenu .mfn-context-header').html('Section');
}else if( $(e.target).closest('.mcb-column-inner').length ){
$content.find('.mfn-builder-area-contextmenu').attr('data-edited', this_el.title);
$content.find('.mfn-builder-area-contextmenu .mfn-context-header').html( this_el.title );
}else{
$content.find('.mfn-builder-area-contextmenu').attr('data-edited', 'Wrap');
context_el = $(e.target).closest('.mcb-wrap').attr('data-uid');
$content.find('.mfn-builder-area-contextmenu .mfn-context-header').html('Wrap');
}
if( !copypaste.ls_obj ){
$content.find('.mfn-builder-area-contextmenu .mfn-context-paste').addClass('mfn-context-inactive');
$content.find('.mfn-builder-area-contextmenu .mfn-context-paste-style').addClass('mfn-context-inactive');
}else{
$content.find('.mfn-builder-area-contextmenu .mfn-context-paste').removeClass('mfn-context-inactive');
$content.find('.mfn-builder-area-contextmenu .mfn-context-paste-style').removeClass('mfn-context-inactive');
}
var copied_el = mfn.pagedata.filter( (item) => item.uid == copypaste.uid )[0];
if( !copypaste.ls_obj || !this_el || this_el.jsclass != copypaste.ls_obj['obj'][0]['jsclass'] ){
$content.find('.mfn-builder-area-contextmenu .mfn-context-paste-style').addClass('mfn-context-inactive');
}
if( this_el.jsclass == 'section' ){
$content.find('.mfn-builder-area-contextmenu .mfn-contextmenu-convert-global-section').show();
}else{
$content.find('.mfn-builder-area-contextmenu .mfn-contextmenu-convert-global-section').hide();
}
if( this_el.jsclass == 'wrap' ){
$content.find('.mfn-builder-area-contextmenu .mfn-contextmenu-convert-global-wrap').show();
}else{
$content.find('.mfn-builder-area-contextmenu .mfn-contextmenu-convert-global-wrap').hide();
}
/** PBL BE SECTIONS WRAPS */
const isGlobalSection = $content.find('body').hasClass('mfn-template-section');
const isGlobalWrap = $content.find('body').hasClass('mfn-template-wrap');
const isSectionEdited = $content.find('.mfn-builder-area-contextmenu').find('.mfn-context-header').attr('data-element') === 'Section';
const isWrapEdited = $content.find('.mfn-builder-area-contextmenu').find('.mfn-context-header').attr('data-element') === 'Wrap';
if( isGlobalSection && isSectionEdited ) {
$content.find('.mfn-builder-area-contextmenu').attr('hide-ui', 'section');
} else if( isGlobalWrap && isWrapEdited ) {
$content.find('.mfn-builder-area-contextmenu').attr('hide-ui', 'wrap');
} else {
$content.find('.mfn-builder-area-contextmenu').removeAttr('hide-ui');
}
}
$content.find('body').bind('click', hideContext);
});
// Context menu for navigator
$('.mfn-navigator').contextmenu(function(e) {
if( $('#mfn-visualbuilder.mfn-ui').hasClass('sidebar_hidden') || $(e.target).closest('.toggle-disabled').length ) return;
if( !$(e.target).closest('ul.navigator-tree').length ) {
$('.mfn-builder-area-contextmenu').hide();
return;
}else{
e.preventDefault();
}
if( $(e.target).closest('li') ){
context_el = $(e.target).closest('li').children('a').attr('data-uid');
$('.mfn-builder-area-contextmenu').removeClass('mfn-context-menu-section mfn-context-menu-wrap mfn-context-menu-item mfn-context-menu-global');
if( $(e.target).closest('li').hasClass('navigator-section') ){
$('.mfn-builder-area-contextmenu').addClass('mfn-context-menu-section');
}else if( $(e.target).closest('li').hasClass('navigator-wrap') ){
$('.mfn-builder-area-contextmenu').addClass('mfn-context-menu-wrap');
}else{
$('.mfn-builder-area-contextmenu').addClass('mfn-context-menu-item');
}
if( $(e.target).closest('li').hasClass('navigator-wrap-global') || $(e.target).closest('li').hasClass('navigator-section-global') ){
$('.mfn-builder-area-contextmenu').addClass('mfn-context-menu-global');
}
$('.mfn-builder-area-contextmenu').show().css({left:e.pageX, top: e.pageY});
if( $(e.target).closest('li').hasClass('navigator-section')){
$('.mfn-builder-area-contextmenu .mfn-context-header').html('Section').attr('data-element', 'Section');
}else if( $(e.target).closest('li').hasClass('navigator-wrap')){
$('.mfn-builder-area-contextmenu .mfn-context-header').html('Wrap').attr('data-element', 'Wrap');
}else if( $(e.target).closest('li').hasClass('navigator-item')){
$('.mfn-builder-area-contextmenu .mfn-context-header').html('Item').attr('data-element', 'Item');
}
if(!copypaste.ls_obj) {
$navigator.find('.mfn-builder-area-contextmenu .mfn-context-paste').addClass('mfn-context-inactive');
$navigator.find('.mfn-builder-area-contextmenu .mfn-context-paste-style').addClass('mfn-context-inactive');
}else{
$navigator.find('.mfn-builder-area-contextmenu .mfn-context-paste').removeClass('mfn-context-inactive');
$navigator.find('.mfn-builder-area-contextmenu .mfn-context-paste-style').removeClass('mfn-context-inactive');
}
if( copypaste.ls_obj && $('.mfn-vb-'+context_el).attr('data-item') != copypaste.ls_obj['obj'][0]['jsclass'] ) {
$navigator.find('.mfn-builder-area-contextmenu .mfn-context-paste-style').addClass('mfn-context-inactive');
}
$('body').bind('click', hideContextEditor);
/** PBL BE SECTIONS WRAPS */
const isGlobalSection = $('body').hasClass('mfn-template-section');
const isGlobalWrap = $('body').hasClass('mfn-template-wrap');
const isSectionEdited = $('.mfn-builder-area-contextmenu').find('.mfn-context-header').attr('data-element') === 'Section';
const isWrapEdited = $('.mfn-builder-area-contextmenu').find('.mfn-context-header').attr('data-element') === 'Wrap';
if( isGlobalSection && isSectionEdited ) {
$('.mfn-builder-area-contextmenu').attr('hide-ui', 'section');
} else if( isGlobalWrap && isWrapEdited ) {
$('.mfn-builder-area-contextmenu').attr('hide-ui', 'wrap');
} else {
$('.mfn-builder-area-contextmenu').removeAttr('hide-ui');
}
}
});
// context menu actions
$content.find('.mfn-builder-area-contextmenu li a').on('click', function(e) {
e.preventDefault();
let action = $(this).data('action');
sidebar_form.is_class = false;
if(action == 'delete'){
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-element-delete').trigger('click');
}else if(action == 'edit'){
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
}else if(action == 'copy'){
copypaste.copy(context_el);
}else if(action == 'clone'){
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-module-clone').trigger('click');
}else if(action == 'paste'){
//let $el = $content.find('.vb-item[data-uid="'+context_el+'"]');
copypaste.parent = $content.find('.vb-item[data-uid="'+context_el+'"]');
copypaste.paste();
}else if(action == 'paste-style'){
if( !copypaste.ls_obj ) return;
var copied_el = copypaste.ls_obj['obj'][0];
var this_el = mfn.pagedata.filter( (item) => item.uid == context_el )[0];
if( copied_el.jsclass != this_el.jsclass ){
return; // different items
}
for (key in this_el.attr) {
if( key.startsWith('style:') || key.startsWith('css_') ) {
this_el.attr[key] = '';
}
}
for (key in copied_el.attr) {
if( key.startsWith('css_') || key.startsWith('style:') || key.includes('_switcher') ) {
this_el.attr[key] = JSON.parse( JSON.stringify(copied_el.attr[key]));
}
}
sidebar_form.open( $builder.find('.vb-item[data-uid="'+context_el+'"]'), false );
loopAllStyleFields(context_el);
historyStorage.add();
}else if(action == 'save-preset'){
presets.modal( context_el );
}else if(action == 'save-class'){
mfn_classes.uid = context_el;
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
setTimeout(mfn_classes.modal(), 10);
}else if(action == 'convert-global-section'){
GlobalSections.convertToGlobal( context_el );
}else if(action == 'convert-global-wrap'){
GlobalWraps.selectedUid = context_el;
context_el = $builder.find('.vb-item[data-uid="'+context_el+'"]').closest('.mcb-section').attr('data-uid')
GlobalWraps.convertToGlobal( context_el );
}else if(action == 'reset-style'){
var this_el = mfn.pagedata.filter( (item) => item.uid == context_el )[0];
var listStyles = {};
listStyles = this_el.attr;
for(key in listStyles) {
if(key.startsWith('css_') || key.startsWith('style:') || key.includes('height_switcher') || key.includes('width_switcher') ) {
delete listStyles[key];
}
}
$content.find('style.mfn-local-style').remove();
sidebar_form.open( $edited_div, false );
loopAllStyleFields();
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
historyStorage.add();
}else if(action == 'navigator'){
be_navigator.show(context_el);
}
$content.find('.mfn-builder-area-contextmenu').hide();
});
$('.mfn-builder-area-contextmenu li a').on('click', function(e) {
e.preventDefault();
let action = $(this).data('action');
//console.log(context_el);
if(action == 'delete'){
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-element-delete').trigger('click');
}else if(action == 'edit'){
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
}else if(action == 'copy'){
copypaste.copy(context_el);
$content.find('.mfn-builder-area-contextmenu').hide();
}else if(action == 'clone'){
$content.find('.vb-item[data-uid="'+context_el+'"]').find('.mfn-header').first().find('.mfn-module-clone').trigger('click');
}else if(action == 'paste'){
$content.find('.mfn-builder-area-contextmenu').hide();
//let $el = $content.find('.vb-item[data-uid="'+context_el+'"]');
copypaste.parent = $content.find('.vb-item[data-uid="'+context_el+'"]');
copypaste.paste();
}
$('.mfn-builder-area-contextmenu').hide();
});
// size label +- show
$builder.on('click', '.mfn-header .mfn-option-btn.mfn-size-label', function(e) {
if( $content.find('body').hasClass('mfn-modern-nav') ){
$(this).closest('.mfn-header').toggleClass('mfn-size-change-show');
}
});
// edit on box click
$builder.on('mouseup', function(e) {
//e.preventDefault();
if( preventEdit ) return;
if(
$(e.target).closest('.mfn-global-section').length ||
$(e.target).closest('.mfn-global-wrap').length ||
$(e.target).closest('.column_placeholder').length ||
!$(e.target).closest('.vb-item').length ||
$(e.target).closest('.mfn-wrap-add-item').length ||
/*$(e.target).closest('.mfn-section-start').length ||*/
$(e.target).closest('.mcb-section.empty').length ||
$(e.target).closest('.divider').length ||
/*$(e.target).closest('.mcb-wrap-inner.empty').length ||*/
iframe.getSelection().toString() ||
( $(e.target).closest('.mfn-header').length && !$(e.target).hasClass('section-header') )
) {
return;
}
if( $content.find('body').hasClass('mfn-modern-nav') && !$(e.target).closest('.mfn-header.mfn-element-menu-opened').length ){
$content.find('.mfn-header.mfn-element-menu-opened').removeClass('mfn-element-menu-opened mfn-size-change-show');
}
if( $(e.target).hasClass('mcb-column') ){
$edited_div = $(e.target).closest('.mcb-wrap');
}else{
$edited_div = $(e.target).closest('.vb-item');
}
if( !$edited_div.hasClass('mfn-current-editing') || sidebar_form.is_class ){
sidebar_form.is_class = false;
sidebar_form.open($edited_div, false);
}
// Sidebar adjustments for Globals
GlobalSections.sectionTriggered = $edited_div;
GlobalSections.setSidebarClass();
});
// edit on icon click
$builder.on('click', '.mfn-header .mfn-element-edit', function(e) {
e.preventDefault();
if( preventEdit ) return;
if( $(this).closest('.vb-item').hasClass('mfn-current-editing') ) return;
$edited_div = $(this).closest('.vb-item');
if( $edited_div.hasClass('mfn-global-section') ) {
GlobalSections.sectionTriggered = $edited_div;
$('#header-global-sections').attr('section-id', $edited_div.attr('data-uid'));
return showGlobals( $edited_div.attr('data-mfn-global') );
}
sidebar_form.is_class = false;
sidebar_form.open($edited_div, false);
});
// dropdown for global sections on new section
$builder.on('click', '.add-global-sections-button', function(e) {
const sectionUid = $(this).closest('.mcb-section').attr('data-uid'); // mcb-wrap-uid
$('#header-global-sections').attr('section-id', sectionUid);
})
// dropdown for global sections on new section
$('.panel-global-sections').on('click', '.mfn-insert-global-section', function(e) {
e.preventDefault();
const selected = $(e.target).closest('li').attr('data-id');
const sectionUid = $('#header-global-sections').attr('section-id');
$('#header-global-sections').attr(sectionUid);
$edited_div = $content.find(`.section[data-uid=${sectionUid}]`);
GlobalSections.fillSectionInfoWithoutCut(sectionUid, selected);
GlobalSections.getGlobalSection();
})
// resize
$builder.on('click', '.mfn-header .mfn-size-change', function(e) {
e.preventDefault();
let item_type = 'mcb-item-';
if( $content.find('.vb-item.mfn-current-editing').length ) $content.find('.vb-item.mfn-current-editing').removeClass('mfn-current-editing');
if( edited_item && typeof edited_item.jsclass !== 'undefined' ) $('.mfn-ui').removeClass('mfn-editing-'+edited_item.jsclass);
$('.mfn-ui').removeClass('mfn-editing-element mfn-editing-section mfn-editing-wrap mfn-editing-nested-wrap');
let uid = $(this).closest('.vb-item').attr('data-uid');
edited_item = mfn.pagedata.filter( (item) => item.uid == uid )[0];
let type = edited_item.type;
if( edited_item.jsclass == 'wrap' ) item_type = 'mcb-wrap-';
let currClass = sizes.filter(size => size.key === edited_item.size)[0];
if( !edited_item.mobile_size ) edited_item.mobile_size = '1/1';
if( !edited_item.tablet_size ) edited_item.tablet_size = edited_item.size;
if(screen == 'tablet'){
currClass = sizes.filter(size => size.key === edited_item.tablet_size)[0];
}else if(screen == 'laptop'){
currClass = sizes.filter(size => size.key === edited_item.laptop_size)[0];
}else if(screen == 'mobile'){
currClass = sizes.filter(size => size.key === edited_item.mobile_size)[0];
}
let newIndex = currClass.index;
if( $(this).hasClass('mfn-size-decrease') ) {
newIndex = newIndex - 1 < 1 ? 1 : newIndex - 1;
}else{
newIndex = newIndex + 1 > 12 ? 12 : newIndex + 1;
}
let newClass = sizes.filter(size => size.index === newIndex)[0];
if( !items_size[type] || ( items_size[type].length && items_size[type].includes(newClass.key) ) ) {
if($content.find('.vb-item[data-uid='+uid+'] > div > .mfn-header .mfn-element-size-label').length) {
$content.find('.vb-item[data-uid='+uid+'] > div > .mfn-header .mfn-element-size-label').text(newClass.key);
}
$content.find('.'+item_type+uid).attr('data-'+screen+'-size', newClass.key);
if(screen == 'desktop') {
$content.find('.'+item_type+uid).removeClass(currClass.desktop).addClass(newClass.desktop).attr('data-'+screen+'-col', newClass.desktop);
edited_item.size = newClass.key;
if( typeof edited_item.tablet_resized === 'undefined' || edited_item.tablet_resized == '0' ) {
edited_item.tablet_size = newClass.key;
$content.find('.'+item_type+uid).removeClass(currClass.tablet).addClass(newClass.tablet).attr('data-tablet-size', newClass.key);
}
if( typeof edited_item.laptop_resized === 'undefined' || edited_item.laptop_resized == '0' ) {
edited_item.laptop_size = newClass.key;
$content.find('.'+item_type+uid).removeClass(currClass.laptop).addClass(newClass.laptop).attr('data-laptop-size', newClass.key);
}
}else if(screen == 'laptop') {
if(typeof edited_item.tablet_resized === 'undefined' || edited_item.tablet_resized == '0' ) {
edited_item.tablet_size = newClass.key;
$content.find('.'+item_type+uid).removeClass(currClass.tablet).addClass(newClass.tablet).attr('data-tablet-size', newClass.key);
}
$content.find('.'+item_type+uid).removeClass(currClass.laptop).addClass(newClass.laptop).attr('data-'+screen+'-col', newClass.laptop);
edited_item.laptop_resized = '1';
edited_item.laptop_size = newClass.key;
}else if(screen == 'tablet') {
$content.find('.'+item_type+uid).removeClass(currClass.tablet).addClass(newClass.tablet).attr('data-'+screen+'-col', newClass.tablet);
edited_item.tablet_resized = '1';
edited_item.tablet_size = newClass.key;
}else{
$content.find('.'+item_type+uid).removeClass(currClass.mobile).addClass(newClass.mobile).attr('data-'+screen+'-col', newClass.mobile);
edited_item.mobile_size = newClass.key;
}
if($navigator.find('.navigator-tree li.nav-'+uid+' .navigator-size-label').length) {
$navigator.find('.navigator-tree li.nav-'+uid+' > a .navigator-size-label').text(newClass.key);
}
}
resetBeforeAfter(uid);
if($content.find('.'+item_type+uid+' .slick-initialized').length) {
$content.find('.vb-item[data-uid='+uid+'] .slick-initialized').each(function() {
$(this).slick('setPosition');
});
}
if($content.find('.'+item_type+uid+' .isotope.mfn-initialized').length) {
$content.find('.'+item_type+uid+' .isotope.mfn-initialized').each(function() {
var $iso_wrapper = $(this);
$iso_wrapper.closest('.mcb-column-inner').css('min-height', $iso_wrapper.closest('.mcb-column-inner').outerHeight());
$iso_wrapper.removeClass('mfn-initialized');
runAjaxElements();
});
}
if( $content.find('.'+item_type+uid+' .woocommerce-product-gallery').length ) iframe.window.jQuery('body').trigger('resize');
reLayoutIsotope( item_type+uid );
historyStorage.add();
});
// delete
$builder.on('click', '.mfn-header .mfn-element-delete', function(e) {
e.preventDefault();
let $dom_el = $(this).closest('.vb-item');
let uid = $dom_el.attr('data-uid');
let force_re_render = false;
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-delete"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Delete element</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <img class="icon" alt="" src="'+mfn.themepath+'/muffin-options/svg/warning.svg"> <h3>Delete element?</h3> <p>Please confirm. There is no undo.</p><a class="mfn-btn mfn-btn-red btn-wide btn-modal-confirm" href="#"><span class="btn-wrapper">Delete</span></a> </div></div></div>');
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
});
$('.btn-modal-confirm').on('click', function(e){
e.preventDefault();
//mfn.pagedata = mfn.pagedata.filter( (item) => item.uid != uid );
if( $navigator.find('.navigator-tree li.nav-'+uid).length ){
$navigator.find('.navigator-tree li.nav-'+uid).remove();
}
if( $dom_el.closest('.mfn-looped-items').length ) {
force_re_render = $dom_el.closest('.mcb-section').attr('data-uid');
}
if( $dom_el.next('.mfn-read-more-line').length ) $dom_el.next('.mfn-read-more-line').remove();
$dom_el.remove();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
iframe.window.jQuery('body').trigger('resize');
if( force_re_render ) re_render( force_re_render );
be_layout.emptys.page();
be_layout.emptys.wraps()
be_layout.emptys.sections();
backToWidgets();
historyStorage.add();
});
});
// clone section
$builder.on('click', '.mfn-module-clone', function(e) {
e.preventDefault();
let $el = $(this).closest('.vb-item');
if( builder_type == 'header' && $el.hasClass('mcb-wrap') && $(this).closest('.mfn-new-wraps-disabled').length ) return;
copypaste.copy( $el.attr('data-uid'), $el );
});
// add wrap
$builder.on('click', '.mfn-wrap-add', function(e) {
e.preventDefault();
let thisid = $(this).closest('.vb-item').attr('data-uid');
let is_divider = 0;
if($(this).hasClass('mfn-divider-add')){ is_divider = 1; }
be_layout.new.wrap(thisid, is_divider, '1/1');
});
inlineEditor();
if( $content.find('.section_video .mfn-vb-video-lazy').length ) {
$content.find('.section_video .mfn-vb-video-lazy').each(function() {
$(this).replaceWith( $(this).html().replace('<!--', '').replace('-->', '') );
})
}
loopAllStyleFields();
}
$editpanel.on('click', '.btn-save-option', function(e) {
e.preventDefault();
if (mfn.view == 'demo') return;
$(this).parent().toggleClass('s-opt-show');
$editpanel.bind('click', closeSaveOpt);
$content.bind('click', closeSaveOpt);
});
function editContentButton() {
if( $builder.find( '.mfn-builder-content:not(.mfn-builder-active)' ).length && mfn.view != 'demo' ) {
$builder.find( '.mfn-builder-content:not(.mfn-builder-active)' ).each(function(i, el) {
let this_item = $(el).closest('.mcb-column.vb-item');
if( this_item.length && !this_item.find('.btn-edit-content').length ) this_item.append('<a href="'+mfn.adminurl+'post.php?post='+$(el).attr("data-id")+'&action='+(mfn.be_slug == 'be' || mfn.be_slug == 'mfn' ? 'mfn' : mfn.be_slug)+'-live-builder" target="_blank" data-tooltip="Edit Content" class="btn-edit-content" data-position="right">Edit content</a>')
});
}
}
$editpanel.on('click', '.btn-save-changes', function(e){
e.preventDefault();
if( mfn.view == 'demo' ) return;
if($(this).hasClass('loading disabled')) return;
var $list = $(".panel.panel-revisions-update ul.revisions-list");
var formaction = $(this).attr('data-action');
var isSectionWrapEditor = $('body').hasClass('mfn-template-section') || $('body').hasClass('mfn-template-wrap');
if( $('.modal-display-conditions').length && !$('.modal-display-conditions').hasClass('show') && ( builder_type == 'popup' || builder_type == 'header' || builder_type == 'shop-archive' || builder_type == 'blog' || builder_type == 'portfolio' || builder_type == 'single-product' || builder_type == 'footer' || builder_type == 'single-post' || builder_type == 'single-portfolio' ) ){
// if template conditions
$('.modal-display-conditions .btn-save-changes').attr('data-action', formaction);
$('.modal-display-conditions').addClass('show');
return;
}else if( builder_type == 'cart' || builder_type == 'checkout' || builder_type == 'thanks' ){
if(!$('.modal-cart-confirmation').hasClass('show')){
$('.modal-cart-confirmation').addClass('show');
$.ajax({
url: mfnajaxurl,
data: {
action: 'verifycartcheckout_tmpl',
'mfn-builder-nonce': wpnonce,
id: pageid,
type: builder_type
},
type: 'POST',
success: function(response){
$('.modal-cart-confirmation-desc').html(response);
}
});
return;
}
}
$(this).addClass('loading disabled');
prepareForm.save = true;
var formData = prepareForm.get();
let pf_obj = JSON.stringify(prepareForm.object);
if( !mfn.current_user_roles.includes("administrator") ) {
formData = formData.replaceAll('onclick', 'restricted');
pf_obj = pf_obj.replaceAll('onclick', 'restricted');
}
var datas = {
'mfn-builder-nonce': wpnonce,
'action': 'updatevbview',
'pageid': pageid,
'savetype': formaction,
'sections': formData,
'obj': pf_obj,
};
if( prepareForm.template_confirm ) {
datas['tmpl_confirmation'] = 1;
prepareForm.template_confirm = false;
}
// attach template conditions
if( $('.modal-display-conditions').length && $('.modal-display-conditions').hasClass('show') ){
let conditions = $(document.forms['tmpl-conditions-form']).serializeArray();
for (var i=0; i<conditions.length; i++)
datas[ conditions[i].name ] = conditions[i].value;
}
$(document).trigger('be:update');
$.ajax({
url: mfnajaxurl,
data: datas,
type: 'POST',
error: function (request, status, error) {
console.error(request);
$('.btn-save-changes').removeClass('loading disabled');
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar mfn-snackbar-error"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">Error '+request.status+': Please check your code, server configuration or contact your hosting provider.</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
},
success: function(response){
if(response){ displayRevisions(response, $list); }
window.onbeforeunload = null;
$('.btn-save-changes').removeClass('loading disabled');
datas = {};
if(formaction == 'publish'){
$('.btn-save-form-primary').attr('data-action', 'update');
$('.btn-save-form-primary span').text('Update');
savebutton = 'Update';
formaction = 'update';
$('.btn-save-form-secondary').attr('data-action', 'draft');
$('.btn-save-form-secondary span').text('Save as draft');
}else if(formaction == 'draft'){
$('.btn-save-form-primary').attr('data-action', 'publish');
$('.btn-save-form-primary span').text('Publish');
savebutton = 'Publish';
formaction = 'publish';
$('.btn-save-form-secondary').attr('data-action', 'update');
$('.btn-save-form-secondary span').text('Save draft');
}
if( $('.modal-display-conditions').length ){
$('.modal-display-conditions .btn-modal-save').removeClass('loading disabled');
$('.modal-display-conditions').removeClass('show');
}
if( settings.forceReload ){
settings.continue();
}
if( $('.modal-cart-confirmation.show').length ){
$('.modal-cart-confirmation').removeClass('show');
}
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">Page updated.</div><div class="snackbar-action"><a href="'+$('.menu-viewpage').attr('href')+'" target="_blank">View page</a></div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
}
});
});
$(document).on('click', '.btn-modal-confirm-with-overwrite', function(e) {
e.preventDefault();
prepareForm.template_confirm = true;
var button = $(this);
if( button.hasClass('confirmed') ) {
button.removeClass('confirmed');
setTimeout(function() { button.find('.btn-wrapper').html(button.attr('data-set')); }, 500);
}else{
button.addClass('confirmed');
setTimeout(function() { button.find('.btn-wrapper').html(button.attr('data-back')); }, 500);
}
setTimeout(function() { $('.modal-cart-confirmation-desc').html(' '); }, 1000);
$('.modal-cart-confirmation .btn-save-changes').trigger('click');
});
var prepareForm = {
formData: [],
si: 0, // section index
wi: 0, // wrap index
ii: 0, // item index
nwi: 0, // nested item index
object: [],
save: false,
template_confirm: false,
post_id: samplecontentid || pageid,
get: function(uid = false) {
prepareForm.formData = [];
prepareForm.object = [];
//prepareForm.object.push( mfn.pagedata.filter( (item) => item.uid === 'pageoptions' )[0] ); // pageoptions is required
var $wrapper = $builder.find('.mcb-section.vb-item');
if( uid ) $wrapper = $builder.find('.vb-item[data-uid="'+uid+'"]');
$wrapper.each(function(s) {
prepareForm.si = s;
var style_obj = {};
var vb_uid = $(this).attr('data-uid');
var this_vb = mfn.pagedata.filter( (item) => item.uid === vb_uid )[0];
if( this_vb && typeof this_vb.uid !== 'undefined' ){
// if( (_.has(this_vb, 'jsclass') && this_vb.jsclass != 'wrap' && this_vb.jsclass != 'section') || !prepareForm.save ){
if( !prepareForm.save ){
this_vb.attr['vb_postid'] = prepareForm.post_id;
this_vb.attr['vb'] = 1;
this_vb.attr['rwd'] = screen;
}
prepareForm.formData[prepareForm.si] = this_vb;
style_obj['jsclass'] = this_vb.jsclass;
style_obj['uid'] = this_vb.uid;
if( _.has(this_vb, 'attr') ) {
style_obj['attr'] = this_vb.attr;
$.each(this_vb.attr, function(i, v) {
if( i.includes('style:') || i.includes('query_') || i.includes('css_') ) style_obj['attr'][i] = v;
});
}
if( !$(this).hasClass('mfn-global-section') && $(this).find('.wrap.vb-item').length ){
this_vb.wraps = [];
prepareForm.wraps( $(this).find('.section_wrapper') );
}
prepareForm.object.push(style_obj);
}
});
prepareForm.save = false;
// console.log(prepareForm.formData);
// console.log(prepareForm.object);
return JSON.stringify(prepareForm.formData);
},
wraps: function( $wrapper, nested = false ) {
var $wraps = $wrapper.find( '.wrap.vb-item:not(.mfn-nested-wrap)' );
$wraps.each(function(w) {
prepareForm.wi = w;
var style_obj = {};
var wrap_uid = $(this).attr('data-uid');
var this_wrap = mfn.pagedata.filter( (item) => item.uid === wrap_uid )[0];
if( this_wrap ) {
if( !GlobalWraps.selectedUid.length || GlobalWraps.selectedUid == this_wrap.uid ){
if( _.has(this_wrap, 'item_is_wrap') ) delete(this_wrap['item_is_wrap']);
if( !_.has(this_wrap, 'jsclass') ) this_wrap['jsclass'] = 'wrap';
if( _.has(this_wrap, 'attr') ) {
if( prepareForm.save ){
if( typeof this_wrap.attr['vb_postid'] !== 'undefined' ) delete this_wrap.attr['vb_postid'];
if( typeof this_wrap.attr['rwd'] !== 'undefined' ) delete this_wrap.attr['rwd'];
if( typeof this_wrap.attr['vb'] !== 'undefined' ) delete this_wrap.attr['vb'];
}else{
this_wrap.attr['vb_postid'] = prepareForm.post_id;
this_wrap.attr['vb'] = 1;
this_wrap.attr['rwd'] = screen;
}
}
style_obj['jsclass'] = this_wrap.jsclass;
style_obj['uid'] = this_wrap.uid;
if( _.has(this_wrap, 'attr') ) {
style_obj['attr'] = {};
$.each(this_wrap.attr, function(i, v) {
if( i.includes('style:') || i.includes('query_') || i.includes('css_') ) style_obj['attr'][i] = v;
});
}
if( !prepareForm.formData[prepareForm.si]['wraps'].filter( (item) => item.uid === wrap_uid ).length ){
this_wrap.items = [];
prepareForm.formData[prepareForm.si]['wraps'][prepareForm.wi] = this_wrap;
if( !$(this).hasClass('mfn-global-wrap') ) prepareForm.items($(this).children('.mcb-wrap-inner'));
prepareForm.object.push(style_obj);
}
}
}
});
},
nested_items: function( $wrapper ) {
$wrapper.find( '.mfn-module.vb-item' ).each(function(w) {
prepareForm.nwi = w;
var item_uid = $(this).attr('data-uid');
var this_item = mfn.pagedata.filter( (item) => item.uid === item_uid )[0];
if( this_item && !prepareForm.formData[prepareForm.si]['wraps'][prepareForm.wi]['items'][prepareForm.ii]['items'].filter( (item) => item.uid === item_uid ).length ){
//this_item.items = [];
if( this_item.jsclass == 'wrap' ) this_item.item_is_wrap = 1;
if( this_item && typeof this_item.attr !== 'undefined' ) {
if( prepareForm.save ){
if( typeof this_item.attr['vb_postid'] !== 'undefined' ) delete this_item.attr['vb_postid'];
if( typeof this_item.attr['rwd'] !== 'undefined' ) delete this_item.attr['rwd'];
if( typeof this_item.attr['vb'] !== 'undefined' ) delete this_item.attr['vb'];
}else{
this_item.attr['vb_postid'] = prepareForm.post_id;
this_item.attr['vb'] = 1;
this_item.attr['rwd'] = screen;
}
}
prepareForm.formData[prepareForm.si]['wraps'][prepareForm.wi]['items'][prepareForm.ii]['items'][prepareForm.nwi] = this_item;
prepareForm.object.push(this_item);
}
});
},
items: function($wrapper) {
var used_fonts = [];
var $wraps = $wrapper.children( '.mfn-module.vb-item' );
if( !$wraps.length ){
$wraps = $wrapper.children( 'div' ).children( '.mfn-module.vb-item' );
}
if( !$wraps.length ){
$wraps = $wrapper.children( 'div' ).children( 'div' ).children( '.mfn-module.vb-item' );
}
$wraps.each(function(i) {
prepareForm.ii = i;
var style_obj = {};
var item_uid = $(this).attr('data-uid');
var this_item = mfn.pagedata.filter( (item) => item.uid === item_uid )[0];
if( !prepareForm.formData[prepareForm.si]['wraps'][prepareForm.wi]['items'].filter( (item) => item.uid === item_uid ).length ){
if( this_item ) {
if( typeof this_item.attr !== 'undefined' ){
if( prepareForm.save ){
if( typeof this_item.attr['vb_postid'] !== 'undefined' ) delete this_item.attr['vb_postid'];
if( typeof this_item.attr['rwd'] !== 'undefined' ) delete this_item.attr['rwd'];
if( typeof this_item.attr['vb'] !== 'undefined' ) delete this_item.attr['vb'];
}else{
this_item.attr['vb_postid'] = prepareForm.post_id;
this_item.attr['vb'] = 1;
this_item.attr['rwd'] = screen;
}
}
if( this_item.jsclass != 'wrap' ){
// item
if( this_item && typeof this_item.attr !== 'undefined' && typeof this_item.attr.content !== 'undefined' ) this_item['used_fonts'] = prepareForm.fonts( this_item.attr.content );
prepareForm.formData[prepareForm.si]['wraps'][prepareForm.wi]['items'][prepareForm.ii] = this_item;
}else if( this_item.jsclass == 'wrap' ) {
// nested wrap
this_item['item_is_wrap'] = 1;
this_item['items'] = [];
prepareForm.formData[prepareForm.si]['wraps'][prepareForm.wi]['items'][prepareForm.ii] = this_item;
prepareForm.nested_items($(this).children('.mcb-wrap-inner'));
}
style_obj['jsclass'] = this_item.jsclass;
style_obj['uid'] = this_item.uid;
if( _.has(this_item, 'attr') ) {
style_obj['attr'] = this_item.attr;
}
prepareForm.object.push(style_obj);
}
}
});
},
fonts: function( content ) {
var inline_editor = $.parseHTML( content );
var used_fonts = [];
$.each( inline_editor, function( i, el ) {
if( $(el).find('span[data-font-family]').length ) {
$(el).find('span[data-font-family]').each(function() {
used_fonts.push( $(this).attr('data-font-family') );
});
}
});
return used_fonts.join(',');
}
}
function closeSnackbar(){
setTimeout(function() {
$('.mfn-snackbar').fadeOut(function() {
$('.mfn-snackbar').remove();
});
}, 5000);
}
function closeSaveOpt(e) {
var container = $('.mfn-visualbuilder .sidebar-panel .sidebar-panel-footer .btn-save-action');
if (!container.is(e.target) && container.has(e.target).length === 0){
container.removeClass('s-opt-show');
$(document).unbind('click', closeSaveOpt);
$content.unbind('click', closeSaveOpt);
}
}
// update wraps count
function checkWrapsCount(uid = false){
if( builder_type != 'header' ) return;
var $items = $content.find('.vb-item.mcb-section');
if( uid ) $items = $content.find('.vb-item.mcb-section.mcb-section-'+uid);
if( $items.length ){
$items.each(function() {
var wrapscount = $(this).find('.mcb-wrap').length;
if( wrapscount >= 3 ){
$(this).addClass('mfn-new-wraps-disabled');
}else{
$(this).removeClass('mfn-new-wraps-disabled');
}
});
}
}
// check empty wraps
var be_layout = {
init: function() {
// be_layout.emptys.wraps();
// be_layout.emptys.page();
// be_layout.emptys.sections();
// checkEmptyWraps();
// checkEmptyPage();
// checkEmptySections();
be_layout.emptys.all();
be_layout.tools.init();
},
tools: {
init: function() {
be_layout.tools.select_parent();
},
select_parent: function() {
$content.on('click', '.mfn-select-parent', function(e) {
e.preventDefault();
$(this).closest('.vb-item.mcb-wrap').closest('.mcb-wrap-inner').children('.mfn-header').find('.mfn-element-edit').trigger('click');
});
}
},
new: {
wrap: function(id, is_divider, size) {
// be_layout.new.wrap()
// addNewWrap()
if( is_divider ) size = 'divider';
var new_element = elements.wrap(size);
if( $builder.find('.mcb-section-'+id).length ) {
if( !$builder.find('.mcb-section-'+id+' .section_wrapper').length ) $builder.find('.mcb-section-'+id).append('<div class="section_wrapper mcb-section-inner"></div>');
if( $builder.find('.mcb-section-'+id+' .mfn-drag-helper.placeholder-section').length ) $builder.find('.mcb-section-'+id+' .mfn-drag-helper.placeholder-section').remove();
if( $builder.find('.mcb-section-'+id+' .section_wrapper > .mfn-queryloop-item-wrapper').length ){
$builder.find('.mcb-section-'+id+' .section_wrapper > .mfn-queryloop-item-wrapper').append( new_element.html );
}else if( $builder.find('.mcb-section-'+id+' .section_wrapper .vb-item.mcb-wrap').length ){
$builder.find('.mcb-section-'+id+' .section_wrapper > .vb-item.mcb-wrap').last().after( new_element.html );
}else{
$builder.find('.mcb-section-'+id+' .section_wrapper').html( new_element.html );
}
}else if( $builder.find('.mcb-wrap-'+id).length ) {
if( $builder.find('.mcb-wrap-'+id+' .vb-item').length ){
$builder.find('.mcb-wrap-'+id+' > .mcb-wrap-inner > .vb-item').last().after( new_element.html );
}else{
$builder.find('.mcb-wrap-'+id+' > .mcb-wrap-inner').append(new_element.html);
}
}
checkWrapsCount(id);
backToWidgets();
be_layout.emptys.sections();
be_layout.emptys.wraps();
blink();
if($('body').hasClass('mfn-navigator-active')) be_navigator.show( $(new_element.html).attr('data-uid') );
loopAllStyleFields(new_element.uid);
},
item: function() {
// be_layout.new.item()
// addNewWidget()
var new_element = false;
var new_script = false;
if( $('body').hasClass('mfn-new-item-added') ) return;
if( ($builder.find('.vb-item[data-uid="'+be_layout.drag_new.container+'"]').hasClass('mfn-looped-items') || $builder.find('.vb-item[data-uid="'+be_layout.drag_new.container+'"]').closest('.vb-item.mfn-looped-items').length ) && _.indexOf(disabled_items_in_ql, be_layout.drag_new.dropped_item) >= 0 ) {
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">You cannot add this item to query loop.</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
resetIframeHeight();
return;
}
$('body').addClass('mfn-new-item-added');
var get_new_element = elements.item(be_layout.drag_new.dropped_item, be_layout.drag_new.dropped_item_alias);
/*if( Array.isArray(get_new_element) ){
new_element = get_new_element[0];
new_script = get_new_element[1];
}else{
new_element = get_new_element;
}*/
new_element = get_new_element;
get_new_element = false;
if( !new_element ) return;
var new_uid = $(new_element).attr('data-uid');
if( $builder.find('.mcb-item-'+be_layout.drag_new.container).length ) {
if(be_layout.drag_new.pos == 'before'){
$builder.find('.vb-item.mcb-item-'+be_layout.drag_new.container).before(new_element);
}else{
$builder.find('.vb-item.mcb-item-'+be_layout.drag_new.container).after(new_element);
}
}else if( $builder.find('.mcb-section-'+be_layout.drag_new.container).length ){
be_layout.new.wrap(be_layout.drag_new.container, false, '1/1');
$builder.find('.mcb-section-'+be_layout.drag_new.container+' .mcb-wrap-inner').append(new_element);
}else{
if(be_layout.drag_new.pos == 'before'){
$builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container+' > .mcb-wrap-inner').prepend(new_element);
}else{
$builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container+' > .mcb-wrap-inner').append(new_element);
}
}
/*if(new_script) {
var ajax_script = document.createElement("script");
ajax_script.innerHTML = new_script;
document.getElementById('mfn-vb-ifr').contentWindow.document.body.appendChild(ajax_script);
}*/
/*if($('body').hasClass('mfn-navigator-active')) {
be_navigator.show(new_uid);
}*/
if( be_layout.drag_new.dropped_item != 'placeholder' ) $builder.find('.vb-item[data-uid="'+new_uid+'"]').find('.mfn-header .mfn-element-edit').trigger('click');
setTimeout(function() {
/*if( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container).closest('.mfn-looped-items').length ){
re_render( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container).closest('.mcb-section').attr('data-uid') );
}else if( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container+'.mfn-looped-items').length ){
re_render( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container+'.mfn-looped-items').closest('.mcb-section').attr('data-uid') );
}else if( $builder.find('.vb-item.mcb-item-'+be_layout.drag_new.container).closest('.mfn-looped-items').length ){
re_render( $builder.find('.vb-item.mcb-item-'+be_layout.drag_new.container).closest('.mcb-section').attr('data-uid') );
}else if( be_layout.drag_new.dropped_item !== be_layout.drag_new.dropped_item_alias ){
re_render(new_uid);
blink(true);
}else if( be_layout.drag_new.force_rerender ){
re_render(new_uid);
be_layout.drag_new.force_rerender = false;
}*/
if( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container).closest('.mfn-looped-items').length ){
re_render( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container).closest('.mcb-section').attr('data-uid') );
}else if( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container+'.mfn-looped-items').length ){
re_render( $builder.find('.vb-item.mcb-wrap-'+be_layout.drag_new.container+'.mfn-looped-items').closest('.mcb-section').attr('data-uid') );
}else if( $builder.find('.vb-item.mcb-item-'+be_layout.drag_new.container).closest('.mfn-looped-items').length ){
re_render( $builder.find('.vb-item.mcb-item-'+be_layout.drag_new.container).closest('.mcb-section').attr('data-uid') );
}else if( be_layout.drag_new.force_rerender ) {
re_render(new_uid);
blink(true);
}
be_layout.drag_new.force_rerender = false;
$('body').removeClass('mfn-new-item-added');
resetIframeHeight();
editContentButton(); // add button edit content to nested builder
}, 10);
/*if( builder_type == 'cart' && ( be_layout.drag_new.dropped_item == 'cart_table' || be_layout.drag_new.dropped_item == 'cart_totals' ) ){
let cart_shortcode = $content.find('.mfn-cart-sample').html();
if( be_layout.drag_new.dropped_item == 'cart_table' ){
$builder.find('.vb-item[data-uid="'+new_uid+'"] .mcb-column-inner .mfn-cart-table-tmpl-wrapper').html(cart_shortcode);
}else{
$builder.find('.vb-item[data-uid="'+new_uid+'"] .mcb-column-inner').append(cart_shortcode);
}
}
if( builder_type == 'checkout' && be_layout.drag_new.dropped_item == 'checkout' ){
let checkout_shortcode = $content.find('.mfn-checkout-sample').html();
$builder.find('.vb-item[data-uid="'+new_uid+'"] .mcb-column-inner .mfn-checkout-wrapper').html(checkout_shortcode);
}*/
if( be_layout.drag_new.dropped_item == be_layout.drag_new.dropped_item_alias ) {
blink();
}
$('#mfn-widgets-list .panel-search .mfn-search').val('');
userList.search();
inlineEditor();
be_layout.emptys.wraps();
runAjaxElements();
loopAllStyleFields(new_uid);
},
},
emptys: {
all: function() {
be_layout.emptys.page();
be_layout.emptys.sections();
be_layout.emptys.wraps();
},
page: function() {
if( !$builder.find('.vb-item.mcb-section.mfn-'+elements_ver+'-section').not('.hide-'+screen).length ) {
if(!$builder.find('.mfn-section-start').length) {
$content.find('body').addClass('mfn-ui-empty-page');
$builder.prepend('<div class="mfn-section-start"><a href="#" class="mfn-section-add"><svg class="welcome-pic" id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 51.84 51.84"><defs><style>.cls-1{fill:none;stroke-width:1.5px;}.cls-1,.cls-3{stroke:#304050;stroke-miterlimit:10;}.cls-2,.cls-3{fill:#304050;}.cls-2{fill-rule:evenodd;}.cls-3{stroke-width:0.7px;}</style></defs><polyline class="cls-1" points="24.92 12.92 24.92 29.38 28.92 29.38"/><line class="cls-1" x1="24.92" y1="29.38" x2="24.92" y2="45.84"/><polyline class="cls-1" points="45.35 16.92 45.35 12.92 4.49 12.92 4.49 45.84 45.35 45.84 45.35 39.11"/><polyline class="cls-1" points="47.32 33.38 49.35 33.38 49.35 16.92 28.92 16.92 28.92 33.38 35.83 33.38"/><polyline class="cls-1" points="4.49 12.92 4.49 6 45.35 6 45.35 12.92"/><path class="cls-2" d="M39.41,9.41a1.24,1.24,0,1,0-1.24,1.22A1.23,1.23,0,0,0,39.41,9.41Z"/><path class="cls-2" d="M43,9.41a1.24,1.24,0,1,0-1.24,1.22A1.24,1.24,0,0,0,43,9.41Z"/><path class="cls-2" d="M35.83,9.41a1.24,1.24,0,1,0-1.24,1.22A1.24,1.24,0,0,0,35.83,9.41Z"/><path class="cls-2" d="M9.18,9.41a1.25,1.25,0,1,0-1.25,1.22A1.24,1.24,0,0,0,9.18,9.41Z"/><path class="cls-3" d="M46,29.7h0a1.3,1.3,0,0,0-.86.33,1.33,1.33,0,0,0-1.24-.91,1.32,1.32,0,0,0-.91.4,1.33,1.33,0,0,0-1.18-.75h0A1.16,1.16,0,0,0,41,29V25.83a1.33,1.33,0,1,0-2.65,0v6.32L38,31.72a1.77,1.77,0,0,0-2.6-.2l-.31.26a.27.27,0,0,0-.07.34l3,5.82a3.11,3.11,0,0,0,2.74,1.72h3.41a3.25,3.25,0,0,0,3.14-3.34V34.38c0-1.33,0-1.82,0-3.29A1.35,1.35,0,0,0,46,29.7Zm.77,4.68v1.94a2.71,2.71,0,0,1-2.59,2.79h-3.4a2.56,2.56,0,0,1-2.25-1.43l-2.93-5.62.15-.12h0a1.25,1.25,0,0,1,.92-.33,1.29,1.29,0,0,1,.89.47l.84,1a.29.29,0,0,0,.31.09.28.28,0,0,0,.18-.26v-7.1a.78.78,0,1,1,1.55,0V32A.28.28,0,1,0,41,32V30.12a.78.78,0,0,1,.76-.8h0a.81.81,0,0,1,.78.84v1.67a.28.28,0,1,0,.55,0V30.52a.76.76,0,1,1,1.52,0v1.23a.28.28,0,1,0,.56,0v-.67a.81.81,0,0,1,.78-.83h0a.81.81,0,0,1,.77.84Z"/></svg></a><h2>Welcome to BeBuilder</h2> <a class="mfn-btn mfn-btn-green btn-icon-left btn-large mfn-section-add" href="#"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add-light"></span>Start creating</span></a> <p><a class="view-tutorial" href="#">View tutorial</a></p></div>');
$content.find('.view-tutorial').on('click', function(e) {
e.preventDefault();
introduction.reopen();
});
}
}else{
removeStartBuilding();
}
},
sections: function() {
$builder.find('.vb-item.mcb-section').each(function(i) {
if(!$(this).find('.mcb-wrap').length) {
$(this).addClass('empty');
let global_sections_html = '<a class="mfn-btn add-global-sections-button mfn-btn-green btn-icon-left" href="#"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add-light"></span>Global sections</span></a>';
$(this).find('.section_wrapper').html('<div class="mfn-section-new"><h5>Select a wrap layout</h5> <div class="wrap-layouts"> <div class="wrap-layout wrap-11" data-type="wrap-11" data-tooltip="1/1"></div><div class="wrap-layout wrap-12" data-type="wrap-12" data-tooltip="1/2 | 1/2"><span></span></div><div class="wrap-layout wrap-13" data-type="wrap-13" data-tooltip="1/3 | 1/3 | 1/3"><span></span><span></span></div><div class="wrap-layout wrap-14" data-type="wrap-14" data-tooltip="1/4 | 1/4 | 1/4 | 1/4"><span></span><span></span><span></span></div><div class="wrap-layout wrap-13-23" data-type="wrap-1323" data-tooltip="1/3 | 2/3"><span></span></div><div class="wrap-layout wrap-23-13" data-type="wrap-2313" data-tooltip="2/3 | 1/3"><span></span></div><div class="wrap-layout wrap-14-12-14" data-type="wrap-141214" data-tooltip="1/4 | 1/2 | 1/4"><span></span><span></span></div></div><p>or choose from</p><a class="mfn-btn prebuilt-button mfn-btn-green btn-icon-left" href="#"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add-light"></span>Pre-built sections</span></a> '+ global_sections_html +' </div>');
$(this).append('<div class="mfn-drag-helper mfn-dh-after placeholder-section"></div>');
}else if( $(this).find('.mfn-section-new').length || $(this).find('.mcb-wrap').length ) {
$(this).find('.mfn-section-new').remove();
$(this).removeClass('empty');
$(this).find('.mfn-drag-helper.placeholder-section').remove();
}
});
},
wraps: function() {
$builder.find('.mfn-nested-wrap').removeClass('mfn-nested-wrap');
$builder.find('.vb-item.mcb-wrap:not(.divider) > .mcb-wrap-inner').each(function(i) {
if( !$(this).find('.mfn-module').length ){
if( !$(this).find('.mfn-wrap-new').length ){
$(this).append('<div class="mfn-wrap-new"><a href="#" class="mfn-item-add mfn-btn btn-icon-left btn-small mfn-btn-blank2"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add"></span>Add element</span></a> <a href="#" class="mfn-wrap-add mfn-btn btn-icon-left btn-small mfn-btn-blank2"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add"></span>Add wrap</span></a></div>');
}
if( !$(this).hasClass('empty') ) $(this).addClass('empty');
if( !$(this).siblings('.placeholder-wrap').length ) $(this).before('<div class="mfn-drag-helper mfn-dh-before placeholder-wrap"></div><div class="mfn-drag-helper mfn-dh-after placeholder-wrap"></div>')
}else if( $(this).find('.mfn-module').length ){
if( $(this).children('.mcb-column').length && !$(this).children('.mcb-wrap').length ) $(this).siblings('.placeholder-wrap').remove();
$(this).removeClass('empty');
$(this).parent('.mcb-wrap').removeClass('mcb-wrap-new');
$(this).children('.mfn-wrap-new').remove();
if( $(this).find('.mcb-wrap:not(.mfn-nested-wrap)').length ) $(this).find('.mcb-wrap:not(.mfn-nested-wrap)').addClass('mfn-nested-wrap');
}
});
},
},
drag_new: {
dropped_item: false,
dropped_item_alias: false,
container: false,
pos: 'after',
force_rerender: false,
init: function() {
// be_layout.drag_new.init()
if($content) {
var iframe_offset = 0;
if($('body').hasClass('mfn-preview-mode') && screen !== 'desktop'){
iframe_offset = $('#mfn-vb-ifr').offset().top;
}else if($('body').hasClass('mfn-preview-mode')){
iframe_offset = 120;
}
if( ui_mode == 'dev' ) iframe_offset = 80;
if( screen != 'desktop' ){
iframe_offset += $('iframe#mfn-vb-ifr').offset().top;
}
$.ui.ddmanager.frameOffsets={},$.ui.ddmanager.prepareOffsets=function(e,t){var o,n,f,i,a=$.ui.ddmanager.droppables[e.options.scope]||[],s=t?t.type:null,r=(e.currentItem||e.element).find(":data(ui-droppable)").addBack();e:for(o=0;o<a.length;o++)if(!(a[o].options.disabled||e&&!a[o].accept.call(a[o].element[0],e.currentItem||e.element))){for(n=0;n<r.length;n++)if(r[n]===a[o].element[0]){a[o].proportions().height=0;continue e}a[o].visible="none"!==a[o].element.css("display"),a[o].visible&&("mousedown"===s&&a[o]._activate.call(a[o],t),a[o].offset=a[o].element.offset(),proportions={width:a[o].element[0].offsetWidth,height:a[o].element[0].offsetHeight},"function"==typeof a[o].proportions?a[o].proportions(proportions):a[o].proportions=proportions,(f=iframe.window.document)!==document&&((i=$.ui.ddmanager.frameOffsets[f])||(i=$.ui.ddmanager.frameOffsets[f]=$((f.defaultView||f.parentWindow).frameElement).offset()),a[o].offset.left+=i.left,a[o].offset.top-=i.top-scroll_top-iframe_offset))}};
be_layout.drag_new.draggable()
be_layout.drag_new.droppable()
}
},
draggable: function() {
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li').draggable({
helper: function(e) {
return $('<div>').attr('data-alias', $(e.target).closest('li').data('alias')).attr('data-type', $(e.target).closest('li').data('type')).addClass('mfn-vb-dragger mfn-vb-drag-item').text( $(e.target).closest('li').data('title') );
},
cursorAt: {
top: 20,
left: 20
},
iframeFix: true,
connectWith: ".mcb-wrap-inner",
refreshPositions: false,
cursor: 'move',
start: function(event, ui) {
be_layout.sortable.is_new = 1;
$builder.find('.vb-item').addClass('ui-droppable-active-show ui-droppable-new-item');
be_layout.drag_new.dropped_item = ui.helper.attr('data-type');
be_layout.drag_new.dropped_item_alias = ui.helper.attr('data-alias');
},
stop: function(event, elem) {
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
if(be_layout.sortable.is_new == 1){
if($content.find('.mfn-vb-drag-item').length){ $content.find('.mfn-vb-drag-item').remove(); }
$builder.find('.vb-item').removeClass('ui-droppable-active-show ui-droppable-new-item');
if($content.find('.mfn-vb-sort-placeholder-widget').length) { $content.find('.mfn-vb-sort-placeholder-widget').remove(); }
$content.find('body').removeClass('hover');
be_layout.new.item();
}
be_layout.sortable.is_new = 0;
},
drag: function(event, elem) {
if(be_layout.sortable.is_new == 1) {
elem.position.top -= $(window).scrollTop() - scroll_top;
}
}
});
},
droppable: function() {
$builder.find('.mfn-drag-helper').droppable({
greedy: true,
iframeFix: true,
tolerance: 'touch',
accept: "*",
drop: function(event, ui) {
if( be_layout.sortable.is_new ){
$content.find('.mfn-vb-dragover').removeClass('mfn-vb-dragover');
$content.find('.vb-item').removeClass('ui-droppable-active-show ui-droppable-new-item');
be_layout.new.item();
if($content.find('.mfn-vb-drag-item').length){ $content.find('.mfn-vb-drag-item').remove(); }
if($content.find('.mfn-vb-sort-placeholder-widget').length) { $content.find('.mfn-vb-sort-placeholder-widget').remove(); }
be_layout.sortable.is_new = 0;
$content.find('body').removeClass('hover');
// console.log('drop');
}
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
},
over: function(event, ui) {
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
if( be_layout.sortable.is_new ){
if( $(this).closest('.mfn-global-section').length || $(this).closest('.mfn-global-wrap').length ) return; // global parent
$content.find('.mfn-vb-dragover').removeClass('mfn-vb-dragover');
$content.find('.mfn-vb-sort-placeholder-widget').remove();
$(this).closest('.vb-item.mcb-wrap').addClass("mfn-vb-dragover");
be_layout.drag_new.container = $(this).closest('.vb-item').attr('data-uid');
$(this).closest('.vb-item.mcb-wrap').addClass('mfn-current-dragover');
// console.log('over / '+be_layout.drag_new.container);
if($(this).hasClass('mfn-dh-before')){
be_layout.drag_new.pos = 'before';
if( $(this).closest('.mfn-module').hasClass('mcb-wrap') ){
$(this).siblings('.mfn-module-wrapper').prepend('<div class="mfn-vb-sort-placeholder-widget one column "></div>');
}else{
$(this).closest('.mfn-module').before('<div class="mfn-vb-sort-placeholder-widget one column"></div>');
}
}else{
be_layout.drag_new.pos = 'after';
if( $(this).closest('.vb-item').hasClass('mcb-wrap') ){
$(this).siblings('.mfn-module-wrapper').append('<div class="mfn-vb-sort-placeholder-widget one column"></div>');
}else if( $(this).closest('.vb-item').hasClass('mcb-section') ){
$(this).siblings('.section_wrapper').append('<div class="mfn-vb-sort-placeholder-widget one column"></div>');
}else{
$(this).closest('.mfn-module').after('<div class="mfn-vb-sort-placeholder-widget one column"></div>');
}
}
}
},
});
}
},
sortable: {
is_new: 0,
modules_wrapper: ".mfn-wrapper-for-wraps",
modules_items: ".mfn-module",
modules_placeholder: 'mfn-vb-sort-placeholder-wrap',
current: 'section',
min_height: 0,
css_uid: '',
init: function() {
// be_layout.sortable.init();
// runSorting();
if($content){
$content.on('mouseenter', '.mfn-element-drag', function() {
if( $(this).closest('.vb-item').hasClass('mcb-section') ){
be_layout.sortable.current = 'section';
be_layout.sortable.sections();
}else{
be_layout.sortable.min_height = $(this).closest('.vb-item').closest('.mfn-wrapper-for-wraps').outerHeight();
be_layout.sortable.css_uid = $(this).closest('.vb-item').closest('.mfn-wrapper-for-wraps').closest('.vb-item').attr('data-uid');
let size = $(this).closest('.vb-item').attr('data-desktop-size');
let sizeClass = sizes.filter(s => s.key === size)[0];
let p_width = typeof sizeClass !== 'undefined' ? sizeClass.desktop : 'one';
if( $(this).closest('.vb-item').hasClass('mcb-column') ) {
be_layout.sortable.modules_wrapper = '.vb-item.mcb-wrap > .mcb-wrap-inner';
be_layout.sortable.current = 'item';
be_layout.sortable.modules_items = '.mfn-module';
be_layout.sortable.modules_placeholder = 'mfn-vb-sort-placeholder-widget column '+p_width;
}else if( $(this).closest('.mcb-wrap.vb-item').find('.mcb-wrap').length || ($(this).closest('.vb-item').hasClass('mcb-wrap') && builder_type == 'header') ) {
be_layout.sortable.current = 'wrap';
be_layout.sortable.modules_wrapper = '.mfn-builder-active .section_wrapper';
be_layout.sortable.modules_items = '.mfn-module.mcb-wrap:not(.mfn-nested-wrap)';
be_layout.sortable.modules_placeholder = 'mfn-vb-sort-placeholder-wrap column '+p_width;
}else if( $(this).closest('.vb-item').hasClass('mcb-wrap') && !$(this).closest('.vb-item.mcb-wrap').find('.mcb-wrap').length ) {
be_layout.sortable.current = 'wrap';
$builder.find('.mcb-wrap').each(function() { $(this).addClass('mfn-droppable-helper'); });
$builder.find('.mcb-column').each(function() { if( !$(this).closest('.mfn-nested-wrap').length ) $(this).addClass('mfn-droppable-helper'); });
be_layout.sortable.modules_wrapper = '.mfn-builder-active .section_wrapper, .vb-item.mcb-wrap:not(.mfn-nested-wrap) > .mcb-wrap-inner';
be_layout.sortable.modules_items = '.mfn-droppable-helper';
be_layout.sortable.modules_placeholder = 'mfn-vb-sort-placeholder-wrap column '+p_width;
}
setTimeout(function() { be_layout.sortable.modules(); }, 1);
}
}).on('mouseout', '.mfn-element-drag', function() {
if( $builder.find('.mfn-droppable-helper').length ) $builder.find('.mfn-droppable-helper').removeClass('mfn-droppable-helper');
});
}
},
sections: function() {
$builder.sortable({
connectWith: ".mfn-builder-content",
placeholder: 'mfn-vb-sort-placeholder-section',
handle: ".mfn-section-drag",
forcePlaceholderSize: true,
iframeFix: true,
iframeScroll: true,
scrollSensitivity: 30,
scroll: true,
items: '.mcb-section.vb-item',
containment: "parent",
appendTo: $content.find('body'),
helper: function(e, ui) {
return $('<div>').addClass('mfn-vb-dragger mfn-vb-drag-section').text( 'Section sort' );
},
cursorAt: {
top: 20,
left: 20
},
update: function(e, ui) {
if( $('body').hasClass('mfn-navigator-active') ){
if( $('.mfn-navigator li a.active-element').length ){
be_navigator.show($('.mfn-navigator li a.active-element').attr('data-uid'));
}else{
be_navigator.show(ui.item.attr('data-uid'));
}
}
setTimeout(function() {
historyStorage.add();
},10);
},
start: function(event, elem) {
scroll_top = $content.find("html, body").scrollTop();
$content.find('.mcb-section').addClass('ui-droppable-active-show')
},
stop: function(event, elem) {
$content.find('.mcb-section').removeClass('ui-droppable-active-show')
}
});
},
modules: function() {
$builder.find('.mfn-wrapper-for-wraps').sortable({
connectWith: be_layout.sortable.modules_wrapper,
placeholder: be_layout.sortable.modules_placeholder,
handle: ".mfn-header .mfn-element-drag",
forcePlaceholderSize: false,
scroll: true,
iframeFix: true,
iframeScroll: true,
items: be_layout.sortable.modules_items,
appendTo: $content.find('body'),
helper: function(e, ui) {
var text = 'Item sort';
var classes = ' mfn-vb-drag-item';
if( ui.hasClass('mcb-wrap') ){
text = 'Wrap sort';
classes = ' mfn-vb-drag-wrap';
}
return $('<div>').addClass('mfn-vb-dragger '+classes).text( text );
},
cursorAt: {
top: 20,
left: 20
},
update: function(e, ui) {
if( ui.sender ) return;
if( $content.find('.mfn-force-rerender').length ){
setTimeout(function() {
re_render( $content.find('.mfn-force-rerender').attr('data-uid') );
}, 300);
}
$builder.find('.mfn-make-offsets-for-wraps').removeClass('mfn-make-offsets-for-wraps');
if( $builder.find('.mfn-droppable-helper').length ) $builder.find('.mfn-droppable-helper').removeClass('mfn-droppable-helper');
if($content.find('style.mfn-tmp-sortable-css').length) $content.find('style.mfn-tmp-sortable-css').remove();
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
be_layout.emptys.wraps();
be_layout.emptys.sections();
// be_layout.drag_new.init();
$edited_div = ui.item;
if( ( ui.item.hasClass('mfn-nested-wrap') || (edited_item && edited_item.uid == ui.item.attr('data-uid')) ) && ui.item.hasClass('mcb-wrap') ) {
setTimeout(function() {
ui.item.find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
setTimeout(function() {
if(ui.item.hasClass('mfn-nested-wrap')){
// reset sticky & loop
$('.mfn-form .mfn-form-row.wrap.sticky ul li:first-child a').trigger('click');
$('.mfn-form .mfn-form-row.mfn-loop-switcher.wrap.type ul li:first-child a').trigger('click');
}
}, 20);
}, 20);
}
setTimeout(function() {
if( ui.item.closest('.mfn-looped-items').length || ui.item.find('.mfn-looped-items').length ) {
re_render( ui.item.closest('.mcb-section.vb-item').attr('data-uid') );
}else{
historyStorage.add();
}
}, 50);
if( $('body').hasClass('mfn-navigator-active') ){
setTimeout(function() {
if( $('.mfn-navigator li a.active-element').length ){
be_navigator.show($('.mfn-navigator li a.active-element').attr('data-uid'));
}else{
be_navigator.show(ui.item.attr('data-uid'));
}
}, 300);
}
},
over: function(e, ui) {
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
if( be_layout.sortable.current == 'wrap' && !ui.placeholder.closest('.vb-item.mcb-section').hasClass('mfn-make-offsets-for-wraps') ) ui.placeholder.closest('.vb-item.mcb-section').addClass('mfn-make-offsets-for-wraps');
ui.placeholder.closest('.vb-item.mcb-wrap').addClass('mfn-current-dragover');
},
out: function(e, ui) {
$builder.find('.mfn-make-offsets-for-wraps').removeClass('mfn-make-offsets-for-wraps');
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
},
start: function(event, elem) {
$content.find('.mfn-module').addClass('ui-droppable-active-show')
$content.find('body').append(`<style class="mfn-tmp-sortable-css">.vb-item[data-uid="${be_layout.sortable.css_uid}"] > .mfn-wrapper-for-wraps{min-height: ${be_layout.sortable.min_height}px}</style>`);
if( $(elem.item).closest('.mfn-looped-items').length ) $(elem.item).closest('.mcb-section.vb-item').addClass('mfn-force-rerender');
},
stop: function(event, elem) {
$builder.find('.mfn-make-offsets-for-wraps').removeClass('mfn-make-offsets-for-wraps');
$builder.find('.mfn-current-dragover').removeClass('mfn-current-dragover');
$content.find('.mfn-module').removeClass('ui-droppable-active-show')
if( $builder.find('.mfn-droppable-helper').length ) $builder.find('.mfn-droppable-helper').removeClass('mfn-droppable-helper');
if($content.find('style.mfn-tmp-sortable-css').length) $content.find('style.mfn-tmp-sortable-css').remove();
}
});
},
}
}
/*$(document).on('click', '.mfn-be-css-db-update-action-button', function(e) {
e.preventDefault();
let button = $(this);
let wrapper = button.closest('.mfn-bebuilder-iframe-error');
if( button.hasClass('loading') ) return;
button.addClass('loading');
wrapper.html('The database update has started. Please wait...');
$.post(ajaxurl, { action: 'mfn_bebuilder_css_update_database', 'mfn-builder-nonce': wpnonce }, function(response) {
if( response.success ){
wrapper.html(response.data.message);
wrapper.append(' Reloading...');
setTimeout( window.location.reload(), 2000);
}else{
wrapper.html('BeBuilder: Something went wrong. Please try again later.');
}
});
});*/
let bebuilder_data_updater = {
button: false,
wrapper: false,
init: function() {
$(document).on('click', '.mfn-be-css-db-update-action-button', function(e) {
e.preventDefault();
bebuilder_data_updater.button = $(this);
if( bebuilder_data_updater.button.hasClass('loading') ) return;
if( bebuilder_data_updater.button.closest('.mfn-bebuilder-iframe-error').length ){
bebuilder_data_updater.wrapper = bebuilder_data_updater.button.closest('.mfn-bebuilder-iframe-error');
bebuilder_data_updater.wrapper.html('The database update has started. Please wait...');
}
bebuilder_data_updater.process();
});
},
process: function() {
$.ajax({
url: ajaxurl,
data: {
'action': 'mfn_new_css_rewrite',
'mfn-builder-nonce': wpnonce,
},
// dataType: 'JSON',
type: 'POST',
statusCode: {
524: function() {
console.log('A timeout occurred. Trying again.');
bebuilder_data_updater.process();
},
500: function() {
console.log('Resuming');
bebuilder_data_updater.process();
},
502: function() {
console.log('Resuming');
bebuilder_data_updater.process();
},
503: function() {
console.log('Resuming');
bebuilder_data_updater.process();
}
}
}).done(function(response) {
if( bebuilder_data_updater.wrapper ){
bebuilder_data_updater.wrapper.html('BeBuilder: Database updated successfully! Reloading...');
setTimeout( window.location.reload(), 2000);
}
});
},
}
bebuilder_data_updater.init();
var mfn_hotspots_field = {
init: function() {
$(document).on('click', '.hotspot_add_new', function(e) {
e.preventDefault();
mfn_hotspots_field.add();
});
$(document).on('click', '.mfn-hotspot-point .mfn-tab-toggle', function(e) {
e.preventDefault();
var hash = $(this).closest('.mfn-hotspot-point').attr('id');
if( $(this).closest('.mfn-hotspot-point').hasClass('open') ){
$(this).closest('.mfn-hotspot-point').removeClass('open');
if( $content.find('.hotspot-point-'+hash+' .hotspot-content').length ) $content.find('.hotspot-point-'+hash).removeClass('is-active-force');
if( $('style.mfn-fields-switcher-hotospots').length ) $('style.mfn-fields-switcher-hotospots').remove();
}else{
$(this).closest('.mfn-hotspot-point').addClass('open');
if( $content.find('.hotspot-point-'+hash+' .hotspot-content').length ) $content.find('.hotspot-point-'+hash).addClass('is-active-force');
$('body').append('<style class="mfn-builder-fields-css mfn-fields-switcher mfn-fields-switcher-hotospots">.mfn-hotspot-form-'+hash+' .mfn-hotspot-form-wrapper-'+hash+'{ display: block; } .mfn-hotspot-form-'+hash+' .mfn-hotspot-point-tab-header .mfn-tab-toggle{ transform: rotate(180deg); }</style>');
}
});
$(document).on('click', '.mfn-hotspot-point .mfn-tab-delete', function(e) {
e.preventDefault();
var hash = $(this).closest('.mfn-hotspot-point').attr('id');
mfn_hotspots_field.delete(hash);
$(this).closest('.mfn-hotspot-point').remove();
});
if( iframe && _.has(iframe.window, 'jQuery') ){
iframe.window.jQuery('body').on('click', '.mfn-image-hotspot .hotspot-point', function(e) {
e.preventDefault();
var id = $(this).attr('data-id')
if( $('.mfn-form-row.hotspots .mfn-hotspot-point').hasClass('open') ) {
$('.mfn-form-row.hotspots .mfn-hotspot-point.open').each(function() {
$(this).find('.mfn-tab-toggle').trigger('click');
});
}
$('#'+id+'.mfn-hotspot-point .mfn-tab-toggle').trigger('click');
});
}
},
refresh: function(id, field){
// mfn_hotspots_field.refresh
// refreshHotspot
var point_hash = field.closest('.mfn-hotspot-point').attr('id');
var obj_key = field.attr('data-pointobj');
var point = iframe.window['mfn_hotspot_'+id]['p_c'].filter((point) => point.id == 'hs_point_'+point_hash)[0];
var val = field.val().length ? field.val().replace('%', '').replace('px', '') : '';
iframe.window['mfn_hotspot_'+id]['p_c'].filter((point) => point.id == 'hs_point_'+point_hash)[0][obj_key] = parseFloat(val);
iframe.window['mfn_hotspot_'+id].init();
},
add: function() {
let i = $('.mfn-hotspot-point').length;
let hash = getUid();
if( $('.mfn-hotspot-point.open').length ) $('.mfn-hotspot-point.open').removeClass('open');
$('.hotspot_add_new').before(mfn_field_hotspot_render({hash: hash}, i));
$('#'+hash+'.mfn-hotspot-point .mfn-tab-toggle').trigger('click');
if( typeof edited_item['attr'] === 'undefined' ) edited_item['attr'] = {};
if( typeof edited_item['attr']['hotspots'] === 'undefined' ) edited_item['attr']['hotspots'] = [];
var fields = {hash: hash};
edited_item['attr']['hotspots'].push(fields);
mfn_hotspots_field.render();
setTimeout(function() {
mfnoptsinputs.start();
if( $('.mfn-form .mfn-element-fields-wrapper .mfn-form-row .sliderbar:not(.mfn-initialized)').length ) {
$('.mfn-form .mfn-element-fields-wrapper .mfn-form-row .sliderbar:not(.mfn-initialized)').each(function() {
sliderInput.init($(this));
});
}
}, 1);
},
render: function() {
if( $builder.find('.mfn-current-editing').closest('.mfn-looped-items').length ){
re_render( $builder.find('.mfn-current-editing').closest('.mcb-section').attr('data-uid') );
}else{
re_render(edited_item['uid']);
}
},
delete: function(hash) {
if( edited_item['attr']['hotspots'].filter( item => item.hash == hash).length ){
edited_item['attr']['hotspots'] = edited_item['attr']['hotspots'].filter( item => item.hash != hash);
}
mfn_hotspots_field.render();
}
}
var mfn_autocomplete = {
singular: true,
input: false,
data: false,
to_add: false,
activeIndex: -1,
init: function() {
$(document).on('focus paste keyup', '.mfn-autocomplete .mfn-autocomplete-input', function(e) {
mfn_autocomplete.input = $(this);
if (e.key !== "ArrowDown" && e.key !== "ArrowUp" && e.key !== "Enter") {
mfn_autocomplete.show_list();
}
});
document.addEventListener("keydown", (e) => {
if( !mfn_autocomplete.input || !$('.mfn-autocomplete-ul li').length ) return
if (e.key === "ArrowDown") {
e.preventDefault();
if( $('.mfn-autocomplete-ul li.active').length ) {
let next = $('.mfn-autocomplete-ul li.active').next('li:not(.disabled)').length ? $('.mfn-autocomplete-ul li.active').next('li:not(.disabled)') : $('.mfn-autocomplete-ul li').first();
$('.mfn-autocomplete-ul li.active').removeClass('active');
next.addClass('active');
}else{
$('.mfn-autocomplete-ul li').first().addClass('active')
}
} else if (e.key === "ArrowUp") {
e.preventDefault();
if( $('.mfn-autocomplete-ul li.active').length ) {
let next = $('.mfn-autocomplete-ul li.active').prev('li:not(.disabled)').length ? $('.mfn-autocomplete-ul li.active').prev('li:not(.disabled)') : $('.mfn-autocomplete-ul li').last();
$('.mfn-autocomplete-ul li.active').removeClass('active');
next.addClass('active');
}else{
$('.mfn-autocomplete-ul li').last().addClass('active')
}
} else if (e.key === "Enter") {
if( $('.mfn-autocomplete-ul li.active').length ) $('.mfn-autocomplete-ul li.active').trigger('click');
}
});
$(document).on('click', '.mfn-autocomplete .mfn-sidebar-classes-show-list', function(e) {
e.preventDefault();
mfn_autocomplete.input = $(this).closest('.mfn-autocomplete').find('input.mfn-autocomplete-input');
mfn_autocomplete.show_list();
});
$(document).on('click', '.mfn-autocomplete .mfn-autocomplete-ul li:not(.disabled)', function() {
$(this).addClass('disabled');
mfn_autocomplete.to_add = $(this);
mfn_autocomplete.add();
});
},
add: function() {
mfn_autocomplete.input.before(`<span data-name="${mfn_autocomplete.to_add.attr('data-id')}" class="sidebar-panel-class mfn-autocomplete-item">${mfn_autocomplete.to_add.text()}<span class="sidebar-panel-class-edit mfn-autocomplete-item-edit">✎</span> <span class="sidebar-panel-class-delete mfn-autocomplete-item-delete">✕</span></span>`);
if( !_.has(edited_item, 'be_classes') ) edited_item['be_classes'] = [];
if( _.indexOf(edited_item.be_classes, mfn_autocomplete.to_add.attr('data-id')) >= 0 ) return;
let force_render = false;
let force_refresh_local_styles = false;
let added_obj = mfn.classes.filter( cl => cl.uid == mfn_autocomplete.to_add.attr('data-id') )[0];
let original = edited_item.jsclass == 'section' || edited_item.jsclass == 'wrap' ? JSON.parse( JSON.stringify(mfn.elements[edited_item.jsclass]) ) : JSON.parse( JSON.stringify(renderMfnFields.items[edited_item.jsclass]) );
if( added_obj ) {
_.map( added_obj.attr, function(opt, o) {
if( /*o.includes('css_') && */_.has(original, 'attr') && _.has(edited_item, 'attr') && _.has(original['attr'], o) && _.has(edited_item['attr'], o) && ( edited_item['attr'][o]['val'] == original['attr'][o]['val'] || ( _.has(original['attr'][o]['val'], 'desktop') && original['attr'][o]['val']['desktop'] == edited_item['attr'][o]['val']['desktop'] ) ) ) {
// removes stds from edited_item on class add
force_refresh_local_styles = true;
delete(edited_item['attr'][o]);
}
if( !force_render && edited_item.jsclass != 'wrap' && !o.includes('css_') && (_.indexOf(mfn_classes.exceptions, o) >= 0 || _.indexOf(mfn_classes.exceptions, added_obj.jsclass+'_'+o) >= 0 ) && opt != 'default' ) {
force_render = true;
}
});
}
edited_item.be_classes.push( mfn_autocomplete.to_add.attr('data-id') );
//$builder.find(`.mcb-${edited_item.jsclass}-${edited_item.uid}`).addClass( mfn_autocomplete.to_add.attr('data-id') );
$builder.find('.'+$('.mfn-element-fields-wrapper').attr('data-element')).addClass( mfn_autocomplete.to_add.attr('data-id') );
$('.mfn-ui').addClass('mfn-class-editor-full');
setTimeout(function() {
sidebar_form.render();
mfn_autocomplete.exit();
loopAllStyleFields(edited_item.uid);
if( force_render ) re_render();
}, 10);
},
show_list: function() {
if( mfn_autocomplete.singular && _.has(edited_item, 'be_classes') && edited_item.be_classes.length && mfn.classes.filter( (cl) => cl.uid == edited_item.be_classes[0]).length ) return;
mfn_autocomplete.exit();
let list = mfn_autocomplete.input.attr('data-list');
mfn_autocomplete.data = JSON.parse( JSON.stringify( mfn.classes.filter( (n) => n.uid.includes(edited_item.jsclass) ) ) );
if( mfn_autocomplete.input.val().length ){
mfn_autocomplete.data = mfn_autocomplete.data.filter( (n) => n.title.toLowerCase().includes(mfn_autocomplete.input.val().toLowerCase()) );
}
if( mfn_autocomplete.data.length ){
mfn_autocomplete.input.closest('.mfn-autocomplete')
.append(`<ul class="mfn-autocomplete-ul">
${ _.map(mfn_autocomplete.data, function(l) {
return `<li ${ _.has(edited_item, 'be_classes') && edited_item.be_classes.length > 0 && _.indexOf(edited_item.be_classes, l.uid) >= 0 ? 'class="disabled"' : '' } data-id="${ l.uid }">${ l.title }</li>`;
}).join('') } </ul>`);
}else{
mfn_autocomplete.input.closest('.mfn-autocomplete')
.append(`<ul class="mfn-autocomplete-ul"><li class="disabled mfn-autocomplete-empty">Empty list</li></ul>`);
}
$(document).bind('click', mfn_autocomplete.blur);
},
blur: function(e) {
var div = $('.mfn-autocomplete-list');
if( !div.is(e.target) && div.has(e.target).length === 0 ) mfn_autocomplete.exit();
},
exit: function() {
$('.mfn-autocomplete .mfn-autocomplete-ul').remove();
$(document).unbind('click', mfn_autocomplete.blur);
}
}
mfn_autocomplete.init();
var mfn_classes = {
uid: false,
popup_title: "Save styles of a given element as a global style",
styles: '',
// has_changed: false,
original: [],
edited_item_uid: false,
confirmed: [],
refresh: false,
refresh_all_items_with_class: false,
backup: false,
has_classes: false,
exceptions: ['width_switcher', 'height_switcher', 'visibility', 'banner_box_css_desc_justify', 'banner_box_css_desc_align', 'banner_box_style', 'banner_box_overlay', 'banner_box_hover_effect', 'banner_box_image_height', 'banner_box_hidden_elements_mobile', 'button_icon', 'button_icon_position', 'button_size', 'button_full_width', 'button_style', 'divider_2_type', 'divider_2_align', 'divider_2_addon', 'divider_2_label', 'divider_2_image', 'divider_2_icon', 'icon_2_hover', 'icon_box_2_icon_position', 'icon_box_2_icon_align', 'icon_box_2_hover', 'image_mask_shape_type', 'image_mask_shape_size', 'image_mask_shape_position', 'image_image_height', 'image_image_height_style', 'image_greyscale', 'image_gallery_style', 'image_gallery_layout', 'image_gallery_columns', 'image_gallery_greyscale', 'image_gallery_image_height', 'list_2_type', 'list_2_starting', 'list_2_align', 'list_2_valign', 'list_2_divider', 'list_2_icon', 'list_2_image', 'list_2_background_switcher', 'toggle_type', 'toggle_starting', 'toggle_divider', 'toggle_open_first', 'toggle_open_all', 'toggle_open_more', 'toggle_icon', 'toggle_active_icon', 'toggle_icon_animation'],
init: function() {
$(document).on('click', '.mfn-modal .btn-save-new-class', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$(this).addClass('loading disabled');
mfn_classes.create();
});
$(document).on('click', '.sidebar-panel-classes-list .sidebar-panel-class-delete', function(e) {
let classname = $(this).closest('.sidebar-panel-class').attr('data-name');
mfn_classes.remove(classname);
});
$(document).on('click', '.sidebar-panel-classes-list .sidebar-panel-class-edit', function(e) {
let classname = $(this).closest('.sidebar-panel-class').attr('data-name');
mfn_classes.edited_item_uid = edited_item.uid;
mfn_classes.edit(classname);
});
$(document).on('click', '.mfn-class-editor-update', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$(this).addClass('loading');
mfn_classes.refresh_all_items_with_class = true;
mfn_classes.ajax( edited_item );
if( $builder.find('.vb-item[data-uid="'+mfn_classes.edited_item_uid+'"]').length ){
loopAllStyleFields(edited_item.uid);
let to_click = $builder.find('.vb-item[data-uid="'+mfn_classes.edited_item_uid+'"]').find('.mfn-header').first().find('.mfn-element-edit');
$builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
to_click.trigger('click');
}else{
backToWidgets();
}
mfn_classes.edited_item_uid = false;
});
$(document).on('click', '.panel-export-import-classes .mfn-export-classes-button', function(e) {
e.preventDefault();
let button = $(this);
$('#export-classes-data-textarea').select();
document.execCommand("copy");
button.find('span').text('Exported').addClass('mfn-icon-check-blue');
setTimeout(function() { button.find('span').html('Export'); }, 5000);
});
$(document).on('click', '.panel-export-import-classes .mfn-import-classes-button', function(e) {
e.preventDefault();
let button = $(this);
if($('#import-classes-data-textarea').hasClass('error')) $('#import-classes-data-textarea').removeClass('error');
if( !$('#import-classes-data-textarea').val().length ) {
$('#import-classes-data-textarea').addClass('error');
return;
}
mfn_classes.import.data = JSON.parse($('#import-classes-data-textarea').val());
mfn_classes.import.init();
});
$(document).on('keyup', '.modal-classes-listing .mfn-search', function() {
let val = $(this).val().toLowerCase();
if( !val.length ) {
$('.mfn-global-styles-listing li').removeAttr('style');
return;
}
$('.mfn-global-styles-listing li').hide();
$('.mfn-global-styles-listing li[data-name*="'+val+'"]').show();
if( $('.mfn-global-styles-listing li li[data-name*="'+val+'"]').parent('ul').parent('li').length ) $('.mfn-global-styles-listing li[data-name*="'+val+'"]').parent('ul').parent('li').show();
if( $('.mfn-global-styles-listing li[data-name*="'+val+'"]').find('li').length ) $('.mfn-global-styles-listing li[data-name*="'+val+'"]').find('li').show();
});
$(document).on('click', '.mfn-class-styles-list li', function(e) {
e.preventDefault();
let id = $(this).find('.mfn-class-styles-check').attr('data-id');
if( $(this).hasClass('active') ){
$(this).removeClass('active');
let index = _.indexOf(mfn_classes.confirmed, id);
if( index >= 0 ) mfn_classes.confirmed.splice(index, 1);
}else{
$(this).addClass('active');
mfn_classes.confirmed.push(id);
}
});
$(document).on('click', '.sidebar-panel-class-create', function(e) {
e.preventDefault();
mfn_classes.modal();
});
$(document).on('click', '.sidebar-panel-class-list', function(e) {
e.preventDefault();
mfn_classes.list_modal.show();
});
$(document).on('click', '.mfn-class-editor-dismiss', function(e) {
e.preventDefault();
edited_item.attr = mfn_classes.backup['attr'];
setTimeout(function() {
loopAllStyleFields(edited_item.uid);
if( $builder.find('.mfn-current-editing').length ){
let to_click = $builder.find('.mfn-current-editing').find('.mfn-header').first().find('.mfn-element-edit');
$builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
sidebar_form.is_class = false;
to_click.trigger('click');
// re_render();
}else{
backToWidgets();
}
mfn_classes.edited_item_uid = false;
}, 10);
});
},
import: {
data: [],
duplicates: [],
init: function() {
mfn_classes.import.duplicates = [];
let looped = JSON.parse( JSON.stringify(mfn_classes.import.data) );
_.map(looped, (el, i) => {
if( mfn.classes && mfn.classes.filter( cl => cl.uid == el.uid ).length ) {
el['uid'] = `be_${el.jsclass}_${getUid()}`;
el['title'] = el.title+'_clone';
mfn_classes.import.duplicates.push(el);
//mfn_classes.import.data = mfn_classes.import.data.filter(item => item.uid != el.uid);
}
}).join('');
if( mfn_classes.import.duplicates.length ){
mfn_classes.import.modal();
}else{
mfn_classes.import.import_data();
}
},
modal: function() {
$('.mfn-ui').append(`<div class="mfn-modal modal-confirm mfn-modal-600 show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-global-styles-list"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Global styles import</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <img class="icon" alt="" src="${mfn.themepath}/muffin-options/svg/warning.svg"> <h3>${mfn_classes.import.duplicates.length} duplicated styles detected</h3> <p>What do you want to do with them?</p><a class="mfn-btn btn-wide btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> <a class="mfn-btn btn-wide mfn-btn-red mfn-import-classes-overwrite" href="#"><span class="btn-wrapper">Overwrite</span></a> <a class="mfn-btn btn-wide mfn-btn-green mfn-import-classes-keep-both" href="#"><span class="btn-wrapper">Keep both</span></a> </div></div></div>`);
$('.mfn-import-classes-overwrite').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$(this).addClass('loading');
mfn_classes.import.import_data();
});
$('.mfn-import-classes-keep-both').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$(this).addClass('loading');
mfn_classes.import.data = mfn_classes.import.duplicates;
mfn_classes.import.import_data();
});
},
import_data: function() {
if( !mfn_classes.import.data.length ) {
$('.modal-confirm.show').remove();
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">Global styles imported.</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
return;
}else{
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnupdateclasses',
'mfn-builder-nonce': wpnonce,
val: JSON.stringify(mfn_classes.import.data),
type: 'import'
},
type: 'POST',
success: function(response) {
$('.modal-confirm.show').remove();
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">Global styles imported.</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
mfn.classes = response;
loopAllStyleFields();
}
});
}
}
},
list_modal: {
// mfn_classes.list_modal
confirm: function() {
$('.mfn-ui')
.append(`<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-delete"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Delete global style</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <img class="icon" alt="" src="${mfn.themepath}/muffin-options/svg/warning.svg"> <h3>Delete style?</h3> <p>Please confirm. There is no undo.</p><a class="mfn-btn mfn-btn-red btn-wide btn-modal-confirm" href="#"><span class="btn-wrapper">Delete</span></a> </div></div></div>`);
$('.btn-modal-confirm').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$(this).addClass('loading');
mfn_classes.list_modal.delete();
});
},
reload: function() {
mfn_classes.list_modal.close();
mfn_classes.list_modal.show();
mfn_classes.refresh = false;
},
delete: function() {
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnupdateclasses',
'mfn-builder-nonce': wpnonce,
val: mfn_classes.uid,
type: 'delete'
},
type: 'POST',
success: function(response) {
$('.mfn-global-styles-listing li[data-id="'+mfn_classes.uid+'"]').remove();
mfn.classes = response;
sidebar_form.render();
loopAllStyleFields();
//$('.mfn-ui').removeClass('mfn-modal-open');
mfn_classes.list_modal.reload();
$('.modal-confirm.show').remove();
$content.find('style.mfn-local-style-'+mfn_classes.uid).remove();
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">Style removed.</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
}
});
},
rename: function() {
let tmp_class = mfn.classes.filter( (n) => n.uid == mfn_classes.uid )[0];
$('.mfn-ui')
.append(`<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-be-class"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Rename global style</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"><div class="mfn-form-row"><input value="${tmp_class.title}" type="text" class="mfn-form-control mfn-class-new-name"></div><a class="mfn-btn mfn-btn-blue btn-modal-confirm" href="#"><span class="btn-wrapper">Save</span></a> <a class="mfn-btn btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> </div></div></div>`);
$('.btn-modal-confirm').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$('.mfn-class-new-name').removeClass('error');
if( !$('.mfn-class-new-name').val().length ) {
$('.mfn-class-new-name').addClass('error');
return;
}
$(this).addClass('loading');
let new_name = $('.mfn-class-new-name').val();
let tmp_class = mfn.classes.filter( (n) => n.uid == mfn_classes.uid )[0];
tmp_class.title = new_name;
$('.mfn-global-styles-listing li[data-id="'+mfn_classes.uid+'"] .mfn-class-title').text(new_name);
setTimeout(mfn_classes.ajax(tmp_class), 10);
});
},
duplicate: function() {
let tmp_class = JSON.parse( JSON.stringify(mfn.classes.filter( (n) => n.uid == mfn_classes.uid )[0]));
$('.mfn-ui')
.append(`<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-be-class"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Clone global style</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"><div class="mfn-form-row"><input placeholder="Global style name" type="text" class="mfn-form-control mfn-class-new-name"></div><a class="mfn-btn mfn-btn-blue btn-modal-confirm" href="#"><span class="btn-wrapper">Save</span></a> <a class="mfn-btn btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> </div></div></div>`);
$('.btn-modal-confirm').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$('.mfn-class-new-name').removeClass('error');
if( !$('.mfn-class-new-name').val().length ) {
$('.mfn-class-new-name').addClass('error');
return;
}
$(this).addClass('loading');
let new_name = $('.mfn-class-new-name').val();
let new_uid = `be_${tmp_class.jsclass}_${getUid()}`;
let check_if_exists = mfn.classes.filter( cl => cl.title == new_name );
if( check_if_exists.length ) {
new_name += '_copy';
let check_if_exists2 = mfn.classes.filter( cl => cl.title.includes(new_name) );
if( check_if_exists2.length ) new_name += '_'+check_if_exists2.length;
}
tmp_class.title = new_name;
tmp_class.uid = new_uid;
if( _.has(tmp_class, 'attr') ){
_.map(tmp_class.attr, function(atr, a) {
if( _.has(atr, 'selector') ) {
//console.log(atr.selector);
atr.selector = atr.selector.replaceAll(mfn_classes.uid, new_uid);
}
});
}
mfn_classes.refresh = true;
setTimeout(mfn_classes.ajax(tmp_class), 10);
});
},
show: function() {
const sortedData = Object.fromEntries(
Object.keys(renderMfnFields)
.sort() // Sort the keys alphabetically
.map(key => [key, renderMfnFields[key]]) // Map back to key-value pairs
);
$('.mfn-ui')
.addClass('mfn-modal-open')
.append(`<div class="mfn-modal show modal-classes-listing mfn-modal-900">
<div class="mfn-modalbox mfn-form mfn-shadow-1">
<div class="modalbox-header">
<div class="options-group">
<div class="modalbox-title-group">
<span class="modalbox-icon mfn-icon mfn-icon-global-styles-list"></span>
<div class="modalbox-desc">
<h4 class="modalbox-title">Global styles</h4>
</div>
</div>
</div>
<div class="options-group right"> <div class="modalbox-search"> <div class="form-control"> <input class="mfn-form-control mfn-form-input mfn-search" type="text" placeholder="Search"> </div> </div> </div>
<div class="options-group"><a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a></div>
</div>
<div class="modalbox-content">
${ mfn.classes.length ? `
<ul class="mfn-global-styles-listing">
${ _.map(sortedData, (item, i) => {
if( i == 'items' ) return '';
let classes_find = mfn.classes.filter( c => c.jsclass == i );
return classes_find.length ? `
<li data-name="${i.toLowerCase().replaceAll('_2', '').replaceAll('_', ' ').replaceAll('-', ' ')}">
<div class="title-group">
<span class="mfn-icon mfn-icon-${i.replaceAll('_', '-')}"></span>
<h5>${i.replaceAll('_2', '').replaceAll('_', ' ').replaceAll('-', ' ')}</h5>
</div>
<ul>
${classes_find.map( cf => {
return `<li data-name="${ cf.title.toLowerCase() }" data-id="${cf.uid}"><span class="mfn-class-name-wrapper"><span class="mfn-class-title">${ cf.title }</span><a href="#" data-tooltip="Rename" class="mfn-class-rename mfn-option-btn mfn-option-blank btn-small"><span class="mfn-icon mfn-icon-rename"></span></a><pre class="mfn-class-code">${ cf.uid }</pre></span><div class="modal-classes-listing-tools"><a href="#" data-tooltip="Clone" class="mfn-class-duplicate mfn-option-btn mfn-option-blank btn-small"><span class="mfn-icon mfn-icon-clone"></span></a><a href="#" data-tooltip="Delete" class="mfn-class-remove mfn-option-btn mfn-option-blank btn-small"><span class="mfn-icon mfn-icon-delete"></span></a></div></li>`
}).join('')}
</ul>
</li>
` : '';
}).join('')}
</ul>
` : '<h5>Empty list</h5>' }
</div>
</div>
</div>`
);
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
mfn_classes.list_modal.close();
});
$('.mfn-class-remove').on('click', function(e) {
e.preventDefault();
mfn_classes.uid = $(this).closest('li').attr('data-id');
mfn_classes.list_modal.confirm();
});
$('.mfn-class-rename').on('click', function(e) {
e.preventDefault();
mfn_classes.uid = $(this).closest('li').attr('data-id');
mfn_classes.list_modal.rename();
});
$('.mfn-class-duplicate').on('click', function(e) {
e.preventDefault();
mfn_classes.uid = $(this).closest('li').attr('data-id');
mfn_classes.list_modal.duplicate();
});
},
close: function() {
// mfn_classes.close();
if( !$('.modal-classes-listing.show').length ) return;
$('.mfn-ui').removeClass('mfn-modal-open');
mfn_classes.styles = '';
$('.modal-classes-listing.show').remove();
}
},
get_styles: function(item) {
mfn_classes.styles = '';
_.map( item, function(opt, o) {
if( !_.isEmpty(opt) && ( o.includes('css_') || _.indexOf(mfn_classes.exceptions, o) >= 0 || _.indexOf(mfn_classes.exceptions, edited_item.jsclass+'_'+o) >= 0 ) ) {
if( _.has(mfn_classes.original, 'attr') && _.has(mfn_classes.original.attr, o) && ( (opt == mfn_classes.original.attr[o]) || (_.has(mfn_classes.original.attr[o], 'val') && opt.val == mfn_classes.original.attr[o]['val']) ) ) {
return;
}
mfn_classes.confirmed.push(o);
let this_opt = $('.mfn-element-fields-wrapper .mfn-form-row[data-id="'+o+'"]');
let tab_div = $('.mfn-element-fields-wrapper .mfn-form-row[data-id="'+o+'"]').closest('.modalbox-card');
let tab = 'Style';
if( tab_div.hasClass('modalbox-card-content') ) tab = 'Settings';
if( tab_div.hasClass('modalbox-card-advanced') ) tab = 'Advanced';
let heading = this_opt.prevAll('.row-header').first().text();
if( heading === null || heading.match(/^ *$/) !== null ) {
heading = this_opt.closest('.mfn-form-row').prevAll('.row-header').first().text();
if( this_opt.closest('.mfn-sft').length ) {
heading = this_opt.closest('.mfn-sft').closest('.mfn-form-row').prevAll('.row-header').first().text();
}
if( this_opt.closest('.mfn-sidebar-fields-tabs').length ) {
heading = this_opt.closest('.mfn-sidebar-fields-tabs').closest('.mfn-form-row').prevAll('.row-header').first().text();
}
if( o.includes('_hover') ) heading += ':hover';
if( o.includes('_active') ) heading += ':active';
}
let this_val = '';
if( _.has(opt, 'val') && typeof opt.val == 'object' && !_.isEmpty(opt.val) ) {
this_val = _.map(opt.val, function(v,s) {
if( !_.isEmpty(v) && s != 'string' ) {
if( typeof v == 'object' ) {
let tv = s+"\r\n"+'<ul>';
tv += _.map(v, function(c,x) {
return '<li>'+x+': '+c+'</li>';
}).join('');
tv += '</ul>'
return tv;
}else{
return s.trim()+"\r\n"+'<ul><li>'+v+'</li></ul>';
}
}
}).join('')
}else if(!_.isEmpty(opt.val)) {
this_val = opt.val;
}else if(!_.isEmpty(opt)) {
if( typeof opt == 'object' ){
this_val = _.map(opt, function(v,s) {
if( !_.isEmpty(v) && s != 'string' ) {
if( typeof v == 'object' ) {
let tv = s+"\r\n"+'<ul>';
tv += _.map(v, function(c,x) {
return '<li>'+x+': '+c+'</li>';
}).join('');
tv += '</ul>'
return tv;
}else{
return s.trim()+"\r\n"+'<ul><li>'+v+'</li></ul>';
}
}
}).join('')
}else{
this_val = opt;
}
}
//let this_val = _.has(opt, 'val') && typeof opt.val == 'object' ? _.map(opt.val, (v,s) => `${s.trim()}: ${v}<br>`).join('') : `${opt.val}`;
if( this_val.length && !_.isEmpty(this_val) ) mfn_classes.styles += `<li class="active"><span data-id="${o}" class="mfn-class-styles-check"></span><span class="mfn-class-styles-list-cat">${tab} / ${heading.trim()}</span><span class="mfn-class-styles-list-title">${this_opt.find('label').first().text().trim()}</span><span title="${ this_val.replaceAll('<br>', '; ').replaceAll('<ul>', '').replaceAll('</ul>', "").replaceAll('<li>', "").replaceAll('</li>', "\r\n") }" class="mfn-class-styles-list-val">${ this_val }</span></li>`;
}
});
},
modal: function() {
// mfn_classes.modal
if( !edited_item ) return;
mfn_classes.confirmed = [];
if( _.has(edited_item, 'be_classes') && edited_item.be_classes.length > 0 ) {
mfn_classes.has_classes = true;
}else{
mfn_classes.has_classes = false;
}
mfn_classes.original = edited_item.jsclass == 'section' || edited_item.jsclass == 'wrap' ? JSON.parse( JSON.stringify(mfn.elements[edited_item.jsclass]) ) : JSON.parse( JSON.stringify(renderMfnFields.items[edited_item.jsclass]) );
mfn_classes.get_styles(edited_item.attr);
$('.mfn-ui')
.addClass('mfn-modal-open')
.append(`<div class="mfn-modal show modal-classes mfn-modal-900">
<div class="mfn-modalbox mfn-form mfn-shadow-1">
<div class="modalbox-header">
<div class="options-group">
<div class="modalbox-title-group">
<span class="modalbox-icon mfn-icon-be-class"></span>
<div class="modalbox-desc">
<h4 class="modalbox-title">Global styles</h4>
</div>
</div>
</div>
<div class="options-group">
<a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a>
</div>
</div>
<div class="modalbox-content">
${ mfn_classes.styles.length ?
`<h5>${mfn_classes.popup_title}</h5>
<div class="mfn-form-row">
<label>Options to save</label>
<ul class="mfn-class-styles-list">
${mfn_classes.styles}
</ul>
</div>
<div class="mfn-form-row">
<label>Create new global style</label>
<input class="mfn-form-control mfn-form-input mfn-new-class-name-input" type="text" placeholder="type-style-name" autocomplete="off">
</div>
<a class="mfn-btn mfn-btn-blue btn-save-new-class btn-modal-confirm" ${mfn.view == 'demo' ? 'data-tooltip="Unavailable in Demo"' : ''} href="#"><span class="btn-wrapper">Save</span></a>
<a class="mfn-btn mfn-new-class-toggle btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a>
` : '<h5>No CSS given</h5>' }
</div>
</div>
</div>`
);
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
mfn_classes.close();
});
},
close: function() {
// mfn_classes.close();
if( !$('.modal-classes.show').length ) return;
$('.mfn-ui').removeClass('mfn-modal-open');
mfn_classes.styles = '';
$('.modal-classes.show').remove();
},
create: function() {
// mfn_classes.create();
if( mfn.view == 'demo' ) return;
$('.mfn-new-class-name-input').removeClass('error');
$('.modal-classes .mfn-input-error-msg').remove();
var class_name_input = $('.mfn-new-class-name-input');
var class_name = `be_${edited_item.jsclass}_${getUid()}`;
if( !class_name_input.val().length ) {
class_name_input.addClass('error');
$('.modal-classes.show .mfn-btn.loading').before('<span class="mfn-input-error-msg">Make sure the title is not empty and not taken</span>').removeClass('loading disabled');
return;
}
if( mfn.classes.length && mfn.classes.filter( (n) => n.title == class_name_input.val() ).length ) {
class_name_input.addClass('error');
$('.modal-classes.show .mfn-btn.loading').before('<span class="mfn-input-error-msg">This name is already taken. Please choose another.</span>').removeClass('loading disabled');
return;
}
if( !_.has(edited_item, 'be_classes') ) edited_item['be_classes'] = [];
if( _.indexOf(edited_item.be_classes, class_name) >= 0 ) return;
let copy_ei = JSON.parse( JSON.stringify(edited_item) );
let tmp_class = {
jsclass: copy_ei.jsclass,
type: 'be_class',
title: class_name_input.val(),
uid: class_name,
attr: {}
};
_.map( copy_ei.attr, function(opt, o) {
if( ( o.includes('css_') && _.indexOf(mfn_classes.confirmed, o) >= 0 ) || _.indexOf(mfn_classes.exceptions, o) >= 0 || _.indexOf(mfn_classes.exceptions, copy_ei.jsclass+'_'+o) >= 0 ) {
tmp_class['attr'][o] = opt;
if( _.indexOf(mfn_classes.exceptions, o) < 0 ) delete(edited_item.attr[o]);
}
});
edited_item['be_classes'] = [];
edited_item['be_classes'].push(class_name);
$('.sidebar-panel-classes-list .sidebar-panel-classes-input').before('<span data-name="'+class_name+'" class="sidebar-panel-class mfn-autocomplete-item">'+class_name_input.val()+'<span class="sidebar-panel-class-edit mfn-autocomplete-item-edit">✎</span> <span class="sidebar-panel-class-delete mfn-autocomplete-item-delete">✕</span></span>');
//$builder.find(`.mcb-${edited_item.jsclass}-${edited_item.uid}`).addClass(class_name);
$builder.find('.'+$('.mfn-element-fields-wrapper').attr('data-element')).addClass(class_name);
setTimeout(mfn_classes.ajax(tmp_class), 10);
},
ajax: function(tmp_class) {
// mfn_classes.ajax();
// mfn_classes.has_changed = false;
_.map( tmp_class.attr, function(opt, o) {
if( (o.includes('css_') && _.has(opt, 'selector')) || _.indexOf(mfn_classes.exceptions, o) < 0 || _.indexOf(mfn_classes.exceptions, tmp_class.jsclass+'_'+o) < 0 ) {
if( o.includes('css_') && _.has(opt, 'selector') ) opt.selector = opt.selector.replaceAll('.mcb-section .mcb-wrap .mcb-item-mfnuidelement', '.column.'+tmp_class.uid).replaceAll('.mcb-section .mcb-wrap-mfnuidelement', '.wrap.'+tmp_class.uid).replaceAll('mcb-section-mfnuidelement', tmp_class.uid);
tmp_class['attr'][o] = opt;
}
});
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnupdateclasses',
'mfn-builder-nonce': wpnonce,
val: tmp_class
},
type: 'POST',
success: function(response) {
mfn_classes.close();
mfn.classes = response;
mfn_classes.uid = false;
mfn_classes.confirmed = [];
//sidebar_form.open( $content.find('.mfn-current-editing'), false );
sidebar_form.render();
$content.find('style.mfn-local-style-'+edited_item.uid).remove();
loopAllStyleFields();
if( mfn_classes.refresh_all_items_with_class ) {
if( $builder.find('.'+tmp_class.uid).length ) {
$builder.find('.vb-item.'+tmp_class.uid).each(function() {
let uid = $(this).attr('data-uid');
if( $(this).hasClass('wrap') ) {
re_render( $(this).closest('.mcb-section').attr('data-uid') );
}else{
re_render(uid);
}
});
}
mfn_classes.refresh_all_items_with_class = false;
}
if($('.mfn-class-editor-update').length) $('.mfn-class-editor-update').removeClass('loading');
if( $('.modal-confirm.show').length ) $('.modal-confirm.show').remove();
if( mfn_classes.refresh ) mfn_classes.list_modal.reload();
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">Global styles updated.</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
}
});
},
remove: function(classname) {
$('.sidebar-panel-classes-list .sidebar-panel-class[data-name="'+classname+'"]').remove();
if($('.mfn-ui').hasClass('mfn-class-editor-full')) $('.mfn-ui').removeClass('mfn-class-editor-full');
if( _.has(edited_item, 'be_classes') ) {
let index = _.indexOf(edited_item.be_classes, classname);
if( index >= 0 ) edited_item.be_classes.splice(index, 1);
$builder.find('.'+$('.mfn-element-fields-wrapper').attr('data-element')).removeClass(classname);
sidebar_form.render();
}
if( _.has(edited_item, 'be_classes') && !edited_item.be_classes.length ) {
$('.mfn-classes-used-info').remove();
delete(edited_item.be_classes);
}
},
edit: function(classname) {
let this_class = mfn.classes.filter( (c) => c.uid == classname )[0];
if( !this_class || !_.has(this_class, 'jsclass') ) {
console.error('There is no such class on the list. Please refresh the page.');
return false;
}
$('.sidebar-panel-classes').remove();
//$('#header-edit-item .sidebar-panel-title').text('.'+this_class.nicename);
edited_item = this_class;
sidebar_form.is_class = classname;
sidebar_form.open($content.find('.mfn-current-editing'), true);
}
}
mfn_classes.init();
$(document).on('focus', '.mfn-placeholder-inherited-class input[type="text"], .mfn-placeholder-inherited-std input[type="text"], .mfn-placeholder-inherited-rwd input[type="text"], .mfn-placeholder-inherited-class input[type="number"], .mfn-placeholder-inherited-std input[type="number"], .mfn-placeholder-inherited-rwd input[type="number"]', function() {
$(this).attr('placeholder', $(this).val()).val('');
}).on('blur', '.mfn-placeholder-inherited-std input[type="text"], .mfn-placeholder-inherited-class input[type="text"], .mfn-placeholder-inherited-rwd input[type="text"], .mfn-placeholder-inherited-class input[type="number"], .mfn-placeholder-inherited-std input[type="number"], .mfn-placeholder-inherited-rwd input[type="number"]', function() {
if( !$(this).val().length && typeof $(this).attr('placeholder') != 'undefined' ) $(this).val( $(this).attr('placeholder') );
});
var mfn_conditional_logic = {
fill: false,
init: function() {
$(document).on('click', '.mfn-conditional-logic-add-button', function(e) {
e.preventDefault();
$('.modal-conditional-logic').addClass('show');
$('.modal-conditional-logic-form').empty();
mfn_conditional_logic.used();
});
mfn_conditional_logic.add();
mfn_conditional_logic.ui();
},
ui: function() {
$(document).on('change', '.modal-conditional-logic .mfn-cl-row-input.mfn-cl-row-input-type', function(e) {
e.preventDefault();
var val = $(this).val();
$(this).closest('.mfn-cl-row').find('.mfn-cl-row-col .mfn-cl-row-input-variable').removeClass('mfn-cl-row-input-visible');
if( val.length ){
$(this).closest('.mfn-cl-row').find('.mfn-cl-row-col-variable').addClass('mfn-cl-row-col-visible');
$(this).closest('.mfn-cl-row').find('.mfn-cl-row-col .mfn-cl-row-input-variable.mfn-cl-row-input-'+val).addClass('mfn-cl-row-input-visible');
}else{
$(this).closest('.mfn-cl-row').find('.mfn-cl-row-col-variable').removeClass('mfn-cl-row-col-visible');
}
});
$(document).on('click', '.modal-conditional-logic .mfn-cl-remove', function(e) {
e.preventDefault();
let this_condition = $(this).closest('.mfn-cl-condition');
let cl_rows = this_condition.find('.mfn-cl-row').length;
if( $(this).closest('.mfn-cl-condition').find('.mfn-cl-row').length == 1 ){
$(this).closest('.mfn-cl-condition').remove();
}else{
$(this).closest('.mfn-cl-row').remove();
}
if( cl_rows == 2 ) this_condition.addClass('mfn-cl-condition-single').removeClass('mfn-cl-condition-multiple');
setTimeout(mfn_conditional_logic.update(), 100);
});
$(document).on('change', '.modal-conditional-logic .mfn-cl-row .mfn-cl-row-col .mfn-cl-row-input', function(e) {
setTimeout(mfn_conditional_logic.update(), 100);
});
},
add: function() {
$(document).on('click', '.modal-conditional-logic .mfn-cl-add-row', function(e) {
e.preventDefault();
$('.modal-conditional-logic-form').append( mfn_conditional_logic.form() );
});
$(document).on('click', '.modal-conditional-logic .mfn-cl-and', function(e) {
e.preventDefault();
$(this).closest('.mfn-cl-condition').removeClass('mfn-cl-condition-single').addClass('mfn-cl-condition-multiple').append( mfn_conditional_logic.form( true ) );
});
},
form: function(ver = false) {
let html = '';
if( !ver ) html += '<div class="mfn-cl-condition mfn-cl-condition-single">';
if( !mfn.is_woocommerce ) delete(mfn_conditional_logic.options.woocommerce);
html += `<div class="mfn-cl-row">
<div class="mfn-cl-row-col">
<select class="mfn-form-control mfn-form-select mfn-form-select mfn-cl-row-input mfn-cl-row-input-type">
<option value="">Choose option</option>
${ _.map( mfn_conditional_logic.options, (opt, o) => `
<optgroup data-type="${o}" label="${opt.label}">
${ _.map( opt.options, (field) =>
`<option ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key == field.id ? 'selected' : '' } value="${field.id}">${field.label}</option>`
).join('') }
</optgroup>`
).join('') }
</select>
</div>
<div class="mfn-cl-row-col mfn-cl-row-col-variable mfn-cl-row-col-is-or-no ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key.length ? 'mfn-cl-row-col-visible' : '' }">
${ _.map( mfn_conditional_logic.options, (opt, o) =>
_.map( opt.options, (field) =>
`<select class="mfn-form-control mfn-form-select mfn-cl-row-input mfn-cl-row-input-variable mfn-cl-row-input-is mfn-cl-row-input-${field.id} ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key == field.id ? 'mfn-cl-row-input-visible' : '' }">
${ _.map( field.conditions, (con, c) =>
`<option ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.var == c ? 'selected' : '' } value="${c}">${con}</option>`
).join('') }
</select>`
).join('')
).join('') }
</div>
<div class="mfn-cl-row-col mfn-cl-row-col-variable ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key.length ? 'mfn-cl-row-col-visible' : '' }">
${ _.map( mfn_conditional_logic.options, (opt, o) => `
${ _.map( opt.options, function (field) {
let field_html = '';
if( field.input == 'text' ){
field_html = `<input type="text" class="mfn-form-control mfn-cl-row-input mfn-cl-row-input-value mfn-cl-row-input-variable mfn-cl-row-input-${field.id} ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key == field.id ? 'mfn-cl-row-input-visible' : '' }" ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.value.length ? 'value="'+mfn_conditional_logic.fill.value+'"' : '' }>`;
}else if( field.input == 'date' ){
field_html = `<input type="date" class="mfn-form-control mfn-cl-row-input mfn-cl-row-input-value mfn-cl-row-input-variable mfn-cl-row-input-${field.id} ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key == field.id ? 'mfn-cl-row-input-visible' : '' }" ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.value.length ? 'value="'+mfn_conditional_logic.fill.value+'"' : '' }>`;
}else if( field.input == 'select' ){
field_html = `<select class="mfn-form-control mfn-form-select mfn-cl-row-input mfn-cl-row-input-value mfn-cl-row-input-variable mfn-cl-row-input-${field.id} ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key == field.id ? 'mfn-cl-row-input-visible' : '' }">
${ _.map( field.options, (field_opt, f) =>
`<option ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.value == f ? 'selected' : '' } value="${f}">${field_opt}</option>`
).join('') }
</select>`;
}else if( field.input == 'select_2' ){
field_html = `<div class="form-group mfn-select2-wrapper mfn-cl-row-input mfn-cl-row-input-value mfn-cl-row-input-variable mfn-cl-row-input-${field.id} ${mfn_conditional_logic.fill && mfn_conditional_logic.fill.key == field.id ? 'mfn-cl-row-input-visible' : '' }">
<div class="form-control"><input type="text" ${mfn_conditional_logic.fill.value && _.has(mfn_conditional_logic.fill.value, 'label') ? `value="${mfn_conditional_logic.fill.value.label}"` : ''} ${mfn_conditional_logic.fill.value ? `data-selected='${ JSON.stringify(mfn_conditional_logic.fill.value) }'` : ''} class="mfn-select2-input" data-get="${field.options}" placeholder="Start typing (min. 3 chars) or select available one"></div>
<ul class="mfn-select2-options"></ul>
</div>`;
}
return field_html;
}).join('') } `
).join('') }
</div>
<div class="mfn-cl-row-col mfn-cl-row-col-tools">
<a class="mfn-option-btn mfn-option-blank btn-large mfn-cl-and" title="AND" href="#">AND</a>
<a class="mfn-option-btn mfn-option-blank btn-large mfn-cl-remove" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a>
</div>
</div>`;
if( !ver ) html += '</div>';
mfn_conditional_logic.fill = false;
return html;
},
used: function() {
if( !_.has(edited_item, 'attr') ) return;
if( !_.has(edited_item.attr, 'conditions') ) return;
if( !edited_item.attr.conditions.length ) return;
_.map( edited_item.attr.conditions, function(used_opt) {
if( used_opt.length ) {
_.map( used_opt, function(opt, o) {
mfn_conditional_logic.fill = opt;
if( o == 0 ){
$('.modal-conditional-logic-form').append( mfn_conditional_logic.form() );
}else{
$('.modal-conditional-logic-form .mfn-cl-condition:last-child').removeClass('mfn-cl-condition-single').addClass('mfn-cl-condition-multiple').append( mfn_conditional_logic.form(true) );
}
});
}
});
},
options: {
'singular': {
label: 'Singular',
options: [
{ id: 'post_type', label: 'Post type', input: 'select', conditions: { 'is': 'is', 'isnt': 'is not'}, options: mfnDbLists.post_types },
{ id: 'post_taxonomy', label: 'Post taxonomy', input: 'select_2', conditions: { 'is': 'is', 'isnt': 'is not'}, options: 'taxonomies' },
{ id: 'post', label: 'Post', input: 'select_2', conditions: { 'is': 'is', 'isnt': 'is not'}, options: 'posts' },
{ id: 'featured_image', label: 'Featured image', input: 'select', conditions: { 'is': 'is'}, options: {'set': 'Set', 'not-set': 'Not set'} },
{ id: 'excerpt', label: 'Excerpt', input: 'select', conditions: { 'is': 'is'}, options: {'set': 'Set', 'not-set': 'Not set'} },
],
},
'archive': {
label: 'Archive',
options: [
{ id: 'post_type_archive', label: 'Post type archive', input: 'select', conditions: { 'is': 'is', 'isnt': 'is not'}, options: mfnDbLists.post_types },
{ id: 'archive_category', label: 'Archive category', input: 'select_2', conditions: { 'is': 'is', 'isnt': 'is not'}, options: 'taxonomies' },
],
},
'user': {
label: 'User',
options: [
{ id: 'login_status', label: 'Login status', input: 'select', conditions: { 'is': 'is'}, options: {'non_logged': 'Non logged', 'logged_in': 'Logged in'} },
{ id: 'user_role', label: 'User role', input: 'select', conditions: { 'is': 'is', 'isnt': 'is not'}, options: mfnDbLists.user_roles },
]
},
'woocommerce': {
label: 'Woocommerce',
options: [
{ id: 'has_purchased', label: 'User has', input: 'select_2', conditions: { 'is': 'Purchased', 'isnt': 'Not Purchased' }, options: 'products' },
],
},
'dates': {
label: 'Dates',
options: [
{ id: 'part_of_the_week', label: 'Part of the week', input: 'select', conditions: { 'is': 'is', 'isnt': 'is not'}, options: {'weekend': 'Weekend', 'monday-friday': 'Monday - Friday', 'monday': 'Monday', 'tuesday': 'Tuesday', 'wednesday': 'Wednesday', 'thursday': 'Thursday', 'friday': 'Friday', 'saturday': 'Saturday', 'sunday': 'Sunday'} },
{ id: 'date', label: 'Date', input: 'date', conditions: { 'is': 'is', 'isnt': 'is not'} },
]
}
},
update: function() {
var conditions = [];
if( $('.modal-conditional-logic .mfn-cl-condition').length ) {
$('.modal-conditional-logic .mfn-cl-condition').each(function() {
var cond = $(this);
var cond_uid = cond.attr('data-uid');
var cond_obj = [];
if( cond.find('.mfn-cl-row').length ) {
cond.find('.mfn-cl-row').each(function() {
var row = $(this);
var val = row.find('.mfn-cl-row-col-visible .mfn-cl-row-input-value.mfn-cl-row-input-visible').val();
if( row.find('.mfn-cl-row-col-visible .mfn-cl-row-input-value.mfn-cl-row-input-visible').find('.mfn-select2-input').length && typeof row.find('.mfn-cl-row-col-visible .mfn-cl-row-input-value.mfn-cl-row-input-visible .mfn-select2-input').attr('data-selected') !== 'undefined' ) {
val = JSON.parse(row.find('.mfn-cl-row-col-visible .mfn-cl-row-input-value.mfn-cl-row-input-visible .mfn-select2-input').attr('data-selected'));
}
if( row.find('.mfn-cl-row-input-type').val().length ) {
cond_obj.push({
key: row.find('.mfn-cl-row-input-type').val(),
var: row.find('.mfn-cl-row-col-is-or-no.mfn-cl-row-col-visible .mfn-cl-row-input-is.mfn-cl-row-input-visible').val(),
value: val,
});
}
});
conditions.push(cond_obj);
}
});
}
if( !_.isEmpty(conditions) ){
if( !_.has(edited_item, 'attr') ) $edited_item['attr'] = {};
edited_item['attr']['conditions'] = conditions;
}else if(typeof edited_item.attr.conditions !== 'undefined' ){
delete(edited_item.attr.conditions);
}
if($('.mfn-form-row.conditional_logic .mfn-used-conditional-logic').length) $('.mfn-form-row.conditional_logic .mfn-used-conditional-logic').remove();
$('.mfn-form-row.conditional_logic .mfn-conditional-logic-add-button').before(mfn_field_logic_sidebar_used());
}
}
function removeStartBuilding() {
if($builder.find('.mfn-section-start').length) {
$content.find('body').removeClass('mfn-ui-empty-page');
$builder.find('.mfn-section-start').remove();
}
}
// shortcode remove icon
$('.modal-add-shortcode .browse-icon .mfn-button-delete').on('click', function(e) {
e.preventDefault();
$('.modal-add-shortcode.show .browse-icon .mfn-form-control').val(sample_icon).trigger('change');
$('.modal-add-shortcode.show .form-addon-prepend .mfn-button-upload .label i').attr('class', sample_icon);
});
// choose icon
$('.mfn-modal.modal-select-icon .mfn-items-list li a').on('click', function(e) {
e.preventDefault();
let icon = $(this).find('i').attr('class');
$(this).parent().addClass('active');
if( $('.modal-add-shortcode').hasClass('show') ) {
// for shortcode
$('.modal-add-shortcode.show .browse-icon .mfn-form-control').val(icon).trigger('change');
$('.modal-add-shortcode.show .browse-icon.has-addons-prepend').removeClass('empty');
$('.modal-add-shortcode.show .browse-icon .form-addon-prepend .mfn-button-upload .label i').attr('class', icon);
$('.modal-select-icon.show').removeClass('show');
}else{
// for sidebar
var $input = $('.sidebar-panel-content .mfn-form-row .browse-icon.current-icon-editing .mfn-field-value, .sidebar-panel-content .mfn-form-row .browse-icon.current-icon-editing .field-to-object');
$input.val(icon).trigger('change');
$('.sidebar-panel-content .mfn-form-row .browse-icon.current-icon-editing').removeClass('empty current-icon-editing');
$('.mfn-modal').removeClass('show');
}
});
// delete icon
$editpanel.on('click', '.browse-icon .mfn-button-delete', function(e) {
e.preventDefault();
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let group = $(this).closest('.mfn-element-fields-wrapper').attr('data-group');
$editbox = $(this).closest('.form-control');
$('.mfn-field-value,.mfn-tab-icon', $editbox).val('').trigger('change');
});
$editpanel.on('change', '.mfn-form-row .browse-icon .mfn-field-value, .mfn-form-row .browse-icon .field-to-object', function() {
var $input = $(this);
var $editrow = $(this).closest('.mfn-form-row');
let it;
if( $(this).closest('.mfn-element-fields-wrapper').length ){
it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
}
let icon = $(this).val();
if( icon != '' ){
$(this).closest('.mfn-form-row').find('.form-addon-prepend .mfn-button-upload .label i').attr('class', icon);
$(this).closest('.mfn-form-row').find('.browse-icon').removeClass('empty');
// console.log('# icon change');
if( isBlocks() ){
$content.find('.'+it+' .item-preview-icon i').attr('class',icon).removeClass('empty');
} else if($content.find('.'+it).hasClass('column_counter')){
// counter
if( $content.find('.'+it+' .icon_wrapper').length ){
if($content.find('.'+it+' .icon_wrapper i').length){
$content.find('.'+it+' .icon_wrapper i').attr('class', icon);
}else{
$content.find('.'+it+' .icon_wrapper').html('<i class="'+icon+'"></i>');
}
}else{
$content.find('.'+it+' .counter').prepend('<div class="icon_wrapper"><i class="'+icon+'"></i></div>');
}
}else if($content.find('.'+it).hasClass('column_flat_box')){
// flat box
if($content.find('.'+it+' .icon i').length){
$content.find('.'+it+' .icon i').attr('class', icon);
}else{
$content.find('.'+it+' .icon').html('<i class="'+icon+'"></i>');
}
}else if($content.find('.'+it).hasClass('column_icon_box')){
// icon box
if($content.find('.'+it+' .icon_wrapper .icon i').length){
$content.find('.'+it+' .icon_wrapper .icon i').attr('class', icon);
}else{
if($content.find('.'+it+' .icon_box .image_wrapper').length){ $content.find('.'+it+' .icon_box .image_wrapper').remove(); }
$content.find('.'+it+' .icon_box').prepend('<div class="icon_wrapper"><div class="icon"><i class="'+icon+'"></i></div></div>');
}
}else if($content.find('.'+it).hasClass('column_icon_2')){
// icon
$content.find('.'+it+' .mfn-icon-2 i').attr('class', icon);
}else if($content.find('.'+it).hasClass('column_list')){
// list
if($content.find('.'+it+' .list_left i').length){
$content.find('.'+it+' .list_left i').attr('class', icon);
}else{
$content.find('.'+it+' .list_left').removeClass('list_image').addClass('list_icon').html('<i class="'+icon+'"></i>');
}
}else if($content.find('.'+it).hasClass('column_fancy_heading')){
// fancy heading
if($content.find('.'+it+' .icon_top i').length){
$content.find('.'+it+' .icon_top i').attr('class', icon);
}else{
$content.find('.'+it+' .fh-top').html('<div class="icon_top"><i class="'+icon+'"></i></div>');
}
}else if($content.find('.'+it).hasClass('column_call_to_action')){
// call to action
if($content.find('.'+it+' .call_center i').length){
$content.find('.'+it+' .call_center i').attr('class', icon);
}else{
$content.find('.'+it+' .call_center').html('<i class="'+icon+'"></i>');
}
if( $content.find('.'+it+' .call_center .button').length ){
$content.find('.'+it+' .call_center .button').addClass('has-icon');
}
}else if($content.find('.'+it).hasClass('column_hotspot')){
// hotspot icon
var point_id = $editrow.closest('.mfn-hotspot-point').attr('id');
$content.find('.'+it+' .hotspot-point-'+point_id+' i').attr('class', icon);
}else if($content.find('.'+it).hasClass('column_button')){
// button
if($content.find('.'+it+' .button .button_icon i').length){
$content.find('.'+it+' .button .button_icon i').attr('class', icon);
}else{
$content.find('.'+it+' .button').prepend('<span class="button_icon"><i class="'+icon+'"></i></span>');
$content.find('.'+it+' .button').addClass('has-icon');
}
}else if($content.find('.'+it).hasClass('column_chart')){
// chart
if($content.find('.'+it+' .chart .icon i').length){
$content.find('.'+it+' .chart .icon i').attr('class', icon);
}else{
if( !$content.find('.'+it+' .chart > .image').length ){
$content.find('.'+it+' .chart > .image').remove();
$content.find('.'+it+' .chart > .num').remove();
$content.find('.'+it+' .chart').prepend('<div class="icon"><i class="'+icon+'"></i></div>');
}else{
$content.find('.'+it+' .chart').append('<span class="mfn_tmp_info">The picture has higher priority. Delete it to see icon.</span>');
setTimeout(function() {
$content.find('.mfn_tmp_info').remove();
}, 3000);
}
}
}else if($content.find('.'+it).hasClass('column_header_icon')){
// header icon
$content.find('.'+it+' .icon-wrapper i').remove();
$content.find('.'+it+' .icon-wrapper img').remove();
$content.find('.'+it+' .icon-wrapper svg').remove();
if($content.find('.'+it+' .icon-wrapper').length){
$content.find('.'+it+' .icon-wrapper').prepend('<i class="'+icon+'"></i>');
}
}else if($content.find('.'+it).hasClass('column_accordion')){
// accordion icon
if( $editrow.hasClass('accordion icon_active') ){
$content.find('.'+it+' .accordion .question .title .acc-icon-minus').attr('class', 'acc-icon-minus '+icon);
}else{
$content.find('.'+it+' .accordion .question .title .acc-icon-plus').attr('class', 'acc-icon-plus '+icon);
}
}else if($content.find('.'+it).hasClass('column_blockquote')){
// blockquote icon
if( $editrow.hasClass('icon_author') ){
$content.find('.'+it+' .blockquote .author i').attr('class', icon);
}else{
$content.find('.'+it+' .blockquote .mfn-blockquote-icon i').attr('class', icon);
}
}else if($content.find('.'+it).hasClass('column_icon_box_2')){
// icon box 2
if($content.find('.'+it+' .icon-wrapper').length){
$content.find('.'+it+' .icon-wrapper').html('<i class="'+icon+'" aria-hidden="true"></i>');
}else{
$content.find('.'+it+' .desc-wrapper').before('<div class="icon-wrapper"><i class="'+icon+'" aria-hidden="true"></i></div>');
}
}else if($content.find('.'+it).hasClass('column_header_menu') && $editrow.hasClass('header_menu') && $editrow.hasClass('submenu_icon') ){
// header menu submenu icon
if($content.find('.'+it+' .menu-sub').length){
$content.find('.'+it+' .menu-sub').html('<i class="'+icon+'" aria-hidden="true"></i>');
}
}else if($content.find('.'+it).hasClass('column_sidemenu_menu') && $editrow.hasClass('sidemenu_menu') && $editrow.hasClass('submenu_icon') ){
// header menu submenu icon
if($content.find('.'+it+' .outer-menu-sub').length){
$content.find('.'+it+' .outer-menu-sub').html('<i class="'+icon+'" aria-hidden="true"></i>');
}
}else if($content.find('.'+it).hasClass('column_header_search')){
// header search icon
if($content.find('.'+it+' .icon_search').length){
$content.find('.'+it+' .icon_search').replaceWith('<span class="icon_search"><i class="'+icon+'" aria-hidden="true"></i></span>');
}else{
$content.find('.'+it+' form#searchform').prepend('<span class="icon_search"><i class="'+icon+'" aria-hidden="true"></i></span>');
}
}else if($content.find('.'+it).hasClass('column_megamenu_menu') && $editrow.hasClass('megamenu_menu submenu_icon') ){
// megamenu submenu icon
if($content.find('.'+it+' .menu-sub').length){
$content.find('.'+it+' .menu-sub i').attr('class', icon);
}else{
$content.find('.'+it+' li.menu-item-has-children > a').append('<span class="menu-sub"><i class="'+icon+'" aria-hidden="true"></i></span>');
}
}else if($content.find('.'+it).hasClass('column_megamenu_menu') && $editrow.hasClass('megamenu_menu decoration_icon') ){
// megamenu decoration icon
if($content.find('.'+it+' .decoration-icon').length){
$content.find('.'+it+' .decoration-icon i').attr('class', icon);
}else{
$content.find('.'+it+' li:not(.menu-item-has-children) > a').append('<span class="decoration-icon"><i class="'+icon+'" aria-hidden="true"></i></span>');
}
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('copy_link_icon') ){
// copy link icon
$content.find('.'+it+' .mfn-share-post-copy-link i').attr('class', icon);
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('facebook_icon') ){
// facebook icon
$content.find('.'+it+' .mfn-share-post-facebook i').attr('class', icon);
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('twitter_icon') ){
// twitter icon
$content.find('.'+it+' .mfn-share-post-twitter i').attr('class', icon);
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('linkedin_icon') ){
// linkedin icon
$content.find('.'+it+' .mfn-share-post-linkedin i').attr('class', icon);
}else if($content.find('.'+it).hasClass('column_header_burger') && $editrow.hasClass('icon')){
// header menu burger
if($content.find('.'+it+' .icon-wrapper').length){
$content.find('.'+it+' .icon-wrapper img').remove();
$content.find('.'+it+' .icon-wrapper i').remove();
$content.find('.'+it+' .icon-wrapper svg').remove();
$content.find('.'+it+' .icon-wrapper').html('<i class="'+icon+'" aria-hidden="true"></i>');
}else{
$content.find('.'+it+' .mfn-icon-box').prepend('<div class="icon-wrapper"><i class="'+icon+'" aria-hidden="true"></i></div>');
}
}else if( $editrow.hasClass('query_display_slider_arrow_prev') ){
$content.find('.'+it+' .swiper-button-prev i').attr('class', icon);
}else if( $editrow.hasClass('query_display_slider_arrow_next') ){
$content.find('.'+it+' .swiper-button-next i').attr('class', icon);
}else if( $editrow.hasClass('cta_icon') && $editrow.hasClass('banner_box') ){
$content.find('.'+it+' .mfn-banner-box .cta-icon i').attr('class', icon);
mfnBannerBox();
}else if($content.find('.'+it).hasClass('column_popup_exit') && $editrow.hasClass('popup_exit icon') ){
// exit popup close popup icon
if($content.find('.'+it+' .button_icon').length){
if( !$content.find('.'+it+' .button_icon img').length ) $content.find('.'+it+' .button_icon').html('<i class="'+icon+'"></i>');
}else{
$content.find('.'+it+' .exit-mfn-popup').addClass('has-icon');
$content.find('.'+it+' .exit-mfn-popup').prepend('<span class="button_icon"><i class="'+icon+'"></i></span>');
}
}
}else{
$(this).closest('.mfn-form-row').find('.form-addon-prepend .mfn-button-upload .label i').attr('class', sample_icon);
$(this).closest('.mfn-form-row').find('.mfn-field-value').val('');
$(this).closest('.mfn-form-row').find('.browse-icon').addClass('empty');
// console.log('# preview icon');
if( isBlocks() ){
$content.find('.'+it+' .item-preview-icon i').removeAttr('class');
} else if($content.find('.'+it).hasClass('column_counter')){
// counter
if($('.mfn-ui .panel-edit-item .mfn-form .mfn-form-control.preview-imageinput').val().length){
$content.find('.'+it+' .icon_wrapper').html( $('.mfn-ui .panel-edit-item .mfn-form .mfn-form-control.preview-imageinput').val() );
}else{
$content.find('.'+it+' .icon_wrapper').remove();
}
}else if($content.find('.'+it).hasClass('column_flat_box')){
// flat box
if($content.find('.'+it+' .icon i').length){
$content.find('.'+it+' .icon i').attr('class', sample_icon);
}
}else if($content.find('.'+it).hasClass('column_icon_2')){
// icon
$content.find('.'+it+' .mfn-icon-2 i').attr('class', `icon-lamp`);
}else if($content.find('.'+it).hasClass('column_icon_box')){
// icon box
$content.find('.'+it+' .icon_wrapper').remove();
if( $('.mfn-ui .panel-edit-item .mfn-form .mfn-form-control.preview-imageinput').val().length ){
$content.find('.'+it+' .icon_box').prepend(' <div class="image_wrapper"><img src=" '+ $('.mfn-ui .panel-edit-item .mfn-form .mfn-form-control.preview-imageinput').val() +' " class="scale-with-grid" alt=""></div> ');
}else{
$content.find('.'+it+' .icon_wrapper .icon i').attr('class', sample_icon);
//$('.panel-edit-item .mfn-form-row.icon .preview-iconinput').val(sample_icon);
}
}else if($content.find('.'+it).hasClass('column_list')){
// list
if($content.find('.'+it+' .list_left i').length){
$content.find('.'+it+' .list_left i').attr('class', sample_icon);
}
}else if($content.find('.'+it).hasClass('column_fancy_heading')){
// fancy heading
if($content.find('.'+it+' .icon_top i').length){
$content.find('.'+it+' .icon_top i').attr('class', sample_icon);
}
}else if($content.find('.'+it).hasClass('column_call_to_action')){
// call to action
if($content.find('.'+it+' .call_center i').length){
$content.find('.'+it+' .call_center i').attr('class', '');
}
if( $content.find('.'+it+' .call_center .button').length ){
$content.find('.'+it+' .call_center .button').removeClass('has-icon');
$content.find('.'+it+' .call_center .button .button_icon').remove();
}
}else if($content.find('.'+it).hasClass('column_button')){
// button
if($content.find('.'+it+' .button .button_icon i').length){
$content.find('.'+it+' .button .button_icon').remove();
$content.find('.'+it+' .button').removeClass('has-icon');
}
}else if($content.find('.'+it).hasClass('column_hotspot')){
// hotspot icon
var point_id = $editrow.closest('.mfn-hotspot-point').attr('id');
$content.find('.'+it+' .hotspot-point-'+point_id+' i').attr('class', 'icon-plus');
}else if($content.find('.'+it).hasClass('column_chart')){
// chart
if($content.find('.'+it+' .chart .icon').length){
$content.find('.'+it+' .chart .icon').remove();
if( $('.panel-edit-item .mfn-form .preview-imageinput').val().length ){
$content.find('.'+it+' .chart .num').remove();
$content.find('.'+it+' .chart .icon').remove();
$content.find('.'+it+' .chart').prepend('<div class="image"><img class="scale-with-grid" src="'+$('.panel-edit-item .mfn-form .preview-imageinput').val()+'" alt="" /></div>');
}else if( $('.panel-edit-item .mfn-form .preview-labelinput').val().length ){
$content.find('.'+it+' .chart .num').remove();
$content.find('.'+it+' .chart .image').remove();
$content.find('.'+it+' .chart').prepend('<div class="num">'+$('.panel-edit-item .preview-labelinput').val()+'</div>');
}
}
}else if($content.find('.'+it).hasClass('column_header_icon')){
// header icon
re_render();
}else if($content.find('.'+it).hasClass('column_blockquote')){
// blockquote icon
if( $editrow.hasClass('icon_author') ){
$content.find('.'+it+' .blockquote .author i').attr('class', 'icon-user');
}else{
$content.find('.'+it+' .blockquote .mfn-blockquote-icon i').attr('class', 'icon-quote');
}
}else if($content.find('.'+it).hasClass('column_icon_box_2')){
// icon box 2
if( $editpanel.find('.panel-edit-item .mfn-form .icon_box_2.image .preview-imageinput').val().length ){
if($content.find('.'+it+' .icon-wrapper').length){
$content.find('.'+it+' .icon-wrapper').html('<img class="scale-with-grid" src="'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.image .preview-imageinput').val()+'" alt="">');
}else{
$content.find('.'+it+' .desc-wrapper').before('<div class="icon-wrapper"><img class="scale-with-grid" src="'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.image .preview-imageinput').val()+' alt=""></div>');
}
}else if( $editpanel.find('.panel-edit-item .mfn-form .icon_box_2.label .mfn-field-value').val().length ){
if( $content.find('.'+it+' .icon-wrapper').length ){
$content.find('.'+it+' .icon-wrapper').html('<span class="icon-label">'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.label .mfn-field-value').val()+'</span>');
}else{
$content.find('.'+it+' .desc-wrapper').before('<div class="icon-wrapper"><span class="icon-label">'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.label .mfn-field-value').val()+'</span></div>');
}
}else{
$content.find('.'+it+' .icon-wrapper').remove();
}
}else if($content.find('.'+it).hasClass('column_header_menu') && $editrow.hasClass('header_menu') && $editrow.hasClass('submenu_icon') ){
// header menu submenu icon
$content.find('.'+it+' .menu-sub').html('');
$editpanel.find('.header_menu.submenu_icon_display ul.preview-submenu_icon_displayinput li:first-child a').trigger('click');
}else if($content.find('.'+it).hasClass('column_sidemenu_menu') && $editrow.hasClass('sidemenu_menu') && $editrow.hasClass('submenu_icon') ){
// header menu submenu icon
$content.find('.'+it+' .outer-menu-sub').html('');
}else if($content.find('.'+it).hasClass('column_megamenu_menu') && $editrow.hasClass('megamenu_menu submenu_icon') ){
// megamenu submenu icon
if($content.find('.'+it+' .menu-sub').length){
$content.find('.'+it+' .menu-sub').remove();
}
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('copy_link_icon') ){
// copy link icon
$content.find('.'+it+' .mfn-share-post-copy-link i').attr('class', 'far fa-copy');
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('facebook_icon') ){
// facebook icon
$content.find('.'+it+' .mfn-share-post-facebook i').attr('class', 'icon-facebook');
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('twitter_icon') ){
// twitter icon
$content.find('.'+it+' .mfn-share-post-twitter i').attr('class', 'icon-x-twitter');
}else if($content.find('.'+it).hasClass('column_share') && $editrow.hasClass('linkedin_icon') ){
// linkedin icon
$content.find('.'+it+' .mfn-share-post-linkedin i').attr('class', 'icon-linkedin');
}else if($content.find('.'+it).hasClass('column_header_search')){
// header search icon
if($content.find('.'+it+' .icon_search').length){
$content.find('.'+it+' .icon_search').replaceWith('<svg class="icon_search" width="26" viewBox="0 0 26 26" aria-label="search icon"><defs><style>.path{fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:1.5px;}</style></defs><circle class="path" cx="11.35" cy="11.35" r="6"></circle><line class="path" x1="15.59" y1="15.59" x2="20.65" y2="20.65"></line></svg>');
}else{
$content.find('.'+it+' form#searchform').prepend('<svg class="icon_search" width="26" viewBox="0 0 26 26" aria-label="search icon"><defs><style>.path{fill:none;stroke:#000;stroke-miterlimit:10;stroke-width:1.5px;}</style></defs><circle class="path" cx="11.35" cy="11.35" r="6"></circle><line class="path" x1="15.59" y1="15.59" x2="20.65" y2="20.65"></line></svg>');
}
}else if($content.find('.'+it).hasClass('column_megamenu_menu') && $editrow.hasClass('megamenu_menu decoration_icon') ){
// megamenu decoration icon
if($content.find('.'+it+' .decoration-icon').length){
$content.find('.'+it+' .decoration-icon').remove();
}
}else if($content.find('.'+it).hasClass('column_header_burger') && $content.find('.'+it).hasClass('column_header_burger') && $editrow.hasClass('icon')){
// header menu burger
if( $content.find('.'+it+' .icon-wrapper').length && $('.mfn-ui .panel-edit-item .mfn-form .header_burger.image .mfn-form-control.preview-imageinput').val().length ){
$content.find('.'+it+' .icon-wrapper i').remove();
$content.find('.'+it+' .icon-wrapper').prepend('<img src="'+$('.mfn-ui .panel-edit-item .mfn-form .header_burger.image .mfn-form-control.preview-imageinput').val()+'" alt="">');
}else{
$content.find('.'+it+' .icon-wrapper i').attr('class', 'icon-menu-fine');
}
}else if($content.find('.'+it).hasClass('column_accordion')){
// accordion icon
if( $editrow.hasClass('accordion icon_active') ){
$content.find('.'+it+' .accordion .question .title .acc-icon-minus').attr('class', 'acc-icon-minus icon-minus');
}else{
$content.find('.'+it+' .accordion .question .title .acc-icon-plus').attr('class', 'acc-icon-plus icon-plus');
}
}else if( $editrow.hasClass('query_display_slider_arrow_prev') ){
$content.find('.'+it+' .swiper-button-prev i').attr('class', 'icon-left-open-big');
}else if( $editrow.hasClass('cta_icon') && $editrow.hasClass('banner_box') ){
$content.find('.'+it+' .mfn-banner-box .cta-icon i').attr('class', 'icon-right-1');
mfnBannerBox();
}else if( $editrow.hasClass('query_display_slider_arrow_next') ){
$content.find('.'+it+' .swiper-button-next i').attr('class', 'icon-right-open-big');
}else if($content.find('.'+it).hasClass('column_popup_exit') && $editrow.hasClass('popup_exit icon') ){
// exit popup close popup icon
if( $('.mfn-form-row.popup_exit.image .mfn-field-value') && $content.find('.'+it+' .button_icon img').length ){
return;
}else{
$content.find('.'+it+' .exit-mfn-popup').removeClass('has-icon');
$content.find('.'+it+' .button_icon').remove();
}
}
}
});
var presets = {
init: function() {
presets.show();
presets.set();
presets.export();
},
export: function() {
$('.panel-export-import-presets .mfn-export-presets-button').on('click', function(e) {
e.preventDefault();
var $button = $(this);
$('#export-presets-data-textarea').select();
document.execCommand("copy");
$button.find('span').text('Exported').addClass('mfn-icon-check-blue');
setTimeout(function() { $button.find('span').html('Export'); }, 5000);
});
$('.panel-export-import-presets .mfn-import-presets-button').on('click', function(e) {
e.preventDefault();
var $input = $('.panel-export-import-presets #import-presets-data-textarea');
var $button = $(this);
$input.removeClass('error');
if($button.hasClass('loading')) return false;
if( !$input.val().length ){
$input.addClass('error');
}else{
$button.addClass('loading');
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnimportpreset',
'mfn-builder-nonce': wpnonce,
val: JSON.parse( $input.val() )
},
type: 'POST',
success: function(response){
$button.removeClass('loading').find('span').html('Imported');
setTimeout(function() { $button.find('span').html('Import'); }, 5000);
$input.val('');
mfn.presets = [];
mfn.presets = response;
}
});
}
});
},
set: function() {
$editpanel.on('click', '.mfn-ui .mfn-presets-list a.mfn-load-preset', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
$(this).addClass('loading');
var rerender = false;
historyStorage.allow = false;
var uid = $(this).attr('data-uid');
var styles = mfn.presets.filter( (item) => item.uid == uid ).length ? JSON.parse( JSON.stringify(mfn.presets.filter( (item) => item.uid == uid )[0] )) : false;
if( !styles || typeof styles.attr == 'undefined' || typeof edited_item.attr == 'undefined' ) {
$('.mfn-presets-list .dropdown-wrapper a').removeClass('loading');
return;
}
if( styles.item != edited_item.jsclass ) {
$('.mfn-presets-list .dropdown-wrapper a').removeClass('loading');
return; // different items
}
$edited_div = $content.find('.vb-item[data-uid="'+edited_item.uid+'"]');
// reset first
for(key in edited_item.attr) {
if( key.startsWith('css_') || key.startsWith('style:') || ( typeof presets_keys[edited_item.jsclass] !== 'undefined' && presets_keys[edited_item.jsclass].length && presets_keys[edited_item.jsclass].includes(key) ) ) {
delete edited_item.attr[key];
}
}
$content.find('style.mfn-local-style').remove();
// set
for (key in styles.attr) {
edited_item.attr[key] = styles.attr[key];
}
sidebar_form.is_class = false;
sidebar_form.open($edited_div, false);
loopAllStyleFields();
if( typeof presets_keys[edited_item.jsclass] !== 'undefined' && presets_keys[edited_item.jsclass].length ){
$.each( presets_keys[edited_item.jsclass], function(i, el) {
if( $editpanel.find('.panel-edit-item .mfn-form-row.'+el+'.re_render').length ){
rerender = true;
}else if( $editpanel.find('.panel-edit-item .mfn-form-row.'+el+' .segmented-options').length ){
$editpanel.find('.panel-edit-item .mfn-form-row.'+el+' .segmented-options li.active a').trigger('click');
}else{
$editpanel.find('.panel-edit-item .mfn-form-row.'+el+' .mfn-field-value').trigger('change');
}
});
}
$('.mfn-presets-list .dropdown-wrapper a').removeClass('loading');
historyStorage.allow = true;
if( rerender ) {
re_render();
}else if( edited_item.jsclass !== 'column'){
historyStorage.add();
}
});
},
show: function() {
$('.mfn-ui:not(.mfn-editing-section, .mfn-editing-wrap) .mfn-presets-list').on('mouseenter', function() {
$editpanel.find('.mfn-presets-list .dropdown-wrapper').html('');
var custom = false;
var builded_in = false;
if( typeof edited_item.jsclass === 'undefined' ) return;
if( mfn.presets.length ){
var el_presets = mfn.presets.filter( (it) => it.item == edited_item.jsclass );
$('.mfn-presets-list .dropdown-wrapper').append('<h6>Presets</h6>');
if( el_presets.length > 0 ){
$.each(el_presets, function(y,x) {
if( !builded_in && x.type == 'mfn' ) builded_in = true;
if( !custom && x.type == 'custom' ){
custom = true;
if( builded_in ) $('.mfn-presets-list .dropdown-wrapper').append('<div class="mfn-dropdown-divider"></div>');
}
$('.mfn-presets-list .dropdown-wrapper').append('<li class="mfn-preset-type-'+x.type+'"><a class="mfn-dropdown-item mfn-load-preset" data-uid="'+x.uid+'" href="#"> '+x.name+'</a>'+( x.type == 'custom' ? "<span class=\"mfn-icon mfn-icon-delete mfn-preset-remove\"></span>" : "" )+'</li>');
});
}else{
$('.mfn-presets-list .dropdown-wrapper').append('<i>No custom presets yet.</i>');
}
}
$('.mfn-presets-list .dropdown-wrapper').append('<li><a class="mfn-btn mfn-btn-blue preset-action-button" data-uid="'+edited_item.uid+'" href="#" data-tooltip="Create new preset from current styles"><span class="btn-wrapper"><span class="mfn-icon mfn-icon-add"></span></span></a></li>');
$('.mfn-presets-list a.preset-action-button').on('click', function(e) {
e.preventDefault();
presets.modal( $(this).attr('data-uid') );
});
$('.mfn-presets-list .dropdown-wrapper span.mfn-preset-remove').on('click', function() {
var $a = $(this).siblings('a');
if( $a.hasClass('loading') ) return;
$a.addClass('loading');
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-delete"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Delete preset</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <img class="icon" alt="" src="'+mfn.themepath+'/muffin-options/svg/warning.svg"> <h3>Delete preset?</h3> <p>Please confirm. There is no undo.</p><a class="mfn-btn mfn-btn-red btn-wide btn-modal-confirm" href="#"><span class="btn-wrapper">Delete</span></a> </div></div></div>');
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
});
$('.btn-modal-confirm').on('click', function(e){
e.preventDefault();
var uid = $a.attr('data-uid');
$(this).addClass('loading');
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnremovepreset',
'mfn-builder-nonce': wpnonce,
item: uid
},
type: 'POST',
success: function(response){
$a.parent('li').remove();
mfn.presets = mfn.presets.filter( (it) => it.uid != uid );
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
}
});
});
});
}).on('click', function(e) {
e.preventDefault();
});
},
modal: function(uid) {
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-preset"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Add new preset</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"><div class="mfn-form-row"><input placeholder="Type preset name" type="text" class="mfn-form-control mfn-preset-name"></div><a class="mfn-btn mfn-btn-blue btn-modal-confirm" '+( mfn.view == 'demo' ? 'data-tooltip="Unavailable in Demo"' : '' )+' href="#"><span class="btn-wrapper">Save</span></a> <a class="mfn-btn btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> </div></div></div>');
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
});
$('.btn-modal-confirm').on('click', function(e){
e.preventDefault();
$('.mfn-preset-name').removeClass('error');
if( $('.mfn-preset-name').val() != '' ){
presets.save(uid);
}else{
$('.mfn-preset-name').addClass('error');
}
});
},
save: function(uid) {
if( mfn.view == 'demo' ) return;
if( !$content.find('.preset-action-button').hasClass('loading') ) {
$content.find('.preset-action-button').addClass('loading');
$content.find('.mfn-contextmenu-save-preset .label').text('Saving...');
let pf = prepareForm.get( uid );
var formData = JSON.parse(pf)[0];
var save = {};
var keys_in = [];
if( typeof presets_keys[formData.jsclass] !== 'undefined' ){
keys_in = presets_keys[formData.jsclass];
}
for (key in formData.attr) {
if (key.startsWith('css_') || key.startsWith('style:') || ( keys_in.length && keys_in.includes(key) )) {
save[key] = formData.attr[key];
}
}
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnsavepreset',
'mfn-builder-nonce': wpnonce,
sections: save,
name: $('.mfn-preset-name').val(),
item: formData.jsclass
},
type: 'POST',
success: function(response){
mfn.presets = [];
mfn.presets = response;
$content.find('.preset-action-button').removeClass('loading');
$('.modal-confirm.show').remove();
$content.find('.mfn-contextmenu-save-preset .label').text('Preset saved');
setTimeout(function() {
$content.find('.mfn-contextmenu-save-preset .label').text('Save preset');
}, 3000);
}
});
}
}
}
// show choose icon
$editpanel.on('click', '.mfn-form-row .browse-icon .mfn-button-upload', function(e) {
e.preventDefault();
if( $('.current-icon-editing').length ) $('.current-icon-editing').removeClass('current-icon-editing');
$(this).closest('.browse-icon').addClass('current-icon-editing');
$('.mfn-modal.modal-select-icon .mfn-items-list li').removeClass('active');
$('.mfn-modal.modal-select-icon').addClass('show');
$('.modal-select-icon.show .modalbox-search .mfn-search').focus();
});
sliderInput = {
init: function($slider) {
var max = false;
var min = false;
$slider.addClass('mfn-initialized');
var $editbox = $slider.closest('.mfn-form-row');
var $inputgroup = $slider.closest('.form-group');
var it = $editbox.closest('.mfn-element-fields-wrapper').attr('data-element');
var $hidden = $inputgroup.find('input.mfn-slider-hidden-input');
var $input = $inputgroup.find('input.mfn-sliderbar-value');
var css_path = $editbox.attr('data-csspath');
var css_style = $editbox.attr('data-name');
if($editbox.hasClass('backdrop-filter') || $editbox.hasClass('filter')) {
css_path = $editbox.closest('.inline-style-input').attr('data-csspath');
css_style = $editbox.closest('.inline-style-input').attr('data-name');
}
min = $input.attr('min');
max = $input.attr('max');
var step = $input.attr('data-step');
//var unit = typeof $input.attr('data-unit') !== 'undefined' ? $input.attr('data-unit') : "";
var unit = $editbox.find('.mfn-slider-unit li.active').length ? $editbox.find('.mfn-slider-unit li.active a').text() : $input.attr('data-unit');
var value = $input.val() != '' ? $input.val() : 0;
if( $inputgroup.find('.mfn-slider-unit').length ){
min = $inputgroup.find('.mfn-slider-unit li.active').attr('data-min');
max = $inputgroup.find('.mfn-slider-unit li.active').attr('data-max');
step = $inputgroup.find('.mfn-slider-unit li.active').attr('data-step');
unit = $inputgroup.find('.mfn-slider-unit li.active a').text();
}
if( value != '' && max && parseInt(value) > parseInt(max) ){
value = max;
$input.val(max);
$hidden.val( max+unit ).trigger('change');
}
$slider.slider({
range: parseFloat(min),
min: parseFloat(min),
max: parseFloat(max),
step: parseFloat(step),
value: value,
start: function( event, ui ) {
$('.sidebar-wrapper').addClass('mfn-vb-sidebar-overlay');
// reset custom media queries
if( $editbox.hasClass('show_under_custom') ){
$editpanel.find('.mfn-element-fields-wrapper .hide_under_custom input').val('').trigger('change');
}else if( $editbox.hasClass('hide_under_custom') ){
$editpanel.find('.mfn-element-fields-wrapper .show_under_custom input').val('').trigger('change');
}
sidebar_form.no_render = true;
},
slide: function(event, ui) {
$input.val( ui.value );
let value = ui.value;
// instant transform effect
if( $(ui.handle).closest('.transform_field').length ){
$input.trigger('change');
}else if($editbox.hasClass('themeoption grid-width')){
if( $content.find('style#themeoptiongrid-width').length ){
$content.find('style#themeoptiongrid-width').html('@media only screen and (min-width: 1240px){.section_wrapper, .container{max-width: '+ui.value+'px; }}');
}else{
$content.find('body').append('<style id="themeoptiongrid-width">@media only screen and (min-width: 1240px){.section_wrapper, .container{max-width: '+ui.value+'px; }}</style>');
}
}else if($editbox.hasClass('filter')){
// Set CSS filters in real time
var filter = '';
$editbox.closest('.css_filters_form').find('.mfn-sliderbar-value').each(function() {
var filter_key = $(this).attr('data-key');
var unit = $(this).attr('data-unit');
if( $(this).val().length && $(this).val() != '0' ){
filter += filter_key+'('+$(this).val()+unit+') ';
$content.find(css_path.replaceAll('mfnuidelement', edited_item.uid)).attr('style', 'filter: ' + filter);
}
});
}else if($editbox.hasClass('backdrop-filter')){
// Set CSS filters in real time
var backdrop = '';
$editbox.closest('.backdrop_filters_form').find('.mfn-sliderbar-value').each(function() {
var filter_key = $(this).attr('data-key');
var unit = $(this).attr('data-unit');
if( $(this).val().length && $(this).val() != '0' ){
backdrop += filter_key+'('+$(this).val()+unit+') ';
$content.find(css_path.replaceAll('mfnuidelement', edited_item.uid)).attr('style', 'backdrop-filter: ' + backdrop);
}
});
}else if($editbox.hasClass('gradient')){
gradientValue($editbox, true);
}else if( typeof css_path !== 'undefined' ) {
if( css_path.includes(',') ){
var css_arr = css_path.split(',');
css_arr.map(function(c) {
MfnVbApp.changeInlineStyles(c, css_style, ui.value+unit);
});
}else{
//console.log(css_path +' / '+css_style+' / '+ui.value);
MfnVbApp.changeInlineStyles(css_path, css_style, ui.value+unit);
}
}else{
$input.trigger('change');
}
if( typeof $input.attr('data-pointobj') !== 'undefined' && $content.find('.'+it+' .mfn-hotspot-style-line .hotspot-image').length ){
var c_id = $content.find('.'+it+' .mfn-hotspot-style-line .hotspot-image').attr('id').replace('wrapper', '');
mfn_hotspots_field.refresh(c_id, $input);
}
},
stop: function(event, ui) {
sidebar_form.no_render = false;
$input.val( ui.value ).trigger('change');
if( typeof css_path !== 'undefined' && css_style !== 'transform' && !css_path.includes(',')){
setTimeout(function() { changeInlineStyles(css_path.replaceAll('|hover', '').replaceAll('|before', '').replaceAll('|after', ''), css_style, 'remove'); }, 50);
}else if( typeof css_path !== 'undefined' && css_path.includes(',') ) {
var css_arr = css_path.split(',');
setTimeout(function() {
css_arr.map(function(c) {
MfnVbApp.changeInlineStyles(c.replace('|', ':'), css_style, 'remove');
});
}, 50);
}
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
}
});
},
unitChange: function() {
$editpanel.on('click', 'ul.mfn-slider-unit li a', function(e) {
e.preventDefault();
var $li = $(this).closest('li');
var $editbox = $li.closest('.mfn-form-row');
var $slider = $editbox.find('.sliderbar');
if(!$li.hasClass('active')){
$li.siblings().removeClass('active');
$li.addClass('active');
$editbox.find('input.mfn-sliderbar-value').attr('min', $li.attr('data-min')).attr('max', $li.attr('data-max')).attr('step', $li.attr('data-step'));
if($editbox.find('.mfn-sliderbar-value').val().length) $editbox.find('.mfn-sliderbar-value').trigger('change');
sliderInput.destroy($slider);
}
});
},
customValue: function() {
$editpanel.on('change', '.mfn-sliderbar-value', function() {
var $editbox = $(this).closest('.form-group');
var $editwrapper = $(this).closest('.mfn-form-row');
var value = $(this).val();
var max = false;
var min = false;
min = $(this).attr('min');
max = $(this).attr('max');
if( $editbox.find('.mfn-slider-unit').length ){
min = $editbox.find('.mfn-slider-unit li.active').attr('data-min');
max = $editbox.find('.mfn-slider-unit li.active').attr('data-max');
if( value != '' && max && parseInt(value) > parseInt(max) ){
value = max;
$(this).val(max);
}
}else{
min = $(this).attr('min');
max = $(this).attr('max');
if( value != '' && max && parseInt(value) > parseInt(max) ){
value = max;
$(this).val(max);
}
}
$editbox.find('.sliderbar').slider( "value", value );
if( !$(this).hasClass('mfn-gradient-field') ) {
var $hidden = $editbox.find('input.mfn-slider-hidden-input');
var unit = $editbox.find('.mfn-slider-unit li.active').length ? $editbox.find('.mfn-slider-unit li.active a').text() : $(this).attr('data-unit');
if( value != '' ){
if( typeof unit !== 'undefined' ){ value = value+unit; }
if( typeof $editwrapper.attr('data-style-prefix') !== 'undefined' ){
$hidden.val( $editwrapper.attr('data-style-prefix')+value).trigger('change');
}else{
$hidden.val( value ).trigger('change');
}
}else{
$hidden.val( '' ).trigger('change');
}
}
// Set CSS filters in real time
if( $editwrapper.hasClass('filter') ){
var filter = '';
$editbox.closest('.css_filters_form').find('.mfn-sliderbar-value').each(function() {
var filter_key = $(this).attr('data-key');
var unit = $(this).attr('data-unit');
if( $(this).val().length && $(this).val() != '0' ){
filter += filter_key+'('+$(this).val()+unit+') ';
}
});
$editbox.closest('.css_filters_form').find('.mfn-field-value').val(filter).trigger('change');
}else if( $editwrapper.hasClass('backdrop-filter') ){
var backdrop = '';
$editbox.closest('.backdrop_filters_form').find('.mfn-sliderbar-value').each(function() {
var filter_key = $(this).attr('data-key');
var unit = $(this).attr('data-unit');
if( $(this).val().length && $(this).val() != '0' ){
backdrop += filter_key+'('+$(this).val()+unit+') ';
}
});
$editbox.closest('.backdrop_filters_form').find('.mfn-field-value').val(backdrop).trigger('change');
}
if( $editwrapper.hasClass('query_item_default_width') ){
iframe.window.jQuery('body').trigger('resize');
//console.log('stop sliderbar');
}
});
},
destroy: function($slider) {
$slider.slider( "destroy" );
sliderInput.init( $slider );
}
}
function gradientValue($editbox, tmp = false){
var $hidden = $editbox.closest('.gradient-form').find('.mfn-field-value');
var type = $editbox.closest('.gradient-form').find('.gradient-type').val();
var color = $editbox.closest('.gradient-form').find('.gradient-color').val();
var location = $editbox.closest('.gradient-form').find('.location .mfn-sliderbar-value').val();
var color2 = $editbox.closest('.gradient-form').find('.gradient-color2').val();
var location2 = $editbox.closest('.gradient-form').find('.location2 .mfn-sliderbar-value').val();
var position = $editbox.closest('.gradient-form').find('.gradient-position').val();
var angle = $editbox.closest('.gradient-form').find('.angle .mfn-sliderbar-value').val();
var val = '';
if( !location.length ) $editbox.closest('.gradient-form').find('.location .mfn-sliderbar-value').val('0').trigger('change');
if( !location2.length ) $editbox.closest('.gradient-form').find('.location2 .mfn-sliderbar-value').val('100').trigger('change');
if( !angle.length ) $editbox.closest('.gradient-form').find('.angle .mfn-sliderbar-value').val('0').trigger('change');
if( type.length && color.length && location.length && (angle.length || position.length) && color2.length && location2.length ){
val += type+'(';
if( type == 'linear-gradient' ){
val += angle+'deg, ';
}else{
val += 'at '+position+', ';
}
val += color2+' ';
val += location+'%, ';
val += color+' ';
val += location2+'%)';
}
if( !tmp ){
$hidden.val( val ).trigger('change');
}
}
var dynamicItems = {
init: function() {
$editpanel.on('change', '.dynamic_items_wrapper .di-input-rule select', function() {
var val = $(this).val();
$(this).parent().siblings('.di-input-wrapper').removeClass('di-input-active');
$(this).parent().siblings('.di-if-'+val).addClass('di-input-active');
});
$editpanel.on('click', '.dynamic_items_wrapper .dynamic_items_add', function(e) {
e.preventDefault();
alert('soon');
});
$editpanel.on('click', '.dynamic_items_wrapper .di-remove', function(e) {
e.preventDefault();
var attr_uid = $(this).closest('li').attr('data-uid');
var it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
$content.find('.'+it+' .payment-methods-list li.uid-'+attr_uid).remove();
$(this).closest('li').remove();
edited_item.attr.dynamic_items = edited_item.attr.dynamic_items.filter( (item) => item.uid != attr_uid );
historyStorage.add();
});
$editpanel.on('click', '.dynamic_items_wrapper .di-show-modal', function(e) {
var id = $(this).attr('data-modal');
$('#'+id).addClass('show');
});
$editpanel.on('click', '.mfn-modal-payments ul.mfn-items-list li a', function(e) {
e.preventDefault();
var url = $(this).find('img').attr('src');
var title = $(this).find('.titleicon').text();
dynamicItems.addNew(url, title);
$('.mfn-modal-payments.show').removeClass('show');
});
$editpanel.on('mouseenter', '.dynamic_items_wrapper .dynamic_items_preview', function(e) {
if( !$(this).hasClass('sortable-init') ){
dynamicItems.sortable();
}
});
},
addNew: function(url, id = false) {
var name = $editpanel.find('.dynamic_items_wrapper').attr('data-name');
var it = $editpanel.find('.mfn-element-fields-wrapper').attr('data-element');
var new_obj = {};
var order = $('.dynamic_items_wrapper .dynamic_items_preview li').length;
if( typeof edited_item['attr'][name] == 'undefined' ){
edited_item['attr'][name] = [];
}
var new_uid = getUid();
new_obj['url'] = url;
if( id ) new_obj['id'] = id;
new_obj['uid'] = new_uid;
if( $editpanel.find('.dynamic_items_wrapper .di-input-rule select').length ){
new_obj['type'] = $editpanel.find('.dynamic_items_wrapper .di-input-rule select').val();
}
edited_item['attr'][name].push(new_obj);
$('.dynamic_items_wrapper .dynamic_items_preview').append('<li data-uid="'+new_uid+'" class="uid-'+new_uid+'"><img src="'+url+'" alt=""><a class="mfn-option-btn mfn-button-delete di-remove" data-tooltip="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a></li>');
if( $content.find('.'+it+' .payment-methods-list:not(.empty)').length ){
$content.find('.'+it+' .payment-methods-list').append('<li data-uid="'+new_uid+'" class="uid-'+new_uid+'"><img src="'+url+'" alt=""></li>');
}else{
setTimeout(re_render, 100);
}
historyStorage.add();
},
sortable: function() {
$('.dynamic_items_wrapper .dynamic_items_preview').addClass('sortable-init');
$('.dynamic_items_wrapper .dynamic_items_preview').sortable({
update: function(e, ui) {
var new_arr = [];
$('.dynamic_items_wrapper .dynamic_items_preview li').each(function(i) {
new_arr.push( edited_item.attr.dynamic_items.filter( (item) => item.uid == $(this).attr('data-uid') )[0] );
});
edited_item.attr.dynamic_items = new_arr;
setTimeout(re_render, 100);
}
});
}
}
var select2Field = {
init: function() {
$editpanel.on('click', '.mfn-select2-wrapper .mfn-select2-options li ul li', function() {
select2Field.add($(this));
});
$editpanel.on('keyup focus paste', '.mfn-select2-wrapper .mfn-select2-input', function() {
select2Field.search($(this));
});
},
add: function( $li ) {
var id = $li.attr('data-id');
var label = $li.html().replaceAll(' ', '');
$li.siblings('li').removeClass('selected');
$li.addClass('selected');
let obj = {'id':id,'label':label};
$li.closest('.mfn-select2-wrapper').find('.form-control .mfn-select2-input').attr('data-selected', JSON.stringify(obj)).val(label).trigger('change');
},
search: function($field) {
select2Field.exit();
var val = $field.val().toLowerCase();
var $wrapper = $field.closest('.mfn-select2-wrapper');
var data_get = $wrapper.find('.mfn-select2-input').attr('data-get');
if( $wrapper.hasClass('mfn-select2-loading') ) return;
$wrapper.addClass('mfn-select2-loading');
if( !$wrapper.hasClass('mfn-select2-focus') ) {
$('.sidebar-wrapper').addClass('mfn-vb-sidebar-overlay');
$wrapper.addClass('mfn-select2-focus');
}
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfn_select2field_get',
'mfn-builder-nonce': wpnonce,
type: data_get,
search: val
},
type: 'POST',
success: function(response){
if( mfn.is_woocommerce && ( mfn.builder_type == 'single-product' || mfn.post_type == "product" ) && $field.attr('data-get') == 'products' ){
response.product.options.push( {id: 'current-id', title: 'Current product'} );
}
if( $field.attr('data-get') == 'taxonomies' ){
if(mfn.is_woocommerce) response.product_cat.options.push( {id: 'parent_taxonomy', title: 'Parent category'}, {id: 'any_taxonomy', title: 'Any category'} );
response.category.options.push( {id: 'parent_taxonomy', title: 'Parent category'}, {id: 'any_taxonomy', title: 'Any category'} );
}
$wrapper.removeClass('mfn-select2-loading');
$wrapper.find('.mfn-select2-options').html(select2Field.display(response));
if( typeof $field.attr('data-selected') !== 'undefined' ){
var obj = JSON.parse($field.attr('data-selected'));
$wrapper.find('.mfn-select2-options li[data-id="'+obj.id+'"]').addClass('selected');
}
$(document).bind('click', select2Field.blur);
}
});
},
display: function(obj) {
let html = '';
_.map( obj, function(opt, o) {
if( opt.options.length ){
html += `<li class="mfn-select-2-list-group"><span>${opt.label}</span><ul>`;
_.map( opt.options, function(val, v) {
html += `<li data-id="${val.id}">${val.title}</li>`;
});
html += `</ul></li>`;
}
});
return html;
},
blur: function(e) {
var div = $('.mfn-select2-wrapper');
if(!div.is(e.target)) {
select2Field.exit();
}
},
exit: function() {
$('.mfn-select2-wrapper.mfn-select2-focus .mfn-select2-options').empty();
$('.mfn-select2-wrapper.mfn-select2-focus').removeClass('mfn-select2-focus');
$('.mfn-select2-wrapper.mfn-select2-loading').removeClass('mfn-select2-loading');
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
$(document).unbind('click', select2Field.blur);
}
}
select2Field.init();
var multiSelectField = {
init: function() {
$editpanel.on('focus', '.mfn-multiselect-field-wrapper .form-control .mfn-multiselect-input', function(e) {
e.preventDefault();
$(this).closest('.mfn-multiselect-field-wrapper').addClass('mfn-msf-focus');
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
$(document).bind('click', multiSelectField.blur);
})/*.on('blur', '.mfn-multiselect-field-wrapper .form-control .mfn-multiselect-input', function(e) {
$(this).closest('.mfn-multiselect-field-wrapper').removeClass('mfn-msf-focus');
})*/;
$editpanel.on('click', '.mfn-multiselect-field-wrapper .mfn-multiselect-options li:not(.selected)', function() {
//e.preventDefault();
multiSelectField.add($(this));
$('.mfn-ui .mfn-form .form-group.mfn-multiselect-field-wrapper .form-control .mfn-multiselect-input').val('').trigger('keyup');
});
$editpanel.on('click', '.mfn-ui .mfn-form .form-group.mfn-multiselect-field-wrapper .form-control span', function(e) {
e.preventDefault();
multiSelectField.remove($(this));
});
$editpanel.on('keyup paste change', '.mfn-ui .mfn-form .form-group.mfn-multiselect-field-wrapper .form-control .mfn-multiselect-input', function() {
multiSelectField.search($(this));
});
},
add: function( $li ) {
var id = $li.attr('data-id');
var label = $li.html().replaceAll(' ', '');
$li.addClass('selected');
$li.closest('.mfn-multiselect-field-wrapper').find('.form-control input').before('<span data-id="'+id+'">✕ '+label+'</span>');
var name = $li.closest('.mfn-form-row').attr('data-id');
//delete(edited_item.attr[name]);
if( typeof edited_item.attr[name] === 'object' ){
edited_item.attr[name].push( { key: id, value: label} );
}else{
edited_item.attr[name] = [];
edited_item.attr[name].push( { key: id, value: label} );
}
},
remove: function( $span ) {
var id = $span.attr('data-id');
var name = $span.closest('.mfn-form-row').attr('data-id');
if( typeof edited_item.attr[name] === 'object' ) {
if( edited_item.attr[name].filter( (item) => item.key == id ).length ) {
edited_item.attr[name] = edited_item.attr[name].filter( (item) => item.key != id );
}
}
// re_render(edited_item.uid);
multiSelectField.refresh();
$span.closest('.mfn-multiselect-field-wrapper').find('.mfn-multiselect-options li[data-id="'+id+'"]').removeClass('selected');
$span.remove();
},
search: function($field) {
var val = $field.val().toLowerCase();
var $wrapper = $field.closest('.mfn-multiselect-field-wrapper');
if( val.length ){
if( val.length > 1 ){
$wrapper.addClass('mfn-ms-searching');
$wrapper.find('.mfn-multiselect-options li').hide();
$wrapper.find('.mfn-multiselect-options li[data-name*="'+val+'"]').show();
}else{
$wrapper.removeClass('mfn-ms-searching');
$wrapper.find('.mfn-multiselect-options li').removeAttr('style');
}
}else{
$wrapper.removeClass('mfn-ms-searching');
$wrapper.find('.mfn-multiselect-options li').removeAttr('style');
}
},
blur: function(e) {
var div = $('.mfn-multiselect-field-wrapper.mfn-msf-focus');
if (!div.is(e.target) && div.has(e.target).length === 0){
// re_render(edited_item.uid);
multiSelectField.refresh();
$('.mfn-multiselect-field-wrapper.mfn-msf-focus input').val('');
$('.mfn-multiselect-field-wrapper.mfn-msf-focus').removeClass('mfn-msf-focus');
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
$(document).unbind('click', multiSelectField.blur);
}
},
refresh: function() {
if( $builder.find('.vb-item[data-uid="'+edited_item.uid+'"]').hasClass('mcb-wrap') ){
re_render($builder.find('.vb-item[data-uid="'+edited_item.uid+'"]').closest('.mcb-section').attr('data-uid'));
}else{
re_render(edited_item.uid);
}
}
}
multiSelectField.init();
var multiTextField = {
init: function() {
$editpanel.on('click', '.sidebar-add .sidebar-add-button', function(e) {
e.preventDefault();
var $form = $(this).closest('.form-group'),
$clone = $('li.default', $form).clone(true),
li_length = $('.added-sidebars ul li:not(.default)', $form).length;
var val = $('.mfn-form-input', $form).val();
if( ! val ){
return false;
}
$('.added-sidebars ul', $form).append( $clone );
// $clone = $('.added-sidebars ul li:last-child', $form);
$clone.removeClass('default')
.hide().fadeIn(200);
$clone.find('input').val( val )
.attr('name', 'sidebars['+li_length+']' )
.attr('data-key', li_length )
.removeAttr('data-name').trigger('change');
$clone.find('.sidebar-title').text( val );
$('.mfn-form-input', $form).val('');
$form.removeClass('empty');
});
$editpanel.on('click', '.sidebar-add .added-sidebars .mfn-btn-delete', function(e) {
e.preventDefault();
var $form = $(this).closest('.form-group');
var key = $(this).siblings('input').attr('data-key');
var name = $(this).closest('.mfn-form-row').attr('data-name');
var $input = $(this).siblings('input');
if( typeof mfnDbLists.themeoptions[name][key] !== undefined ) delete(mfnDbLists.themeoptions[name][key]);
$(this).parent().fadeOut( 200, function() {
$input.val('').trigger('change');
$(this).remove();
if( 1 >= $('.added-sidebars ul li', $form).length ){
$form.addClass('empty');
}
});
});
}
}
multiTextField.init();
dynamicItems.init();
var tabsField = {
init: function() {
$editpanel.on('click', '.tabs .mfn-button-add', function(e) {
e.preventDefault();
var group = $(this).closest('.mfn-element-fields-wrapper').attr('data-group');
var $form = $(this).closest('.form-group'),
$clone = $('li.default', $form).clone(true);
$clone.removeClass('default').addClass('show');
$('.tabs-wrapper', $form).append( $clone );
var new_obj = {};
$clone.find('.field-to-object').each(function(){
$(this).attr('name', $(this).data('default') ).removeAttr('data-default');
new_obj[ $(this).attr('data-label') ] = $(this).val();
});
if( typeof edited_item.attr.tabs !== 'undefined' ){
edited_item.attr.tabs.push(new_obj);
}else{
edited_item.attr.tabs = [];
edited_item.attr.tabs.push(new_obj);
}
$clone.siblings().removeClass('show');
$clone.hide().fadeIn(200);
tabsField.reorder();
re_render(edited_item.uid);
});
$editpanel.on('click', '.tabs .mfn-tab-delete', function(e) {
e.preventDefault();
var group = $(this).closest('.mfn-element-fields-wrapper').attr('data-group');
$(this).closest('.tab').fadeOut( 200, function() {
$(this).remove();
tabsField.reorder();
setTimeout(re_render(edited_item.uid), 1000);
});
});
$editpanel.on('click', '.tabs .mfn-tab-clone', function(e) {
e.preventDefault();
var group = $(this).closest('.mfn-element-fields-wrapper').attr('data-group');
var $tab = $(this).closest('.tab'),
$clone = $tab.clone(true);
$tab.removeClass('show').after( $clone );
$clone.hide().fadeIn(200);
tabsField.reorder();
setTimeout(re_render(edited_item.uid), 1000);
});
$editpanel.on('click', '.tabs .mfn-tab-toggle', function(e) {
e.preventDefault();
var $tab = $(this).closest('.tab');
$tab.toggleClass('show')
.siblings().removeClass('show');
});
$editpanel.on('change', '.tabs .js-title', function(e) {
e.preventDefault();
var $tab = $(this).closest('.tab');
var val = $(this).val();
// temporary, second child instead of 'secondary' index
if(!val.length){
val = $tab.find('.form-control:nth-child(2) input').val();
$('.tab-header .title', $tab).text(val);
}
$('.tab-header .title', $tab).text(val);
});
},
sortable: function() {
$('.panel-edit-item .tabs-wrapper:not(.mfn-initialized)').each(function() {
$(this).addClass('mfn-initialized');
var $editbox = $(this).closest('.mfn-form-row');
var group = $(this).closest('.mfn-element-fields-wrapper').attr('data-group');
$(this).sortable({
axis: 'y',
cursor: 'ns-resize',
handle: '.tab-header',
opacity: 0.9,
update: function(e, ui) {
if($editbox.hasClass('order')) {
var $input = $editbox.find('input.mfn-field-value');
var value = [];
$('.panel-edit-item .order .tabs-wrapper li').each(function(){
value.push( $(this).text().toLowerCase() );
});
$input.val( value.join(',') ).trigger('change');
}else{
tabsField.reorder();
setTimeout(re_render(edited_item.uid), 500);
}
}
});
});
},
reorder: function() {
edited_item.attr.tabs = [];
$('.panel-edit-item .mfn-form ul.tabs-wrapper li.tab:not(.default)').each(function(i) {
var new_obj = {};
$(this).find('.field-to-object').each(function() {
var $input = $(this);
var old_name = $input.attr('name');
var patt_tabs = /tabs\[([0-9]|[0-9][0-9])\]/g;
var new_attr_name = old_name.replace(patt_tabs, 'tabs['+i+']');
$input.attr( 'name', new_attr_name );
$input.attr( 'data-order', i );
new_obj[ $input.attr('data-label') ] = $input.val();
});
edited_item.attr.tabs.push(new_obj);
});
}
}
tabsField.init();
// contact box address
$editpanel.on('keyup paste change', '.contact_box.address .preview-addressinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( isBlocks() ){
$content.find('.'+it+' .item-preview-content ').text(val);
} else if(val.length){
if($content.find('.'+it+' .get_in_touch_wrapper ul li.address .address_wrapper').length){
$content.find('.'+it+' .get_in_touch_wrapper ul li.address .address_wrapper').html(val);
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul').append('<li data-sort="1" class="address"><span class="icon"><i class="icon-location"></i></span><span class="address_wrapper">'+val+'</span></li>');
}
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul li.address').remove();
}
});
// header search placeholder
$editpanel.on('keyup paste change', '.panel-edit-item .header_search.placeholder .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
$content.find('.'+it+' .search_wrapper input.field').attr('placeholder', val);
});
// contact box phone
$editpanel.on('keyup paste change', '.contact_box.telephone .preview-telephoneinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .get_in_touch_wrapper ul li.phone.phone-1 p a').length){
$content.find('.'+it+' .get_in_touch_wrapper ul li.phone.phone-1 p a').html(val);
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul').append('<li data-sort="2" class="phone phone-1"><span class="icon"><i class="icon-phone"></i></span><p><a href="tel:'+val+'">'+val+'</a></p></li>');
}
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul li.phone.phone-1').remove();
}
});
// contact box phone 2
$editpanel.on('keyup paste change', '.contact_box.telephone_2 .preview-telephone_2input', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .get_in_touch_wrapper ul li.phone.phone-2 p a').length){
$content.find('.'+it+' .get_in_touch_wrapper ul li.phone.phone-2 p a').html(val);
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul').append('<li data-sort="3" class="phone phone-2"><span class="icon"><i class="icon-phone"></i></span><p><a href="tel:'+val+'">'+val+'</a></p></li>');
}
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul li.phone.phone-2').remove();
}
});
// contact box fax
$editpanel.on('keyup paste change', '.contact_box.fax .preview-faxinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .get_in_touch_wrapper ul li.phone.fax p a').length){
$content.find('.'+it+' .get_in_touch_wrapper ul li.phone.fax p a').html(val);
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul').append('<li data-sort="4" class="phone fax"><span class="icon"><i class="icon-print"></i></span><p><a href="fax:'+val+'">'+val+'</a></p></li>');
}
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul li.phone.fax').remove();
}
});
// contact box email
$editpanel.on('keyup paste change', '.contact_box.email .preview-emailinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .get_in_touch_wrapper ul li.mail p a').length){
$content.find('.'+it+' .get_in_touch_wrapper ul li.mail p a').html(val);
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul').append('<li data-sort="5" class="mail"><span class="icon"><i class="icon-mail"></i></span><p><a href="mailto:'+val+'">'+val+'</a></p></li>');
}
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul li.mail').remove();
}
});
// breadcrumbs separator
$editpanel.on('keyup paste change', '.breadcrumbs.separator .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
$content.find('.'+it+' .breadcrumbs li .mfn-breadcrumbs-separator').html(val);
}else{
$content.find('.'+it+' .breadcrumbs li .mfn-breadcrumbs-separator').html('<i class="icon-right-open"></i>');
}
});
$editpanel.on('keyup paste change', '.cart_table.update_cart_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
$content.find('.'+it+' .button[name="update_cart"]').html(val);
}else{
$content.find('.'+it+' .button[name="update_cart"]').html($(this).attr('placeholder'));
}
});
$editpanel.on('keyup paste change', '.cart_table.apply_coupon_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
$content.find('.'+it+' .coupon .button').html(val);
}else{
$content.find('.'+it+' .coupon .button').html($(this).attr('placeholder'));
}
});
$editpanel.on('keyup paste change', '.cart_table.coupon_code_placeholder .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
$content.find('.'+it+' .coupon .input-text').attr('placeholder', val);
}else{
$content.find('.'+it+' .coupon .input-text').attr('placeholder', $(this).attr('placeholder'));
}
});
$editpanel.on('keyup paste change', '.cart_totals.proceed_checkout_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
$content.find('.'+it+' .wc-forward').html(val);
}else{
$content.find('.'+it+' .wc-forward').html($(this).attr('placeholder'));
}
});
$editpanel.on('keyup paste change', '.cart_totals.continue_shopping_string .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
$content.find('.'+it+' .mfn-woo-cart-link').html(val);
}else{
$content.find('.'+it+' .mfn-woo-cart-link').html($(this).attr('placeholder'));
}
});
$editpanel.on('keyup paste change', '.share.facebook_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
if( !$content.find('.'+it+' .mfn-share-post-facebook .mfn-share-post-button-label').length ) $content.find('.'+it+' .mfn-share-post-facebook').append('<span class="mfn-share-post-button-label"></span>');
$content.find('.'+it+' .mfn-share-post-facebook .mfn-share-post-button-label').html(val);
}else{
$content.find('.'+it+' .mfn-share-post-facebook .mfn-share-post-button-label').remove();
}
});
$editpanel.on('keyup paste change', '.share.twitter_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
if( !$content.find('.'+it+' .mfn-share-post-twitter .mfn-share-post-button-label').length ) $content.find('.'+it+' .mfn-share-post-twitter').append('<span class="mfn-share-post-button-label"></span>');
$content.find('.'+it+' .mfn-share-post-twitter .mfn-share-post-button-label').html(val);
}else{
$content.find('.'+it+' .mfn-share-post-twitter .mfn-share-post-button-label').remove();
}
});
$editpanel.on('keyup paste change', '.share.linkedin_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
if( !$content.find('.'+it+' .mfn-share-post-linkedin .mfn-share-post-button-label').length ) $content.find('.'+it+' .mfn-share-post-linkedin').append('<span class="mfn-share-post-button-label"></span>');
$content.find('.'+it+' .mfn-share-post-linkedin .mfn-share-post-button-label').html(val);
}else{
$content.find('.'+it+' .mfn-share-post-linkedin .mfn-share-post-button-label').remove();
}
});
$editpanel.on('keyup paste change', '.share.copy_link_label .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( val.length ){
if( !$content.find('.'+it+' .mfn-share-post-copy-link .mfn-share-post-button-label').length ) $content.find('.'+it+' .mfn-share-post-copy-link').append('<span class="mfn-share-post-button-label"></span>');
$content.find('.'+it+' .mfn-share-post-copy-link .mfn-share-post-button-label').html(val);
}else{
$content.find('.'+it+' .mfn-share-post-copy-link .mfn-share-post-button-label').remove();
}
});
// contact box www
$editpanel.on('keyup paste change', '.contact_box.www .preview-wwwinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .get_in_touch_wrapper ul li.www p a').length){
$content.find('.'+it+' .get_in_touch_wrapper ul li.www p a').html(val);
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul').append('<li data-sort="6" class="www"><span class="icon"><i class="icon-link"></i></span><p><a target="_blank" href="https://'+val+'">'+val+'</a></p></li>');
}
}else{
$content.find('.'+it+' .get_in_touch_wrapper ul li.www').remove();
}
});
// call to action button
$editpanel.on('keyup paste change', '.preview-button_titleinput', function() {
let val = $(this).val();
let icon = $(this).closest('.mfn-element-fields-wrapper').find('.preview-iconinput').val();
if($edited_div.hasClass('column_call_to_action')){
// call to action button
if( val ){
if( icon.length ){
$edited_div.find('.call_center').html('<a href="#" class="button has-icon "><span class="button_icon"><i class="'+$('.mfn-element-fields-wrapper .preview-iconinput').val()+'"></i></span><span class="button_label">'+val+'</span></a>');
}else{
$edited_div.find('.call_center').html('<a href="#" class="button"><span class="button_label">'+val+'</span></a>');
}
}else{
$edited_div.find('.call_center').html('<span class="icon_wrapper"><i class="'+$('.mfn-element-fields-wrapper .preview-iconinput').val()+'"></i></span>');
}
}
});
// helper title 1
$editpanel.on('keyup paste change', '.helper.title1 .preview-title1input', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($content.find('.'+it+' .links .link-1').length){
$content.find('.'+it+' .links .link-1').html(val);
}else{
$content.find('.'+it+' .links').prepend('<a class="link link-1 toggle" href="#" data-rel="1">'+val+'</a>');
}
});
// helper title 2
$editpanel.on('keyup paste change', '.helper.title2 .preview-title2input', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($content.find('.'+it+' .links .link-2').length){
$content.find('.'+it+' .links .link-2').html(val);
}else{
$content.find('.'+it+' .links').append('<a class="link link-2 toggle" href="#" data-rel="2">'+val+'</a>');
}
});
// universal txt edit function
function fieldUpdate($field){
let $box = $field.closest('.mfn-form-row');
let rare_tag = $box.attr('data-edittag');
let tag = rare_tag.replace(' | ', ' ');
let tag_wrapper = rare_tag.split(' | ')[0];
let tag_el = rare_tag.split(' | ')[1];
let tag_child = $box.attr('data-edittagchild');
let tag_pos = $box.attr('data-tagposition');
let tag_var = $box.attr('data-edittagvar');
let it = '.'+$box.closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $field.val();
if(tag_el.includes('.')){
var tag_el_ex = tag_el.split('.');
if( $('.panel-edit-item .'+tag_var+' .active input').length ){
tag = tag_wrapper + ' ' +$('.panel-edit-item .'+tag_var+' .active input').val()+'.'+tag_el_ex[1];
}else if(tag_el_ex[0]){
tag = tag_wrapper + ' ' +tag_el_ex[0]+'.'+tag_el_ex[1];
}
}else if( tag_child ){
tag = tag+' '+tag_child;
}
// console.log('# fieldUpdate');
if( isBlocks() ){
if( 'title' == $box.attr('data-id') ){
tag = '.item-preview-title';
} else if( 'content' == $box.attr('data-id') ) {
tag = '.item-preview-content';
} else if( 'subtitle' == $box.attr('data-id') ) {
tag = '.item-preview-subtitle';
} else if( 'slogan' == $box.attr('data-id') ) {
tag = '.item-preview-subtitle';
} else if( 'price' == $box.attr('data-id') ) { // pricing item
tag = '.item-preview-number';
} else {
return;
// re_render();
}
}
if($content.find(it+' '+tag).length){
if( val == '' ){
if( edited_item.jsclass == 'cart_totals' || edited_item.jsclass == 'cart_cross_sells' ){
$content.find(it+' '+tag).html($field.attr('placeholder'));
}else{
$content.find(it+' '+tag).html('').hide();
}
return;
}else if( !$content.find(it+' '+tag).is(':visible') ){
$content.find(it+' '+tag).show().removeClass('empty');
}
if( $edited_div.hasClass('column_code') ){
$content.find(it+' '+tag).text(val);
}else{
$content.find(it+' '+tag).html(val);
}
}else{
if(tag_el.includes('.')){
var tag_el_ex = tag_el.split('.');
if( $('.panel-edit-item .'+tag_var+' .active input').length ){
var html = document.createElement( $('.panel-edit-item .'+tag_var+' .active input').val() );
}else if(tag_el_ex[0]){
var html = document.createElement( tag_el_ex[0] );
}else{
var html = document.createElement( 'h4' );
}
html.classList.add(tag_el_ex[1]);
}else{
var html = document.createElement(tag_el);
}
if( tag_child ){
var html_child = document.createElement(tag_child);
html_child.innerHTML = val;
html.appendChild(html_child);
}else{
html.innerHTML = val;
}
if( tag_pos.includes('|') ){
var tag_pos_exp = tag_pos.split(' | ');
if( tag_pos_exp[0] == 'before' ){
$content.find(it+' '+tag_pos_exp[1]).before( html );
}else{
$content.find(it+' '+tag_pos_exp[1]).after( html );
}
}else{
if( tag_pos == 'prepend' ){
$content.find(it+' '+tag_wrapper).prepend( html );
}else{
$content.find(it+' '+tag_wrapper).append( html );
}
}
}
}
function lottie_play(){
var it = $content.find('.mcb-item-'+edited_item.uid+' .lottie').attr('id');
var frame_start = $editpanel.find('.lottie.frame_start .mfn-field-value').val();
var frame_end = $editpanel.find('.lottie.frame_end .mfn-field-value').val();
var direction = $editpanel.find('.lottie.direction li.active input').val();
iframe.window['start'+it+'frame'] = Math.floor( (parseInt(frame_start)*iframe.window[it].animationData.op)/100 );
iframe.window['total'+it+'frames'] = Math.floor( (parseInt(frame_end)*iframe.window[it].animationData.op)/100 );
iframe.window['frames'+it] = [iframe.window['start'+it+'frame'], iframe.window['total'+it+'frames']];
iframe.window['frames'+it+'_reverse'] = [iframe.window['total'+it+'frames'], iframe.window['start'+it+'frame']];
if(direction == '-1') {
iframe.window[it].playSegments( iframe.window['frames'+it+'_reverse'], true);
}else{
iframe.window[it].playSegments( iframe.window['frames'+it], true);
}
}
// lottie start
$editpanel.on('change', '.lottie .mfn-field-value', function() {
var $editrow = $(this).closest('.mfn-form-row');
var val = $(this).val();
var it = $content.find('.mcb-item-'+edited_item.uid+' .lottie').attr('id');
var $trigger_field = $editpanel.find('.lottie.trigger .mfn-field-value');
var current_lottie = iframe.window[it];
if( $editrow.hasClass('speed') ){
if( $trigger_field.val() == 'scroll' ){
re_render();
}else{
iframe.window[it].setSpeed(val);
lottie_play();
}
}else if( $editrow.hasClass('trigger') && val == 'scroll' ){
$('.panel-edit-item .lottie.loop li:first-child a').trigger('click');
$('.panel-edit-item .lottie.direction li:first-child a').trigger('click');
}else if( $editrow.hasClass('frame_start') || $editrow.hasClass('frame_end') ){
if( $trigger_field.val() == 'scroll' ){
re_render();
}else{
lottie_play();
}
}else if( $editrow.hasClass('src') && val != '' ){
$editpanel.find('.lottie.file .browse-image .mfn-button-delete').trigger('click');
}else if( $editrow.hasClass('file') && val != '' ){
$editpanel.find('.lottie.src .mfn-field-value').val('');
}
});
// lottie end
$editpanel.on('keyup paste change', '.content-txt-edit .mfn-field-value', function() {
fieldUpdate($(this));
});
// re render
$editpanel.on('change', '.absolute-pos-watcher .mfn-field-value', function(){
var val = $(this).val();
if( val == 'absolute'){
$edited_div.addClass('mcb-column-absolute');
}else{
$edited_div.removeClass('mcb-column-absolute');
}
});
$editpanel.on('change', '.checkout.layout .mfn-field-value', function(){
var val = $(this).val();
var el = $builder.find('.mcb-item-'+edited_item.uid+' .mfn-checkout-wrapper');
el.removeClass('mfn-be-checkout mfn-be-checkout-default');
if( val.length ){
el.addClass('mfn-be-checkout-'+val);
}else{
el.addClass('mfn-be-checkout');
}
});
// read more line info
$editpanel.on('change', '.widget-button.button_function .mfn-field-value, .icon_box_2.link_type .mfn-field-value', function(){
var val = $(this).val();
var el = $builder.find('.mcb-item-'+edited_item.uid);
if( el.next('.mfn-read-more-line').length ) el.next('.mfn-read-more-line').remove();
if( val.length && val == 'mfn-read-more' ){
el.after('<span class="mfn-read-more-line"></span>');
}
});
$editpanel.on('change', '.preview-numberinput', function() {
// number
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( isBlocks() ){
if($content.find('.'+it+' .item-preview-number').length){
$content.find('.'+it+' .item-preview-number').text(val);
}
}else if($edited_div.hasClass('column_counter')){
// counter
if($content.find('.'+it+' .desc_wrapper .number').length){
$content.find('.'+it+' .desc_wrapper .number').text(val);
}else{
if($content.find('.'+it+' .desc_wrapper .number-wrapper').length){
$content.find('.'+it+' .desc_wrapper .number-wrapper').append('<span class="number" data-to="'+val+'">'+val+'</span>');
}else{
$content.find('.'+it+' .desc_wrapper').prepend('<div class="number-wrapper"><span class="number" data-to="'+val+'">'+val+'</span></div>');
}
}
}else if($edited_div.hasClass('column_how_it_works')){
// how it works
if($content.find('.'+it+' .number').length){
$content.find('.'+it+' .number').text(val);
}else{
$content.find('.'+it+' .image').html('<span class="number">'+val+'</span>');
}
}else if($edited_div.hasClass('column_quick_fact')){
// quick fact
if($content.find('.'+it+' .number-wrapper .number').length){
$content.find('.'+it+' .number-wrapper .number').attr('data-to', val).text(val);
}else{
$content.find('.'+it+' .quick_fact').prepend('<div class="number-wrapper"><span class="number" data-to="'+val+'">'+val+'</span></div>');
}
}
});
$editpanel.on('keyup paste change', '.preview-prefixinput', function() {
// prefix
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($edited_div.hasClass('column_counter')){
// counter
if($content.find('.'+it+' .desc_wrapper .label.prefix').length){
$content.find('.'+it+' .desc_wrapper .label.prefix').text(val);
}else{
if($content.find('.'+it+' .desc_wrapper .number-wrapper').length){
$content.find('.'+it+' .desc_wrapper .number-wrapper').prepend('<span class="label prefix">'+val+'</span>');
}else{
$content.find('.'+it+' .desc_wrapper').prepend('<div class="number-wrapper"><span class="label prefix">'+val+'</span></div>');
}
}
}else if($edited_div.hasClass('column_quick_fact')){
// quick fact prefix
if($content.find('.'+it+' .number-wrapper .prefix').length){
$content.find('.'+it+' .number-wrapper .prefix').text(val);
}else{
if($content.find('.'+it+' .number-wrapper').length){
$content.find('.'+it+' .number-wrapper').prepend('<span class="label prefix">'+val+'</span>');
}else{
$content.find('.'+it+' .desc_wrapper').prepend('<div class="number-wrapper"><span class="label prefix">'+val+'</span></div>');
}
}
}
});
$editpanel.on('keyup paste change', '.preview-labelinput', function() {
// postfix
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($edited_div.hasClass('column_counter')){
// counter
if($content.find('.'+it+' .desc_wrapper .label.postfix').length){
$content.find('.'+it+' .desc_wrapper .label.postfix').text(val);
}else{
if($content.find('.'+it+' .desc_wrapper .number-wrapper').length){
$content.find('.'+it+' .desc_wrapper .number-wrapper').append('<span class="label postfix">'+val+'</span>');
}else{
$content.find('.'+it+' .desc_wrapper').prepend('<div class="number-wrapper"><span class="label postfix">'+val+'</span></div>');
}
}
}else if($edited_div.hasClass('column_quick_fact')){
// quick fact postfix
if($content.find('.'+it+' .number-wrapper .label.postfix').length){
$content.find('.'+it+' .number-wrapper .label.postfix').text(val);
}else{
if($content.find('.'+it+' .number-wrapper').length){
$content.find('.'+it+' .number-wrapper').append('<span class="label postfix">'+val+'</span>');
}else{
$content.find('.'+it+' .desc_wrapper').prepend('<div class="number-wrapper"><span class="label postfix">'+val+'</span></div>');
}
}
}else if($edited_div.hasClass('column_chart')){
// chart
if(val.length){
if($content.find('.'+it+' .num').length){
$content.find('.'+it+' .num').text(val);
}else{
if( !$content.find('.'+it+' .chart > .image').length && !$content.find('.'+it+' .chart > .icon').length ){
$content.find('.'+it+' .chart').prepend('<div class="num">'+val+'</div>');
}else{
if(!$content.find('.'+it+' .chart .mfn_tmp_info').length){
$content.find('.'+it+' .chart').append('<span class="mfn_tmp_info">Picture and icon have higher priority. Delete them to see label.</span>');
setTimeout(function() {
$content.find('.mfn_tmp_info').remove();
}, 3000);
}
}
}
}else{
if( $('.panel-edit-item .mfn-form .preview-imageinput').val().length ){
if($content.find('.'+it+' .chart .image img').length){
$content.find('.'+it+' .chart .image img').attr('src', $('.panel-edit-item .mfn-form .preview-imageinput').val());
}else{
$content.find('.'+it+' .chart .num').remove();
$content.find('.'+it+' .chart .icon').remove();
$content.find('.'+it+' .chart').prepend('<div class="image"><img class="scale-with-grid" src="'+$('.panel-edit-item .mfn-form .preview-imageinput').val()+'" alt="" /></div>');
}
}else if( $('.panel-edit-item .mfn-form .preview-iconinput').val().length ){
if($content.find('.'+it+' .chart .icon i').length){
$content.find('.'+it+' .chart .icon i').attr('class', $('.panel-edit-item .mfn-form .preview-iconinput').val());
}else{
$content.find('.'+it+' .chart > .image').remove();
$content.find('.'+it+' .chart > .num').remove();
$content.find('.'+it+' .chart').prepend('<div class="icon"><i class="'+$('.panel-edit-item .mfn-form .preview-iconinput').val()+'"></i></div>');
}
}
}
}else if($edited_div.hasClass('column_icon_box_2')){
// icon box 2
if( $('.panel-edit-item .mfn-form .icon_box_2.image .mfn-field-value').val().length || $('.panel-edit-item .mfn-form .icon_box_2.icon .mfn-field-value').val().length ){
if( !$content.find('.'+it+' .mfn-icon-box .mfn_tmp_info').length ){
$content.find('.'+it+' .mfn-icon-box').prepend('<span style="margin-bottom: 20px;" class="mfn_tmp_info">Image and icon have higher priority. Delete them to see label.</span>');
setTimeout(function() {
$content.find('.mfn_tmp_info').remove();
}, 3000);
}
}else if(val.length){
if( $content.find('.'+it+' .mfn-icon-box .icon-wrapper').length ){
$content.find('.'+it+' .mfn-icon-box .icon-wrapper').html('<span class="icon-label">'+val+'</span>');
}else{
$content.find('.'+it+' .mfn-icon-box .desc-wrapper').before('<div class="icon-wrapper"><span class="icon-label">'+val+'</span></div>');
}
}else{
$content.find('.'+it+' .mfn-icon-box .icon-wrapper').remove();
}
}
});
$editpanel.on('change', '.banner_box.image_height .mfn-field-value', function() {
var val = $(this).val();
var it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
$builder.find('.'+it+' .mfn-banner-box').removeClass('mfn-banner-box-height');
if( val.length ){
$builder.find('.'+it+' .mfn-banner-box').addClass('mfn-banner-box-height');
}
});
$editpanel.on('change', '.product_tabs.nav .mfn-field-value', function() {
var val = $(this).val();
var it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
$content.find('.'+it+' .mfn-woocommerce-tabs').removeClass('mfn-woocommerce-tabs-nav-top mfn-woocommerce-tabs-nav-left mfn-woocommerce-tabs-nav-right');
if(!val.length) val = 'top';
$content.find('.'+it+' .mfn-woocommerce-tabs').addClass('mfn-woocommerce-tabs-nav-'+val);
});
$editpanel.on('change', '.preview-positioninput', function() {
var val = $(this).val();
if(!val.length){
$('.panel-edit-item .mfn-element-fields-wrapper .activeif-item_position input').val('').trigger('change');
}
});
$editpanel.on('change', '.mfn-line-clamp-field .mfn-field-value', function() {
var val = $(this).val();
var it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
if( val.length && val != '0' ){
$content.find('.'+it).addClass('mfn-line-clamp');
}else{
$content.find('.'+it).removeClass('mfn-line-clamp');
}
});
$editpanel.on('keyup paste change', '.mfn-element-fields-wrapper .preview-titleinput', function() {
// title
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($edited_div.hasClass('column_list')){
// list
if($content.find('.'+it+' .list_right h4').length){
$content.find('.'+it+' .list_right h4').html(val);
}else if($content.find('.'+it+' .circle').length){
$content.find('.'+it+' .circle').html(val);
}
}
});
$editpanel.on('change', '.mfn-element-fields-wrapper .responsive-custom-visibility .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
let label = 'Hide under ';
if( $(this).closest('.mfn-form-row').hasClass('show_under_custom')){
label = 'Show under ';
$editpanel.find('.mfn-element-fields-wrapper .hide_under_custom input').val('');
}else{
$editpanel.find('.mfn-element-fields-wrapper .show_under_custom input').val('');
}
if( val.length ){
$edited_div.attr('data-tooltip', label+val);
$edited_div.attr('data-position', 'bottom');
}else{
$edited_div.removeAttr('data-tooltip');
}
});
// custom ID
$editpanel.on('change', '.custom_id .preview-custom_idinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
let uid = $edited_div.attr('data-uid');
if(val.length){
$edited_div.attr('id', val);
if( $('body').hasClass('mfn-navigator-active') ){
$navigator.find('.navigator-section.nav-'+uid+' > a > .navigator-link-label').text('#'+val);
}
}else{
$edited_div.removeAttr('id');
$navigator.find('.navigator-section.nav-'+uid+' > a > .navigator-link-label').text('Section');
}
});
// our team list links email fb twitter linkedin vcard
$editpanel.on('keyup paste change', '.our_team_list.email .preview-emailinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .bq_wrapper .links').length){
if($content.find('.'+it+' .bq_wrapper .links a.mail').length){
$content.find('.'+it+' .bq_wrapper .links a.mail').attr('href', val);
}else{
$content.find('.'+it+' .bq_wrapper .links').prepend('<a href="mailto:'+val+'" class="icon_bar icon_bar_small mail"><span class="t"><i class="icon-mail"></i></span><span class="b"><i class="icon-mail"></i></span></a>');
}
}else{
$content.find('.'+it+' .bq_wrapper').append('<div class="links"><a href="mailto:'+val+'" class="icon_bar icon_bar_small mail"><span class="t"><i class="icon-mail"></i></span><span class="b"><i class="icon-mail"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .bq_wrapper .links a.mail').remove();
}
});
$editpanel.on('keyup paste change', '.our_team_list.facebook .preview-facebookinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .bq_wrapper .links').length){
if($content.find('.'+it+' .bq_wrapper .links a.facebook').length){
$content.find('.'+it+' .bq_wrapper .links a.facebook').attr('href', val);
}else{
$content.find('.'+it+' .bq_wrapper .links').append('<a target="_blank" href="'+val+'" class="icon_bar icon_bar_small facebook"><span class="t"><i class="icon-facebook"></i></span><span class="b"><i class="icon-facebook"></i></span></a>');
}
}else{
$content.find('.'+it+' .bq_wrapper').append('<div class="links"><a target="_blank" href="'+val+'" class="icon_bar icon_bar_small facebook"><span class="t"><i class="icon-facebook"></i></span><span class="b"><i class="icon-facebook"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .bq_wrapper .links a.facebook').remove();
}
});
$editpanel.on('keyup paste change', '.our_team_list.twitter .preview-twitterinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .bq_wrapper .links').length){
if($content.find('.'+it+' .bq_wrapper .links a.twitter').length){
$content.find('.'+it+' .bq_wrapper .links a.twitter').attr('href', val);
}else{
$content.find('.'+it+' .bq_wrapper .links').append('<a target="_blank" href="'+val+'" class="icon_bar icon_bar_small twitter"><span class="t"><i class="icon-twitter"></i></span><span class="b"><i class="icon-twitter"></i></span></a>');
}
}else{
$content.find('.'+it+' .bq_wrapper').append('<div class="links"><a target="_blank" href="'+val+'" class="icon_bar icon_bar_small twitter"><span class="t"><i class="icon-twitter"></i></span><span class="b"><i class="icon-twitter"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .bq_wrapper .links a.twitter').remove();
}
});
$editpanel.on('keyup paste change', '.our_team_list.linkedin .preview-linkedininput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .bq_wrapper .links').length){
if($content.find('.'+it+' .bq_wrapper .links a.linkedin').length){
$content.find('.'+it+' .bq_wrapper .links a.linkedin').attr('href', val);
}else{
$content.find('.'+it+' .bq_wrapper .links').append('<a target="_blank" href="'+val+'" class="icon_bar icon_bar_small linkedin"><span class="t"><i class="icon-linkedin"></i></span><span class="b"><i class="icon-linkedin"></i></span></a>');
}
}else{
$content.find('.'+it+' .bq_wrapper').append('<div class="links"><a target="_blank" href="'+val+'" class="icon_bar icon_bar_small linkedin"><span class="t"><i class="icon-linkedin"></i></span><span class="b"><i class="icon-linkedin"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .bq_wrapper .links a.linkedin').remove();
}
});
$editpanel.on('keyup paste change', '.our_team_list.vcard .preview-vcardinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .bq_wrapper .links').length){
if($content.find('.'+it+' .bq_wrapper .links a.vcard').length){
$content.find('.'+it+' .bq_wrapper .links a.vcard').attr('href', val);
}else{
$content.find('.'+it+' .bq_wrapper .links').append('<a href="'+val+'" class="icon_bar icon_bar_small vcard"><span class="t"><i class="icon-vcard"></i></span><span class="b"><i class="icon-vcard"></i></span></a>');
}
}else{
$content.find('.'+it+' .bq_wrapper').append('<div class="links"><a href="'+val+'" class="icon_bar icon_bar_small vcard"><span class="t"><i class="icon-vcard"></i></span><span class="b"><i class="icon-vcard"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .bq_wrapper .links a.vcard').remove();
}
});
// our team list blockquote
$editpanel.on('keyup paste change', '.our_team_list.blockquote .preview-blockquoteinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($content.find('.'+it+' .column .bq_wrapper blockquote').length){
$content.find('.'+it+' .column .bq_wrapper blockquote').html(val);
}else{
$content.find('.'+it+' .column .bq_wrapper').prepend('<div class="blockquote"><span class="mfn-blockquote-icon"><i class="icon-quote"></i></span><blockquote>'+val+'</blockquote></div>');
}
});
// our team
$editpanel.on('keyup paste change', '.our_team.blockquote .preview-blockquoteinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($content.find('.'+it+' .desc_wrapper blockquote').length){
$content.find('.'+it+' .desc_wrapper blockquote').html(val);
}else{
$content.find('.'+it+' .desc_wrapper').append('<blockquote>'+val+'</blockquote>');
}
});
// our team links email fb twitter linkedin vcard
$editpanel.on('keyup paste change', '.our_team.email .preview-emailinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .desc_wrapper .links').length){
if($content.find('.'+it+' .desc_wrapper .links a.mail').length){
$content.find('.'+it+' .desc_wrapper .links a.mail').attr('href', val);
}else{
$content.find('.'+it+' .desc_wrapper .links').prepend('<a href="mailto:'+val+'" class="icon_bar icon_bar_small mail"><span class="t"><i class="icon-mail"></i></span><span class="b"><i class="icon-mail"></i></span></a>');
}
}else{
$content.find('.'+it+' .desc_wrapper').append('<div class="links"><a href="mailto:'+val+'" class="icon_bar icon_bar_small mail"><span class="t"><i class="icon-mail"></i></span><span class="b"><i class="icon-mail"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .desc_wrapper .links a.mail').remove();
}
});
$editpanel.on('keyup paste change', '.our_team.facebook .preview-facebookinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .desc_wrapper .links').length){
if($content.find('.'+it+' .desc_wrapper .links a.facebook').length){
$content.find('.'+it+' .desc_wrapper .links a.facebook').attr('href', val);
}else{
$content.find('.'+it+' .desc_wrapper .links').append('<a target="_blank" href="'+val+'" class="icon_bar icon_bar_small facebook"><span class="t"><i class="icon-facebook"></i></span><span class="b"><i class="icon-facebook"></i></span></a>');
}
}else{
$content.find('.'+it+' .desc_wrapper').append('<div class="links"><a target="_blank" href="'+val+'" class="icon_bar icon_bar_small facebook"><span class="t"><i class="icon-facebook"></i></span><span class="b"><i class="icon-facebook"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .desc_wrapper .links a.facebook').remove();
}
});
$editpanel.on('keyup paste change', '.our_team.twitter .preview-twitterinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .desc_wrapper .links').length){
if($content.find('.'+it+' .desc_wrapper .links a.twitter').length){
$content.find('.'+it+' .desc_wrapper .links a.twitter').attr('href', val);
}else{
$content.find('.'+it+' .desc_wrapper .links').append('<a target="_blank" href="'+val+'" class="icon_bar icon_bar_small twitter"><span class="t"><i class="icon-twitter"></i></span><span class="b"><i class="icon-twitter"></i></span></a>');
}
}else{
$content.find('.'+it+' .desc_wrapper').append('<div class="links"><a target="_blank" href="'+val+'" class="icon_bar icon_bar_small twitter"><span class="t"><i class="icon-twitter"></i></span><span class="b"><i class="icon-twitter"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .desc_wrapper .links a.twitter').remove();
}
});
$editpanel.on('keyup paste change', '.our_team.linkedin .preview-linkedininput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .desc_wrapper .links').length){
if($content.find('.'+it+' .desc_wrapper .links a.linkedin').length){
$content.find('.'+it+' .desc_wrapper .links a.linkedin').attr('href', val);
}else{
$content.find('.'+it+' .desc_wrapper .links').append('<a target="_blank" href="'+val+'" class="icon_bar icon_bar_small linkedin"><span class="t"><i class="icon-linkedin"></i></span><span class="b"><i class="icon-linkedin"></i></span></a>');
}
}else{
$content.find('.'+it+' .desc_wrapper').append('<div class="links"><a target="_blank" href="'+val+'" class="icon_bar icon_bar_small linkedin"><span class="t"><i class="icon-linkedin"></i></span><span class="b"><i class="icon-linkedin"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .desc_wrapper .links a.linkedin').remove();
}
});
$editpanel.on('keyup paste change', '.preview-cart_button_textinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($content.find('.'+it+' button[type="submit"]').length){
$content.find('.'+it+' button[type="submit"]').text(val);
}
});
$editpanel.on('keyup paste change', '.our_team.vcard .preview-vcardinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if(val.length){
if($content.find('.'+it+' .desc_wrapper .links').length){
if($content.find('.'+it+' .desc_wrapper .links a.vcard').length){
$content.find('.'+it+' .desc_wrapper .links a.vcard').attr('href', val);
}else{
$content.find('.'+it+' .desc_wrapper .links').append('<a href="'+val+'" class="icon_bar icon_bar_small vcard"><span class="t"><i class="icon-vcard"></i></span><span class="b"><i class="icon-vcard"></i></span></a>');
}
}else{
$content.find('.'+it+' .desc_wrapper').append('<div class="links"><a href="'+val+'" class="icon_bar icon_bar_small vcard"><span class="t"><i class="icon-vcard"></i></span><span class="b"><i class="icon-vcard"></i></span></a></div>');
}
}else{
$content.find('.'+it+' .desc_wrapper .links a.vcard').remove();
}
});
$editpanel.on('keyup paste change', '.preview-phoneinput', function() {
// phone
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($edited_div.hasClass('column_our_team')){
// our team
if($content.find('.'+it+' .desc_wrapper p.phone a').length){
$content.find('.'+it+' .desc_wrapper p.phone a').text(val);
}else{
$content.find('.'+it+' .desc_wrapper .hr_color').before('<p class="phone"><i class="icon-phone"></i> <a href="#">'+val+'</a></p>');
}
}else if($edited_div.hasClass('column_our_team_list')){
// our team
if($content.find('.'+it+' .desc_wrapper p.phone a').length){
$content.find('.'+it+' .desc_wrapper p.phone a').text(val);
}else{
$content.find('.'+it+' .desc_wrapper .hr_color').before('<p class="phone"><i class="icon-phone"></i> <a href="#">'+val+'</a></p>');
}
}
});
$editpanel.on('change', '.widget-chart .preview-line_widthinput', function() {
// chart
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
$content.find('.'+it+' .chart').attr('data-line-width', val);
$content.find('.'+it+' .chart_box').removeClass('mfn-initialized');
mfnChart();
});
$editpanel.on('change', '.gallery-msnry-rerender-item .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if( $content.find('.'+it+' .gallery').hasClass('masonry') ) {
setTimeout(function() { re_render(edited_item.uid); }, 100);
}
});
// mennu pointer position top/bottom
$editpanel.on('change', ' .preview-menu-pointer-positioninput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
$edited_div.removeClass('mfn-pointer-bottom');
if(val.length){
$edited_div.addClass(val);
}
});
$editpanel.on('change', '.preview-stretchinput', function() {
// stretch image
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($edited_div.hasClass('column_image')){
// image stretch
$content.find('.'+it+' .image_frame').removeClass('stretch-ultrawide stretch');
if(val == 'ultrawide'){
$content.find('.'+it+' .image_frame').addClass('stretch-ultrawide');
}else if(val == "1"){
$content.find('.'+it+' .image_frame').addClass('stretch');
}
}
});
$editpanel.on('change', '.panel-edit-item .mfn-form .form-group.font-family-select select', function() {
var val = $(this).val();
$(this).attr('data-value', val);
});
// query builder query loop settings
$editpanel.on('change', '.query_slider_columns .mfn-field-value', function() {
updateColumnsRwd();
});
function updateColumnsRwd() {
var val_desktop = $('.query_slider_columns .mfn-field-value').val();
if( val_desktop > 0 ) {
var percent_d = 100 / parseInt(val_desktop);
$editpanel.find('.mfn-form-row.query_item_default_width .mfn-field-value').val(percent_d+"%").trigger('change');
}
}
/**
* Performance
* Uses 'perf' name because 'preformance' is reserved in JS
*/
$(document).on( 'click', '.mfn-form-themeoptions .performance-apply-enable', function(e){
e.preventDefault();
perf.enable( $(this) ); // performance name is reverved
});
$(document).on( 'click', '.mfn-form-themeoptions .performance-apply-disable', function(e){
e.preventDefault();
perf.disable( $(this) ); // performance name is reverved
});
var perf = {
// perf.enable()
enable: function( $el ){
if ( confirm( "Apply recommended settings?" ) ) {
enableBeforeUnload();
var button_text = $el.text();
$el.addClass('loading');
// change options
$('.themeoption.google-font-mode .form-control li:eq(1) a').trigger('click');
$('.themeoption.lazy-load .form-control li:eq(1) a').trigger('click');
$('.themeoption.srcset-limit .form-control li:eq(1) a').trigger('click');
$('.themeoption.performance-assets-disable .form-control li:eq(0).active').trigger('click');
$('.themeoption.performance-assets-disable .form-control li:eq(1).active').trigger('click');
$('.themeoption.performance-assets-disable .form-control li:eq(2):not(.active)').trigger('click');
$('.themeoption.performance-wp-disable .form-control li:not(.active)').trigger('click');
$('.themeoption.jquery-location .form-control li:eq(1) a').trigger('click');
$('.themeoption.css-location .form-control li:eq(0) a').trigger('click');
$('.themeoption.local-styles-location .form-control li:eq(1) a').trigger('click');
$('.themeoption.minify-css .form-control li:eq(1) a').trigger('click');
$('.themeoption.minify-js .form-control li:eq(1) a').trigger('click');
$('.themeoption.static-css .form-control li:eq(1) a').trigger('click');
$('.themeoption.hold-cache .form-control li:eq(0) a').trigger('click');
// trigger ajax actions
setTimeout(function(){
$('.themeoption.google-font-mode-regenerate .mfn-btn').attr('data-confirm',1).trigger('click');
},100);
// button
setTimeout(function(){
$el.removeClass('loading');
$('.btn-wrapper', $el).text('Downloading Google Fonts...');
setTimeout(function(){
$el.addClass('loading');
setTimeout(function(){
$el.removeClass('loading');
$('.btn-wrapper', $el).text('All done');
setTimeout(function(){
$('.btn-wrapper', $el).text(button_text);
},2000);
},2000);
},2000);
},2000);
} else {
return false;
}
},
// perf.disable()
disable: function( $el ){
if ( confirm( "Disable all performance settings?" ) ) {
enableBeforeUnload();
var button_text = $el.text();
$el.addClass('loading');
// change options
$('.themeoption.google-font-mode .form-control li:eq(0) a').trigger('click');
$('.themeoption.lazy-load .form-control li:eq(0) a').trigger('click');
$('.themeoption.srcset-limit .form-control li:eq(0) a').trigger('click');
$('.themeoption.performance-assets-disable .form-control li.active').trigger('click');
$('.themeoption.performance-wp-disable .form-control li.active').trigger('click');
$('.themeoption.jquery-location .form-control li:eq(0) a').trigger('click');
$('.themeoption.css-location .form-control li:eq(0) a').trigger('click');
$('.themeoption.local-styles-location .form-control li:eq(0) a').trigger('click');
$('.themeoption.minify-css .form-control li:eq(0) a').trigger('click');
$('.themeoption.minify-js .form-control li:eq(0) a').trigger('click');
$('.themeoption.static-css .form-control li:eq(0) a').trigger('click');
$('.themeoption.hold-cache .form-control li:eq(0) a').trigger('click');
// button
setTimeout(function(){
$el.removeClass('loading');
$('.btn-wrapper', $el).text('All done');
setTimeout(function(){
$('.btn-wrapper', $el).text(button_text);
},2000);
},1000);
} else {
return false;
}
}
};
// segmented options
$editpanel.on("click", '.mfn-modal .segmented-options.single-segmented-option li a, .sidebar-panel-content .panel:not(.panel-settings) .segmented-options.single-segmented-option li a', function(e) {
e.preventDefault();
let $li = $(this).closest('li');
/*let is_unclickable = false;
if( $li.closest('.segmented-options').hasClass('mfn-placeholder-inherited-class') ) is_unclickable = true;*/
if( !$li.hasClass('active') ){
$li.siblings('li').removeClass('active');
$li.siblings('li').find('input').prop('checked', false);
$li.addClass('active');
$li.find('input').prop('checked', true).trigger('change');
}else{
return;
}
/*else{
$li.removeClass('active');
$li.find('input').prop('checked', false).trigger('change');
}*/
if( $(this).closest('.mfn-modal').length ) return;
let $editbox = $(this).closest('.mfn-form-row');
let $editwrapper = $(this).closest('.mfn-element-fields-wrapper');
let val = $li.find('input').val();
if( $(this).closest('.mfn-element-fields-wrapper').length && !val.length && $editbox.hasClass('mfn-placeholder-inherited-class') ) return;
// shop products text align fix
if( $editbox.hasClass('shop_products') && $editbox.hasClass('text-align') ){
if( !$builder.find('style.mfn-style-shop-products-equalizator').length ) $builder.append('<style class="mfn-style-shop-products-equalizator"></style>');
let flex_sp_val = 'center';
if( val == 'left' ){ flex_sp_val = 'flex-start'; }else if( val == 'right' ){ flex_sp_val = 'flex-end'; }
$builder.find('style.mfn-style-shop-products-equalizator').html('.mcb-section .mcb-wrap .mcb-item-'+edited_item.uid+' ul.products.mfn-equal-heights li.product{ align-items: '+flex_sp_val+';}');
}
if( $editbox.hasClass('inline-style-input') ) return;
let it = $editbox.closest('.mfn-element-fields-wrapper').attr('data-element');
// lottie start
if( $editbox.hasClass('lottie') ){
var l_id = $content.find('.mcb-item-'+edited_item.uid+' .lottie').attr('id');
if( $editbox.hasClass('loop') ){
if( val == 1 ){
iframe.window[l_id].loop = true;
iframe.window[l_id].play();
}else{
iframe.window[l_id].loop = false;
iframe.window[l_id].stop();
}
}
if( $editbox.hasClass('direction') ){
iframe.window[l_id].setDirection(val);
iframe.window['direction'+l_id] = parseInt(val);
lottie_play();
}
}
// lottie end
// header icon count position
if( $editbox.hasClass('icon_count_posv') ){
if( val == '0' ){
$editpanel.find('.panel-edit-item .header_icon.bottom .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.bottom_tablet .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.bottom_laptop .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.bottom_mobile .mfn-field-value').val('initial').trigger('change');
}else{
$editpanel.find('.panel-edit-item .header_icon.top .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.top_tablet .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.top_laptop .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.top_mobile .mfn-field-value').val('initial').trigger('change');
}
}
if( $editbox.hasClass('icon_count_posh') ){
if( val == '0' ){
$editpanel.find('.panel-edit-item .header_icon.right .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.right_tablet .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.right_laptop .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.right_mobile .mfn-field-value').val('initial').trigger('change');
}else{
$editpanel.find('.panel-edit-item .header_icon.left .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.left_tablet .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.left_laptop .mfn-field-value').val('initial').trigger('change');
$editpanel.find('.panel-edit-item .header_icon.left_mobile .mfn-field-value').val('initial').trigger('change');
}
}
// watchchanges
if( $editbox.hasClass('watchChanges') ){
var id = $editbox.attr('id');
mfnoptsinputs.getField(id, val);
}
// section type query loop
if( $editbox.hasClass('section type') ){
if( !val.length ) {
$content.find('.'+it+' .section_wrapper .mfn-queryloop-item-wrapper > div.wrap').unwrap();
$('.mfn-element-fields-wrapper .query_type .mfn-field-value').val('').trigger('change');
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('').trigger('change');
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('').trigger('change');
$content.find('.'+it).removeClass('mfn-looped-items');
$('.mfn-element-fields-wrapper').removeClass('mfn-is-query-looped');
$('.mfn-ui.mfn-editing-section .mfn-form .mfn-element-fields-wrapper').removeClass('mfn-is-query-looped');
} else {
if( !$content.find('.'+it+' .section_wrapper .mfn-queryloop-item-wrapper').length ){
$content.find('.'+it).addClass('mfn-looped-items');
$('.mfn-element-fields-wrapper').addClass('mfn-is-query-looped');
$content.find('.'+it+' .section_wrapper div.wrap').wrapAll( "<div class='mfn-queryloop-item-wrapper mfn-ql-item-default' />" );
}
$('.mfn-ui.mfn-editing-section .mfn-form .mfn-element-fields-wrapper').addClass('mfn-is-query-looped');
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('').trigger('change');
$('.mfn-element-fields-wrapper .query_type .mfn-field-value').val('posts').trigger('change');
if( builder_type == 'portfolio' ){
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('portfolio').trigger('change');
}else{
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('post').trigger('change');
}
//re_render2( $content.find('.'+it).attr('data-uid'), 'section' );
}
}
// wrap type query loop
if( $editbox.hasClass('wrap type') ){
if( !val.length ){
//$content.find('.'+it+' .mcb-wrap-inner .mfn-queryloop-item-wrapper > div.column').unwrap();
$('.mfn-element-fields-wrapper .query_type .mfn-field-value').val('').trigger('change');
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('').trigger('change');
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('').trigger('change');
$content.find('.'+it).removeClass('mfn-looped-items');
$('.mfn-element-fields-wrapper').removeClass('mfn-is-query-looped');
$('.mfn-ui.mfn-editing-section .mfn-form .mfn-element-fields-wrapper').removeClass('mfn-is-query-looped');
}else{
if( !$content.find('.'+it+' .mcb-wrap-inner .mfn-queryloop-item-wrapper').length ){
$content.find('.'+it+' .mcb-wrap-inner div.column').wrapAll( "<div class='mfn-queryloop-item-wrapper mfn-ql-item-default' />");
$content.find('.'+it).addClass('mfn-looped-items');
}
$('.mfn-ui.mfn-editing-section .mfn-form .mfn-element-fields-wrapper').addClass('mfn-is-query-looped');
$('.mfn-element-fields-wrapper .query_type .mfn-field-value').val('posts').trigger('change');
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('').trigger('change');
$('.mfn-element-fields-wrapper').addClass('mfn-is-query-looped');
if( builder_type == 'portfolio' ){
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('portfolio').trigger('change');
}else{
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('post').trigger('change');
}
}
//re_render2( $content.find('.'+it).attr('data-uid'), 'wrap' );
}
if( $editbox.hasClass('query_display_style') ){
if( val == 'masonry' ){
$content.find('.'+it).addClass('mfn-looped-items-masonry');
$content.find('.'+it+' .mfn-queryloop-item-wrapper').wrapAll( "<div class='mfn-query-loop-masonry' />");
//queryLoopMasonry();
iframe.queryLoopMasonry();
}else if( !val.lenght ){
if( $content.find('.'+it).hasClass('mfn-looped-items-masonry') ){
iframe.window.jQuery('.'+it+' .mfn-query-loop-masonry').isotope( 'destroy' );
$content.find('.'+it).removeClass('mfn-looped-items-masonry');
$content.find('.'+it+' .mfn-query-loop-masonry > .mfn-queryloop-item-wrapper').removeAttr('style').unwrap();
}
}
}
// query loop slider type
if( $editbox.hasClass('query_display') && val == 'slider' ){
$('.panel-edit-item .query_post_pagination .mfn-field-value').val('').trigger('change');
$('.panel-edit-item .query_post_pagination').addClass('mfn-disabled-field');
$('.mfn-element-fields-wrapper').addClass('mfn-is-ql-slider');
}else{
$('.panel-edit-item .query_post_pagination').removeClass('mfn-disabled-field');
$('.mfn-element-fields-wrapper').removeClass('mfn-is-ql-slider');
}
// image custom height
if( $editbox.hasClass('image image_height') ){
if( $content.find('.'+it+' .mfn-coverimg').length ){
$content.find('.'+it+' .mfn-coverimg').removeClass('mfn-coverimg');
$content.find('.'+it+' .mfn-coverimg-wrapper').removeClass('mfn-coverimg-wrapper mfn-fitimg-wrapper');
}
if( val == 'custom' ) {
$content.find('.'+it+' .image_frame').addClass('mfn-coverimg');
var helper_class = 'mfn-coverimg-wrapper';
if( $('.image_height_style li.active input').val().length ){
helper_class = 'mfn-'+$('.image_height_style li .active input').val()+'img-wrapper';
}
if( $content.find('.'+it+' .image_wrapper > a').length ){
$content.find('.'+it+' .image_wrapper > a').addClass(helper_class);
}else{
$content.find('.'+it+' .image_wrapper').addClass(helper_class);
}
}
}
if( $editbox.hasClass('image') && $editbox.hasClass('image_height_style') ){
$content.find('.'+it+' .mfn-coverimg-wrapper').removeClass('mfn-coverimg-wrapper mfn-fitimg-wrapper');
if( val.length ) {
$content.find('.'+it+' .image_wrapper').addClass('mfn-'+val+'img-wrapper');
}else{
$content.find('.'+it+' .image_wrapper').addClass('mfn-coverimg-wrapper');
}
}
// header menu submenu icon
if( $editbox.hasClass('header_menu submenu_icon_display') ){
$content.find('.'+it+' .mfn-header-menu').addClass('mfn-menu-submenu-icon-off');
if( val == 'on' ) $content.find('.'+it+' .mfn-header-menu').removeClass('mfn-menu-submenu-icon-off');
}
// product add to cart label position
if( $editbox.hasClass('product_cart_button variations-label') ){
$content.find('.'+it+' .mfn-product-add-to-cart').removeClass('mfn-vr-label-top');
if( val == 'top' )
$content.find('.'+it+' .mfn-product-add-to-cart').addClass('mfn-vr-label-top');
}
// shop filters
if( $editbox.hasClass('shop-products-filters-switcher') ){
let field_opt = $li.find('input').attr('name');
if( $content.find('.mfn-builder-active').hasClass('mfn-'+field_opt+'-hidden') ) $content.find('.mfn-builder-active').removeClass('mfn-'+field_opt+'-hidden');
if( $content.find('.mfn-builder-active').hasClass('mfn-'+field_opt+'-visible') ) $content.find('.mfn-builder-active').removeClass('mfn-'+field_opt+'-visible');
if( val == '0' ){
$content.find('.mfn-builder-active').addClass('mfn-'+field_opt+'-hidden');
}else{
$content.find('.mfn-builder-active').addClass('mfn-'+field_opt+'-visible');
}
}
if( $editbox.hasClass('product_images product_badge_onsale_position') ) {
$content.find('.'+it+' .mfn-product-images-wrapper').removeClass('mfn-product-badges-left mfn-product-badges-right');
if( val.length ) {
$content.find('.'+it+' .mfn-product-images-wrapper').addClass('mfn-product-badges-right');
}else{
$content.find('.'+it+' .mfn-product-images-wrapper').addClass('mfn-product-badges-left');
}
}
if( $editbox.hasClass('ql_badge_onsale_position') ) {
$content.find('.'+it+' .mfn-img-box').removeClass('mfn-product-badges-left mfn-product-badges-right');
if( val.length ) {
$content.find('.'+it+' .mfn-img-box').addClass('mfn-product-badges-right');
}else{
$content.find('.'+it+' .mfn-img-box').addClass('mfn-product-badges-left');
}
}
// banner box style
if( $editbox.hasClass('banner_box style') ){
$content.find('.'+it+' .mfn-banner-box').removeClass('mfn-banner-box-boxed');
if( val.length ) $content.find('.'+it+' .mfn-banner-box').addClass('mfn-banner-box-'+val);
}
if( $editbox.hasClass('banner_box overlay') ){
$content.find('.'+it+' .mfn-banner-box').removeClass('mfn-banner-box-image-overlay');
if( val.length ) $content.find('.'+it+' .mfn-banner-box').addClass('mfn-banner-box-image-overlay');
}
// header menu icon align
if( $editbox.hasClass('product_images zoom') ){
updatePageOpt('mfn_template_product_image_zoom', val);
}
if( $editbox.hasClass('hotspot-x-axis-switcher') ){
$li.closest('.mfn-hotspot-point').find('.hotspot-x-axis-field .mfn-sliderbar-value').val('').trigger('change');
}
if( $editbox.hasClass('hotspot') && ( $editbox.hasClass('content_position') || $editbox.hasClass('content_position_laptop') || $editbox.hasClass('content_position_tablet') || $editbox.hasClass('content_position_mobile') ) ){
var hash = $(this).closest('.mfn-hotspot-point').attr('id');
if( $editbox.hasClass('content_position') ){
$content.find('.hotspot-point-'+hash).removeClass('hotspot-point-bottom hotspot-point-top hotspot-point-left hotspot-point-right').addClass('hotspot-point-'+val);
}else if( $editbox.hasClass('content_position_laptop') ){
$content.find('.hotspot-point-'+hash).removeClass('hotspot-point-laptop-bottom hotspot-point-laptop-top hotspot-point-laptop-left hotspot-point-laptop-right').addClass('hotspot-point-laptop-'+val);
}else if( $editbox.hasClass('content_position_tablet') ){
$content.find('.hotspot-point-'+hash).removeClass('hotspot-point-tablet-bottom hotspot-point-tablet-top hotspot-point-tablet-left hotspot-point-tablet-right').addClass('hotspot-point-tablet-'+val);
}else if( $editbox.hasClass('content_position_mobile') ){
$content.find('.hotspot-point-'+hash).removeClass('hotspot-point-mobile-bottom hotspot-point-mobile-top hotspot-point-mobile-left hotspot-point-mobile-right').addClass('hotspot-point-mobile-'+val);
}
}
if( $editbox.hasClass('hotspot-y-axis-switcher') ){
$li.closest('.mfn-hotspot-point').find('.hotspot-y-axis-field .mfn-sliderbar-value').val('').trigger('change');
}
// product gallery arrows
if( $editbox.hasClass('product_images thumbnail_arrows') ){
$content.find('.'+it).removeClass('mfn-thumbnails-arrows-active');
if( val.length ) $content.find('.'+it).addClass('mfn-thumbnails-arrows-active');
}
// image gallery image height
if( $editbox.hasClass('image_gallery image_height') ){
$content.find('.'+it+' .gallery').removeClass('mfn_custom_img_height');
if( val.length ) $content.find('.'+it+' .gallery').addClass('mfn_custom_img_height');
}
// image gallery caption style
if( $editbox.hasClass('image_gallery') && $editbox.hasClass('image_caption_style') ){
$content.find('.'+it+' .gallery').removeClass('img_caption_overlay');
if( val.length ) $content.find('.'+it+' .gallery').addClass('img_caption_overlay');
}
if( $editbox.hasClass('image_gallery') && $editbox.hasClass('layout') ){
$content.find('.'+it+' .gallery').removeClass('equal-heights');
if( val.length ){
$content.find('.'+it+' .gallery').addClass('equal-heights');
if( !$content.find('.'+it+' .gallery').hasClass('img_caption_overlay') ) $('.mfn-form-row.image_gallery.image_caption_style input[value="img_caption_overlay"]').siblings('a').trigger('click');
}
}
// image gallery style
if( $editbox.hasClass('image_gallery style') ){
if( val == 'masonry' ) $('.image_gallery.layout .mfn-field-value[value=""]').siblings('a').trigger('click');
}
// hotspot
if( $editbox.hasClass('hotspot marker_animation') ){
$content.find('.'+it+' .mfn-image-hotspot').removeClass('mfn-image-hotspot-point-pulse mfn-image-hotspot-point-scale mfn-image-hotspot-point-bounce');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot').addClass('mfn-image-hotspot-point-'+val);
}
if( $editbox.hasClass('hotspot content_animation') ){
$content.find('.'+it+' .mfn-image-hotspot').removeClass('mfn-image-hotspot-content-fadeIn');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot').addClass('mfn-image-hotspot-content-'+val);
}
if( $editbox.hasClass('hotspot content_position') ){
var point_id = $editbox.closest('.mfn-hotspot-point').attr('id');
$content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).removeClass('hotspot-point-top hotspot-point-left hotspot-point-right hotspot-point-bottom');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).addClass('hotspot-point-'+val);
}
if( $editbox.hasClass('hotspot content_position_laptop') ){
var point_id = $editbox.closest('.mfn-hotspot-point').attr('id');
$content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).removeClass('hotspot-point-laptop-top hotspot-point-laptop-left hotspot-point-laptop-right hotspot-point-laptop-bottom');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).addClass('hotspot-point-'+val);
}
if( $editbox.hasClass('hotspot content_position_tablet') ){
var point_id = $editbox.closest('.mfn-hotspot-point').attr('id');
$content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).removeClass('hotspot-point-tablet-top hotspot-point-tablet-left hotspot-point-tablet-right hotspot-point-tablet-bottom');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).addClass('hotspot-point-'+val);
}
if( $editbox.hasClass('hotspot content_position_mobile') ){
var point_id = $editbox.closest('.mfn-hotspot-point').attr('id');
$content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).removeClass('hotspot-point-mobile-top hotspot-point-mobile-left hotspot-point-mobile-right hotspot-point-mobile-bottom');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot .hotspot-point-'+point_id).addClass('hotspot-point-'+val);
}
if( $editbox.hasClass('hotspot img_height') ){
$content.find('.'+it+' .mfn-image-hotspot').removeClass('mfn-image-hotspot-height');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot').addClass('mfn-image-hotspot-height');
}
if( $editbox.hasClass('hotspot') && $editbox.hasClass('img_height_style') ){
$content.find('.'+it+' .mfn-image-hotspot.mfn-image-hotspot-height').removeClass('mfn-image-hotspot-height-cover');
if( val.length ) $content.find('.'+it+' .mfn-image-hotspot.mfn-image-hotspot-height').addClass('mfn-image-hotspot-height-cover');
}
// header menu icon align
if( $editbox.hasClass('header_menu icon_align') ){
$content.find('.'+it+' .mfn-header-menu').removeClass('mfn-menu-icon-left mfn-menu-icon-right mfn-menu-icon-top');
$content.find('.'+it+' .mfn-header-menu').addClass('mfn-menu-icon-'+val);
}
// mega menu icon align
if( $editbox.hasClass('megamenu_menu icon_align') ){
$content.find('.'+it+' .mfn-megamenu-menu').removeClass('mfn-mm-menu-icon-left mfn-mm-menu-icon-right mfn-mm-menu-icon-top');
$content.find('.'+it+' .mfn-megamenu-menu').addClass('mfn-mm-menu-icon-'+val);
}
// header menu separator
if( $editbox.hasClass('header_menu separator') ){
$content.find('.'+it+' .mfn-header-menu').removeClass('mfn-menu-separator-on');
if( val == 'on' ) $content.find('.'+it+' .mfn-header-menu').addClass('mfn-menu-separator-on');
}
// header icon cart/wislist count icon reset top/bottom left/right
if( $editbox.hasClass('header_icon icon_count_posv') ){
$editpanel.find('.header-icon-vert-count.header_icon .mfn-field-value').val('').trigger('change');
}
if( $editbox.hasClass('header_icon icon_count_posh') ){
$editpanel.find('.header-icon-hori-count.header_icon .mfn-field-value').val('').trigger('change');
}
// greyscale
if($editbox.hasClass('greyscale')){
if(val == 0){
$content.find('.'+it+' .element_classes').removeClass('greyscale');
}else{
$content.find('.'+it+' .element_classes').addClass('greyscale');
}
}
// closeable header section
if( $editbox.hasClass('section closeable') ){
$content.find('.'+it+' .close-closeable-section').remove();
$content.find('.'+it).removeClass('closeable-active');
if( val == 1 ){
$content.find('.'+it).append('<span class="close-closeable-section mfn-close-icon"><span class="icon">✕</span></span>');
$content.find('.'+it).addClass('closeable-active');
if( !$content.find('.'+it).hasClass('close-button-right') && !$content.find('.'+it).hasClass('close-button-left') ){
$content.find('.'+it).addClass('close-button-left');
}
}
// close-button-right closeable-active
}
// closeable header section
if( $editbox.hasClass('section') && $editbox.hasClass('closeable-x') ){
$content.find('.'+it).removeClass('close-button-right close-button-left');
$content.find('.'+it).addClass('close-button-'+val);
}
// invert
if($editbox.hasClass('invert')){
if(val == 0){
$content.find('.'+it+' .element_classes').removeClass('invert');
}else{
$content.find('.'+it+' .element_classes').addClass('invert');
}
}
// reverse order
if($editbox.hasClass('reverse_order') && $('.mfn-ui').hasClass('mfn-editing-wrap')){
$edited_div.removeClass('column-reverse column-reverse-rows');
if( val == '1' ){
$edited_div.addClass('column-reverse');
}else if( val == '2' ){
$edited_div.addClass('column-reverse-rows');
}
}
// reverse order sections
if($editbox.hasClass('reverse_order') && $('.mfn-ui').hasClass('mfn-editing-section')){
$edited_div.removeClass('wrap-reverse wrap-reverse-rows');
if( val == '1' ){
$edited_div.addClass('wrap-reverse');
}else if( val == '2' ){
$edited_div.addClass('wrap-reverse-rows');
}
}
// olds
// icon box 2 icon position
if($editbox.hasClass('icon_box_2 icon_position') || $editbox.hasClass('header_icon icon_position') || $editbox.hasClass('header_burger icon_position') ){
if( screen == 'desktop' ){
$content.find('.'+it+' .mfn-icon-box').removeClass('mfn-icon-box-top mfn-icon-box-bottom mfn-icon-box-left mfn-icon-box-right');
}else{
$content.find('.'+it+' .mfn-icon-box').removeClass('mfn-icon-box-'+screen+'-top mfn-icon-box-'+screen+'-bottom mfn-icon-box-'+screen+'-left mfn-icon-box-'+screen+'-right');
val = screen+'-'+val;
}
$content.find('.'+it+' .mfn-icon-box').addClass('mfn-icon-box-'+val);
}
// icon box 2 icon align
if($editbox.hasClass('icon_box_2 icon_align') || $editbox.hasClass('header_icon icon_align')){
if( screen == 'desktop' ){
$content.find('.'+it+' .mfn-icon-box').removeClass('mfn-icon-box-center mfn-icon-box-start mfn-icon-box-end');
}else{
$content.find('.'+it+' .mfn-icon-box').removeClass('mfn-icon-box-'+screen+'-center mfn-icon-box-'+screen+'-start mfn-icon-box-'+screen+'-end');
val = screen+'-'+val;
}
$content.find('.'+it+' .mfn-icon-box').addClass('mfn-icon-box-'+val);
}
// icon box 2 title tag
if($editbox.hasClass('icon_box_2') && $editbox.hasClass('title_tag')){
var ib2_title = $content.find('.'+it+' .mfn-icon-box .title').html();
$content.find('.'+it+' .mfn-icon-box .title').replaceWith('<'+val+' class="title">'+ib2_title+'</'+val+'>');
}
// sticky wrapper
if( $('.mfn-ui').hasClass('mfn-editing-wrap') && $editbox.hasClass('sticky') ){
if( val == 1 ){
$content.find('.'+it).addClass('sticky sticky-'+screen);
$editwrapper.find('.mfn_field_'+screen+'.adv_alignself_wrap .positioning-options ul li:first-child a').trigger('click');
}else{
$content.find('.'+it).removeClass('sticky');
$content.find('.'+it).removeClass('sticky-'+screen);
}
}
// single product add to cart text-align
if($editbox.hasClass('product_cart_button text-align')){
$content.find('.'+it+' .mfn-product-add-to-cart').removeClass('mfn_product_cart_center mfn_product_cart_left mfn_product_cart_right mfn_product_cart_justify')
if(val){
$content.find('.'+it+' > div').addClass('mfn_product_cart_'+val);
}
}
// text column align
if($editbox.hasClass('column align')){
$content.find('.'+it+' > div').removeClass('align_center align_left align_right align_justify');
if(val){
$content.find('.'+it+' > div').addClass('align_'+val);
}
}
// quick fact align
if($editbox.hasClass('quick_fact align')){
$content.find('.'+it+' .quick_fact').removeClass('align_center align_left align_right').addClass('align_'+val);
}
// our team style
if($editbox.hasClass('our_team') && $editbox.hasClass('style')){
$content.find('.'+it+' .team').removeClass('team_circle team_vertical team_horizontal').addClass('team_'+val);
}
// offer thumb align
if($editbox.hasClass('offer_thumb align')){
$content.find('.'+it+' .desc_wrapper').removeClass('align_center align_left align_right align_justify').addClass('align_'+val);
}
// promo box image position
if($editbox.hasClass('promo_box position')){
$content.find('.'+it+' .promo_box_wrapper').removeClass('promo_box_right promo_box_left').addClass('promo_box_'+val);
}
// button icon position
if($editbox.hasClass('widget-button icon_position')){
$content.find('.'+it+' .button').removeClass('button_right button_left').addClass('button_'+val);
}
// counter type
if($editbox.hasClass('counter') && $editbox.hasClass('type')){
$content.find('.'+it+' .counter').removeClass('counter_horizontal counter_vertical').addClass('counter_'+val);
}
// promo box border
if($editbox.hasClass('promo_box border')){
if(val == 0){
$content.find('.'+it+' .promo_box').removeClass('has_border').addClass('no_border');
}else{
$content.find('.'+it+' .promo_box').addClass('has_border').removeClass('no_border');
}
}
// image border
if($editbox.hasClass('image border')){
if(val == 0){
$content.find('.'+it+' .image_frame').removeClass('has_border').addClass('no_border');
}else{
$content.find('.'+it+' .image_frame').addClass('has_border').removeClass('no_border');
}
}
// image align
if($editbox.hasClass('image align')){
$content.find('.'+it+' .image_frame').removeClass('alignleft alignright aligncenter');
if(val){
$content.find('.'+it+' .image_frame').addClass('align'+val);
}
}
// trailer box orientation
if($editbox.hasClass('trailer_box orientation')) {
$content.find('.'+it+' .trailer_box').removeClass('horizontal');
if(val){
$content.find('.'+it+' .trailer_box').addClass(val);
}
}
// story box style
if($editbox.hasClass('story_box') && $editbox.hasClass('style')){
$content.find('.'+it+' .story_box').removeClass('vertical');
if(val){
$content.find('.'+it+' .story_box').addClass('vertical');
}
}
// list style
if($editbox.hasClass('list') && $editbox.hasClass('style')){
$content.find('.'+it+' .list_item').removeClass('lists_1 lists_2 lists_3 lists_4').addClass('lists_'+val);
}
// icon box icon position
if($editbox.hasClass('icon_box icon_position')){
$content.find('.'+it+' .icon_box').removeClass('icon_position_left');
if(val == 'left'){
$content.find('.'+it+' .icon_box').addClass('icon_position_left');
}
}
// blog teaser margin
if($editbox.hasClass('blog_teaser margin')){
$content.find('.'+it+' .blog-teaser').removeClass('margin-no');
if(val == 0){
$content.find('.'+it+' .blog-teaser').addClass('margin-no');
}
}
// how it works border
if($editbox.hasClass('how_it_works border')){
if(val == 1){
$content.find('.'+it+' .how_it_works').addClass('has_border').removeClass('no_border');
}else{
$content.find('.'+it+' .how_it_works').removeClass('has_border').addClass('no_border');
}
}
// hover color align
if($editbox.hasClass('hover_color align')){
$content.find('.'+it+' .hover_color').removeClass('align_center align_left align_right align_justify');
$content.find('.'+it+' .hover_color').addClass('align_'+val);
}
// button full width fullwidth
if($editbox.hasClass('widget-button full_width')){
$content.find('.'+it+' .button').removeClass('button_full_width');
if(val == 1){
$content.find('.'+it+' .button').addClass('button_full_width');
}
}
// button size
if($editbox.hasClass('widget-button') && $editbox.hasClass('size')){
$content.find('.'+it+' .button').removeClass('button_size_1 button_size_2 button_size_3 button_size_4');
$content.find('.'+it+' .button').addClass('button_size_'+val);
}
// blog more
if($editbox.hasClass('blog more')){
$content.find('.'+it+' .posts_group').removeClass('hide-more');
if(val == 0){
$content.find('.'+it+' .posts_group').addClass('hide-more');
}
}
// blog more
if($editbox.hasClass('blog margin')){
$content.find('.'+it+' .posts_group').removeClass('margin');
if(val == 1){
$content.find('.'+it+' .posts_group').addClass('margin');
}
}
// mobile column text align
if($editbox.hasClass('column align-mobile')){
$content.find('.'+it+' > div').removeClass('mobile_align_center mobile_align_left mobile_align_right mobile_align_justify');
if(val){
$content.find('.'+it+' > div').addClass('mobile_align_'+val);
}
}
});
$editpanel.on('change', '.mfn-element-fields-wrapper .banner_box.hidden_elements_mobile .mfn-field-value', function() {
var val = $(this).val();
var it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
$content.find('.'+it+' .mfn-banner-box').removeClass('mfn-show-hidden-elements-on-mobile mfn-show-hidden-elements-on-tablet');
if( val.length && val == '1' ){
$content.find('.'+it+' .mfn-banner-box').addClass('mfn-show-hidden-elements-on-mobile');
}else if( val.length && val == '2' ){
$content.find('.'+it+' .mfn-banner-box').addClass('mfn-show-hidden-elements-on-tablet');
}
});
// header icon desc / empty desc
$editpanel.on('keyup paste change', '.mfn-element-fields-wrapper .header_icon.desc .mfn-field-value', function() {
var val = $(this).val();
if( val.length ){
$edited_div.find('.mfn-icon-box').removeClass('mfn-icon-box-empty-desc');
}else{
$edited_div.find('.mfn-icon-box').addClass('mfn-icon-box-empty-desc');
}
});
$editpanel.on('keyup paste change', '.mfn-element-fields-wrapper .hotspots .mfn-hotspot-point .content .mfn-field-value', function() {
var val = $(this).val();
var hash = $(this).closest('.mfn-hotspot-point').attr('id');
$content.find('.hotspot-point-'+hash+' .hotspot-content').html(val);
});
$editpanel.on('keyup paste change', '.mfn-element-fields-wrapper .hotspot.text .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
var val = $(this).val();
var point_id = $(this).closest('.mfn-hotspot-point').attr('id');
if( val.length ) {
$content.find('.'+it+' .hotspot-point-'+point_id+' .marker-text').text(val);
}else{
$content.find('.'+it+' .hotspot-point-'+point_id+' .marker-text').text('Point text');
}
});
// multiple fields
$editpanel.on('keyup', '.multiple-inputs .field input', function() {
var $editbox = $(this).closest('.multiple-inputs');
if($editbox.hasClass('isLinked')){
var thisval = $(this).val();
$editbox.find('.disableable input').val(thisval);
}
}).on('change', '.multiple-inputs .field input:not(.readonly)', function() {
var $input = $(this);
var $editbox = $input.closest('.multiple-inputs');
var $box = $input.closest('.mfn-form-row');
var val = $input.val();
var units_check = false;
//console.log('multiple inputs change');
// console.log($input);
if( val.length && $input.hasClass('numeral') ){
$.each( units, function( i, el ) {
if( val == 'initial' || val == 'auto' || val.includes(el) ){
units_check = true;
return;
}
});
if(units_check == false){
val += "px";
$input.val(val);
}
}
if( $editbox.hasClass('isLinked') ) {
$editbox.find('.disableable input').val(val);
if($editbox.hasClass('separated-fields')) {
$editbox.find('.disableable input').each(function() {
$(this).trigger('change');
});
setTimeout(function() {
historyStorage.add()
}, 200);
}else{
updatePseudoField($editbox);
}
if( $box.hasClass('pageoption') ) {
setTimeout(function() {
$editbox.find('.field:last-child input').trigger('change');
},400);
}
}else{
if(!$editbox.hasClass('separated-fields')){
updatePseudoField($editbox);
}else{
setTimeout(historyStorage.add, 200);
}
}
if($content.find('.vb-item[data-uid='+edited_item.uid+'] .slick-initialized').length){
setTimeout(function() {
$content.find('.vb-item[data-uid='+edited_item.uid+'] .slick-initialized').each(function() {
$(this).slick('setPosition');
});
},300);
}
/*setTimeout(function() {
loopAllStyleFields(edited_item.uid);
}, 100);*/
return;
});
$editpanel.on('change', '.mfn-element-fields-wrapper .header_menu.justify-content .preview-justify-contentinput', function() {
var val = $(this).val();
if( val == 'center' || val == 'flex-end' || val == 'flex-start' ){
$('.mfn-element-fields-wrapper .header_menu.flex-grow .preview-flex-growinput').val('unset').trigger('change');
}
});
$editpanel.on('change', '.mfn-element-fields-wrapper .header_menu.justify-content_tablet .preview-justify-content_tabletinput', function() {
var val = $(this).val();
if( val == 'center' || val == 'flex-end' || val == 'flex-start' ){
$('.mfn-element-fields-wrapper .header_menu.flex-grow_tablet .preview-flex-grow_tabletinput').val('unset').trigger('change');
}
});
$editpanel.on('change', '.mfn-element-fields-wrapper .header_menu.justify-content_laptop .preview-justify-content_laptopinput', function() {
var val = $(this).val();
if( val == 'center' || val == 'flex-end' || val == 'flex-start' ){
$('.mfn-element-fields-wrapper .header_menu.flex-grow_laptop .preview-flex-grow_laptopinput').val('unset').trigger('change');
}
});
$editpanel.on('change', '.mfn-element-fields-wrapper .custom-element-position .mfn-field-value', function() {
var val = $(this).val();
if( !val.length || val == 'unset' ){
$content.find('.'+edited_item.uid).removeClass('mfn-column-absolute');
if( $('.mfn-element-fields-wrapper .mfn_field_desktop.custom-abs-offset-values').length ){
$('.mfn-element-fields-wrapper .mfn_field_'+screen+'.custom-abs-offset-values .mfn-field-value').val('').trigger('change');
}else{
$('.mfn-element-fields-wrapper .custom-abs-offset-values .mfn-field-value').val('').trigger('change');
}
}else if(val == 'absolute'){
$content.find('.'+edited_item.uid).addClass('mfn-column-absolute');
}
});
$editpanel.on('change', '.mfn-element-fields-wrapper .header_menu.justify-content_mobile .preview-justify-content_mobileinput', function() {
var val = $(this).val();
if( val == 'center' || val == 'flex-end' || val == 'flex-start' ){
$('.mfn-element-fields-wrapper .header_menu.flex-grow_mobile .preview-flex-grow_mobileinput').val('unset').trigger('change');
}
});
$editpanel.on('click', '.multiple-inputs a.link', function(e) {
e.preventDefault();
var $editbox = $(this).closest('.multiple-inputs');
historyStorage.allow = false;
if($editbox.hasClass('isLinked')){
$editbox.removeClass('isLinked');
$editbox.find('.disableable input').removeClass('readonly').removeAttr('readonly');
}else{
var thisval = $editbox.find('.form-control .field').first().find('input').val();
$editbox.addClass('isLinked');
$editbox.find('.disableable input').addClass('readonly').attr('readonly', 'readonly');
$editbox.find('.disableable input').val(thisval);
if(!$editbox.hasClass('separated-fields')){
updatePseudoField($editbox);
}else{
$editbox.find('.disableable input').trigger('change');
}
}
historyStorage.allow = true
});
$editpanel.on('change', '.mfn-element-fields-wrapper .query_type .mfn-field-value', function() {
var val = $(this).val();
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
if( val == 'terms' ){
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('category').trigger('change');
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('').trigger('change');
}else if( val == 'posts' ){
$('.mfn-element-fields-wrapper .query_post_type .mfn-field-value').val('post').trigger('change');
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('').trigger('change');
}
});
$editpanel.on('click', '.reset-bg', function(e) {
e.preventDefault();
var bg_switcher = $(this);
if( bg_switcher.hasClass('active') ){
bg_switcher.removeClass('active');
bg_switcher.closest('.mfn-form-row').find('.browse-image').addClass('empty');
bg_switcher.closest('.mfn-form-row').find('.mfn-field-value').val('').trigger('change');
}else{
bg_switcher.addClass('active');
bg_switcher.closest('.mfn-form-row').find('.mfn-field-value').val('none').trigger('change');
}
});
$editpanel.on('change', '.browse-image:not(.multi) .mfn-field-value', function() {
var val = $(this).val();
var imgInput = $(this);
if( val.length ){
uploader.itemsUpdate(val, imgInput);
}
});
$editpanel.on('change', '.height_switcher .mfn-field-value', function(e) {
let val = $(this).val();
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let $el = $edited_div;
if(val == 'full-screen') {
$el.addClass('full-screen');
}else{
$el.removeClass('full-screen');
}
if( !val.length && _.has(edited_item.attr, 'css_advanced_height') ) {
delete( edited_item['attr']['css_advanced_height'] );
loopAllStyleFields(edited_item.uid);
}
});
$editpanel.on('change', '.width_switcher .mfn-field-value', function(e) {
let val = $(this).val();
let uid = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
$content.find('.'+uid).removeClass('mfn-item-inline custom-width full-width default-width mfn-item-custom-width');
if( $content.find('.'+uid).hasClass('mcb-section')){
$content.find('.'+uid).addClass(val+'-width');
}else{
if(val == 'inline') {
$content.find('.'+uid).addClass('mfn-item-inline');
}else if(val == 'custom') {
$content.find('.'+uid).addClass('mfn-item-custom-width');
if( $('.mfn-form-row.inline-style-input.flex-grow .mfn-field-value').length ) $('.mfn-form-row.inline-style-input.flex-grow .mfn-field-value').val('unset').trigger('change');
if( $('.mfn-form-row.inline-style-input.flex-grow_laptop .mfn-field-value').length ) $('.mfn-form-row.inline-style-input.flex-grow_laptop .mfn-field-value').val('unset').trigger('change');
if( $('.mfn-form-row.inline-style-input.flex-grow_tablet .mfn-field-value').length ) $('.mfn-form-row.inline-style-input.flex-grow_tablet .mfn-field-value').val('unset').trigger('change');
if( $('.mfn-form-row.inline-style-input.flex-grow_mobile .mfn-field-value').length ) $('.mfn-form-row.inline-style-input.flex-grow_mobile .mfn-field-value').val('unset').trigger('change');
}
}
if( !val.length || val == 'inline' ){
if( $('.mfn-ui .panel-edit-item .mfn-form .modalbox-card-advanced .inline-style-input.max-width .mfn-form-input').length ){
$('.mfn-ui .panel-edit-item .mfn-form .modalbox-card-advanced .inline-style-input.max-width .mfn-form-input').val('').trigger('change');
}
$('.mfn-ui .panel-edit-item .mfn-form .modalbox-card-advanced .advanced_flex .mfn-field-value').val('').trigger('change');
if( screen == 'desktop' ){
$builder.find('.'+uid).attr('data-desktop-size', edited_item.size);
$builder.find('.'+uid).find('.mfn-header').first().find('.mfn-size-label span').text(edited_item.size);
}else if( screen == 'laptop' ){
$builder.find('.'+uid).attr('data-desktop-size', edited_item.laptop_size);
$builder.find('.'+uid).find('.mfn-header').first().find('.mfn-size-label span').text(edited_item.laptop_size);
}else if( screen == 'tablet' ){
$builder.find('.'+uid).attr('data-desktop-size', edited_item.tablet_size);
$builder.find('.'+uid).find('.mfn-header').first().find('.mfn-size-label span').text(edited_item.tablet_size);
}else if( screen == 'mobile' ){
$builder.find('.'+uid).attr('data-desktop-size', edited_item.mobile_size);
$builder.find('.'+uid).find('.mfn-header').first().find('.mfn-size-label span').text(edited_item.mobile_size);
}
}
setTimeout(function() {
setSizeLabels();
if($('body').hasClass('mfn-navigator-active') ) be_navigator.show(edited_item.uid);
}, 200);
});
$editpanel.on('change', '.mfn-layout-modifier .mfn-field-value', function() {
let uid = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
reLayoutIsotope( uid );
});
function reLayoutIsotope( uid ) {
if( !$content.find('.'+uid+' .masonry').length ) return;
setTimeout(function() {
iframe.jQuery('.'+uid+' .masonry').isotope('layout'); // isotope
}, 200);
}
$editpanel.on('change', '.mfn-form-row.bgposopt select', function() {
if( $(this).val() != 'custom' && _.has(edited_item['attr'], 'css_advanced_background_position_v2') ){
delete(edited_item['attr']['css_advanced_background_position_v2']);
sidebar_form.render();
loopAllStyleFields(edited_item.uid);
}
});
$editpanel.on('change', '.mfn-form-row.custombgsize select', function() {
if( $(this).val() != 'custom' && _.has(edited_item['attr'], 'css_advanced_background_size_v2') ) {
delete(edited_item['attr']['css_advanced_background_size_v2']);
sidebar_form.render();
loopAllStyleFields(edited_item.uid);
}
});
$editpanel.on('click', '.multiple-inputs a.inset', function(e) {
e.preventDefault();
var $editbox = $(this).closest('.multiple-inputs');
if($editbox.hasClass('isInset')){
$editbox.removeClass('isInset');
$editbox.find('input.boxshadow-inset').val('');
}else{
var thisval = $editbox.find('.field input').val();
$editbox.addClass('isInset');
$editbox.find('input.boxshadow-inset').val('inset');
}
updatePseudoField($editbox);
});
// animation
$editpanel.on('change', '.preview-animateinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let $edited_box = $edited_div;
let val = $(this).val();
$edited_box.removeClass('animate fadeIn fadeInUp fadeInDown fadeInLeft fadeInRight fadeInUpLarge fadeInDownLarge fadeInLeftLarge fadeInRightLarge zoomIn zoomInUp zoomInDown zoomInLeft zoomInRight zoomInUpLarge zoomInDownLarge zoomInLeftLarge bounceIn bounceInUp bounceInDown bounceInLeft bounceInRight');
if(val.length){
$edited_box.addClass('animate '+val);
}
});
// mask shape
function maskShapeGetAttrs( el ) {
const formInputVal = $(el).find('.mfn-form-select').val();
const sectionName = $(el).closest('.mfn-element-fields-wrapper').attr('data-element');
const sectionDom = $("iframe#mfn-vb-ifr").contents().find('body').find('.'+sectionName);
return {formInputVal, sectionName, sectionDom};
}
let maskShapeConditionalArray = [];
function maskShapeHideChildrenConditional( el ) {
const isMaskShapeEnabled = "None" !== $(el).find('[data-name="mask_shape_type"] select option:selected').text();
//Hide
if ( !isMaskShapeEnabled ) {
maskShapeConditionalArray = [];
let isPositionEnabled = "Custom" === $(el).find('[data-name="mask_shape_position"] select option:selected').text();
let isSizeEnabled = "Custom" === $(el).find('[data-name="mask_shape_size"] select option:selected').text() ;
if ( isPositionEnabled ) {
const hiddenInputX = $(el).find('[data-name="-webkit-mask-position-x"]');
const hiddenInputY = $(el).find('[data-name="-webkit-mask-position-y"]');
maskShapeConditionalArray.push(hiddenInputX, hiddenInputY);
}
if ( isSizeEnabled ) {
const hiddenInput = $(el).find('[data-name="-webkit-mask-size"]');
maskShapeConditionalArray.push(hiddenInput);
}
setTimeout(function(){
maskShapeConditionalArray.forEach(element => {
$(element).removeClass('conditionally-show');
$(element).addClass('conditionally-hide');
});
}, 0 )
return;
}
//Display
maskShapeConditionalArray.forEach(element => {
$(element).addClass('conditionally-show');
$(element).removeClass('conditionally-hide');
});
return;
}
$editpanel.on('change', '.heading.background-image:not(.activeif-background_switcher_adv)', function() {
const formInputVal = $(this).find('.mfn-form-input').val();
const {sectionDom } = maskShapeGetAttrs($(this));
const titleDom = $(sectionDom).find('.title');
if(formInputVal.length > 0){
$(titleDom).addClass('mfn-mask-shape');
} else {
$(titleDom).removeClass('mfn-mask-shape');
}
})
$editpanel.on('change', '.mask_shape_type', function() {
const {formInputVal, sectionDom } = maskShapeGetAttrs($(this));
const availableStyles = ['circle', 'blob', 'blob-2', 'brush', 'brush-2', 'cross', 'irregular-circle', 'stain', 'triangle', 'custom'];
const itemName = sectionDom.hasClass('column_image') ? 'image' : 'video';
const shapeContainer = itemName === 'image' ? $(sectionDom).find('.image_frame') : $(sectionDom).find('.content_video');
const parentContainer = $(this).closest('.mfn-element-fields-wrapper');
availableStyles.forEach(style => {
$( shapeContainer ).removeClass(style);
})
if(parseInt(formInputVal) == 0 ){
if( shapeContainer.hasClass('mfn-mask-shape') ){
$(shapeContainer).removeClass('mfn-mask-shape');
}
maskShapeHideChildrenConditional(parentContainer);
} else {
if( !shapeContainer.hasClass('mfn-mask-shape') ){
$(shapeContainer).addClass('mfn-mask-shape');
}
maskShapeHideChildrenConditional(parentContainer);
$( shapeContainer ).addClass( formInputVal );
}
})
$editpanel.on('change', '.mask_shape_size', function() {
const {formInputVal, sectionName, sectionDom } = maskShapeGetAttrs($(this));
//itemName variable must be here, because heading does not have custom size/position
const itemName = sectionDom.hasClass('column_image') ? 'image' : 'video';
const shapeContainer = itemName === 'image' ? $(sectionDom).find('img') : $(sectionDom).find('video, iframe');
if(formInputVal !== 'custom' ){
shapeContainer.css('mask-size', formInputVal);
} else {
var sizeAppended = $(this).closest('.mfn-element-fields-wrapper').find('.-webkit-mask-size .mfn-sliderbar-value').val();
shapeContainer.css('mask-size', `${sizeAppended}%`);
}
})
$editpanel.on('change', '.mask_shape_position', function() {
const {formInputVal, sectionName, sectionDom } = maskShapeGetAttrs($(this));
//itemName variable must be here, because heading does not have custom size/position
const itemName = sectionDom.hasClass('column_image') ? 'image' : 'video';
const shapeContainer = itemName === 'image' ? $(sectionDom).find('img') : $(sectionDom).find('video, iframe');
if(formInputVal !== 'custom' ){
const positions = formInputVal.split(' ');
shapeContainer.css('mask-position-y', positions[0]);
shapeContainer.css('mask-position-x', positions[1]);
}
})
$editpanel.on('change', '.banner_box.bb_badge_pos .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
$builder.find('.'+it+' .banner-badge').removeClass('banner-badge-top-right banner-badge-top-left banner-badge-bottom-right banner-badge-bottom-left');
if( val.length ){
$builder.find('.'+it+' .banner-badge').addClass('banner-badge-'+val);
}else{
$builder.find('.'+it+' .banner-badge').addClass('banner-badge-top-right');
}
});
$editpanel.on('change', '.banner_box.hover_effect .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
$builder.find('.'+it+' .mfn-banner-box').removeClass('mfn-banner-box-image-toggle mfn-banner-box-image-zoom-in mfn-banner-box-image-zoom-out mfn-banner-box-image-blur');
if( val.length ){
$builder.find('.'+it+' .mfn-banner-box').addClass('mfn-banner-box-image-'+val);
}
});
$editpanel.on('change', '.banner_box.cta_hover_effect .mfn-field-value', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
$builder.find('.'+it+' .mfn-banner-box').removeClass('mfn-banner-box-cta-zoom-in');
if( val.length ){
$builder.find('.'+it+' .mfn-banner-box').addClass('mfn-banner-box-image-'+val);
}
});
// shape divider
function shapeDividerGetAttrs( el ) {
const sectionName = $(el).closest('.mfn-element-fields-wrapper').attr('data-element');
const sectionDom = $content.find('.'+sectionName);
const inputName = $(el).attr('data-name');
const inputValue = $(el).find('.mfn-field-value').val();
const checkboxValue = $(el).find('li.active input[type="checkbox"]').val();
const shapeDividerPosition = inputName.match(/top|bottom/).toString();
const shapeDividerDom = $(sectionDom).find('.mfn-shape-divider[data-name="'+ shapeDividerPosition +'"]');
let invertValue = $(el).siblings('.shape_divider_invert_'+shapeDividerPosition).find('li.active input[type="checkbox"]').val();
let shapeDividerOptions = inputName.match(/flip|bring_front/);
if (shapeDividerOptions != null){
shapeDividerOptions = shapeDividerOptions.toString();
}
return {inputName, inputValue, checkboxValue, sectionName, sectionDom, shapeDividerPosition, shapeDividerDom, shapeDividerOptions, invertValue};
}
$editpanel.on('change', '.shape_divider_type_top, .shape_divider_type_bottom', function() {
const { inputValue, shapeDividerPosition, sectionDom, invertValue } = shapeDividerGetAttrs($(this));
let { shapeDividerDom } = shapeDividerGetAttrs($(this));
let svgLocation = $(shapeDividerDom).find('svg');
let currentTabView = $('.panel-edit-item');
// empty value
if( ! inputValue ){
svgLocation.html('<path></path>');
return;
}
// invert
let invertValSet = currentTabView.find('.shape_divider_invert_'+ shapeDividerPosition +' li.active input').val();
invertValSet = parseInt(invertValSet);
let key = 'svg';
if( invertValSet && ( 'invert' in mfn.shape_dividers[inputValue] ) ) {
key = 'invert';
} else {
invertValSet = 0;
}
shapeDividerDom.attr('data-invert',invertValSet);
// viewbox
let viewbox = '0 0 1200 120';
if( 'viewbox' in mfn.shape_dividers[inputValue] ){
viewbox = mfn.shape_dividers[inputValue]['viewbox'];
}
svgLocation.attr('viewBox',viewbox);
// get path
const rand = Math.random().toString(36).substring(8);
const regex = /mfn-uid-/g;
let pathVal = mfn.shape_dividers[inputValue][key].replace( regex, 'mfn-uid-'+ rand );
svgLocation.html(pathVal);
});
$editpanel.on('change', '.shape_divider_flip_top, .shape_divider_invert_top, .shape_divider_bring_front_top, .shape_divider_flip_bottom, .shape_divider_invert_bottom, .shape_divider_bring_front_bottom', function() {
const { shapeDividerDom, inputName, checkboxValue, shapeDividerPosition } = shapeDividerGetAttrs($(this));
let svgLocation = $(shapeDividerDom).find('svg');
let toChange;
switch(inputName){
case 'shape_divider_flip_'+ shapeDividerPosition:
$(shapeDividerDom).attr('data-flip', checkboxValue); //0 or 1
break;
case 'shape_divider_invert_'+ shapeDividerPosition:
svgLocation = $(shapeDividerDom).closest('.be-custom-shape');
$(shapeDividerDom).attr('data-invert', checkboxValue); //0 or 1
//Invert is chaning the "D" path, so we need to update it
const typeSwitch = $(this).siblings('div[data-name="shape_divider_type_'+shapeDividerPosition+'"]');
$(typeSwitch).trigger('change');
break;
case 'shape_divider_bring_front_'+ shapeDividerPosition:
$(shapeDividerDom).attr('data-bring-front', checkboxValue); //0 or 1
$(svgLocation).css('z-index', toChange);
break;
}
});
// decoration svgs
$editpanel.on('change', '.preview-dividerinput', function() {
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
if($content.find('.'+it+' .section-divider').length){
$content.find('.'+it+' .section-divider').removeClass('circle up square triangle triple-triangle down').addClass(val);
}else if(val != ''){
$edited_div.append('<div class="section-divider '+val+'"></div>');
}
});
// segmented options multi segmented
$editpanel.on('click', '.multiple-segmented-options.segmented-options ul li a', function(e) {
e.preventDefault();
let $editbox = $(this).closest('.mfn-form-row');
let $li = $(this).closest('li');
let it = $editbox.closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $li.find('input').val();
let id = $li.find('input').attr('name');
let this_div = $content.find('.'+it);
if( $editbox.hasClass('header_icon_desc_visibility') ) {
this_div = $content.find('.'+it+' .mfn-header-icon-box .desc-wrapper');
}
if($li.hasClass('active')){
$li.find('input').prop('checked', false);
$li.removeClass('active');
this_div.removeClass(val);
}else{
// max 2/3 in responsive visibility
if( $editbox.hasClass('visibility') && $editbox.find('ul li.active').length == 3 ) return;
$li.addClass('active');
$li.find('input').prop('checked', true);
this_div.addClass(val);
}
var value = '';
$('li input:checked', $editbox).each(function() {
value = value + ' ' + $(this).val();
});
if( $li.closest('.segmented-option').hasClass('mfn-placeholder-inherited-class') ) $li.closest('.segmented-option').removeClass('mfn-placeholder-inherited-class');
if( $li.closest('.segmented-option').hasClass('mfn-placeholder-inherited-rwd') ) $li.closest('.segmented-option').removeClass('mfn-placeholder-inherited-rwd');
if( value.length ){
edited_item['attr'][id] = value;
}else{
delete(edited_item['attr'][id]);
}
be_navigator.responsive(value, edited_item.uid, true);
/*var value = '';
$('li input:checked', $editbox).each(function() {
value = value + ' ' + $(this).val();
});
$hiddeninput.val(value).trigger('change');*/
});
// gradient input change
$editpanel.on('change', '.mfn-form-row.gradient .mfn-form-control', function() {
let $editbox = $(this).closest('.mfn-form-row');
gradientValue($editbox);
});
// pseudo checkbox
$editpanel.on('click', '.checkboxes ul li', function() {
let $input = $(this).find('input');
let $editbox = $(this).closest('.mfn-form-row');
let input_name = $input.attr('name');
let val = $input.val();
let windowH = $(window).height() || 0;
if($(this).hasClass('active')){
$input.prop('checked', false).trigger('change');
$(this).removeClass('active');
if( $editbox.closest('.mfn-element-fields-wrapper').length ) $edited_div.removeClass(val);
if($editbox.hasClass('mfn-type-section') && val == 'full-screen'){
let it = $editbox.closest('.mfn-element-fields-wrapper').attr('data-element');
$edited_div.css({'min-height': '50px'});
$content.find('.'+it+' .section_wrapper').css({'padding-top': 0, 'padding-bottom': 0});
}
}else{
$(this).addClass('active');
$input.prop('checked', true).trigger('change');
if( $editbox.closest('.mfn-element-fields-wrapper').length ) $edited_div.addClass(val);
}
if( $editbox.find( '.checkboxes.pseudo' ).length ){
var value = '';
$('li input:checked', $editbox).each(function() {
value = value + ' ' + $(this).val();
});
edited_item['attr'][input_name] = value;
$('.value', $editbox).val(value).trigger('change');
}else if( typeof edited_item['attr'] !== 'undefined' && typeof edited_item['attr'][input_name] !== 'undefined' ){
//$input.trigger('change');
delete(edited_item['attr'][input_name])
}
});
// radio img
$editpanel.on('click', '.visual-options ul li a', function(e) {
e.preventDefault();
let $li = $(this).closest('li');
let $editbox = $li.closest('.mfn-form-row');
let $edit_wrapper = $li.closest('.mfn-element-fields-wrapper');
let it = $edit_wrapper.attr('data-element');
let val = $li.find('input').val();
if(!$li.hasClass('active')){
$editbox.find('li').removeClass('active');
$editbox.find('li').find('input').prop('checked', false);
$li.addClass('active');
$li.find('input').prop('checked', true).trigger('change');
}
if( $editbox.hasClass('themeoption layout') ){
// themeoption layout
$content.find('body').removeClass('layout-boxed layout-full-width').addClass('layout-'+val);
}
if( $editbox.hasClass('themeoption style') ){
// themeoption style
$content.find('body').removeClass('style-default style-simple');
if( val.length ){
$content.find('body').addClass('style-simple');
}else{
$content.find('body').addClass('style-default');
}
}
if( $editbox.hasClass('popup_position') ){
$editbox.find('input[name="popup_position"]').each(function() {
$content.find('.mfn-popup-tmpl').removeClass('mfn-popup-tmpl-'+$(this).val());
});
$content.find('.mfn-popup-tmpl').addClass('mfn-popup-tmpl-'+val);
}
if( $editbox.hasClass('sidemenu_position') ){
$content.find('.mfn-sidemenu-tmpl').removeClass('mfn-sidemenu-align-right mfn-sidemenu-align-left');
if( val.length ){
$content.find('.mfn-sidemenu-tmpl').addClass('mfn-sidemenu-align-'+val);
}else{
$content.find('.mfn-sidemenu-tmpl').addClass('mfn-sidemenu-align-left');
}
}
if( $editbox.hasClass('watchChanges') ){
var id = $editbox.attr('id');
mfnoptsinputs.getField(id, val);
}
});
$editpanel.on('change', '.panel-view-options .option.popup_close_button_active .mfn-field-value', function() {
let val = $(this).val();
$content.find('.mfn-popup-tmpl').removeClass('mfn-popup-tmpl-close-button-hidden');
if( val == '' ){
$content.find('.mfn-popup-tmpl').addClass('mfn-popup-tmpl-close-button-hidden');
}
});
$editpanel.on('change', '.panel-view-options .option.sidemenu_close_button_active .mfn-field-value', function() {
let val = $(this).val();
$content.find('.mfn-sidemenu-tmpl').removeClass('mfn-sidemenu-closebutton-hidden mfn-sidemenu-closebutton-active');
if( val.length ){
$content.find('.mfn-sidemenu-tmpl').addClass('mfn-sidemenu-closebutton-active');
}else{
$content.find('.mfn-sidemenu-tmpl').addClass('mfn-sidemenu-closebutton-hidden');
}
});
$editpanel.on('change', '.panel-view-options .option.popup_width .mfn-field-value', function() {
let val = $(this).val();
$content.find('.mfn-popup-tmpl').removeClass('mfn-popup-tmpl-full-width mfn-popup-tmpl-width-default mfn-popup-tmpl-custom-width');
if( val.length ){
$content.find('.mfn-popup-tmpl').addClass('mfn-popup-tmpl-'+val);
}else{
$content.find('.mfn-popup-tmpl').addClass('mfn-popup-tmpl-width-default');
}
});
$editpanel.on('change', '.panel-view-options .option.popup_close_button_align .mfn-field-value', function() {
let val = $(this).val();
$content.find('.mfn-popup-tmpl').removeClass('mfn-popup-close-button-right mfn-popup-close-button-left');
if( val.length ){
$content.find('.mfn-popup-tmpl').addClass('mfn-popup-close-button-'+val);
}else{
$content.find('.mfn-popup-tmpl').addClass('mfn-popup-close-button-right');
}
});
$editpanel.on('change', '.panel-view-options .sidemenu_close_button_align .mfn-field-value', function() {
let val = $(this).val();
$content.find('.mfn-sidemenu-tmpl').removeClass('mfn-sidemenu-close-button-left mfn-sidemenu-close-button-right');
if( val.length ){
$content.find('.mfn-sidemenu-tmpl').addClass('mfn-sidemenu-close-button-'+val);
}else{
$content.find('.mfn-sidemenu-tmpl').addClass('mfn-sidemenu-close-button-right');
}
});
$editpanel.on('click', '.mfn-form-row .color-picker .form-control .color-picker-vb:not(.mfn-initialized)', function() {
if( !$(this).hasClass('mfn-initialized') ){
$(this).addClass('mfn-initialized');
var $this_input = $(this);
var cp_selector = 'color-picker-vb-'+getUid();
var $edit_field = $(this).closest('.mfn-form-row');
var $edit_wrapper = $(this).closest('.mfn-element-fields-wrapper');
var element = $edit_wrapper.attr('data-element');
var css_style = $edit_field.attr('data-name');
var css_path = $edit_field.attr('data-csspath');
if( $edit_field.hasClass('themeoption') ){
css_style = $edit_field.attr('data-style');
}
var default_color = $this_input.val().length ? $this_input.val() : '#000';
$this_input.addClass(cp_selector+' mfn-initialized');
const inputElement = document.querySelector( '.'+cp_selector );
const mfnPickr = Pickr.create({
el: inputElement,
theme: 'nano',
useAsButton: true,
defaultRepresentation: 'HEX',
default: default_color,
comparison: true,
swatches: color_palette,
components: {
palette: true,
preview: true,
opacity: true,
hue: true,
interaction: {
hex: false,
rgba: false,
hsla: false,
hsva: false,
cmyk: false,
input: true,
clear: true,
save: true
}
},
}).on('init', (color, instance) => {
sidebar_form.no_render = true;
mfnPickr.show();
}).on('show', (color, instance) => {
if( $this_input.val().length && $this_input.val().includes('#') && $this_input.val() != color.toHEXA().toString(0) ) {
mfnPickr.setColor($this_input.val());
mfnPickr.show();
}
sidebar_form.no_render = true;
$('.sidebar-wrapper').addClass('mfn-vb-sidebar-overlay');
}).on('hide', (color, instance) => {
if( $this_input.val().length ) mfnPickr.setColor($this_input.val());
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
if(css_path && !$edit_field.hasClass('fancy_divider')){
setTimeout(function() {
changeInlineStyles(css_path, css_style, 'remove');
}, 50);
}
sidebar_form.no_render = false;
}).on('save', color => {
mfnPickr.hide();
}).on('change', (color, source, instance) => {
if( isBlocks() ) return;
var cl = color.toHEXA().toString(0);
if( color.a < 1 ) cl = color.toRGBA().toString(0).replaceAll(' ', '');
$this_input.val( cl );
if( $edit_field.hasClass('inline-style-input') && $edit_field.hasClass('option') ){
$this_input.trigger('change');
}
if($edit_field.hasClass('fancy_divider color_top')){
changeFancyDividerColorTop($edit_wrapper.attr('data-element'), $edit_wrapper.attr('data-group'), cl);
}else if($edit_field.hasClass('fancy_divider color_bottom')){
changeFancyDividerColorBottom($edit_wrapper.attr('data-element'), $edit_wrapper.attr('data-group'), cl);
}else if($edit_field.hasClass('widget-chart color')){
changeColorChart($edit_wrapper.attr('data-element'), cl);
}else if(typeof edited_item.type !== 'undefined' && edited_item.type == 'list_2'){
// prevent local styles change
}else if(typeof css_path !== 'undefined' ){
changeInlineStyles(css_path, css_style, cl);
}
$(inputElement).closest('.color-picker-group').find('.form-addon-prepend .label').css('border-color', cl).css('background-color', cl);
$(inputElement).closest('.color-picker-group').find('.form-addon-prepend .label').removeClass('light dark').addClass(getContrastYIQ( color.toHEXA().toString(0) ));
}).on('changestop', (source, instance) => {
var cl = instance._color.toHEXA().toString(0);
if(typeof css_path == typeof undefined && $edit_field.hasClass('widget-chart color')){
$this_input.val( cl ).trigger('change');
return;
}
if( instance._color.a < 1 ) cl = instance._color.toRGBA().toString(0).replaceAll(' ', '');
$this_input.val( cl ).trigger('change');
if(typeof edited_item.type !== 'undefined' && edited_item.type == 'list_2'){
// prevent local styles change
return;
}
if(css_path && !$edit_field.hasClass('fancy_divider')){
setTimeout(function() {
changeInlineStyles(css_path, css_style, 'remove');
}, 50);
}
}).on('swatchselect', (source, instance) => {
if(!css_path && $edit_field.hasClass('widget-chart color')){
$this_input.val( instance._color.toHEXA().toString(0) ).trigger('change');
return;
}
$this_input.val( instance._color.toHEXA().toString(0) ).trigger('change');
if(typeof edited_item.type !== 'undefined' && edited_item.type == 'list_2'){
// prevent local styles change
return;
}
if(css_path && !$edit_field.hasClass('fancy_divider')){
setTimeout(function() {
changeInlineStyles(css_path, css_style, 'remove');
}, 50);
}
}).on('clear', instance => {
mfnPickr.hide();
$edit_field.find('.color-picker-clear').trigger('click');
});
}
})
// color picker
$editpanel.on('change', '.mfn-form-row .color-picker-vb', function(e){
e.preventDefault();
var $field = $(this);
var color = $field.val();
if( color.length == 6 && !color.includes('#') ){
$field.val('#'+color).trigger('change');
return;
}
if( color == '#fff' ){
$field.val('#ffffff').trigger('change');
return;
}
if( color.length ){
$field.closest('.color-picker-group').find('.form-addon-prepend .label').css('border-color', color).css('background-color', color);
$field.closest('.color-picker-group').find('.form-addon-prepend .label').removeClass('light dark').addClass(getContrastYIQ( color ));
}else{
$field.closest('.color-picker-group').find('.form-addon-prepend .label').removeAttr('style').removeClass('dark').addClass('light');
}
});
$editpanel.on('click', '.color-picker-clear', function(e){
e.preventDefault();
let $edit_wrapper = $(this).closest('.mfn-element-fields-wrapper');
let $editfield = $(this).closest('.mfn-form-row');
let $group = $(this).closest('.color-picker-group');
let csspath = $editfield.attr('data-csspath');
let cssstyle = $editfield.attr('data-name');
if( !$group.find('.color-picker-vb').val().length ) return
if($editfield.hasClass('gradient')) {
$editfield.find('.color-picker-vb').val('').trigger('change');
}else if($editfield.hasClass('box-shadow')) {
$group.find('.color-picker-vb').val('').trigger('change');
$editfield.find('.field input').val('').trigger('change');
}else{
$group.find('.color-picker-vb').val('').trigger('change');
}
if( $editfield.find('.multiple-inputs .pseudo-field.mfn-field-value').length ){
updatePseudoField( $editfield.find('.multiple-inputs') );
}else if($editfield.hasClass('fancy_divider color_top')){
changeFancyDividerColorTop($edit_wrapper.attr('data-element'), $edit_wrapper.attr('data-group'), 'remove');
}else if($editfield.hasClass('fancy_divider color_bottom')){
changeFancyDividerColorBottom($edit_wrapper.attr('data-element'), $edit_wrapper.attr('data-group'), 'remove');
}
//changeInlineStyles(csspath, cssstyle, 'remove');
$group.find('.form-addon-prepend .label').removeAttr('style').removeClass('dark').addClass('light');
});
$editpanel.on('click', '.color-picker-open', function(e){
e.preventDefault();
let $group = $(this).closest('.color-picker-group');
$('.form-control .mfn-form-input', $group).trigger('click');
});
$editpanel.on('blur', '.custom_css .preview-custom_cssinput', function() {
// inline styles column
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
let styles = val.split(';');
$.each(styles, function( i, v ) {
if(v.trim()){
let st_expl = v.split(':');
if(st_expl[0] && st_expl[1]){
changeInlineStyles('.'+it, st_expl[0], st_expl[1]);
}
}
});
}).on('focus', '.custom_css .preview-custom_cssinput', function() {
// inline styles column
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
let styles = val.split(';');
$.each(styles, function( i, v ) {
if(v.trim()){
let st_expl = v.split(':');
if(st_expl[0] && st_expl[1]){
changeInlineStyles('.'+it, st_expl[0], 'remove');
}
}
});
});
/**
*
* DEPRECATED FIELDS
*
* */
// column inline css
$editpanel.on('blur', '.column.style .preview-styleinput', function() {
// inline styles column
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
let styles = val.split(';');
$.each(styles, function( i, v ) {
if(v.trim()){
let st_expl = v.split(':');
if(st_expl[0] && st_expl[1]){
changeInlineStyles('.'+it+' .column_attr', st_expl[0], st_expl[1]);
}
}
});
}).on('focus', '.column.style .preview-styleinput', function() {
// inline styles column
let it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
let val = $(this).val();
let styles = val.split(';');
$.each(styles, function( i, v ) {
if(v.trim()){
let st_expl = v.split(':');
if(st_expl[0] && st_expl[1]){
changeInlineStyles('.'+it+' .column_attr', st_expl[0], 'remove');
}
}
});
});
/**
*
* END DEPRECATED FIELDS
*
* */
$(document).on('click', '.mfn-fr-help-icon', function(e) {
e.preventDefault();
if( $(this).closest('div').find('.desc-group').is(':visible') ){
$(this).closest('div').find('.desc-group').slideUp(300);
}else{
$(this).closest('div').find('.desc-group').slideDown(300);
}
});
$editpanel.on('mouseover', '.panel-edit-item .tabs-wrapper:not(.mfn-initialized)', function() {
tabsField.sortable();
});
function updatePseudoField($box) {
var value = '';
var is_empty = true;
$box.find('.field input').each(function(i) {
if( $(this).val().length ) {
value += i == 0 ? $(this).val() : ' '+$(this).val();
is_empty = false;
}else if( !$(this).val().length && !$(this).hasClass('boxshadow-inset') ) {
value += i == 0 ? '0' : ' 0';
}
});
$box.find('input.pseudo-field').val(is_empty ? '' : value).trigger('change');
setTimeout( historyStorage.add, 200 );
}
// global functions
// import element
function importFromClipboard(u, w){
let import_clipboard = localStorage.getItem('mfn-builder') ? JSON.parse(localStorage.getItem('mfn-builder')) : {};
if( import_clipboard.clipboard && !$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-import').hasClass('pending') ){
$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-import').addClass('pending');
$.ajax({
url: mfnajaxurl,
data: {
action: 'importfromclipboard',
'mfn-builder-nonce': wpnonce,
import: import_clipboard.clipboard,
id: pageid,
type: 'section'
},
type: 'POST',
success: function(response){
if( w == 'replace' ){
$content.find('.vb-item[data-uid="' +u+ '"]').after(response.html.replace('mfn-default-section', 'mfn-'+elements_ver+'-section').replace('mfn-cart-empty-section', 'mfn-'+elements_ver+'-section')).remove();
}else if( w == 'after' ){
$content.find('.vb-item[data-uid="' +u+ '"]').after(response.html.replace('mfn-default-section', 'mfn-'+elements_ver+'-section').replace('mfn-cart-empty-section', 'mfn-'+elements_ver+'-section'));
}else{
$content.find('.vb-item[data-uid="' +u+ '"]').before(response.html.replace('mfn-default-section', 'mfn-'+elements_ver+'-section').replace('mfn-cart-empty-section', 'mfn-'+elements_ver+'-section'));
}
$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-import').removeClass('pending');
var new_uid = false;
$.each(response.form, function(i, el) {
if( el.jsclass == 'section' ) {
new_uid = el.uid;
el.ver = elements_ver;
}
mfn.pagedata.push(el);
});
loopAllStyleFields();
inlineEditor();
blink();
be_layout.emptys.sections();
be_layout.emptys.wraps();
if( $('body').hasClass('mfn-navigator-active') ) be_navigator.show( new_uid );
runAjaxElements();
}
});
}
}
// export element
function elementToClipboard(u){
if( !$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-export').hasClass('pending') ){
$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-export').addClass('pending');
var formData = prepareForm.get( u );
var btnText = $content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-export').text();
$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-export').html('<span class="mfn-icon mfn-icon-check-blue"></span> Exported');
setTimeout(function(){
$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-export').html('<span class="mfn-icon mfn-icon-export"></span> Export section');
$content.find('.vb-item[data-uid="' +u+ '"] .mfn-section-export').removeClass('pending');
}, 1000);
$content.find('.section-header .mfn-disabled').removeClass('mfn-disabled');
localStorage.setItem( 'mfn-builder', JSON.stringify({
clipboard: formData
}) );
mfnbuilder.clipboard = formData;
}
}
// export/import - import submit
$('.mfn-import-button').on('click', function(e) {
e.preventDefault();
var single = 0; // import single section only
if(!$('.mfn-import-button').hasClass('loading')){
if($('#import-data-textarea.mfn-import-field').val().length){
$('.mfn-import-button').addClass('loading disabled');
var type = $('.panel-export-import-import .mfn-import-type').val();
if( $('body').hasClass('mfn-template-section') || $('body').hasClass('mfn-template-wrap') ){
single = 1;
type = 'replace';
}
$.ajax({
url: mfnajaxurl,
data: {
action: 'importdata',
'mfn-builder-nonce': wpnonce,
import: $('#import-data-textarea.mfn-import-field').val(),
single: single,
count: 0,
id: samplecontentid ? samplecontentid : pageid
},
type: 'POST',
success: function(response){
$('.mfn-import-button').removeClass('loading disabled');
if( type == 'after' ){
$builder.append(response.html);
}else if( type == 'before' ){
$builder.prepend(response.html);
}else{
$builder.html(response.html);
}
$.each(response.form, function(i, el) {
// Load Global Section/Wrap CSS
if( el.mfn_global_section_id || (el.attr && el.attr.global_wraps_select) ) {
const globalId = el.mfn_global_section_id ? el.mfn_global_section_id : el.attr.global_wraps_select;
$content.find('head').append(`<link rel="stylesheet" type="text/css" href='${mfn.site_url}/wp-content/uploads/betheme/css/post-${globalId}.css' />`);
}
mfn.pagedata.push(el);
});
if( $content.find('.vb-item .mfn-lottie-wrapper .lottie').length ){
$content.find('.vb-item .mfn-lottie-wrapper .lottie').each(function() {
$(this).attr('id', 'mfn_lottie_'+getUid());
$(this).closest('.vb-item').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
re_render();
});
}
loopAllStyleFields();
blink();
be_layout.emptys.sections();
be_layout.emptys.wraps();
mfnChart();
inlineEditor();
runAjaxElements();
}
});
}else{
alert('Import input cannot be empty');
}
}else{
alert('Loading. Please wait');
}
});
// export/import - import single page
$('.mfn-import-single-page-button').on('click', function(e) {
e.preventDefault();
var import_place = $('.panel-export-import-single-page .mfn-import-type').val();
if(!$('.mfn-import-single-page-button').hasClass('loading')){
if($('#mfn-items-import-page').val().length){
$('.mfn-import-single-page-button').addClass('loading disabled');
$.ajax({
url: mfnajaxurl,
data: {
action: 'importsinglepage',
'mfn-builder-nonce': wpnonce,
import: $('#mfn-items-import-page').val(),
pageid: pageid,
count: 0
},
type: 'POST',
success: function(response){
$('.mfn-import-single-page-button').removeClass('loading disabled');
removeStartBuilding();
if(import_place == 'before'){
$builder.prepend(response.html);
//$navigator.find('.navigator-tree').prepend(response.navigator);
}else if(import_place == 'after'){
$builder.append(response.html);
//$navigator.find('.navigator-tree').append(response.navigator);
}else{
$builder.html(response.html);
//$navigator.find('.navigator-tree').html(response.navigator);
}
$('#mfn-items-import-page').val('');
$.each(response.form, function(i, el) {
mfn.pagedata.push(el);
});
loopAllStyleFields();
inlineEditor();
runAjaxElements();
//historyStorage.add();
blink();
be_layout.emptys.sections();
be_layout.emptys.wraps();
//location.reload();
}
});
}else{
alert('Import input cannot be empty');
}
}else{
alert('Loading. Please wait');
}
});
// export/import - builder seo / builder to seo
$('.mfn-builder-export-to-seo-button').on('click', function(e) {
e.preventDefault();
let $seo_button = $(this);
if(!$seo_button.hasClass('loading')){
$seo_button.addClass('loading disabled');
var formData = prepareForm.get();
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnvb_builder_seo',
'mfn-builder-nonce': wpnonce,
sections: formData,
pageid: pageid,
},
type: 'POST',
success: function(response){
$seo_button.removeClass('loading disabled');
$seo_button.find('.btn-wrapper').text('Generated...');
setTimeout(function(){
$seo_button.find('span.btn-wrapper').text('Generate');
},2000);
//location.reload();
}
});
}else{
alert('Loading. Please wait');
}
});
$('.mfn-import-template-button').on('click', function(e) {
e.preventDefault();
if(!$('.mfn-import-template-button').hasClass('loading')){
if($('.mfn-items-import-template li.active').length){
$('.mfn-import-template-button').addClass('loading disabled');
var type = $('.mfn-import-template-type').val();
$.ajax({
url: mfnajaxurl,
data: {
action: 'importtemplate',
'mfn-builder-nonce': wpnonce,
import: $('.mfn-items-import-template li.active').data('id'),
count: 0,
id: $('.mfn-import-template-button').data('id')
},
type: 'POST',
success: function(response){
$('.mfn-import-template-button').removeClass('loading disabled');
removeStartBuilding();
if( type == 'after' ){
$builder.append(response.html);
//$navigator.find('.navigator-tree').append(response.navigator);
}else if( type == 'before' ){
$builder.prepend(response.html);
//$navigator.find('.navigator-tree').prepend(response.navigator);
}else{
$builder.html(response.html);
//$navigator.find('.navigator-tree').html(response.navigator);
}
$.each(response.form, function(i, el) {
mfn.pagedata.push(el);
});
blink();
be_layout.emptys.sections();
be_layout.emptys.wraps();
be_layout.emptys.page();
loopAllStyleFields();
inlineEditor();
runAjaxElements();
}
});
}else{
alert('Choose template first');
}
}else{
alert('Loading. Please wait');
}
});
// preview
$('.mfn-preview-generate').on('click', function(e) {
e.preventDefault();
var $el = $(this),
tooltip = $el.attr('data-tooltip'),
previewURL = $el.attr('data-href');
if(!$el.hasClass('pending')){
$el.attr('data-tooltip', 'Generating preview...');
$el.addClass('pending');
prepareForm.save = true;
var formData = prepareForm.get();
$.ajax({
url: mfnajaxurl,
data: {
sections: formData,
action: 'generatepreview',
gtype: 'mfn-builder-preview',
obj: JSON.stringify(prepareForm.object),
pageid: pageid,
'mfn-builder-nonce': wpnonce,
},
type: 'POST',
success: function(response){
$el.attr('data-tooltip', 'Generate preview');
removeStartBuilding();
if ( ! previewTab || previewTab.closed ) {
previewTab = window.open(response, 'preview' );
if ( previewTab ) {
previewTab.focus();
} else {
alert('Please allow popups to use preview');
}
} else {
previewTab.location.reload();
previewTab.focus();
}
$el.removeClass('pending');
}
});
}
});
// take post editing
$('.take-post-editing').on('click', function(e) {
e.preventDefault();
$el = $(this);
if(!$el.hasClass('loading')){
$el.addClass('loading disabled');
$.ajax({
url: mfnajaxurl,
data: {
action: 'takepostediting',
'mfn-builder-nonce': wpnonce,
pageid: $('.mfn-import-template-button').data('id')
},
type: 'POST',
success: function(response){
$('.mfn-modal-locker').remove();
}
});
}
});
// prebuilts
$(document).on('click', '.mfn-insert-prebuilt', function(e) {
e.preventDefault();
$el = $(this);
if(!$el.hasClass('loading')){
let id = $el.closest('li').data('id');
let count = $content.find('.mcb-section').length;
let isGlobalSectionEditor = $content.find('body').hasClass('mfn-template-section');
$el.addClass('loading disabled');
// be global sections pbl == button on alert false
if( isGlobalSectionEditor ){
if( ! confirm('Using pre-built section will erase all current content in this section.\n\nAre you sure you want to do this?') ) {
return $el.removeClass('loading').removeClass('empty').removeClass('disabled').text('+ '.btnText);
}
}
$.ajax({
url: mfnajaxurl,
data: {
'mfn-builder-nonce': wpnonce,
action: 'insertprebuilt',
id: id,
pageid: pageid,
count: count
},
type: 'POST',
success: function(response){
removeStartBuilding();
//console.log(response);
$el.removeClass('loading').find('.text').text('Done');
// be global sections pbl == remove content, no multiple sections
if ( isGlobalSectionEditor ) {
$($content).find('.mcb-section').remove();
//$($navigator).find('.navigator-section').remove();
}
if( !$content.find('.mcb-section-'+prebuiltType).length || prebuiltType == 'end' ){
$builder.append(response.html);
//$navigator.find('.navigator-tree').append(response.navigator);
}else{
$content.find('.mcb-section-'+prebuiltType).after(response.html);
//$navigator.find('.navigator-tree li.nav-'+$content.find('.mcb-section-'+prebuiltType).attr('data-uid')).after(response.navigator);
}
if( $content.find('.mfn-builder-content .mfn-builder-content .mcb-section').length ){
$content.find('.mfn-builder-content .mfn-builder-content .mcb-section').unwrap();
}
$.each(response.form, function(i, el) {
mfn.pagedata.push(el);
});
if(prebuiltType != 'end'){
let newPreBuiltType = $content.find('.mcb-section-'+prebuiltType).next('.mcb-section').attr('data-uid');
if($content.find('.mcb-section-'+prebuiltType).hasClass('empty')){
var pre_uid = $content.find('.mcb-section-'+prebuiltType).attr('data-uid');
//$navigator.find('.nav-'+pre_uid).remove();
$content.find('.mcb-section-'+prebuiltType).remove();
$('.mfn-form .mfn-vb-'+prebuiltType).remove();
}
prebuiltType = newPreBuiltType;
}else{
prebuiltType = 'end';
}
setTimeout(function(){
$el.removeClass('disabled').find('.text').text('Insert');
},1000);
if( $('body').hasClass('mfn-navigator-active') ) be_navigator.show(prebuiltType);
inlineEditor();
loopAllStyleFields();
blink();
}
});
}else{
alert('Loading. Please wait');
}
});
// set revision
function setRevision(type) {
$list = $('.panel ul.revisions-list[data-type="'+type+'"]');
let formData = prepareForm.get();
$.ajax({
url: mfnajaxurl,
data: {
'sections': formData,
'action': 'setrevision',
'revtype': type,
'mfn-builder-nonce': wpnonce,
'pageid': pageid
},
type: 'POST',
success: function(response){
if(type == 'autosave'){
$('.btn-save-changes').removeClass('loading disabled');
}
if( response == 'empty' ){
$('.mfn-save-revision').removeClass('loading disabled').find('.btn-wrapper').text('Nothing saved');
setTimeout(function() { $('.mfn-save-revision .btn-wrapper').text('Save revision'); }, 2000);
}else{
displayRevisions(response, $list);
if(type == 'revision'){
$('.mfn-save-revision').removeClass('loading disabled').find('.btn-wrapper').text('Saved');
setTimeout(function() { $('.mfn-save-revision .btn-wrapper').text('Save revision'); }, 2000);
}else if(type == 'mfn-builder-preview'){
return true;
}
}
},
error: function(response){
if(type == 'autosave'){
$('.btn-save-changes').removeClass('loading disabled');
}
$('#mfn-preview-wrapper').append('<div style="display: none;" class="mfn-snackbar"><span class="mfn-icon mfn-icon-information"></span><div class="snackbar-message">An error occurred. Please refresh the BeBuilder</div></div>');
$('.mfn-snackbar').fadeIn();
closeSnackbar();
}
});
}
// autosave
if( !mfn.autosave ) setInterval(autosave, 300000);
function autosave(){
if( mfn.view == 'demo' ) return;
if(!$('.btn-save-changes').hasClass('disabled')){
$('.btn-save-changes').addClass('loading disabled');
setRevision('autosave');
}
}
// manual save revision
$('.mfn-save-revision').on('click', function(e) {
if( mfn.view == 'demo' ) return;
if(!$('.mfn-save-revision').hasClass('disabled')){
$('.mfn-save-revision').addClass('loading disabled');
setRevision('revision');
}
});
// restore
$('.revision-restore').on('click', function(e) {
e.preventDefault();
if( mfn.view == 'demo' ) return;
restoreRev($(this));
});
function restoreRev($btn){
if( mfn.view == 'demo' ) return;
if(!$btn.hasClass('disabled')){
$btn.addClass('loading disabled');
$list = $('.panel ul[data-type="backup"]');
$el = $btn.closest('li');
var time = $el.attr('data-time'),
type = $el.closest('ul').attr('data-type'),
btnText = $el.text(),
revision;
$.ajax({
url: mfnajaxurl,
data: {
action: 'restorerevision',
'mfn-builder-nonce': wpnonce,
time: time,
type: type,
pageid: pageid
},
type: 'POST',
success: function(response){
$builder.empty();
mfn.pagedata = [];
$.each(response.form, function(i, el) {
mfn.pagedata.push(el);
});
$builder.append(response.html);
displayRevisions(response.revisions, $list);
//$navigator.find('.navigator-tree').html(response.navigator);
// render local styles
$btn.removeClass('loading disabled');
inlineEditor();
blink();
loopAllStyleFields();
runAjaxElements();
}
});
}
}
function displayRevisions(rev, $list) {
$list.empty();
$.each(JSON.parse(rev), function(i, item) {
$list.append('<li data-time="'+ i +'"><span class="revision-icon mfn-icon-clock"></span><div class="revision"><h6>'+ item +'</h6><a class="mfn-option-btn mfn-option-text mfn-option-blue mfn-btn-restore revision-restore" href="#"><span class="text">Restore</span></a></div></li>');
});
$('.revision-restore').on('click', function(e) {
e.preventDefault();
restoreRev($(this));
});
}
// copy / paste element
var copypaste = {
item: false,
parent: false,
uid: false,
type: false,
ls_obj: localStorage.getItem("mfn_copy") ? JSON.parse(localStorage.getItem("mfn_copy")) : false,
copy: function(el, action = false) {
copypaste.uid = el;
copypaste.copy_to_localstorage();
if(action){
copypaste.parent = action;
copypaste.paste();
}
},
copy_to_localstorage: function() {
localStorage.removeItem("mfn_copy");
copypaste.ls_obj = {};
copypaste.ls_obj['html'] = $content.find('.vb-item[data-uid="'+copypaste.uid+'"]')[0].outerHTML;
copypaste.ls_obj['obj'] = [];
copypaste.ls_obj['obj'].push( mfn.pagedata.filter( (item) => item.uid == copypaste.uid )[0] );
if( $content.find('.vb-item[data-uid="'+copypaste.uid+'"] .vb-item').length ){
$content.find('.vb-item[data-uid="'+copypaste.uid+'"] .vb-item').each(function() {
var uid = $(this).attr('data-uid');
copypaste.ls_obj['obj'].push( mfn.pagedata.filter( (item) => item.uid == uid )[0] );
});
}
localStorage.setItem("mfn_copy", JSON.stringify(copypaste.ls_obj));
},
paste: function() {
if( !localStorage.getItem("mfn_copy") && !copypaste.ls_obj ) return;
if( !copypaste.ls_obj ){
copypaste.ls_obj = JSON.parse(localStorage.getItem("mfn_copy"));
}
copypaste.item = $(copypaste.ls_obj['html']);
copypaste.type = 'column';
if( copypaste.item.hasClass('mcb-section') ){ copypaste.type = 'section'; }else if( copypaste.item.hasClass('mcb-wrap') ){ copypaste.type = 'wrap'; }
if( copypaste.item.find('.mfn-initialized').length ){
if( inlineEditors[copypaste.item.find('.mfn-initialized').attr('data-mfnindex')] ) inlineEditors[copypaste.item.find('.mfn-initialized').attr('data-mfnindex')].destroy();
copypaste.item.find('.mfn-initialized').removeClass('mfn-initialized mfn-watchChanges mfn-blur-action mfn-focused').removeAttr('data-mfnindex');
}
$content.find('.vb-item[data-uid="'+copypaste.uid+'"]').removeClass('mfn-current-editing');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor-full') ) $('.mfn-ui').addClass('mfn-class-editor-full');
if( $editpanel.find( '.mfn-form .html-editor' ).length ) MfnFieldTextarea.destroy();
if( $editpanel.find( '.mfn-form .visual-editor' ).length ) tinymce.execCommand( 'mceRemoveEditor', false, 'mfn-editor' );
//var $copy_el = copypaste.item.clone();
if( copypaste.item.hasClass('mcb-column') ){
// column
var newuid = copypaste.updateItem(copypaste.item);
}else if( copypaste.item.hasClass('mcb-wrap') ){
// wrap
var newuid = copypaste.updateWrap(copypaste.item);
}else if( copypaste.item.hasClass('mcb-section') ){
// section
var newuid = copypaste.updateSection(copypaste.item);
}
edited_item = mfn.pagedata.filter( (item) => item.uid == newuid )[0];
if(copypaste.parent.hasClass('mcb-section') && copypaste.type == 'wrap'){
// wrap to section
copypaste.parent.find('.section_wrapper').append(copypaste.item);
}else if(copypaste.parent.hasClass('mcb-section') && copypaste.type == 'column'){
// column to section
if(copypaste.parent.find('.mcb-wrap-inner').length){
copypaste.parent.find('.mcb-wrap-inner').last().append(copypaste.item);
}else{
alert('Append wrap first.');
}
}else if(copypaste.parent.hasClass('mcb-wrap') && copypaste.type == 'column'){
// column to wrap
copypaste.parent.find('.mcb-wrap-inner').append(copypaste.item);
}else if( ( copypaste.parent.hasClass('mcb-column') || copypaste.parent.hasClass('mcb-wrap') ) && copypaste.type == 'section'){
// section to wrap or column
copypaste.parent.closest('.mcb-section').after(copypaste.item);
}else if( copypaste.parent.hasClass('mcb-column') && copypaste.type == 'wrap'){
// wrap to column
copypaste.parent.closest('.mcb-wrap').after(copypaste.item);
}else if( copypaste.parent.hasClass('mfn-builder-content')){
copypaste.parent.append(copypaste.item);
}else{
copypaste.parent.after(copypaste.item);
}
if( $builder.find('.vb-item[data-uid="'+newuid+'"]').hasClass('mcb-column') ) {
$builder.find('.vb-item[data-uid="'+newuid+'"]').addClass('loading');
}else{
$builder.find('.vb-item[data-uid="'+newuid+'"]').find('.mcb-column').addClass('loading');
}
if( builder_type == 'header' && copypaste.type == 'wrap' ){
checkWrapsCount( $content.find('.mcb-wrap-'+newuid).closest('.mcb-section').attr('data-uid') );
}
be_layout.emptys.sections();
be_layout.emptys.wraps();
if( $content.find('.vb-item[data-uid="'+newuid+'"] .mfn-lottie-wrapper .lottie').length ){
$content.find('.vb-item[data-uid="'+newuid+'"] .mfn-lottie-wrapper .lottie').each(function() {
$(this).attr('id', 'mfn_lottie_'+getUid());
$(this).closest('.vb-item').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
re_render();
});
}
setTimeout(function() {
if( $content.find('.mfn-looped-items.vb-item[data-uid="'+newuid+'"]').length ){
if( $content.find('.mfn-looped-items.vb-item[data-uid="'+newuid+'"]').hasClass('section') ){
re_render( $content.find('.mfn-looped-items.vb-item[data-uid="'+newuid+'"]').attr('data-uid') );
}else{
re_render( $content.find('.mfn-looped-items.vb-item[data-uid="'+newuid+'"]').closest('.section').attr('data-uid') );
}
}else if( $content.find('.vb-item[data-uid="'+newuid+'"]').closest('.mfn-looped-items').length ){
re_render( $content.find('.vb-item[data-uid="'+newuid+'"]').closest('.section').attr('data-uid') );
}else{
historyStorage.add();
}
if( $content.find('.vb-item[data-uid="'+newuid+'"]').hasClass('mfn-current-editing') ) $content.find('.vb-item[data-uid="'+newuid+'"]').removeClass('mfn-current-editing');
if( $content.find('.vb-item[data-uid="'+newuid+'"]').find('.mfn-current-editing').length ) $content.find('.vb-item[data-uid="'+newuid+'"]').find('.mfn-current-editing').removeClass('mfn-current-editing');
if( $('body').hasClass('mfn-navigator-active') ) be_navigator.show(newuid);
$builder.find('.vb-item.loading').removeClass('loading');
mfnChart();
inlineEditor();
$content.find('.vb-item[data-uid="'+newuid+'"]').find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
if( $content.find('.vb-item.mfn-ready').length ) $content.find('.vb-item.mfn-ready').removeClass('mfn-ready');
copypaste.uid = false;
copypaste.parent = false;
copypaste.type = false;
}, 300);
},
updateItem: function($copy_el) {
var old_uid = $copy_el.attr('data-uid');
var new_uid = getUid();
$copy_el.removeClass('mcb-item-'+old_uid).addClass('mcb-item-'+new_uid).attr('data-uid', new_uid);
$copy_el.children('.mcb-column-inner').removeClass('mcb-column-inner-'+old_uid).addClass('mcb-column-inner-'+new_uid);
if( $copy_el.find('.chart_box.mfn-initialized').length ){
$copy_el.find('.chart_box.mfn-initialized').removeClass('mfn-initialized');
}
var get_copy = copypaste.ls_obj['obj'].filter( (item) => item.uid == old_uid )[0];
var copy_obj = {};
copy_obj = JSON.parse( JSON.stringify(get_copy) );
copy_obj.uid = new_uid;
mfn.pagedata.push(copy_obj);
loopAllStyleFields(new_uid);
return new_uid;
},
updateWrap: function($copy_el) {
var old_uid = $copy_el.attr('data-uid');
var new_uid = getUid();
// wrap
$copy_el.removeClass('mcb-wrap-'+old_uid).addClass('mcb-wrap-'+new_uid).attr('data-uid', new_uid);
$copy_el.find('.mcb-wrap-inner').first().removeClass('mcb-wrap-inner-'+old_uid).addClass('mcb-wrap-inner-'+new_uid);
var get_copy = copypaste.ls_obj['obj'].filter( (item) => item.uid == old_uid )[0];
var copy_obj = {};
copy_obj = JSON.parse( JSON.stringify(get_copy) );
copy_obj.uid = new_uid;
mfn.pagedata.push(copy_obj);
// wraps childrens
if( $copy_el.find('.vb-item').length ) {
$copy_el.find('.vb-item').each(function() {
var $copy_el = $(this);
var old_col_uid = $(this).attr('data-uid');
var new_col_uid = getUid();
if( $(this).hasClass('mcb-column') ){
$(this).removeClass('mcb-item-'+old_col_uid).addClass('mcb-item-'+new_col_uid).attr('data-uid', new_col_uid);
$(this).children('.mcb-column-inner').removeClass('mcb-column-inner-'+old_col_uid).addClass('mcb-column-inner-'+new_col_uid);
}else{
$(this).removeClass('mcb-wrap-'+old_col_uid).addClass('mcb-wrap-'+new_col_uid).attr('data-uid', new_col_uid);
$(this).children('.mcb-wrap-inner').removeClass('mcb-wrap-inner-'+old_col_uid).addClass('mcb-wrap-inner-'+new_col_uid);
}
var get_copy = copypaste.ls_obj['obj'].filter( (item) => item.uid == old_col_uid )[0];
var copy_obj = {};
copy_obj = JSON.parse( JSON.stringify(get_copy) );
copy_obj.uid = new_col_uid;
mfn.pagedata.push(copy_obj);
loopAllStyleFields(new_col_uid);
});
}
loopAllStyleFields(new_uid);
return new_uid;
},
updateSection: function($copy_el) {
var old_uid = $copy_el.attr('data-uid');
var new_uid = getUid();
// section
$copy_el.removeClass('mcb-section-'+old_uid).addClass('mcb-section-'+new_uid).attr('data-uid', new_uid);
$copy_el.find('.mcb-section-inner').removeClass('mcb-section-inner-'+old_uid).addClass('mcb-section-inner-'+new_uid);
var get_copy = copypaste.ls_obj['obj'].filter( (item) => item.uid == old_uid )[0];
var copy_obj = {};
copy_obj = JSON.parse( JSON.stringify(get_copy) );
copy_obj.ver = elements_ver;
$copy_el.removeClass('mfn-default-section mfn-header-sticky-section mfn-header-mobile-section').addClass('mfn-'+elements_ver+'-section');
copy_obj.uid = new_uid;
mfn.pagedata.push(copy_obj);
// wraps childrens
if( $copy_el.find('.vb-item.mcb-wrap:not(.mfn-ready)').length ){
$copy_el.find('.vb-item.mcb-wrap:not(.mfn-ready)').each(function() {
//copypaste.updateWrap( $(this) ); // because of nav tmp
var $copy_el = $(this);
var old_wrap_uid = $copy_el.attr('data-uid');
var new_wrap_uid = getUid();
// wrap
$copy_el.removeClass('mcb-wrap-'+old_wrap_uid).addClass('mcb-wrap-'+new_wrap_uid).attr('data-uid', new_wrap_uid);
$copy_el.children('.mcb-wrap-inner').first().removeClass('mcb-wrap-inner-'+old_wrap_uid).addClass('mcb-wrap-inner-'+new_wrap_uid);
var get_copy = copypaste.ls_obj['obj'].filter( (item) => item.uid == old_wrap_uid )[0];
var copy_obj = {};
copy_obj = JSON.parse( JSON.stringify(get_copy) );
copy_obj.uid = new_wrap_uid;
mfn.pagedata.push(copy_obj);
$copy_el.addClass('mfn-ready');
loopAllStyleFields(new_wrap_uid);
// wraps childrens
if( $copy_el.find('.vb-item.mcb-column:not(.mfn-ready)').length ){
$copy_el.find('.vb-item.mcb-column:not(.mfn-ready)').each(function() {
var $copy_el = $(this);
var old_col_uid = $copy_el.attr('data-uid');
var new_col_uid = getUid();
$copy_el.removeClass('mcb-item-'+old_col_uid).addClass('mcb-item-'+new_col_uid).attr('data-uid', new_col_uid);
$copy_el.children('.mcb-column-inner').removeClass('mcb-column-inner-'+old_col_uid).addClass('mcb-column-inner-'+new_col_uid);
var get_copy = copypaste.ls_obj['obj'].filter( (item) => item.uid == old_col_uid )[0];
var copy_obj = {};
copy_obj = JSON.parse( JSON.stringify(get_copy) );
copy_obj.uid = new_col_uid;
mfn.pagedata.push(copy_obj);
$copy_el.addClass('mfn-ready');
loopAllStyleFields(new_col_uid);
});
}
});
}
if( $copy_el.find('.promo_bar_slider').length ){
runAjaxElements();
}
loopAllStyleFields(new_uid);
return new_uid;
}
}
function prepareStyleId(el) {
el = el.replaceAll('.', '');
el = el.replaceAll('tablet', '');
el = el.replaceAll('laptop', '');
el = el.replaceAll('mobile', '');
el = el.replaceAll('desktop', '');
el = el.replaceAll(',', '');
el = el.replaceAll('#', '');
el = el.replaceAll('|', '');
el = el.replaceAll(' ', '');
el = el.replaceAll('(', '');
el = el.replaceAll(')', '');
el = el.replaceAll('[', '');
el = el.replaceAll('%', '');
el = el.replaceAll('/', '');
el = el.replaceAll(']', '');
el = el.replaceAll('>', '');
el = el.replaceAll('_', '');
el = el.replaceAll('-', '');
el = el.replaceAll('=', '');
el = el.replaceAll(':', '');
el = el.replaceAll('"', '');
return el;
}
// is bebuilder blocks
function isBlocks() {
let disabled_blocks = ['header', 'popup', 'megamenu', 'footer'];
if( !disabled_blocks.includes(builder_type) ) {
return $content.find('body').hasClass('mfn-builder-blocks');
}
return false;
}
// add local style
function addLocalStyle(u, v, s, r, uid) {
if( isBlocks() ) return;
// console.log(u+' / '+s+' / '+v+' / '+r+' / '+uid);
// console.log(addLocalStyle.caller);
if( sidebar_form.is_class ){
u = u.replaceAll('.mcb-section .mcb-wrap .be_', '.column.be_');
}
u = u.replaceAll('mfnuidelement', uid);
u = u.replaceAll('postid', uid);
if( s == 'gradient' ) s = 'background-image';
var el = u+s;
if(typeof u === "undefined" || typeof s === "undefined") return;
el = prepareStyleId(el);
if( $content.find('style.'+el+r).length ){
$content.find('style.'+el+r).remove();
}
var selector_arr = u.split(",");
var selector_string = '';
$.each( selector_arr, function( i, value ) {
if( i > 0 ){ selector_string += ', '; }
selector_string += value.replaceAll('|', ':');
});
// while changing margin or padding, recalculate transformed elements
if( s.includes('padding') || s.includes('margin') ) {
Transforms.attachNewMargins();
}
if( v == '' ) return;
if( !uid.includes('be_') ) {
selector_string = selector_string.replace('mcb-column-inner', 'mcb-column-inner-'+uid);
selector_string = selector_string.replace('mcb-wrap-inner', 'mcb-wrap-inner-'+uid);
selector_string = selector_string.replace('mcb-section-inner', 'mcb-section-inner-'+uid);
selector_string = selector_string.replace('section_wrapper', 'mcb-section-inner-'+uid);
selector_string = 'html '+selector_string;
}
//console.log(selector_string+' / '+s+' / '+v);
s = s.replace('_v2', '');
if( r == 'laptop' ) {
$content.find('.mfn-be-local-css-laptop').append('<style class="mfn-local-style mfn-local-style-'+uid+' '+el+r+'">@media(max-width: 1440px){'+selector_string+' { '+(s.replace('_laptop', ''))+': '+v+' }}</style>');
}else if( r == 'tablet' ) {
$content.find('.mfn-be-local-css-tablet').append('<style class="mfn-local-style mfn-local-style-'+uid+' '+el+r+'">@media(max-width: 959px){'+selector_string+' { '+(s.replace('_tablet', ''))+': '+v+' }}</style>');
}else if( r == 'mobile' ) {
$content.find('.mfn-be-local-css-mobile').append('<style class="mfn-local-style mfn-local-style-'+uid+' '+el+r+'">@media(max-width: 767px){'+selector_string+' { '+(s.replace('_mobile', ''))+': '+v+' }}</style>');
}else{
$content.find('.mfn-be-local-css-desktop').append('<style class="mfn-local-style mfn-local-style-'+uid+' '+el+r+'">'+selector_string+' { '+s+': '+v+' }</style>');
}
}
// change styles function
function changeInlineStyles(u, s, v){
if( _.has(edited_item, 'uid') && u.includes('mfnuidelement') && !sidebar_form.is_class ) u = u.replaceAll('mfnuidelement', edited_item.uid);
if( _.has(edited_item, 'uid') && edited_item.uid == 'pageoptions' && u.includes('postid') ) u = u.replaceAll('postid', mfn.pageid);
if( _.has(edited_item, 'uid') && sidebar_form.is_class ) u = u.replaceAll('mcb-item-mfnuidelement', 'mcb-column.'+sidebar_form.is_class).replaceAll('mcb-wrap-mfnuidelement', 'mcb-wrap.'+sidebar_form.is_class).replaceAll('mcb-section-mfnuidelement', 'mcb-section.'+sidebar_form.is_class)
//console.log(u+' / '+s+' / '+v);
let styles = [];
if($content.find(u).length){
$content.find(u).each(function() {
if(v == 'remove_style'){
$(this).removeAttr('style');
}else{
let attrstyle = $(this).attr('style');
if(typeof attrstyle !== typeof undefined && attrstyle !== false){
styles = attrstyle.split(';');
}
let sid = styles.findIndex( st => st.includes(s));
if(styles[sid]){
if( v == 'remove' || !v.length ){
styles.splice(sid,1);
}else{
styles[sid] = s+': '+v;
}
}else if(v.length && v != 'remove'){
styles.push(s+': '+v);
}
let newstyles = styles.join(';');
$(this).attr('style', newstyles);
}
});
}
}
// change fancy divider color
function changeFancyDividerColorTop(u, g, v){
let style = $('.mfn-element-fields-wrapper .style .preview-styleinput').val();
if( style == 'circle up' || style == 'curve up' || style == 'triangle up' ) {
changeInlineStyles('.'+u+' svg', 'background', v);
}else{
changeInlineStyles('.'+u+' svg path', 'fill', v);
changeInlineStyles('.'+u+' svg path', 'stroke', v);
}
}
function changeFancyDividerColorBottom(u, g, v){
let style = $('.mfn-element-fields-wrapper .style .preview-styleinput').val();
if(style == 'circle down' || style == 'curve down' || style == 'triangle down'){
changeInlineStyles('.'+u+' svg', 'background', v);
}else{
changeInlineStyles('.'+u+' svg path', 'fill', v);
changeInlineStyles('.'+u+' svg path', 'stroke', v);
}
}
// video bg
function setVideoBg(u, t, v){
if(v != ''){
if($content.find('.'+u+' .section_video video').length){
if($content.find('.'+u+' .section_video video source[type="video/'+t+'"]').length){
$content.find('.'+u+' .section_video video source[type="video/'+t+'"]').attr('src', v);
}else{
$content.find('.'+u+' .section_video video').append('<source type="video/'+t+'" src="'+v+'">');
}
}else{
$content.find('.'+u).append('<div class="section_video"><div class="mask"></div><video poster autoplay="true" loop="true" muted="muted"><source type="video/'+t+'" src="'+v+'"></video></div>').addClass('has-video');
}
}else{
if($content.find('.'+u+' .section_video video source[type="video/'+t+'"]').length){
$content.find('.'+u+' .section_video video source[type="video/'+t+'"]').remove();
}
if(!$content.find('.'+u+' .section_video video source').length){
$content.find('.'+u+' .section_video').remove();
$content.find('.'+u).removeClass('has-video');
}
}
}
// chart color
function changeColorChart(u, v) {
if(v != 'transparent'){
$content.find('.'+u+' .chart').attr('data-bar-color', v);
}else{
$content.find('.'+u+' .chart').attr('data-bar-color', '#000');
}
}
// image for widget
function imageForWidget(u, v, p){
p ? p = p : '';
// console.log('# imageForWidget');
if( isBlocks() ){
if( p != 'after' && p != 'hoverimg' ){
// hide icon
if( $content.find('.'+u).is('.column_counter, .column_icon_box, .column_icon_box_2, .column_list') ){
if(v){
$content.find('.'+u+' .item-preview-icon').addClass('empty');
} else {
$content.find('.'+u+' .item-preview-icon').removeClass('empty');
}
}
// change image src
$content.find('.'+u+' .item-preview-image').attr('src',v);
// empty class
if(v){
$content.find('.'+u+' .item-preview-image').parent().removeClass('empty');
} else {
$content.find('.'+u+' .item-preview-image').parent().addClass('empty');
}
}
} else if($content.find('.'+u).hasClass('column_article_box')) {
// article box
$content.find('.'+u+' .article_box .photo_wrapper').html('<img class="scale-with-grid" src="'+v+'" alt="">');
}else if($content.find('.'+u).hasClass('column_before_after')){
// before after
if(p == 'before') {
$content.find('.'+u+' .twentytwenty-before').attr('src', v);
}else if(p == 'after') {
$content.find('.'+u+' .twentytwenty-after').attr('src', v);
}
$content.find('.before_after.twentytwenty-container').twentytwenty();
resetBeforeAfter(u);
}else if($content.find('.'+u).hasClass('column_counter')){
// counter
if( v != '' ){
$content.find('.'+u+' .icon_wrapper').html('<img class="scale-with-grid" src="'+v+'" alt="">');
}else if( $('.panel-edit-item .mfn-form-row .preview-iconinput').val() ){
$content.find('.'+u+' .icon_wrapper').html('<i class="' +$('.panel-edit-item .mfn-form-row .preview-iconinput').val()+ '"></i>');
}
}else if($content.find('.'+u).hasClass('column_feature_box')){
// feature box
$content.find('.'+u+' .photo_wrapper').html('<img class="scale-with-grid" src="'+v+'" alt="">');
}else if($content.find('.'+u).hasClass('column_flat_box') && p == 'boximg'){
// flat box
$content.find('.'+u+' .photo_wrapper img').attr('src', v);
}else if($content.find('.'+u).hasClass('column_flat_box') && p == 'iconimg'){
// flat box icon
if(v != ''){
$content.find('.'+u+' .icon').html('<img class="scale-with-grid" src="'+v+'" alt="">');
}else{
$content.find('.'+u+' .icon').html('');
}
}else if($content.find('.'+u).hasClass('column_hover_box') && p == 'mainimg'){
// hover box
$content.find('.'+u+' img.visible_photo').attr('src', v);
}else if($content.find('.'+u).hasClass('column_hover_box') && p == 'hoverimg'){
// hover box
$content.find('.'+u+' img.hidden_photo').attr('src', v);
}else if($content.find('.'+u).hasClass('column_how_it_works')){
// how it works
if(v){
$content.find('.'+u+' .how_it_works').removeClass('no-img');
if($content.find('.'+u+' .how_it_works .image img').length){
$content.find('.'+u+' .how_it_works .image img').attr('src', v).removeAttr('width').removeAttr('height');;
}else{
$content.find('.'+u+' .how_it_works .image').append('<img src="'+v+'" class="scale-with-grid" alt="">');
}
}else{
$content.find('.'+u+' .how_it_works').addClass('no-img');
$content.find('.'+u+' .how_it_works .image img').remove();
}
}else if($content.find('.'+u).hasClass('column_icon_box')){
// icon box
if(v != ''){
if($content.find('.'+u+' .icon_box .image_wrapper img').length){
$content.find('.'+u+' .icon_box .image_wrapper img').attr('src', v);
}else{
if($content.find('.'+u+' .icon_box .icon_wrapper').length) { $content.find('.'+u+' .icon_box .icon_wrapper').remove(); }
$content.find('.'+u+' .icon_box').prepend('<div class="image_wrapper"><img src="'+v+'" class="scale-with-grid" alt=""></div>');
}
}else if( $('.mfn-ui .panel-edit-item .mfn-form .mfn-form-control.preview-iconinput').val().length ){
$content.find('.'+u+' .icon_box .image_wrapper').remove();
$content.find('.'+u+' .icon_box').prepend('<div class="icon_wrapper"><div class="icon"><i class="'+$('.mfn-ui .panel-edit-item .mfn-form .mfn-form-control.preview-iconinput').val()+'"></i></div></div>');
}else{
if($content.find('.'+u+' .icon_box .icon_wrapper').length) { $content.find('.'+u+' .icon_box .icon_wrapper').remove(); }
if($content.find('.'+u+' .icon_box .image_wrapper').length) { $content.find('.'+u+' .icon_box .image_wrapper').remove(); }
}
}else if($content.find('.'+u).hasClass('column_image')){
// image
$content.find('.'+u+' .image_wrapper img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_list')){
// list
$content.find('.'+u+' .list_left').removeClass('list_icon list_image').addClass('list_image').html('<img src="'+v+'" class="scale-with-grid" alt="">');
}else if($content.find('.'+u).hasClass('column_photo_box')){
// photo box
$content.find('.'+u+' .image_wrapper img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_promo_box')){
// promo box
$content.find('.'+u+' .photo_wrapper img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_sliding_box')){
// sliding box
$content.find('.'+u+' .photo_wrapper img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_story_box')){
// sliding box
$content.find('.'+u+' .photo_wrapper img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_trailer_box')){
// trailer box
$content.find('.'+u+' .trailer_box img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_zoom_box') && p == 'main'){
// zoom box main
$content.find('.'+u+' .photo img').attr('src', v).removeAttr('width').removeAttr('height');
}else if($content.find('.'+u).hasClass('column_zoom_box')){
// zoom box desc
if(v){
if($content.find('.'+u+' .desc_wrap .desc_img img').length){
$content.find('.'+u+' .desc_wrap .desc_img img').attr('src', v);
}else{
$content.find('.'+u+' .desc_wrap').prepend('<div class="desc_img"><img class="scale-with-grid" src="'+v+'" alt=""></div>');
}
}else{
if($content.find('.'+u+' .desc_wrap .desc_img img').length){
$content.find('.'+u+' .desc_wrap .desc_img').remove();
}
}
}else if($content.find('.'+u).hasClass('mcb-section') && p == 'decortop'){
// section decor top
if(v.length){
if($content.find('.'+u+' .section-decoration.top').length){
$content.find('.'+u+' .section-decoration.top').css({ 'background-image': 'url('+v+')'});
}else{
$content.find('.'+u).prepend('<div class="section-decoration top" style="background-image:url('+v+');"></div>');
}
}else{
$content.find('.'+u+' .section-decoration.top').remove();
}
}else if($content.find('.'+u).hasClass('mcb-section') && p == 'decorbottom'){
// section decor bottom
if(v != ''){
if($content.find('.'+u+' .section-decoration.bottom').length){
$content.find('.'+u+' .section-decoration.bottom').css({ 'background-image': 'url('+v+')'});
}else{
$content.find('.'+u).append('<div class="section-decoration bottom" style="background-image:url('+v+');"></div>');
}
}else{
$content.find('.'+u+' .section-decoration.bottom').remove();
}
}else if($content.find('.'+u).hasClass('column_our_team')){
// our team
$content.find('.'+u+' .image_wrapper img').attr('src', v);
}else if($content.find('.'+u).hasClass('column_our_team_list')){
// our team list
$content.find('.'+u+' .image_wrapper img').attr('src', v);
}else if($content.find('.'+u).hasClass('column_pricing_item')){
// pricing item
if( v ){
if( $content.find('.'+u+' .image').length ){
$content.find('.'+u+' .image img').attr('src', v);
}else{
$content.find('.'+u+' .plan-header').prepend('<div class="image"><img src="'+v+'" alt="" /></div>');
}
}else{
$content.find('.'+u+' .image').remove();
}
}else if($content.find('.'+u).hasClass('column_header_icon')){
// header icon
$content.find('.'+u+' .icon-wrapper img').remove();
$content.find('.'+u+' .icon-wrapper i').remove();
$content.find('.'+u+' .icon-wrapper svg').remove();
$content.find('.'+u+' .icon-wrapper').prepend('<img width="20" src="'+v+'" alt="">');
}else if($content.find('.'+u).hasClass('column_chart')){
// chart
if(v){
if($content.find('.'+u+' .chart .image img').length){
$content.find('.'+u+' .chart .image img').attr('src', v);
}else{
$content.find('.'+u+' .chart .num').remove();
$content.find('.'+u+' .chart .icon').remove();
$content.find('.'+u+' .chart').prepend('<div class="image"><img class="scale-with-grid" src="'+v+'" alt="" /></div>');
}
}else if($('.panel-edit-item .mfn-form-row .preview-iconinput').val().length){
$content.find('.'+u+' .chart .image').remove();
$content.find('.'+u+' .chart .label').remove();
$content.find('.'+u+' .chart').prepend('<div class="icon"><i class="'+$('.panel-edit-item .mfn-form .preview-iconinput').val()+'"></i></div>');
}else if($('.panel-edit-item .mfn-form-row .preview-labelinput').val().length){
$content.find('.'+u+' .chart .image').remove();
$content.find('.'+u+' .chart .icon').remove();
$content.find('.'+u+' .chart').prepend('<div class="num">'+$('.panel-edit-item .mfn-form-row .preview-labelinput').val()+'</div>');
}else{
$content.find('.'+u+' .chart .image').remove();
$content.find('.'+u+' .chart .icon').remove();
$content.find('.'+u+' .chart .num').remove();
}
}else if($content.find('.'+u).hasClass('column_header_logo')){
// logo
$content.find('.'+u+' img').attr('src', v);
}else if($content.find('.'+u).hasClass('column_banner_box') && p == 'cta'){
// banner box cta
$content.find('.'+u+' .cta-image img').attr('src', v);
mfnBannerBox();
}else if($content.find('.'+u).hasClass('column_banner_box')){
// banner box
$content.find('.'+u+' .banner-image img').attr('src', v);
}else if($content.find('.'+u).hasClass('column_footer_logo')){
// logo
$content.find('.'+u+' img').attr('src', v);
}else if($content.find('.'+u).hasClass('column_icon_box_2')){
if( v ){
if( $content.find('.'+u+' .icon-wrapper').length ){
$content.find('.'+u+' .icon-wrapper').html('<img class="scale-with-grid" src="'+v+'" alt="">');
}else{
$content.find('.'+u+' .mfn-icon-box').prepend('<div class="icon-wrapper"><img class="scale-with-grid" src="'+v+'" alt=""></div>');
}
}else{
if( $editpanel.find('.panel-edit-item .mfn-form .icon_box_2.icon .preview-iconinput').val().length ){
if( $content.find('.'+u+' .icon-wrapper i').length ){
$content.find('.'+u+' .icon-wrapper i').attr('class', $editpanel.find('.panel-edit-item .mfn-form .icon_box_2.icon .preview-iconinput').val());
}else{
$content.find('.'+u+' .icon-wrapper').html('<i class="'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.icon .preview-iconinput').val()+'" aria-hidden="true"></i>');
}
}else if( $editpanel.find('.panel-edit-item .mfn-form .icon_box_2.label .mfn-field-value').val().length ){
if( $content.find('.'+u+' .icon-wrapper').length ){
$content.find('.'+u+' .icon-wrapper').html('<span class="icon-label">'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.label .mfn-field-value').val()+'</span>');
}else{
$content.find('.'+u+' .desc_wrapper').before('<div class="icon-wrapper"><span class="icon-label">'+$editpanel.find('.panel-edit-item .mfn-form .icon_box_2.label .mfn-field-value').val()+'</span></div>');
}
}else{
$content.find('.'+u+' .icon-wrapper').remove();
}
}
}else if($content.find('.'+u).hasClass('column_header_burger')){
// menu burger
$content.find('.'+u+' .icon-wrapper img').remove();
$content.find('.'+u+' .icon-wrapper i').remove();
$content.find('.'+u+' .icon-wrapper svg').remove();
if( v ){
$content.find('.'+u+' .icon-wrapper').prepend('<img src="'+v+'" alt="">');
}else if( $editpanel.find('.panel-edit-item .mfn-form .header_burger.icon .preview-iconinput').val().length ){
$content.find('.'+u+' .icon-wrapper').prepend('<i class="'+$editpanel.find('.panel-edit-item .mfn-form .header_burger.icon .preview-iconinput').val()+'"></i>');
}else{
$content.find('.'+u+' .icon-wrapper').prepend('<i class="icon-menu-fine"></i>');
}
}else if($content.find('.'+u).hasClass('column_popup_exit')){
if(v != ''){
if( $content.find('.'+u+' .button_icon').length ){
$content.find('.'+u+' .button_icon').html('<img src="'+v+'" alt="">');
}else{
$content.find('.'+u+' .exit-mfn-popup').addClass('has-icon');
$content.find('.'+u+' .exit-mfn-popup').prepend('<span class="button_icon"><img src="'+v+'" alt=""></span>');
}
}else{
if( $('.mfn-form-row.popup_exit.icon .mfn-field-value').val().length ){
$content.find('.'+u+' .button_icon').html('<i class="'+$('.mfn-form-row.popup_exit.icon .mfn-field-value').val()+'"></i>');
}else{
$content.find('.'+u+' .button_icon').remove();
$content.find('.'+u+' .exit-mfn-popup').removeClass('has-icon');
}
}
}else if($content.find('.'+u).hasClass('column_hotspot')){
$content.find('.'+u+' .hotspot-image img').attr('src', v);
}
}
function resetBeforeAfter(u){
if($content.find('.vb-item[data-uid='+u+'] .before_after.twentytwenty-container').length){
$content.find('.vb-item[data-uid='+u+'] .before_after.twentytwenty-container .twentytwenty-overlay').remove();
$content.find('.vb-item[data-uid='+u+'] .before_after.twentytwenty-container .twentytwenty-after-label').remove();
$content.find('.vb-item[data-uid='+u+'] .before_after.twentytwenty-container .twentytwenty-handle').remove();
$content.find('.vb-item[data-uid='+u+'] .before_after.twentytwenty-container').unwrap();
$content.find('.vb-item[data-uid='+u+'] .before_after.twentytwenty-container').twentytwenty();
}
}
// MEDIA
var uploader = {
sortable: function(galleryContainer = false) {
if( !galleryContainer ){
galleryContainer = $('.gallery-container:not(.mfn-initialized)');
}
galleryContainer.each(function() {
var $modulebox = $(this).closest('.mfn-form-row');
var $input = $modulebox.find('.upload-input.mfn-field-value');
var groupid = $(this).closest('.mfn-element-fields-wrapper').attr('data-group');
var $sortablebox = $(this);
$sortablebox.sortable({
stop: function(event, elem) {
var imgarr = [];
$sortablebox.find('li img').each(function() {
imgarr.push( $(this).attr('data-pic-id') );
});
$input.val(imgarr.join(',')).trigger('change');
re_render();
}
});
$(this).addClass('mfn-initialized');
});
},
browse: function() {
$editpanel.on('click', '.panel .mfn-form .mfn-form-row .browse-image .mfn-button-upload', function(e) {
e.preventDefault();
var frame,
addImgLink = $(this),
metaBox = addImgLink.closest('.browse-image'),
$modulebox = metaBox.closest('.mfn-form-row'),
$moduleWrapper = metaBox.closest('.mfn-element-fields-wrapper'),
eluid = $moduleWrapper.attr('data-element'),
groupid = $moduleWrapper.attr('data-group'),
delImgAll = metaBox.find( '.mfn-button-delete-all'),
imgContainer = metaBox.find( '.selected-image'),
multipleImgs = false,
multipleImgsInput = metaBox.find( '.upload-input' ),
galleryContainer = metaBox.find( '.gallery-container' ),
imgIdInput = metaBox.find( '.mfn-field-value, .field-to-object' );
if(metaBox.hasClass('multi')){
multipleImgs = 'add';
}
if ( frame ) { frame.open(); return; }
frame = wp.media({
multiple: multipleImgs,
});
if(multipleImgs && multipleImgs == 'add' && metaBox.find( '.upload-input' ).length) {
frame.on('open', function() {
var library = frame.state().get('selection'),
images = metaBox.find( '.upload-input' ).val();
if (!images) {
return true;
}
imageIDs = images.split(',');
imageIDs.forEach(function(id) {
var attachment = wp.media.attachment(id);
attachment.fetch();
library.add(attachment ? [attachment] : []);
});
});
frame.on( 'select', function() {
galleryContainer.html('');
var library = frame.state().get('selection'),
imageURLs = [],
imageIDs = [],
imageURL, outputHTML, joinedIDs;
library.map(function(image) {
image = image.toJSON();
imageURLs.push(image.url);
imageIDs.push(image.id);
if (typeof image.sizes !== 'undefined' && typeof image.sizes.medium !== 'undefined') {
imageURL = image.sizes.medium.url;
} else {
imageURL = image.url;
}
outputHTML = '<li class="selected-image">' +
'<img data-pic-id="' + image.id + '" src="' + imageURL + '" />' +
'<a class="mfn-option-btn mfn-button-delete" data-tooltip="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a>' +
'</li>';
galleryContainer.append(outputHTML);
uploader.sortable(galleryContainer);
});
joinedIDs = imageIDs.join(',').replace(/^,*/, '');
if (joinedIDs.length !== 0) {
metaBox.removeClass('empty');
}
multipleImgsInput.val(joinedIDs).trigger('change');
re_render();
});
frame.open();
}else{
frame.on( 'select', function() {
if( addImgLink.closest('.dynamic_items_wrapper').length ){
var attachment = frame.state().get('selection').first().toJSON();
dynamicItems.addNew(attachment.url, attachment.id);
}else{
metaBox.removeClass('empty');
var attachment = frame.state().get('selection').first().toJSON();
if( $modulebox.attr('data-id') == '_thumbnail_id' ){
imgIdInput.val( attachment.id ).trigger('change');
mfn.featured_image = attachment.url;
setTimeout(function() { imgContainer.html('<img src="'+attachment.url+'">') }, 200);
}else if( $modulebox.attr('data-id') == 'mfn-meta-seo-og-image' ){
imgIdInput.val( attachment.url ).trigger('change');
}else{
imgIdInput.val( attachment.url+'#'+attachment.id ).trigger('change');
}
if( $modulebox.find('.reset-bg.active').length ) $modulebox.find('.reset-bg').removeClass('active');
}
});
frame.open();
}
});
},
itemsUpdate: function(attachment, imgIdInput) {
var $modulebox = imgIdInput.closest('.mfn-form-row');
var metaBox = $modulebox.find('.browse-image');
var $moduleWrapper = imgIdInput.closest('.mfn-element-fields-wrapper');
var imgContainer = metaBox.find( '.selected-image');
var eluid = $moduleWrapper.attr('data-element');
var uid = $content.find('.'+eluid).attr('data-uid');
var rwd = screen;
if(imgContainer) {
if( !attachment.includes('{') && !attachment.includes('none') ){
imgContainer.html( '<img src="'+attachment+'" alt="">' );
}else{
imgContainer.html( '' );
}
if( !attachment.includes('none') ) metaBox.removeClass('empty');
}
if( $modulebox.hasClass('themeoption logo-img') ){
// theme options
if( $content.find('#Top_bar .logo img.logo-main').length ) {
$content.find('#Top_bar .logo img.logo-main').attr('src', attachment);
if( attachment.includes('.svg') ) {$content.find('#Top_bar .logo img.logo-main').addClass('svg');}else{$content.find('#Top_bar .logo img.logo-main').removeClass('svg');}
if( !$('.themeoption.sticky-logo-img .mfn-field-value').val().length ) $content.find('#Top_bar .logo img.logo-sticky').attr('src', attachment);
}else if( $content.find('#Header_creative .logo img.logo-main').length ) {
$content.find('#Header_creative .logo img.logo-main').attr('src', attachment);
if( attachment.includes('.svg') ) {$content.find('#Header_creative .logo img.logo-main').addClass('svg');}else{$content.find('#Header_creative .logo img.logo-main').removeClass('svg');}
if( !$('.themeoption.sticky-logo-img .mfn-field-value').val().length ) $content.find('#Header_creative .logo img.logo-sticky').attr('src', attachment);
}
}else if( $modulebox.hasClass('themeoption retina-logo-img') ){
if( $content.find('#Top_bar .logo img.logo-mobile').length ) {
$content.find('#Top_bar .logo img.logo-mobile').attr('src', attachment);
}else if($content.find('#Header_creative .logo img.logo-mobile').length) {
$content.find('#Header_creative .logo img.logo-mobile').attr('src', attachment);
}
}else if( $modulebox.hasClass('themeoption sticky-logo-img') ){
if( $content.find('#Top_bar .logo img.logo-sticky').length ) {
$content.find('#Top_bar .logo img.logo-sticky').attr('src', attachment);
}else if($content.find('#Header_creative .logo img.logo-sticky').length) {
$content.find('#Header_creative .logo img.logo-sticky').attr('src', attachment);
}
}else if( $modulebox.hasClass('themeoption gdpr-content-image') ){
if( $content.find('.mfn-gdpr-image img').length ) {
$content.find('.mfn-gdpr-image img').attr('src', attachment);
}
}else{
// all rest widgets
if( attachment.includes('{') ) return;
if(imgIdInput.hasClass('preview-bg_imageinput')){
changeInlineStyles(eluid, 'background-image', 'url('+attachment+')');
}else if(imgIdInput.hasClass('preview-bg_video_mp4input')){
setVideoBg(eluid, 'mp4', attachment);
}else if(imgIdInput.hasClass('preview-bg_video_ogvinput')){
setVideoBg(eluid, 'ogg', attachment);
}else if($modulebox.hasClass('article_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if(imgIdInput.hasClass('preview-image_beforeinput')){
imageForWidget(eluid, attachment, 'before');
}else if(imgIdInput.hasClass('preview-image_afterinput')){
imageForWidget(eluid, attachment, 'after');
}else if($modulebox.hasClass('counter image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('feature_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('flat_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment, 'boximg');
}else if($modulebox.hasClass('flat_box icon_image') && imgIdInput.hasClass('preview-icon_imageinput')){
imageForWidget(eluid, attachment, 'iconimg');
}else if($modulebox.hasClass('hover_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment, 'mainimg');
}else if($modulebox.hasClass('hover_box') && imgIdInput.hasClass('preview-image_hoverinput')){
imageForWidget(eluid, attachment, 'hoverimg');
}else if($modulebox.hasClass('how_it_works image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('icon_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('image src') && imgIdInput.hasClass('preview-srcinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('list image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('photo_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('promo_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('sliding_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('story_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('trailer_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('zoom_box') && $modulebox.hasClass('image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment, 'main');
}else if($modulebox.hasClass('zoom_box') && $modulebox.hasClass('content_image')){
imageForWidget(eluid, attachment, 'desc');
}else if($modulebox.hasClass('section') && imgIdInput.hasClass('preview-decor_topinput')){
imageForWidget(eluid, attachment, 'decortop');
}else if($modulebox.hasClass('section') && imgIdInput.hasClass('preview-decor_bottominput')){
imageForWidget(eluid, attachment, 'decorbottom');
}else if($moduleWrapper.attr('data-item') == 'video placeholder' && imgIdInput.hasClass('preview-placeholderinput')){
re_render();
}else if($moduleWrapper.attr('data-item') == 'video mp4' && imgIdInput.hasClass('preview-mp4input')){
re_render();
}else if($moduleWrapper.attr('data-item') == 'video ogv' && imgIdInput.hasClass('preview-ogvinput')){
re_render();
}else if($modulebox.hasClass('our_team image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('banner_box') && $modulebox.hasClass('image')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('banner_box') && $modulebox.hasClass('cta_image')){
imageForWidget(eluid, attachment, 'cta');
}else if($modulebox.hasClass('our_team_list image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('pricing_item image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('header_icon image')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('widget-chart image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('header_logo image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('footer_logo image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('popup_exit image')){
imageForWidget(eluid, attachment);
}else if($modulebox.hasClass('inline-style-input')){
addLocalStyle($modulebox.attr('data-csspath'), 'url('+attachment+')', $modulebox.attr('data-name'), rwd, uid);
}else if(!$modulebox.hasClass('image link_image')){
imageForWidget(eluid, attachment);
}
}
},
delete: function() {
$editpanel.on('click', '.mfn-form .mfn-form-row .browse-image .mfn-button-delete', function(e) {
e.preventDefault();
var metaBox = $(this).closest('.browse-image'),
$modulebox = metaBox.closest('.mfn-form-row'),
$moduleWrapper = metaBox.closest('.mfn-element-fields-wrapper'),
eluid = $moduleWrapper.attr('data-element'),
uid = $content.find('.'+eluid).attr('data-uid'),
groupid = $moduleWrapper.attr('data-group'),
delImgAll = metaBox.find( '.mfn-button-delete-all'),
imgContainer = metaBox.find( '.selected-image'),
multipleImgs = false,
multipleImgsInput = metaBox.find( '.upload-input' ),
galleryContainer = metaBox.find( '.gallery-container' ),
rwd = screen,
imgIdInput = metaBox.find( '.mfn-form-input' );
if(metaBox.hasClass('multi')){
multipleImgs = 'add';
}
if(multipleImgs == 'add'){
$(this).closest('.selected-image').remove();
var imageIDs = [], id;
setTimeout(function() {
metaBox.find('.gallery-container img').each(function() {
id = $(this).attr('data-pic-id');
imageIDs.push(id);
});
var joinedIDs = imageIDs.join( ',' );
if (joinedIDs === '') {
metaBox.addClass('empty');
}
multipleImgsInput.val(joinedIDs).trigger('change');
re_render( edited_item.uid );
}, 1);
}else{
imgContainer.html( '' );
metaBox.addClass('empty');
if( $modulebox.hasClass('themeoption gdpr-content-image') ){
imgIdInput.val( '#' ).trigger('change');
}else{
imgIdInput.val( '' ).trigger('change');
}
if( $modulebox.hasClass('themeoption logo-img') ){
if( $content.find('#Top_bar .logo img.logo-main').length ) {
$content.find('#Top_bar .logo img.logo-main').attr('src', mfn.themepath+'/images/logo/logo.png').removeClass('svg');
}else{
$content.find('#Header_creative .logo img.logo-main').attr('src', mfn.themepath+'/images/logo/logo.png').removeClass('svg');
}
}else if( $modulebox.hasClass('themeoption retina-logo-img') ){
if( $content.find('#Top_bar .logo img.logo-mobile').length ) {
$content.find('#Top_bar .logo img.logo-mobile').attr('src', mfn.themepath+'/images/logo/logo-retina.png');
}else if($content.find('#Header_creative .logo img.logo-mobile').length) {
$content.find('#Header_creative .logo img.logo-mobile').attr('src', mfn.themepath+'/images/logo/logo-retina.png');
}
}else if( $modulebox.hasClass('themeoption sticky-logo-img') ){
if( $content.find('#Top_bar .logo img.logo-sticky').length ) {
$content.find('#Top_bar .logo img.logo-sticky').attr('src', mfn.themepath+'/images/logo/logo.png');
}else if($content.find('#Header_creative .logo img.logo-sticky').length) {
$content.find('#Header_creative .logo img.logo-sticky').attr('src', mfn.themepath+'/images/logo/logo.png');
}
}else if( $modulebox.hasClass('themeoption gdpr-content-image') ){
if( $content.find('.mfn-gdpr-image img').length ) {
$content.find('.mfn-gdpr-image img').attr('src', mfn.themepath+'/images/cookies.png');
}
}else{
if(imgIdInput.hasClass('preview-bg_imageinput')){
changeInlineStyles(eluid, 'background-image', '');
}else if(imgIdInput.hasClass('preview-bg_video_mp4input')){
setVideoBg(eluid, 'mp4', '');
}else if(imgIdInput.hasClass('preview-bg_video_ogvinput')){
setVideoBg(eluid, 'ogg', '');
}else if($modulebox.hasClass('article_box') && $modulebox.attr('data-name') == 'image' && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if(imgIdInput.hasClass('preview-image_beforeinput')){
imageForWidget(eluid, sample_img, 'before');
}else if(imgIdInput.hasClass('preview-image_afterinput')){
imageForWidget(eluid, sample_img, 'after');
}else if($modulebox.hasClass('counter image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('feature_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('flat_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img, 'boximg');
}else if($modulebox.hasClass('flat_box icon_image') && imgIdInput.hasClass('preview-icon_imageinput')){
imageForWidget(eluid, '', 'iconimg');
}else if($modulebox.hasClass('hover_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img, 'mainimg');
}else if($modulebox.hasClass('hover_box') && imgIdInput.hasClass('preview-image_hoverinput')){
imageForWidget(eluid, sample_img, 'hoverimg');
}else if($modulebox.hasClass('how_it_works image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('icon_box') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('image src') && imgIdInput.hasClass('preview-srcinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('list image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('photo_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('promo_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('sliding_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('story_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('trailer_box image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('hotspot image')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('zoom_box') && $modulebox.hasClass('image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img, 'main');
}else if($modulebox.hasClass('zoom_box') && $modulebox.hasClass('content_image')){
imageForWidget(eluid, '', 'desc');
}else if($modulebox.hasClass('section') && imgIdInput.hasClass('preview-decor_topinput')){
imageForWidget(eluid, '', 'decortop');
}else if($modulebox.hasClass('section') && imgIdInput.hasClass('preview-decor_bottominput')){
imageForWidget(eluid, '', 'decorbottom');
}else if($moduleWrapper.attr('data-item') == 'video placeholder' && imgIdInput.hasClass('preview-placeholderinput')){
re_render();
}else if($moduleWrapper.attr('data-item') == 'video mp4' && imgIdInput.hasClass('preview-mp4input')){
re_render();
}else if($moduleWrapper.attr('data-item') == 'video ogv' && imgIdInput.hasClass('preview-ogvinput')){
re_render();
}else if($modulebox.hasClass('our_team image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('banner_box') && $modulebox.hasClass('image')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('banner_box') && $modulebox.hasClass('cta_image')){
imageForWidget(eluid, sample_img, 'cta');
}else if($modulebox.hasClass('our_team_list image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, sample_img);
}else if($modulebox.hasClass('popup_exit image')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('pricing_item image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('header_icon image')){
re_render();
}else if($modulebox.hasClass('widget-chart image') && imgIdInput.hasClass('preview-imageinput')){
imageForWidget(eluid, '');
}else if($modulebox.hasClass('header_logo image') && imgIdInput.hasClass('preview-imageinput')){
re_render();
}else if($modulebox.hasClass('footer_logo image') && imgIdInput.hasClass('preview-imageinput')){
re_render();
}else if($modulebox.hasClass('inline-style-input')){
addLocalStyle($modulebox.attr('data-csspath'), 'none', $modulebox.attr('data-name'), rwd, uid);
}else if(!$modulebox.hasClass('image link_image')){
imageForWidget(eluid, '');
}
}
}
});
},
deleteAllGallery: function() {
$editpanel.on('click', '.mfn-form .mfn-form-row .browse-image .mfn-button-delete-all', function(e) {
e.preventDefault();
var metaBox = $(this).closest('.browse-image'),
$moduleWrapper = metaBox.closest('.mfn-element-fields-wrapper'),
eluid = $moduleWrapper.attr('data-element'),
groupid = $moduleWrapper.attr('data-group'),
multipleImgsInput = metaBox.find( '.upload-input' ),
galleryContainer = metaBox.find( '.gallery-container' ),
imgIdInput = metaBox.find( '.mfn-form-input' );
galleryContainer.html('');
metaBox.find( '.upload-input' ).val('').trigger('change');
metaBox.addClass('empty');
$content.find('.'+eluid+' .gallery').remove();
$content.find('.'+eluid+' style').remove();
imgIdInput.val( '' );
re_render();
});
}
}
function blink(his = false){
setTimeout(function(){
$builder.find('.blink').removeClass('blink');
if( !his ) historyStorage.add();
}, 200);
}
function re_render( uid = false ) {
//if( mfn.view == 'demo' ) return;
var type = edited_item.jsclass == 'wrap' || edited_item.jsclass == 'section' ? edited_item.jsclass : 'item';
if( uid && uid.includes('be_') ) return; // class editor will be reloaded upon class update
if( !uid ) {
uid = edited_item.uid;
}else {
var looped_obj = mfn.pagedata.filter( (item) => item.uid == uid )[0];
type = looped_obj.jsclass == 'wrap' || looped_obj.jsclass == 'section' ? looped_obj.jsclass : 'item';
}
if( edited_item && edited_item.type == 'lottie' ) {
$content.find('.'+edited_item.uid+' .mcb-column-inner').css('min-height', $content.find('.'+edited_item.uid+' .mfn-lottie-wrapper').outerHeight());
var it_lottie = $content.find('.mcb-item-'+edited_item.uid+' .lottie').attr('id');
if( typeof iframe.window[it_lottie] !== 'undefined' && typeof iframe.window[it_lottie] === "function" ) iframe.window[it_lottie].destroy();
}
if( $content.find('.vb-item[data-uid="'+uid+'"]').hasClass('loading') ) return;
$content.find('.vb-item[data-uid="'+uid+'"]').addClass('loading disabled');
if( $content.find('.vb-item[data-uid="'+uid+'"]').next('.mfn-read-more-line').length ) $content.find('.vb-item[data-uid="'+uid+'"]').next('.mfn-read-more-line').remove();
var formData = prepareForm.get( uid );
// console.log('re render '+type);
// console.log(formData);
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnrerendersection',
'mfn-builder-nonce': wpnonce,
sections: formData,
id: pageid,
type: type
},
type: 'POST',
success: function(response) {
if(Array.isArray(response)) {
$content.find('.vb-item[data-uid="'+uid+'"]').replaceWith( response[0] );
//$content.find('.'+it+' .mcb-column-inner').append( response[0] );
var ajax_script = document.createElement("script");
ajax_script.innerHTML = response[1];
document.getElementById('mfn-vb-ifr').contentWindow.document.body.appendChild(ajax_script);
}else{
//$content.find('.'+it+' .mcb-column-inner').append(response);
//console.log( $(response) );
if( builder_type == 'shop-archive' && edited_item && edited_item.jsclass == 'shop_products' ){
$content.find('.vb-item[data-uid="'+uid+'"] .products_wrapper').replaceWith( $(response).find('.products_wrapper') );
$content.find('.vb-item[data-uid="'+uid+'"]').removeClass('loading disabled');
}else{
$content.find('.vb-item[data-uid="'+uid+'"]').replaceWith( response );
}
}
$('.mfn-element-fields-wrapper .mfn-form-row.mfn-field-loading').removeClass('mfn-field-loading');
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
// console.log(' re render ');
be_layout.emptys.sections();
be_layout.emptys.wraps();
setTimeout(function() {
historyStorage.add();
runAjaxElements();
inlineEditor();
if( screen != 'desktop' ) setSizeLabels();
}, 10);
}
});
}
var sidebar_form = {
is_class: false,
is_pageoptions: false,
is_themeoptions: false,
wyswig_active: false,
type: false,
no_render: false,
focus: false,
before: function() {
// sidebar_form.before();
mfn.placeholders = {};
if( sidebar_form.wyswig_active && !copypaste.uid ) {
if( $editpanel.find( '.mfn-form .html-editor' ).length ) MfnFieldTextarea.destroy();
if( $editpanel.find( '.mfn-form .visual-editor' ).length ) tinymce.execCommand( 'mceRemoveEditor', false, 'mfn-editor' );
}
if(sidebar_form.wyswig_active) sidebar_form.wyswig_active = false;
},
open: function($edited_div, scroll = false) {
$('style.mfn-builder-fields-css').remove();
$('.mfn_classes_footer').remove();
sidebar_form.is_pageoptions = false;
sidebar_form.is_themeoptions = false;
// sidebar_form.open
// if( mfn_classes.has_changed ) setTimeout(mfn_classes.ajax(mfn_classes.has_changed), 10);
if( sidebar_form.wyswig_active ) {
// destroy editors has to be here and in before
if( $editpanel.find( '.mfn-form .html-editor' ).length ) MfnFieldTextarea.destroy();
if( $editpanel.find( '.mfn-form .visual-editor' ).length ) tinymce.execCommand( 'mceRemoveEditor', false, 'mfn-editor' );
if( $content.find('.mcb-item-'+edited_item['uid']).length && $content.find('.mcb-item-'+edited_item['uid']).closest('.mfn-looped-items').length ) {
re_render( $content.find('.mcb-item-'+edited_item['uid']).closest('.vb-item.mcb-section').attr('data-uid') );
}else if($content.find('.mcb-item-'+edited_item['uid']).length){
re_render( edited_item['uid'] );
}
}
if( edited_item && typeof edited_item.jsclass !== 'undefined' ) $('.mfn-ui').removeClass('mfn-editing-'+edited_item.jsclass);
// console.log(sidebar_form.open.caller);
if( $content.find('.vb-item.mfn-current-editing').length ) $content.find('.vb-item.mfn-current-editing').removeClass('mfn-current-editing');
$edited_div.addClass('mfn-current-editing');
if( !sidebar_form.is_class ){
var id = $edited_div.attr('data-uid');
edited_item = mfn.pagedata.filter( (item) => item.uid == id )[0];
}
// Global Wraps -> BeSections, PBL, Prevent opening edit form for sections
if ( $('body').hasClass('mfn-template-wrap') && $edited_div.hasClass('section') ) return;
$('.mfn-ui').removeClass('modalbox-card-active-content modalbox-card-active-style modalbox-card-active-advanced');
$('.sidebar-panel-classes-list .sidebar-panel-class').remove();
// Global Wraps -> BeWraps, PBL, hide all elements except for global wraps
if( $edited_div.hasClass('mfn-global-wrap') ) {
$('.sidebar-panel').addClass('mfn-global-wrap-edit');
} else {
$('.sidebar-panel').removeClass('mfn-global-wrap-edit');
}
if( edited_item && edited_item.jsclass !== 'undefined' ) $('.mfn-ui').removeClass('mfn-editing-'+edited_item.jsclass);
$('.mfn-ui').removeClass('mfn-editing-element mfn-editing-section mfn-editing-wrap mfn-editing-nested-wrap');
$(".header:not(.header-edit-item):visible").hide();
if( !$(".panel-edit-item").is(":visible") ) { $('.panel').hide(); $(".panel-edit-item").show(); $(".header-edit-item").show(); }
if( !edited_item ) return;
sidebar_form.type = 'item';
if( edited_item.jsclass == 'section' ) {
sidebar_form.type = 'section';
}else if(edited_item.jsclass == 'wrap') {
sidebar_form.type = 'wrap';
if( _.has(edited_item, 'item_is_wrap') ) $('.mfn-ui').addClass('mfn-editing-nested-wrap');
}
if( ui_mode == 'dev' ) $('.topbar-nav #main-menu li').removeClass('active');
// console.log(edited_item);
if( _.has(edited_item, 'attr') && _.has(edited_item.attr, 'undefined') ) {
delete(edited_item['attr']['undefined']);
}
if( edited_item.jsclass != 'wrap' && edited_item.jsclass != 'section' ) {
$('.mfn-ui').addClass('mfn-editing-element');
}
$('.mfn-ui .panel-edit-item .mfn-form').html(`<div class="mfn-element-fields-wrapper" data-item="${edited_item.jsclass}" data-element="${ sidebar_form.is_class ? edited_item.uid : `mcb-${sidebar_form.type}-${edited_item.uid}` }"><ul class="mfn-form-row sidebar-panel-content-tabs"></ul>`);
if( !['thankyou_overview', 'thankyou_order'].includes(edited_item.jsclass) ) {
$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper ul').append('<li data-tab="content" class="spct-li-content active">Settings</li><li data-tab="style" class="spct-li-style">Style</li>');
}else{
$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper ul').append('<li data-tab="style" class="spct-li-style active">Style</li>');
}
$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper ul').append('<li data-tab="advanced" class="spct-li-advanced">Advanced</li>');
$('.mfn-ui .panel-edit-item .mfn-form').append('</div>');
sidebar_form.render();
$('.mfn-ui').addClass('mfn-editing-'+edited_item.jsclass);
if( !sidebar_form.is_class ) {
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
}else{
if( !$content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').addClass('mfn-class-editor-preview');
if( !$('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').addClass('mfn-class-editor');
if($('.mfn-ui').hasClass('mfn-class-editor-full')) $('.mfn-ui').removeClass('mfn-class-editor-full');
if( !$('.mfn-ui .panel-edit-item .mfn-form .modalbox-card-content').hasClass('mfn-class-editor-card-visible') ) {
$('.mfn-ui .panel-edit-item .mfn-form .spct-li-content').remove();
$('.mfn-ui .panel-edit-item .mfn-form .modalbox-card-content').remove();
}
if( edited_item.jsclass == 'section' || edited_item.jsclass == 'wrap' ) {
$('.mfn-ui .panel-edit-item .mfn-form .spct-li-style').remove();
$('.mfn-ui .panel-edit-item .mfn-form .modalbox-card-style').remove();
}
$('.mfn-ui .panel-edit-item .mfn-form').append(`<div class="mfn_classes_footer"><a href="#" class="mfn-btn mfn-class-editor-dismiss">Cancel</a><a href="#" class="mfn-btn mfn-btn-green mfn-class-editor-update">Update style</a></div>`);
mfn_classes.backup = JSON.parse( JSON.stringify(edited_item) );
}
$('.mfn-ui .panel-edit-item .mfn-form .sidebar-panel-content-tabs li:first-child').trigger('click');
//Global Wraps/Sections -> Hiding some elements on Visual Bar
$('.mfn-visualbuilder .sidebar-panel').attr('data-edited', edited_item.title);
$('.mfn-visualbuilder .sidebar-panel .sidebar-panel-header .header-edit-item .title-group .sidebar-panel-desc .sidebar-panel-title').html( edited_item.title );
$('.mfn-visualbuilder .sidebar-panel .sidebar-panel-header .header-edit-item .title-group .sidebar-panel-icon').attr('class', 'sidebar-panel-icon mfn-icon-'+( !sidebar_form.is_class ? edited_item.icon : 'global-styles-list'));
if( !historyStorage.obj[0].uid ) {
historyStorage.obj[0].uid = edited_item.uid;
//localStorage.setItem('mfnhistory', JSON.stringify(ls));
}
if( !sidebar_form.is_class && $edited_div.length && scroll && builder_type !== 'header' ) {
$content.find('html, body').animate({ scrollTop: $edited_div.offset().top - 50 }, 1000);
}
$(document).trigger('be:edit');
if( $('body').hasClass('mfn-navigator-active') && !$('.mfn-navigator ul.navigator-tree li.nav-'+edited_item.uid+' > a.active-element').length ) be_navigator.show(edited_item.uid, true);
setTimeout(function() {
$('body').append('<style class="mfn-builder-fields-css mfn-fields-switcher-normal-hover">.mfn-ui .mfn-form .mfn-sft-nav li:first-child a{background: var(--mfn-ui-sft-nav-tab-bg-active); color: var(--mfn-ui-sft-nav-tab-color-active);} .mfn-ui .mfn-form .mfn-sft.mfn-sft-normal{display: block;}</style>');
},1);
return;
},
render: function() {
// sidebar_form.render
if( sidebar_form.no_render ) return;
// console.log('sidebar re render');
sidebar_form.before();
if( $('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper .modalbox-card').length ) $('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper .modalbox-card').remove();
if( !sidebar_form.is_class ){
if( $('.mfn-element-fields-wrapper .mfn-classes-used-info') ) $('.mfn-element-fields-wrapper .mfn-classes-used-info').remove();
if( _.has(edited_item, 'be_classes') && mfn.classes.length && !mfn.classes.filter( cl => cl.uid == edited_item.be_classes[0] ).length ) delete( edited_item.be_classes );
if( $('.mfn-ui .panel-edit-item .mfn-form .sidebar-panel-classes').length ) $('.mfn-ui .panel-edit-item .mfn-form .sidebar-panel-classes').remove();
if( edited_item.jsclass != 'placeholder' ) $('.mfn-ui .panel-edit-item .mfn-form').prepend('<div class="sidebar-panel-classes mfn-autocomplete"><label class="form-label form-label-wrapper">Global styles<a class="mfn-option-btn mfn-option-blank mfn-fr-help-icon" target="_blank" data-tooltip="Toggle description" data-position="left" href="#"><span class="mfn-icon mfn-icon-desc"></span></a><a href="#" class="sidebar-panel-class-create mfn-option-btn mfn-option-blank mfn-vb-label-button" title="Add new global style" data-tooltip="Add new global style" data-position="left"><span class="mfn-icon mfn-icon-add"></span></a><a href="#" class="sidebar-panel-class-list mfn-option-btn mfn-option-blank mfn-vb-label-button" title="Show list" data-tooltip="Show list" data-position="left"><span class="mfn-icon mfn-icon-global-styles-list"></span></a></label><div class="desc-group"><span class="description">Save the current styles so you can use them later anywhere. Check a <a href="https://www.youtube.com/watch?v=SO1EfBu24Oo" rel="nofollow" target="_blank">quick introduction</a> or watch a <a href="https://www.youtube.com/watch?v=bN1gSP009Vc" rel="nofollow" target="_blank">detailed tutorial</a>.</span></div><div class="sidebar-panel-classes-list mfn-autocomplete-list"><a class="mfn-option-btn mfn-sidebar-classes-show-list" href="#"><span class="mfn-icon mfn-icon-classes"></span></a><input data-list="mfn-classes" class="sidebar-panel-classes-el sidebar-panel-classes-input mfn-autocomplete-input" placeholder="Choose style"></div></div>');
if( _.has(edited_item, 'be_classes') && edited_item.be_classes.length && mfn.classes.length && mfn.classes.filter( cl => cl.uid == edited_item.be_classes[0] ) ) {
$('.mfn-ui').addClass('mfn-class-editor-full');
}else{
$('.mfn-ui').removeClass('mfn-class-editor-full');
}
if( _.has(edited_item, 'be_classes') && edited_item.be_classes.length && mfn.classes.length ) {
let classes_html = '';
_.map( edited_item.be_classes, function(clas, c) {
let nm = mfn.classes.filter( (c) => c.uid == clas );
if( nm.length ) {
classes_html += `<span data-name="${clas}" class="sidebar-panel-class mfn-autocomplete-item">${ nm[0]['title'] }<span class="sidebar-panel-class-edit mfn-autocomplete-item-edit">✎</span> <span class="sidebar-panel-class-delete mfn-autocomplete-item-delete">✕</span></span>`;
}else{
edited_item.be_classes.splice(c, 1);
}
}).join('');
$('.sidebar-panel-classes .sidebar-panel-classes-input').before(classes_html);
}
if( mfn.classes.length && _.has(edited_item, 'be_classes') && edited_item.be_classes.length && !$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper .mfn-classes-used-info').length && mfn.classes.filter( (cl) => cl.uid == edited_item.be_classes[0]).length ){
$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper').append('<div class="mfn-form-row mfn-alert mfn-classes-used-info placeholder"><div class="alert-icon mfn-icon-information"></div> <div class="alert-content"><p>This element uses global style. Any local changes will overwrite the global styles.</p></div> </div>');
}
}
const mfn_form = new MfnForm( renderMfnFields[edited_item.jsclass] );
let form_html = mfn_form.render();
$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper').append(form_html);
if( $edited_div && $edited_div.closest('.section.mfn-looped-items').length || $edited_div.find('.wrap.mfn-looped-items').length ) {
if( $('.mfn-element-fields-wrapper .type.re_render li:not(:first-child) input').is('checked') ) $('.mfn-element-fields-wrapper .type.re_render li:first-child a').trigger('click');
$('.mfn-element-fields-wrapper .type.re_render').addClass('mfn-disabled-field');
}
if( (edited_item.jsclass == 'wrap' || edited_item.jsclass == 'section') && typeof edited_item['attr']['type'] !== 'undefined' && edited_item['attr']['type'] == 'query' ) {
$('.mfn-element-fields-wrapper').addClass('mfn-is-query-looped');
if( _.has(edited_item['attr'], 'query_display') && edited_item['attr']['query_display'] == 'slider' ) {
$('.mfn-element-fields-wrapper').addClass('mfn-is-ql-slider');
$('.panel-edit-item .query_post_pagination').addClass('mfn-disabled-field');
}
}
if( $edited_div && $edited_div.find('.mfn-nested-wrap').length ) {
$('.mfn-loop-switcher.type ul li:first-child a').trigger('click');
$('.mfn-form-row.mfn-loop-switcher').addClass('mfn-disabled-field');
}
if( edited_item.jsclass != 'placeholder' && $('.mfn-ui').hasClass('mfn-editing-element') && !$('.mfn-element-fields-wrapper .modalbox-card-advanced').length ) {
const mfn_form_advanced = new MfnForm( renderMfnFields['advanced'] );
let form_html_advanced = mfn_form_advanced.render();
$('.mfn-ui .panel-edit-item .mfn-form .mfn-element-fields-wrapper').append( form_html_advanced );
}
if( sidebar_form.focus ) {
$('.sidebar-panel-content .mfn-form').find(sidebar_form.focus).focus();
sidebar_form.focus = false;
}
sidebar_form.after();
mfnoptsinputs.start();
//console.log( mfn.placeholders );
},
after() {
// sidebar_form.after
if( $('.mfn-ui').hasClass('mfn-sidebar-hidden-footer') ) $('.mfn-ui').removeClass('mfn-sidebar-hidden-footer');
/**
* Query loop
* */
if( edited_item.jsclass == 'wrap' || edited_item.jsclass == 'section' ){
//$('.mfn-element-fields-wrapper .mfn-form-row.type .segmented-options li:first-child a').trigger('click');
// console.log(edited_item);
if( typeof edited_item['attr']['type'] === 'undefined' || edited_item['attr']['type'] == '' ) {
$('.mfn-element-fields-wrapper .mfn-form-row.query_type .mfn-field-value').val('');
$('.mfn-element-fields-wrapper .mfn-form-row.query_post_type .mfn-field-value').val('');
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('');
}else if( ( typeof edited_item['attr']['query_type'] === 'undefined' || edited_item['attr']['query_type'] == 'terms' ) ) {
$('.mfn-element-fields-wrapper .mfn-form-row.query_post_type .mfn-field-value').val('');
}else if( typeof edited_item['attr']['query_type'] === 'undefined' || edited_item['attr']['query_type'] == 'posts' ) {
$('.mfn-element-fields-wrapper .query_terms_taxonomy .mfn-field-value').val('');
}
}
/**
*
* Blog & Portfolio tmpl
*
* */
if( builder_type == 'blog' && (edited_item.jsclass == 'section' || edited_item.jsclass == 'wrap') && _.has(edited_item['attr'], 'type') && edited_item['attr']['type'] == 'query' && $('.panel-edit-item .mfn-form .mfn-form-row.query_post_type .mfn-field-value').val() != 'post' ) {
$('.panel-edit-item .mfn-form .mfn-form-row.query_type .mfn-field-value').val('posts').trigger('change');
$('.panel-edit-item .mfn-form .mfn-form-row.query_post_type .mfn-field-value').val('post').trigger('change');
}
if( builder_type == 'portfolio' && (edited_item.jsclass == 'section' || edited_item.jsclass == 'wrap') && _.has(edited_item['attr'], 'type') && edited_item['attr']['type'] == 'query' && $('.panel-edit-item .mfn-form .mfn-form-row.query_post_type .mfn-field-value').val() != 'portfolio' ) {
$('.panel-edit-item .mfn-form .mfn-form-row.query_type .mfn-field-value').val('posts').trigger('change');
$('.panel-edit-item .mfn-form .mfn-form-row.query_post_type .mfn-field-value').val('portfolio').trigger('change');
}
/**
* Sidebar nav trigger click
*
if( $editpanel.find('.panel-edit-item .mfn-form .mfn-sidebar-fields-tabs ul.mfn-sft-nav').length ){
$editpanel.find('.panel-edit-item .mfn-form .mfn-sidebar-fields-tabs ul.mfn-sft-nav').each(function() {
$(this).find('li:first-child a').trigger('click');
});
}
*/
/**
* Deprecated hide
* */
if( $('.panel-edit-item .mfn-element-fields-wrapper .mfn-form-row.mfn-deprecated').length ){
if( !$('.panel-edit-item .mfn-element-fields-wrapper .mfn-form-row.mfn-deprecated .mfn-field-value').length ) $('.panel-edit-item .mfn-element-fields-wrapper .mfn-form-row.mfn-deprecated').remove();
}
//$('.panel-edit-item .mfn-element-fields-wrapper .mfn-form-row .checkboxes.pseudo .mfn-deprecated:not(.active)').remove();
if( $('.panel-edit-item .mfn-element-fields-wrapper .browse-image.multi .gallery-container li').length ){
uploader.sortable();
}
/**
* Slider bar
* */
if( $('.mfn-form .mfn-element-fields-wrapper .mfn-form-row .sliderbar:not(.mfn-initialized)').length ){
$('.mfn-form .mfn-element-fields-wrapper .mfn-form-row .sliderbar:not(.mfn-initialized)').each(function() {
sliderInput.init($(this));
});
}
/**
* Mask shapes
*/
const getMaskShapeParents = $('.panel-edit-item').find('[data-item="image"], [data-item="video"]');
if( getMaskShapeParents.length ) {
maskShapeHideChildrenConditional( getMaskShapeParents );
};
/**
* Font init
* */
if( $('.mfn-form .mfn-element-fields-wrapper .mfn-form-row.typography .mfn-toggle-fields-wrapper').is(':visible') ){
$('.mfn-form .mfn-element-fields-wrapper .mfn-form-row.typography').each(function() {
initFontSelect($(this));
});
}
/**
* WYSWIG
*/
if( $( '.mfn-form .mfn-element-fields-wrapper .html-editor' ).length ) {
sidebar_form.wyswig_active = true;
preventEdit = true;
MfnFieldTextarea.create();
//$(document).trigger('mfn:vb:edit');
}
if( $( '.mfn-form .mfn-element-fields-wrapper .visual-editor' ).length ) {
sidebar_form.wyswig_active = true;
preventEdit = true;
MfnFieldVisual.init();
}
}
}
let inputDrag = {
t: false,
i: false,
v: false,
n_v: false,
n: false,
u: false,
x: false,
x_s: false,
is_d: false,
l: false,
p: false,
path: false,
style: false,
postfix: false,
init: function () {
$(document).on( 'mousedown', '.mfn-slider-input .mfn-form-input', function(e) {
inputDrag.i = $(this);
inputDrag.start(e);
});
$(document).mouseup(this.end);
},
start: function (e) {
inputDrag.postfix = false;
inputDrag.l = false;
inputDrag.v = inputDrag.i.val();
inputDrag.n = inputDrag.v.replace(/[a-z\%]/g, "");
inputDrag.u = inputDrag.v.length ? inputDrag.v.replace(/[0-9\-]/g, "") : "px";
if( inputDrag.i.closest('.isLinked').length ) inputDrag.l = true;
if( inputDrag.i.closest('.pseudo').length ) inputDrag.p = true;
inputDrag.path = inputDrag.i.closest('.mfn-form-row').attr('data-csspath').replace('mcb-wrap-inner', 'mcb-wrap-inner-'+edited_item.uid);
inputDrag.style = inputDrag.i.closest('.mfn-form-row').attr('data-name');
inputDrag.postfix = typeof inputDrag.i.attr('data-key') !== 'undefined' ? inputDrag.i.attr('data-key') : '';
if( inputDrag.postfix && !inputDrag.l ) {
if( inputDrag.style.includes('border-width') ) {
inputDrag.style = inputDrag.style.replace('-', '-'+inputDrag.postfix+'-');
}else if( inputDrag.postfix == '0' || inputDrag.postfix == '1' || inputDrag.postfix == '2' || inputDrag.postfix == '3' ) {
if( inputDrag.postfix == '0' ) inputDrag.postfix = 'top-left';
if( inputDrag.postfix == '1' ) inputDrag.postfix = 'top-right';
if( inputDrag.postfix == '2' ) inputDrag.postfix = 'bottom-right';
if( inputDrag.postfix == '3' ) inputDrag.postfix = 'bottom-left';
inputDrag.style = inputDrag.style.replace('-', '-'+inputDrag.postfix+'-');
}else{
inputDrag.style = inputDrag.style+'-'+inputDrag.postfix;
}
};
inputDrag.t = setTimeout(function() {
$('.sidebar-wrapper').addClass('mfn-vb-sidebar-overlay');
inputDrag.is_d = true;
inputDrag.i.addClass('mfn-slider-input-initialized');
inputDrag.x = e.clientX - inputDrag.n;
inputDrag.x_s = inputDrag.x;
// init
$(document).mousemove( inputDrag.move );
}, 500);
},
move: function(e) {
if( !inputDrag.is_d ) return;
inputDrag.x = e.clientX;
if( inputDrag.x && inputDrag.x > 0 ) inputDrag.n_v = inputDrag.x - inputDrag.x_s;
inputDrag.i.val( inputDrag.n_v+inputDrag.u );
if( inputDrag.l ) {
inputDrag.i.closest('.isLinked').find('input').val(inputDrag.n_v+inputDrag.u);
}else{
inputDrag.i.val( inputDrag.n_v+inputDrag.u );
}
inputDrag.inline();
},
end: function (e) {
clearTimeout(inputDrag.t);
if( !inputDrag.is_d ) return;
inputDrag.is_d = false;
$(inputDrag.i).removeClass('mfn-slider-input-initialized');
$(document).off("mousemove", inputDrag.move);
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
inputDrag.i.trigger('change');
setTimeout(function() { inputDrag.inline(true); }, 1000);
if( inputDrag.v == inputDrag.n_v ) return;
},
inline: function( reset = false ) {
let val = reset ? 'remove' : inputDrag.n_v+inputDrag.u;
if( inputDrag.style.includes('flex') ){
changeInlineStyles(inputDrag.path, inputDrag.style, '0 0 '+val);
}else if( inputDrag.path.includes(',') || inputDrag.path.includes('|') ){
var css_arr = inputDrag.path.split(',');
css_arr.map(function(c) {
changeInlineStyles(c.replace('|', ':'), inputDrag.style, val);
});
}else{
changeInlineStyles(inputDrag.path, inputDrag.style, val);
}
}
};
inputDrag.init();
/**
* Builder settings
*/
var settings = {
option: false,
forceReload: false,
start: function(){
// column text editor
if( $('#mfn-visualbuilder').hasClass('column-visual') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="column-visual"] li:first').removeClass('active')
.siblings().addClass('active');
}
// navigation
if( !$content.find("body").hasClass('mfn-modern-nav') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="mfn-modern-nav"] li:first').removeClass('active')
.siblings().addClass('active');
}
// builder blocks
if( $content.find("body").hasClass('mfn-builder-blocks') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="builder-blocks"] li:first').addClass('active')
.siblings().removeClass('active');
}
if( $content.find("body").hasClass('simple-view') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="simple-view"] li:first').removeClass('active')
.siblings().addClass('active');
}
if( $content.find("body").hasClass('hover-effects-disable') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="hover-effects"] li:first').addClass('active')
.siblings().removeClass('active');
}
if( $("body").hasClass('mfn-default-ui') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="user-interface"] li:last-child').addClass('active')
.siblings().removeClass('active');
}
if( $("body").hasClass('mfn-scalable-preview') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="scalable-preview"] li:last-child').addClass('active')
.siblings().removeClass('active');
}
if( $("body").hasClass('mfn-presets-enabled') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="enable-presets"] li:last-child').addClass('active')
.siblings().removeClass('active');
}
if( $("body").hasClass('mfn-navigator-fixed') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="navigator-position"] li:last-child').addClass('active')
.siblings().removeClass('active');
}
if( $("body").hasClass('mfn-history-ajax-mode') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="history-mode"] li:last-child').addClass('active')
.siblings().removeClass('active');
}
// ui mode
if( $('#mfn-visualbuilder').hasClass('mfn-ui-dark') && !$('#mfn-visualbuilder').hasClass('mfn-ui-auto') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="ui-theme"] li').removeClass('active');
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="ui-theme"] li:last-child').addClass('active');
}else if( $('#mfn-visualbuilder').hasClass('mfn-ui-light') ){
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="ui-theme"] li').removeClass('active');
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="ui-theme"] li:nth-child(2)').addClass('active');
}else{
settings.detectOsTheme();
}
settings.run();
},
run: function() {
$('.mfn-ui .panel-settings .single-segmented-option.segmented-options ul li a').on('click', function(e) {
e.preventDefault();
if( mfn.view == 'demo' ) return;
settings.forceReload = false;
settings.option = $(this);
var $li = settings.option.closest('li'),
$row = settings.option.closest('.mfn-row');
if( $row.hasClass('mfn-reload-required') ){
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm mfn-modal-600 show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-settings"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Confirmation box</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <img class="icon" alt="" src="'+mfn.themepath+'/muffin-options/svg/warning.svg"> <h3>Page reload is required</h3> <p>Continue?</p><a class="mfn-btn mfn-btn-red btn-wide btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> <a class="mfn-btn btn-wide btn-modal-confirm" href="#"><span class="btn-wrapper">Reload</span></a> <a class="mfn-btn mfn-btn-green btn-wide btn-modal-confirm-with-save" href="#"><span class="btn-wrapper">Save & Reload</span></a> </div></div></div>');
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
return;
});
$('.btn-modal-confirm').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
window.onbeforeunload = null;
$(this).addClass('loading disabled');
settings.forceReload = true;
settings.continue();
});
$('.btn-modal-confirm-with-save').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('loading') ) return;
window.onbeforeunload = null;
$(this).addClass('loading disabled');
settings.forceReload = true;
if(!$('.btn-save-form-primary.btn-save-changes').hasClass('disabled')){
$('.btn-save-form-primary.btn-save-changes').trigger('click');
}
});
}else{
settings.continue();
}
});
},
continue: function() {
//console.log('continue');
var $li = settings.option.closest('li'),
$row = settings.option.closest('.mfn-row');
var option = settings.option.closest('.form-control').attr('data-option'),
value = false;
$li.addClass('active')
.siblings('li').removeClass('active');
value = $li.attr('data-value');
if( option == 'mfn-modern-nav' || option == 'simple-view' ){
if( value == 1 && !$content.find("body").hasClass(option) ){
$content.find("body").addClass(option);
}else{
$content.find("body").removeClass(option);
}
}else if( option == 'hover-effects' ){
if( value == 1 && !$content.find("body").hasClass('hover-effects-disable') ){
$content.find("body").addClass('hover-effects-disable');
}else{
$content.find("body").removeClass('hover-effects-disable');
}
}else if( option == 'ui-theme' ){
$("#mfn-visualbuilder").removeClass('mfn-ui-auto mfn-ui-dark mfn-ui-light').addClass(value);
if( ! isBlocks() ){
$content.find('body').removeClass('mfn-ui-auto mfn-ui-dark mfn-ui-light').addClass(value);
if(value == 'mfn-ui-auto'){
settings.detectOsTheme();
}
}
}else if( option == 'scalable-preview' ){
$("body").removeClass('mfn-scalable-preview');
if( value == 'enable' ) $("body").addClass('mfn-scalable-preview');
}else if( option == 'enable-presets' ){
$("body").removeClass('mfn-presets-enabled');
if( value == 'enable' ) $("body").addClass('mfn-presets-enabled');
}else if( option == 'history-mode' ){
$("body").removeClass('mfn-history-ls-mode mfn-history-ajax-mode');
if( value.length && value == '1' ){
$("body").addClass('mfn-history-ajax-mode');
}else{
$("body").addClass('mfn-history-ls-mode');
}
}else if( option == 'navigator-position' ){
$("body").removeClass('mfn-navigator-fixed');
if( value.length && value == '1' ){
$("body").addClass('mfn-navigator-fixed');
}
}else{
if( value ){
$('#mfn-visualbuilder').addClass(option);
} else {
$('#mfn-visualbuilder').removeClass(option);
}
}
settings.save(option, value);
},
save: function(option, value) {
$.ajax( mfnajaxurl, {
type : "POST",
data : {
'mfn-builder-nonce': wpnonce,
action: 'mfn_builder_settings',
option: option,
value: value,
}
}).done(function(response){
// show info for pre-completed option
/*if( ['pre-completed','column-visual'].includes(option) ){
$row.addClass('changed');
}*/
if( 'hover-effects' == option ){
triggerResize();
}
if( settings.forceReload ){
location.reload();
settings.forceReload = false;
}
});
},
detectOsTheme: function() {
if( $('#mfn-visualbuilder').hasClass('mfn-ui-auto') && !$('#mfn-visualbuilder').hasClass('builder-blocks') ){
if(window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches) {
$('#mfn-visualbuilder').addClass('mfn-ui-dark');
if($content) $content.find('body').addClass('mfn-ui-dark');
}else{
$('#mfn-visualbuilder').addClass('mfn-ui-light');
if($content) $content.find('body').addClass('mfn-ui-light');
}
window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', event => {
const newColorScheme = event.matches;
if( newColorScheme ) {
$('#mfn-visualbuilder').addClass('mfn-ui-dark');
if($content) $content.find('body').addClass('mfn-ui-dark');
}else{
$('#mfn-visualbuilder').removeClass('mfn-ui-dark').addClass('mfn-ui-light');
if($content) $content.find('body').removeClass('mfn-ui-dark').addClass('mfn-ui-light');
}
//const newColorScheme = event.matches ? $('#mfn-visualbuilder').addClass('mfn-ui-dark') /*$content.find('body').addClass('mfn-ui-dark')*/ : $('#mfn-visualbuilder').removeClass('mfn-ui-dark')/* $content.find('body').addClass('mfn-ui-dark')*/;
});
}
}
}
var modernmenu = {
start: function() {
$builder.on('click', '.mfn-header .mfn-element-menu', function(e) {
e.preventDefault();
$(this).closest('.mfn-header').toggleClass('mfn-element-menu-opened');
});
}
}
/**
* Introduction slider
*/
var introduction = {
overlay: $('.mfn-intro-overlay'),
options: {
// introduction.options.get()
get: function(){
return $('#mfn-visualbuilder').hasClass('intro');
},
// introduction.options.set()
set: function( value ){
if( mfn.view == 'demo' ) return;
$.ajax( mfnajaxurl, {
type : "POST",
data : {
'mfn-builder-nonce': wpnonce,
action: 'mfn_builder_settings',
option: 'intro',
value: value, // 0 - hide intro, 1 - show intro
}
});
}
},
// introduction.open()
open: function(){
// do not open, when disabled support
if ( parseInt( $('#mfn-visualbuilder').attr('data-tutorial') ) ) {
return false;
}
var $slider = $('.mfn-intro-container ul');
var slidesAmount = $('.mfn-intro-container ul li').size() - 1;
// slider do not exists, ie. white label mode
if( ! $slider.length ){
return false;
}
// slider has been skipped before
if( ! introduction.options.get() ){
return false;
}
// FIX: wpbakery - dp not show introduction when page options closed
if( $('#mfn-meta-page').hasClass('closed') ){
return false;
}
$('body').addClass('mfn-modal-open');
introduction.overlay.show();
// slick has been initialized before so skip steps below
if( $slider.hasClass('slick-slider') ){
return false;
}
$slider.slick({
cssEase: 'ease-out',
dots: false,
fade: true,
infinite: false
});
$slider.on('afterChange', function(event, slick, currentSlide, nextSlide){
if ( currentSlide === slidesAmount ){
introduction.options.set(0);
}
});
// close once on overlay click
introduction.overlay.on('click', function(e){
e.preventDefault();
if ( $(e.target).hasClass('mfn-intro-overlay') ){
introduction.close();
}
});
// close permanently on X or 'skip' click
$('.mfn-intro-close').on('click', function(e){
e.preventDefault();
introduction.options.set(0);
introduction.close();
});
},
// introduction.reopen()
reopen: function(){
introduction.options.set(1);
$('#mfn-visualbuilder').addClass('intro');
introduction.open();
},
// introduction.close()
close: function(){
$('body').removeClass('mfn-modal-open');
$('#mfn-visualbuilder').removeClass('intro');
introduction.overlay.fadeOut(200);
}
};
introduction.open();
$('.introduction-reopen').on('click', function(e) {
introduction.reopen();
});
// Global Wraps //
const GlobalWraps = {
selectedWrapTemplate: '',
selectedUid: '',
uidsToRemove: [],
regex: /(mcb-wrap-).([a-zA-Z0-9]*)/g, // to catch class name of wrap
wrapTriggered: '',
loadedPostsId: [], // prevent loading CSS files twice, just perf
convertToGlobal: function(uid) {
// GlobalWraps.convertToGlobal()
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-preset"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Convert to Global Wrap</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"><div class="mfn-form-row"><input placeholder="Name it" type="text" class="mfn-form-control mfn-global-section-name"></div><a class="mfn-btn mfn-btn-blue btn-modal-confirm" '+( mfn.view == 'demo' ? 'data-tooltip="Unavailable in Demo"' : '' )+' href="#"><span class="btn-wrapper">Save</span></a> <a class="mfn-btn btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> </div></div></div>');
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
});
$('.btn-modal-confirm').on('click', function(e){
e.preventDefault();
let $button = $(this);
$('.mfn-global-section-name').removeClass('error');
if( $('.mfn-global-section-name').val() != '' ){
if( $button.hasClass('loading') ) return;
$button.addClass('loading');
prepareForm.save = true;
let pf = prepareForm.get( uid );
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnconverttoglobal',
'mfn-builder-nonce': wpnonce,
name: $('.mfn-global-section-name').val(),
sections: pf,
type: 'wrap',
uid: uid,
obj: JSON.stringify(prepareForm.object)
},
type: 'POST',
success: function(response){
/*console.log(response);
console.log(mfnDbLists);*/
$button.removeClass('loading');
if( typeof mfnDbLists['global_wraps'] !== 'undefined' && mfnDbLists['global_wraps'].length < 2 ){
mfnDbLists['global_wraps'] = { '0': '- Default -' };
}
mfnDbLists['global_wraps'][response.key] = response.title;
//GlobalWraps.selectedUid = uid;
GlobalWraps.selectedWrapTemplate = response.key;
GlobalWraps.wrapTriggered = $content.find(`.wrap[data-uid=${GlobalWraps.selectedUid}]`);
$edited_div = $content.find(`.wrap[data-uid=${GlobalWraps.selectedUid}]`);
edited_item.attr['global_wraps_select'] = GlobalWraps.selectedWrapTemplate;
GlobalWraps.getGlobalWrap();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
GlobalWraps.selectedUid = '';
}
});
}else{
$('.mfn-global-section-name').addClass('error');
}
});
},
getGlobalWrap: function () {
// Replace actual wrap with global wrap | => void
const that = this;
that.wrapTriggered.addClass('mfn-global-wrap').attr('data-wrap', that.selectedUid);
let tmp_uid = that.selectedUid;
$.ajax({
url: mfnajaxurl,
data: {
action: 'importtemplate_wraponly',
'mfn-builder-nonce': wpnonce,
isGlobalWrap: true,
id: that.selectedWrapTemplate,
count: $(that.wrapTriggered).attr('data-order')
},
type: 'POST',
success: function(response) {
if ( response === '0' ) return that.resetWrapToDefaults();
// Imported content, insert it
that.wrapTriggered.replaceWith(response.html);
// Info for bebuilder, to know what is being saved
$.each(response.form, function(i, el) {
if( _.has(el, 'jsclass') && el.jsclass == 'wrap' ) {
el.title = 'Global Wrap';
mfn.pagedata.push( el );
}
});
// CSS related stuff
that.injectStylesheet();
// Remaining Lukas stuff
blink();
mfnChart();
historyStorage.add();
runAjaxElements();
setTimeout(function() {
if( $('body').hasClass('mfn-navigator-active') ) be_navigator.show( $(response.html).attr('data-uid') );
$builder.find('.mcb-wrap-'+$(response.html).attr('data-uid')+' .wrap-header.mfn-header .mfn-element-edit').trigger('click');
}, 200);
GlobalWraps.selectedUid = '';
},
});
},
injectStylesheet: function ( ) {
// While loading the stylesheet again, prevent loading CSS once more | => void
if( !this.loadedPostsId.includes( this.selectedWrapTemplate ) ) {
this.loadedPostsId.push( this.selectedWrapTemplate );
$content.find('head').append(`<link rel="stylesheet" type="text/css" href='${mfn.site_url}/wp-content/uploads/betheme/css/post-${this.selectedWrapTemplate}.css' />`);
}
},
fillWrapInfo: function( wrapClass, target ) {
// Fill wrap info to be able to edit it | => void
this.selectedUid = wrapClass.substring(9, wrapClass.length);
this.selectedWrapTemplate = $(target).val();
this.wrapTriggered = $content.find(`.wrap[data-uid=${this.selectedUid}]`);
},
resetWrapToDefaults: function() {
// Create new wrap, replace the global wrap | => void
const newWrap = elements.wrap(this.wrapTriggered.attr(`data-${screen}-size`));
this.wrapTriggered.replaceWith(newWrap.html);
this.wrapTriggered = $content.find(`.wrap[data-uid=${newWrap.uid}]`);
// Replace navigator ID to new
/*const navigatorWrap = $navigator.find('.navigator-tree').find(`[data-uid=${this.selectedUid}]`).attr('data-uid', newWrap.uid);
navigatorWrap[0].firstChild.nodeValue = 'Wrap';
navigatorWrap[0].setAttribute('data-uid', newWrap.uid);
navigatorWrap.closest('li').removeClass().addClass(`navigator-wrap nav-${newWrap.uid}`);*/
blink();
historyStorage.add();
queueMicrotask(() => sidebar_form.open( this.wrapTriggered ));
},
}
$editpanel.on('change', '.global_wraps_select', function(e) {
const wrapClass = $(this).closest('.mfn-element-fields-wrapper').attr('data-element'); // mcb-wrap-uid
const uidSelected = wrapClass.substring(9, wrapClass.length); //cut mcb-wrap, get the uid only
const templateSelected = $(e.target); //dropdown, select template
$edited_div = $content.find(`.wrap[data-uid=${uidSelected}]`);
GlobalWraps.fillWrapInfo(wrapClass, templateSelected);
if( !templateSelected.val() ) {
return GlobalWraps.resetWrapToDefaults();
}
GlobalWraps.getGlobalWrap();
})
// Global Sections //
const GlobalSections = {
selectedSectionTemplate: '',
selectedUid: '',
uidsToRemove: [],
regex: /(mcb-section-).([a-zA-Z0-9]*)/g, // to catch class name of wrap
sectionTriggered: '',
loadedPostsId: [], // prevent loading CSS files twice, just perf
convertToGlobal: function(uid) {
//GlobalSections.convertToGlobal()
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-preset"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Convert to Global Section</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"><div class="mfn-form-row"><input placeholder="Name it" type="text" class="mfn-form-control mfn-global-section-name"></div><a class="mfn-btn mfn-btn-blue btn-modal-confirm" '+( mfn.view == 'demo' ? 'data-tooltip="Unavailable in Demo"' : '' )+' href="#"><span class="btn-wrapper">Save</span></a> <a class="mfn-btn btn-modal-close" href="#"><span class="btn-wrapper">Cancel</span></a> </div></div></div>');
$('.btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
});
$('.btn-modal-confirm').on('click', function(e){
e.preventDefault();
let $button = $(this);
$('.mfn-global-section-name').removeClass('error');
if( $('.mfn-global-section-name').val() != '' ) {
if( $button.hasClass('loading') ) return;
$button.addClass('loading');
prepareForm.save = true;
let pf = prepareForm.get( uid );
$.ajax({
url: mfnajaxurl,
data: {
action: 'mfnconverttoglobal',
'mfn-builder-nonce': wpnonce,
name: $('.mfn-global-section-name').val(),
sections: pf,
type: 'section',
obj: JSON.stringify(prepareForm.object)
},
type: 'POST',
success: function(response){
/*console.log(response);
console.log(mfnDbLists);*/
$button.removeClass('loading');
if( typeof mfnDbLists['global_sections'] !== 'undefined' && mfnDbLists['global_sections'].length < 2 ){
mfnDbLists['global_sections'] = { '0': '- Default -' };
}
mfnDbLists['global_sections'][response.key] = response.title;
GlobalSections.selectedUid = uid;
GlobalSections.selectedSectionTemplate = response.key;
GlobalSections.sectionTriggered = $content.find(`.section[data-uid=${uid}]`);
$edited_div = $content.find(`.section[data-uid=${uid}]`);
GlobalSections.getGlobalSection();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
}
});
}else{
$('.mfn-global-section-name').addClass('error');
}
});
},
setSidebarClass: function() {
// Set sidebar class, hide options not dedicated for globals | => void
if ( $(this.sectionTriggered).hasClass('mfn-global-section') ) {
$('.sidebar-panel').addClass('mfn-global-section-edit');
$('#global_sections_select').find(`option[value="${ $(this.sectionTriggered).attr('data-mfn-global')}"]`).attr('selected', 'selected');
} else {
$('#global_sections_select').find(`option:first-child`).attr('selected', 'selected');
$('.sidebar-panel').removeClass('mfn-global-section-edit');
}
},
getGlobalSection: function () {
// Replace actual wrap with global wrap | => void
const that = this;
that.sectionTriggered.addClass('mfn-global-section').attr('data-section', that.selectedUid);
$.ajax({
url: mfnajaxurl,
data: {
action: 'importtemplate',
'mfn-builder-nonce': wpnonce,
isGlobalSection: true,
id: that.selectedSectionTemplate //template id
},
type: 'POST',
success: function(response) {
// Imported content, insert it
if ( response === '0' ) return that.resetSectionToDefaults();
// Info for bebuilder, to know what is being saved
$.each(response.form, function(i, el) {
if( _.has(el, 'jsclass') && el.jsclass == 'section' ) {
el['ver'] = elements_ver;
response.html = response.html.replaceAll('mfn-default-section', 'mfn-'+elements_ver+'-section');
}
mfn.pagedata.push(el);
});
that.sectionTriggered = $(that.sectionTriggered).replaceWith(response.html);
// Find and bind the newly inserted section
let newClass = response.html.match(that.regex)[0];
that.sectionTriggered = $content.find(`.${newClass}`);
// CSS related
that.injectStylesheet();
// Force display of lists
backToWidgets();
// Remaining Lukas stuff
blink();
mfnChart();
historyStorage.add();
runAjaxElements();
setTimeout(function() { if( $('body').hasClass('mfn-navigator-active') ) be_navigator.show( $(response.html).attr('data-uid') ); }, 100);
}
});
},
injectStylesheet: function () {
// While loading the stylesheet again, prevent loading CSS once more | => void
if( !this.loadedPostsId.includes( this.selectedSectionTemplate ) ) {
this.loadedPostsId.push( this.selectedSectionTemplate );
$content.find('head').append(`<link rel="stylesheet" type="text/css" href='${mfn.site_url}/wp-content/uploads/betheme/css/post-${this.selectedSectionTemplate}.css' />`);
}
},
fillSectionInfo: function( sectionClass, target ) {
// Fill wrap info to be able to edit it | => void
this.selectedUid = sectionClass.substring(12, sectionClass.length);
this.selectedSectionTemplate = $(target).val();
this.sectionTriggered = $content.find(`.section[data-uid=${this.selectedUid}]`);
},
fillSectionInfoWithoutCut: function(sectionUid, target) {
// Fill wrap info to be able to edit it | => void
this.selectedUid = sectionUid;
this.selectedSectionTemplate = target;
this.sectionTriggered = $content.find(`.section[data-uid=${this.selectedUid}]`);
},
resetSectionToDefaults: function() {
// Create new wrap, replace the global wrap | => void
const newWrap = elements.section();
this.sectionTriggered.replaceWith(newWrap.html);
this.sectionTriggered = $content.find(`.section[data-uid=${newWrap.uid}]`);
blink();
historyStorage.add();
queueMicrotask(() => sidebar_form.open( this.sectionTriggered ));
},
}
$editpanel.on('change', '.global_sections_select', function(e) {
const sectionClass = $(this).closest('.mfn-element-fields-wrapper').attr('data-element'); // mcb-wrap-uid
const uidSelected = sectionClass.substring(9, sectionClass.length); //cut mcb-wrap, get the uid only
const templateSelected = $(e.target); //dropdown, select template
$edited_div = $content.find(`.section[data-uid=${uidSelected}]`);
GlobalSections.fillSectionInfo(sectionClass, templateSelected);
if( !templateSelected.val() ) {
return GlobalSections.resetSectionToDefaults();
}
GlobalSections.getGlobalSection();
})
$('.shortcutsinfo-open').on('click', function(e) {
e.preventDefault();
$('.modal-shortcuts').addClass('show');
});
$('.dynamicdatainfo-open').on('click', function(e) {
e.preventDefault();
$('.modal-dynamic-data-info').addClass('show');
$('.modal-dynamic-data-info .modalbox-content li').removeClass('copied');
});
$('.modal-dynamic-data-info .modalbox-content a').on('click', function(e) {
e.preventDefault();
const {target} = e;
const dynamicDataCodeLocation = $(target).closest('li').find('.mfn-dd-label');
var code = dynamicDataCodeLocation.text();
navigator.clipboard.writeText( code );
$(target).closest('li').attr('data-tooltip', 'Copied');
setTimeout(function() {
$(target).closest('li').attr('data-tooltip', 'Click to copy');
}, 2000);
});
$('.mfn-option-dropdown.btn-save-action a').on('click', function(e) {e.preventDefault();});
// export / import
$('.mfn-export-import-opt').on('click', function(e) {
e.preventDefault();
$('.mfn-export-import-opt').removeClass('active');
$(this).addClass('active');
$(".panel").hide();
$('.export-import-current').text($(this).text());
let filtr = $(this).attr('data-filter');
if( filtr == 'panel-export-import-presets' ){
$('#export-presets-data-textarea').val( JSON.stringify(mfn.presets.filter( (it) => it.type == 'custom' )) );
}
if( filtr == 'panel-export-import-classes' ){
$('#export-classes-data-textarea').val( JSON.stringify(mfn.classes) );
}
$('.'+filtr).show();
});
$('.mfn-export-button').on('click', function(e) {
e.preventDefault();
if(!$(this).hasClass('mfn-icon-check-blue')){
$('.mfn-export-field').select();
document.execCommand("copy");
$(this).find('span').text('Copied').addClass('mfn-icon-check-blue');
localStorage.setItem( 'mfn-builder', JSON.stringify({
clipboard: $('.mfn-export-field').val()
}) );
}
});
$('.mfn-items-import-template li').on('click', function() {
$('.mfn-items-import-template li').removeClass('active');
$(this).addClass('active');
});
$('.mfn-export-cancel').on('click', function(e) {
e.preventDefault();
backToWidgets();
});
function handlePaste (e) {
var clipboardData, pastedData;
// Stop data actually being pasted into div
e.stopPropagation();
e.preventDefault();
// Get pasted data via clipboard API
clipboardData = e.clipboardData || window.clipboardData;
pastedData = clipboardData.getData('Text');
if( !pastedData && JSON.parse(localStorage.getItem('mfn-builder')).clipboard ){
pastedData = JSON.parse(localStorage.getItem('mfn-builder')).clipboard;
}
$('#import-data-textarea').val(pastedData);
}
if( $('#import-data-textarea').length ) document.getElementById('import-data-textarea').addEventListener('paste', handlePaste);
// pre built sections
$('.pre-built-opt').on('click', function(e) {
e.preventDefault();
$('.pre-built-opt').removeClass('active');
$(this).addClass('active');
$('.header-prebuilt-sections .pre-built-current').text($(this).text());
let filtr = $(this).data('filter');
$('.mfn-visualbuilder .sidebar-panel-content ul.prebuilt-sections-list li').hide();
$('.mfn-visualbuilder .sidebar-panel-content ul.prebuilt-sections-list li.'+filtr).show();
});
// header preview
var headerTmpl = {
confirm: '<div class="mfn-modal modal-confirm modal-header-sticky show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-delete"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Sticky Header</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close btn-modal-abort" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <h3>Building mode</h3> <p>By default, sticky header is same as the default one. If you want to customize it, please choose one of the following options:</p><a class="mfn-btn btn-wide btn-modal-duplicate" href="#"><span class="btn-wrapper">Copy default</span></a> <a class="mfn-btn btn-wide btn-modal-build-new" href="#"><span class="btn-wrapper">Create from scratch</span></a> </div></div></div>',
init: function() {
var pageopts = mfn.page_options;
if( typeof pageopts['header_sticky'] != 'undefined' && pageopts['header_sticky'] == 'enabled' ) $('.mfn-header-type-preview a[data-preview="header-sticky"]').removeClass('disabled');
if( typeof pageopts['header_mobile'] != 'undefined' && pageopts['header_mobile'] == 'enabled' ) $('.mfn-header-type-preview a[data-preview="header-mobile"]').removeClass('disabled');
$('.mfn-preview-opt-header').on('click', function(e) {
e.preventDefault();
var opt = $(this).attr('data-preview');
if( opt == 'header-default' ){
headerTmpl.clickDefault();
}else if( opt == 'header-sticky' && !$(this).hasClass('disabled') ){
headerTmpl.clickSticky();
}else if( opt == 'header-mobile' && !$(this).hasClass('disabled') ){
headerTmpl.clickMobile();
}
});
},
clickDefault: function() {
headerTmpl.resetEmpty();
$('.mfn-preview-opt-header').removeClass('btn-active');
elements_ver = 'default';
$('.mfn-preview-opt-header[data-preview="header-default"]').addClass('btn-active');
if( $content.find('.mfn-header-tmpl').hasClass('mfn-hasMobile') ){
$('.mfn-preview-opt[data-preview="desktop"]').trigger('click');
}
if( !$('.mfn-header-type-preview a[data-preview="header-sticky"]').hasClass('btn-active') ) $content.find('body').removeClass('mfn-header-scrolled');
$content.find('.mfn-header-tmpl').removeClass('mfn-hasMobile');
be_layout.emptys.page();
},
clickSticky: function() {
headerTmpl.resetEmpty();
if( $('.mfn-preview-opt-header[data-preview="header-mobile"]').hasClass('btn-active') ){
$('.sidebar-panel-footer .mfn-preview-opt[data-preview="desktop"]').trigger('click');
}
$('.mfn-preview-opt-header').removeClass('btn-active');
elements_ver = 'header-sticky';
$('.mfn-preview-opt-header[data-preview="header-sticky"]').addClass('btn-active');
$content.find('body').addClass('mfn-header-scrolled');
$content.find('.mfn-header-tmpl').addClass('mfn-hasSticky');
$content.find('.mfn-header-tmpl').removeClass('mfn-hasMobile');
//$('.sidebar-panel-footer .mfn-preview-opt[data-preview="desktop"]').trigger('click');
if( !$content.find('.mfn-header-tmpl .mfn-header-sticky-section').length ){
headerTmpl.beforeSticky();
}
},
clickMobile: function() {
headerTmpl.resetEmpty();
$('.mfn-preview-opt-header').removeClass('btn-active');
elements_ver = 'header-mobile';
$('.mfn-preview-opt-header[data-preview="header-mobile"]').addClass('btn-active');
$content.find('body').removeClass('mfn-header-scrolled');
$content.find('.mfn-header-tmpl').addClass('mfn-hasMobile');
$('.mfn-preview-opt[data-preview="mobile"]').trigger('click');
be_layout.emptys.page();
},
beforeSticky: function() {
$('.mfn-ui').addClass('mfn-modal-open').append(headerTmpl.confirm);
$('.modal-header-sticky').on('click', '.btn-modal-abort', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-header-sticky').remove();
headerTmpl.clickDefault();
});
$('.modal-header-sticky').on('click', '.btn-modal-build-new', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-header-sticky').remove();
be_layout.emptys.page();
});
$('.modal-header-sticky').on('click', '.btn-modal-duplicate', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-header-sticky').remove();
headerTmpl.duplicate();
});
},
duplicate: function(){
if( $content.find('.mfn-header-tmpl .vb-item.mcb-section.mfn-default-section').length ){
$content.find('.mfn-header-tmpl .vb-item.mcb-section.mfn-default-section').each(function() {
var uid = $(this).attr('data-uid');
copypaste.copy(uid, $content.find('.mfn-header-tmpl-builder'));
});
}
be_layout.emptys.page();
},
resetEmpty: function() {
if( $('.mfn-header-tmpl .mfn-section-start').length ){
$('.mfn-header-tmpl .mfn-section-start').remove();
}
}
};
// preview
$('.mfn-preview-opt').on('click', function(e) {
e.preventDefault();
let preview_type = $(this).data('preview');
if(!$('body').hasClass('mfn-preview-mode')){ $('body').addClass('mfn-preview-mode'); }
switchPreview(preview_type);
});
$('.mfn-preview-mode-close').on('click', function(e) {
e.preventDefault();
$('body').removeClass('mfn-preview-mode');
switchPreview('desktop');
screen = 'desktop';
$('.mfn-visualbuilder').removeClass('preview-mobile preview-tablet preview-desktop preview-laptop');
});
$editpanel.on('click', '.responsive-switcher li', function() {
if( $(this).hasClass('active') ) return;
let preview_type = $(this).find('span').attr('data-device');
switchPreview(preview_type);
if(preview_type != 'desktop'){ if( !$('body').hasClass('mfn-preview-mode') ) { $('body').addClass('mfn-preview-mode'); } }else{ $('body').removeClass('mfn-preview-mode'); $('.mfn-visualbuilder').removeClass('preview-mobile preview-tablet preview-desktop preview-laptop'); }
});
// another pages modal
var anotherPagesModal = {
init: function() {
$(document).on('click', '.mfn-show-another-pages', function(e) {
e.preventDefault();
if( !$('.modal-another-pages .modalbox-content div').length ) anotherPagesModal.get();
$('.modal-another-pages').addClass('show');
});
$(document).on('click', '.modal-another-pages .mfn-another-pages-list li a', function() {
$('.modal-another-pages').removeClass('show');
});
anotherPagesModal.search();
},
get: function() {
if( $('.modal-another-pages .modalbox-content').hasClass('loading') ) return;
$('.modal-another-pages .modalbox-content').addClass('loading');
$.ajax({
url: mfnajaxurl,
data: {
'mfn-builder-nonce': wpnonce,
action: 'getpageslist',
pageid: pageid
},
type: 'POST',
success: function(response){
$('.modal-another-pages .modalbox-content').removeClass('loading');
$('.modal-another-pages .modalbox-content').html(response);
}
});
},
search: function() {
$editpanel.on('keyup paste change', '.modal-another-pages .modalbox-header .mfn-search', function() {
var val = $(this).val().toLowerCase();
if( val.length && val.length > 2 ){
$(".modal-another-pages").addClass('mfn-another-pages-searching');
$('.modal-another-pages .modalbox-content ul li').hide();
$('.modal-another-pages .modalbox-content ul li[data-name*="'+val+'"]').show();
}else{
$(".modal-another-pages").removeClass('mfn-another-pages-searching');
$('.modal-another-pages .modalbox-content ul li').removeAttr('style');
}
});
}
}
// dynamic_data dynamic data
var dynamicData = {
id: false,
ls: function() {
return localStorage.getItem('mfn-navigator') ? localStorage.getItem(`mfn-navigator`) : false;
},
init: function() {
$(document).on('click', '.is_dynamic_data .mfn-button-dynamic-data', function(e) {
e.preventDefault();
dynamicData.id = $(this).closest('.mfn-form-row').attr('data-id');
dynamicData.open($(this));
});
$editpanel.on('click', '.modal-dynamic-data:not(.mfn-dd-element-column, .mfn-dd-element-visual) .modalbox-content ul li a', function(e) {
e.preventDefault();
let dd_code = $(this).find('.mfn-dd-code').text();
let type = $(this).attr('data-type');
let this_val = $editpanel.find('.mfn-form-row[data-id="'+dynamicData.id+'"] .mfn-field-value').val();
$('.modal-dynamic-data').removeClass('show');
if($editpanel.find('.mfn-form-row[data-id="'+dynamicData.id+'"] .mfn-field-value').length) {
if( type == 'featured_image' ){
$editpanel.find('.mfn-form-row[data-id="'+dynamicData.id+'"] .mfn-field-value').val(dd_code).trigger('change');
}else{
$editpanel.find('.mfn-form-row[data-id="'+dynamicData.id+'"] .mfn-field-value').val(this_val+dd_code).trigger('change');
}
}
});
$editpanel.on('click', '.modal-dynamic-data .modalbox-content ul li .mfn-dd-copy', function(e) {
e.preventDefault();
let $el = $(this);
let text = $el.siblings('a').find('.mfn-dd-code').html();
navigator.clipboard.writeText(text);
$el.attr('data-tooltip', 'Copied!');
setTimeout(function() {
$el.attr('data-tooltip', 'Copy');
}, 1000);
});
dynamicData.search();
},
open: function(ddbutton) {
let it = $('.mfn-element-fields-wrapper').attr('data-element');
let label_prefix = 'Page';
let type = ddbutton.closest('.mfn-form-row').attr('data-dynamic');
let $queried = $content.find('.'+it).closest('.mfn-looped-items');
let dd_query_type = 'posts';
let dd_posttype = mfn.post_type;
label_prefix = dd_posttype;
let dd_fields = [];
// reset classes
$('.modal-dynamic-data').attr('class', 'mfn-modal modal-dynamic-data');
$('.modal-dynamic-data .mfn-dd-dynamic-ul').empty();
$('.modal-dynamic-data .mfn-dd-global-ul').empty();
$('.modal-dynamic-data .mfn-dd-user-ul').empty();
$('.modal-dynamic-data .mfn-dd-author-ul').empty();
if( $queried.length ) {
$('.modal-dynamic-data').addClass('mfn-dd-looped-item');
}
$('.modal-dynamic-data').addClass('mfn-dd-'+type);
$('.modal-dynamic-data').addClass('mfn-dd-element-'+edited_item.jsclass);
if( $queried.length ){
let queried_obj = mfn.pagedata.filter( (item) => item.uid == $queried.attr('data-uid') )[0];
dd_query_type = typeof queried_obj['attr']['query_type'] !== 'undefined' ? queried_obj['attr']['query_type'] : 'posts';
if( dd_query_type == 'terms' ){
dd_posttype = typeof queried_obj['attr']['query_terms_taxonomy'] !== 'undefined' ? queried_obj['attr']['query_terms_taxonomy'] : 'category';
label_prefix = dynamic_data.labels[dd_posttype];
}else{
dd_posttype = typeof queried_obj['attr']['query_post_type'] !== 'undefined' && queried_obj['attr']['query_post_type'] ? queried_obj['attr']['query_post_type'] : 'post';
label_prefix = dd_posttype;
}
}
$('.modal-dynamic-data').addClass('mfn-dd-'+dd_query_type);
// set dynamic options
dd_fields = dynamic_data.dynamic[dd_query_type][type];
if( typeof dynamic_data.dynamic[dd_query_type] !== 'undefined' && typeof dynamic_data.dynamic[dd_query_type][edited_item.type] !== 'undefined' && typeof dynamic_data.dynamic[dd_query_type][edited_item.type][type] !== 'undefined' ){
dd_fields = dd_fields.concat( dynamic_data.dynamic[dd_query_type][edited_item.type][type] );
}
if( dd_posttype != '' && typeof dynamic_data.dynamic[dd_query_type][dd_posttype] !== 'undefined' ){
if( typeof dynamic_data.dynamic[dd_query_type][dd_posttype][type] !== 'undefined' && dynamic_data.dynamic[dd_query_type][dd_posttype][type].length ) {
// dynamic_data.dynamic[dd_query_type][dd_posttype][type].map( (el, i) => $('.modal-dynamic-data .mfn-dd-dynamic-ul').append('<li><span class="mfn-dd-copy" data-tooltip="Copy"><i class="far fa-copy"></i></span><a data-type="'+type+'" href="#"><span class="mfn-dd-label">'+label_prefix+' '+el.label+'</span><span class="mfn-dd-code">{'+el.key+'}</span></a></li>') );
dd_fields = dd_fields.concat(dynamic_data.dynamic[dd_query_type][dd_posttype][type]);
}
}
if( dd_fields.length ){
dd_fields.sort((a,b)=> (a.key > b.key ? 1 : -1));
dd_fields.map( (el, i) => $('.modal-dynamic-data .mfn-dd-dynamic-ul').append('<li class="mfn-dd-li-'+el.key.replaceAll(':', '-').replaceAll('_', '-')+'" data-name="'+label_prefix+' '+el.label+' '+el.key+'"><span class="mfn-dd-copy" data-tooltip="Copy"><i class="far fa-copy"></i></span><a data-type="'+type+'" href="#"><span class="mfn-dd-label">'+label_prefix+' '+el.label+'</span><span class="mfn-dd-code">{'+el.key+'}</span></a></li>') );
}
if( typeof dynamic_data.user[type] != 'undefined' ) {
dynamic_data.user[type].map( (el, i) => $('.modal-dynamic-data .mfn-dd-user-ul').append('<li><span class="mfn-dd-copy" data-tooltip="Copy"><i class="far fa-copy"></i></span><a data-type="'+type+'" href="#"><span class="mfn-dd-label">'+el.label+'</span><span class="mfn-dd-code">{'+el.key+'}</span></a></li>') );
}
if( dd_query_type == 'posts' && typeof dynamic_data.author[type] != 'undefined' ) {
dynamic_data.author[type].map( (el, i) => $('.modal-dynamic-data .mfn-dd-author-ul').append('<li><span class="mfn-dd-copy" data-tooltip="Copy"><i class="far fa-copy"></i></span><a data-type="'+type+'" href="#"><span class="mfn-dd-label">'+el.label+'</span><span class="mfn-dd-code">{'+el.key+'}</span></a></li>') );
}
if( typeof dynamic_data.global[type] != 'undefined' ) {
dynamic_data.global[type].map( (el, i) => $('.modal-dynamic-data .mfn-dd-global-ul').append('<li><span class="mfn-dd-copy" data-tooltip="Copy"><i class="far fa-copy"></i></span><a data-type="'+type+'" href="#"><span class="mfn-dd-label">'+el.label+'</span><span class="mfn-dd-code">{'+el.key+'}</span></a></li>') );
}
//console.log(type);
$('.modal-dynamic-data').addClass('show');
// static options dynamic set
$('.modal-dynamic-data .modalbox-content .mfn-dd-dynamic-set ul li a').each(function() {
let subtype = $(this).attr('data-subtype');
$(this).attr('data-type', type);
$(this).find('.mfn-dd-code').text('{'+type+subtype+'}');
if( $(this).closest('.mfn-dd-type-wrapper').hasClass('mfn-dd-type-wrapper-global') && label == 'image' ){
// exception for logo
$(this).find('.mfn-dd-label span').text('logo');
}else{
$(this).find('.mfn-dd-label span').text(type);
}
});
},
search: function() {
$editpanel.on('keyup paste change', '.modal-dynamic-data .modalbox-header .mfn-search', function() {
var val = $(this).val().toLowerCase();
if( val.length ){
if( val.length > 2 ){
$(".modal-dynamic-data").addClass('mfn-dynamic-searching');
$('.mfn-dd-type-wrapper').addClass('dd-type-hidden');
$('.modal-dynamic-data .modalbox-content ul li').hide();
$('.modal-dynamic-data .modalbox-content ul li[data-name*="'+val+'"]').closest('.mfn-dd-type-wrapper').show();
$('.modal-dynamic-data .modalbox-content ul li[data-name*="'+val+'"]').show();
$('.modal-dynamic-data .modalbox-content ul li[data-name*="'+val+'"]').closest('.mfn-dd-type-wrapper').removeClass('dd-type-hidden');
}else{
$(".modal-dynamic-data").removeClass('mfn-dynamic-searching');
$('.mfn-dd-type-wrapper').removeClass('dd-type-hidden');
$('.modal-dynamic-data .modalbox-content ul li').removeAttr('style');
$('.modal-dynamic-data .modalbox-content .mfn-dd-type-wrapper').removeAttr('style');
}
}else{
$(".modal-dynamic-data").removeClass('mfn-dynamic-searching');
$('.mfn-dd-type-wrapper').removeClass('dd-type-hidden');
$('.modal-dynamic-data .modalbox-content ul li').removeAttr('style');
$('.modal-dynamic-data .modalbox-content .mfn-dd-type-wrapper').removeAttr('style');
}
});
}
}
function switchPreview(preview_type) {
$('.mfn-preview-toolbar .mfn-preview-opt').removeClass('btn-active');
$('.mfn-preview-toolbar .mfn-preview-opt[data-preview="'+preview_type+'"]').addClass('btn-active');
$('.mfn-visualbuilder').removeClass('preview-mobile preview-tablet preview-desktop preview-laptop');
if(preview_type != 'desktop'){
$('.mfn-visualbuilder').addClass('preview-'+preview_type)
}
screen = preview_type;
if( sidebar_form.is_themeoptions ){
sidebar_themeoptions.render();
}else if( sidebar_form.is_pageoptions ){
page_options_tab.render();
}else{
sidebar_form.render();
}
setSizeLabels();
$('.sidebar-panel-footer .btn-change-resolution > a span:first-child').attr('class', 'mfn-icon mfn-icon-'+preview_type);
if( $content.find('.mfn-current-editing').length && builder_type != 'header' ){
setTimeout(function() {
$content.find('html, body').animate({ scrollTop: $edited_div.offset().top - 50 }, 500);
}, 100);
}
if( builder_type == 'header' && elements_ver == 'header-mobile' && screen !== 'mobile' ){
//$('.mfn-preview-opt-header[data-preview="header-default"]').trigger('click');
$('.mfn-preview-opt-header[data-preview="header-default"]').addClass('btn-active');
$('.mfn-preview-opt-header[data-preview="header-mobile"]').removeClass('btn-active');
elements_ver = 'default';
}else if( screen == 'mobile' && elements_ver != 'header-mobile' && builder_type == 'header' && !$('.mfn-preview-opt-header[data-preview="header-mobile"]').hasClass('disabled') ){
$('.mfn-preview-opt-header[data-preview="header-mobile"]').trigger('click');
}else if( builder_type == 'header' && elements_ver == 'header-sticky' && screen !== 'mobile' ){
headerTmpl.clickSticky();
}
if( $builder.find('.mfn-looped-items-slider-wrapper').length ){
$builder.find('.mfn-looped-items-slider-wrapper').each(function() {
re_render($(this).closest('.mcb-section').attr('data-uid'));
});
}
be_layout.emptys.page();
}
let cart_tmpl = {
init: function() {
$('.mfn-cart-type-preview .mfn-preview-opt-cart').on('click', function(e) {
e.preventDefault();
if( $(this).hasClass('btn-active') ) return;
let preview = $(this).attr('data-preview');
$(this).siblings('a').removeClass('btn-active');
$(this).addClass('btn-active');
$builder.removeClass('mfn-cart-tmpl-not-empty mfn-cart-tmpl-empty');
if( preview == 'cart-empty' ) {
$builder.addClass('mfn-cart-tmpl-empty');
}else{
$builder.addClass('mfn-cart-tmpl-not-empty');
}
elements_ver = preview;
be_layout.emptys.page();
});
}
}
let be_navigator = {
width: 280,
left: 0,
border: function() {
return (winW - be_navigator.width - 20)
},
ls: function() {
return localStorage.getItem('mfn-navigator') ? JSON.parse(localStorage.getItem(`mfn-navigator`)) : false;
},
init: function() {
// be_navigator.init()
//console.log(be_navigator.ls());
if( typeof be_navigator.ls() === 'object' ){
be_navigator.open();
}
$('.btn-navigator-switcher').on('click', function(e) {
e.preventDefault();
if( $('body').hasClass('mfn-navigator-active') ){
be_navigator.hide();
}else{
be_navigator.open();
}
});
$(document).on('click', '.btn-navigator-hide', function(e) {
e.preventDefault();
be_navigator.hide();
});
$(document).on('click', '.btn-navigator-toggle-all', function(e) {
e.preventDefault();
if( $('.mfn-navigator').hasClass('mfn-navigator-toggled-all') ){
$('.mfn-navigator').removeClass('mfn-navigator-toggled-all');
$(this).children('span').attr('class', 'mfn-icon mfn-icon-list-collapsed');
$(this).attr('data-tooltip', 'Expand');
}else{
$('.mfn-navigator').addClass('mfn-navigator-toggled-all');
$(this).children('span').attr('class', 'mfn-icon mfn-icon-list-expanded');
$(this).attr('data-tooltip', 'Collapse');
}
});
be_navigator.ui();
be_navigator.search();
},
show: function(uid, click = false) {
//be_navigator.show()
//console.log('nav show');
if( !click ) be_navigator.open();
//setTimeout(function() {
// stop if is currently select
if( $navigator.find('li.nav-'+uid+' > a').hasClass('active-element') ) return;
$navigator.find('.active-element').removeClass('active-element');
if( !$('.mfn-navigator').hasClass('mfn-navigator-toggled-all') ) {
$navigator.find('li.nav-'+uid).siblings('li').removeClass('active');
//$navigator.find('li.nav-'+uid).siblings('li').children('ul').slideUp();
$navigator.find('li.nav-'+uid).closest('li.navigator-wrap').siblings('li').removeClass('active');
// $navigator.find('li.nav-'+uid).closest('li.navigator-wrap').siblings('li').children('ul').slideUp();
if( $navigator.find('li.nav-'+uid).closest('li.navigator-wrap').closest('li.navigator-wrap').length )$navigator.find('li.nav-'+uid).closest('li.navigator-wrap').closest('li.navigator-wrap').siblings('li').removeClass('active');
//if( $navigator.find('li.nav-'+uid).closest('li.navigator-wrap').closest('li.navigator-wrap').length )$navigator.find('li.nav-'+uid).closest('li.navigator-wrap').closest('li.navigator-wrap').siblings('li').children('ul').slideUp();
$navigator.find('li.nav-'+uid).closest('li.navigator-section').siblings('li').removeClass('active');
//$navigator.find('li.nav-'+uid).closest('li.navigator-section').siblings('li').children('ul').slideUp();
if( $navigator.find('li.nav-'+uid).find('li.active').length ) {
$navigator.find('li.nav-'+uid).find('li').removeClass('active');
//$navigator.find('li.nav-'+uid).find('li').children('ul').slideUp();
}
if( $navigator.find('li.nav-'+uid).closest('li.active').length ) {
$navigator.find('li.nav-'+uid).closest('li.active').removeClass('active');
}
//be_navigator.reset();
$navigator.find('li.nav-'+uid).closest('li.navigator-section:not(.active)').addClass('active');
$navigator.find('li.nav-'+uid).closest('li.navigator-wrap:not(.active)').addClass('active');
$navigator.find('li.nav-'+uid).closest('li.navigator-wrap:not(.active)').closest('li.navigator-wrap:not(.active)').addClass('active')/*.children('ul').slideDown()*/;
$navigator.find('li.nav-'+uid).addClass('active');
//$navigator.find('li.nav-'+uid+' > ul').slideDown();
}
$navigator.find('li.nav-'+uid+' > a').addClass('active-element');
//}, 1);
},
reset: function() {
$('.mfn-navigator .navigator-tree li.active').find('ul').slideUp();
$('.mfn-navigator .navigator-tree li.active').removeClass('active');
$('.mfn-navigator .navigator-tree li .active-element').removeClass('active-element');
},
search: function() {
$('.mfn-navigator-search-input').on('keyup paste change', function() {
var val = $(this).val().replace(/ /g, '_').toLowerCase();
if( val.length && val.length > 2 ){
$(".mfn-navigator").addClass('mfn-nav-searching');
$navigator.find('li').hide();
$navigator.find('li.navitemtype[data-name*="'+val+'"]').closest('.navigator-section').show();
$navigator.find('li.navitemtype[data-name*="'+val+'"]').closest('.navigator-wrap').show();
$navigator.find('li.navitemtype[data-name*="'+val+'"]').parents('.mfn-sub-nav').show();
$navigator.find('li.navitemtype[data-name*="'+val+'"]').show();
}else{
$navigator.find('li.navigator-section').show();
$(".mfn-navigator").removeClass('mfn-nav-searching');
$navigator.find('li').removeAttr('style');
$navigator.find('li:not(.active) > .mfn-sub-nav').removeAttr('style');
}
});
},
open: function() {
$('.mfn-navigator .navigator-tree').html('');
if( $builder.find('.section.vb-item').length ){
$builder.find('.section.vb-item').each(function() {
let $section = $(this);
var sect_attr = '';
if( typeof $section.attr('id') !== 'undefined' ) sect_attr = $section.attr('id');
if( $section.hasClass('mfn-global-section') ) sect_attr = 'Global';
$('.mfn-navigator .navigator-tree').append( be_navigator.item('Section', $section.attr('data-uid'), sect_attr ));
if( !$section.hasClass('mfn-global-section') && $section.find('.wrap.vb-item').length ) {
$('.mfn-navigator .navigator-tree li.nav-'+$section.attr('data-uid')).append('<ul class="mfn-sub-nav mfn-sub-nav-modules mfn-sub-nav-wraps"></ul>');
let $submenu_section = $('.mfn-navigator .navigator-tree li.nav-'+$section.attr('data-uid')+' .mfn-sub-nav');
$section.find('.wrap.vb-item:not(.mfn-nested-wrap)').each(function() {
let $wrap = $(this);
if( $wrap.hasClass('divider') ) {
$submenu_section.append( be_navigator.item('Divider', $wrap.attr('data-uid'), '') );
}else{
$submenu_section.append( be_navigator.item('Wrap', $wrap.attr('data-uid'), ($wrap.hasClass('mfn-global-wrap') ? 'Global' : $wrap.attr('data-desktop-size'))) );
if( !$wrap.hasClass('mfn-global-wrap') ) {
$('.mfn-navigator .navigator-tree li.nav-'+$wrap.attr('data-uid')).append('<ul class="mfn-sub-nav mfn-sub-nav-modules mfn-sub-nav-items"></ul>');
if( $wrap.find('.mfn-module.vb-item').length ) {
let $submenu_wrap = $('.mfn-navigator .navigator-tree li.nav-'+$wrap.attr('data-uid')+' .mfn-sub-nav');
let $wrap_childs = $wrap.children('.mcb-wrap-inner');
if( !$wrap_childs.children('.mfn-module.vb-item').length ){
$wrap_childs = $wrap_childs.children('div');
}
if( !$wrap_childs.children('.mfn-module.vb-item').length ){
$wrap_childs = $wrap_childs.children('div');
}
$wrap_childs.children('.mfn-module.vb-item').each(function() {
let $item = $(this);
let itemObj = mfn.pagedata.filter( (item) => item.uid == $item.attr('data-uid') )[0];
if( $item.hasClass('mcb-column') ) {
$submenu_wrap.append( be_navigator.item(itemObj.jsclass.replace('_2', ''), $item.attr('data-uid'), $item.attr('data-desktop-size')) );
}else{
$submenu_wrap.append( be_navigator.item('Wrap', $item.attr('data-uid'), $item.attr('data-desktop-size')) );
$('.mfn-navigator .navigator-tree li.nav-'+$item.attr('data-uid')).append('<ul class="mfn-sub-nav mfn-sub-nav-modules mfn-sub-nav-items"></ul>');
if( $item.find('.vb-item').length ){
let $submenu_nested_wrap = $('.mfn-navigator .navigator-tree li.nav-'+$item.attr('data-uid')+' .mfn-sub-nav');
$item.find('.vb-item').each(function() {
let $nested_item = $(this);
let n_itemObj = mfn.pagedata.filter( (item) => item.uid == $nested_item.attr('data-uid') )[0];
$submenu_nested_wrap.append( be_navigator.item(n_itemObj.jsclass.replace('_2', ''), $nested_item.attr('data-uid'), $nested_item.attr('data-desktop-size')) );
});
}
}
});
}
}
}
});
}
});
}
$('body').addClass('mfn-navigator-active');
if( !be_navigator.ls() ){
localStorage.setItem( 'mfn-navigator', JSON.stringify({'left': '50%', 'top': '50%'}) );
}else if( typeof be_navigator.ls() === 'object' ){
$('.mfn-navigator').css( be_navigator.ls() );
}
be_navigator.sortable.init();
},
sortable: {
// be_navigator.sortable.init();
connect_with: ".mfn-navigator .mfn-sub-nav-modules",
timer: false,
init: function() {
be_navigator.sortable.section();
// be_navigator.sortable.modules();
$('.mfn-navigator .navigator-tree li a').on('mouseenter', function() {
$('.mfn-navigator ul.mfn-sub-nav-last-level').removeClass('mfn-sub-nav-last-level');
if( $(this).parent('li').hasClass('navigator-item') ) {
be_navigator.sortable.connect_with = ".mfn-navigator .navigator-wrap .mfn-sub-nav-modules";
}else if( ($(this).parent('li').hasClass('navigator-wrap') && builder_type == 'header') || ($(this).parent('li').hasClass('navigator-wrap') && $(this).parent('li.navigator-wrap').find('.navigator-wrap').length) ) {
be_navigator.sortable.connect_with = ".mfn-navigator .mfn-sub-nav-wraps";
}else if( $(this).parent('li').hasClass('navigator-wrap') ) {
$('.mfn-navigator ul li.navigator-wrap li.navigator-wrap ul').each(function() { $(this).addClass('mfn-sub-nav-last-level'); });
be_navigator.sortable.connect_with = ".mfn-navigator .mfn-sub-nav-modules:not(.mfn-sub-nav-last-level)";
}
//if( !$(".mfn-navigator").hasClass('mfn-sortable-modules-started') && $(this).closest('ul').attr('style') === 'undefined' ) $(this).closest('ul').css('min-height', $(this).closest('ul').outerHeight());
setTimeout(function() { be_navigator.sortable.modules(); }, 5);
});
},
section: function() {
$(".mfn-navigator .navigator-tree").sortable({
axis: 'y',
//placeholder: "mfn-nav-sortable-placeholder",
forcePlaceholderSize: true,
containment: ".mfn-navigator",
update: function( event, ui ) {
if( ui.sender ) return;
let $section = $builder.find('.mcb-section-'+ui.item.children('a').attr('data-uid'));
if( ui.item.prev('li').length ){
let target = ui.item.prev('li').children('a').attr('data-uid');
let $section_target = $builder.find('.mcb-section-'+target);
$section_target.after( $section.clone(true) );
}else{
let target = ui.item.next('li').children('a').attr('data-uid');
let $section_target = $builder.find('.mcb-section-'+target);
$section_target.before( $section.clone(true) );
}
//$section.find('.mfn-header').first().find('.mfn-element-edit').trigger('click');
$section.remove();
historyStorage.add()
}
});
},
modules: function() {
$(".mfn-navigator .mfn-sub-nav-modules").sortable({
axis: 'y',
//placeholder: "ui-sortable-placeholder",
forcePlaceholderSize: true,
connectWith: be_navigator.sortable.connect_with,
containment: ".mfn-navigator",
start: function( event, ui ) {
$(".mfn-navigator").addClass('mfn-sortable-modules-started');
},
stop: function( event, ui ) {
$(".mfn-navigator").removeClass('mfn-sortable-modules-started');
$('.mfn-navigator .navigator-section.hover').removeClass('hover');
be_navigator.sortable.timer = false;
},
over: function( event, ui ) {
$('.mfn-navigator .hover').removeClass('hover');
be_navigator.sortable.timer = false;
if( !ui.placeholder.closest('.navigator-section').hasClass('active') ) ui.placeholder.closest('.navigator-section').addClass('hover');
if( !ui.placeholder.closest('ul').closest('li').hasClass('active') ) ui.placeholder.closest('ul').closest('li').addClass('hover');
//if( !ui.placeholder.closest('ul').closest('li').hasClass('hover') ) ui.placeholder.closest('ul').closest('li').addClass('hover')
if( !$('.mfn-navigator').hasClass('mfn-navigator-toggled-all') && !ui.placeholder.closest('ul').closest('li').hasClass('active') ) {
be_navigator.sortable.timer = setTimeout(function() {
if( !ui.placeholder.closest('.navigator-section').hasClass('active') ) ui.placeholder.closest('.navigator-section').addClass('active');
ui.placeholder.closest('ul').closest('li').addClass('active');
$('.mfn-navigator .hover').removeClass('hover');
setTimeout(function() { $(".mfn-navigator .mfn-sub-nav-modules").sortable('refreshPositions'); },200);
}, 1000);
}
},
out: function( event, ui ) {
be_navigator.sortable.timer = false;
},
update: function( event, ui ) {
if( ui.sender ) return;
$(".mfn-navigator").removeClass('mfn-sortable-modules-started');
//$('.mfn-navigator ul').removeAttr('style');
be_navigator.sortable.timer = false;
//ui.item.children('a').trigger('click');
let $item = $builder.find('.vb-item[data-uid="'+ui.item.children('a').attr('data-uid')+'"]');
if( ui.item.prev('li').length ){
let target = ui.item.prev('li').children('a').attr('data-uid');
let $item_target = $builder.find('.vb-item[data-uid="'+target+'"]');
$item_target.after( $item.clone(true) );
}else if( ui.item.next('li').length ){
let target = ui.item.next('li').children('a').attr('data-uid');
let $item_target = $builder.find('.vb-item[data-uid="'+target+'"]');
$item_target.before( $item.clone(true) );
}else{
let target = ui.item.closest('ul').closest('li').children('a').attr('data-uid');
let $wrap_target = $builder.find('.vb-item[data-uid="'+target+'"] > .mfn-module-wrapper').length ? $builder.find('.vb-item[data-uid="'+target+'"] > .mfn-module-wrapper') : $builder.find('.vb-item[data-uid="'+target+'"] > .mfn-wrapper-for-wraps') ;
$wrap_target.append( $item.clone(true) );
}
//$item.find('.mfn-element-edit').trigger('click');
$item.remove();
historyStorage.add()
be_layout.emptys.sections();
be_layout.emptys.wraps();
}
});
}
},
ui: function() {
let screen_border = be_navigator.border();
$(".mfn-navigator").draggable({
handle: ".modalbox-header",
start: function( event, ui ) {
$('body').removeClass('mfn-navigator-fixed');
$('.mfn-ui').addClass('mfn-navigator-dragging');
},
stop: function( event, ui ) {
$('.mfn-visualbuilder').removeClass('mfn-navigator-placeholder');
$('.mfn-ui').addClass('mfn-navigator-dragging-end');
setTimeout(function() {
$('.mfn-ui').removeClass('mfn-navigator-dragging-end');
$('.mfn-ui').removeClass('mfn-navigator-dragging');
}, 300);
localStorage.setItem( 'mfn-navigator', JSON.stringify({left: ui.position.left, top: ui.position.top}) );
if( be_navigator.left >= screen_border ) {
$('body').addClass('mfn-navigator-fixed');
settings.save('navigator-position', '1');
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="navigator-position"] li:last-child').addClass('active').siblings().removeClass('active');
}else{
$('body').removeClass('mfn-navigator-fixed');
settings.save('navigator-position', '');
$('.mfn-ui .panel-settings .mfn-form .settings .form-control[data-option="navigator-position"] li:first-child').addClass('active').siblings().removeClass('active');
}
},
drag: function( event, ui ) {
be_navigator.left = ui.position.left;
if( be_navigator.left >= screen_border ){
$('.mfn-visualbuilder').addClass('mfn-navigator-placeholder');
}else{
$('.mfn-visualbuilder').removeClass('mfn-navigator-placeholder');
}
}
});
$( ".mfn-navigator" ).resizable({
maxHeight: winH,
maxWidth: 600,
minHeight: 300,
minWidth: 250
});
$(document).on('click', '.mfn-navigator .navigator-tree .navigator-arrow', function(e) {
var $li = $(this).closest('li');
if( $('.mfn-navigator').hasClass('mfn-navigator-toggled-all') ) return;
/*if( $li.hasClass('navigator-section') && !$li.hasClass('active') ){
be_navigator.reset();
}*/
/*if( $li.hasClass('active') ) {
$li.removeClass('active');
$li.find('a.active-element').removeClass('active-element');
$li.find('li.active').removeClass('active');
}else{
$li.addClass('active');
}*/
$li.toggleClass('active');
//$('.mfn-navigator ul').removeAttr('style');
//$li.children('a').trigger('click');
if( $navigator.hasClass('mfn-nav-searching') ){
$navigator.find('li').removeAttr('style');
$navigator.find('li:not(.active) > .mfn-sub-nav').removeAttr('style');
$navigator.removeClass('mfn-nav-searching');
}
});
$(document).on('click', '.mfn-navigator .navigator-tree li > a', function(e) {
e.preventDefault();
if( $(this).hasClass('active-element') ) return;
$content.find('html, body').stop();
var uid = $(this).attr('data-uid');
$edited_div = $content.find('.vb-item[data-uid="'+uid+'"]');
if( $('.mfn-navigator .navigator-tree li a.active-element').length ){
$('.mfn-navigator .navigator-tree li a.active-element').removeClass('active-element');
}
sidebar_form.is_class = false;
//Global section, prevent opening edit form, leave scroll only
if( !$(this).closest('.toggle-disabled').length ) {
sidebar_form.open($edited_div, true);
} else {
backToWidgets();
}
if( builder_type != 'header' ) $content.find('html, body').animate({ scrollTop: $edited_div.offset().top - 50 }, 500);
$(this).addClass('active-element');
if( !$(this).parent('li').hasClass('active') ) $(this).parent('li').addClass('active');
});
},
hide: function() {
$('body').removeClass('mfn-navigator-active');
localStorage.removeItem('mfn-navigator');
},
item: function(type, uid, size = false) {
//navigatorHtml();
// be_navigator.item()
let el = mfn.pagedata.filter( (item) => item.uid == uid )[0];
if( typeof el === 'undefined' ) return;
if( type == 'Section' ){
$html = '<li class="'+(size && size == 'Global' ? 'navigator-section navigator-section-global' : 'navigator-section')+' nav-'+uid+'"><a data-uid="'+uid+'" href="#"><span class="navigator-link-label">'+(size && size !== '' ? '#'+size : 'Section');
if( size && size == 'Global' ){
$html += '<span class="navigator-section-id">Global</span>';
}
$html += '</span></a>';
$html += '<div class="nav-item-tools">';
if( (!size || size != 'Global') && _.has(el, 'attr') ){
if( _.has(el['attr'], 'visibility') ){
$html += be_navigator.responsive(el['attr']['visibility'], uid);
}
if( _.has(el['attr'], 'hide') && el.attr.hide ) $html += '<span class="mfn-icon mfn-icon-hide"></span>';
$html += '<span class="navigator-arrow"><i class="icon-down-open-big"></i></span>';
}
$html += '</div>';
$html += '</li>';
}else if( type == 'Wrap'){
$html = '<li class="'+(size && size == 'Global' ? 'navigator-wrap navigator-wrap-global' : 'navigator-wrap')+' nav-'+uid+'"><a data-uid="'+uid+'" href="#"><span class="navigator-link-label">'+type+'</span> <span class="navigator-size-label">'+size+'</span></a><div class="nav-item-tools">';
if( _.has(el['attr'], 'visibility') ){
$html += be_navigator.responsive(el['attr']['visibility'], uid);
}
$html += '<span class="navigator-arrow"><i class="icon-down-open-big"></i></span></div></li>';
}else{
$html = '<li data-name="'+type.replace('_', '-')+'" class="navigator-item nav-'+uid+' navitemtype"><a data-uid="'+uid+'" href="#"><span class="mfn-icon mfn-icon-'+type.replaceAll('_', '-').replaceAll(' ', '-')+'"></span><span class="navigator-link-label">'+type.replaceAll('thankyou', '').replaceAll('_', ' ')+'</span></a>';
$html += '<div class="nav-item-tools">';
if( _.has(el['attr'], 'visibility') ){
$html += be_navigator.responsive(el['attr']['visibility'], uid);
}
$html += '</div>';
$html += '</li>';
}
return $html;
},
responsive: function( resp, uid, append = false ){
let html = '';
let visi = resp.split(' ');
if( visi.length ){
_.map(visi, function(opt) {
if( opt.length ) html += '<span class="mfn-nav-responsive-icon mfn-icon mfn-icon-'+opt.replace('hide-', '')+'"></span>';
});
}
if( !append ){
return html;
}else{
$('.mfn-navigator .navigator-tree li.nav-'+uid+' > .nav-item-tools .mfn-nav-responsive-icon').remove();
$('.mfn-navigator .navigator-tree li.nav-'+uid+' > .nav-item-tools').prepend(html);
}
}
}
// end preview
// revisions
$('.mfn-revisions-opt').on('click', function(e) {
e.preventDefault();
$('.mfn-revisions-opt').removeClass('active');
$(this).addClass('active');
$(".panel").hide();
$('.revisions-current').text($(this).text());
let filtr = $(this).data('filter');
$('.'+filtr).show();
});
$('.sidebar-panel #mfn-widgets-list .mfn-search').on('focus', function() {
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li').show();
$('.mfn-filter-items').removeClass('active');
$('.mfn-filter-items[data-filter="all"]').addClass('active');
$('.filter-items-current').text($('.mfn-filter-items[data-filter="all"]').text());
});
var options = {
valueNames: [ 'title' ]
};
var userList = new List('mfn-widgets-list', options);
var optionsicons = {
valueNames: [ 'titleicon' ]
};
var iconsList = new List('modal-select-icon', optionsicons);
// filter items
$('.mfn-filter-items').on('click', function(e) {
e.preventDefault();
$('.mfn-filter-items').removeClass('active');
$(this).addClass('active');
$('.filter-items-current').text($(this).text());
let filtr = $(this).data('filter');
$('.sidebar-panel #mfn-widgets-list .mfn-search').val('');
userList.search();
if(filtr == 'all'){
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li').show();
}else{
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li').hide();
$('.mfn-visualbuilder .sidebar-panel-content ul.items-list li.'+filtr).show();
}
});
// back to widgets
$("li.menu-items a ").on('click', function(e) {
e.preventDefault();
backToWidgets();
});
$('.back-to-widgets').on('click', function(e) {
e.preventDefault();
backToWidgets();
});
// close modal icon
$editpanel.on('click', '.mfn-modal .btn-modal-close', function(e) {
e.preventDefault();
$(this).closest('.mfn-modal').removeClass('show');
if( !$('.mfn-modal.show').length ){
$('.mfn-ui').removeClass('.mfn-modal-open');
$('body').removeClass('.mfn-modal-open');
}
});
// modal icon
$('.mfn-ui .modal-select-icon .modalbox-search .mfn-form-select').on('change', function() {
let choosed = $(this).val();
if( $('.mfn-ui .modal-select-icon .modalbox-search .mfn-search').val() != '' ){
$('.mfn-ui .modal-select-icon .modalbox-search .mfn-search').val('');
iconsList.search();
}
$('.mfn-ui .modal-select-icon .modalbox-content ul.mfn-items-list li').hide();
$('.mfn-ui .modal-select-icon .modalbox-content ul.mfn-items-list li.'+choosed).show();
});
// show prebuilts
$("li.menu-sections a ").on('click', function(e) {
e.preventDefault();
showPrebuilts();
// resetSaveButton();
});
// show revisions
$(".mfn-visualbuilder ul li.menu-revisions a ").on('click', function(e) {
e.preventDefault();
if( mfn.view == 'demo' ) return;
$(".panel").hide();
$(".header").hide();
$(".panel-revisions").show();
$(".header-revisions").show();
$('.mfn-revisions-opt').removeClass('active');
if( ui_mode == 'dev' ){
$(this).closest('li').siblings('li').removeClass('active');
$(this).closest('li').addClass('active');
}
$('.mfn-revisions-opt').first().trigger('click');
// resetSaveButton();
});
// show import export
$(".mfn-export-get").on('click', function(e) {
e.preventDefault();
if( mfn.view == 'demo' ) return;
$('.mfn-export-import-opt').removeClass('active');
updateExportInput();
$(".panel").hide();
$(".header").hide();
$('.export-import-current').text($('.mfn-export-import-opt').first().text());
$('.mfn-export-import-opt').first().addClass('active');
$(".panel-export-import").show();
$(".header-export-import").show();
if( ui_mode == 'dev' ){
$(this).closest('li').siblings('li').removeClass('active');
$(this).closest('li').addClass('active');
}
// resetSaveButton();
});
// show single page import
$("li.menu-page a ").on('click', function(e) {
e.preventDefault();
if( mfn.view == 'demo' ) return;
$('.mfn-export-import-opt').removeClass('active');
$(".panel").hide();
$(".header").hide();
$('.export-import-current').text($('.mfn-export-import-opt[data-filter="panel-export-import-single-page"]').text());
$('.mfn-export-import-opt[data-filter="panel-export-import-single-page"]').addClass('active');
$(".panel-export-import-single-page").show();
$(".header-export-import").show();
if( ui_mode == 'dev' ){
$(this).closest('li').siblings('li').removeClass('active');
$(this).closest('li').addClass('active');
}
// resetSaveButton();
});
// show settings
$('.mfn-settings-tab').on('click', function(e) {
e.preventDefault();
if (mfn.view == 'demo') return;
$('.mfn-ui').addClass('mfn-sidebar-hidden-footer');
$(".panel").hide();
$(".header").hide();
$(".panel-settings").show();
$(".header-settings").show();
if( ui_mode == 'dev' ){
$('.topbar-nav #main-menu li').removeClass('active');
$('.topbar-nav li.menu-settings').addClass('active');
}
if( $builder.find('.mfn-current-editing').length ) $builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor-full') ) $('.mfn-ui').addClass('mfn-class-editor-full');
// resetSaveButton();
});
let page_options_tab = {
init: function() {
$(document).on('click', '.mfn-view-options-tab', function(e) {
e.preventDefault();
if (mfn.view == 'demo') return;
if( sidebar_form.wyswig_active && !copypaste.uid ) {
if( $editpanel.find( '.mfn-form .html-editor' ).length ) MfnFieldTextarea.destroy();
if( $editpanel.find( '.mfn-form .visual-editor' ).length ) tinymce.execCommand( 'mceRemoveEditor', false, 'mfn-editor' );
}
sidebar_form.wyswig_active = false;
$(".panel").hide();
$(".header").hide();
$(".panel-view-options").show();
$(".header-view-options").show();
if( $builder.find('.mfn-current-editing').length ) $builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
edited_item = mfn.page_options;
//$('.mfn-ui .panel-view-options .mfn-form.mfn-form-options').html( mfnDbLists.pageoptions( edited_item ) );
//console.log(edited_item);
if( ui_mode == 'dev' ){
$('.topbar-nav #main-menu li').removeClass('active');
$('.topbar-nav li.menu-settings').addClass('active');
}
sidebar_form.is_themeoptions = false;
sidebar_form.is_class = false;
sidebar_form.is_pageoptions = true;
page_options_tab.render();
$('style.mfn-fields-switcher-normal-hover').remove();
$('body').append('<style class="mfn-builder-fields-css mfn-fields-switcher-normal-hover">.mfn-ui .mfn-form .mfn-sft-nav li:first-child a{background: var(--mfn-ui-sft-nav-tab-bg-active); color: var(--mfn-ui-sft-nav-tab-color-active);} .mfn-ui .mfn-form .mfn-sft.mfn-sft-normal{display: block;}</style>');
});
},
render: function() {
if( sidebar_form.no_render ) return;
//console.log('page option render');
$('.mfn-ui .panel-view-options .mfn-form.mfn-form-options').html('');
const mfn_form_po = new MfnForm( mfnDbLists.pageoptions );
let form_html = mfn_form_po.render();
$('.mfn-ui .panel-view-options .mfn-form.mfn-form-options').html('<div class="page-options-form-wrapper">'+form_html+'</div>');
sidebar_form.after();
mfnoptsinputs.start();
MfnFieldTextarea.initForCSSandJS();
/**
* Slider bar
* */
if( $('.panel-view-options .mfn-form .mfn-form-row .sliderbar:not(.mfn-initialized)').length ) {
$('.panel-view-options .mfn-form .mfn-form-row .sliderbar:not(.mfn-initialized)').each(function() {
sliderInput.init($(this));
});
}
}
}
$(document).on('click', '.mfn-copytoclipboard', function(e) {
e.preventDefault();
if( typeof $(this).attr('data-clipboard') === 'undefined' ) return;
let cb = $(this).attr('data-clipboard');
let $link = $(this);
navigator.clipboard.writeText(cb);
$link.attr('data-tooltip', 'Copied');
setTimeout(function() {
$link.attr('data-tooltip', 'Click to copy to clipboard');
}, 3000);
});
$(document).on('click', '.sidebar-menu-inner ul li:not(.menu-wordpress) a', function() {
if( $(this).hasClass('mfn-settings-tab') ){
$('.mfn-ui').addClass('mfn-sidebar-hidden-footer');
}else{
$('.mfn-ui').removeClass('mfn-sidebar-hidden-footer');
}
if( $builder.find('.mfn-current-editing').length ) $builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor-full') ) $('.mfn-ui').addClass('mfn-class-editor-full');
});
/**
* Inlimited custom fonts
* mfnNewFont()
*/
var mfnNewFont = {
hiddenInput: $('.mfn-form-themeoptions .themeoption.font-custom-fields input'),
getCardsAmount: () => $('.mfn-form-themeoptions #themeoptions-font-custom').find('h5').length,
html: function() {
let i = mfnNewFont.getCardsAmount();
return `<div class="mfn-form-row mfn-form-row themeoption"><h5 class="row-header-title">Font ${i}</h5></div>
<div class="mfn-form-row mfn-form-row themeoption font-custom${i}" data-id="font-custom${i}" data-name="font-custom${i}">
<label class="form-label form-label-wrapper">Name<a class="mfn-option-btn mfn-option-blank mfn-fr-help-icon" target="_blank" data-tooltip="Toggle description" href="#"><span class="mfn-icon mfn-icon-desc"></span></a></label>
<div class="desc-group"><span class="description">Name for Custom Font uploaded below.<br>Font will show on fonts list after <b>click the Save Changes</b> button.</span></div>
<div class="form-group">
<div class="form-control">
<input name="font-custom${i}" class="mfn-form-control mfn-form-input mfn-field-value preview-font-custom${i}input" type="text" placeholder="" value="" autocomplete="off">
</div>
</div>
</div>
<div class="mfn-form-row mfn-form-row themeoption font-custom${i}-woff" data-id="font-custom${i}-woff" data-name="font-custom${i}-woff">
<label class="form-label form-label-wrapper">.woff<a class="mfn-option-btn mfn-option-blank mfn-fr-help-icon" target="_blank" data-tooltip="Toggle description" href="#"><span class="mfn-icon mfn-icon-desc"></span></a></label>
<div class="desc-group"><span class="description">WordPress 5.0 blocks .woff upload. Please use <a target="_blank" href="plugin-install.php?s=Disable+Real+MIME+Check&tab=search&type=term">Disable Real MIME Check</a> plugin.</span></div>
<div class="form-content has-icon has-icon-right"><div class="form-group browse-image has-addons has-addons-append empty">
<div class="form-control">
<input class="mfn-form-control mfn-field-value mfn-form-input preview-font-custom${i}-woffinput" type="text" name="font-custom${i}-woff" value="" data-type="font">
<a class="mfn-option-btn mfn-button-delete" title="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a>
</div>
<div class="form-addon-append browse-image-single">
<a href="#" class="mfn-button-upload"><span class="label">Browse</span></a>
</div>
<div class="break"></div>
<div class="selected-image">
</div>
</div></div>
</div>
<div class="mfn-form-row mfn-form-row themeoption font-custom${i}-ttf" data-id="font-custom${i}-ttf" data-name="font-custom${i}-ttf">
<label class="form-label form-label-wrapper">.ttf<a class="mfn-option-btn mfn-option-blank mfn-fr-help-icon" target="_blank" data-tooltip="Toggle description" href="#"><span class="mfn-icon mfn-icon-desc"></span></a></label>
<div class="desc-group"><span class="description">WordPress 5.0 blocks .ttf upload. Please use <a target="_blank" href="plugin-install.php?s=Disable+Real+MIME+Check&tab=search&type=term">Disable Real MIME Check</a> plugin.</span></div>
<div class="form-content has-icon has-icon-right"><div class="form-group browse-image has-addons has-addons-append empty">
<div class="form-control">
<input class="mfn-form-control mfn-field-value mfn-form-input preview-font-custom${i}-ttfinput" type="text" name="font-custom${i}-ttf" value="" data-type="font">
<a class="mfn-option-btn mfn-button-delete" title="Delete" href="#"><span class="mfn-icon mfn-icon-delete"></span></a>
</div>
<div class="form-addon-append browse-image-single">
<a href="#" class="mfn-button-upload"><span class="label">Browse</span></a>
</div>
<div class="break"></div>
<div class="selected-image">
</div>
</div></div>
</div>
`;
},
init: function() {
$(document).on('click', '.mfn-form-themeoptions .mfn_new_font.themeoption a', function(e) {
e.preventDefault();
$(this).closest('.themeoption').before(mfnNewFont.html());
});
}
}
mfnNewFont.init();
$(document).on('click', '.mfn-checkbox', function(e) {
e.preventDefault();
let opt = $(this);
if( opt.hasClass('active') ) {
opt.removeClass('active');
if( opt.find('input[type="checkbox"]').length ) opt.find('input[type="checkbox"]').prop('checked', false).trigger('change');
if( opt.closest('.mfn-publication-opt-wrapper').length ) opt.closest('.mfn-publication-opt-wrapper').removeClass('mfn-opt-active'); // popup publication dates
}else{
opt.addClass('active');
if( opt.find('input[type="checkbox"]').length ) opt.find('input[type="checkbox"]').prop('checked', true).trigger('change');
if( opt.closest('.mfn-publication-opt-wrapper').length ) opt.closest('.mfn-publication-opt-wrapper').addClass('mfn-opt-active'); // popup publication dates
}
});
// theme options [themeoptions]
var sidebar_themeoptions = {
tab: false,
// theme options theme_options theme-options
init: function() {
$(document).on('click', 'li.menu-themeoptions a', function(e) {
e.preventDefault();
if( mfn.view == 'demo' ) return;
if( !_.has(renderMfnFields, 'themeoptions') ) return;
sidebar_form.is_themeoptions = true;
sidebar_form.is_class = false;
sidebar_form.is_pageoptions = false;
if( $builder.find('.mfn-current-editing').length ) $builder.find('.mfn-current-editing').removeClass('mfn-current-editing');
if( $('.mfn-ui').hasClass('mfn-class-editor') ) $('.mfn-ui').removeClass('mfn-class-editor');
if( $content.find('body').hasClass('mfn-class-editor-preview') ) $content.find('body').removeClass('mfn-class-editor-preview');
if( $('.mfn-ui').hasClass('mfn-class-editor-full') ) $('.mfn-ui').addClass('mfn-class-editor-full');
$('.mfn-ui .panel-view-themeoptions .mfn-form.mfn-form-themeoptions').empty();
let $tabler = $('.panel-view-themeoptions .vb-themeoptions');
$(".panel").hide();
$(".header").hide();
$(".panel-view-themeoptions").show();
$(".header-themeoptions").show();
if( ui_mode == 'dev' ) {
$('.topbar-nav #main-menu li').removeClass('active');
$('.topbar-nav li.menu-settings').addClass('active');
}
sidebar_themeoptions.startView();
edited_item = mfnDbLists.themeoptions;
edited_item['jsclass'] = 'themeoption';
$('.mfn-ui .panel-view-themeoptions .mfn-form.mfn-form-themeoptions').html( renderMfnFields.themeoptions( edited_item ) );
// console.log(edited_item);
});
$editpanel.on('click', '.header-themeoptions .header-to-back a', function(e) {
e.preventDefault();
if( $('.vb-themeoptions .vb-to.active').length ){
//$('.vb-themeoptions .vb-to.active').removeClass('active');
$('.vb-themeoptions').removeClass('vb-to-form-view');
$('.header-to-back').hide();
if( $('.vb-themeoptions .vb-to-content.vb-to-active').length ) $('.vb-themeoptions .vb-to-content.vb-to-active').removeClass('vb-to-active');
if($('.vb-themeoptions .vb-to-li-active').length) $('.vb-themeoptions .vb-to-li-active').removeClass('vb-to-li-active');
}
});
$editpanel.on('click', '.vb-themeoptions .vb-to-header a', function(e) {
e.preventDefault();
sidebar_themeoptions.tab = $(this).closest('.vb-to');
var $tabler = $(this).closest('.vb-themeoptions');
var href = $(this).attr('href');
var id = href.replace('#themeoptions-', '');
if( $(this).hasClass('vb-themeoptions-link-expander') ){
if( sidebar_themeoptions.tab.hasClass('active') ){
sidebar_themeoptions.tab.removeClass('active');
$tabler.removeClass('vb-to-form-view');
if( $tabler.find('.vb-to-content.vb-to-active').length ) $tabler.find('.vb-to-content.vb-to-active').removeClass('vb-to-active');
}else{
sidebar_themeoptions.tab.addClass('active');
if( href == '#themeoptions-gdpr' && $('.mfn-form-themeoptions .themeoption.gdpr input:checked').val() == '1' ){
if( $content.find('#mfn-gdpr').length ) $content.find('#mfn-gdpr').addClass('show');
}
if( sidebar_themeoptions.tab.find('.vb-to-content').length ) sidebar_themeoptions.render();
}
}else if( $(this).hasClass('vb-themeoptions-form-link') ) {
if($tabler.hasClass('vb-to-form-view')) {
$tabler.removeClass('vb-to-form-view');
$('.header-to-back').hide();
if($tabler.find('.vb-to-li-active').length) $tabler.find('.vb-to-li-active').removeClass('vb-to-li-active');
if( $tabler.find('.vb-to-content.vb-to-active').length ) $tabler.find('.vb-to-content.vb-to-active').removeClass('vb-to-active');
}else{
if($tabler.find('.vb-to-active').length) $tabler.find('.vb-to-active').removeClass('vb-to-active');
if($tabler.find('.vb-to-li-active').length) $tabler.find('.vb-to-li-active').removeClass('vb-to-li-active');
$('.header-to-back').show();
$tabler.addClass('vb-to-form-view');
sidebar_themeoptions.tab.find(href).addClass('vb-to-active');
mfnoptsinputs.start();
if( $('.panel-view-themeoptions .mfn-form .mfn-form-row .sliderbar:not(.mfn-initialized)').length ) {
$('.panel-view-themeoptions .mfn-form .mfn-form-row .sliderbar:not(.mfn-initialized)').each(function() {
sliderInput.init($(this));
});
}
initSocialSorting(sidebar_themeoptions.tab);
initFontSelect(sidebar_themeoptions.tab);
if( !$tabler.find('.CodeMirror').length ) MfnFieldTextarea.initForCSSandJS();
$(this).parent('li').addClass('vb-to-li-active');
$(this).parent('li').addClass('vb-to-li-active');
}
}
});
},
render: function() {
sidebar_themeoptions.tab.find('.vb-to-content').each(function(i, el) {
let tab_id = $(el).attr('id').replace('themeoptions-', '');
const mfn_form_to = new MfnForm( renderMfnFields['themeoptions_fields'][tab_id] );
let form_html_to = mfn_form_to.render();
$(this).html(form_html_to);
});
},
startView: function() {
let $tabler = $('.panel-view-themeoptions .vb-themeoptions');
if( $tabler.find('.vb-to.active') ) $tabler.find('.vb-to.active').removeClass('active');
if( $tabler.hasClass('vb-to-form-view') ) $tabler.removeClass('vb-to-form-view');
if( $tabler.find('.vb-to-li-active').length ) $tabler.find('.vb-to-li-active').removeClass('vb-to-li-active');
if( $tabler.find('.vb-to-content.vb-to-active').length ) $tabler.find('.vb-to-content.vb-to-active').removeClass('vb-to-active');
}
}
if( mfn.current_user_roles.includes('administrator') ) sidebar_themeoptions.init();
/**
* MEGA MENU
* */
$editpanel.on('change', '.mfn-be-megamenu-builder .panel-view-options .preview-megamenu_custom_widthinput', function() {
$content.find('.mfn-megamenu-wrapper').css('width', $(this).val());
});
$editpanel.on('change', '.mfn-be-megamenu-builder .panel-view-options .preview-megamenu_widthinput', function() {
var val = $(this).val();
$content.find('.mfn-megamenu-wrapper').removeClass('mfn-megamenu-full-width');
if( val == 'custom-width' ) {
$content.find('.mfn-megamenu-wrapper').css('width', $('.mfn-be-megamenu-builder .panel-view-options .preview-megamenu_custom_widthinput').val());
}else if( val == 'full-width' ) {
$content.find('.mfn-megamenu-wrapper').removeAttr('style');
$content.find('.mfn-megamenu-wrapper').addClass('mfn-megamenu-full-width')
}else{
$content.find('.mfn-megamenu-wrapper').removeAttr('style');
}
});
/**
* END MEGA MENU
* */
function updateExportInput(){
if( mfn.view == 'demo' ) return;
var formData = prepareForm.get();
$('.panel-export-import .mfn-export-field').val(formData);
}
/*$(document).ajaxComplete(function() {
runAjaxElements();
});*/
function runAjaxElements(){
mfnCurrencySwitcher.init();
if( $builder.find('.mcb-wrap-inner .bars_list:not(.hover)') ) { $builder.find('.mcb-wrap-inner .bars_list:not(.hover)').addClass('hover'); }
// query loop masonry
if( $content && $content.find('.mfn-query-loop-masonry:not(.mfn-initialized)').length ){
// queryLoopMasonry();
iframe.queryLoopMasonry();
}
if( $content && $content.find('.column_banner_box').length ){
mfnBannerBox();
}
// blog slider
if($content && $content.find('.blog_slider .blog_slider_ul:not(.slick-initialized)').length){
mfnSliderBlog();
}
// clients slider
if($content && $content.find('.clients_slider_ul').length){
mfnSliderClients();
}
// gallery
if($content && $content.find('.sections_group .gallery, .mcb-section .gallery').not('.mfn-initialized').length){
//mfnGalleryInit();
iframe.msnryGalleryInit();
}
// countdown
if($content && $content.find('.downcount').length){
mfnCountDown();
}
// chart
if($content && $content.find('.chart_box:not(.mfn-initialized)').length){
mfnChart();
}
// counter
if($content && $content.find('.animate-math .number').length){
mfnAnimateMath();
}
// slider
if($content && $content.find('.content_slider_ul').length){
sliderSlider();
}
// accordion
if($content && $content.find('.mfn-acc').length){
accordionifaqs();
}
if($content && $content.find('.woocommerce-product-attributes').length){
spanToAdditionalInfo();
}
if( $content && $content.find('.promo_bar_slider:not(.mfn-initialized)').length ){
promoBarSlider();
}
// feature list
if($content && $content.find('.feature_list').length){
mfnFeatureList();
}
// hover box
if($content && $content.find('.tooltip, .hover_box').length){
mfnHoverBox();
}
// slider offer full
if($content && $content.find('.offer_ul').length){
mfnSliderOffer();
}
if($content && $content.find('.blog_wrapper .isotope:not( .masonry ), .portfolio_wrapper .isotope:not( .masonry-flat, .masonry-hover, .masonry-minimal').length){
portfolioIsotope();
}
if( $content && $content.find('.mfn-language-switcher-dropdown:not(.mfn-initialized)').length ) {
wpmlLangSwitcher();
}
if($content && $content.find('.isotope.masonry, .isotope.masonry-hover, .isotope.masonry-minimal').length){
blogPortfolioMasonry();
}
// slider testimonials
if($content && $content.find('.testimonials_slider_ul').length){
sliderTestimonials();
}
// slider offer thumb
if($content && $content.find('.offer_thumb_ul:not(.slick-initialized)').length){
mfnSliderOfferThumb();
}
if($content && $content.find('.shop_slider_ul').length){
mfnSliderShop();
}
// product gallery
if( $content && $content.find('.mcb-item-product_images-inner .woocommerce-product-gallery:not(.mfn-initialized)').length ){
productgallery.start( $content.find('.mcb-item-product_images-inner .woocommerce-product-gallery:not(.mfn-initialized)') );
}
// portfolio slider
if($content && $content.find('.portfolio_slider_ul').length){
sliderPortfolio();
}
// before after
if($content && $content.find('.before_after.twentytwenty-container').length){
$content.find('.before_after.twentytwenty-container .twentytwenty-overlay').remove();
$content.find('.before_after.twentytwenty-container .twentytwenty-after-label').remove();
$content.find('.before_after.twentytwenty-container .twentytwenty-handle').remove();
$content.find('.before_after.twentytwenty-container').imagesLoaded(function() {
$content.find('.before_after.twentytwenty-container').twentytwenty();
$content.find('.before_after.twentytwenty-container').not('mfn-initialized').addClass('mfn-initialized');
});
}
// tabs
if($content && $content.find('.jq-tabs:not(.ui-tabs)').length){
$content.find('.jq-tabs:not(.ui-tabs) ul li a').each(function() { $(this).attr("href", location.href.toString().replace('#', '')+$(this).attr("href")); }); // prevents tab reload iframe from jquery 1.9, 1.8 is ok
$content.find('.jq-tabs:not(.ui-tabs)').tabs();
}
}
// reinit js
let mfnCurrencySwitcher = {
selector: false,
init: function() {
if( !$content.find('.column_header_currency_switcher .mfn-currency-switcher-wrapper:not(.initialized)').length ) return;
$content.find('.column_header_currency_switcher .mfn-currency-switcher-wrapper:not(.initialized)').each(function() {
mfnCurrencySwitcher.selector = $(this);
mfnCurrencySwitcher.selector.addClass('initialized');
if( mfnCurrencySwitcher.selector.hasClass('mfn-currency-switcher-flags') ) mfnCurrencySwitcher.attach_flags();
if( mfnCurrencySwitcher.selector.hasClass('mfn-currency-switcher-dropdown mfn-currency-switcher-dropdown-icon') ) mfnCurrencySwitcher.dropdown_icon();
if( mfnCurrencySwitcher.selector.hasClass('mfn-currency-switcher-dropdown') ) mfnCurrencySwitcher.dropdown();
mfnCurrencySwitcher.selector = false;
});
},
attach_flags: function() {
let flag_path = mfnCurrencySwitcher.selector.attr('data-themepath');
mfnCurrencySwitcher.selector.find('li a').each(function() {
let code = $(this).attr('rel');
let flag_uri = `${flag_path}/${code}.svg`;
$(this).prepend('<img class="mfn-wcml-flag" src="'+flag_uri+'" alt="">');
});
},
dropdown_icon: function() {
let icon = mfnCurrencySwitcher.selector.attr('data-path');
mfnCurrencySwitcher.selector.find('li.wcml-cs-active-currency > a').each(function() {
$(this).append('<i class="mfn-arrow-icon '+icon+'"></i>')
});
},
dropdown: function() {
let clone = mfnCurrencySwitcher.selector.find('ul').clone();
let active = mfnCurrencySwitcher.selector.find('ul li.wcml-cs-active-currency').clone();
mfnCurrencySwitcher.selector.find('ul').before('<ul class="mfn-wcml-dropdown-ready"></ul>');
mfnCurrencySwitcher.selector.find('ul.mfn-wcml-dropdown-ready').append(active);
mfnCurrencySwitcher.selector.find('ul:not(.mfn-wcml-dropdown-ready)').remove();
mfnCurrencySwitcher.selector.find('ul.mfn-wcml-dropdown-ready li').append(clone);
}
}
// accordion & faq
function accordionifaqs(){
$content.find('.mfn-acc').each(function() {
var el = $(this);
if (el.hasClass('openAll')) {
// show all
el.find('.question')
.addClass("active")
.children(".answer")
.show();
} else {
// show one
var activeTab = el.attr('data-active-tab');
if (el.hasClass('open1st')) activeTab = 1;
if (activeTab) {
el.find('.question').eq(activeTab - 1)
.addClass("active")
.children(".answer")
.show();
}
}
});
}
// chart
function mfnChart(){
$content.find('.chart_box:not(.mfn-initialized)').each(function() {
var chart_html = $(this).html();
var $box = $(this).closest('.mcb-column');
$(this).html(chart_html);
var $el = $(this).children('.chart');
var line_width = $el.data('line-width');
var line_percent = $el.data('percent');
$el.easyPieChart({
animate: 1000,
lineCap: 'circle',
lineWidth: line_width,
size: 140,
scaleColor: false
});
if($(this).find('canvas').length > 1){ $(this).find('canvas').first().remove(); }
$(this).addClass('mfn-initialized');
});
}
// counter, Quick Fact
function mfnAnimateMath(){
$content.find('.animate-math .number').waypoint({
offset: '100%',
triggerOnce: true,
handler: function() {
var el = $(this.element).length ? $(this.element) : $(this);
var duration = Math.floor((Math.random() * 1000) + 1000);
var to = el.attr('data-to');
$({
property: 0
}).animate({
property: to
}, {
duration: duration,
easing: 'linear',
step: function() {
el.text(Math.floor(this.property));
},
complete: function() {
el.text(this.property);
}
});
if (typeof this.destroy !== 'undefined' && $.isFunction(this.destroy)) {
this.destroy();
}
}
});
}
// hover box
function mfnHoverBox(){
$content.find('.tooltip, .hover_box')
.on('touchstart', function() {
$(this).toggleClass('hover');
})
.on('touchend', function() {
$(this).removeClass('hover');
});
}
// feature list
function mfnFeatureList(){
$content.find('.feature_list').each(function() {
$(this).find('hr').remove();
var col = $(this).attr('data-col') ? $(this).attr('data-col') : 4;
$(this).find('li:nth-child(' + col + 'n):not(:last-child)').after('<hr />');
});
}
// countdown
function mfnCountDown(){
$content.find('.downcount').each(function() {
var el = $(this);
el.downCount({
date: el.attr('data-date'),
offset: el.attr('data-offset')
});
});
}
// Slider | Testimonials
function sliderTestimonials() {
var pager = function(el, i) {
var img = $(el.$slides[i]).find('.single-photo-img').html();
return '<a>' + img + '</a>';
};
$content.find('.testimonials_slider_ul').each(function() {
var slider = $(this);
slider.not('.slick-initialized').slick({
cssEase: 'ease-out',
dots: true,
infinite: true,
touchThreshold: 10,
speed: 300,
prevArrow: '<a class="button the-icon slider_prev" href="#"><span class="button_icon"><i class="icon-left-open-big"></i></span></a>',
nextArrow: '<a class="button the-icon slider_next" href="#"><span class="button_icon"><i class="icon-right-open-big"></i></span></a>',
adaptiveHeight: true,
appendDots: slider.siblings('.slider_pager'),
customPaging: pager,
rtl: rtl ? true : false,
autoplay: mfn.slider.testimonials ? true : false,
autoplaySpeed: mfn.slider.testimonials ? mfn.slider.testimonials : 5000,
slidesToShow: 1,
slidesToScroll: 1
});
});
}
// header promo bar | Slider
function promoBarSlider() {
$content.find('.promo_bar_slider').not('.mfn-initialized').each(function() {
var speed = parseInt($(this).attr('data-speed')) * 1000;
var $slider = $(this);
$slider.find( '.pbs_one' ).first().addClass('pbs-active');
$slider.addClass('mfn-initialized');
function changeSlide() {
var $current = $slider.find( '.pbs_one.pbs-active' );
var $next = $slider.find( '.pbs_one.pbs-active' ).next();
if( !$next.length ) $next = $slider.find( '.pbs_one' ).first();
$current.fadeOut(300, function() {
$next.fadeIn(300);
});
//$slider.css('height', $next.outerHeight());
$current.removeClass('pbs-active');
$next.addClass('pbs-active');
}
if( $slider.find( '.pbs_one' ).length > 1 ){
setInterval(changeSlide, speed);
}
});
}
// Slider | Shop
function mfnSliderShop() {
var pager = function(el, i) {
return '<a>' + i + '</a>';
};
$content.find('.shop_slider_ul').each(function() {
var slider = $(this);
var slidesToShow = 4;
var count = slider.closest('.shop_slider').data('order');
if (slidesToShow > count) {
slidesToShow = count;
if (slidesToShow < 1) {
slidesToShow = 1;
}
}
slider.not('.slick-initialized').slick({
cssEase: 'ease-out',
dots: true,
infinite: true,
touchThreshold: 10,
speed: 300,
prevArrow: '<a class="button the-icon slider_prev" href="#"><span class="button_icon"><i class="icon-left-open-big"></i></span></a>',
nextArrow: '<a class="button the-icon slider_next" href="#"><span class="button_icon"><i class="icon-right-open-big"></i></span></a>',
appendArrows: slider.siblings('.blog_slider_header').children('.slider_navigation'),
appendDots: slider.siblings('.slider_pager'),
customPaging: pager,
rtl: rtl ? true : false,
autoplay: mfn.slider.shop ? true : false,
autoplaySpeed: mfn.slider.shop ? mfn.slider.shop : 5000,
slidesToShow: slickAutoResponsive(slider, slidesToShow),
slidesToScroll: slickAutoResponsive(slider, slidesToShow)
});
// ON | debouncedresize
$(window).on('debouncedresize', function() {
slider.slick('slickSetOption', 'slidesToShow', slickAutoResponsive(slider, slidesToShow), false);
slider.slick('slickSetOption', 'slidesToScroll', slickAutoResponsive(slider, slidesToShow), true);
});
});
}
// Slider | Offer Thumb
function mfnSliderOfferThumb() {
var pager = function(el, i) {
var img = $content.find( el.$slides[i] ).find('.thumbnail').html();
return '<a>' + img + '</a>';
};
$content.find('.offer_thumb_ul:not(.slick-initialized)').each(function() {
var slider = $(this);
slider.slick({
cssEase: 'ease-out',
arrows: false,
dots: true,
infinite: true,
touchThreshold: 10,
speed: 300,
adaptiveHeight: true,
appendDots: slider.siblings('.slider_pagination'),
customPaging: pager,
rtl: rtl ? true : false,
autoplay: mfn.slider.offer ? true : false,
autoplaySpeed: mfn.slider.offer ? mfn.slider.offer : 5000,
slidesToShow: 1,
slidesToScroll: 1
});
});
}
// Slider | Portfolio
function sliderPortfolio() {
$content.find('.portfolio_slider_ul').each(function() {
var slider = $(this);
var size = 380;
var scroll = 5;
if (slider.closest('.portfolio_slider').data('size')) {
size = slider.closest('.portfolio_slider').data('size');
}
if (slider.closest('.portfolio_slider').data('size')) {
scroll = slider.closest('.portfolio_slider').data('scroll');
}
slider.not('.slick-initialized').slick({
cssEase: 'ease-out',
dots: false,
infinite: true,
touchThreshold: 10,
speed: 300,
prevArrow: '<a class="slider_nav slider_prev themebg" href="#"><i class="icon-left-open-big"></i></a>',
nextArrow: '<a class="slider_nav slider_next themebg" href="#"><i class="icon-right-open-big"></i></a>',
rtl: rtl ? true : false,
autoplay: mfn.slider.portfolio ? true : false,
autoplaySpeed: mfn.slider.portfolio ? mfn.slider.portfolio : 5000,
slidesToShow: slickAutoResponsive(slider, 5, size),
slidesToScroll: slickAutoResponsive(slider, scroll, size)
});
// ON | debouncedresize
$(window).on('debouncedresize', function() {
slider.slick('slickSetOption', 'slidesToShow', slickAutoResponsive(slider, 5, size), false);
slider.slick('slickSetOption', 'slidesToScroll', slickAutoResponsive(slider, scroll, size), true);
});
});
}
// Slider | Offer
function mfnSliderOffer() {
$content.find('.offer_ul').each(function() {
var slider = $(this);
slider.not('.slick-initialized').slick({
cssEase: 'ease-out',
dots: false,
infinite: true,
touchThreshold: 10,
speed: 300,
prevArrow: '<a class="slider_prev" href="#"><span class="button_icon"><i class="icon-up-open-big"></i></span></a>',
nextArrow: '<a class="slider_next" href="#"><span class="button_icon"><i class="icon-down-open-big"></i></span></a>',
adaptiveHeight: true,
//customPaging : pager,
rtl: rtl ? true : false,
autoplay: mfn.slider.offer ? true : false,
autoplaySpeed: mfn.slider.offer ? mfn.slider.offer : 5000,
slidesToShow: 1,
slidesToScroll: 1
});
// Pagination | Show (css)
slider.siblings('.slider_pagination').addClass('show');
// Pager | Set slide number after change
slider.on('afterChange', function(event, slick, currentSlide, nextSlide) {
slider.siblings('.slider_pagination').find('.current').text(currentSlide + 1);
});
});
}
// Slider | Slider
function sliderSlider() {
var pager = function(el, i) {
return '<a>' + i + '</a>';
};
$content.find('.content_slider_ul').each(function() {
var slider = $(this);
var count = 1;
var centerMode = false;
if (slider.closest('.content_slider').hasClass('carousel')) {
count = slickAutoResponsive(slider);
$(window).on('debouncedresize', function() {
slider.slick('slickSetOption', 'slidesToShow', slickAutoResponsive(slider), false);
slider.slick('slickSetOption', 'slidesToScroll', slickAutoResponsive(slider), true);
});
}
if (slider.closest('.content_slider').hasClass('center')) {
centerMode = true;
}
slider.not('.slick-initialized').slick({
cssEase: 'cubic-bezier(.4,0,.2,1)',
dots: true,
infinite: true,
touchThreshold: 10,
speed: 300,
centerMode: centerMode,
centerPadding: '20%',
prevArrow: '<a class="button the-icon slider_prev" href="#"><span class="button_icon"><i class="icon-left-open-big"></i></span></a>',
nextArrow: '<a class="button the-icon slider_next" href="#"><span class="button_icon"><i class="icon-right-open-big"></i></span></a>',
adaptiveHeight: true,
appendDots: slider.siblings('.slider_pager'),
customPaging: pager,
rtl: rtl ? true : false,
autoplay: mfn.slider.slider ? true : false,
autoplaySpeed: mfn.slider.slider ? mfn.slider.slider : 5000,
slidesToShow: count,
slidesToScroll: count
});
// Lightbox | disable on dragstart
var clickEvent = false;
slider.on('dragstart', '.slick-slide a[rel="lightbox"]', function(event) {
if (lightboxAttr) {
var events = $._data(this,'events');
if( events && Object.prototype.hasOwnProperty.call(events, 'click') ){
clickEvent = events.click[0];
$(this).addClass('off-click').off('click');
}
}
});
// Lightbox | enable after change
slider.on('afterChange', function(event, slick, currentSlide, nextSlide) {
if (lightboxAttr) {
$content.find('a.off-click[rel="lightbox"]', slider).removeClass('off-click').on('click', clickEvent);
}
});
});
}
// WPML language switcher
function wpmlLangSwitcher() {
if( $content.find('.mfn-language-switcher-dropdown:not(.mfn-initialized)').length ) {
$content.find('.mfn-language-switcher-dropdown:not(.mfn-initialized)').each(function() {
let that = $(this);
that.addClass('mfn-initialized');
let $ul = that.find('ul');
let $current = $ul.find('li.wpml-ls-current-language');
$current.append($ul.clone());
$ul.children('li:not(.wpml-ls-current-language)').remove();
$current.find('ul li.wpml-ls-current-language').remove();
if( that.hasClass('mfn-language-switcher-dropdown-icon') ){
let icon_html = '';
if( that.attr('data-icon') == 'image' ){
icon_html = '<span class="mfn-arrow-icon"><img src="'+that.attr('data-path')+'" alt=""></span>';
}else if( that.attr('data-icon') == 'icon' ){
icon_html = '<span class="mfn-arrow-icon"><i class="'+that.attr('data-path')+'"></i></span>';
}
$current.children('a').append(icon_html);
}
});
}
}
// Portfolio - Isotope
function portfolioIsotope() {
$content.find('.blog_wrapper .isotope:not( .masonry ), .portfolio_wrapper .isotope:not( .masonry-flat, .masonry-hover, .masonry-minimal').each(function() {
var $el = $(this);
if( !$el.hasClass('mfn-initialized') ){
$el.addClass('mfn-initialized');
$el.imagesLoaded( function() {
$el.isotope({
itemSelector: '.isotope-item',
layoutMode: 'fitRows',
isOriginLeft: rtl ? false : true
});
$('.preview-wrapper').css({'margin-left': $('.sidebar-wrapper').width()-1});
setTimeout(function () { $('.preview-wrapper').css({'margin-left': $('.sidebar-wrapper').width() }); },500);
});
}
});
}
// inline eeditor
function inlineEditor() {
//rangy.init();
if( $builder.find('.vb-item.mcb-column .mfn-inline-editor:not(.mfn-initialized)').length ){
var iframe = $('iframe#mfn-vb-ifr').get(0);
var ToolsSwitchMore = MediumEditor.extensions.button.extend({
name: 'switchMore',
action: 'switchMore',
aria: 'More options',
contentDefault: '⁞',
contentFA: '<i class="fas fa-ellipsis-h"></i>',
hasForm: false,
handleClick: function( event ) {
event.preventDefault();
event.stopPropagation();
$("iframe#mfn-vb-ifr").contents().find('body').toggleClass('mfn-inline-editor-toolbar-more');
return false;
},
});
var ToolsMfnRemoveFormat = MediumEditor.extensions.button.extend({
name: 'mfnRemoveFormat',
action: 'mfnRemoveFormat',
aria: 'Remove format',
contentDefault: '⁞',
contentFA: '<i class="fas fa-eraser"></i>',
hasForm: false,
init: function() {
MediumEditor.extensions.form.prototype.init.apply( this, arguments );
},
handleClick: function( event ) {
var nodes = MediumEditor.selection.getSelectedElements( this.document ),
selectionRange = MediumEditor.selection.getSelectionRange( this.document ),
parentEl = MediumEditor.selection.getSelectedParentElement( selectionRange ),
element = MediumEditor.selection.getSelectionElement( this.document );
event.preventDefault();
event.stopPropagation();
if ( ! nodes.length && parentEl ) {
nodes = [ parentEl ];
}
nodes.forEach(function( el ) {
$(el).removeAttr( 'data-font-family' );
$(el).removeAttr( 'data-line-height' );
$(el).removeAttr( 'data-letter-spacing' );
$(el).removeAttr( 'data-font-size' );
$(el).removeAttr( 'data-font-weight' );
$(el).removeAttr( 'style' );
if( $(el).find('.highlight-word').length ){
$(el).replaceWith($(el).find('.highlight-word').text());
}
if(el.tagName.toLowerCase() == 'span'){
if( $(el).closest('.highlight').length ) {
$(el).closest('.highlight').replaceWith( $(el).text() );
}else{
$(el).replaceWith( $(el).text() );
}
}
});
this.execAction( 'removeFormat', { skipCheck: true } );
this.triggerUpdate( element );
return false;
},
triggerUpdate: function( element ) {
this.base.trigger( 'editableInput', {}, element );
},
});
var ToolsColorPicker = MediumEditor.extensions.form.extend({
name: 'colorPicker',
action: 'colorPicker',
aria: 'colorPicker',
contentDefault: '☯',
contentFA: '<i class="fas fa-palette"></i><span></span>',
hasForm: true,
override: false,
parentCid: false,
init: function() {
MediumEditor.extensions.form.prototype.init.apply( this, arguments );
this.classApplier = rangy.createClassApplier( 'mfn-inline-txt-editing', {
elementTagName: 'span',
tagNames: [ 'span', 'b', 'strong', 'a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ],
normalize: true
} );
},
getForm: function() {
if ( ! this.form ) {
this.form = this.createForm();
}
this.on( this.form, 'click', this.handleFormClick.bind( this ) );
return this.form;
},
checkState: function( node ) {
var nodes = MediumEditor.selection.getSelectedElements( this.document ),
color = this.getExistingValue( nodes );
if ( 'undefined' !== typeof color ) {
this.button.querySelector( 'span' ).style.backgroundColor = color;
}
},
createForm: function() {
var self = this,
doc = this.document,
form = doc.createElement( 'div' ),
input = doc.createElement( 'input' ),
close = doc.createElement( 'a' );
this.on( form, 'click', this.handleFormClick.bind( this ) );
form.className = 'medium-editor-toolbar-form mfn-medium-editor-color-picker';
form.id = 'mfn-medium-editor-cp-' + this.getEditorId();
input.className = 'medium-editor-toolbar-input mfn-medium-editor-color-picker-input';
input.setAttribute( 'type', 'text' );
input.setAttribute( 'data-alpha', true );
form.appendChild( input );
close.className = 'medium-editor-toolbar-close';
close.innerHTML = '<i class="fas fa-check"></i>';
form.appendChild( close );
this.on( close, 'click', this.handleSaveClick.bind( this ), true );
return form;
},
isDisplayed: function() {
return this.getForm().classList.contains( 'mfn-visible' );
},
handleClick: function( event ) {
var nodes,
txt;
event.preventDefault();
event.stopPropagation();
if ( ! this.isDisplayed() ) {
nodes = MediumEditor.selection.getSelectedElements( this.document );
txt = this.getExistingValue( nodes );
txt = 'undefined' !== typeof txt ? txt : '';
this.showForm( txt );
}
return false;
},
getInput: function() {
return this.getForm().querySelector( 'input.medium-editor-toolbar-input' );
},
showForm: function( fontColor ) {
var self = this,
input = this.getInput(),
form = this.getForm();
this.base.saveSelection();
form.classList.add( 'mfn-visible' );
$content.find('#medium-editor-toolbar-'+this.getEditorId()+' .medium-editor-toolbar-actions').hide();
//medium-editor-toolbar-2
input.value = fontColor || '';
$( input ).wpColorPicker( {
palettes: true,
mode : 'hex',
hide: true,
change: function( event, ui ) {
if ( 'none' !== $( input ).closest( '.mfn-medium-editor-color-picker' ).find( '.iris-picker' ).css( 'display' ) ) {
self.handleColorChange( ui.color.toString() );
}
},
clear: function( event, ui ) {
self.clearFontColor();
}
} );
$( input ).iris( 'color', input.value );
$( input ).iris( 'option', 'palettes', color_palette.slice(0, 7) );
$( input ).iris( 'show' );
this.setToolbarPosition();
},
getExistingValue: function( nodes ) {
var nodeIndex,
color,
el;
if ( ! nodes.length ) {
nodes = this.base.elements;
}
for ( nodeIndex = 0; nodeIndex < nodes.length; nodeIndex++ ) {
el = nodes[ nodeIndex ];
color = $( el ).css( 'color' );
}
return color;
},
handleFormClick: function( event ) {
event.stopPropagation();
},
handleSaveClick: function( event ) {
event.preventDefault();
this.hideForm();
},
hideForm: function() {
var self = this,
form = this.getForm();
$(form).removeClass( 'mfn-visible' );
$content.find('#medium-editor-toolbar-'+this.getEditorId()+' .medium-editor-toolbar-actions').show();
this.getInput().value = '';
this.base.restoreSelection();
self.setToolbarPosition();
},
clearFontColor: function() {
this.base.restoreSelection();
MediumEditor.selection.getSelectedElements( this.document ).forEach( function( el ) {
if ( 'undefined' !== typeof el.style && 'undefined' !== typeof el.style.color ) {
el.style.color = '';
}
} );
this.base.trigger( 'editableInput', {}, MediumEditor.selection.getSelectionElement( this.document ) );
},
handleColorChange: function( color ) {
var iframeWin = rangy.dom.getIframeWindow( iframe ),
element,
self = this,
color = 'undefined' === color || 'undefined' === typeof color ? this.getInput().value : color;
this.base.restoreSelection();
element = MediumEditor.selection.getSelectionElement( this.document );
if ( ! element ) {
return;
}
this.classApplier.applyToSelection( iframeWin );
element.querySelectorAll( '.mfn-inline-txt-editing' ).forEach( function( el ) {
if ( el.classList.contains( 'mfn-inline-txt-editing' ) ) {
$( el ).css( { color: color } );
self.button.classList = 'medium-editor-button-active';
el.classList.remove( 'mfn-inline-txt-editing' );
if ( 0 === el.classList.length ) {
el.removeAttribute( 'class' );
}
}
} );
this.triggerUpdate( element );
},
triggerUpdate: function( element ) {
this.base.trigger( 'editableInput', {}, element );
},
});
var ToolsTypography = MediumEditor.extensions.form.extend({
name: 'typography',
action: 'typography',
aria: 'typography',
contentDefault: '☯',
contentFA: '<i class="fas fa-font"></i>',
hasForm: true,
override: false,
parentCid: false,
init: function() {
MediumEditor.extensions.form.prototype.init.apply( this, arguments );
this.classApplier = rangy.createClassApplier( 'mfn-inline-txt-editing', {
elementTagName: 'span',
tagNames: [ 'span', 'b', 'strong', 'a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ],
normalize: true
} );
},
getForm: function() {
if ( ! this.form ) {
this.form = this.createForm();
}
this.on( this.form, 'click', this.handleFormClick.bind( this ) );
return this.form;
},
checkState: function( node ) {
var nodes = MediumEditor.selection.getSelectedElements( this.document ),
typo = this.getExistingValue( nodes, true );
if ( typo ) {
this.button.classList = 'medium-editor-button-active';
}
},
createForm: function() {
var self = this,
doc = this.document,
close = doc.createElement( 'a' ),
form = doc.createElement( 'div' );
this.on( form, 'click', this.handleFormClick.bind( this ) );
form.className = 'medium-editor-toolbar-form mfn-medium-editor-typography';
form.id = 'mfn-medium-editor-typo-' + this.getEditorId();
$('<div class="mfn-medium-editor-form-row"><label>Font size</label><input data-style="font-size" class="medium-editor-toolbar-input mfn-medium-editor-font-size-input" /></div>').appendTo(form);
$('<div class="mfn-medium-editor-form-row"><label>Line height</label><input data-style="line-height" class="medium-editor-toolbar-input mfn-medium-editor-line-height-input" /></div>').appendTo(form);
$('<div class="mfn-medium-editor-form-row"><label>Letter spacing</label><input data-style="letter-spacing" class="medium-editor-toolbar-input mfn-medium-editor-letter-spacing-input" /></div>').appendTo(form);
$('<div class="mfn-medium-editor-form-row"><label>Font family</label><select data-style="font-family" class="medium-editor-toolbar-input mfn-medium-editor-font-family-input"><optgroup label="System"><option value="" selected>Default</option><option value="Arial">Arial</option><option value="Georgia">Georgia</option><option value="Tahoma">Tahoma</option><option value="Times">Times</option><option value="Trebuchet">Trebuchet</option><option value="Verdana">Verdana</option></optgroup></select></div>').appendTo(form);
$('<div class="mfn-medium-editor-form-row"><label>Font weight</label><select data-style="font-weight" class="medium-editor-toolbar-input mfn-medium-editor-font-weight-input"><option value="" selected>Default</option><option value="normal">Normal</option><option value="bold">Bold</option><option value="100">100</option><option value="200">200</option><option value="300">300</option><option value="400">400</option><option value="500">500</option><option value="600">600</option><option value="700">700</option><option value="800">800</option><option value="900">900</option></select></div>').appendTo(form);
close.className = 'medium-editor-toolbar-close';
close.innerHTML = '<i class="fas fa-check"></i>';
form.appendChild( close );
this.on( close, 'click', this.handleSaveClick.bind( this ), true );
return form;
},
isDisplayed: function() {
return this.getForm().classList.contains( 'mfn-visible' );
},
handleClick: function( event ) {
var nodes,
txt;
event.preventDefault();
event.stopPropagation();
if ( ! this.isDisplayed() ) {
nodes = MediumEditor.selection.getSelectedElements( this.document );
txt = this.getExistingValue( nodes );
txt = 'undefined' !== typeof txt ? txt : '';
this.showForm( txt );
}else{
this.hideForm();
}
return false;
},
getInput: function() {
var inputs = {
fontsize: this.getForm().querySelector( 'input.mfn-medium-editor-font-size-input' ),
lineheight: this.getForm().querySelector( 'input.mfn-medium-editor-line-height-input' ),
letterspacing: this.getForm().querySelector( 'input.mfn-medium-editor-letter-spacing-input' ),
fontfamily: this.getForm().querySelector( 'select.mfn-medium-editor-font-family-input' ),
fontweight: this.getForm().querySelector( 'select.mfn-medium-editor-font-weight-input' ),
};
return inputs;
},
showForm: function( typo ) {
var self = this,
input = this.getInput(),
form = this.getForm();
this.base.saveSelection();
form.classList.add( 'mfn-visible' );
$content.find('#medium-editor-toolbar-'+this.getEditorId()+' .medium-editor-toolbar-actions').hide();
form.classList.remove( 'hidden' );
// google fonts
if( !$(input.fontfamily).find('optgroup[label="Google"]').length ){
var g_fonts = '';
mfn.mfn_google_fonts.map((value) => {
g_fonts += '<option value="'+value+'">'+value+'</option>';
});
$(input.fontfamily).append( $('<optgroup label="Google">'+g_fonts+'</optgroup>') );
}
$( input.fontsize ).val( typo.fontsize || '' ).on('change', function() {
self.handleTypoChange( $(this).attr('data-style'), $(this).val() );
});
$( input.lineheight ).val( typo.lineheight || '' ).on('change', function() {
self.handleTypoChange( $(this).attr('data-style'), $(this).val() );
});
$( input.letterspacing ).val( typo.letterspacing || '' ).on('change', function() {
self.handleTypoChange( $(this).attr('data-style'), $(this).val() );
});
$( input.fontfamily ).val( typo.fontfamily.replaceAll('"', '') || '' )
.on('change', function() {
var style_attr = $(this).attr('data-style');
var val = $(this).val().replace('"', '');
var fonts_group = $(this).find(':selected').closest('optgroup').attr('label');
if( fonts_group == 'Google' ){
WebFont.load({
google: {
families: [val]
},
context: window.frames[0].frameElement.contentWindow,
fontactive: function(familyName,fvd){
self.handleTypoChange( style_attr, familyName );
return;
},
});
}else{
self.handleTypoChange( style_attr, val, true );
}
});
$( input.fontweight ).val( typo.fontweight || '' ).on('change', function() {
self.handleTypoChange( $(this).attr('data-style'), $(this).val() );
});
this.setToolbarPosition();
},
getExistingValue: function( nodes, active = false ) {
var nodeIndex,
typo,
el;
if ( ! nodes.length ) {
nodes = this.base.elements;
}
for ( nodeIndex = 0; nodeIndex < nodes.length; nodeIndex++ ) {
el = nodes[ nodeIndex ];
if( active ){
typo = false;
if (typeof $( el ).attr('data-font-size') !== 'undefined' && $( el ).attr('data-font-size') !== false) typo = true;
if (typeof $( el ).attr('data-line-height') !== 'undefined' && $( el ).attr('data-line-height') !== false) typo = true;
if (typeof $( el ).attr('data-letter-spacing') !== 'undefined' && $( el ).attr('data-letter-spacing') !== false) typo = true;
if (typeof $( el ).attr('data-font-family') !== 'undefined' && $( el ).attr('data-font-family') !== false) typo = true;
if (typeof $( el ).attr('data-font-weight') !== 'undefined' && $( el ).attr('data-font-weight') !== false) typo = true;
return typo;
}
typo = {
fontsize: $( el ).css( 'font-size' ),
lineheight: $( el ).css( 'line-height' ),
letterspacing: $( el ).css( 'letter-spacing' ),
fontfamily: $( el ).css( 'font-family' ),
fontweight: $( el ).css( 'font-weight' ),
};
}
return typo;
},
handleFormClick: function( event ) {
event.stopPropagation();
},
handleSaveClick: function( event ) {
event.preventDefault();
this.hideForm();
},
hideForm: function() {
var self = this,
form = this.getForm();
$(form).removeClass( 'mfn-visible' );
$content.find('#medium-editor-toolbar-'+this.getEditorId()+' .medium-editor-toolbar-actions').show();
this.base.restoreSelection();
self.setToolbarPosition();
},
handleTypoChange: function( key, value, data = false ) {
var iframeWin = rangy.dom.getIframeWindow( iframe ),
element,
self = this;
this.base.restoreSelection();
element = MediumEditor.selection.getSelectionElement( this.document );
if ( ! element ) {
return;
}
this.classApplier.applyToSelection( iframeWin );
element.querySelectorAll( '.mfn-inline-txt-editing' ).forEach( function( el ) {
if ( el.classList.contains( 'mfn-inline-txt-editing' ) ) {
if( value.length ){
$( el ).css( key, value )
if( !data ) {
$( el ).attr('data-'+key, $( el ).css( key ));
}else{
$( el ).removeAttr('data-'+key);
}
self.button.classList = 'medium-editor-button-active';
}else{
$( el ).removeAttr('data-'+key);
}
el.classList.remove( 'mfn-inline-txt-editing' );
if ( 0 === el.classList.length ) {
el.removeAttribute( 'class' );
}
}
} );
this.triggerUpdate( element );
},
triggerUpdate: function( element ) {
this.base.trigger( 'editableInput', {}, element );
},
});
var ToolsHighlighter = MediumEditor.extensions.form.extend({
name: 'mfnHghter',
action: 'mfnHghter',
aria: 'mfnHghter',
contentDefault: '☯',
contentFA: '<i class="fas fa-highlighter"></i><span></span>',
hasForm: true,
override: false,
parentCid: false,
init: function() {
MediumEditor.extensions.form.prototype.init.apply( this, arguments );
this.classApplier = rangy.createClassApplier( 'mfn-inline-txt-editing', {
elementTagName: 'span',
tagNames: [ 'span', 'b', 'strong', 'a', 'p', 'h1', 'h2', 'h3', 'h4', 'h5', 'h6' ],
normalize: true
} );
},
getForm: function() {
if ( ! this.form ) {
this.form = this.createForm();
}
this.on( this.form, 'click', this.handleFormClick.bind( this ) );
return this.form;
},
checkState: function( node ) {
var nodes = MediumEditor.selection.getSelectedElements( this.document ),
mfnhighlighter = this.getExistingValue( nodes, true );
if ( mfnhighlighter.check ) {
this.button.classList = 'medium-editor-button-active';
}
},
createForm: function() {
var self = this,
doc = this.document,
close = doc.createElement( 'a' ),
form = doc.createElement( 'div' );
this.on( form, 'click', this.handleFormClick.bind( this ) );
form.className = 'medium-editor-toolbar-form mfn-medium-editor-mfnhighlighter';
form.id = 'mfn-medium-editor-mfnhighlighter-' + this.getEditorId();
$('<div class="mfn-medium-editor-form-row"><label>Color</label><input type="text" data-alpha="true" class="medium-editor-toolbar-input mfn-medium-editor-mfnhighlighter-color-input" /></div>').appendTo(form);
$('<div class="mfn-medium-editor-form-row"><label>Background</label><input type="text" data-alpha="true" class="medium-editor-toolbar-input mfn-medium-editor-mfnhighlighter-background-input" /></div>').appendTo(form);
$('<div class="mfn-medium-editor-form-row"><label>Style</label><select class="medium-editor-toolbar-input mfn-medium-editor-mfnhighlighter-style-input"><option value="" selected>Default</option><option value="underline">Underline</option></select></div>').appendTo(form);
close.className = 'medium-editor-toolbar-close';
close.innerHTML = '<i class="fas fa-check"></i>';
form.appendChild( close );
this.on( close, 'click', this.handleSaveClick.bind( this ), true );
return form;
},
isDisplayed: function() {
return this.getForm().classList.contains( 'mfn-visible' );
},
handleClick: function( event ) {
var nodes,
txt;
event.preventDefault();
event.stopPropagation();
if ( ! this.isDisplayed() ) {
nodes = MediumEditor.selection.getSelectedElements( this.document );
txt = this.getExistingValue( nodes );
txt = 'undefined' !== typeof txt ? txt : '';
this.showForm( txt );
}else{
this.hideForm();
}
return false;
},
getInput: function() {
var inputs = {
color: this.getForm().querySelector( 'input.mfn-medium-editor-mfnhighlighter-color-input' ),
background: this.getForm().querySelector( 'input.mfn-medium-editor-mfnhighlighter-background-input' ),
style: this.getForm().querySelector( 'select.mfn-medium-editor-mfnhighlighter-style-input' ),
};
return inputs;
},
showForm: function( mfnhighlighter ) {
var self = this,
input = this.getInput(),
form = this.getForm();
this.base.saveSelection();
$content.find('#medium-editor-toolbar-'+this.getEditorId()+' .medium-editor-toolbar-actions').hide();
form.classList.add( 'mfn-visible' );
var color_val = mfnhighlighter.check ? mfnhighlighter.color : '';
var bg_val = mfnhighlighter.check ? mfnhighlighter.background : '';
var style_val = mfnhighlighter.check ? mfnhighlighter.style : '';
$( input.color ).wpColorPicker( {
palettes: false,
mode : 'hsl',
change: function( event, ui ) {
self.handleHighlighterChange( ui.color.toString(), input.background.value, input.style.value );
},
} );
$( input.background ).wpColorPicker( {
palettes: false,
mode : 'hsl',
change: function( event, ui ) {
self.handleHighlighterChange( input.color.value, ui.color.toString(), input.style.value );
},
} );
this.setToolbarPosition();
$( input.color ).iris( 'color', color_val );
$( input.background ).iris( 'color', bg_val );
$( input.color ).iris( 'hide' );
$( input.background ).iris( 'hide' );
$( input.color ).on('click', function() {
$( input.background ).iris( 'hide' );
$( input.color ).iris( 'show' );
return false;
});
$( input.background ).on('click', function() {
$( input.color ).iris( 'hide' );
$( input.background ).iris( 'show' );
return false;
});
$( input.style ).val(style_val).on('change', function() {
self.handleHighlighterChange( input.color.value, input.background.value, $(this).val() );
});
},
getExistingValue: function( nodes, active = false ) {
var nodeIndex,
mfnhighlighter,
el, check;
if ( ! nodes.length ) {
nodes = this.base.elements;
}
check = false;
for ( nodeIndex = 0; nodeIndex < nodes.length; nodeIndex++ ) {
el = nodes[ nodeIndex ];
mfnhighlighter = {
check: $( el ).hasClass('highlight') || $( el ).parent().hasClass('highlight') || $( el ).children().hasClass('highlight') ? true : false,
color: $( el ).css( 'color' ),
background: $( el ).css( 'background-color' ),
style: $( el ).hasClass('highlight-underline') ? 'highlight-underline' : ''
};
}
return mfnhighlighter;
},
handleFormClick: function( event ) {
event.stopPropagation();
},
handleSaveClick: function( event ) {
event.preventDefault();
this.hideForm();
},
hideForm: function() {
var self = this,
form = this.getForm();
$content.find('#medium-editor-toolbar-'+this.getEditorId()+' .medium-editor-toolbar-actions').show();
form.classList.remove( 'mfn-visible' );
//this.base.restoreSelection();
this.setToolbarPosition();
},
handleHighlighterChange: function( color, bg, style ) {
var iframeWin = rangy.dom.getIframeWindow( iframe ),
self = this,
element;
this.base.restoreSelection();
element = MediumEditor.selection.getSelectionElement( this.document );
if ( ! element ) {
return;
}
this.classApplier.applyToSelection( iframeWin );
var txt_content = false;
element.querySelectorAll( '.mfn-inline-txt-editing' ).forEach( function( el ) {
if ( el.classList.contains( 'mfn-inline-txt-editing' ) ) {
if( !txt_content ){
// get clear txt
if( $(el).find('.highlight-word').length ){
txt_content = $(el).find('.highlight-word').text();
}else{
txt_content = $(el).text();
}
var $wrapper;
if( $(el).closest('.highlight').length ){
$wrapper = $(el).closest('.highlight');
}else{
$wrapper = $(el);
}
$wrapper.empty();
$wrapper.text(txt_content).removeClass('highlight highlight-underline');
if( style != '' ){
$wrapper.addClass('highlight highlight-underline').css('color', color).css('background-color', bg).html('<span class="highlight-word">'+txt_content+'<span class="highlight-border" style="background-color:'+bg+'; color:'+color+';"></span></span>');
}else{
$wrapper.addClass('highlight').css('color', color).css('background-color', bg).text(txt_content);
}
self.button.classList = 'medium-editor-button-active';
}
el.classList.remove( 'mfn-inline-txt-editing' );
if ( 0 === el.classList.length ) {
el.removeAttribute( 'class' );
}
}
} );
this.triggerUpdate( element );
},
triggerUpdate: function( element ) {
this.base.trigger( 'editableInput', {}, element );
},
});
$builder.find('.vb-item.mcb-column .mfn-inline-editor:not(.mfn-initialized)').each(function(i) {
$iframeCont = $(this);
$iframeCont.addClass('mfn-initialized').attr('data-mfnindex', inlineIndex);
inlineEditors[inlineIndex] = new MediumEditor( $(this).get(0), {
buttonLabels: 'fontawesome',
contentWindow: iframe.contentWindow,
ownerDocument: iframe.contentWindow.document,
elementsContainer: iframe.contentWindow.document.body,
anchorPreview: false,
previewValueSelector: 'a',
anchor: {
customClassOption: null,
customClassOptionText: 'Button',
linkValidation: false,
placeholderText: 'Paste or type a link',
targetCheckbox: true,
targetCheckboxText: 'Open in new window'
},
extensions: {
switchMore: new ToolsSwitchMore(),
colorPicker: new ToolsColorPicker(),
//mfnHghter: new ToolsHighlighter(),
typography: new ToolsTypography(),
mfnRemoveFormat: new ToolsMfnRemoveFormat(),
},
toolbar: {
buttons: ['typography', 'bold', 'italic', 'underline', 'strikethrough', 'colorPicker', 'anchor', 'quote', 'subscript', 'superscript', 'justifyLeft', 'justifyCenter', 'justifyRight', 'justifyFull', 'orderedlist', 'unorderedlist', 'indent', 'outdent', 'mfnRemoveFormat', 'switchMore'],
},
paste: {
forcePlainText: false,
cleanPastedHTML: false
}
});
inlineIndex++;
})
}
}
// Blog & Portfolio - Masonry
function blogPortfolioMasonry() {
$content.find('.isotope.masonry, .isotope.masonry-hover, .isotope.masonry-minimal').each(function() {
var $el = $(this);
if( !$el.hasClass('mfn-initialized') ){
$el.addClass('mfn-initialized');
$el.imagesLoaded( function() {
$el.isotope({
itemSelector: '.isotope-item',
layoutMode: 'masonry',
isOriginLeft: rtl ? false : true
});
$('.preview-wrapper').css({'margin-left': $('.sidebar-wrapper').width()-1});
setTimeout(function () { $('.preview-wrapper').css({'margin-left': $('.sidebar-wrapper').width() }); },500);
});
}
});
}
// Append spans to additional info table
function spanToAdditionalInfo(){
$content.find('.woocommerce-product-attributes td, .woocommerce-product-attributes th').each(function() {
$(this).html('<span>'+$(this).html()+'</span>');
});
}
var scrollTicker, lightboxAttr, sidebar,
rtl = $('body').hasClass('rtl'),
simple = $('body').hasClass('style-simple'),
topBarTop = '61px',
headerH = 0,
mobileInitW = (mfn.mobileInit) ? mfn.mobileInit : 1240;
// Slick Slider | Auto responsive
function slickAutoResponsive(slider, max, size, round = false) {
if (!max){
max = 5;
}
if (!size){
size = 380;
}
var width = slider.width() || 0;
var count;
if ( round ) {
count = Math.floor(width / size);
} else {
count = Math.ceil(width / size);
}
if (count < 1) count = 1;
if (count > max) count = max;
return count;
}
// banner box
function mfnBannerBox() {
if( $content.find(".mfn-banner-box .last-visible-el").length ) {
$content.find(".mfn-banner-box .last-visible-el").removeClass('last-visible-el');
$content.find('.hidden-wrapper .hidden-desc').removeAttr('style');
}
$content.find( ".mfn-banner-box").each(function() {
if( $(this).find('.hidden-desc .cta-text').length && $(this).find('.hidden-desc .cta-text').text() == '' ) {
$(this).find('.hidden-desc').hide();
$(this).find('.hidden-desc').prev().addClass("last-visible-el");
}else if( $(this).find('.hidden-desc').length ) {
$(this).find('.hidden-desc').show();
if( $(this).find('.hidden-desc').prevAll(":visible").first().length ) $(this).find('.hidden-desc').prevAll(":visible").first().addClass("last-visible-el");
var hd_h = $(this).find('.hidden-wrapper').outerHeight();
$(this).find('.hidden-desc').css( { '--mfn-banner-box-height': hd_h + 'px' } );
}
});
}
// Slider | Blog
function mfnSliderBlog() {
var pager = function(el, i) {
return '<a>' + i + '</a>';
};
$content.find('.blog_slider .blog_slider_ul:not(.slick-initialized)').each(function() {
var slider = $(this);
var slidesToShow = 4;
var count = slider.closest('.blog_slider').attr('count');
var singlePostMode = slider.closest('.blog_slider').hasClass('single_post_mode');
if (slidesToShow > count) {
slidesToShow = count;
if (slidesToShow < 1) {
slidesToShow = 1;
}
}
if (singlePostMode) {
slidesToShow = 1;
}
slider.slick({
cssEase: 'ease-out',
dots: true,
infinite: true,
touchThreshold: 10,
speed: 300,
prevArrow: '<a class="button the-icon slider_prev" href="#"><span class="button_icon"><i class="icon-left-open-big"></i></span></a>',
nextArrow: '<a class="button the-icon slider_next" href="#"><span class="button_icon"><i class="icon-right-open-big"></i></span></a>',
appendArrows: slider.siblings('.blog_slider_header').children('.slider_navigation'),
appendDots: slider.siblings('.slider_pager'),
customPaging: pager,
rtl: rtl ? true : false,
autoplay: mfn.slider.blog ? true : false,
autoplaySpeed: mfn.slider.blog ? mfn.slider.blog : 5000,
slidesToShow: slickAutoResponsive(slider, slidesToShow),
slidesToScroll: slickAutoResponsive(slider, slidesToShow)
});
});
}
// Slider | Clients
function mfnSliderClients() {
$content.find('.clients_slider_ul').each(function() {
var slider = $(this);
var clientsPerSlide = slider.closest('.clients_slider').attr('data-client-per-slide') ? parseInt(slider.closest('.clients_slider').attr('data-client-per-slide')) : 4;
var navigationPosition = slider.closest('.clients_slider').attr('data-navigation-position') || false;
var appendArrows = ( navigationPosition == 'content' ) ? slider : slider.siblings('.blog_slider_header').children('.slider_navigation');
var size = 400;
var calc = () => slickAutoResponsive(slider, clientsPerSlide, size - (clientsPerSlide * 40), true);
slider.not('.slick-initialized').slick({
cssEase: 'ease-out',
dots: false,
infinite: true,
touchThreshold: 10,
speed: 300,
prevArrow: '<a class="button the-icon slider_prev" href="#"><span class="button_icon"><i class="icon-left-open-big"></i></span></a>',
nextArrow: '<a class="button the-icon slider_next" href="#"><span class="button_icon"><i class="icon-right-open-big"></i></span></a>',
appendArrows: appendArrows,
rtl: rtl ? true : false,
autoplay: mfn.slider.clients ? true : false,
autoplaySpeed: mfn.slider.clients ? mfn.slider.clients : 5000,
slidesToShow: calc(),
slidesToScroll: calc()
});
// ON | debouncedresize
$(window).on('debouncedresize', function() {
slider.slick('slickSetOption', 'slidesToShow', calc(), false);
slider.slick('slickSetOption', 'slidesToScroll', calc(), true);
});
});
}
var templatesPostType = {
count: $('.mfn-df-row:not(.clone)').length ? $('.mfn-df-row:not(.clone)').length : 0,
beforeUpdate: function() {
$('.woo-display-conditions').on('click', function(e) {
e.preventDefault();
// resetSaveButton();
$('.modal-display-conditions').addClass('show');
});
$('.df-add-row').on('click', function(e) {
e.preventDefault();
var $cloned = $('.mfn-df-row.clone').clone();
$cloned.find('.df-input').each(function() {
$(this).attr('name', $(this).attr('data-name').replace("mfn_template_conditions[0]", "mfn_template_conditions["+templatesPostType.count+"]"));
$(this).removeAttr('data-name');
})
$cloned.removeClass('clone').appendTo( $('.mfn-dynamic-form') );
templatesPostType.count++;
});
$('.modal-display-conditions').on('click', '.df-remove', function(e) {
e.preventDefault();
$(this).closest('.mfn-df-row').remove();
});
$('.modal-display-conditions').on('change', '.df-input-rule', function() {
if( $(this).val() == 'exclude' ){
$(this).addClass('minus');
}else{
$(this).removeClass('minus');
}
});
$('.modal-display-conditions').on('change', '.df-input-var', function() {
$(this).siblings('.df-input-opt').removeClass('show');
if( $(this).val() != 'shop' && $(this).siblings('.df-input-'+$(this).val()).length ){
$(this).siblings('.df-input-'+$(this).val()).addClass('show');
}
});
templatesPostType.closeModal();
},
closeModal: function() {
// close
$('.modal-display-conditions .btn-modal-close').on('click', function(e) {
e.preventDefault();
$('.modal-display-conditions').removeClass('show');
});
}
};
if($('.modal-display-conditions').length){
templatesPostType.beforeUpdate();
}
/**
*
* NEW ACM start
*
* */
$editpanel.on('click', '.panel-edit-item .row-header.toggled_header', function(e) {
e.preventDefault();
var header = $(this);
let component = header.closest('.mfn-component-wrapper');
if( $('style.mfn-fields-switcher-'+component.attr('data-id')).length ) {
$('style.mfn-builder-fields-css:not(.mfn-fields-switcher-normal-hover)').remove();
}else{
$('style.mfn-builder-fields-css:not(.mfn-fields-switcher-normal-hover)').remove();
$('body').append('<style class="mfn-builder-fields-css mfn-fields-switcher mfn-fields-switcher-'+component.attr('data-id')+'">.mfn-ui .mfn-form .mfn-component-wrapper-'+component.attr('data-id')+' .mfn-form-row.conditionally-show{ display: block; } .mfn-element-fields-wrapper .mfn-component-wrapper-'+component.attr('data-id')+' .mfn-toggled{display: block;} .mfn-element-fields-wrapper .mfn-component-wrapper-'+component.attr('data-id')+' .toggled_header h5:before{ transform: rotate(180deg); color: var(--mfn-ui-heading-arrow-active); }</style>');
}
});
var mfn_label_fields = {
id: false,
class: '',
init: function() {
$(document).on('click', '.mfn-form-row.toggle_fields > label > .mfn-vb-label-button', function(e) {
e.preventDefault();
var box = $(this).closest('.mfn-form-row');
mfn_label_fields.id = box.attr('class');
mfn_label_fields.class = mfn_label_fields.id.replaceAll(' ', '.')
initFontSelect(box);
$('body').append('<style class="mfn-builder-fields-css mfn-builder-label-fields mfn-builder-fields-css-'+ mfn_label_fields.id.replaceAll(' ', '')+'">.mfn-ui .mfn-form .'+mfn_label_fields.class+' > label .mfn-vb-label-button {background-color: #72a5d8;} .mfn-ui .mfn-form .'+mfn_label_fields.class+' > label .mfn-vb-label-button .mfn-icon-edit { background-image: url('+mfn.themepath+'/visual-builder/assets/svg/options/edit-light.svg); }.mfn-ui .mfn-form .'+mfn_label_fields.class+' .mfn-toggle-fields-wrapper{display: block;}</style>');
$('.sidebar-wrapper').addClass('mfn-vb-sidebar-overlay');
$(document).bind('mousedown', mfn_label_fields.hide);
});
},
hide: function(e) {
var div = $('.mfn-element-fields-wrapper .'+ mfn_label_fields.class+' .mfn-toggle-fields-wrapper, .mfn-element-fields-wrapper .'+ mfn_label_fields.class+' .mfn-vb-label-button');
if ( !div.is(e.target) && div.has(e.target).length === 0 ) {
$('style.mfn-builder-label-fields').remove();
$('.sidebar-wrapper').removeClass('mfn-vb-sidebar-overlay');
$(document).unbind('mousedown', mfn_label_fields.hide);
}
}
}
mfn_label_fields.init();
function initFontSelect(box) {
let options = '';
if( box.find('.form-group.font-family-select select').length ) {
box.find('.form-group.font-family-select select').each(function() {
var $select = $(this);
if( typeof mfn.mfn_google_fonts !== 'undefined' ) {
mfn.mfn_google_fonts.forEach((entry) => {
options += '<option value="'+ entry +'">'+ entry +'</option>';
});
if( $select.find('optgroup[data-type="google-fonts"] option').length == 1 ) {
$select.find('optgroup[data-type="google-fonts"]').html(options);
}
}
let value = $select.attr('data-value');
if( typeof value !== 'undefined' ) {
if( $select.find('option[value="'+value+'"]').length ) {
$select.val(value);
}else if($select.find('option[value="#'+value+'"]').length) {
$select.val('#'+value);
}
}
});
}
}
function initSocialSorting($box) {
if( $box.find('.social-link .social-wrapper:not(.mfn-initialized)').length ) {
let $wrapper = $box.find('.social-link .social-wrapper:not(.mfn-initialized)');
let $input = $box.find('input.social-order');
$wrapper.sortable({
axis: "y",
handle: ".drag",
stop: function(event, elem) {
var arr = [];
$wrapper.find('li').each(function() {
arr.push( $(this).attr('data-key') );
});
$input.val(arr.join(',')).trigger('change');
}
});
$wrapper.addClass('mfn-initialized');
}
}
// Reset CSS Filters to default
$editpanel.on('click', '.mfn-form-row.toggle_fields > label > a.reset-big-field', function(e) {
e.preventDefault();
var $editrow = $(this).closest('.mfn-form-row');
let id = $editrow.attr('data-id');
if( !_.has(edited_item, 'attr') || !_.has(edited_item['attr'], id) ) return;
delete(edited_item.attr[id]);
setTimeout(function() {
sidebar_form.render();
loopAllStyleFields(edited_item.uid);
},1);
});
$editpanel.on('click', '.mfn-form-row.mfn-sidebar-fields-tabs > ul.mfn-sft-nav li a', function(e) {
e.preventDefault();
var tab = $(this).attr('data-tab');
var li = $(this).closest('li');
var index = li.index()+1;
$('style.mfn-fields-switcher-normal-hover').remove();
$('body').append('<style class="mfn-builder-fields-css mfn-fields-switcher-normal-hover">.mfn-ui .mfn-form .mfn-sft-nav li:nth-child('+index+') a{background: var(--mfn-ui-sft-nav-tab-bg-active); color: var(--mfn-ui-sft-nav-tab-color-active);} .mfn-ui .mfn-form .mfn-sft.mfn-sft-'+tab+'{display: block;}</style>');
/*$box.find('ul.mfn-sft-nav li').removeClass('active');
$box.find('.mfn-sft').removeClass('mfn-tabs-fields-active');
$box.find('.mfn-sft .mfn-form-row').addClass('mfn-toggled');
$box.find('.mfn-sft-'+tab).addClass('mfn-tabs-fields-active');
$box.find('.mfn-sft-'+tab+' .mfn-form-row').removeClass('mfn-toggled');
if( !$box.find('.mfn-sft-'+tab+' .mfn-form-row.mfn-fields-switcher .segmented-options li.active').length ){
$box.find('.mfn-sft-'+tab+' .mfn-form-row.mfn-fields-switcher .segmented-options li:first-child a').trigger('click');
}
$(this).parent().addClass('active');*/
});
$editpanel.on('click', '.panel-edit-item ul.sidebar-panel-content-tabs > li', function(e) {
e.preventDefault();
var tab = $(this).attr('data-tab');
$('.mfn-ui').removeClass('modalbox-card-active-content modalbox-card-active-style modalbox-card-active-advanced').addClass('modalbox-card-active-'+tab);
if( !$(this).hasClass('active') ) {
$(this).addClass('active');
$(this).siblings().removeClass('active');
if( $(this).hasClass('spct-li-advanced') || $(this).hasClass('spct-li-style') ){
let fid = $('.mfn-element-fields-wrapper .modalbox-card.modalbox-card-'+tab+' .mfn-component-wrapper:first-child').attr('data-id');
if( $('.mfn-element-fields-wrapper .modalbox-card.modalbox-card-'+tab+' .mfn-component-wrapper').length ){
if( !$('style.mfn-fields-switcher-'+fid).length ){
$('.mfn-element-fields-wrapper .modalbox-card.modalbox-card-'+tab+' .mfn-component-wrapper:first-child .toggled_header').trigger('click');
}
}
}
}
return;
});
/* CSS */
$('.body_offset_header .mfn-form-control').on('change', function() {
var val = $(this).val();
if(val == 'active'){
var header_height = $builder.outerHeight()+'px';
$('.body-offset-header-value .mfn-form-control').val(header_height);
}
});
$editpanel.on('change', '.has-default-unit.mfn-field-value', function() {
var $field = $(this);
var val = $field.val();
var units_check = false;
if( $field.val().length ){
$.each( units, function( i, el ) {
if( val == 'initial' || val == 'auto' || val.includes(el) ){
units_check = true;
}
});
if(units_check == false){
$field.val(val+$field.attr('data-unit')).trigger('change');
}
}
});
$editpanel.on('change', '.inline-style-input .mfn-field-value, .inline-style-input input[type="checkbox"]', function() {
var $field = $(this);
var it = $(this).closest('.mfn-element-fields-wrapper').attr('data-element');
var val = $field.val();
var units_check = false;
var fonts = [];
if( $field.closest('.font-family').length && $field.val().length ){
fonts.push( $field.val() );
}
// web font load
if( fonts.length ){
WebFont.load({
google: {
families: fonts
},
context: window.frames[0].frameElement.contentWindow,
});
}
if( $field.hasClass('preview-background-sizeinput') && val == 'cover-ultrawide' ){
$content.find('.'+it).addClass('bg-cover-ultrawide');
}else if($field.hasClass('preview-background-sizeinput') && val != 'cover-ultrawide'){
$content.find('.'+it).removeClass('bg-cover-ultrawide');
}
setTimeout(function() { grabFieldStyle( $field ); }, 20);
});
function prepareCss(csspath, cssstyle, val, uid, rwd) {
//console.log(uid);
if( typeof val === 'object' ) {
var filter = '';
var backdrop = '';
$.each(val, function(k, v) {
if( cssstyle.includes('typography') ){
addLocalStyle(csspath, v, k, rwd, uid);
}else if( cssstyle.includes('backdrop-filter') && v.length ){
if( k == 'string' ) backdrop = v;
}else if( cssstyle.includes('filter') && v.length ){
if( k == 'string' ) filter = v;
}else if( cssstyle.includes('gradient') ){
if( k == 'string' && v.length ) {
addLocalStyle(csspath, v, 'background-image', rwd, uid);
}else if( k == 'string' && !v.length ) {
addLocalStyle(csspath, '', 'background-image', rwd, uid);
}
}else if( cssstyle === 'transform'){
addLocalStyle(csspath, `matrix(${val.scaleX}, ${val.skewY}, ${val.skewX}, ${val.scaleY}, ${val.translateX}, ${val.translateY}) rotate(${val.rotate}deg)`, 'transform', rwd, uid);
}else{
addLocalStyle(csspath, v, cssstyle+'-'+k, rwd, uid);
}
});
if( filter.length ) {
addLocalStyle(csspath, filter, 'filter', 'desktop', uid);
}
if( backdrop.length ) {
addLocalStyle(csspath, backdrop, 'backdrop-filter', 'desktop', uid);
}
return;
}
if( (cssstyle == 'flex' || cssstyle == 'flex_laptop' || cssstyle == 'flex_tablet' || cssstyle == 'flex_mobile') && val.length ){
cssstyle = 'width';
}
/*
if( val == '' && (cssstyle == 'flex' || cssstyle == 'flex_tablet' || cssstyle == 'flex_laptop' || cssstyle == 'flex_mobile') ){
addLocalStyle(csspath, 'unset', 'max-width', rwd, uid);
}*/
if( cssstyle == 'transformtranslatex' ){
addLocalStyle(csspath, 'translateX('+val+')', 'transform', rwd, uid);
return;
}
if( cssstyle == 'transformtranslatey' ){
addLocalStyle(csspath, 'translateY('+val+')', 'transform', rwd, uid);
return;
}
if( (cssstyle == 'background-image' || cssstyle == 'background-image_tablet' || cssstyle == 'background-image_laptop' || cssstyle == 'background-image_mobile' || cssstyle == '-webkit-mask-image') && val.length ){
if( val == '{featured_image}' ){
val = 'var(--mfn-featured-image)';
}else if( val != 'none' ){
val = 'url('+val+')';
}
}
if( (cssstyle == 'background-size' || cssstyle == 'background-size_laptop' || cssstyle == 'background-size_tablet' || cssstyle == 'background-size_mobile') && val.length && val == 'custom' ) {
val = '';
}
if( (cssstyle == 'background-position' || cssstyle == 'background-position_laptop' || cssstyle == 'background-position_tablet' || cssstyle == 'background-position_mobile') && val.length && val == 'custom' ) {
val = '';
}
addLocalStyle(csspath, val, cssstyle, rwd, uid);
}
function grabFieldStyle($field){
// to remove after tests
let $box = $field.closest('.mfn-form-row');
let val = $field.attr('type') == 'checkbox' && !$field.prop('checked') ? '' : $field.val();
let it = $box.closest('.mfn-element-fields-wrapper').length ? $box.closest('.mfn-element-fields-wrapper').attr('data-element') : 'pageopt';
//let uid = it == 'pageopt' ? mfn.pageid : $content.find('.'+it).attr('data-uid');
let uid = edited_item.uid == 'pageoptions' ? mfn.pageid : edited_item.uid;
let rwd = 'desktop';
if( $box.hasClass('mfn_field_rwd') ) rwd = screen;
if( $box.closest('.transform_field').length ){
return;
}
if( $box.closest('.inline-style-input.gradient').length ) $box = $box.closest('.inline-style-input.gradient');
let csspath = $box.attr('data-csspath');
let cssstyle = $box.attr('data-name');
let id = $box.attr('data-id');
if( $box.closest('.typography').length ) {
csspath = $box.closest('.typography').attr('data-csspath');
cssstyle = $field.attr('data-key');
}
if( sidebar_form.is_class ) {
it = edited_item.uid;
uid = edited_item.uid;
csspath = csspath.replaceAll('mcb-item-mfnuidelement', uid).replaceAll('mcb-wrap-mfnuidelement', ''+uid).replaceAll('mcb-section-mfnuidelement', uid);
}
if( _.has( additional_css, id) ) {
if( val.length && _.has( additional_css[id]['rewrites'], val) ) {
addLocalStyle(additional_css[id]['selector'].replace('mfnuidelement', edited_item.uid), additional_css[id]['rewrites'][val], additional_css[id]['style'], rwd, uid);
}else{
addLocalStyle(additional_css[id]['selector'].replace('mfnuidelement', edited_item.uid), '', additional_css[id]['style'], rwd, uid);
}
}
if($box.find('input.pseudo-field').length && !$field.hasClass('pseudo-field')){
return;
}
if($box.find('input.pseudo-field').length){
val = $box.find('input.pseudo-field').val();
}
if($box.find('.separated-fields').length){
cssstyle = cssstyle+'-'+$field.attr('data-key');
}
if( $field.hasClass('preview-background-sizeinput') && val == 'cover-ultrawide' ){
val = '';
}
if( csspath == '.mcb-section .mcb-wrap .mcb-item-mfnuidelement' && cssstyle == 'width' ) {
if($('body').hasClass('mfn-navigator-active') ) be_navigator.show(edited_item.uid);
}
if( cssstyle == 'font-family' && val.includes('#') ) {
val = val.replace('#', '');
}
if( ( cssstyle == 'background-image' || cssstyle == '-webkit-mask-image' ) && val.length && !$box.hasClass('gradient') && !$builder.find('.'+it).closest('.mfn-looped-items').length ) {
if( val == '{featured_image}' && ( $box.hasClass('section') || $box.hasClass('wrap') ) && $box.hasClass('background-image') ){
val = 'var(--mfn-featured-image)';
}else if( val != 'none' ){
val = 'url('+val+')';
}
}
if( cssstyle == 'background-size' && val.length && val == 'custom' ) {
val = '';
}
if( cssstyle == 'background-position' && val.length && val == 'custom' ) {
val = '';
}
if( cssstyle == 'transformtranslatex' ) {
addLocalStyle(csspath, 'translateX('+val+')', 'transform', rwd, uid);
}
if( cssstyle == 'transformtranslatey' ) {
addLocalStyle(csspath, 'translateY('+val+')', 'transform', rwd, uid);
}
/*if( sidebar_form.is_class ){
setTimeout(function() {
mfn_classes.has_changed = edited_item;
}, 100);
}*/
addLocalStyle(csspath, val, cssstyle, rwd, uid);
}
// set size labels
function setSizeLabels(){
$content.find('.mfn-size-label .mfn-element-size-label').each(function() {
let uid = $(this).closest('.vb-item').attr('data-uid');
let curr_object = mfn.pagedata.filter( (item) => item.uid == uid )[0];
if( typeof curr_object !== 'undefined' && typeof curr_object['attr'] !== 'undefined' ) {
if( typeof curr_object['attr']['width_switcher'] !== 'undefined' && curr_object['attr']['width_switcher'] == 'custom' ){
$(this).text('Custom');
if( curr_object.jsclass == 'wrap' && $('body').hasClass('mfn-navigator-active') ) $('.navigator-tree .navigator-wrap.nav-'+curr_object.uid+' > a > .navigator-size-label').text('Custom');
}else{
let curr_size = $(this).closest('.vb-item').attr('data-'+screen+'-size');
$(this).text(curr_size);
if( curr_object.jsclass == 'wrap' && $('body').hasClass('mfn-navigator-active') ) $('.navigator-tree .navigator-wrap.nav-'+curr_object.uid+' > a > .navigator-size-label').text(curr_size);
}
}
setTimeout(function() {
resetBeforeAfter();
}, 1100);
});
}
// woocomemrce product gallery
var productgallery = {
start: function( $container ) {
$container.imagesLoaded( function() {
if(!$container.find('.flex-viewport').length) {
iframe.window.jQuery('.woocommerce-product-gallery:not(.mfn-initialized)').wc_product_gallery();
$container.addClass('mfn-initialized');
}
if($container.find('.flex-viewport').length){
$loup = $container.find('.woocommerce-product-gallery__trigger').clone(true).empty().appendTo('.flex-viewport');
$container.find('.woocommerce-product-gallery__trigger').remove();
if($container.find('.mfn-wish-button').length){
$container.find('.mfn-wish-button').clone(true).appendTo('.flex-viewport');
$container.find('.mfn-wish-button').remove();
}
}else if( $container.find('.woocommerce-product-gallery__trigger').length ){
$container.find('.woocommerce-product-gallery__trigger').empty();
}
if($container.find('.flex-control-thumbs').length){
$container.find('.flex-control-thumbs').wrap('<div class="mfn-flex-control-thumbs-wrapper"></div>');
}
$container.imagesLoaded( function() {
if( $container.hasClass('.mfn-thumbnails-left') || $container.hasClass('.mfn-thumbnails-right') ){
setTimeout(function() { productgallery.verticalThumbs($container); }, 300);
}else if( $container.hasClass('.mfn-thumbnails-bottom') ){
productgallery.horizontalThumbs($container);
}
});
iframe.window.jQuery('body').trigger('resize');
});
},
horizontalThumbs: function($container) {
//var $container = $container.find('.mfn-product-gallery');
var containerW = $container.outerWidth();
var $scroller = $container.find('.flex-control-thumbs');
var scrollerW = 0;
$scroller.find('li').each(function() {
$(this).addClass('swiper-slide');
scrollerW += $(this).outerWidth();
});
if( !$container.length || !$scroller.length ){
return;
}
if( scrollerW > containerW ){
//return;
$scroller.css({ 'justify-content': 'flex-start', 'width': '100%' });
$container.find('.mfn-flex-control-thumbs-wrapper').addClass('mfn-scroller-active');
}
$scroller.addClass('swiper-wrapper');
},
verticalThumbs: function($container) {
//var $container = $container.find('.mfn-product-gallery)');
var containerH = $container.find('.woocommerce-product-gallery__image').first().outerHeight();
var $scroller = $container.find('.flex-control-thumbs');
var scrollerH = 0;
var mimgm = 0; // main image margin
var overlay = mfnwoovars.productthumbsover ? mfnwoovars.productthumbsover : 0;
$scroller.find('li img').css({ 'height': 'auto' });
$scroller.find('li').css({ 'height': 'auto' });
$scroller.find('li').each(function() {
$(this).addClass('swiper-slide').css({ 'margin-bottom': parseInt(mfnwoovars.productthumbs) });
scrollerH += $(this).outerHeight()+parseInt(mfnwoovars.productthumbs);
$(this).css({ 'opacity': '1' });
});
if(mfnwoovars.mainimgmargin == 'mfn-mim-2'){
mimgm = 4;
}else if(mfnwoovars.mainimgmargin == 'mfn-mim-5'){
mimgm = 10;
}else if(mfnwoovars.mainimgmargin == 'mfn-mim-10'){
mimgm = 20;
}else if(mfnwoovars.mainimgmargin == 'mfn-mim-15'){
mimgm = 30;
}else if(mfnwoovars.mainimgmargin == 'mfn-mim-20'){
mimgm = 40;
}else if(mfnwoovars.mainimgmargin == 'mfn-mim-25'){
mimgm = 50;
}else if(mfnwoovars.mainimgmargin == 'mfn-mim-30'){
mimgm = 60;
}
if( !$container.length || !$scroller.length ){
return;
}
$container.find('.flex-viewport').css({'height': 'auto'});
if( scrollerH > containerH ){
if(overlay == 'mfn-thumbnails-overlay'){
$container.find('.mfn-flex-control-thumbs-wrapper').height( (containerH-mimgm) );
}else{
$container.find('.mfn-flex-control-thumbs-wrapper').height(containerH);
}
$scroller.css({ 'align-items': 'flex-start' });
$container.find('.mfn-flex-control-thumbs-wrapper').addClass('mfn-scroller-active');
$scroller.addClass('swiper-wrapper');
/*var swiper = new Swiper(".mfn-flex-control-thumbs-wrapper", {
slidesPerView: 4,
spaceBetween: parseInt(mfnwoovars.productthumbs),
direction: "vertical",
mousewheel: true,
});*/
$scroller.find('li').each(function() {
$(this).find('img').css({ 'height': $(this).outerHeight() });
$(this).css({ 'opacity': '1' });
});
}
}
};
/**
* Conditions
* mfnoptsinputs()
*/
var mfnoptsinputs = {
start: function() {
var prepareValues = false;
$items = $('.mfn-ui .mfn-form .activeif:not(.mfn-initialized)');
if( $items.length ){
$items.each(function() {
var fieldid = $(this).attr('data-conditionid');
if( !$('.mfn-ui .mfn-form #'+fieldid+'.watchChanges').length ){
$(this).addClass('conditionally-hide');
$('.mfn-ui .mfn-form #'+fieldid).addClass('watchChanges');
prepareValues = true;
}
$(this).addClass('mfn-initialized');
});
}
if( prepareValues ){
mfnoptsinputs.startValues();
}
},
startValues: function() {
$('.mfn-ui .mfn-form .watchChanges').each(function() {
var id = $(this).attr('id');
var val;
var visibility = $(this).hasClass('conditionally-hide') ? false : true;
if( $(this).find('.single-segmented-option.segmented-options').length || $(this).find('.visual-options').length ){
val = $(this).find('input:checked').val();
}else{
val = $(this).find('.mfn-field-value, .condition-field, .field-to-object').val();
}
mfnoptsinputs.getField(id, val, visibility);
});
},
watchChanges: function() {
// segmented options is in segmented click function
$editpanel.on('change', '.watchChanges .mfn-field-value, .watchChanges .condition-field, .watchChanges .field-to-object', function() {
var $formrow = $(this).closest('.watchChanges');
var val = $(this).val();
var id = $formrow.attr('id');
mfnoptsinputs.getField(id, val);
});
},
getField: function(id, val) {
$('.mfn-ui .mfn-form .activeif-'+id).each(function() {
var $formrow = $(this);
mfnoptsinputs.showhidefields($formrow, val);
});
},
showhidefields: function($formrow, val, visibility = true) {
var opt = $formrow.attr('data-opt');
var optval = $formrow.attr('data-val');
const regex = /\{featured_image:(\d+):badge\}/;
if( !visibility ){
$formrow.addClass('conditionally-hide').removeClass('conditionally-show');
return;
}
if( opt == 'is' && ( (val != '' && (optval.includes(val) || regex.test(val) )) || (val == '' && optval == '')) ){
$formrow.addClass('conditionally-show').removeClass('conditionally-hide');
}else if( opt == 'isnt' && ( (optval == '' && val != '') || (val == '' && optval != '') || val != optval ) ){
$formrow.addClass('conditionally-show').removeClass('conditionally-hide');
}else{
$formrow.addClass('conditionally-hide').removeClass('conditionally-show');
}
},
};
/**
* Transforms function
*/
const Transforms = {
// DOM RELATED
sidebarMenu: '', // Sidemenu from BeBuilder
insertSidebarMenu( sidebarMenu ){
if ( !sidebarMenu.closest('.transform_field') ) return console.error('Wrong DOM location of transform inputs');
this.sidebarMenu = sidebarMenu;
return this;
},
// CREATION OF TRANSFORM STRING & OBJECT
readyString: '', // for BeBuilder preview
readyStringWithoutRotate: '', // for BeBuilder preview
transformDuration: 0, // for BeBuilder preview
readyObject: {}, // for BeBuilder update info
createOrExtendObject( queriedValue, transform ) {
this.readyObject = {...this.readyObject, [transform.key]: queriedValue}
return this;
},
createOrExtendString( queriedValue, transform ) {
// console.log(queriedValue);
// First conditional is for ROTATE only
if (transform.key === this.inputs[this.inputs.length-1].key) {
this.readyString += queriedValue;
} else {
this.readyString += `${queriedValue},`;
}
return this;
},
createStringWithoutRotate(){
if (!this.readyString || this.readyString === '') return console.error('String of transforms is not created!');
let last_index = this.readyString.split(",");
this.readyStringWithoutRotate = last_index.slice(0, last_index.length - 1).join(",");
return this;
},
createTransformDuration(){
if (!this.sidebarMenu || this.sidebarMenu === '') return console.error('The sidebar menu DOM is not inserted!');
transformDuration = $(this.sidebarMenu).closest('.mfn-form-row').siblings('*[data-name="transition"]');
if (transformDuration) {
this.transformDuration = $(transformDuration).find('input.mfn-field-value').val();
}
return this;
},
// INPUTS HANDLER
inputs: [
// Matrix array in proper order
{ key: 'scaleX', domLocation_value: 'input.mfn-field-value[data-key="scaleX"]', defaultValue: 1 },
{ key: 'skewY', domLocation_value: 'input.mfn-field-value[data-key="skewY"]', defaultValue: 0 },
{ key: 'skewX', domLocation_value: 'input.mfn-field-value[data-key="skewX"]', defaultValue: 0 },
{ key: 'scaleY', domLocation_value: 'input.mfn-field-value[data-key="scaleY"]', defaultValue: 1 },
{ key: 'translateX', domLocation_value: 'input.mfn-field-value[data-key="translateX"]', defaultValue: 0 },
{ key: 'translateY', domLocation_value: 'input.mfn-field-value[data-key="translateY"]', defaultValue: 0 },
// Not in matrix array, should be always last arr element!
{ key: 'rotate', domLocation_value: 'input.mfn-field-value[data-key="rotate"]', defaultValue: 0 },
],
loopThrouInputs(){
this.readyString = ''; //every loop this needs to be refreshed
for(let transform of this.inputs) {
let queriedDOM = $(this.sidebarMenu).find('.transform_field ' + transform['domLocation_value']);
let queriedValue = !!queriedDOM.val() ? parseFloat(queriedDOM.val()) : parseFloat(transform.defaultValue);
this.createOrExtendObject( queriedValue, transform )
this.createOrExtendString( queriedValue, transform )
}
return this;
},
// BEBUILDER UI RELATED
attachInitialMargins(){
$transforms = $builder.find('.mfn-transformed').find('.mfn-header-transform:not([data-initMarginLeft])');
$transforms.each(function(index, item){
const transformSibling = jQuery(item).siblings('.mcb-column-inner').length ? jQuery(item).siblings('.mcb-column-inner') : jQuery(item).siblings('.mcb-wrap-inner');
jQuery(item).attr('data-initMarginLeft', jQuery(transformSibling).css('marginLeft')).css('marginLeft', jQuery(transformSibling).css('marginLeft'));
jQuery(item).attr('data-initMarginTop', jQuery(transformSibling).css('marginTop')).css('marginTop', jQuery(transformSibling).css('marginTop'));
})
},
attachNewMargins(){
if($content && $content.find('.mfn-transformed').length){
$transforms = $builder.find('.mfn-header-transform[data-initMarginLeft]');
$transforms.each(function(index, item){
const transformSibling = jQuery(item).siblings('.mcb-column-inner').length ? jQuery(item).siblings('.mcb-column-inner') : jQuery(item).siblings('.mcb-wrap-inner');
jQuery(item).css('marginLeft', `${jQuery(transformSibling).css('marginLeft')}`);
jQuery(item).css('marginTop', `${jQuery(transformSibling).css('marginTop')}`);
})
}
},
// BEBUILDER PREVIEW OF TRANSFORM
renderTransforms(){
const tempInnerClass = $($edited_div).hasClass('wrap') ? `.mcb-wrap-inner` : `.mcb-column-inner`; //left for wrap transforms!
const uidEdited = edited_item.uid;
const domLocation = this.sidebarMenu.closest('.transform').attr('data-csspath');
let id = this.sidebarMenu.closest('.transform').attr('data-id');
// If has no transform class, add it and attach initial value!
if( !$($edited_div).hasClass('mfn-transformed') ) {
$($edited_div).addClass('mfn-transformed');
this.attachInitialMargins();
}
var style = 'transform';
addLocalStyle(`${domLocation}`, `matrix(${this.readyStringWithoutRotate}) rotate(${this.readyObject.rotate}deg)`, style, screen, uidEdited);
if( typeof edited_item['attr'][id] === 'undefined' ) edited_item['attr'][id] = {};
if( typeof edited_item['attr'][id]['val'] === 'undefined' ) edited_item['attr'][id]['val'] = {};
if( typeof edited_item['attr'][id]['val'][screen] === 'undefined' ) edited_item['attr'][id]['val'][screen] = {};
edited_item['attr'][id]['selector'] = domLocation;
edited_item['attr'][id]['style'] = style;
edited_item['attr'][id]['val'][screen] = {
...this.readyObject,
...{'string': this.readyString}
};
return this;
},
// EVENTS
addInputsListener(){
const that = this;
$editpanel.on('change', '.transition .mfn-field-value', function(){
$editpanel.trigger('change', '.transform input.mfn-field-value');
})
$editpanel.on('change', '.transform .mfn-field-value', function(){
const sidebarMenu = $(this).closest('.transform').closest('.mfn-form-row.transform');
that
.insertSidebarMenu($(sidebarMenu))
.loopThrouInputs()
.createStringWithoutRotate()
.createTransformDuration()
.renderTransforms();
})
},
// RETURNS
get(){
return {readyString: this.readyString, readyObject: this.readyObject, stringWithoutRotate: this.readyStringWithoutRotate, transformDuration: this.transformDuration};
}
}
/* FIELDS */
$editpanel.on('change', '.panel-edit-item .mfn-form .field-to-object, .panel-edit-item .mfn-form .mfn-field-value', function() {
updateObject($(this));
}).on('focus', '.panel-edit-item .mfn-form .field-to-object, .panel-edit-item .mfn-form .mfn-field-value', function() {
sidebar_form.focus = '[name="'+$(this).attr('name')+'"]';
if( typeof $(this).attr('data-key') != 'undefined' ) sidebar_form.focus += '[data-key="'+$(this).attr('data-key')+'"]';
}).on('blur', '.panel-edit-item .mfn-form .field-to-object, .panel-edit-item .mfn-form .mfn-field-value', function() {
sidebar_form.focus = false;
});
$(document).on('click', '.mfn-reset-val-icon', function(e) {
e.preventDefault();
let id = $(this).closest('.mfn-form-row').attr('data-id');
if( _.has(edited_item['attr'], id) ) delete(edited_item['attr'][id]);
setTimeout(function() {
loopAllStyleFields(edited_item.uid);
if( _.has(edited_item, 'be_classes') && edited_item.be_classes.length ) loopAllStyleFields(edited_item.be_classes[0]);
if( !id.includes('css_') ) re_render();
sidebar_form.render();
},10);
});
function updateObject( $field ){
var it = $field.closest('.mfn-element-fields-wrapper').attr('data-element');
var $editrow = $field.closest('.mfn-form-row');
var $box = $field.closest('.mfn_input_wrapper');
if( $editrow.hasClass('themeoption') ) return;
if( $editrow.hasClass('pageoption') ) return;
if( $editrow.hasClass('css_advanced_transform') || $editrow.hasClass('css_advanced_transform_hover') ) return;
if( $editrow.find('.checkboxes.pseudo').length ) return;
if( !_.has(edited_item, 'attr') ) edited_item['attr'] = {};
if (Array.isArray(edited_item['attr'])) edited_item['attr'] = Object.assign({}, edited_item['attr']);
var field_name = typeof $field.attr('name') !== 'undefined' ? $field.attr('name') : $field.attr('data-name');
var selector = '';
var style = '';
var key = '';
var order = 0; // for tabs
var val = $field.attr('type') == 'checkbox' && !$field.prop('checked') ? '' : $field.val(); // checkbox unclickable
var has_updated = false;
if( $editrow.hasClass('object-css-input') && !$editrow.closest('.mfn-hotspot-point').length ) {
selector = $editrow.attr('data-csspath');
style = $editrow.attr('data-name');
if( !_.has(edited_item['attr'], field_name) || typeof edited_item['attr'][field_name] == 'string' ) edited_item['attr'][field_name] = {};
if( !_.has(edited_item['attr'][field_name], 'val') || typeof edited_item['attr'][field_name]['val'] == 'string' ) edited_item['attr'][field_name]['val'] = {};
if( $field.closest('.mfn-form-row.mfn_field_rwd').length && !_.has(edited_item['attr'][field_name]['val'], screen) ) edited_item['attr'][field_name]['val'][screen] = {};
if( $field.closest('.mfn-form-row.mfn_field_rwd').length && _.has(edited_item['attr'][field_name]['val'], screen) && Array.isArray(edited_item['attr'][field_name]['val'][screen])) edited_item['attr'][field_name]['val'][screen] = Object.assign({}, edited_item['attr'][field_name]['val'][screen]);
}
if( $field.closest('.typography').length && typeof $field.attr('data-key') !== 'undefined' ){
key = $field.attr('data-key');
selector = $field.closest('.typography').attr('data-csspath');
style = 'typography';
if( key.includes('font-family') && val.length ) val = val.replace('#', '');
}else if( $editrow.closest('.inline-style-input.gradient').length || $editrow.hasClass('backdrop-filter') || $editrow.hasClass('filter') ) {
key = $field.attr('data-key');
selector = $editrow.closest('.inline-style-input').attr('data-csspath');
style = $editrow.closest('.inline-style-input').attr('data-name');
}else if( $editrow.find('.separated-fields').length && typeof $field.attr('data-key') !== 'undefined' ){
key = $field.attr('data-key');
}else if( $editrow.hasClass('mfn-tabs-row') && $field.closest('li.tab').length ){
if( field_name.includes('tabs[') ) field_name = 'tabs';
key = $field.attr('data-label');
order = $field.attr('data-order');
if( !_.has(edited_item['attr'][field_name], order) ) edited_item['attr'][field_name][order] = {};
if( !_.has(edited_item['attr'][field_name][order], key) ) edited_item['attr'][field_name][order][key] = {};
if( val.length ){
edited_item['attr'][field_name][order][key] = val;
}else if( typeof edited_item['attr'][field_name][order][key] != 'undefined' ) {
delete(edited_item['attr'][field_name][order][key]);
}
has_updated = true;
}else if( $editrow.closest('.mfn-hotspot-point').length ){
let point_hash = $editrow.closest('.mfn-hotspot-point').attr('id');
if( edited_item['attr']['hotspots'].filter(item => item.hash == point_hash ).length ) {
let ht = edited_item['attr']['hotspots'].filter(item => item.hash == point_hash )[0];
if( field_name.includes('css_') ) {
if( typeof ht['val'] == 'undefined' ) ht['val'] = {};
if( _.has(ht['val'], field_name) ) {
if( $editrow.hasClass('mfn_field_rwd') ){
ht['val'][field_name]['val'][screen] = $field.val();
}else{
ht['val'][field_name]['val'] = $field.val();
}
}else{
var tmp_val = {};
tmp_val['style'] = $editrow.attr('data-name');
tmp_val['selector'] = $editrow.attr('data-csspath');
if( $editrow.hasClass('mfn_field_rwd') ){
if( !_.has(tmp_val, 'val') ) tmp_val['val'] = {};
tmp_val['val'][screen] = $field.val();
}else{
tmp_val['val'] = $field.val();
}
ht['val'][field_name] = tmp_val;
}
}else{
ht[field_name] = $field.val();
}
}
has_updated = true;
}
if( !has_updated ) {
if( !_.isEmpty(val) || $field.closest('.mfn-placeholder-inherited-class').length ) {
if( $editrow.hasClass('object-css-input') ){
edited_item['attr'][field_name]['selector'] = selector;
edited_item['attr'][field_name]['style'] = style;
if( key.length ){
if( $editrow.hasClass('mfn_field_rwd') ){
edited_item['attr'][field_name]['val'][screen][key] = val;
}else{
edited_item['attr'][field_name]['val'][key] = val;
}
}else{
if( $editrow.hasClass('mfn_field_rwd') ){
edited_item['attr'][field_name]['val'][screen] = val;
}else{
edited_item['attr'][field_name]['val'] = val;
}
}
}else{
if( $editrow.hasClass('mfn_field_rwd') ) {
if( !_.has(edited_item['attr'], field_name ) || typeof edited_item['attr'][field_name] == 'string' ) edited_item['attr'][field_name] = {};
edited_item['attr'][field_name][screen] = val;
}else{
edited_item['attr'][field_name] = val;
}
}
if( $field.closest('.mfn-placeholder-inherited-rwd').length || $field.closest('.mfn-placeholder-inherited-class').length || $field.closest('.mfn-placeholder-inherited-std').length ) {
$field.closest('.mfn-placeholder-inherited-rwd').removeClass('mfn-placeholder-inherited-rwd');
$field.closest('.mfn-placeholder-inherited-std').removeClass('mfn-placeholder-inherited-std');
$field.closest('.mfn-placeholder-inherited-class').removeClass('mfn-placeholder-inherited-class');
if( ($field.closest('.segmented-options').length || $field.hasClass('mfn-form-select')) && !$editrow.find('.mfn-reset-val-icon').length) {
$editrow.find('label').first().addClass('form-label-wrapper').append('<a href="#" class="mfn-option-btn mfn-option-blank mfn-reset-val-icon"><span class="mfn-icon mfn-icon-reset"></span></a>');
}
}
}else if( _.isEmpty(val) && (_.has(edited_item['attr'], field_name) || $editrow.hasClass('mfn-placeholder-inherited-class')) ) {
if( $editrow.hasClass('object-css-input') ) {
if( key.length ){
if( $editrow.hasClass('mfn_field_rwd') ){
delete(edited_item['attr'][field_name]['val'][screen][key]);
}else{
delete(edited_item['attr'][field_name]['val'][key]);
}
}else{
if( $editrow.hasClass('mfn_field_rwd') ){
delete(edited_item['attr'][field_name]['val'][screen]);
}else{
delete(edited_item['attr'][field_name]);
}
}
if( _.has(edited_item['attr'], field_name) && _.has(edited_item['attr'][field_name], 'val') && _.isEmpty( edited_item['attr'][field_name]['val'] ) ) delete(edited_item['attr'][field_name]);
}else{
if( $editrow.hasClass('mfn_field_rwd') ){
delete(edited_item['attr'][field_name][screen]);
}else{
delete(edited_item['attr'][field_name]);
}
}
setTimeout(sidebar_form.render, 50);
}
}
if( typeof $field.attr('data-pointobj') !== 'undefined' && $content.find('.'+it+' .mfn-hotspot-style-line .hotspot-image').length ){
var c_id = $content.find('.'+it+' .mfn-hotspot-style-line .hotspot-image').attr('id').replace('wrapper', '');
mfn_hotspots_field.refresh(c_id, $field);
}
setTimeout( function() {
if( ($field.val().length && $field.val().includes('{')) ) {
// re render whole loop wrapper
if( $content.find('.'+it).closest('.mfn-queryloop-item-wrapper').length ) {
re_render( $content.find('.'+it).closest('.mcb-section.vb-item').attr('data-uid') );
}else{
re_render( edited_item.uid );
}
$editrow.addClass('mfn-field-loading');
}else if( $editrow.hasClass('re_render') || $editrow.hasClass('mfn-tabs-row') ) {
if( $content.find('.'+it).closest('.mfn-queryloop-item-wrapper').length || $content.find('.'+it).find('.mfn-queryloop-item-wrapper').length || $content.find('.'+it).hasClass('mfn-nested-wrap') ) {
re_render( $content.find('.'+it).closest('.mcb-section.vb-item').attr('data-uid') );
}else{
re_render( edited_item.uid );
}
$editrow.addClass('mfn-field-loading');
}
if( !$editrow.hasClass('re_render') && !$editrow.hasClass('disable-history') && !$content.find('.'+it).closest('.mfn-queryloop-item-wrapper').length && !$editrow.find('.multiple-inputs').length ) historyStorage.add();
if( $editrow.hasClass('banner_box') ) mfnBannerBox();
}, 30);
enableBeforeUnload();
}
$editpanel.on('change paste', '.panel-view-options .mfn-form .mfn-field-value, .panel-view-options .mfn-form .mfn-form-checkbox', function() {
let editrow = $(this).closest('.mfn-form-row');
let name = editrow.attr('data-name');
let id = editrow.attr('data-id');
let val = $(this).val();
let key = typeof $(this).attr('data-key') !== 'undefined' ? $(this).attr('data-key') : false;
if( editrow.find('.checkboxes:not(.pseudo)').length && !$(this).is(':checked') ) val = '';
if( editrow.hasClass('object-css-input') ) {
if( typeof edited_item[id] == 'undefined' || typeof edited_item[id] != 'object' ) edited_item[id] = {};
if( !_.has(edited_item[id], 'val') || typeof edited_item[id]['val'] == 'string' ) edited_item[id]['val'] = {};
edited_item[id]['selector'] = editrow.attr('data-csspath');
edited_item[id]['style'] = name;
if( editrow.hasClass('mfn_field_rwd') ) {
if( !_.has(edited_item[id]['val'], screen) ) {
if( !_.isEmpty(edited_item[id]['val']) ) {
if( !_.has( edited_item[id]['val'], 'desktop' ) && !_.has( edited_item[id]['val'], 'laptop' ) && !_.has( edited_item[id]['val'], 'tablet' ) && !_.has( edited_item[id]['val'], 'mobile' ) ){
let tmp_val = JSON.parse( JSON.stringify(edited_item[id]['val']) );
edited_item[id]['val'] = {};
edited_item[id]['val'][screen] = tmp_val;
}
}else{
edited_item[id]['val'][screen] = {};
}
}
if( key ){
if( !_.has(edited_item[id]['val'], screen) ) edited_item[id]['val'][screen] = {};
edited_item[id]['val'][screen][key] = val;
}else{
edited_item[id]['val'][screen] = val;
}
}else{
if( key ){
edited_item[id]['val'][key] = val;
}else{
edited_item[id]['val'] = val;
}
}
val = edited_item[id];
}else{
edited_item[id] = val;
}
if( id == 'mfn-post-layout' ) {
$('.panel-view-options .mfn-form .mfn-post-sidebar .mfn-field-value').trigger('change');
$('.panel-view-options .mfn-form .mfn-post-sidebar2 .mfn-field-value').trigger('change');
}
// header options
if( builder_type == 'header' ) {
if( editrow.hasClass('header_mobile') && val == 'enabled' ) {
$('.mfn-be-header-builder .mfn-header-type-preview a[data-preview="header-mobile"]').removeClass('disabled');
}else if( editrow.hasClass('header_mobile') ) {
$('.mfn-be-header-builder .mfn-header-type-preview a[data-preview="header-mobile"]').addClass('disabled');
$('.mfn-be-header-builder .mfn-header-type-preview a[data-preview="header-default"]').trigger('click');
}
if( editrow.hasClass('header_sticky') && val == 'enabled' ) {
$('.mfn-be-header-builder .mfn-header-type-preview a[data-preview="header-sticky"]').removeClass('disabled');
}else if( editrow.hasClass('header_sticky') ) {
$('.mfn-be-header-builder .mfn-header-type-preview a[data-preview="header-sticky"]').addClass('disabled');
$('.mfn-be-header-builder .mfn-header-type-preview a[data-preview="header-default"]').trigger('click');
}
if( editrow.hasClass('body_offset_header') ) {
if( val == 'active' ) {
$content.find('.mfn-header-tmpl').removeClass('mfn-header-tmpl-absolute');
}else if(!$content.find('.mfn-header-tmpl').hasClass('mfn-header-tmpl-absolute')) {
$content.find('.mfn-header-tmpl').addClass('mfn-header-tmpl-absolute');
}
}
if( editrow.hasClass('header_position') ) {
if( val == 'default' ) {
$content.find('.mfn-header-tmpl').removeClass('mfn-header-tmpl-absolute');
}else if( !$('.body_offset_header .preview-body_offset_headerinput').val().length ) {
$content.find('.mfn-header-tmpl').addClass('mfn-header-tmpl-absolute');
}
}
if( editrow.hasClass('option header_width') ) {
if( val == 'inherited' ) {
$content.find('.mfn-header-tmpl').addClass('mfn-header-layout-width');
}else{
$content.find('.mfn-header-tmpl').removeClass('mfn-header-layout-width');
}
}
if( editrow.hasClass('option header_sticky_width') ) {
if( val == 'inherited' ) {
$content.find('.mfn-header-tmpl').addClass('mfn-sticky-layout-width');
}else{
$content.find('.mfn-header-tmpl').removeClass('mfn-sticky-layout-width');
}
}
}
if( mfn.view == 'demo' ) return;
updatePageOpt(id, val);
});
function updatePageOpt(name, value){
if( _.has(value, 'val') && _.has(value['val'], 'val') ){
delete(value['val']['val']);
}
if( _.has(value, 'val') && _.has(value['val'], 'selector') ){
delete(value['val']['selector']);
}
if( _.has(value, 'val') && _.has(value['val'], 'style') ){
delete(value['val']['style']);
}
//page_options_tab.render();
$.ajax( mfnajaxurl, {
type : "POST",
data : {
'mfn-builder-nonce': wpnonce,
action: 'mfn_post_option',
id: pageid,
option: name,
value: value,
}
});
}
// transform events
Transforms.addInputsListener();
/* THEME OPTIONS */
$editpanel.on('keyup paste change', '.themeoption.logo-text .mfn-field-value', function() {
let val = $(this).val();
if( val.length ){
$content.find('#Top_bar .logo, #Header_creative .logo').addClass('text-logo');
$content.find('#Top_bar .logo #logo, #Header_creative .logo #logo').html(val);
}else{
$content.find('#Top_bar .logo, #Header_creative .logo').removeClass('text-logo');
$content.find('#Top_bar .logo #logo, #Header_creative .logo #logo').html('<img class="logo-main scale-with-grid " src="'+mfn.themepath+'/images/logo/logo.png" alt="Luk test"><img class="logo-sticky scale-with-grid" src="'+mfn.themepath+'/images/logo/logo.png" alt="Luk test"><img class="logo-mobile scale-with-grid " src="https://muffingroup.com/dev8624/lukas/woo/wp-content/uploads/2021/08/clothingstore-mobile.webp" alt="Luk test"><img class="logo-mobile-sticky scale-with-grid " src="'+mfn.themepath+'/images/logo/logo.png" alt="Luk test">');
}
});
$editpanel.on('keyup paste change', '.themeoption.header-slogan .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Action_bar').length ) return;
if( val.length ){
if( $content.find('#Action_bar .contact_details .slogan').length ){
$content.find('#Action_bar .contact_details .slogan').html(val);
}else{
$content.find('#Action_bar .contact_details').prepend('<li class="slogan">'+val+'</li>');
}
}else{
$content.find('#Action_bar .contact_details .slogan').remove();
}
});
$editpanel.on('keyup paste change', '.themeoption.header-phone .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Action_bar').length ) return;
if( val.length ){
if( $content.find('#Action_bar .contact_details .phone-1 a').length ){
$content.find('#Action_bar .contact_details .phone-1 a').html(val);
}else{
$content.find('#Action_bar .contact_details').append('<li class="phone phone-1"><i class="icon-phone" aria-label="phone icon"></i><a href="#">'+val+'</a></li>');
}
}else{
$content.find('#Action_bar .contact_details .phone-1').remove();
}
});
$editpanel.on('keyup paste change', '.themeoption.header-phone-2 .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Action_bar').length ) return;
if( val.length ){
if( $content.find('#Action_bar .contact_details .phone-2 a').length ){
$content.find('#Action_bar .contact_details .phone-2 a').html(val);
}else{
$content.find('#Action_bar .contact_details').append('<li class="phone phone-2"><i class="icon-phone" aria-label="phone icon"></i><a href="#">'+val+'</a></li>');
}
}else{
$content.find('#Action_bar .contact_details .phone-2').remove();
}
});
$editpanel.on('keyup paste change', '.themeoption.header-email .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Action_bar').length ) return;
if( val.length ){
if( $content.find('#Action_bar .contact_details .mail a').length ){
$content.find('#Action_bar .contact_details .mail a').html(val);
}else{
$content.find('#Action_bar .contact_details').append('<li class="mail"><i class="icon-mail-line" aria-label="mail icon"></i><a href="#">'+val+'</a></li>');
}
}else{
$content.find('#Action_bar .contact_details .mail').remove();
}
});
$editpanel.on('keyup paste change', '.themeoption.footer-copy .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Footer .footer_copy .copyright').length ) return;
if( val.length ){
$content.find('#Footer .footer_copy .copyright').html(val);
}else{
$content.find('#Footer .footer_copy .copyright').html('© '+new Date().getFullYear()+' Betheme by <a href="https://muffingroup.com" target="_blank">Muffin group</a> | All Rights Reserved | Powered by <a href="https://wordpress.org" target="_blank">WordPress</a>');
}
});
$editpanel.on('keyup paste change', '.themeoption.header-menu-text .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('.mobile-header-mini #Top_bar a.responsive-menu-toggle').length ) return;
if( val.length ){
$content.find('.mobile-header-mini #Top_bar a.responsive-menu-toggle').html('<span>'+val+'</span>');
}else{
$content.find('.mobile-header-mini #Top_bar a.responsive-menu-toggle').html('<i class="icon-menu-fine" aria-hidden="true"></i>');
}
});
$editpanel.on('keyup paste change', '.themeoption.footer-call-to-action .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Footer').length ) return;
if( val.length ){
if( $content.find('#Footer .footer_action .mcb-column-inner').length ){
$content.find('#Footer .footer_action .mcb-column-inner').html(val);
}else{
$content.find('#Footer').prepend('<div class="footer_action"><div class="container"><div class="column one mobile-one"><div class="mcb-column-inner">'+val+'</div></div></div></div>');
}
}else{
$content.find('#Footer .footer_action').remove();
}
});
$editpanel.on('keyup paste change', '.themeoption.header-action-title .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#Header_wrapper .top_bar_right_wrapper').length ) return;
if( val.length ){
if( $content.find('#Header_wrapper .top_bar_right_wrapper .action_button.top-bar-right-button').length ){
$content.find('#Header_wrapper .top_bar_right_wrapper .action_button.top-bar-right-button').html(val);
}else{
$content.find('#Header_wrapper .top_bar_right_wrapper').append('<a href="#" class="action_button top-bar-right-button ">'+val+'</a>');
}
}else{
$content.find('#Header_wrapper .top_bar_right_wrapper .action_button.top-bar-right-button').remove();
}
});
$editpanel.on('keyup paste change', '.themeoption.gdpr-content .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#mfn-gdpr').length ) return;
$content.find('#mfn-gdpr .mfn-gdpr-content').html(val);
});
$editpanel.on('keyup paste change', '.themeoption.gdpr-content-button_text .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#mfn-gdpr').length ) return;
$content.find('#mfn-gdpr .mfn-gdpr-button').html(val);
});
$editpanel.on('keyup paste change', '.themeoption.gdpr-content-more_info_text .mfn-field-value', function() {
let val = $(this).val();
if( !$content.find('#mfn-gdpr').length ) return;
$content.find('#mfn-gdpr .mfn-gdpr-readmore').html(val);
});
$editpanel.on('click', '.themeoption .ajax a', function(e) {
e.preventDefault();
//console.log('randomize');
});
let to_been_aborted = false;
$editpanel.on('change paste', '.panel-view-themeoptions .mfn-form input:not(.mfn-prevent-change), .panel-view-themeoptions .mfn-form .mfn-field-value', function() {
var $editrow = $(this).closest('.mfn-form-row');
var name = $(this).attr('name');
var value = $(this).val();
if( $editrow.find('.multiple-inputs').length ) {
let data_name = $editrow.attr('data-name');
if( $editrow.find('.multiple-inputs .pseudo-field').length && $editrow.find('.multiple-inputs .pseudo-field').val().length ) {
edited_item[data_name] = $editrow.find('.multiple-inputs .pseudo-field').val();
value = $editrow.find('.multiple-inputs .pseudo-field').val();
} else {
let data_key = typeof $(this).attr('data-key') !== 'undefined' ? $(this).attr('data-key') : 'color';
if( value.length ) {
if( typeof edited_item[data_name] !== 'undefined' && typeof edited_item[data_name] !== 'string' ) {
edited_item[data_name][data_key] = value;
}else{
edited_item[data_name] = {};
edited_item[data_name][data_key] = value;
}
}else{
delete(edited_item[data_name][data_key]);
}
}
}else if( $editrow.find('.checkboxes').length ){
let data_name = $(this).attr('name');
let data_key = $(this).attr('data-key');
if( $(this).is(':checked') ){
if( typeof edited_item[data_name] !== 'undefined' && typeof edited_item[data_name] !== 'string' ) {
edited_item[data_name][data_key] = value;
}else{
edited_item[data_name] = {};
edited_item[data_name][data_key] = value;
}
}else{
delete(edited_item[data_name][data_key]);
}
}else if( $editrow.find('.added-sidebars').length ){
name = $(this).attr('name');
if( !value.length ) {
delete( edited_item[name][$(this).attr('data-key')] );
}else{
if( typeof edited_item[name] === 'undefined' && typeof edited_item[name] !== 'array' ){
edited_item[name] = [];
}
edited_item[name].push(value);
}
}else if( $editrow.find('.social-icons').length ){
let data_key = $(this).closest('li').length ? $(this).closest('li').attr('data-key') : $(this).attr('data-key');
let data_name = $editrow.attr('data-name');
if( typeof edited_item[data_name] !== 'undefined' && typeof edited_item[data_name] !== 'string' ) {
edited_item[data_name][data_key] = value;
}else{
edited_item[data_name] = {};
edited_item[data_name][data_key] = value;
}
}else if( $editrow.find('.color-picker.multi').length ){
let data_name = $(this).attr('name');
let data_key = $(this).attr('data-key');
if( value.length ){
if( typeof edited_item[data_name] !== 'undefined' && typeof edited_item[data_name] !== 'string' ) {
edited_item[data_name][data_key] = value;
}else{
edited_item[data_name] = {};
edited_item[data_name][data_key] = value;
}
}else{
delete(edited_item[data_name][data_key]);
}
}else if( $editrow.find('.form-group.typography').length ){
let data_name = $(this).attr('name');
let data_key = $(this).attr('data-obj');
if( value.length ){
if( typeof edited_item[data_name] !== 'undefined' && typeof edited_item[data_name] !== 'string' ) {
edited_item[data_name][data_key] = value;
}else{
edited_item[data_name] = {};
edited_item[data_name][data_key] = value;
}
}else{
delete(edited_item[data_name][data_key]);
}
}else{
edited_item[name] = value;
}
if( $editrow.hasClass('themeoption') && ($editrow.hasClass('img-page-bg') || $editrow.hasClass('img-subheader-bg') || $editrow.hasClass('top-bar-bg-img') || $editrow.hasClass('subheader-image') || $editrow.hasClass('footer-bg-img') ) ) {
// themeoption background image
var field_class = 'img-page-bg';
var style_path = 'html';
if( $editrow.hasClass('img-subheader-bg') ){
field_class = 'img-subheader-bg';
style_path = 'body:not(.template-slider) #Header_wrapper';
}else if( $editrow.hasClass('top-bar-bg-img') ){
field_class = 'top-bar-bg-img';
style_path = '#Top_bar, #Header_creative';
}else if( $editrow.hasClass('subheader-image') ){
field_class = 'subheader-image';
style_path = '#Subheader';
}else if( $editrow.hasClass('footer-bg-img') ){
field_class = 'footer-bg-img';
style_path = '#Footer';
}
if( $content.find('style#themeoption'+field_class).length ) $content.find('style#themeoption'+field_class).remove();
$content.find('body').append('<style id="themeoption'+field_class+'">'+style_path+'{background-image: '+( value.length ? 'url('+value+')' : 'none' )+'; }</style>');
}else if($editrow.hasClass('themeoption') && ( $editrow.hasClass('position-page-bg') || $editrow.hasClass('img-subheader-attachment') || $editrow.hasClass('top-bar-bg-position') || $editrow.hasClass('subheader-position') || $editrow.hasClass('footer-bg-img-position') ) ){
// themeoptions bg position | repeat
var val_helper = value.split(';');
var val_string = '';
var field_class = 'position-page-bg';
var style_path = 'html';
if( $editrow.hasClass('img-subheader-attachment') ) {
field_class = 'img-subheader-attachment';
style_path = 'body:not(.template-slider) #Header_wrapper';
}else if( $editrow.hasClass('top-bar-bg-position') ) {
field_class = 'top-bar-bg-position';
style_path = '#Top_bar, #Header_creative';
}else if( $editrow.hasClass('subheader-position') ) {
field_class = 'subheader-position';
style_path = '#Subheader';
}else if( $editrow.hasClass('footer-bg-img-position') ) {
field_class = 'footer-bg-img-position';
style_path = '#Footer';
}
if( val_helper[0] != '' ) val_string += 'background-repeat: '+val_helper[0]+';';
if( val_helper[1] != '' ) val_string += 'background-position: '+val_helper[1]+';';
if( val_helper[2] != '' ) val_string += 'background-attachment: '+val_helper[2]+';';
if( val_helper[3] != '' ) val_string += 'background-size: '+val_helper[3]+';';
if( $content.find('style#'+field_class).length ){
$content.find('style#'+field_class).html(style_path+'{ '+val_string+' }');
}else{
$content.find('body').append('<style id="'+field_class+'">'+style_path+'{'+val_string+'}</style>');
}
}else if( $editrow.hasClass('themeoption') && ( $editrow.hasClass('size-page-bg') || $editrow.hasClass('size-subheader-bg') || $editrow.hasClass('subheader-size') || $editrow.hasClass('footer-bg-img-size') ) ){
// theme options bg image size
var field_class = 'size-page-bg';
var style_path = 'html';
if( $editrow.hasClass('size-subheader-bg') ) {
field_class = 'size-subheader-bg';
style_path = 'body:not(.template-slider) #Header_wrapper';
}else if( $editrow.hasClass('subheader-size') ) {
field_class = 'subheader-size';
style_path = '#Subheader';
}else if( $editrow.hasClass('footer-bg-img-size') ) {
field_class = 'footer-bg-img-size';
style_path = '#Footer';
}
if( $content.find('style#themeoption'+field_class+'').length ){
$content.find('style#themeoption'+field_class+'').html(style_path+'{background-size: '+value+'; }');
}else{
$content.find('body').append('<style id="themeoption'+field_class+'">'+style_path+'{background-size: '+value+'; }</style>');
}
}else if($editrow.hasClass('themeoption favicon-img')){
// favicon
var link = document.querySelector("link[rel~='icon']");
if (!link) {
link = document.createElement('link');
link.rel = 'icon';
document.getElementsByTagName('head')[0].appendChild(link);
}
if( value.length ){
link.href = value;
}else{
link.href = mfn.themepath+'/images/favicon.ico';
}
}else if($editrow.hasClass('themeoption logo-vertical-padding')){
// logo vertical padding
if( $content.find('style#themeoptionlogo-vertical-padding').length ) $content.find('style#themeoptionlogo-vertical-padding').remove();
if( value.length ) $content.find('body').append('<style id="themeoptionlogo-vertical-padding">#Top_bar #logo, .header-fixed #Top_bar #logo, .header-plain #Top_bar #logo, .header-transparent #Top_bar #logo{padding: '+(value.length ? value : '15')+'px 0px;}</style>');
}else if($editrow.hasClass('themeoption logo-vertical-align')){
// logo vertical align
$content.find('body').removeClass('logo-valign-top logo-valign-bottom');
if( value.length ) $content.find('body').addClass('logo-valign-'+value);
}else if($editrow.hasClass('themeoption button-style')){
// logo height
$content.find('body').removeClass('button-default button-flat button-flat button-round button-stroke button-custom');
if( value.length ) { $content.find('body').addClass('button-'+value); } else{ $content.find('body').addClass('button-default'); }
}else if($editrow.hasClass('themeoption header-fw')){
// header options
$content.find('body').removeClass('header-fw header-boxed');
$editrow.find('ul li input').each(function() {
if( $(this).is(':checked') ){
if( $(this).val() == 'full-width' ){
$content.find('body').addClass('header-fw');
}else{
$content.find('body').addClass( $(this).val() );
}
}
});
}else if($editrow.hasClass('themeoption logo-advanced')){
// logo advanced
$content.find('body').removeClass('logo-no-margin logo-overflow logo-no-sticky-padding logo-sticky-width-auto');
$editrow.find('ul li input').each(function() {
if( $(this).is(':checked') ){
$content.find('body').addClass( 'logo-'+$(this).val() );
}
});
}else if($editrow.hasClass('themeoption transparent')){
$content.find('body').removeClass('tr-header tr-menu tr-content tr-footer');
$editrow.find('ul li input').each(function() {
if( $(this).is(':checked') ){
$content.find('body').addClass('tr-'+$(this).val());
}
});
}else if($editrow.hasClass('themeoption menu-options')){
// menu options
$content.find('body').removeClass('menuo-right menuo-arrows menuo-no-borders menuo-sub-active menuo-last');
$editrow.find('ul li input').each(function() {
if( $(this).is(':checked') ){
if( $(this).val() == 'align-right' ){
$content.find('body').addClass('menuo-right');
}else if( $(this).val() == 'menu-arrows' ){
$content.find('body').addClass('menuo-arrows');
}else if( $(this).val() == 'hide-borders' ){
$content.find('body').addClass('menuo-no-borders');
}else if( $(this).val() == 'submenu-active' ){
$content.find('body').addClass('menuo-sub-active');
}else if( $(this).val() == 'last' ){
$content.find('body').addClass('menuo-last');
}
}
});
}else if($editrow.hasClass('themeoption sticky-header-style')){
// themeoption sticky header style
$content.find('body').removeClass('sticky-tb-color sticky-white sticky-dark');
$content.find('body').addClass('sticky-'+value);
}else if($editrow.hasClass('themeoption subheader-style')){
// themeoption sticky header style
$content.find('body').removeClass('subheader-title-left subheader-both-center subheader-both-left subheader-both-right subheader-title-right');
if( value.length ) { $content.find('body').addClass('subheader-'+value); }else{ $content.find('body').addClass('subheader-title-left'); }
}else if($editrow.hasClass('themeoption subheader-padding')){
// themeoption subheader padding
if( $content.find('style#themeoptionsubheader-padding').length ) $content.find('style#themeoptionsubheader-padding').remove();
$content.find('body').append('<style id="themeoptionsubheader-padding">#Subheader{padding: '+( value.length ? value : '60px 0 45px' )+' }</style>');
}else if($editrow.hasClass('themeoption subheader-title-tag')){
// themeoption title tag
if( $content.find('#Subheader .title').length ){
$content.find('#Subheader .title').replaceWith('<'+value+' class="title">'+$content.find('#Subheader .title').html()+'</'+value+'>');
}
}else if($editrow.hasClass('themeoption shop-align')){
// themeoption shop txt align
$content.find('.woocommerce ul.products li.product').removeClass('align-left align-right align-center');
$content.find('.woocommerce ul.products li.product').addClass('align-'+(value.length ? value : 'center'));
}else if($editrow.hasClass('themeoption shop-title-tag')){
// themeoption title tag
if( $content.find('.woocommerce ul.products li.product .desc .mfn-woo-product-title').length ){
$content.find('.woocommerce ul.products li.product .desc .mfn-woo-product-title').each(function() {
$(this).replaceWith('<'+(value.length ? value : 'h4')+' class="mfn-woo-product-title">'+$(this).html()+'</'+(value.length ? value : 'h4')+'>');
});
}
}else if($editrow.hasClass('themeoption related-style')){
// themeoption related posts
if( !$content.find('.section-related-adjustment').length ) return;
$content.find('.section-related-adjustment').removeClass('simple');
if( value.length ) $content.find('.section-related-adjustment').addClass('simple');
}else if($editrow.hasClass('themeoption subheader-title-tag')){
// themeoption title tag
if( $content.find('#Intro .intro-title').length ){
$content.find('#Intro .intro-title').replaceWith('<'+value+' class="intro-title">'+$content.find('#Intro .intro-title').html()+'</'+value+'>');
}
}else if($editrow.hasClass('themeoption blog-title-tag')){
// themeoption title tag blog
if( $content.find('.post-item .entry-title').length ){
$content.find('.post-item .entry-title').each(function() {
$(this).replaceWith('<h'+value+' class="entry-title">'+$(this).html()+'</h'+value+'>');
});
}
}else if($editrow.hasClass('themeoption sidebar-width')){
// themeoption sidebar width
if( $content.find('style#themeoptionsidebar-width').length ) $content.find('style#themeoptionsidebar-width').remove();
$content.find('body').append('<style id="themeoptionsidebar-width">.with_aside .sidebar.columns{width: '+( value.length ? value+'%' : '23%' )+' }.with_aside .sections_group{width:'+( value.length ? (100-value)+'%' : '75%' )+'}</style>');
}else if($editrow.hasClass('themeoption sidebar-style')){
// themeoption sidebar style
if( !$content.find('.sidebar').length ) return;
$content.find('.sidebar').removeClass('style-simple style-classic');
if( value.length ) $content.find('.sidebar').addClass('style-'+value);
}else if($editrow.hasClass('themeoption sidebar-lines')){
// themeoption sidebar style
if( !$content.find('.sidebar').length ) return;
$content.find('.sidebar').removeClass('lines-hidden lines-boxed has-lines');
if( value.length && value == 'lines-hidden'){
$content.find('.sidebar').addClass('lines-hidden')
}else{
if(value == 'lines-boxed') $content.find('.sidebar').addClass('lines-boxed');
$content.find('.sidebar').addClass('has-lines')
}
}else if($editrow.hasClass('themeoption footer-align')){
// themeoption footer text align
if( !$content.find('#Footer .widgets_wrapper').length ) return;
$content.find('#Footer .widgets_wrapper').removeClass('center');
if( value.length && value == 'center' ) $content.find('#Footer .widgets_wrapper').addClass('center');
}else if($editrow.hasClass('themeoption mobile-header-height')){
// themeoption mobile header height
if( $content.find('style#themeoptionmobile-header-height').length ) $content.find('style#themeoptionmobile-header-height').remove();
$content.find('body').append('<style id="themeoptionmobile-header-height">@media only screen and (max-width: 767px){body:not(.template-slider) #Header{min-height: '+( value.length ? value+'px' : ( $('.panel-view-themeoptions .themeoption.header-height .mfn-field-value').val().length ? $('.panel-view-themeoptions .themeoption.header-height .mfn-field-value').val()+'px' : '250px' ) )+' }}</style>');
}else if($editrow.hasClass('themeoption mobile-header-height')){
// themeoption mobile header height
if( $content.find('style#themeoptionmobile-header-height').length ) $content.find('style#themeoptionmobile-header-height').remove();
$content.find('body').append('<style id="themeoptionmobile-header-height">@media only screen and (max-width: 767px){body:not(.template-slider) #Header{min-height: '+( value.length ? value+'px' : ( $('.panel-view-themeoptions .themeoption.header-height .mfn-field-value').val().length ? $('.panel-view-themeoptions .themeoption.header-height .mfn-field-value').val()+'px' : '250px' ) )+' }}</style>');
}else if($editrow.hasClass('themeoption mobile-subheader-padding')){
// themeoption mobile header subheader padding
if( $content.find('style#themeoptionmobile-subheader-padding').length ) $content.find('style#themeoptionmobile-subheader-padding').remove();
$content.find('body').append('<style id="themeoptionmobile-subheader-padding">@media only screen and (max-width: 767px){body:not(.template-slider) #Subheader{padding: '+( value.length ? value+'px' : ( $('.panel-view-themeoptions .themeoption.subheader-padding .mfn-field-value').val().length ? $('.panel-view-themeoptions .themeoption.header-height .mfn-field-value').val() : '30px 0' ) )+' }}</style>');
}else if( $editrow.hasClass('themeoption layout-boxed-padding') ){
// themeoption boxed layout padding
if( $content.find('style#themeoptionlayout-boxed-padding').length ) $content.find('style#themeoptionlayout-boxed-padding').remove();
$content.find('body').append('<style id="themeoptionlayout-boxed-padding">@media only screen and (min-width: 768px){.layout-boxed #Subheader .container, .layout-boxed:not(.with_aside) .section:not(.full-width), .layout-boxed.with_aside .content_wrapper, .layout-boxed #Footer .container{padding-left: '+( value.length ? value : '0' )+';padding-right: '+( value.length ? value : '0' )+'}}</style>');
}else if( $editrow.hasClass('themeoption content-remove-padding') ){
// themeoption content top padding
if( $content.find('style#themeoptioncontent-remove-padding').length ) $content.find('style#themeoptioncontent-remove-padding').remove();
$content.find('body').append('<style id="themeoptioncontent-remove-padding">#Content{padding-top: '+( value.length && value == '1' ? '0px' : '30px' )+';}</style>');
}else if($editrow.hasClass('themeoption layout-options')){
// menu options
$content.find('body').removeClass('no-shadows boxed-no-margin');
$editrow.find('ul li input').each(function() {
if( $(this).is(':checked') ){
$content.find('body').addClass($(this).val());
}
});
}else if($editrow.hasClass('themeoption sticky-header-style')){
// theme option sticky header style
$content.find('body').removeClass('sticky-tb-color sticky-white sticky-dark');
$content.find('body').addClass('sticky-'+value);
}else if($editrow.hasClass('themeoption shop-icon-wishlist')){
// theme option icon wishlist shop
if( value == '' ){
$content.find('a#wishlist_button').html('<svg width="26" viewBox="0 0 26 26" aria-label="wishlist icon"><defs><style>.path{fill:none;stroke:#333;stroke-width:1.5px;}</style></defs><path class="path" d="M16.7,6a3.78,3.78,0,0,0-2.3.8A5.26,5.26,0,0,0,13,8.5a5,5,0,0,0-1.4-1.6A3.52,3.52,0,0,0,9.3,6a4.33,4.33,0,0,0-4.2,4.6c0,2.8,2.3,4.7,5.7,7.7.6.5,1.2,1.1,1.9,1.7H13a.37.37,0,0,0,.3-.1c.7-.6,1.3-1.2,1.9-1.7,3.4-2.9,5.7-4.8,5.7-7.7A4.3,4.3,0,0,0,16.7,6Z"></path></svg>');
}else{
$content.find('a#wishlist_button').html('<i class="'+value+'"></i>');
}
}else if($editrow.hasClass('themeoption shop-cart')){
// theme option icon cart shop
$content.find('a.header-cart svg').remove();
$content.find('a.header-cart i').remove();
if( value == '' ){
$content.find('a.header-cart').prepend('<svg width="26" viewBox="0 0 26 26" aria-label="cart icon"><defs><style>.path{fill:none;stroke:#333;stroke-miterlimit:10;stroke-width:1.5px;}</style></defs><polygon class="path" points="20.4 20.4 5.6 20.4 6.83 10.53 19.17 10.53 20.4 20.4"></polygon><path class="path" d="M9.3,10.53V9.3a3.7,3.7,0,1,1,7.4,0v1.23"></path></svg>');
}else{
$content.find('a.header-cart').prepend('<i class="'+value+'"></i>');
}
}else if($editrow.hasClass('themeoption gdpr')){
if( value.length && value == '1' ){
if( !$content.find('#mfn-gdpr').length ) $content.find('body').append(renderMfnFields.gdpr);
if( !$content.find('#mfn-gdpr').hasClass('show') ) $content.find('#mfn-gdpr').addClass('show');
}else{
$content.find('#mfn-gdpr').removeClass('show');
}
}else if( $editrow.hasClass('themeoption gdpr-settings-position') ){
if( value == 'top' ){
$content.find('#mfn-gdpr').attr('data-aligment', 'top').attr('data-direction', 'horizontal');
}else if( value == 'bottom' ){
$content.find('#mfn-gdpr').attr('data-aligment', 'bottom').attr('data-direction', 'horizontal');
}else if( value == 'left' ){
$content.find('#mfn-gdpr').attr('data-aligment', 'left').attr('data-direction', 'vertical');
}else if( value == 'right' ){
$content.find('#mfn-gdpr').attr('data-aligment', 'right').attr('data-direction', 'vertical');
}
}else if( $editrow.hasClass('to-inline-style') ){
//console.log('test 2');
let std = typeof $editrow.attr('data-std') !== 'undefined' ? $editrow.attr('data-std') : $(this).attr('data-std');
let csspath = $editrow.attr('data-csspath');
let resp = $editrow.attr('data-responsive');
let mediaq = '';
let unit = typeof $editrow.attr('data-unit') !== 'undefined' ? $editrow.attr('data-unit') : $(this).attr('data-unit');
let style = typeof $editrow.attr('data-style') !== 'undefined' ? $editrow.attr('data-style') : $(this).attr('data-style');
let style_id = 'themeoption'; if( typeof $editrow.attr('data-name') !== 'undefined' ) style_id += $editrow.attr('data-name'); if( typeof $(this).attr('data-key') !== 'undefined' ) style_id += $(this).attr('data-key');
if( $editrow.find('.color-picker.multi').length && typeof $(this).attr('data-key') !== 'undefined' && $(this).attr('data-key') == 'hover' ){
csspath = csspath.replaceAll(', ', ',').replaceAll(',', ':hover,')+':hover';
}
if( $editrow.hasClass('button-font') ) {
style = $(this).attr('data-style');
unit = $(this).attr('data-unit');
}
if( $editrow.find('.multiple-inputs.separated-fields').length ){
value = '';
$editrow.find('.multiple-inputs input.mfn-field-value').each(function(i) {
var units_check = false;
var val = $(this).val();
if( i > 0 ) value += ' ';
if( val.length ){
$.each( units, function( i, el ) {
if( val.includes(el) ){
units_check = true;
}
});
if(units_check == false){
value += val+unit;
$(this).val(val+unit);
}else{
value += val;
}
}
});
}
if( $content.find('style#'+style_id).length ) $content.find('style#'+style_id).remove();
if( value.length ) {
var units_check = false;
$.each( units, function( i, el ) {
if( value.includes(el) ){
units_check = true;
}
});
if(units_check == false){
value += unit;
}
}else if( std.length ){
value = std;
}
if( resp == 'laptop' ) mediaq = '@media only screen and (max-width: 1200px) {';
if( resp == 'tablet' ) mediaq = '@media only screen and (max-width: 959px) {';
if( resp == 'mobile' ) mediaq = '@media only screen and (max-width: 767px) {';
if( resp == 'desktop' ){
$content.find('head').append('<style id="'+style_id+'">'+csspath+'{'+style+': '+( value.length ? value : 'inherit' )+';}</style>');
}else if( resp == 'tablet' ){
$content.find('body').prepend('<style id="'+style_id+'">'+mediaq+csspath+'{'+style+': '+( value.length ? value : 'inherit' )+';}}</style>');
}else if( resp == 'laptop' ){
$content.find('body').prepend('<style id="'+style_id+'">'+mediaq+csspath+'{'+style+': '+( value.length ? value : 'inherit' )+';}}</style>');
}else{
$content.find('body').append('<style id="'+style_id+'">'+mediaq+csspath+'{'+style+': '+( value.length ? value : 'inherit' )+';}}</style>');
}
if( style == 'font-family' && value.length ){
var fonts_group = $(this).find(':selected').closest('optgroup').attr('label');
if( fonts_group == 'Google Fonts' ){
WebFont.load({
google: {
families: [value]
},
context: window.frames[0].frameElement.contentWindow,
/*fontactive: function(familyName,fvd){
self.handleTypoChange( style_attr, familyName );
return;
},*/
});
}
}
}
if( mfn.view == 'demo' ) return;
$.ajax( mfnajaxurl, {
type : "POST",
data : {
'mfn-builder-nonce': wpnonce,
action: 'mfn_vb_themeoptions',
betheme: edited_item
},
success: function(response){
// re render content for few options
if($editrow.hasClass('re_render_to themeoption')) {
// check if element is in iframe
if( $editrow.hasClass('re_render_if') ) {
var re_type = $editrow.attr('data-retype');
var re_elem = $editrow.attr('data-reelement');
if( re_type == 'div' && !$content.find(re_elem).length ) {
return;
}
if( typeof window.onbeforeunload !== 'function' ) {
refreshIframe();
return;
}else{
if( to_been_aborted != false ) return;
$('.mfn-ui').addClass('mfn-modal-open').append('<div class="mfn-modal modal-confirm show"> <div class="mfn-modalbox mfn-form mfn-shadow-1"> <div class="modalbox-header"> <div class="options-group"> <div class="modalbox-title-group"> <span class="modalbox-icon mfn-icon-delete"></span> <div class="modalbox-desc"> <h4 class="modalbox-title">Confirm preview</h4> </div></div></div><div class="options-group"> <a class="mfn-option-btn mfn-option-blank btn-large btn-modal-close btn-modal-abort" title="Close" href="#"><span class="mfn-icon mfn-icon-close"></span></a> </div></div><div class="modalbox-content"> <img class="icon" alt="" src="'+mfn.themepath+'/muffin-options/svg/warning.svg"> <h3>Confirm preview</h3> <p>Unsaved changes. Continue?</p><a class="mfn-btn btn-modal-abort" href="#"><span class="btn-wrapper">Let me save first</span></a> <a class="mfn-btn mfn-btn-red btn-wide btn-modal-confirm" href="#"><span class="btn-wrapper">Refresh</span></a> </div></div></div>');
$('.btn-modal-abort').on('click', function(e) {
e.preventDefault();
$('.mfn-ui').removeClass('mfn-modal-open');
$('.modal-confirm.show').remove();
to_been_aborted = true;
});
$('.btn-modal-confirm').on('click', function(e) {
e.preventDefault();
refresh = true;
$('.modal-confirm.show').remove();
$('body').addClass('mfn-preloader-active');
$('.mfn-preloader').fadeIn(300);
$('.mfn-preloader .loading-text').text('Please wait...');
scroll_top = $content.find("html, body").scrollTop();
refreshIframe();
return;
});
}
}
}else{
$content.find('body').removeClass('mfn-loading');
}
}
});
});
function refreshIframe(){
$content = false;
$builder = false;
iframe = false;
document.getElementById('mfn-preview-wrapper').innerHTML = '<iframe id="mfn-vb-ifr" src="'+mfn.permalink+'" allowfullscreen="1"></iframe>';
jQuery('iframe#mfn-vb-ifr').on('load', function() {
$content = jQuery("iframe#mfn-vb-ifr").contents();
$builder = $content.find('.mfn-default-content-buider');
iframe = document.getElementById("mfn-vb-ifr").contentWindow;
iframeReady();
$('body').removeClass('mfn-preloader-active');
$('.mfn-preloader').hide();
$content.find("html, body").scrollTop(scroll_top);
//initWyswig();
});
}
/**
*
* NEW ACM end
*
**/
mfnoptsinputs.watchChanges();
return {
init: init,
addHistory: historyStorage.add,
wpnonce: wpnonce,
re_render: re_render,
dynamicData:dynamicData,
settings: settings,
changeInlineStyles: changeInlineStyles,
enableBeforeUnload: enableBeforeUnload
};
})(jQuery);
MfnVbApp.settings.detectOsTheme();
function loadIframe() {
if(mfn.permalink == 'mfn_update_db_required') {
document.getElementById('mfn-preview-wrapper-holder').innerHTML = '<div class="mfn-bebuilder-iframe-error"><h3>BeBuilder Data Updater</h3><p>Click the button to start the update. <br><strong>Important!</strong> Create a backup of database before starting.</p><a href="#" class="button button-primary mfn-btn-blue mfn-btn mfn-be-css-db-update-action-button">Update Database</a></div>';
console.error('BeBuilder: Database update required.');
jQuery('body').removeClass('mfn-preloader-active');
}else if(mfn.permalink == 'shop_page_id') {
document.getElementById('mfn-preview-wrapper-holder').innerHTML = '<div class="mfn-bebuilder-iframe-error">Make sure SHOP page is not in DRAFT mode and set in <a href="admin.php?page=wc-settings&tab=products">WooCommerce settings</a>.</div>';
console.error('BeBuilder: Set shop page in Woocommerce settings to build shop template.');
jQuery('body').removeClass('mfn-preloader-active');
}else if( mfn.permalink == 'portfolio_post_type_missing' ) {
document.getElementById('mfn-preview-wrapper-holder').innerHTML = '<div class="mfn-bebuilder-iframe-error">Please enable portfolio post type in <a href="admin.php?page=be-options#advanced">theme settings</a>.</div>';
jQuery('body').removeClass('mfn-preloader-active');
}else if( mfn.permalink == 'shop_order_missing' ) {
document.getElementById('mfn-preview-wrapper-holder').innerHTML = '<div class="mfn-bebuilder-iframe-error">To edit Thank You template, at least one <a href="edit.php?post_type=shop_order">completed order</a> is required.</div>';
jQuery('body').removeClass('mfn-preloader-active');
}else{
document.getElementById('mfn-preview-wrapper').innerHTML = '<iframe id="mfn-vb-ifr" src="'+mfn.permalink+'" allowfullscreen="1"></iframe>';
jQuery('iframe#mfn-vb-ifr').on('load', function() {
$content = jQuery("iframe#mfn-vb-ifr").contents();
$builder = $content.find('.mfn-default-content-buider');
iframe = document.getElementById("mfn-vb-ifr").contentWindow;
//Templates!
if( jQuery('body').hasClass('mfn-template-section') ) {
jQuery(this).contents().find('body').addClass('mfn-template-section')
} else if( jQuery('body').hasClass('mfn-template-wrap') ) {
jQuery(this).contents().find('body').addClass('mfn-template-wrap')
}
MfnVbApp.init();
//Global wraps
if( jQuery('body').hasClass('mfn-template-wrap') && $content.find('.mfn-section-start').length ) {
const sectionButton = $content.find('#Content').find('.mfn-builder-content').find('a.mfn-btn.mfn-section-add');
sectionButton.trigger('click');
setTimeout(function(){
const wrapButton = $content.find('#Content').find('.mfn-builder-content').find('.wrap-11');
wrapButton.trigger('click');
}, 1000);
}
});
}
}
(function($) {
$(document).ready(function() {
$('.mfn-preloader .loading-text').fadeOut(function() {
$('.mfn-preloader .loading-text').html('Loading page content <div class="dots"></div>');
}).fadeIn();
loadIframe();
});
}(jQuery));
/**
* Clone fix
* Fixed native clone function for textarea and select fields
*/
(function(original) {
jQuery.fn.clone = function() {
var result = original.apply(this, arguments),
my_textareas = this.find('textarea:not(.editor), select'),
result_textareas = result.find('textarea:not(.editor), select');
for (var i = 0, l = my_textareas.length; i < l; ++i) {
jQuery(result_textareas[i]).val(jQuery(my_textareas[i]).val());
}
return result;
};
})(jQuery.fn.clone);