662 lines
20 KiB
JavaScript
662 lines
20 KiB
JavaScript
/* globals layoutBuilder */
|
|
/* eslint no-empty-function: ["error", { "allow": ["functions"] }] */
|
|
|
|
var FusionPageBuilder = FusionPageBuilder || {};
|
|
|
|
( function() {
|
|
|
|
// Layout Options View
|
|
FusionPageBuilder.LayoutOptionsView = Backbone.View.extend( {
|
|
template: FusionPageBuilder.template( jQuery( '#fusion-layout-options' ).html() ),
|
|
events: {
|
|
'click .close,.fusion-layout-overlay': 'closeModal',
|
|
'change input[type="checkbox"]': 'inputChange',
|
|
'click .layout-option-type,.layout-mode a': 'switchTab',
|
|
'click .layout-option-parent:not(.active) .load-child': 'showChildOptions',
|
|
'click .layout-option-parent.active .load-child': 'hideChildOptions',
|
|
'click .load-more': '_loadMore',
|
|
'input .layoutbox-search input[type="search"]': '_handleSearchInput',
|
|
'keyup .layoutbox-search input[type="search"]': '_handleSearchInput',
|
|
'click .remove-condition': 'removeCondition',
|
|
'click .cancel-condition,.confirm-condition': 'handleConfirmation'
|
|
},
|
|
|
|
templateForChildOption: FusionPageBuilder.template( jQuery( '#fusion-layout-child-option' ).html() ),
|
|
|
|
/**
|
|
* Initialize the layout
|
|
*
|
|
* @since 2.0.0
|
|
* @return {void}
|
|
*/
|
|
initialize: function() {
|
|
this.handleSearchInput = _.debounce( this.handleSearchInput, 300 );
|
|
|
|
this.saveLayout = _.debounce( this.saveLayout, 500 );
|
|
|
|
this.loadMore = _.debounce( this.loadMore, 300 );
|
|
|
|
},
|
|
|
|
/**
|
|
* Calls loadMore() so it can debounce correctly
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
_loadMore: function( event ) {
|
|
this.loadMore( event );
|
|
},
|
|
|
|
/**
|
|
* Calls handleSearchInput() so it can debounce correctly
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
_handleSearchInput: function( event ) {
|
|
this.handleSearchInput( event );
|
|
},
|
|
|
|
/**
|
|
* Removes condition from Manage Conditions section.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
removeCondition: function( event ) {
|
|
var conditions = this.model.getConditions(),
|
|
$parent = jQuery( event.target ).parent(),
|
|
id = $parent.data( 'condition-id' ),
|
|
condition = conditions[ id ];
|
|
|
|
event.preventDefault();
|
|
|
|
// Uncheck current condition box
|
|
this.getConditionCheckbox( id ).prop( 'checked', false );
|
|
// If it's a child condition remove it from preview
|
|
if ( condition.parent ) {
|
|
this.$el.find( 'li[data-condition-id="' + id + '"]' ).remove();
|
|
}
|
|
this.model.unregisterCondition( id, condition.mode );
|
|
delete conditions[ id ];
|
|
// Remove condition from Manage Conditions section
|
|
$parent.remove();
|
|
// Trigger autosave
|
|
this.saveLayout();
|
|
|
|
this.updateConditionsSectionsVisibility();
|
|
|
|
// Render layout box conditions sections.
|
|
this.renderLayoutBoxConditionsSection( this.model );
|
|
},
|
|
|
|
/**
|
|
* Hide or show Manage Conditions parts.
|
|
*
|
|
* @since 2.2
|
|
* @return {void}
|
|
*/
|
|
updateConditionsSectionsVisibility: function() {
|
|
var $includeConditions = this.$el.find( '.include .layout-conditions' ),
|
|
$excludeConditions = this.$el.find( '.exclude .layout-conditions' ),
|
|
hasIncludeConditions = Boolean( $includeConditions.find( 'span' ).length ),
|
|
hasExcludeConditions = Boolean( $excludeConditions.find( 'span' ).length );
|
|
// If there are include or exclude conditions we show the corresponding section
|
|
// If there are no conditions we show empty conditions placeholder
|
|
if ( hasIncludeConditions ) {
|
|
$includeConditions.parent().show();
|
|
} else {
|
|
$includeConditions.parent().hide();
|
|
}
|
|
if ( hasExcludeConditions ) {
|
|
$excludeConditions.parent().show();
|
|
} else {
|
|
$excludeConditions.parent().hide();
|
|
}
|
|
if ( hasIncludeConditions || hasExcludeConditions ) {
|
|
this.$el.find( '.empty-conditions' ).hide();
|
|
} else {
|
|
this.$el.find( '.empty-conditions' ).show();
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Render the template.
|
|
*
|
|
* @since 2.2
|
|
* @return {Object} this.
|
|
*/
|
|
render: function() {
|
|
var self = this,
|
|
conditions = this.model.getConditions();
|
|
|
|
this.$el.html( this.template( this ) );
|
|
|
|
// Update checkboxes state
|
|
this.$el.find( 'input[type="checkbox"]' ).each( function() {
|
|
if ( this.value in conditions && this.dataset.mode === conditions[ this.value ].mode ) {
|
|
this.checked = true;
|
|
}
|
|
} );
|
|
|
|
// Update previews and update checkboxes that were previously selected.
|
|
_.each( this.model.getConditions(), function( condition, id ) {
|
|
if ( condition.parent ) {
|
|
self.$el.find( '.layout-option-parent[data-condition="' + condition.parent + '"] + .child-options-preview' )
|
|
.append(
|
|
'<li data-condition-id="' + id + '" class="preview-' + condition.mode + '">' + condition.label + '</li>'
|
|
);
|
|
}
|
|
self.getConditionCheckbox( id ).prop( 'checked', true );
|
|
} );
|
|
|
|
this.renderConditionsSection();
|
|
|
|
// Add listener for escape key to close modal.
|
|
jQuery( 'body' ).on( 'keydown', function( event ) {
|
|
if ( 27 === event.keyCode || '27' === event.keyCode ) {
|
|
jQuery( 'body' ).off( 'keydown' );
|
|
self.remove( event );
|
|
return false;
|
|
}
|
|
return true;
|
|
} );
|
|
|
|
return this;
|
|
},
|
|
|
|
/**
|
|
* Returns a DOM element for condition checkbox
|
|
*
|
|
* @since 2.2
|
|
* @param {String} id - Condition id.
|
|
* @return {Object} this.
|
|
*/
|
|
getConditionCheckbox: function( id ) {
|
|
var condition = this.model.getConditions()[ id ];
|
|
if ( condition.parent ) {
|
|
return this.$el.find( '#' + id.replace( '|', '\\|' ) + '-' + condition.mode );
|
|
}
|
|
return this.$el.find( '#' + id + '-' + condition.mode );
|
|
},
|
|
|
|
/**
|
|
* Loads child options.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {Object} this.
|
|
*/
|
|
showChildOptions: function( event ) {
|
|
var $target = jQuery( event.currentTarget ),
|
|
$parent = $target.parent();
|
|
|
|
event.preventDefault();
|
|
|
|
$target.find( 'i' ).addClass( 'fusiona-chevron-small-up' );
|
|
|
|
// Hide Preview
|
|
$parent.siblings( '.child-options-preview' ).hide();
|
|
$parent.addClass( 'active' );
|
|
},
|
|
|
|
/**
|
|
* Hide child options.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {Object} this.
|
|
*/
|
|
hideChildOptions: function( event ) {
|
|
var $input = jQuery( event.currentTarget ),
|
|
$parent = $input.parent(),
|
|
$preview = $parent.siblings( '.child-options-preview' );
|
|
|
|
event.preventDefault();
|
|
$input.find( 'i' ).removeClass( 'fusiona-chevron-small-up' );
|
|
$parent.removeClass( 'active loading' );
|
|
|
|
|
|
// Update and show child previews
|
|
$preview.html( '' );
|
|
_.each( this.model.getConditions(), function( condition, id ) { //eslint-disable-line no-unused-vars
|
|
if ( condition.parent === $parent.data( 'condition' ) ) {
|
|
$preview.append(
|
|
'<li data-condition-id="' + id + '" class="preview-' + condition.mode + '">' + condition.label + '</li>'
|
|
);
|
|
}
|
|
} );
|
|
$preview.show();
|
|
},
|
|
|
|
/**
|
|
* Fetches child options for specific parent.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} $parent - The layout option parent Element.
|
|
* @return {void}
|
|
*/
|
|
loadChildOptions: function( $parent ) {
|
|
var self = this,
|
|
page = $parent.data( 'page' ),
|
|
parentCondition = $parent.data( 'condition' );
|
|
|
|
page = page ? parseInt( page ) + 1 : 1;
|
|
|
|
this.model.doAjax( {
|
|
action: 'fusion_admin_layout_options',
|
|
parent: parentCondition,
|
|
page: page,
|
|
security: jQuery( '.fusion-template-builder #_wpnonce' ).val()
|
|
}, function( response ) {
|
|
if ( response.success ) {
|
|
self.renderChildOptions( $parent, page, response.data );
|
|
}
|
|
} );
|
|
},
|
|
|
|
/**
|
|
* Renders child options for specific parent.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} $parent
|
|
* @param {Number} page
|
|
* @param {Array} options
|
|
* @return {void}
|
|
*/
|
|
renderChildOptions: function( $parent, page, options ) {
|
|
var self = this,
|
|
container = $parent.find( '.child-options' ),
|
|
conditions = this.model.getConditions();
|
|
|
|
_.each( options, function( option ) {
|
|
option.checked = conditions[ option.id ] && conditions[ option.id ].mode;
|
|
container.append( self.templateForChildOption( option ) );
|
|
} );
|
|
|
|
$parent.removeClass( 'loading' );
|
|
// Update results page
|
|
$parent.data( 'page', page );
|
|
|
|
// If less than 10 results change button label and disable button
|
|
// else show button and enable it again
|
|
if ( 10 > options.length ) {
|
|
$parent.find( '.load-more' ).addClass( 'disabled' );
|
|
$parent.find( '.load-more span' ).text( $parent.find( '.load-more' ).data( 'empty' ) );
|
|
} else {
|
|
$parent.find( '.load-more' ).show().prop( 'disabled', false ).removeClass( 'loading' );
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Handler for load more button.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
loadMore: function( event ) {
|
|
var $parent = jQuery( event.target ).closest( '.layout-option-parent' );
|
|
jQuery( event.currentTarget ).addClass( 'loading' ).prop( 'disabled', true );
|
|
this.loadChildOptions( $parent );
|
|
},
|
|
|
|
/**
|
|
* Fetches child options for specific parent.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
inputChange: function( event ) {
|
|
var conditions = this.model.getConditions(),
|
|
input = event.target,
|
|
conditionId = input.name,
|
|
conditionMode = input.value,
|
|
confirmation = jQuery( input ).parent().data( 'confirmation' );
|
|
|
|
// If condition is already selected in other view show input confirmation
|
|
if ( this.model.getConditionLayout( conditionId, conditionMode ) && this.model.getConditionLayout( conditionId, conditionMode ) !== this.model.cid ) {
|
|
input.checked = false;
|
|
|
|
return this.showInputConfirmation( input.parentElement, conditionId, {
|
|
label: event.target.dataset.label,
|
|
type: input.dataset.type,
|
|
mode: conditionMode,
|
|
[ input.dataset.type ]: conditionId,
|
|
parent: input.dataset.parent
|
|
} );
|
|
}
|
|
|
|
// If element has active confirmation, remove it
|
|
if ( confirmation ) {
|
|
jQuery( input ).parent().data( 'confirmation', null ).removeClass( 'show-confirmation' );
|
|
confirmation.$el.remove();
|
|
}
|
|
|
|
// If the user is selecting the same condition perform a deselect
|
|
// Else if is selecting same condition but the mode is different perform a toggle
|
|
// Else were adding a new condition
|
|
if ( conditions[ conditionId ] && conditions[ conditionId ].mode === conditionMode ) {
|
|
jQuery( input ).prop( 'checked', false );
|
|
this.updateParent( input, conditionId );
|
|
this.model.unregisterCondition( conditionId, conditionMode );
|
|
delete conditions[ conditionId ];
|
|
} else if ( conditions[ conditionId ] ) {
|
|
this.model.unregisterCondition( conditionId, conditions[ conditionId ].mode );
|
|
jQuery( input ).siblings( 'input' ).prop( 'checked', false );
|
|
conditions[ conditionId ].mode = conditionMode;
|
|
this.model.registerCondition( conditionId, conditionMode );
|
|
this.updateParent( input, conditionId );
|
|
} else {
|
|
conditions[ conditionId ] = {
|
|
label: input.dataset.label,
|
|
slug: input.dataset.slug,
|
|
type: input.dataset.type,
|
|
mode: conditionMode,
|
|
[ input.dataset.type ]: conditionId,
|
|
parent: input.dataset.parent
|
|
};
|
|
this.model.registerCondition( conditionId, conditionMode );
|
|
this.updateParent( input, conditionId );
|
|
}
|
|
|
|
// Trigger autosave
|
|
this.saveLayout();
|
|
|
|
this.renderConditionsSection();
|
|
this.renderLayoutBoxConditionsSection( this.model );
|
|
},
|
|
|
|
/**
|
|
* Updates parent options if options selected from search results
|
|
* @since 3.1.1
|
|
* @param input
|
|
* @param conditionId
|
|
*/
|
|
updateParent: function( input, conditionId ) {
|
|
// If checkbox is from search results update child option if exist
|
|
if ( jQuery( input ).closest( '.layoutbox-search-results' ).length ) {
|
|
this.getConditionCheckbox( conditionId ).each( function() {
|
|
var checkbox = jQuery( this );
|
|
var status = jQuery( input ).prop( 'checked' );
|
|
if ( ! checkbox.is( input ) ) {
|
|
checkbox.siblings( 'input' ).prop( 'checked', false );
|
|
checkbox.prop( 'checked', status );
|
|
}
|
|
} );
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Saves current layout content via ajax.
|
|
* Can also handle multiple layout saving via layouts prop.
|
|
* @since 2.2
|
|
* @param {Object} layouts - Multiple layouts to be saved.
|
|
* @return {void}
|
|
*/
|
|
saveLayout: function( layouts ) {
|
|
var self = this,
|
|
data = {
|
|
action: 'fusion_admin_layout_update',
|
|
security: jQuery( '.fusion-template-builder #_wpnonce' ).val()
|
|
};
|
|
|
|
this.showLoader();
|
|
|
|
if ( layouts ) {
|
|
_.extend( data, {
|
|
action_type: 'update_layouts',
|
|
layouts: layouts
|
|
} );
|
|
} else {
|
|
_.extend( data, {
|
|
action_type: 'update_layout',
|
|
layout_id: this.model.get( 'id' ),
|
|
content: this.model.getContent()
|
|
} );
|
|
}
|
|
|
|
this.model.doAjax( data, function() {
|
|
self.hideLoader();
|
|
} );
|
|
},
|
|
|
|
/**
|
|
* Shows Saving Conditions label
|
|
*
|
|
* @since 2.2
|
|
* @return {void}
|
|
*/
|
|
showLoader: function() {
|
|
this.$el.find( '.loader' ).show();
|
|
},
|
|
|
|
/**
|
|
* Hides Saving Conditions label
|
|
*
|
|
* @since 2.2
|
|
* @return {void}
|
|
*/
|
|
hideLoader: function() {
|
|
this.$el.find( '.loader' ).hide();
|
|
},
|
|
|
|
/**
|
|
* Displays condition confirmation dialog
|
|
*
|
|
* @since 2.2
|
|
* @param {Element} container - The checkbox container
|
|
* @param {String} id - The condition id
|
|
* @param {Object} condition - The condition
|
|
* @return {void}
|
|
*/
|
|
showInputConfirmation: function( container, id, condition ) {
|
|
var $confirmation;
|
|
jQuery( container ).addClass( 'show-confirmation' );
|
|
// If confirmation already exist we refresh the id and the condition
|
|
// else we insert confirmation modal.
|
|
if ( jQuery( container ).data( 'confirmation' ) ) {
|
|
jQuery( container ).data( 'confirmation', {
|
|
id: id,
|
|
condition: condition
|
|
} );
|
|
} else {
|
|
$confirmation = jQuery( '<div class="layout-options-confirmation"><div><i class="fusiona-exclamation-sign" aria-hidden="true"></i>This condition is already assigned to another layout.You cannot use the same conditions on multiple layouts.</div><div><button class="cancel-condition">Cancel</button><button class="confirm-condition">Assign Here</button></div></div>' );
|
|
jQuery( container ).data( 'confirmation', {
|
|
id: id,
|
|
condition: condition,
|
|
$el: $confirmation
|
|
} );
|
|
jQuery( container ).append( $confirmation );
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Handle condition confirmation actions
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
handleConfirmation: function( event ) {
|
|
var self = this,
|
|
$target = jQuery( event.target ),
|
|
$parent = $target.closest( '.layout-option,.layout-child-option' ),
|
|
confirmation = $parent.data( 'confirmation' ),
|
|
layouts = {},
|
|
layoutID,
|
|
layout;
|
|
event.preventDefault();
|
|
|
|
if ( $target.hasClass( 'confirm-condition' ) ) {
|
|
// Add condition to current layout
|
|
this.model.getConditions()[ confirmation.id ] = confirmation.condition;
|
|
layouts[ this.model.get( 'id' ) ] = this.model.getContent();
|
|
// Remove condition from the other layout
|
|
layoutID = this.model.getConditionLayout( confirmation.id, confirmation.condition.mode );
|
|
layout = layoutBuilder.layouts[ layoutID ];
|
|
delete layout.getConditions()[ confirmation.id ];
|
|
layouts[ layout.get( 'id' ) ] = layout.getContent();
|
|
// Update conditions in layout box.
|
|
this.renderLayoutBoxConditionsSection( layout );
|
|
// Assign checked state to the current condition
|
|
self.getConditionCheckbox( confirmation.id ).siblings( 'input' ).prop( 'checked', false );
|
|
self.getConditionCheckbox( confirmation.id ).prop( 'checked', true );
|
|
// Register to global conditions
|
|
this.model.registerCondition( confirmation.id, confirmation.condition.mode );
|
|
// Save both layouts
|
|
this.saveLayout( layouts );
|
|
}
|
|
|
|
$parent.removeClass( 'show-confirmation' );
|
|
// Remove InputConfirmation
|
|
confirmation.$el.remove();
|
|
$parent.data( 'confirmation', null );
|
|
|
|
// Render layout box conditions sections.
|
|
this.renderLayoutBoxConditionsSection( this.model );
|
|
this.renderConditionsSection();
|
|
},
|
|
|
|
/**
|
|
* Renders conditions section
|
|
*
|
|
* @since 2.2
|
|
* @return {void}
|
|
*/
|
|
renderConditionsSection: function() {
|
|
// TODO use DiffDOM to avoid jank.
|
|
var $includeConditions = this.$el.find( '.include .layout-conditions' ),
|
|
$excludeConditions = this.$el.find( '.exclude .layout-conditions' );
|
|
|
|
$includeConditions.html( '' );
|
|
$excludeConditions.html( '' );
|
|
|
|
_.each( this.model.getConditions(), function( condition, id ) {
|
|
var $condition = jQuery( '<span data-condition-id="' + id + '">' + condition.label + '<a href="#" class="fusiona-cross remove-condition" aria-label="Remove condition" /></span>' );
|
|
if ( 'include' === condition.mode ) {
|
|
$includeConditions.append( $condition );
|
|
} else {
|
|
$excludeConditions.append( $condition );
|
|
}
|
|
} );
|
|
this.updateConditionsSectionsVisibility();
|
|
},
|
|
|
|
/**
|
|
* Handler for search input.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
handleSearchInput: function( event ) {
|
|
var self = this,
|
|
search = event.target.value,
|
|
$parent = jQuery( event.target ).closest( '.layout-option-parent' ),
|
|
conditions = this.model.getConditions();
|
|
// If search is valid do ajax.
|
|
// Else clean results and close dropdown.
|
|
if ( search ) {
|
|
// Add loader
|
|
$parent.find( '.layoutbox-search-results' )
|
|
.attr( 'data-state', 'active' )
|
|
.html( '' )
|
|
.append( '<div class="layoutbox-loader"><div class="fusion-builder-loader"></div></div>' );
|
|
|
|
this.model.doAjax( {
|
|
action: 'fusion_admin_layout_options',
|
|
parent: $parent.data( 'condition' ),
|
|
search: search,
|
|
security: jQuery( '.fusion-template-builder #_wpnonce' ).val()
|
|
}, function( response ) {
|
|
var $container, hideSearch;
|
|
if ( response.success ) {
|
|
$container = $parent.find( '.layoutbox-search-results' );
|
|
$container.html( '' );
|
|
if ( response.data.length ) {
|
|
_.each( response.data, function( result ) {
|
|
result.checked = conditions[ result.id ] && conditions[ result.id ].mode;
|
|
$container.append( self.templateForChildOption( result ) );
|
|
} );
|
|
// Hide search results when a click outside $container occurs
|
|
hideSearch = function ( e ) {
|
|
if ( ! $container.is( e.target ) && 0 === $container.has( e.target ).length ) {
|
|
$container.attr( 'data-state', '' );
|
|
jQuery( document ).off( 'mouseup', hideSearch );
|
|
}
|
|
};
|
|
jQuery( document ).on( 'mouseup', hideSearch );
|
|
} else {
|
|
$container.attr( 'data-state', '' );
|
|
}
|
|
}
|
|
} );
|
|
} else {
|
|
$parent.find( '.layoutbox-search-results' ).html( '' ).attr( 'data-state', '' );
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Switches a tab. Takes care of toggling the 'current' & 'inactive' classes
|
|
* and also changes the 'display' property of elements to properly make the switch.
|
|
*
|
|
* @since 2.2
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
switchTab: function( event ) {
|
|
var $tabLink = jQuery( event.currentTarget ),
|
|
tab = '#' + jQuery.escapeSelector( $tabLink.attr( 'href' ).replace( '#', '' ) );
|
|
|
|
if ( event ) {
|
|
event.preventDefault();
|
|
}
|
|
|
|
$tabLink.addClass( 'current' ).removeClass( 'inactive' );
|
|
$tabLink.siblings().removeClass( 'current' ).addClass( 'inactive' );
|
|
|
|
this.$el.find( tab ).siblings( '.layout-mode-tab, .layout-option-tab' ).hide();
|
|
this.$el.find( tab ).show();
|
|
},
|
|
|
|
/**
|
|
* Renders conditions section
|
|
*
|
|
* @since 2.2
|
|
* @return {void}
|
|
*/
|
|
renderLayoutBoxConditionsSection: function( layout ) {
|
|
var $layoutBox = jQuery( '.layoutbox.fusion-layout[data-id="' + layout.get( 'id' ) + '"]' ).find( 'ul.fusion-condtions' ),
|
|
conditions = layout.getConditions();
|
|
|
|
$layoutBox.find( '.include, .exclude' ).remove();
|
|
$layoutBox.closest( '.fusion-condition-control' ).removeClass( 'has-conditions' );
|
|
|
|
if ( 'object' === typeof conditions && 0 < Object.keys( conditions ).length ) {
|
|
$layoutBox.closest( '.fusion-condition-control' ).addClass( 'has-conditions' );
|
|
_.each( conditions, function( condition ) {
|
|
var $condition = jQuery( '<li class="' + condition.mode + '"><span>' + condition.label + '</span></li>' );
|
|
$layoutBox.append( $condition );
|
|
} );
|
|
}
|
|
},
|
|
|
|
/**
|
|
* Close layout options modal.
|
|
*
|
|
* @since 3.3
|
|
* @param {Object} event - The event.
|
|
* @return {void}
|
|
*/
|
|
closeModal: function( event ) {
|
|
event.preventDefault();
|
|
this.remove();
|
|
}
|
|
} );
|
|
|
|
}( jQuery ) );
|