Commit realizado el 12:13:52 08-04-2024
This commit is contained in:
Pagina Web Monito
@@ -0,0 +1,758 @@
|
||||
/* global wpforms_builder, WPFormsBuilder, WPFormsUtils */
|
||||
|
||||
/**
|
||||
* Form Builder Fields Drag-n-Drop module.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.DragFields = WPForms.Admin.Builder.DragFields || ( function( document, window, $ ) {
|
||||
|
||||
/**
|
||||
* Elements holder.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
let el = {};
|
||||
|
||||
/**
|
||||
* Runtime variables.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
let vars = {};
|
||||
|
||||
/**
|
||||
* Layout field functions wrapper.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
let fieldLayout;
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
const app = {
|
||||
|
||||
/**
|
||||
* Start the engine.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
app.setup();
|
||||
app.initSortableFields();
|
||||
|
||||
app.events();
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup. Prepare some variables.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
setup: function() {
|
||||
|
||||
// Cache DOM elements.
|
||||
el = {
|
||||
$builder: $( '#wpforms-builder' ),
|
||||
$sortableFieldsWrap: $( '#wpforms-panel-fields .wpforms-field-wrap' ),
|
||||
$addFieldsButtons: $( '.wpforms-add-fields-button' ).not( '.not-draggable' ).not( '.warning-modal' ).not( '.education-modal' ),
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
events: function() {
|
||||
|
||||
el.$builder
|
||||
.on( 'wpformsFieldDragToggle', app.fieldDragToggleEvent );
|
||||
},
|
||||
|
||||
/**
|
||||
* Disable drag & drop.
|
||||
*
|
||||
* @since 1.7.1
|
||||
* @since 1.7.7 Moved from admin-builder.js.
|
||||
*/
|
||||
disableDragAndDrop: function() {
|
||||
|
||||
el.$addFieldsButtons.filter( '.ui-draggable' ).draggable( 'disable' );
|
||||
el.$sortableFieldsWrap.sortable( 'disable' );
|
||||
el.$sortableFieldsWrap.find( '.wpforms-layout-column.ui-sortable' ).sortable( 'disable' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Enable drag & drop.
|
||||
*
|
||||
* @since 1.7.1
|
||||
* @since 1.7.7 Moved from admin-builder.js.
|
||||
*/
|
||||
enableDragAndDrop: function() {
|
||||
|
||||
el.$addFieldsButtons.filter( '.ui-draggable' ).draggable( 'enable' );
|
||||
el.$sortableFieldsWrap.sortable( 'enable' );
|
||||
el.$sortableFieldsWrap.find( '.wpforms-layout-column.ui-sortable' ).sortable( 'enable' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Show popup in case if field is not draggable, and cancel moving.
|
||||
*
|
||||
* @since 1.7.5
|
||||
* @since 1.7.7 Moved from admin-builder.js.
|
||||
*
|
||||
* @param {jQuery} $field A field or list of fields.
|
||||
* @param {boolean} showPopUp Whether the pop-up should be displayed on dragging attempt.
|
||||
*/
|
||||
fieldDragDisable: function( $field, showPopUp = true ) {
|
||||
|
||||
if ( $field.hasClass( 'ui-draggable-disabled' ) ) {
|
||||
$field.draggable( 'enable' );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
let startTopPosition;
|
||||
|
||||
$field.draggable( {
|
||||
revert: true,
|
||||
axis: 'y',
|
||||
delay: 100,
|
||||
opacity: 0.75,
|
||||
cursor: 'move',
|
||||
start: function( event, ui ) {
|
||||
|
||||
startTopPosition = ui.position.top;
|
||||
},
|
||||
drag: function( event, ui ) {
|
||||
|
||||
if ( Math.abs( ui.position.top ) - Math.abs( startTopPosition ) > 15 ) {
|
||||
|
||||
if ( showPopUp ) {
|
||||
app.youCantReorderFieldPopup();
|
||||
}
|
||||
|
||||
return false;
|
||||
}
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Allow field dragging.
|
||||
*
|
||||
* @since 1.7.5
|
||||
* @since 1.7.7 Moved from admin-builder.js.
|
||||
*
|
||||
* @param {jQuery} $field A field or list of fields.
|
||||
*/
|
||||
fieldDragEnable: function( $field ) {
|
||||
|
||||
if ( $field.hasClass( 'ui-draggable' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$field.draggable( 'disable' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Show the error message in the popup that you cannot reorder the field.
|
||||
*
|
||||
* @since 1.7.1
|
||||
* @since 1.7.7 Moved from admin-builder.js.
|
||||
*/
|
||||
youCantReorderFieldPopup: function() {
|
||||
|
||||
$.confirm( {
|
||||
title: wpforms_builder.heads_up,
|
||||
content: wpforms_builder.field_cannot_be_reordered,
|
||||
icon: 'fa fa-exclamation-circle',
|
||||
type: 'red',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.ok,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
},
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Event handler for `wpformsFieldDragToggle` event.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
* @param {numeric} id Field ID.
|
||||
*/
|
||||
fieldDragToggleEvent: function( e, id ) {
|
||||
|
||||
const $field = $( `#wpforms-field-${id}` );
|
||||
|
||||
if (
|
||||
$field.hasClass( 'wpforms-field-not-draggable' ) ||
|
||||
$field.hasClass( 'wpforms-field-stick' )
|
||||
) {
|
||||
app.fieldDragDisable( $field );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
app.fieldDragEnable( $field );
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialize sortable fields in the builder form preview area.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
initSortableFields: function() {
|
||||
|
||||
app.initSortableContainer( el.$sortableFieldsWrap );
|
||||
|
||||
el.$builder.find( '.wpforms-layout-column' ).each( function() {
|
||||
app.initSortableContainer( $( this ) );
|
||||
} );
|
||||
|
||||
app.fieldDragDisable( $( '.wpforms-field-not-draggable, .wpforms-field-stick' ) );
|
||||
app.initDraggableFields();
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialize sortable container with fields.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {jQuery} $sortable Container to make sortable.
|
||||
*/
|
||||
initSortableContainer: function( $sortable ) { // eslint-disable-line max-lines-per-function
|
||||
|
||||
const $fieldOptions = $( '#wpforms-field-options' );
|
||||
|
||||
let fieldId,
|
||||
fieldType,
|
||||
isNewField,
|
||||
$fieldOption,
|
||||
$prevFieldOption,
|
||||
prevFieldId,
|
||||
$scrollContainer = $( '#wpforms-panel-fields .wpforms-panel-content-wrap' ),
|
||||
currentlyScrolling = false;
|
||||
|
||||
$sortable.sortable( {
|
||||
items: '> .wpforms-field:not(.wpforms-field-stick):not(.no-fields-preview)',
|
||||
connectWith: '.wpforms-field-wrap, .wpforms-layout-column',
|
||||
delay: 100,
|
||||
opacity: 0.75,
|
||||
cursor: 'move',
|
||||
cancel: '.wpforms-field-not-draggable',
|
||||
placeholder: 'wpforms-field-drag-placeholder',
|
||||
appendTo: '#wpforms-panel-fields',
|
||||
zindex: 10000,
|
||||
tolerance: 'pointer',
|
||||
distance: 1,
|
||||
start: function( e, ui ) {
|
||||
|
||||
fieldId = ui.item.data( 'field-id' );
|
||||
fieldType = ui.item.data( 'field-type' );
|
||||
isNewField = typeof fieldId === 'undefined';
|
||||
$fieldOption = $( '#wpforms-field-option-' + fieldId );
|
||||
|
||||
vars.fieldReceived = false;
|
||||
vars.fieldRejected = false;
|
||||
vars.$sortableStart = $sortable;
|
||||
vars.startPosition = ui.item.first().index();
|
||||
},
|
||||
beforeStop: function( e, ui ) {
|
||||
|
||||
if ( ! vars.glitchChange ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Before processing in the `stop` method we need to perform the last check.
|
||||
if ( ! fieldLayout.isFieldAllowedInColum( fieldType ) ) {
|
||||
vars.fieldRejected = true;
|
||||
}
|
||||
},
|
||||
stop: function( e, ui ) {
|
||||
|
||||
const $field = ui.item.first();
|
||||
|
||||
ui.placeholder.removeClass( 'wpforms-field-drag-not-allowed' );
|
||||
$field.removeClass( 'wpforms-field-drag-not-allowed' );
|
||||
|
||||
// Reject not allowed fields.
|
||||
if ( vars.fieldRejected ) {
|
||||
app.revertMoveFieldToColumn( $field );
|
||||
|
||||
el.$builder.trigger( 'wpformsFieldMoveRejected', [ $field, ui ] );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
prevFieldId = $field.prev( '.wpforms-field, .wpforms-alert' ).data( 'field-id' );
|
||||
$prevFieldOption = $( `#wpforms-field-option-${prevFieldId}` );
|
||||
|
||||
if ( $prevFieldOption.length > 0 ) {
|
||||
$prevFieldOption.after( $fieldOption );
|
||||
} else {
|
||||
$fieldOptions.prepend( $fieldOption );
|
||||
}
|
||||
|
||||
// In the case of changing fields order inside the same column,
|
||||
// we just need to change the position of the field.
|
||||
if ( ! isNewField && $field.closest( '.wpforms-layout-column' ).is( $sortable ) ) {
|
||||
fieldLayout.positionFieldInColumn(
|
||||
fieldId,
|
||||
$field.index() - 1,
|
||||
$sortable
|
||||
);
|
||||
}
|
||||
|
||||
const $layoutField = $field.closest( '.wpforms-field-layout' );
|
||||
|
||||
fieldLayout.fieldOptionsUpdate( null, fieldId );
|
||||
fieldLayout.reorderLayoutFieldsOptions( $layoutField );
|
||||
|
||||
if ( ! isNewField ) {
|
||||
$field
|
||||
.removeClass( 'wpforms-field-dragging' )
|
||||
.removeClass( 'wpforms-field-drag-over' );
|
||||
}
|
||||
|
||||
$field.attr( 'style', '' );
|
||||
|
||||
el.$builder.trigger( 'wpformsFieldMove', ui );
|
||||
|
||||
vars.fieldReceived = false;
|
||||
},
|
||||
over: function( e, ui ) { // eslint-disable-line complexity
|
||||
|
||||
const $field = ui.item.first(),
|
||||
$target = $( e.target ),
|
||||
$placeholder = $target.find( '.wpforms-field-drag-placeholder' ),
|
||||
isColumn = $target.hasClass( 'wpforms-layout-column' ),
|
||||
targetClass = isColumn ? ' wpforms-field-drag-to-column' : '',
|
||||
helper = {
|
||||
width: $target.outerWidth(),
|
||||
height: $field.outerHeight(),
|
||||
};
|
||||
|
||||
fieldId = $field.data( 'field-id' );
|
||||
fieldType = $field.data( 'field-type' ) || vars.fieldType;
|
||||
isNewField = typeof fieldId === 'undefined';
|
||||
|
||||
// Adjust helper size according to the placeholder size.
|
||||
$field
|
||||
.addClass( 'wpforms-field-dragging' + targetClass )
|
||||
.css( {
|
||||
'width': isColumn ? helper.width - 5 : helper.width,
|
||||
'height': 'auto',
|
||||
} );
|
||||
|
||||
// Adjust placeholder height according to the height of the helper.
|
||||
$placeholder
|
||||
.removeClass( 'wpforms-field-drag-not-allowed' )
|
||||
.css( {
|
||||
'height': isNewField ? helper.height + 18 : helper.height,
|
||||
} );
|
||||
|
||||
// Drop to this place is not allowed.
|
||||
if (
|
||||
! fieldLayout.isFieldAllowedInColum( fieldType ) &&
|
||||
isColumn
|
||||
) {
|
||||
$placeholder.addClass( 'wpforms-field-drag-not-allowed' );
|
||||
$field.addClass( 'wpforms-field-drag-not-allowed' );
|
||||
}
|
||||
|
||||
// Skip if it is the existing field.
|
||||
if ( ! isNewField ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$field
|
||||
.addClass( 'wpforms-field-drag-over' )
|
||||
.removeClass( 'wpforms-field-drag-out' );
|
||||
},
|
||||
out: function( e, ui ) {
|
||||
|
||||
const $field = ui.item.first(),
|
||||
fieldId = $field.data( 'field-id' ),
|
||||
isNewField = typeof fieldId === 'undefined';
|
||||
|
||||
$field
|
||||
.removeClass( 'wpforms-field-drag-not-allowed' )
|
||||
.removeClass( 'wpforms-field-drag-to-column' );
|
||||
|
||||
if ( vars.fieldReceived ) {
|
||||
$field.attr( 'style', '' );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
// Skip if it is the existing field.
|
||||
if ( ! isNewField ) {
|
||||
|
||||
// Remove extra class from the parent layout field.
|
||||
// Fixes disappearing of duplicate/delete field icons
|
||||
// after moving the field outside the layout field.
|
||||
$( ui.sender )
|
||||
.closest( '.wpforms-field-layout' )
|
||||
.removeClass( 'wpforms-field-child-hovered' );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
$field
|
||||
.addClass( 'wpforms-field-drag-out' )
|
||||
.removeClass( 'wpforms-field-drag-over' );
|
||||
},
|
||||
receive: function( e, ui ) { // eslint-disable-line complexity
|
||||
|
||||
const $field = $( ui.helper || ui.item );
|
||||
|
||||
fieldId = $field.data( 'field-id' );
|
||||
fieldType = $field.data( 'field-type' ) || vars.fieldType;
|
||||
|
||||
const isNewField = typeof fieldId === 'undefined',
|
||||
isColumn = $sortable.hasClass( 'wpforms-layout-column' );
|
||||
|
||||
// Drop to this place is not allowed.
|
||||
if (
|
||||
! fieldLayout.isFieldAllowedInColum( fieldType ) &&
|
||||
isColumn
|
||||
) {
|
||||
vars.fieldRejected = true;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
vars.fieldReceived = true;
|
||||
|
||||
$field.removeClass( 'wpforms-field-drag-over' );
|
||||
|
||||
// Move existing field.
|
||||
if ( ! isNewField ) {
|
||||
fieldLayout.receiveFieldToColumn(
|
||||
fieldId,
|
||||
ui.item.index() - 1,
|
||||
$field.parent()
|
||||
);
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
// Add new field.
|
||||
let position = $sortable.data( 'ui-sortable' ).currentItem.index();
|
||||
|
||||
$field
|
||||
.addClass( 'wpforms-field-drag-over wpforms-field-drag-pending' )
|
||||
.removeClass( 'wpforms-field-drag-out' )
|
||||
.append( WPFormsBuilder.settings.spinnerInline )
|
||||
.css( 'width', '100%' );
|
||||
|
||||
el.$builder.find( '.no-fields-preview' ).remove();
|
||||
|
||||
WPFormsBuilder.fieldAdd(
|
||||
vars.fieldType,
|
||||
{
|
||||
position: isColumn ? position - 1 : position,
|
||||
placeholder: $field,
|
||||
$sortable: $sortable,
|
||||
}
|
||||
);
|
||||
|
||||
vars.fieldType = undefined;
|
||||
},
|
||||
change: function( e, ui ) {
|
||||
|
||||
const $placeholderSortable = ui.placeholder.parent();
|
||||
|
||||
vars.glitchChange = false;
|
||||
|
||||
// In some cases sortable widget display placeholder in wrong sortable instance.
|
||||
// It's happens when you drag the field over/out the last column of the last Layout field.
|
||||
if (
|
||||
! $sortable.is( $placeholderSortable ) &&
|
||||
$sortable.hasClass( 'wpforms-field-wrap' ) &&
|
||||
$placeholderSortable.hasClass( 'wpforms-layout-column' )
|
||||
) {
|
||||
vars.glitchChange = true;
|
||||
}
|
||||
},
|
||||
sort: function( e, ui ) {
|
||||
|
||||
if ( currentlyScrolling ) {
|
||||
return;
|
||||
}
|
||||
|
||||
const scrollAreaHeight = 50,
|
||||
mouseYPosition = e.clientY,
|
||||
containerOffset = $scrollContainer.offset(),
|
||||
containerHeight = $scrollContainer.height(),
|
||||
containerBottom = containerOffset.top + containerHeight;
|
||||
|
||||
let operator;
|
||||
|
||||
if (
|
||||
mouseYPosition > containerOffset.top &&
|
||||
mouseYPosition < ( containerOffset.top + scrollAreaHeight )
|
||||
) {
|
||||
operator = '-=';
|
||||
} else if (
|
||||
mouseYPosition > ( containerBottom - scrollAreaHeight ) &&
|
||||
mouseYPosition < containerBottom
|
||||
) {
|
||||
operator = '+=';
|
||||
} else {
|
||||
return;
|
||||
}
|
||||
|
||||
currentlyScrolling = true;
|
||||
|
||||
$scrollContainer.animate(
|
||||
{
|
||||
scrollTop: operator + containerHeight / 3 + 'px',
|
||||
},
|
||||
800,
|
||||
function() {
|
||||
currentlyScrolling = false;
|
||||
}
|
||||
);
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Initialize draggable fields buttons.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*/
|
||||
initDraggableFields: function() {
|
||||
|
||||
el.$addFieldsButtons.draggable( {
|
||||
connectToSortable: '.wpforms-field-wrap, .wpforms-layout-column',
|
||||
delay: 200,
|
||||
cancel: false,
|
||||
scroll: false,
|
||||
opacity: 0.75,
|
||||
appendTo: '#wpforms-panel-fields',
|
||||
zindex: 10000,
|
||||
helper() {
|
||||
const $this = $( this );
|
||||
const $el = $( '<div class="wpforms-field-drag-out wpforms-field-drag">' );
|
||||
|
||||
vars.fieldType = $this.data( 'field-type' );
|
||||
|
||||
return $el.html( $this.html() );
|
||||
},
|
||||
|
||||
start( e, ui ) {
|
||||
const event = WPFormsUtils.triggerEvent(
|
||||
el.$builder,
|
||||
'wpformsFieldAddDragStart',
|
||||
[ vars.fieldType, ui ]
|
||||
);
|
||||
|
||||
// Allow callbacks on `wpformsFieldAddDragStart` to cancel dragging the field
|
||||
// by triggering `event.preventDefault()`.
|
||||
if ( event.isDefaultPrevented() ) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
|
||||
stop( e, ui ) {
|
||||
const event = WPFormsUtils.triggerEvent(
|
||||
el.$builder,
|
||||
'wpformsFieldAddDragStop',
|
||||
[ vars.fieldType, ui ]
|
||||
);
|
||||
|
||||
// Allow callbacks on `wpformsFieldAddDragStop` to cancel dragging the field
|
||||
// by triggering `event.preventDefault()`.
|
||||
if ( event.isDefaultPrevented() ) {
|
||||
return false;
|
||||
}
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Revert moving the field to the column.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {jQuery} $field Field object.
|
||||
*/
|
||||
revertMoveFieldToColumn: function( $field ) {
|
||||
|
||||
const isNewField = $field.data( 'field-id' ) === undefined;
|
||||
|
||||
if ( isNewField ) {
|
||||
|
||||
// Remove the field.
|
||||
$field.remove();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
// Restore existing field on the previous position.
|
||||
$field = $field.detach();
|
||||
|
||||
const $fieldInStartPosition = vars.$sortableStart
|
||||
.find( '> .wpforms-field' )
|
||||
.eq( vars.startPosition );
|
||||
|
||||
$field
|
||||
.removeClass( 'wpforms-field-dragging' )
|
||||
.removeClass( 'wpforms-field-drag-over' )
|
||||
.attr( 'style', '' );
|
||||
|
||||
if ( $fieldInStartPosition.length ) {
|
||||
$fieldInStartPosition.before( $field );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
vars.$sortableStart.append( $field );
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Layout field functions holder.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
fieldLayout = {
|
||||
|
||||
/**
|
||||
* Position field in the column inside the Layout Field.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {number} fieldId Field Id.
|
||||
* @param {number} position The new position of the field inside the column.
|
||||
* @param {jQuery} $sortable Sortable column container.
|
||||
**/
|
||||
positionFieldInColumn: function( fieldId, position, $sortable ) {
|
||||
|
||||
if ( ! WPForms.Admin.Builder.FieldLayout ) {
|
||||
return;
|
||||
}
|
||||
|
||||
WPForms.Admin.Builder.FieldLayout.positionFieldInColumn( fieldId, position, $sortable );
|
||||
},
|
||||
|
||||
/**
|
||||
* Receive field to column inside the Layout Field.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {number} fieldId Field Id.
|
||||
* @param {number} position Field position inside the column.
|
||||
* @param {jQuery} $sortable Sortable column container.
|
||||
**/
|
||||
receiveFieldToColumn: function( fieldId, position, $sortable ) {
|
||||
|
||||
if ( ! WPForms.Admin.Builder.FieldLayout ) {
|
||||
return;
|
||||
}
|
||||
|
||||
WPForms.Admin.Builder.FieldLayout.receiveFieldToColumn( fieldId, position, $sortable );
|
||||
},
|
||||
|
||||
/**
|
||||
* Update field options according to the position of the field.
|
||||
* Event `wpformsFieldOptionTabToggle` handler.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {Event} e Event.
|
||||
* @param {int} fieldId Field id.
|
||||
*/
|
||||
fieldOptionsUpdate: function( e, fieldId ) {
|
||||
|
||||
if ( ! WPForms.Admin.Builder.FieldLayout ) {
|
||||
return;
|
||||
}
|
||||
|
||||
WPForms.Admin.Builder.FieldLayout.fieldOptionsUpdate( e, fieldId );
|
||||
},
|
||||
|
||||
/**
|
||||
* Reorder fields options of the fields in columns.
|
||||
* It is not critical, but it's better to keep some order in the `fields` data array.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {jQuery} $layoutField Layout field object.
|
||||
*/
|
||||
reorderLayoutFieldsOptions: function( $layoutField ) {
|
||||
|
||||
if ( ! WPForms.Admin.Builder.FieldLayout ) {
|
||||
return;
|
||||
}
|
||||
|
||||
WPForms.Admin.Builder.FieldLayout.reorderLayoutFieldsOptions( $layoutField );
|
||||
},
|
||||
|
||||
/**
|
||||
* Whether the field type is allowed to be in column.
|
||||
*
|
||||
* @since 1.7.7
|
||||
*
|
||||
* @param {string} fieldType Field ty to check.
|
||||
*
|
||||
* @returns {boolean} True if allowed.
|
||||
*/
|
||||
isFieldAllowedInColum: function( fieldType ) {
|
||||
|
||||
if ( ! WPForms.Admin.Builder.FieldLayout ) {
|
||||
return true;
|
||||
}
|
||||
|
||||
return WPForms.Admin.Builder.FieldLayout.isFieldAllowedInColum( fieldType );
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
}( document, window, jQuery ) );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.DragFields.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/drag-fields.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/drag-fields.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -0,0 +1,287 @@
|
||||
/**
|
||||
* WPForms Builder Dropdown List module.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
|
||||
/*
|
||||
Usage:
|
||||
|
||||
dropdownList = WPForms.Admin.Builder.DropdownList.init( {
|
||||
class: 'insert-field-dropdown', // Additional CSS class.
|
||||
title: 'Dropdown Title', // Dropdown title.
|
||||
list: [ // Items list.
|
||||
{ value: '1', text: 'Item 1' },
|
||||
{ value: '2', text: 'Item 2' },
|
||||
{ value: '3', text: 'Item 3' },
|
||||
],
|
||||
container: $( '.holder-container' ), // Holder container. Optional.
|
||||
scrollableContainer: $( '.scrollable-container' ), // Scrollable container. Optional.
|
||||
button: $( '.button' ), // Button.
|
||||
buttonDistance: 21, // Distance from dropdown to the button.
|
||||
itemFormat( item ) { // Item element renderer. Optional.
|
||||
return `<span>${ item.text }</span>`;
|
||||
},
|
||||
onSelect( event, value, text, $item, instance ) { // On select event handler.
|
||||
console.log( 'Item selected:', text );
|
||||
instance.close();
|
||||
$button.removeClass( 'active' );
|
||||
},
|
||||
} );
|
||||
*/
|
||||
|
||||
var WPForms = window.WPForms || {}; // eslint-disable-line no-var
|
||||
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.DropdownList = WPForms.Admin.Builder.DropdownList || ( function( document, window, $ ) {
|
||||
/**
|
||||
* DropdownList object constructor.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
function DropdownList( options ) { // eslint-disable-line max-lines-per-function
|
||||
const self = this;
|
||||
|
||||
/**
|
||||
* Default options.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
const defaultOptions = {
|
||||
class: '',
|
||||
title: '',
|
||||
list: [],
|
||||
container: null,
|
||||
scrollableContainer: null,
|
||||
button: null,
|
||||
buttonDistance: 10,
|
||||
onSelect: null,
|
||||
itemFormat( item ) {
|
||||
return item.text;
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Options.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @type {jQuery}
|
||||
*/
|
||||
self.options = $.extend( defaultOptions, options );
|
||||
|
||||
/**
|
||||
* Main dropdown container.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @type {jQuery}
|
||||
*/
|
||||
self.$el = null;
|
||||
|
||||
/**
|
||||
* Form builder container.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @type {jQuery}
|
||||
*/
|
||||
self.$builder = $( '#wpforms-builder' );
|
||||
|
||||
/**
|
||||
* Close the dropdown.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
self.close = function() {
|
||||
self.$el.addClass( 'closed' );
|
||||
};
|
||||
|
||||
/**
|
||||
* Open the dropdown.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
self.open = function() {
|
||||
self.$el.removeClass( 'closed' );
|
||||
self.setPosition();
|
||||
|
||||
// Close dropdown on click outside.
|
||||
self.$builder.on( 'click.DropdowmList', function( e ) {
|
||||
const $target = $( e.target );
|
||||
|
||||
if ( $target.closest( self.$el ).length || $target.hasClass( 'button-insert-field' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
self.$builder.off( 'click.DropdowmList' );
|
||||
|
||||
const $button = $( self.options.button );
|
||||
|
||||
if ( $button.hasClass( 'active' ) ) {
|
||||
$button.trigger( 'click' );
|
||||
}
|
||||
} );
|
||||
};
|
||||
|
||||
/**
|
||||
* Generate the dropdown HTML.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @return {string} HTML.
|
||||
*/
|
||||
self.generateHtml = function() {
|
||||
const list = self.options.list;
|
||||
|
||||
if ( ! list || list.length === 0 ) {
|
||||
return '';
|
||||
}
|
||||
|
||||
const itemFormat = typeof self.options.itemFormat === 'function' ? self.options.itemFormat : defaultOptions.itemFormat;
|
||||
|
||||
// Generate HTML.
|
||||
const items = [];
|
||||
|
||||
for ( const i in list ) {
|
||||
items.push( `<li data-value="${ list[ i ].value }">${ itemFormat( list[ i ] ) }</li>` );
|
||||
}
|
||||
|
||||
return `<div class="wpforms-builder-dropdown-list closed ${ self.options.class }">
|
||||
<div class="title">${ self.options.title }</div>
|
||||
<ul>${ items.join( '' ) }</ul>
|
||||
</div>`;
|
||||
};
|
||||
|
||||
/**
|
||||
* Attach dropdown to DOM.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
self.attach = function() {
|
||||
const html = self.generateHtml();
|
||||
|
||||
// Remove old dropdown.
|
||||
if ( self.$el && self.$el.length ) {
|
||||
self.$el.remove();
|
||||
}
|
||||
|
||||
// Create jQuery objects.
|
||||
self.$el = $( html );
|
||||
self.$button = $( self.options.button );
|
||||
self.$container = self.options.container ? $( self.options.container ) : self.$button.parent();
|
||||
self.$scrollableContainer = self.options.scrollableContainer ? $( self.options.scrollableContainer ) : null;
|
||||
|
||||
// Add the dropdown to the container.
|
||||
self.$container.append( self.$el );
|
||||
|
||||
self.setPosition();
|
||||
};
|
||||
|
||||
/**
|
||||
* Set dropdown position.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
self.setPosition = function() {
|
||||
// Calculate position.
|
||||
const buttonOffset = self.$button.offset(),
|
||||
containerOffset = self.$container.offset(),
|
||||
containerPosition = self.$container.position(),
|
||||
dropdownHeight = self.$el.height(),
|
||||
scrollTop = self.$scrollableContainer ? self.$scrollableContainer.scrollTop() : 0;
|
||||
|
||||
let top = buttonOffset.top - containerOffset.top - dropdownHeight - self.options.buttonDistance;
|
||||
|
||||
// In the case of the dropdown doesn't fit into the scrollable container to top, it is needed to open the dropdown to the bottom.
|
||||
if ( scrollTop + containerPosition.top - dropdownHeight < 0 ) {
|
||||
top = buttonOffset.top - containerOffset.top + self.$button.height() + self.options.buttonDistance - 11;
|
||||
}
|
||||
|
||||
self.$el.css( 'top', top );
|
||||
|
||||
// The dropdown is outside the field options, it is needed to set `left` positioning value.
|
||||
if ( self.$container.closest( '.wpforms-field-option' ).length === 0 ) {
|
||||
self.$el.css( 'left', buttonOffset.left - containerOffset.left );
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Events.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
self.events = function() {
|
||||
// Click (select) the item.
|
||||
self.$el.find( 'li' ).off()
|
||||
.on( 'click', function( event ) {
|
||||
// Bail if callback is not a function.
|
||||
if ( typeof self.options.onSelect !== 'function' ) {
|
||||
return;
|
||||
}
|
||||
|
||||
const $item = $( this );
|
||||
|
||||
self.options.onSelect( event, $item.data( 'value' ), $item.text(), $item, self );
|
||||
} );
|
||||
};
|
||||
|
||||
/**
|
||||
* Initialize.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @param {Array} list List of items.
|
||||
*/
|
||||
self.init = function( list = null ) {
|
||||
self.options.list = list ? list : self.options.list;
|
||||
|
||||
self.attach();
|
||||
self.events();
|
||||
|
||||
self.$button.data( 'dropdown-list', self );
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroy.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*/
|
||||
self.destroy = function() {
|
||||
self.$button.data( 'dropdown-list', null );
|
||||
self.$el.remove();
|
||||
};
|
||||
|
||||
// Initialize.
|
||||
self.init();
|
||||
}
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
return {
|
||||
|
||||
/**
|
||||
* Start the engine. DOM is not ready yet, use only to init something.
|
||||
*
|
||||
* @since 1.8.4
|
||||
*
|
||||
* @param {Object} options Options.
|
||||
*
|
||||
* @return {Object} DropdownList instance.
|
||||
*/
|
||||
init( options ) {
|
||||
return new DropdownList( options );
|
||||
},
|
||||
};
|
||||
}( document, window, jQuery ) );
|
||||
4
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/dropdown-list.min.js
vendored
Normal file
4
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/dropdown-list.min.js
vendored
Normal file
@@ -0,0 +1,4 @@
|
||||
var WPForms=window.WPForms||{};WPForms.Admin=WPForms.Admin||{},WPForms.Admin.Builder=WPForms.Admin.Builder||{},WPForms.Admin.Builder.DropdownList=WPForms.Admin.Builder.DropdownList||function(n){function o(t){const s=this,i={class:"",title:"",list:[],container:null,scrollableContainer:null,button:null,buttonDistance:10,onSelect:null,itemFormat(t){return t.text}};s.options=n.extend(i,t),s.$el=null,s.$builder=n("#wpforms-builder"),s.close=function(){s.$el.addClass("closed")},s.open=function(){s.$el.removeClass("closed"),s.setPosition(),s.$builder.on("click.DropdowmList",function(t){var t=n(t.target);t.closest(s.$el).length||t.hasClass("button-insert-field")||(s.$builder.off("click.DropdowmList"),(t=n(s.options.button)).hasClass("active")&&t.trigger("click"))})},s.generateHtml=function(){var t=s.options.list;if(!t||0===t.length)return"";var o=("function"==typeof s.options.itemFormat?s.options:i).itemFormat,n=[];for(const e in t)n.push(`<li data-value="${t[e].value}">${o(t[e])}</li>`);return`<div class="wpforms-builder-dropdown-list closed ${s.options.class}">
|
||||
<div class="title">${s.options.title}</div>
|
||||
<ul>${n.join("")}</ul>
|
||||
</div>`},s.attach=function(){var t=s.generateHtml();s.$el&&s.$el.length&&s.$el.remove(),s.$el=n(t),s.$button=n(s.options.button),s.$container=s.options.container?n(s.options.container):s.$button.parent(),s.$scrollableContainer=s.options.scrollableContainer?n(s.options.scrollableContainer):null,s.$container.append(s.$el),s.setPosition()},s.setPosition=function(){var t=s.$button.offset(),o=s.$container.offset(),n=s.$container.position(),e=s.$el.height(),i=s.$scrollableContainer?s.$scrollableContainer.scrollTop():0;let l=t.top-o.top-e-s.options.buttonDistance;i+n.top-e<0&&(l=t.top-o.top+s.$button.height()+s.options.buttonDistance-11),s.$el.css("top",l),0===s.$container.closest(".wpforms-field-option").length&&s.$el.css("left",t.left-o.left)},s.events=function(){s.$el.find("li").off().on("click",function(t){var o;"function"==typeof s.options.onSelect&&(o=n(this),s.options.onSelect(t,o.data("value"),o.text(),o,s))})},s.init=function(t=null){s.options.list=t||s.options.list,s.attach(),s.events(),s.$button.data("dropdown-list",s)},s.destroy=function(){s.$button.data("dropdown-list",null),s.$el.remove()},s.init()}return{init(t){return new o(t)}}}((document,window,jQuery));
|
||||
@@ -0,0 +1,216 @@
|
||||
/* eslint-disable camelcase */
|
||||
/* global wpforms_builder_email_template */
|
||||
|
||||
/**
|
||||
* Script for manipulating DOM events in the "Builder" settings page.
|
||||
* This script will be accessible in the "WPForms" → "Builder" → "Notifications" tab/page.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
|
||||
const WPFormsBuilderEmailTemplate = window.WPFormsBuilderEmailTemplate || ( function( document, window, $, l10n ) {
|
||||
/**
|
||||
* Elements holder.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
const el = {};
|
||||
|
||||
/**
|
||||
* Runtime variables.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
const vars = {
|
||||
/**
|
||||
* Modal instance.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
modal: null,
|
||||
|
||||
/**
|
||||
* Generic CSS class names for applying visual changes.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
classNames: {
|
||||
modalBox: 'wpforms-modal-content-box',
|
||||
modalOpen: 'wpforms-email-template-modal-open',
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
const app = {
|
||||
|
||||
/**
|
||||
* Start the engine.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
init() {
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* Document ready.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
ready() {
|
||||
app.setup();
|
||||
app.bindEvents();
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup. Prepare some variables.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
setup() {
|
||||
// Cache DOM elements.
|
||||
el.$document = $( document );
|
||||
el.$body = $( 'body' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
bindEvents() {
|
||||
el.$document
|
||||
.on( 'change', '.wpforms-email-template-modal-content input[type="radio"]', app.handleOnChangeTemplate )
|
||||
.on( 'click', '.wpforms-all-email-template-modal', app.handleOnOpenModal );
|
||||
},
|
||||
|
||||
/**
|
||||
* Handle the "change" event for the template radio buttons.
|
||||
* This function updates the select field based on the selected radio button.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*
|
||||
* @param {Object} event The DOM event that triggered the function.
|
||||
*/
|
||||
handleOnChangeTemplate( event ) {
|
||||
// Prevent the default action, which is to handle the change event.
|
||||
event.preventDefault();
|
||||
|
||||
// Extract the ID of the field from the element.
|
||||
const id = app.getIdFromElm( $( this ) );
|
||||
|
||||
// Get the corresponding select field.
|
||||
const $field = $( `#wpforms-panel-field-notifications-${ id }-template` );
|
||||
|
||||
// If the select field doesn't exist, no further action is needed.
|
||||
if ( ! $field.length ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// If the modal doesn't exist, no further action is needed.
|
||||
if ( ! vars.modal ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Get the value of the radio button that triggered the change.
|
||||
const value = $( this ).val();
|
||||
|
||||
// Update the select field with the selected value and trigger the change event.
|
||||
$field.val( value ).trigger( 'change' );
|
||||
|
||||
// Close the modal.
|
||||
vars.modal.close();
|
||||
},
|
||||
|
||||
/**
|
||||
* Handle the "click" event for opening the modal.
|
||||
* This will open the modal with the available templates.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*/
|
||||
handleOnOpenModal() {
|
||||
// Get the email template modal template.
|
||||
const template = wp.template( 'wpforms-email-template-modal' );
|
||||
|
||||
// If the template doesn't exist, exit the function.
|
||||
if ( ! template.length ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Find the closest wrapper and select element.
|
||||
const $wrapper = $( this ).closest( '.wpforms-panel-field-email-template-wrap' );
|
||||
const $select = $wrapper.find( 'select' );
|
||||
|
||||
// Get the selected value from the select element and its ID.
|
||||
const selected = $select.val() || '';
|
||||
const id = app.getIdFromElm( $select );
|
||||
|
||||
// Extract relevant data from l10n.
|
||||
const { templates, is_pro } = l10n;
|
||||
|
||||
// Prepare the data to be passed to the template.
|
||||
const data = { templates, selected, is_pro, id };
|
||||
|
||||
// Generate the modal's content using the template and data.
|
||||
const content = template( data );
|
||||
|
||||
// Open the modal.
|
||||
vars.modal = $.confirm( {
|
||||
content,
|
||||
title: '',
|
||||
boxWidth: 800,
|
||||
contentMaxHeight: 'none',
|
||||
backgroundDismiss: true,
|
||||
smoothContent: false,
|
||||
closeIcon: true,
|
||||
buttons: false,
|
||||
// Callback function before the modal opens.
|
||||
onOpenBefore() {
|
||||
this.$body.addClass( vars.classNames.modalBox );
|
||||
el.$body.addClass( vars.classNames.modalOpen );
|
||||
},
|
||||
// Callback function when the modal is closed.
|
||||
onClose() {
|
||||
el.$body.removeClass( vars.classNames.modalOpen );
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Get the ID from the element.
|
||||
* This is a helper function for extracting the numeric ID from an element's ID attribute.
|
||||
*
|
||||
* @since 1.8.5
|
||||
*
|
||||
* @param {Object} $elm jQuery object representing the element.
|
||||
*
|
||||
* @return {number} The numeric ID extracted from the element's ID attribute.
|
||||
*/
|
||||
getIdFromElm( $elm ) {
|
||||
// Get the ID attribute from the element.
|
||||
const id = $elm.attr( 'id' );
|
||||
|
||||
// If no ID attribute is found, return 0.
|
||||
if ( ! id ) {
|
||||
return 0;
|
||||
}
|
||||
|
||||
// Extract and parse the numeric part from the ID.
|
||||
return parseInt( id.match( /\d+/ )[ 0 ], 10 );
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
}( document, window, jQuery, wpforms_builder_email_template ) );
|
||||
|
||||
// Initialize.
|
||||
WPFormsBuilderEmailTemplate.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/email-template.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/email-template.min.js
vendored
Normal file
@@ -0,0 +1 @@
|
||||
const WPFormsBuilderEmailTemplate=window.WPFormsBuilderEmailTemplate||function(e,m,n){const s={},d={modal:null,classNames:{modalBox:"wpforms-modal-content-box",modalOpen:"wpforms-email-template-modal-open"}},i={init(){m(i.ready)},ready(){i.setup(),i.bindEvents()},setup(){s.$document=m(e),s.$body=m("body")},bindEvents(){s.$document.on("change",'.wpforms-email-template-modal-content input[type="radio"]',i.handleOnChangeTemplate).on("click",".wpforms-all-email-template-modal",i.handleOnOpenModal)},handleOnChangeTemplate(e){e.preventDefault();var a,e=i.getIdFromElm(m(this)),e=m(`#wpforms-panel-field-notifications-${e}-template`);e.length&&d.modal&&(a=m(this).val(),e.val(a).trigger("change"),d.modal.close())},handleOnOpenModal(){var e,a,l,t,o=wp.template("wpforms-email-template-modal");o.length&&(e=(a=m(this).closest(".wpforms-panel-field-email-template-wrap").find("select")).val()||"",a=i.getIdFromElm(a),{templates:l,is_pro:t}=n,o=o({templates:l,selected:e,is_pro:t,id:a}),d.modal=m.confirm({content:o,title:"",boxWidth:800,contentMaxHeight:"none",backgroundDismiss:!0,smoothContent:!1,closeIcon:!0,buttons:!1,onOpenBefore(){this.$body.addClass(d.classNames.modalBox),s.$body.addClass(d.classNames.modalOpen)},onClose(){s.$body.removeClass(d.classNames.modalOpen)}}))},getIdFromElm(e){e=e.attr("id");return e?parseInt(e.match(/\d+/)[0],10):0}};return i}(document,(window,jQuery),wpforms_builder_email_template);WPFormsBuilderEmailTemplate.init();
|
||||
@@ -0,0 +1,550 @@
|
||||
/* global wpforms_builder_help, wpf */
|
||||
|
||||
/**
|
||||
* WPForms Builder Help screen module.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.Help = WPForms.Admin.Builder.Help || ( function( document, window, $ ) {
|
||||
|
||||
/**
|
||||
* Elements holder.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var el;
|
||||
|
||||
/**
|
||||
* UI functions.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var ui;
|
||||
|
||||
/**
|
||||
* Event handlers.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var event;
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var app = {
|
||||
|
||||
/**
|
||||
* Start the engine. DOM is not ready yet, use only to init something.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
app.setup();
|
||||
app.initCategories();
|
||||
app.events();
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup. Prepare some variables.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
setup: function() {
|
||||
|
||||
// Cache DOM elements.
|
||||
el = {
|
||||
$builder: $( '#wpforms-builder' ),
|
||||
$builderForm: $( '#wpforms-builder-form' ),
|
||||
$helpBtn: $( '#wpforms-help' ),
|
||||
$help: $( '#wpforms-builder-help' ),
|
||||
$closeBtn: $( '#wpforms-builder-help-close' ),
|
||||
$search: $( '#wpforms-builder-help-search' ),
|
||||
$result: $( '#wpforms-builder-help-result' ),
|
||||
$noResult: $( '#wpforms-builder-help-no-result' ),
|
||||
$categories: $( '#wpforms-builder-help-categories' ),
|
||||
$footer: $( '#wpforms-builder-help-footer' ),
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
events: function() {
|
||||
|
||||
// Open/close help modal.
|
||||
el.$helpBtn.on( 'click', event.openHelp );
|
||||
el.$closeBtn.on( 'click', event.closeHelp );
|
||||
|
||||
// Expand/collapse category.
|
||||
el.$categories.on( 'click', '.wpforms-builder-help-category header', event.toggleCategory );
|
||||
|
||||
// View all Category Docs button click.
|
||||
el.$categories.on( 'click', '.wpforms-builder-help-category button.viewall', event.viewAllCategoryDocs );
|
||||
|
||||
// Input into search field.
|
||||
el.$search.on( 'keyup', 'input', _.debounce( event.inputSearch, 250 ) );
|
||||
|
||||
// Clear search field.
|
||||
el.$search.on( 'click', '#wpforms-builder-help-search-clear', event.clearSearch );
|
||||
},
|
||||
|
||||
/**
|
||||
* Init (generate) categories list.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
initCategories: function() {
|
||||
|
||||
// Display error if docs data is not available.
|
||||
if ( wpf.empty( wpforms_builder_help.docs ) ) {
|
||||
el.$categories.html( wp.template( 'wpforms-builder-help-categories-error' ) );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
var tmpl = wp.template( 'wpforms-builder-help-categories' ),
|
||||
data = {
|
||||
categories: wpforms_builder_help.categories,
|
||||
docs: app.getDocsByCategories(),
|
||||
};
|
||||
|
||||
el.$categories.html( tmpl( data ) );
|
||||
},
|
||||
|
||||
/**
|
||||
* Init categories list.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @returns {object} Docs arranged by category.
|
||||
*/
|
||||
getDocsByCategories: function() {
|
||||
|
||||
var categories = wpforms_builder_help.categories,
|
||||
docs = wpforms_builder_help.docs || [],
|
||||
docsByCategories = {};
|
||||
|
||||
_.each( categories, function( categoryTitle, categorySlug ) {
|
||||
var docsByCategory = [];
|
||||
_.each( docs, function( doc ) {
|
||||
if ( doc.categories && doc.categories.indexOf( categorySlug ) > -1 ) {
|
||||
docsByCategory.push( doc );
|
||||
}
|
||||
} );
|
||||
docsByCategories[ categorySlug ] = docsByCategory;
|
||||
} );
|
||||
|
||||
return docsByCategories;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get docs recommended by search term.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {string} term Search term.
|
||||
*
|
||||
* @returns {Array} Recommended docs.
|
||||
*/
|
||||
getRecommendedDocs: function( term ) {
|
||||
|
||||
if ( wpf.empty( term ) ) {
|
||||
return [];
|
||||
}
|
||||
|
||||
term = term.toLowerCase();
|
||||
|
||||
var docs = wpforms_builder_help.docs,
|
||||
recommendedDocs = [];
|
||||
|
||||
if ( wpf.empty( wpforms_builder_help.context.docs[ term ] ) ) {
|
||||
return [];
|
||||
}
|
||||
|
||||
_.each( wpforms_builder_help.context.docs[ term ], function( docId ) {
|
||||
if ( ! wpf.empty( docs[ docId ] ) ) {
|
||||
recommendedDocs.push( docs[ docId ] );
|
||||
}
|
||||
} );
|
||||
|
||||
return recommendedDocs;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get docs filtered by search term.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {string} term Search term.
|
||||
*
|
||||
* @returns {Array} Filtered docs.
|
||||
*/
|
||||
getFilteredDocs: function( term ) {
|
||||
|
||||
if ( wpf.empty( term ) ) {
|
||||
return [];
|
||||
}
|
||||
|
||||
var docs = wpforms_builder_help.docs,
|
||||
filteredDocs = [];
|
||||
|
||||
term = term.toLowerCase();
|
||||
|
||||
_.each( docs, function( doc ) {
|
||||
if ( doc.title && doc.title.toLowerCase().indexOf( term ) > -1 ) {
|
||||
filteredDocs.push( doc );
|
||||
}
|
||||
} );
|
||||
|
||||
return filteredDocs;
|
||||
},
|
||||
|
||||
/**
|
||||
* Get the current context (state) of the form builder.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @returns {string} Builder context string. For example 'fields/add_field' or 'settings/notifications'.
|
||||
*/
|
||||
getBuilderContext: function() {
|
||||
|
||||
// New (not saved) form.
|
||||
if ( wpf.empty( el.$builderForm.data( 'id' ) ) ) {
|
||||
return 'new_form';
|
||||
}
|
||||
|
||||
// Determine builder panel and section.
|
||||
var panel = el.$builder.find( '#wpforms-panels-toggle button.active' ).data( 'panel' ),
|
||||
$panel = el.$builder.find( '#wpforms-panel-' + panel ),
|
||||
section = '',
|
||||
subsection = '',
|
||||
context;
|
||||
|
||||
switch ( panel ) {
|
||||
case 'fields':
|
||||
section = $panel.find( '.wpforms-panel-sidebar .wpforms-tab a.active' ).parent().attr( 'id' );
|
||||
break;
|
||||
case 'setup':
|
||||
section = '';
|
||||
break;
|
||||
default:
|
||||
section = $panel.find( '.wpforms-panel-sidebar a.active' ).data( 'section' );
|
||||
}
|
||||
|
||||
section = ! wpf.empty( section ) ? section.replace( /-/g, '_' ) : '';
|
||||
|
||||
// Detect field type.
|
||||
if ( section === 'field_options' ) {
|
||||
subsection = $panel.find( '#wpforms-field-options .wpforms-field-option:visible .wpforms-field-option-hidden-type' ).val();
|
||||
}
|
||||
|
||||
// Combine to context array.
|
||||
context = [ panel, section, subsection ].filter( function( el ) {
|
||||
return ! wpf.empty( el ) && el !== 'default';
|
||||
} );
|
||||
|
||||
// Return imploded string.
|
||||
return context.join( '/' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Get the search term for the current builder context.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @returns {string} Builder context term string.
|
||||
*/
|
||||
getBuilderContextTerm: function() {
|
||||
|
||||
return wpforms_builder_help.context.terms[ app.getBuilderContext() ] || '';
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* UI functions.
|
||||
*/
|
||||
ui = {
|
||||
|
||||
/**
|
||||
* Configuration.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
config: {
|
||||
speed: 300, // Fading/sliding duration in milliseconds.
|
||||
},
|
||||
|
||||
/**
|
||||
* Display the element by fading them to opaque using CSS.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {jQuery} $el Element object.
|
||||
*/
|
||||
fadeIn: function( $el ) {
|
||||
|
||||
if ( ! $el.length ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$el.css( {
|
||||
display: '',
|
||||
transition: `opacity ${ui.config.speed}ms ease-in 0s`,
|
||||
} );
|
||||
|
||||
setTimeout( function() {
|
||||
$el.css( 'opacity', '1' );
|
||||
}, 0 );
|
||||
},
|
||||
|
||||
/**
|
||||
* Hide the element by fading them to transparent using CSS.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {jQuery} $el Element object.
|
||||
*/
|
||||
fadeOut: function( $el ) {
|
||||
|
||||
if ( ! $el.length ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$el.css( {
|
||||
opacity: '0',
|
||||
transition: `opacity ${ui.config.speed}ms ease-in 0s`,
|
||||
} );
|
||||
|
||||
setTimeout( function() {
|
||||
$el.css( 'display', 'none' );
|
||||
}, ui.config.speed );
|
||||
},
|
||||
|
||||
/**
|
||||
* Collapse all categories.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*/
|
||||
collapseAllCategories: function() {
|
||||
|
||||
el.$categories.find( '.wpforms-builder-help-category' ).removeClass( 'opened' );
|
||||
el.$categories.find( '.wpforms-builder-help-docs' ).slideUp();
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Event handlers.
|
||||
*/
|
||||
event = {
|
||||
|
||||
/**
|
||||
* Open help modal.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
openHelp: function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
var $firstCategory = el.$categories.find( '.wpforms-builder-help-category' ).first(),
|
||||
builderContextTerm = app.getBuilderContextTerm();
|
||||
|
||||
if ( builderContextTerm === '' && ! $firstCategory.hasClass( 'opened' ) ) {
|
||||
$firstCategory.find( 'header' ).first().trigger( 'click' );
|
||||
} else {
|
||||
ui.collapseAllCategories();
|
||||
}
|
||||
|
||||
el.$search.find( 'input' ).val( builderContextTerm ).trigger( 'keyup' );
|
||||
|
||||
ui.fadeIn( el.$help );
|
||||
|
||||
setTimeout( function() {
|
||||
|
||||
ui.fadeIn( el.$result );
|
||||
ui.fadeIn( el.$categories );
|
||||
ui.fadeIn( el.$footer );
|
||||
|
||||
}, ui.config.speed );
|
||||
},
|
||||
|
||||
/**
|
||||
* Close help modal.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
closeHelp: function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
ui.fadeOut( el.$result );
|
||||
ui.fadeOut( el.$categories );
|
||||
ui.fadeOut( el.$footer );
|
||||
|
||||
ui.fadeOut( el.$help );
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle category.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
toggleCategory: function( e ) {
|
||||
|
||||
var $category = $( this ).parent(),
|
||||
$categoryDocs = $category.find( '.wpforms-builder-help-docs' );
|
||||
|
||||
if ( ! $categoryDocs.is( ':visible' ) ) {
|
||||
$category.addClass( 'opened' );
|
||||
} else {
|
||||
$category.removeClass( 'opened' );
|
||||
}
|
||||
|
||||
$categoryDocs.stop().slideToggle( ui.config.speed );
|
||||
},
|
||||
|
||||
/**
|
||||
* View All Category Docs button click.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
viewAllCategoryDocs: function( e ) {
|
||||
|
||||
var $btn = $( this );
|
||||
|
||||
$btn.prev( 'div' ).stop().slideToggle( ui.config.speed, function() {
|
||||
$btn.closest( '.wpforms-builder-help-category' ).addClass( 'viewall' );
|
||||
} );
|
||||
ui.fadeOut( $btn );
|
||||
$btn.slideUp();
|
||||
},
|
||||
|
||||
/**
|
||||
* Input into search field.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
inputSearch: function( e ) {
|
||||
|
||||
var $input = $( this ),
|
||||
term = $input.val();
|
||||
|
||||
var tmpl = wp.template( 'wpforms-builder-help-docs' ),
|
||||
recommendedDocs = app.getRecommendedDocs( term ),
|
||||
filteredDocs = event.removeDuplicates( recommendedDocs, app.getFilteredDocs( term ) ),
|
||||
resultHTML = '';
|
||||
|
||||
el.$search.toggleClass( 'wpforms-empty', ! term );
|
||||
|
||||
if ( ! wpf.empty( recommendedDocs ) ) {
|
||||
resultHTML += tmpl( {
|
||||
docs: recommendedDocs,
|
||||
} );
|
||||
}
|
||||
|
||||
if ( ! wpf.empty( filteredDocs ) ) {
|
||||
resultHTML += tmpl( {
|
||||
docs: filteredDocs,
|
||||
} );
|
||||
}
|
||||
|
||||
el.$noResult.toggle( resultHTML === '' && term !== '' );
|
||||
|
||||
el.$result.html( resultHTML );
|
||||
|
||||
el.$help[0].scrollTop = 0;
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove duplicated items in the filtered docs.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {Array} recommendedDocs Recommended docs.
|
||||
* @param {Array} filteredDocs Filtered docs.
|
||||
*
|
||||
* @returns {Array} Filtered docs without duplicated items in the recommended docs.
|
||||
*/
|
||||
removeDuplicates: function( recommendedDocs, filteredDocs ) {
|
||||
|
||||
if ( wpf.empty( recommendedDocs ) || wpf.empty( filteredDocs ) ) {
|
||||
return filteredDocs;
|
||||
}
|
||||
|
||||
var docs = [];
|
||||
|
||||
for ( var i = 0; i < recommendedDocs.length, i++; ) {
|
||||
for ( var k = 0; k < filteredDocs.length, k++; ) {
|
||||
if ( filteredDocs[ k ].url !== recommendedDocs[ i ].url ) {
|
||||
docs.push( filteredDocs[ k ] );
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return docs;
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear search field.
|
||||
*
|
||||
* @since 1.6.3
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
clearSearch: function( e ) {
|
||||
|
||||
el.$search.find( 'input' ).val( '' ).trigger( 'keyup' );
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
}( document, window, jQuery ) );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.Help.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/help.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/help.min.js
vendored
Normal file
@@ -0,0 +1 @@
|
||||
"use strict";var WPForms=window.WPForms||{};WPForms.Admin=WPForms.Admin||{},WPForms.Admin.Builder=WPForms.Admin.Builder||{},WPForms.Admin.Builder.Help=WPForms.Admin.Builder.Help||function(l){var n,p={init:function(){l(p.ready)},ready:function(){p.setup(),p.initCategories(),p.events()},setup:function(){n={$builder:l("#wpforms-builder"),$builderForm:l("#wpforms-builder-form"),$helpBtn:l("#wpforms-help"),$help:l("#wpforms-builder-help"),$closeBtn:l("#wpforms-builder-help-close"),$search:l("#wpforms-builder-help-search"),$result:l("#wpforms-builder-help-result"),$noResult:l("#wpforms-builder-help-no-result"),$categories:l("#wpforms-builder-help-categories"),$footer:l("#wpforms-builder-help-footer")}},events:function(){n.$helpBtn.on("click",a.openHelp),n.$closeBtn.on("click",a.closeHelp),n.$categories.on("click",".wpforms-builder-help-category header",a.toggleCategory),n.$categories.on("click",".wpforms-builder-help-category button.viewall",a.viewAllCategoryDocs),n.$search.on("keyup","input",_.debounce(a.inputSearch,250)),n.$search.on("click","#wpforms-builder-help-search-clear",a.clearSearch)},initCategories:function(){var e,r;wpf.empty(wpforms_builder_help.docs)?n.$categories.html(wp.template("wpforms-builder-help-categories-error")):(e=wp.template("wpforms-builder-help-categories"),r={categories:wpforms_builder_help.categories,docs:p.getDocsByCategories()},n.$categories.html(e(r)))},getDocsByCategories:function(){var e=wpforms_builder_help.categories,o=wpforms_builder_help.docs||[],i={};return _.each(e,function(e,r){var t=[];_.each(o,function(e){e.categories&&-1<e.categories.indexOf(r)&&t.push(e)}),i[r]=t}),i},getRecommendedDocs:function(e){if(wpf.empty(e))return[];e=e.toLowerCase();var r=wpforms_builder_help.docs,t=[];return wpf.empty(wpforms_builder_help.context.docs[e])?[]:(_.each(wpforms_builder_help.context.docs[e],function(e){wpf.empty(r[e])||t.push(r[e])}),t)},getFilteredDocs:function(r){var e,t;return wpf.empty(r)?[]:(e=wpforms_builder_help.docs,t=[],r=r.toLowerCase(),_.each(e,function(e){e.title&&-1<e.title.toLowerCase().indexOf(r)&&t.push(e)}),t)},getBuilderContext:function(){if(wpf.empty(n.$builderForm.data("id")))return"new_form";var e=n.$builder.find("#wpforms-panels-toggle button.active").data("panel"),r=n.$builder.find("#wpforms-panel-"+e),t="",o="";switch(e){case"fields":t=r.find(".wpforms-panel-sidebar .wpforms-tab a.active").parent().attr("id");break;case"setup":t="";break;default:t=r.find(".wpforms-panel-sidebar a.active").data("section")}return[e,t=wpf.empty(t)?"":t.replace(/-/g,"_"),o="field_options"===t?r.find("#wpforms-field-options .wpforms-field-option:visible .wpforms-field-option-hidden-type").val():o].filter(function(e){return!wpf.empty(e)&&"default"!==e}).join("/")},getBuilderContextTerm:function(){return wpforms_builder_help.context.terms[p.getBuilderContext()]||""}},o={config:{speed:300},fadeIn:function(e){e.length&&(e.css({display:"",transition:`opacity ${o.config.speed}ms ease-in 0s`}),setTimeout(function(){e.css("opacity","1")},0))},fadeOut:function(e){e.length&&(e.css({opacity:"0",transition:`opacity ${o.config.speed}ms ease-in 0s`}),setTimeout(function(){e.css("display","none")},o.config.speed))},collapseAllCategories:function(){n.$categories.find(".wpforms-builder-help-category").removeClass("opened"),n.$categories.find(".wpforms-builder-help-docs").slideUp()}},a={openHelp:function(e){e.preventDefault();var e=n.$categories.find(".wpforms-builder-help-category").first(),r=p.getBuilderContextTerm();""!==r||e.hasClass("opened")?o.collapseAllCategories():e.find("header").first().trigger("click"),n.$search.find("input").val(r).trigger("keyup"),o.fadeIn(n.$help),setTimeout(function(){o.fadeIn(n.$result),o.fadeIn(n.$categories),o.fadeIn(n.$footer)},o.config.speed)},closeHelp:function(e){e.preventDefault(),o.fadeOut(n.$result),o.fadeOut(n.$categories),o.fadeOut(n.$footer),o.fadeOut(n.$help)},toggleCategory:function(e){var r=l(this).parent(),t=r.find(".wpforms-builder-help-docs");t.is(":visible")?r.removeClass("opened"):r.addClass("opened"),t.stop().slideToggle(o.config.speed)},viewAllCategoryDocs:function(e){var r=l(this);r.prev("div").stop().slideToggle(o.config.speed,function(){r.closest(".wpforms-builder-help-category").addClass("viewall")}),o.fadeOut(r),r.slideUp()},inputSearch:function(e){var r=l(this).val(),t=wp.template("wpforms-builder-help-docs"),o=p.getRecommendedDocs(r),i=a.removeDuplicates(o,p.getFilteredDocs(r)),s="";n.$search.toggleClass("wpforms-empty",!r),wpf.empty(o)||(s+=t({docs:o})),wpf.empty(i)||(s+=t({docs:i})),n.$noResult.toggle(""===s&&""!==r),n.$result.html(s),n.$help[0].scrollTop=0},removeDuplicates:function(e,r){if(wpf.empty(e)||wpf.empty(r))return r;for(var t=[],o=0;e.length,o++;)for(var i=0;r.length,i++;)r[i].url!==e[o].url&&t.push(r[i]);return t},clearSearch:function(e){n.$search.find("input").val("").trigger("keyup")}};return p}((document,window,jQuery)),WPForms.Admin.Builder.Help.init();
|
||||
@@ -0,0 +1,988 @@
|
||||
/* global wpforms_builder, wpforms_builder_providers, wpf */
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
/**
|
||||
* WPForms Providers module.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*/
|
||||
WPForms.Admin.Builder.Providers = WPForms.Admin.Builder.Providers || ( function( document, window, $ ) {
|
||||
|
||||
'use strict';
|
||||
|
||||
/**
|
||||
* Private functions and properties.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
var __private = {
|
||||
|
||||
/**
|
||||
* Internal cache storage, do not use it directly, but app.cache.{(get|set|delete|clear)()} instead.
|
||||
* Key is the provider slug, value is a Map, that will have its own key as a connection id (or not).
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {Object.<string, Map>}
|
||||
*/
|
||||
cache: {},
|
||||
|
||||
/**
|
||||
* Config contains all configuration properties.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {Object.<string, *>}
|
||||
*/
|
||||
config: {
|
||||
|
||||
/**
|
||||
* List of default templates that should be compiled.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {string[]}
|
||||
*/
|
||||
templates: [
|
||||
'wpforms-providers-builder-content-connection-fields',
|
||||
'wpforms-providers-builder-content-connection-conditionals',
|
||||
],
|
||||
},
|
||||
|
||||
/**
|
||||
* Form fields for the current state.
|
||||
*
|
||||
* @since 1.6.1.2
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
fields: {},
|
||||
};
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
var app = {
|
||||
|
||||
/**
|
||||
* Panel holder.
|
||||
*
|
||||
* @since 1.5.9
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
panelHolder: {},
|
||||
|
||||
/**
|
||||
* Form holder.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
form: $( '#wpforms-builder-form' ),
|
||||
|
||||
/**
|
||||
* Spinner HTML.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
spinner: '<i class="wpforms-loading-spinner wpforms-loading-inline"></i>',
|
||||
|
||||
/**
|
||||
* All ajax requests are grouped together with own properties.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*/
|
||||
ajax: {
|
||||
|
||||
/**
|
||||
* Merge custom AJAX data object with defaults.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {object} custom Ajax data object with custom settings.
|
||||
*
|
||||
* @returns {object} Ajax data.
|
||||
*/
|
||||
_mergeData: function( provider, custom ) {
|
||||
|
||||
var data = {
|
||||
id: app.form.data( 'id' ),
|
||||
// eslint-disable-next-line camelcase
|
||||
revision_id: app.form.data( 'revision' ),
|
||||
nonce: wpforms_builder.nonce,
|
||||
action: 'wpforms_builder_provider_ajax_' + provider,
|
||||
};
|
||||
|
||||
$.extend( data, custom );
|
||||
|
||||
return data;
|
||||
},
|
||||
|
||||
/**
|
||||
* Make an AJAX request. It's basically a wrapper around jQuery.ajax, but with some defaults.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {*} custom Object of user-defined $.ajax()-compatible parameters.
|
||||
*
|
||||
* @return {Promise}
|
||||
*/
|
||||
request: function( provider, custom ) {
|
||||
|
||||
var $holder = app.getProviderHolder( provider ),
|
||||
$lock = $holder.find( '.wpforms-builder-provider-connections-save-lock' ),
|
||||
$error = $holder.find( '.wpforms-builder-provider-connections-error' );
|
||||
|
||||
var params = {
|
||||
url: wpforms_builder.ajax_url,
|
||||
type: 'post',
|
||||
dataType: 'json',
|
||||
beforeSend: function() {
|
||||
|
||||
$holder.addClass( 'loading' );
|
||||
$lock.val( 1 );
|
||||
$error.hide();
|
||||
},
|
||||
};
|
||||
|
||||
custom.data = app.ajax._mergeData( provider, custom.data || {} );
|
||||
$.extend( params, custom );
|
||||
|
||||
return $.ajax( params )
|
||||
.fail( function( jqXHR, textStatus, errorThrown ) {
|
||||
|
||||
/*
|
||||
* Right now we are logging into browser console.
|
||||
* In future that might be something better.
|
||||
*/
|
||||
console.error( 'provider:', provider );
|
||||
console.error( jqXHR );
|
||||
console.error( textStatus );
|
||||
|
||||
$lock.val( 1 );
|
||||
$error.show();
|
||||
} )
|
||||
.always( function( dataOrjqXHR, textStatus, jqXHROrerrorThrown ) {
|
||||
|
||||
$holder.removeClass( 'loading' );
|
||||
|
||||
if ( 'success' === textStatus ) {
|
||||
$lock.val( 0 );
|
||||
}
|
||||
} );
|
||||
},
|
||||
},
|
||||
|
||||
/**
|
||||
* Temporary in-memory cache handling for all providers.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*/
|
||||
cache: {
|
||||
|
||||
/**
|
||||
* Get the value from cache by key.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {string} key Cache key.
|
||||
*
|
||||
* @returns {*} Null if some error occurs.
|
||||
*/
|
||||
get: function( provider, key ) {
|
||||
|
||||
if (
|
||||
typeof __private.cache[ provider ] === 'undefined' ||
|
||||
! ( __private.cache[ provider ] instanceof Map )
|
||||
) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return __private.cache[ provider ].get( key );
|
||||
},
|
||||
|
||||
/**
|
||||
* Get the value from cache by key and an ID.
|
||||
* Useful when Object is stored under key, and we need specific value.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {string} key Cache key.
|
||||
* @param {string} id Cached object ID.
|
||||
*
|
||||
* @returns {*} Null if some error occurs.
|
||||
*/
|
||||
getById: function( provider, key, id ) {
|
||||
|
||||
if ( typeof this.get( provider, key )[ id ] === 'undefined' ) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return this.get( provider, key )[ id ];
|
||||
},
|
||||
|
||||
/**
|
||||
* Save the data to cache.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {string} key Intended to be a string, but can be everything that Map supports as a key.
|
||||
* @param {*} value Data you want to save in cache.
|
||||
*
|
||||
* @returns {Map} All the cache for the provider. IE11 returns 'undefined' for an undefined reason.
|
||||
*/
|
||||
set: function( provider, key, value ) {
|
||||
|
||||
if (
|
||||
typeof __private.cache[ provider ] === 'undefined' ||
|
||||
! ( __private.cache[ provider ] instanceof Map )
|
||||
) {
|
||||
__private.cache[ provider ] = new Map();
|
||||
}
|
||||
|
||||
return __private.cache[ provider ].set( key, value );
|
||||
},
|
||||
|
||||
/**
|
||||
* Add the data to cache to a particular key.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @example app.cache.as('provider').addTo('connections', connection_id, connection);
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {string} key Intended to be a string, but can be everything that Map supports as a key.
|
||||
* @param {string} id ID for a value that should be added to a certain key.
|
||||
* @param {*} value Data you want to save in cache.
|
||||
*
|
||||
* @returns {Map} All the cache for the provider. IE11 returns 'undefined' for an undefined reason.
|
||||
*/
|
||||
addTo: function( provider, key, id, value ) {
|
||||
|
||||
if (
|
||||
typeof __private.cache[ provider ] === 'undefined' ||
|
||||
! ( __private.cache[ provider ] instanceof Map )
|
||||
) {
|
||||
__private.cache[ provider ] = new Map();
|
||||
this.set( provider, key, {} );
|
||||
}
|
||||
|
||||
var data = this.get( provider, key );
|
||||
data[ id ] = value;
|
||||
|
||||
return this.set(
|
||||
provider,
|
||||
key,
|
||||
data
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* Delete the cache by key.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {string} key Cache key.
|
||||
*
|
||||
* @returns boolean|null True on success, null on data holder failure, false on error.
|
||||
*/
|
||||
delete: function( provider, key ) {
|
||||
|
||||
if (
|
||||
typeof __private.cache[ provider ] === 'undefined' ||
|
||||
! ( __private.cache[ provider ] instanceof Map )
|
||||
) {
|
||||
return null;
|
||||
}
|
||||
|
||||
return __private.cache[ provider ].delete( key );
|
||||
},
|
||||
|
||||
/**
|
||||
* Delete particular data from a certain key.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @example app.cache.as('provider').deleteFrom('connections', connection_id);
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {string} key Intended to be a string, but can be everything that Map supports as a key.
|
||||
* @param {string} id ID for a value that should be deleted from a certain key.
|
||||
*
|
||||
* @returns {Map} All the cache for the provider. IE11 returns 'undefined' for an undefined reason.
|
||||
*/
|
||||
deleteFrom: function( provider, key, id ) {
|
||||
|
||||
if (
|
||||
typeof __private.cache[ provider ] === 'undefined' ||
|
||||
! ( __private.cache[ provider ] instanceof Map )
|
||||
) {
|
||||
return null;
|
||||
}
|
||||
|
||||
var data = this.get( provider, key );
|
||||
|
||||
delete data[ id ];
|
||||
|
||||
return this.set(
|
||||
provider,
|
||||
key,
|
||||
data
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear all the cache data.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
*/
|
||||
clear: function( provider ) {
|
||||
|
||||
if (
|
||||
typeof __private.cache[ provider ] === 'undefined' ||
|
||||
! ( __private.cache[ provider ] instanceof Map )
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
__private.cache[ provider ].clear();
|
||||
},
|
||||
},
|
||||
|
||||
/**
|
||||
* Start the engine. DOM is not ready yet, use only to init something.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
// Do that when DOM is ready.
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
* Should be hooked into in addons, that need to work with DOM, templates etc.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.6.1.2 Added initialization for `__private.fields` property.
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
// Save a current form fields state.
|
||||
__private.fields = $.extend( {}, wpf.getFields( false, true ) );
|
||||
|
||||
app.panelHolder = $( '#wpforms-panel-providers, #wpforms-panel-settings' );
|
||||
|
||||
app.Templates = WPForms.Admin.Builder.Templates;
|
||||
app.Templates.add( __private.config.templates );
|
||||
|
||||
app.bindActions();
|
||||
app.ui.bindActions();
|
||||
|
||||
app.panelHolder.trigger( 'WPForms.Admin.Builder.Providers.ready' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Process all generic actions/events, mostly custom that were fired by our API.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.6.1.2 Added a calling `app.updateMapSelects()` method.
|
||||
*/
|
||||
bindActions: function() {
|
||||
|
||||
// On Form save - notify user about required fields.
|
||||
$( document ).on( 'wpformsSaved', function() {
|
||||
|
||||
var $connectionBlocks = app.panelHolder.find( '.wpforms-builder-provider-connection' );
|
||||
|
||||
if ( ! $connectionBlocks.length ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// We need to show him "Required fields empty" popup only once.
|
||||
var isShownOnce = false;
|
||||
|
||||
$connectionBlocks.each( function() {
|
||||
|
||||
var isRequiredEmpty = false;
|
||||
|
||||
// Do the actual required fields check.
|
||||
$( this ).find( 'input.wpforms-required, select.wpforms-required, textarea.wpforms-required' ).each( function() {
|
||||
|
||||
const $this = $( this ),
|
||||
value = $this.val();
|
||||
|
||||
if ( _.isEmpty( value ) && ! $this.closest( '.wpforms-builder-provider-connection-block' ).hasClass( 'wpforms-hidden' ) ) {
|
||||
$( this ).addClass( 'wpforms-error' );
|
||||
isRequiredEmpty = true;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
$( this ).removeClass( 'wpforms-error' );
|
||||
} );
|
||||
|
||||
// Notify user.
|
||||
if ( isRequiredEmpty && ! isShownOnce ) {
|
||||
var $titleArea = $( this ).closest( '.wpforms-builder-provider' ).find( '.wpforms-builder-provider-title' ).clone();
|
||||
$titleArea.find( 'button' ).remove();
|
||||
var msg = wpforms_builder.provider_required_flds;
|
||||
|
||||
$.alert( {
|
||||
title: wpforms_builder.heads_up,
|
||||
content: msg.replace( '{provider}', '<strong>' + $titleArea.text().trim() + '</strong>' ),
|
||||
icon: 'fa fa-exclamation-circle',
|
||||
type: 'orange',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.ok,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
},
|
||||
},
|
||||
} );
|
||||
|
||||
// Save that we have already showed the user, so we won't bug it anymore.
|
||||
isShownOnce = true;
|
||||
}
|
||||
} );
|
||||
|
||||
// On "Fields" page additional update provider's field mapped items.
|
||||
if ( 'fields' === wpf.getQueryString( 'view' ) ) {
|
||||
app.updateMapSelects( $connectionBlocks );
|
||||
}
|
||||
} );
|
||||
|
||||
/*
|
||||
* Update form state when each connection is loaded into the DOM.
|
||||
* This will prevent a please-save-prompt to appear, when navigating
|
||||
* out and back to Marketing tab without doing any changes anywhere.
|
||||
*/
|
||||
app.panelHolder.on( 'connectionRendered', function() {
|
||||
|
||||
if ( wpf.initialSave === true ) {
|
||||
wpf.savedState = wpf.getFormState( '#wpforms-builder-form' );
|
||||
}
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Update selects for mapping if any form fields was added, deleted or changed.
|
||||
*
|
||||
* @since 1.6.1.2
|
||||
*
|
||||
* @param {object} $connections jQuery selector for active connections.
|
||||
*/
|
||||
updateMapSelects: function( $connections ) {
|
||||
|
||||
var fields = $.extend( {}, wpf.getFields() ),
|
||||
currentSaveFields,
|
||||
prevSaveFields;
|
||||
|
||||
// We should to detect changes for labels only.
|
||||
currentSaveFields = _.mapObject( fields, function( field, key ) {
|
||||
|
||||
return field.label;
|
||||
} );
|
||||
prevSaveFields = _.mapObject( __private.fields, function( field, key ) {
|
||||
|
||||
return field.label;
|
||||
} );
|
||||
|
||||
// Check if form has any fields and if they have changed labels after previous saving process.
|
||||
if (
|
||||
( _.isEmpty( currentSaveFields ) && _.isEmpty( prevSaveFields ) ) ||
|
||||
( JSON.stringify( currentSaveFields ) === JSON.stringify( prevSaveFields ) )
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Prepare a current form field IDs.
|
||||
var fieldIds = Object.keys( currentSaveFields )
|
||||
.map( function( id ) {
|
||||
|
||||
return parseInt( id, 10 );
|
||||
} );
|
||||
|
||||
// Determine deleted field IDs - it's a diff between previous and current form state.
|
||||
var deleted = Object.keys( prevSaveFields )
|
||||
.map( function( id ) {
|
||||
|
||||
return parseInt( id, 10 );
|
||||
} )
|
||||
.filter( function( id ) {
|
||||
|
||||
return ! fieldIds.includes( id );
|
||||
} );
|
||||
|
||||
// Remove from mapping selects "deleted" fields.
|
||||
for ( var index = 0; index < deleted.length; index++ ) {
|
||||
$( '.wpforms-builder-provider-connection-fields-table .wpforms-builder-provider-connection-field-value option[value="' + deleted[ index ] + '"]', $connections ).remove();
|
||||
}
|
||||
|
||||
var label, $exists;
|
||||
for ( var id in fields ) {
|
||||
|
||||
// Prepare the label.
|
||||
if ( typeof fields[ id ].label !== 'undefined' && fields[ id ].label.toString().trim() !== '' ) {
|
||||
label = wpf.sanitizeHTML( fields[ id ].label.toString().trim() );
|
||||
} else {
|
||||
label = wpforms_builder.field + ' #' + id;
|
||||
}
|
||||
|
||||
// Try to find all select options by value.
|
||||
$exists = $( '.wpforms-builder-provider-connection-fields-table .wpforms-builder-provider-connection-field-value option[value="' + id + '"]', $connections );
|
||||
|
||||
// If no option was found - add a new one for all selects.
|
||||
if ( ! $exists.length ) {
|
||||
$( '.wpforms-builder-provider-connection-fields-table .wpforms-builder-provider-connection-field-value', $connections ).append( $( '<option>', { value: id, text: label } ) );
|
||||
continue;
|
||||
}
|
||||
|
||||
// Update a field label if a previous and current labels not equal.
|
||||
if ( wpf.sanitizeHTML( fields[ id ].label ) !== wpf.sanitizeHTML( prevSaveFields[ id ] ) ) {
|
||||
$exists.text( label );
|
||||
}
|
||||
}
|
||||
|
||||
// If selects for mapping was changed, that whole form state was changed as well.
|
||||
// That's why we need to re-save it.
|
||||
if ( wpf.savedState !== wpf.getFormState( '#wpforms-builder-form' ) ) {
|
||||
wpf.savedState = wpf.getFormState( '#wpforms-builder-form' );
|
||||
}
|
||||
|
||||
// Save form fields state for next saving process.
|
||||
__private.fields = fields;
|
||||
|
||||
app.panelHolder.trigger( 'WPForms.Admin.Builder.Providers.updatedMapSelects', [ $connections, fields ] );
|
||||
},
|
||||
|
||||
/**
|
||||
* All methods that modify UI of a page.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*/
|
||||
ui: {
|
||||
|
||||
/**
|
||||
* Process UI related actions/events: click, change etc. - that are triggered from UI.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*/
|
||||
bindActions: function() {
|
||||
|
||||
// CONNECTION: ADD/DELETE.
|
||||
app.panelHolder
|
||||
.on( 'click', '.js-wpforms-builder-provider-account-add', function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
app.ui.account.setProvider( $( this ).data( 'provider' ) );
|
||||
app.ui.account.add();
|
||||
} )
|
||||
.on( 'click', '.js-wpforms-builder-provider-connection-add', function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
app.ui.connectionAdd( $( this ).data( 'provider' ) );
|
||||
} )
|
||||
.on( 'click', '.js-wpforms-builder-provider-connection-delete', function( e ) {
|
||||
|
||||
var $btn = $( this );
|
||||
|
||||
e.preventDefault();
|
||||
app.ui.connectionDelete(
|
||||
$btn.closest( '.wpforms-builder-provider' ).data( 'provider' ),
|
||||
$btn.closest( '.wpforms-builder-provider-connection' )
|
||||
);
|
||||
} );
|
||||
|
||||
// CONNECTION: FIELDS - ADD/DELETE.
|
||||
app.panelHolder
|
||||
.on( 'click', '.js-wpforms-builder-provider-connection-fields-add', function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
var $table = $( this ).parents( '.wpforms-builder-provider-connection-fields-table' ),
|
||||
$clone = $table.find( 'tr' ).last().clone( true ),
|
||||
nextID = parseInt( /\[.+]\[.+]\[.+]\[(\d+)]/.exec( $clone.find( '.wpforms-builder-provider-connection-field-name' ).attr( 'name' ) )[ 1 ], 10 ) + 1;
|
||||
|
||||
// Clear the row and increment the counter.
|
||||
$clone.find( '.wpforms-builder-provider-connection-field-name' )
|
||||
.attr( 'name', $clone.find( '.wpforms-builder-provider-connection-field-name' ).attr( 'name' ).replace( /\[fields_meta\]\[(\d+)\]/g, '[fields_meta][' + nextID + ']' ) )
|
||||
.val( '' );
|
||||
$clone.find( '.wpforms-builder-provider-connection-field-value' )
|
||||
.attr( 'name', $clone.find( '.wpforms-builder-provider-connection-field-value' ).attr( 'name' ).replace( /\[fields_meta\]\[(\d+)\]/g, '[fields_meta][' + nextID + ']' ) )
|
||||
.val( '' );
|
||||
|
||||
// Re-enable "delete" button.
|
||||
$clone.find( '.js-wpforms-builder-provider-connection-fields-delete' ).removeClass( 'hidden' );
|
||||
|
||||
// Put it back to the table.
|
||||
$table.find( 'tbody' ).append( $clone.get( 0 ) );
|
||||
} )
|
||||
.on( 'click', '.js-wpforms-builder-provider-connection-fields-delete', function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
var $row = $( this ).parents( '.wpforms-builder-provider-connection-fields-table tr' );
|
||||
|
||||
$row.remove();
|
||||
} );
|
||||
|
||||
// CONNECTION: Generated.
|
||||
app.panelHolder.on( 'connectionGenerated', function( e, data ) {
|
||||
|
||||
wpf.initTooltips();
|
||||
|
||||
// Hide provider default settings screen.
|
||||
$( this )
|
||||
.find( '.wpforms-builder-provider-connection[data-connection_id="' + data.connection.id + '"]' )
|
||||
.closest( '.wpforms-panel-content-section' )
|
||||
.find( '.wpforms-builder-provider-connections-default' )
|
||||
.addClass( 'wpforms-hidden' );
|
||||
} );
|
||||
|
||||
// CONNECTION: Rendered.
|
||||
app.panelHolder.on( 'connectionRendered', function( e, provider, connectionId ) {
|
||||
|
||||
wpf.initTooltips();
|
||||
|
||||
// Some our addons have another arguments for this trigger.
|
||||
// We will fix it asap.
|
||||
if ( typeof connectionId === 'undefined' ) {
|
||||
if ( ! _.isObject( provider ) || ! _.has( provider, 'connection_id' ) ) {
|
||||
return;
|
||||
}
|
||||
connectionId = provider.connection_id;
|
||||
}
|
||||
|
||||
// If connection has mapped select fields - call `wpformsFieldUpdate` trigger.
|
||||
if ( $( this ).find( '.wpforms-builder-provider-connection[data-connection_id="' + connectionId + '"] .wpforms-field-map-select' ).length ) {
|
||||
wpf.fieldUpdate();
|
||||
}
|
||||
} );
|
||||
|
||||
// Remove error class in required fields if a value is supplied.
|
||||
app.panelHolder.on( 'change', '.wpforms-builder-provider select.wpforms-required', function() {
|
||||
|
||||
const $this = $( this );
|
||||
|
||||
if ( ! $this.hasClass( 'wpforms-error' ) || $this.val().length === 0 ) {
|
||||
return;
|
||||
}
|
||||
|
||||
$this.removeClass( 'wpforms-error' );
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Add a connection to a page.
|
||||
* This is a multistep process, where the 1st step is always the same for all providers.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
*/
|
||||
connectionAdd: function( provider ) {
|
||||
|
||||
$.confirm( {
|
||||
title: false,
|
||||
content: wpforms_builder_providers.prompt_connection.replace( /%type%/g, 'connection' ) +
|
||||
'<input autofocus="" type="text" id="wpforms-builder-provider-connection-name" placeholder="' + wpforms_builder_providers.prompt_placeholder + '">' +
|
||||
'<p class="error">' + wpforms_builder_providers.error_name + '</p>',
|
||||
icon: 'fa fa-info-circle',
|
||||
type: 'blue',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.ok,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
action: function() {
|
||||
|
||||
var name = this.$content.find( '#wpforms-builder-provider-connection-name' ).val().trim(),
|
||||
error = this.$content.find( '.error' );
|
||||
|
||||
if ( name === '' ) {
|
||||
error.show();
|
||||
return false;
|
||||
|
||||
} else {
|
||||
app.getProviderHolder( provider ).trigger( 'connectionCreate', [ name ] );
|
||||
}
|
||||
},
|
||||
},
|
||||
cancel: {
|
||||
text: wpforms_builder.cancel,
|
||||
},
|
||||
},
|
||||
} );
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* What to do with UI when connection is deleted.
|
||||
*
|
||||
* @since 1.4.7
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
* @param {object} $connection jQuery DOM element for a connection.
|
||||
*/
|
||||
connectionDelete: function( provider, $connection ) {
|
||||
|
||||
$.confirm( {
|
||||
title: false,
|
||||
content: wpforms_builder_providers.confirm_connection,
|
||||
icon: 'fa fa-exclamation-circle',
|
||||
type: 'orange',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.ok,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
action: function() {
|
||||
|
||||
// We need this BEFORE removing, as some handlers might need DOM element.
|
||||
app.getProviderHolder( provider ).trigger( 'connectionDelete', [ $connection ] );
|
||||
|
||||
var $section = $connection.closest( '.wpforms-panel-content-section' );
|
||||
|
||||
$connection.fadeOut( 'fast', function() {
|
||||
|
||||
$( this ).remove();
|
||||
|
||||
app.getProviderHolder( provider ).trigger( 'connectionDeleted', [ $connection ] );
|
||||
|
||||
if ( ! $section.find( '.wpforms-builder-provider-connection' ).length ) {
|
||||
$section.find( '.wpforms-builder-provider-connections-default' ).removeClass( 'wpforms-hidden' );
|
||||
}
|
||||
} );
|
||||
},
|
||||
},
|
||||
cancel: {
|
||||
text: wpforms_builder.cancel,
|
||||
},
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Account specific methods.
|
||||
*
|
||||
* @since 1.4.8
|
||||
* @since 1.5.8 Added binding `onClose` event.
|
||||
*/
|
||||
account: {
|
||||
|
||||
/**
|
||||
* Current provider in the context of account creation.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @param {string}
|
||||
*/
|
||||
provider: '',
|
||||
|
||||
/**
|
||||
* Preserve a list of action to perform when new account creation form is submitted.
|
||||
* Provider specific.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @param {Array<string, callable>}
|
||||
*/
|
||||
submitHandlers: [],
|
||||
|
||||
/**
|
||||
* Set the account specific provider.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @param {string} provider Provider slug.
|
||||
*/
|
||||
setProvider: function( provider ) {
|
||||
this.provider = provider;
|
||||
},
|
||||
|
||||
/**
|
||||
* Add an account for provider.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*/
|
||||
add: function() {
|
||||
|
||||
var account = this;
|
||||
|
||||
$.confirm( {
|
||||
title: false,
|
||||
smoothContent: true,
|
||||
content: function() {
|
||||
|
||||
var modal = this;
|
||||
|
||||
return app.ajax
|
||||
.request( account.provider, {
|
||||
data: {
|
||||
task: 'account_template_get',
|
||||
},
|
||||
} )
|
||||
.done( function( response ) {
|
||||
|
||||
if ( ! response.success ) {
|
||||
return;
|
||||
}
|
||||
|
||||
if ( response.data.title.length ) {
|
||||
modal.setTitle( response.data.title );
|
||||
}
|
||||
|
||||
if ( response.data.content.length ) {
|
||||
modal.setContent( response.data.content );
|
||||
}
|
||||
|
||||
if ( response.data.type.length ) {
|
||||
modal.setType( response.data.type );
|
||||
}
|
||||
|
||||
app.getProviderHolder( account.provider ).trigger( 'accountAddModal.content.done', [ modal, account.provider, response ] );
|
||||
} )
|
||||
.fail( function() {
|
||||
app.getProviderHolder( account.provider ).trigger( 'accountAddModal.content.fail', [ modal, account.provider ] );
|
||||
} )
|
||||
.always( function() {
|
||||
app.getProviderHolder( account.provider ).trigger( 'accountAddModal.content.always', [ modal, account.provider ] );
|
||||
} );
|
||||
},
|
||||
contentLoaded: function( data, status, xhr ) {
|
||||
|
||||
var modal = this;
|
||||
|
||||
// Data is already set in content.
|
||||
this.buttons.add.enable();
|
||||
this.buttons.cancel.enable();
|
||||
|
||||
app.getProviderHolder( account.provider ).trigger( 'accountAddModal.contentLoaded', [ modal ] );
|
||||
},
|
||||
onOpenBefore: function() { // Before the modal is displayed.
|
||||
|
||||
var modal = this;
|
||||
|
||||
modal.buttons.add.disable();
|
||||
modal.buttons.cancel.disable();
|
||||
modal.$body.addClass( 'wpforms-providers-account-add-modal' );
|
||||
|
||||
app.getProviderHolder( account.provider ).trigger( 'accountAddModal.onOpenBefore', [ modal ] );
|
||||
},
|
||||
onClose: function() { // Before the modal is hidden.
|
||||
|
||||
// If an account was configured successfully - show a modal with adding a new connection.
|
||||
if ( true === app.ui.account.isConfigured( account.provider ) ) {
|
||||
app.ui.connectionAdd( account.provider );
|
||||
}
|
||||
},
|
||||
icon: 'fa fa-info-circle',
|
||||
type: 'blue',
|
||||
buttons: {
|
||||
add: {
|
||||
text: wpforms_builder.provider_add_new_acc_btn,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
action: function() {
|
||||
var modal = this;
|
||||
|
||||
app.getProviderHolder( account.provider ).trigger( 'accountAddModal.buttons.add.action.before', [ modal ] );
|
||||
|
||||
if (
|
||||
! _.isEmpty( account.provider ) &&
|
||||
typeof account.submitHandlers[ account.provider ] !== 'undefined'
|
||||
) {
|
||||
return account.submitHandlers[ account.provider ]( modal );
|
||||
}
|
||||
},
|
||||
},
|
||||
cancel: {
|
||||
text: wpforms_builder.cancel,
|
||||
},
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Register a template for Add New Account modal window.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*/
|
||||
registerAddHandler: function( provider, handler ) {
|
||||
|
||||
if ( typeof provider === 'string' && typeof handler === 'function' ) {
|
||||
this.submitHandlers[ provider ] = handler;
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Check whether the defined provider is configured or not.
|
||||
*
|
||||
* @since 1.5.8
|
||||
* @since 1.5.9 Added a new parameter - provider.
|
||||
*
|
||||
* @param {string} provider Current provider slug.
|
||||
*
|
||||
* @returns {boolean} Account status.
|
||||
*/
|
||||
isConfigured: function( provider ) {
|
||||
|
||||
// Check if `Add New Account` button is hidden.
|
||||
return app.getProviderHolder( provider ).find( '.js-wpforms-builder-provider-account-add' ).hasClass( 'hidden' );
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
/**
|
||||
* Get a jQuery DOM object, that has all the provider-related DOM inside.
|
||||
*
|
||||
* @since 1.4.7
|
||||
*
|
||||
* @returns {object} jQuery DOM element.
|
||||
*/
|
||||
getProviderHolder: function( provider ) {
|
||||
return $( '#' + provider + '-provider' );
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
}( document, window, jQuery ) );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.Providers.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/providers.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/providers.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -0,0 +1,206 @@
|
||||
/**
|
||||
* WPForms Builder Search module.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.Search = WPForms.Admin.Builder.Search || ( function( document, window, $ ) {
|
||||
|
||||
/**
|
||||
* Elements holder.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
const el = {};
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
const app = {
|
||||
|
||||
/**
|
||||
* Start the engine. DOM is not ready yet, use only to init something.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
app.setup();
|
||||
app.events();
|
||||
app.scrollSidebar();
|
||||
},
|
||||
|
||||
/**
|
||||
* Scroll the sidebar to the height of the search.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
scrollSidebar: function() {
|
||||
|
||||
el.$sidebar.scrollTop( el.$searchWrapper.height() + 20 );
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup. Prepare some variables.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
setup: function() {
|
||||
|
||||
// Cache DOM elements
|
||||
el.$document = $( document );
|
||||
el.$builder = $( '#wpforms-builder' );
|
||||
el.$searchInput = $( '#wpforms-search-fields-input' );
|
||||
el.$searchInputCloseBtn = $( '.wpforms-search-fields-input-close' );
|
||||
el.$searchWrapper = $( '.wpforms-search-fields-wrapper' );
|
||||
el.$noResults = $( '.wpforms-search-fields-no-results' );
|
||||
el.$listWrapper = $( '.wpforms-search-fields-list' );
|
||||
el.$list = $( '.wpforms-search-fields-list .wpforms-add-fields-buttons' );
|
||||
el.$groups = $( '.wpforms-tab-content > .wpforms-add-fields-group' );
|
||||
el.$sidebar = $( '#wpforms-panel-fields .wpforms-add-fields' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
events: function() {
|
||||
|
||||
el.$searchInput.on( 'keyup', app.searchAction );
|
||||
el.$searchInputCloseBtn.on( 'click', app.clearSearch );
|
||||
el.$document.on( 'wpformsFieldAdd', app.clearSearch );
|
||||
el.$document.on( 'wpformsFieldDelete', app.refreshSearchResults );
|
||||
},
|
||||
|
||||
/**
|
||||
* Search action.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
searchAction: function() {
|
||||
|
||||
const $fields = el.$builder.find( '.wpforms-tab-content > .wpforms-add-fields-group .wpforms-add-fields-button' );
|
||||
const searchValue = el.$searchInput.val().toLowerCase();
|
||||
|
||||
el.$list.empty();
|
||||
|
||||
if ( searchValue ) {
|
||||
el.$groups.hide();
|
||||
el.$listWrapper.show();
|
||||
el.$searchInputCloseBtn.addClass( 'active' );
|
||||
|
||||
$fields.each( function() {
|
||||
|
||||
const $item = $( this );
|
||||
const titleText = $item.text().toLowerCase();
|
||||
const keywords = $item.data( 'field-keywords' ) ? $item.data( 'field-keywords' ).toLowerCase() : '';
|
||||
|
||||
if ( titleText.indexOf( searchValue ) >= 0 || ( keywords && keywords.indexOf( searchValue ) >= 0 ) ) {
|
||||
const $clone = $item.clone();
|
||||
|
||||
$clone.attr( 'data-target', $clone.attr( 'id' ) );
|
||||
$clone.removeAttr( 'id' );
|
||||
$clone.addClass( 'wpforms-add-fields-button-clone' );
|
||||
|
||||
el.$list.append( $clone );
|
||||
}
|
||||
} );
|
||||
|
||||
const $matchingItems = el.$list.find( '.wpforms-add-fields-button' );
|
||||
const hasMatchingItems = $matchingItems.length > 0;
|
||||
|
||||
if ( hasMatchingItems ) {
|
||||
el.$noResults.hide();
|
||||
} else {
|
||||
el.$noResults.show();
|
||||
el.$listWrapper.hide();
|
||||
}
|
||||
} else {
|
||||
el.$groups.show();
|
||||
el.$listWrapper.hide();
|
||||
el.$noResults.hide();
|
||||
el.$searchInputCloseBtn.removeClass( 'active' );
|
||||
}
|
||||
|
||||
WPForms.Admin.Builder.DragFields.setup();
|
||||
WPForms.Admin.Builder.DragFields.initSortableFields();
|
||||
app.cloneClickAction();
|
||||
},
|
||||
|
||||
/**
|
||||
* Clear search.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
clearSearch: function() {
|
||||
|
||||
if ( ! el.$searchInput.val() ) {
|
||||
return;
|
||||
}
|
||||
|
||||
el.$list.empty();
|
||||
el.$listWrapper.hide();
|
||||
el.$groups.show();
|
||||
el.$noResults.hide();
|
||||
el.$searchInput.val( '' ).focus();
|
||||
el.$searchInputCloseBtn.removeClass( 'active' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Refresh search results.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
refreshSearchResults: function() {
|
||||
|
||||
// We need to wait for the original field to be unlocked.
|
||||
setTimeout( app.searchAction, 0 );
|
||||
},
|
||||
|
||||
/**
|
||||
* Clone click action.
|
||||
*
|
||||
* @since 1.8.3
|
||||
*/
|
||||
cloneClickAction: function() {
|
||||
|
||||
$( '.wpforms-add-fields-button-clone' ).on( 'click', function() {
|
||||
|
||||
const target = $( this ).attr( 'data-target' );
|
||||
|
||||
$( '#' + target ).trigger( 'click' );
|
||||
} );
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
}( document, window, jQuery ) );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.Search.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/search-fields.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/search-fields.min.js
vendored
Normal file
@@ -0,0 +1 @@
|
||||
"use strict";var WPForms=window.WPForms||{};WPForms.Admin=WPForms.Admin||{},WPForms.Admin.Builder=WPForms.Admin.Builder||{},WPForms.Admin.Builder.Search=WPForms.Admin.Builder.Search||function(e,o){const i={},s={init:function(){o(s.ready)},ready:function(){s.setup(),s.events(),s.scrollSidebar()},scrollSidebar:function(){i.$sidebar.scrollTop(i.$searchWrapper.height()+20)},setup:function(){i.$document=o(e),i.$builder=o("#wpforms-builder"),i.$searchInput=o("#wpforms-search-fields-input"),i.$searchInputCloseBtn=o(".wpforms-search-fields-input-close"),i.$searchWrapper=o(".wpforms-search-fields-wrapper"),i.$noResults=o(".wpforms-search-fields-no-results"),i.$listWrapper=o(".wpforms-search-fields-list"),i.$list=o(".wpforms-search-fields-list .wpforms-add-fields-buttons"),i.$groups=o(".wpforms-tab-content > .wpforms-add-fields-group"),i.$sidebar=o("#wpforms-panel-fields .wpforms-add-fields")},events:function(){i.$searchInput.on("keyup",s.searchAction),i.$searchInputCloseBtn.on("click",s.clearSearch),i.$document.on("wpformsFieldAdd",s.clearSearch),i.$document.on("wpformsFieldDelete",s.refreshSearchResults)},searchAction:function(){var e=i.$builder.find(".wpforms-tab-content > .wpforms-add-fields-group .wpforms-add-fields-button");const t=i.$searchInput.val().toLowerCase();i.$list.empty(),t?(i.$groups.hide(),i.$listWrapper.show(),i.$searchInputCloseBtn.addClass("active"),e.each(function(){var e=o(this),s=e.text().toLowerCase(),r=e.data("field-keywords")?e.data("field-keywords").toLowerCase():"";(0<=s.indexOf(t)||r&&0<=r.indexOf(t))&&((s=e.clone()).attr("data-target",s.attr("id")),s.removeAttr("id"),s.addClass("wpforms-add-fields-button-clone"),i.$list.append(s))}),(0<i.$list.find(".wpforms-add-fields-button").length?i.$noResults:(i.$noResults.show(),i.$listWrapper)).hide()):(i.$groups.show(),i.$listWrapper.hide(),i.$noResults.hide(),i.$searchInputCloseBtn.removeClass("active")),WPForms.Admin.Builder.DragFields.setup(),WPForms.Admin.Builder.DragFields.initSortableFields(),s.cloneClickAction()},clearSearch:function(){i.$searchInput.val()&&(i.$list.empty(),i.$listWrapper.hide(),i.$groups.show(),i.$noResults.hide(),i.$searchInput.val("").focus(),i.$searchInputCloseBtn.removeClass("active"))},refreshSearchResults:function(){setTimeout(s.searchAction,0)},cloneClickAction:function(){o(".wpforms-add-fields-button-clone").on("click",function(){var e=o(this).attr("data-target");o("#"+e).trigger("click")})}};return s}(document,(window,jQuery)),WPForms.Admin.Builder.Search.init();
|
||||
@@ -0,0 +1,283 @@
|
||||
/* global wpforms_builder_settings, Choices, wpf */
|
||||
|
||||
/**
|
||||
* Form Builder Settings Panel module.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.Settings = WPForms.Admin.Builder.Settings || ( function( document, window, $ ) {
|
||||
|
||||
/**
|
||||
* Elements holder.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var el = {};
|
||||
|
||||
/**
|
||||
* Runtime variables.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var vars = {};
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var app = {
|
||||
|
||||
/**
|
||||
* Start the engine.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
app.setup();
|
||||
app.initTags();
|
||||
app.events();
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup. Prepare some variables.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
setup: function() {
|
||||
|
||||
// Cache DOM elements.
|
||||
el = {
|
||||
$builder: $( '#wpforms-builder' ),
|
||||
$panel: $( '#wpforms-panel-settings' ),
|
||||
$selectTags: $( '#wpforms-panel-field-settings-form_tags' ),
|
||||
};
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
events: function() {
|
||||
|
||||
el.$panel
|
||||
.on( 'keydown', '#wpforms-panel-field-settings-form_tags-wrap input', app.addCustomTagInput )
|
||||
.on( 'removeItem', '#wpforms-panel-field-settings-form_tags-wrap select', app.editTagsRemoveItem );
|
||||
|
||||
el.$selectTags
|
||||
.on( 'change', app.changeTags );
|
||||
},
|
||||
|
||||
/**
|
||||
* Init Choices.js on the Tags select input element.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
initTags: function() {
|
||||
|
||||
// Skip in certain cases.
|
||||
if (
|
||||
! el.$selectTags.length ||
|
||||
typeof window.Choices !== 'function'
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Init Choices.js object instance.
|
||||
vars.tagsChoicesObj = new Choices( el.$selectTags[0], wpforms_builder_settings.choicesjs_config );
|
||||
|
||||
// Backup current value.
|
||||
var currentValue = vars.tagsChoicesObj.getValue( true );
|
||||
|
||||
// Update all tags choices.
|
||||
vars.tagsChoicesObj
|
||||
.clearStore()
|
||||
.setChoices(
|
||||
wpforms_builder_settings.all_tags_choices,
|
||||
'value',
|
||||
'label',
|
||||
true
|
||||
)
|
||||
.setChoiceByValue( currentValue );
|
||||
|
||||
el.$selectTags.data( 'choicesjs', vars.tagsChoicesObj );
|
||||
|
||||
app.initTagsHiddenInput();
|
||||
},
|
||||
|
||||
/**
|
||||
* Init Tags hidden input element.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*/
|
||||
initTagsHiddenInput: function() {
|
||||
|
||||
// Create additional hidden input.
|
||||
el.$selectTagsHiddenInput = $( '<input type="hidden" name="settings[form_tags_json]">' );
|
||||
el.$selectTags
|
||||
.closest( '.wpforms-panel-field' )
|
||||
.append( el.$selectTagsHiddenInput );
|
||||
|
||||
// Update hidden input value.
|
||||
app.changeTags( null );
|
||||
|
||||
// Update form state when hidden input initialized.
|
||||
// This will prevent a please-save-prompt to appear, when switching from revisions without doing any changes anywhere.
|
||||
if ( wpf.initialSave === true ) {
|
||||
wpf.savedState = wpf.getFormState( '#wpforms-builder-form' );
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Add custom item to Tags dropdown on input.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @param {object} event Event object.
|
||||
*/
|
||||
addCustomTagInput: function( event ) {
|
||||
|
||||
if ( [ 'Enter', ',' ].indexOf( event.key ) < 0 ) {
|
||||
return;
|
||||
}
|
||||
|
||||
event.preventDefault();
|
||||
event.stopPropagation();
|
||||
|
||||
if ( ! vars.tagsChoicesObj || event.target.value.length === 0 ) {
|
||||
return;
|
||||
}
|
||||
|
||||
var tagLabel = _.escape( event.target.value ).trim(),
|
||||
labels = _.map( vars.tagsChoicesObj.getValue(), 'label' ).map( function( label ) {
|
||||
return label.toLowerCase().trim();
|
||||
} );
|
||||
|
||||
if ( tagLabel === '' || labels.indexOf( tagLabel.toLowerCase() ) >= 0 ) {
|
||||
vars.tagsChoicesObj.clearInput();
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
app.addCustomTagInputCreate( tagLabel );
|
||||
app.changeTags( event );
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove tag from Tags field event handler.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @param {object} event Event object.
|
||||
*/
|
||||
editTagsRemoveItem: function( event ) {
|
||||
|
||||
var allValues = _.map( wpforms_builder_settings.all_tags_choices, 'value' );
|
||||
|
||||
if ( allValues.indexOf( event.detail.value ) >= 0 ) {
|
||||
return;
|
||||
}
|
||||
|
||||
// We should remove new tag from the list of choices.
|
||||
var choicesObj = $( event.target ).data( 'choicesjs' ),
|
||||
currentValue = choicesObj.getValue( true ),
|
||||
choices = _.filter( choicesObj._currentState.choices, function( item ) {
|
||||
return item.value !== event.detail.value;
|
||||
} );
|
||||
|
||||
choicesObj
|
||||
.clearStore()
|
||||
.setChoices( choices, 'value', 'label', true )
|
||||
.setChoiceByValue( currentValue );
|
||||
},
|
||||
|
||||
/**
|
||||
* Add custom item to Tags dropdown on input (second part).
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @param {object} tagLabel Event object.
|
||||
*/
|
||||
addCustomTagInputCreate: function( tagLabel ) {
|
||||
|
||||
var tag = _.find( wpforms_builder_settings.all_tags_choices, { label: tagLabel } );
|
||||
|
||||
if ( tag && tag.value ) {
|
||||
vars.tagsChoicesObj.setChoiceByValue( tag.value );
|
||||
} else {
|
||||
vars.tagsChoicesObj.setChoices(
|
||||
[
|
||||
{
|
||||
value: tagLabel,
|
||||
label: tagLabel,
|
||||
selected: true,
|
||||
},
|
||||
],
|
||||
'value',
|
||||
'label',
|
||||
false
|
||||
);
|
||||
}
|
||||
|
||||
vars.tagsChoicesObj.clearInput();
|
||||
},
|
||||
|
||||
/**
|
||||
* Change Tags field event handler.
|
||||
*
|
||||
* @since 1.7.5
|
||||
*
|
||||
* @param {object} event Event object.
|
||||
*/
|
||||
changeTags: function( event ) {
|
||||
|
||||
var tagsValue = vars.tagsChoicesObj.getValue(),
|
||||
tags = [];
|
||||
|
||||
for ( var i = 0; i < tagsValue.length; i++ ) {
|
||||
tags.push( {
|
||||
value: tagsValue[ i ].value,
|
||||
label: tagsValue[ i ].label,
|
||||
} );
|
||||
}
|
||||
|
||||
// Update Tags field hidden input value.
|
||||
el.$selectTagsHiddenInput.val(
|
||||
JSON.stringify( tags )
|
||||
);
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
}( document, window, jQuery ) );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.Settings.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/settings.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/settings.min.js
vendored
Normal file
@@ -0,0 +1 @@
|
||||
"use strict";var WPForms=window.WPForms||{};WPForms.Admin=WPForms.Admin||{},WPForms.Admin.Builder=WPForms.Admin.Builder||{},WPForms.Admin.Builder.Settings=WPForms.Admin.Builder.Settings||function(t,i){var n={},o={},a={init:function(){i(a.ready)},ready:function(){a.setup(),a.initTags(),a.events()},setup:function(){n={$builder:i("#wpforms-builder"),$panel:i("#wpforms-panel-settings"),$selectTags:i("#wpforms-panel-field-settings-form_tags")}},events:function(){n.$panel.on("keydown","#wpforms-panel-field-settings-form_tags-wrap input",a.addCustomTagInput).on("removeItem","#wpforms-panel-field-settings-form_tags-wrap select",a.editTagsRemoveItem),n.$selectTags.on("change",a.changeTags)},initTags:function(){var e;n.$selectTags.length&&"function"==typeof t.Choices&&(o.tagsChoicesObj=new Choices(n.$selectTags[0],wpforms_builder_settings.choicesjs_config),e=o.tagsChoicesObj.getValue(!0),o.tagsChoicesObj.clearStore().setChoices(wpforms_builder_settings.all_tags_choices,"value","label",!0).setChoiceByValue(e),n.$selectTags.data("choicesjs",o.tagsChoicesObj),a.initTagsHiddenInput())},initTagsHiddenInput:function(){n.$selectTagsHiddenInput=i('<input type="hidden" name="settings[form_tags_json]">'),n.$selectTags.closest(".wpforms-panel-field").append(n.$selectTagsHiddenInput),a.changeTags(null),!0===wpf.initialSave&&(wpf.savedState=wpf.getFormState("#wpforms-builder-form"))},addCustomTagInput:function(e){var t,s;["Enter",","].indexOf(e.key)<0||(e.preventDefault(),e.stopPropagation(),o.tagsChoicesObj&&0!==e.target.value.length&&(t=_.escape(e.target.value).trim(),s=_.map(o.tagsChoicesObj.getValue(),"label").map(function(e){return e.toLowerCase().trim()}),""===t||0<=s.indexOf(t.toLowerCase())?o.tagsChoicesObj.clearInput():(a.addCustomTagInputCreate(t),a.changeTags(e))))},editTagsRemoveItem:function(t){var e,s,a;0<=_.map(wpforms_builder_settings.all_tags_choices,"value").indexOf(t.detail.value)||(s=(e=i(t.target).data("choicesjs")).getValue(!0),a=_.filter(e._currentState.choices,function(e){return e.value!==t.detail.value}),e.clearStore().setChoices(a,"value","label",!0).setChoiceByValue(s))},addCustomTagInputCreate:function(e){var t=_.find(wpforms_builder_settings.all_tags_choices,{label:e});t&&t.value?o.tagsChoicesObj.setChoiceByValue(t.value):o.tagsChoicesObj.setChoices([{value:e,label:e,selected:!0}],"value","label",!1),o.tagsChoicesObj.clearInput()},changeTags:function(e){for(var t=o.tagsChoicesObj.getValue(),s=[],a=0;a<t.length;a++)s.push({value:t[a].value,label:t[a].label});n.$selectTagsHiddenInput.val(JSON.stringify(s))}};return a}((document,window),jQuery),WPForms.Admin.Builder.Settings.init();
|
||||
@@ -0,0 +1,653 @@
|
||||
/* global List, wpforms_builder, wpf, WPFormsBuilder, WPFormsFormTemplates */
|
||||
|
||||
/**
|
||||
* Form Builder Setup Panel module.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
|
||||
'use strict';
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.Setup = WPForms.Admin.Builder.Setup || ( function( document, window, $ ) {
|
||||
|
||||
/**
|
||||
* Elements holder.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var el = {};
|
||||
|
||||
/**
|
||||
* Runtime variables.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var vars = {};
|
||||
|
||||
/**
|
||||
* Active template name.
|
||||
*
|
||||
* @since 1.7.6
|
||||
*/
|
||||
const activeTemplateName = $( '.wpforms-template.selected .wpforms-template-name' ).text().trim();
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @type {object}
|
||||
*/
|
||||
var app = {
|
||||
|
||||
/**
|
||||
* Start the engine.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
$( app.ready );
|
||||
|
||||
// Page load.
|
||||
$( window ).on( 'load', function() {
|
||||
|
||||
// In the case of jQuery 3.+, we need to wait for a ready event first.
|
||||
if ( typeof $.ready.then === 'function' ) {
|
||||
$.ready.then( app.load );
|
||||
} else {
|
||||
app.load();
|
||||
}
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
app.setup();
|
||||
app.setPanelsToggleState();
|
||||
app.setupTitleFocus();
|
||||
app.setTriggerBlankLink();
|
||||
app.events();
|
||||
|
||||
el.$builder.trigger( 'wpformsBuilderSetupReady' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Page load.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
load: function() {
|
||||
|
||||
app.applyTemplateOnRequest();
|
||||
},
|
||||
|
||||
/**
|
||||
* Setup. Prepare some variables.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
setup: function() {
|
||||
|
||||
// Cache DOM elements.
|
||||
el = {
|
||||
$builder: $( '#wpforms-builder' ),
|
||||
$form: $( '#wpforms-builder-form' ),
|
||||
$formName: $( '#wpforms-setup-name' ),
|
||||
$panel: $( '#wpforms-panel-setup' ),
|
||||
$categories: $( '#wpforms-panel-setup .wpforms-setup-templates-categories' ),
|
||||
};
|
||||
|
||||
// Template list object.
|
||||
vars.templateList = new List( 'wpforms-setup-templates-list', {
|
||||
valueNames: [
|
||||
'wpforms-template-name',
|
||||
'wpforms-template-desc',
|
||||
{
|
||||
name: 'categories',
|
||||
attr: 'data-categories',
|
||||
},
|
||||
{
|
||||
name: 'subcategories',
|
||||
attr: 'data-subcategories',
|
||||
},
|
||||
],
|
||||
} );
|
||||
|
||||
// Other values.
|
||||
vars.spinner = '<i class="wpforms-loading-spinner wpforms-loading-white wpforms-loading-inline"></i>';
|
||||
vars.formID = el.$form.data( 'id' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Bind events.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
events: function() {
|
||||
|
||||
el.$panel
|
||||
.on( 'keyup', '#wpforms-setup-template-search', WPFormsFormTemplates.searchTemplate )
|
||||
.on( 'click', '.wpforms-setup-templates-categories li div', WPFormsFormTemplates.selectCategory )
|
||||
.on( 'click', '.wpforms-setup-templates-subcategories li', WPFormsFormTemplates.selectSubCategory )
|
||||
.on( 'click', '.wpforms-template-select', app.selectTemplate )
|
||||
.on( 'click', '.wpforms-trigger-blank', app.selectBlankTemplate );
|
||||
|
||||
// Focus on the form title field when displaying setup panel.
|
||||
el.$builder
|
||||
.on( 'wpformsPanelSwitched', app.setupTitleFocus );
|
||||
|
||||
// Sync Setup title and settings title.
|
||||
el.$builder
|
||||
.on( 'input', '#wpforms-panel-field-settings-form_title', app.syncTitle )
|
||||
.on( 'input', '#wpforms-setup-name', app.syncTitle );
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* Set panels toggle buttons state.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
setPanelsToggleState: function() {
|
||||
|
||||
el.$builder
|
||||
.find( '#wpforms-panels-toggle button:not(.active)' )
|
||||
.toggleClass( 'wpforms-disabled', vars.formID === '' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Set attributes of "blank template" link.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
setTriggerBlankLink: function() {
|
||||
|
||||
el.$builder
|
||||
.find( '.wpforms-trigger-blank' )
|
||||
.attr( {
|
||||
'data-template-name-raw': 'Blank Form',
|
||||
'data-template': 'blank',
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Force focus on the form title field when switched to the Setup panel.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
* @param {string} view Current view.
|
||||
*/
|
||||
setupTitleFocus: function( e, view ) {
|
||||
|
||||
if ( typeof view === 'undefined' ) {
|
||||
view = wpf.getQueryString( 'view' );
|
||||
}
|
||||
|
||||
if ( view === 'setup' ) {
|
||||
el.$formName.trigger( 'focus' );
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Keep Setup title and settings title instances the same.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
syncTitle: function( e ) {
|
||||
|
||||
if ( e.target.id === 'wpforms-setup-name' ) {
|
||||
$( '#wpforms-panel-field-settings-form_title' ).val( e.target.value );
|
||||
} else {
|
||||
$( '#wpforms-setup-name' ).val( e.target.value );
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Search template.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.7.7 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.searchTemplate` instead.
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
searchTemplate: function( e ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.searchTemplate( e )" has been deprecated, please use the new "WPFormsFormTemplates.searchTemplate( e )" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.searchTemplate( e );
|
||||
},
|
||||
|
||||
/**
|
||||
* Select category.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.7.7 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.selectCategory` instead.
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
selectCategory: function( e ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.selectCategory( e )" has been deprecated, please use the new "WPFormsFormTemplates.selectCategory( e )" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.selectCategory( e );
|
||||
},
|
||||
|
||||
/**
|
||||
* Select template.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
selectTemplate: function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
var $button = $( this ),
|
||||
template = $button.data( 'template' ),
|
||||
formName = app.getFormName( $button );
|
||||
|
||||
// Don't do anything for templates that trigger education modal OR addons-modal.
|
||||
if ( $button.hasClass( 'education-modal' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
el.$panel.find( '.wpforms-template' ).removeClass( 'active' );
|
||||
$button.closest( '.wpforms-template' ).addClass( 'active' );
|
||||
|
||||
// Save original label.
|
||||
$button.data( 'labelOriginal', $button.html() );
|
||||
|
||||
// Display loading indicator.
|
||||
$button.html( vars.spinner + wpforms_builder.loading );
|
||||
|
||||
app.applyTemplate( formName, template, $button );
|
||||
},
|
||||
|
||||
/**
|
||||
* Get form name.
|
||||
*
|
||||
* @since 1.7.6
|
||||
*
|
||||
* @param {jQuery} $button Pressed template button.
|
||||
*
|
||||
* @returns {string} A new form name.
|
||||
*/
|
||||
getFormName: function( $button ) {
|
||||
|
||||
const templateName = $button.data( 'template-name-raw' );
|
||||
const formName = el.$formName.val();
|
||||
|
||||
if ( ! formName ) {
|
||||
return templateName;
|
||||
}
|
||||
|
||||
return activeTemplateName === formName ? templateName : formName;
|
||||
},
|
||||
|
||||
/**
|
||||
* Apply template.
|
||||
*
|
||||
* The final part of the select template routine.
|
||||
*
|
||||
* @since 1.6.9
|
||||
*
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
* @param {jQuery} $button Use template button object.
|
||||
*/
|
||||
applyTemplate: function( formName, template, $button ) {
|
||||
|
||||
el.$builder.trigger( 'wpformsTemplateSelect', template );
|
||||
|
||||
if ( vars.formID ) {
|
||||
|
||||
// Existing form.
|
||||
app.selectTemplateExistingForm( formName, template, $button );
|
||||
|
||||
} else {
|
||||
|
||||
// Create a new form.
|
||||
WPFormsFormTemplates.selectTemplateProcess( formName, template, $button, app.selectTemplateProcessAjax );
|
||||
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Select Blank template.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {object} e Event object.
|
||||
*/
|
||||
selectBlankTemplate: function( e ) {
|
||||
|
||||
e.preventDefault();
|
||||
|
||||
var $button = $( e.target ),
|
||||
formName = el.$formName.val() || wpforms_builder.blank_form,
|
||||
template = 'blank';
|
||||
|
||||
app.applyTemplate( formName, template, $button );
|
||||
},
|
||||
|
||||
/**
|
||||
* Select template. Existing form.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
* @param {jQuery} $button Use template button object.
|
||||
*/
|
||||
selectTemplateExistingForm: function( formName, template, $button ) {
|
||||
|
||||
$.confirm( {
|
||||
title: wpforms_builder.heads_up,
|
||||
content: wpforms_builder.template_confirm,
|
||||
icon: 'fa fa-exclamation-circle',
|
||||
type: 'orange',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.ok,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
action: function() {
|
||||
|
||||
WPFormsFormTemplates.selectTemplateProcess( formName, template, $button, app.selectTemplateProcessAjax );
|
||||
},
|
||||
},
|
||||
cancel: {
|
||||
text: wpforms_builder.cancel,
|
||||
action: function() {
|
||||
|
||||
WPFormsFormTemplates.selectTemplateCancel();
|
||||
},
|
||||
},
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Select template.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.8.2 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.selectTemplateProcess` instead.
|
||||
*
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
* @param {jQuery} $button Use template button object.
|
||||
*/
|
||||
selectTemplateProcess: function( formName, template, $button ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.selectTemplateProcess( formName, template, $button )" has been deprecated, please use the new "WPFormsFormTemplates.selectTemplateProcess( formName, template, $button, callback )" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.selectTemplateProcess( formName, template, $button, app.selectTemplateProcessAjax );
|
||||
},
|
||||
|
||||
/**
|
||||
* Cancel button click routine.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.7.7 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.selectTemplateCancel` instead.
|
||||
*/
|
||||
selectTemplateCancel: function( ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.selectTemplateCancel" has been deprecated, please use the new "WPFormsFormTemplates.selectTemplateCancel" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.selectTemplateCancel();
|
||||
},
|
||||
|
||||
/**
|
||||
* Select template. Create or update form AJAX call.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
*/
|
||||
selectTemplateProcessAjax: function( formName, template ) {
|
||||
|
||||
WPFormsBuilder.showLoadingOverlay();
|
||||
|
||||
var data = {
|
||||
title: formName,
|
||||
action: vars.formID ? 'wpforms_update_form_template' : 'wpforms_new_form',
|
||||
template: template,
|
||||
form_id: vars.formID, // eslint-disable-line camelcase
|
||||
nonce: wpforms_builder.nonce,
|
||||
};
|
||||
|
||||
$.post( wpforms_builder.ajax_url, data )
|
||||
.done( function( res ) {
|
||||
|
||||
if ( res.success ) {
|
||||
|
||||
// We have already warned the user that unsaved changes will be ignored.
|
||||
WPFormsBuilder.setCloseConfirmation( false );
|
||||
|
||||
window.location.href = wpf.getQueryString( 'force_desktop_view' ) ?
|
||||
wpf.updateQueryString( 'force_desktop_view', 1, res.data.redirect ) :
|
||||
res.data.redirect;
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
wpf.debug( res );
|
||||
|
||||
if ( res.data.error_type === 'invalid_template' ) {
|
||||
app.selectTemplateProcessInvalidTemplateError( res.data.message, formName );
|
||||
|
||||
return;
|
||||
}
|
||||
|
||||
app.selectTemplateProcessError( res.data.message );
|
||||
} )
|
||||
.fail( function( xhr, textStatus, e ) {
|
||||
|
||||
wpf.debug( xhr.responseText || textStatus || '' );
|
||||
app.selectTemplateProcessError( '' );
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Select template AJAX call error modal for invalid template using.
|
||||
*
|
||||
* @since 1.7.5.3
|
||||
*
|
||||
* @param {string} errorMessage Error message.
|
||||
* @param {string} formName Name of the form.
|
||||
*/
|
||||
selectTemplateProcessInvalidTemplateError: function( errorMessage, formName ) {
|
||||
|
||||
$.alert( {
|
||||
title: wpforms_builder.heads_up,
|
||||
content: errorMessage,
|
||||
icon: 'fa fa-exclamation-circle',
|
||||
type: 'orange',
|
||||
boxWidth: '600px',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.use_simple_contact_form,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
action: function() {
|
||||
|
||||
app.selectTemplateProcessAjax( formName, 'simple-contact-form-template' );
|
||||
WPFormsBuilder.hideLoadingOverlay();
|
||||
},
|
||||
},
|
||||
cancel: {
|
||||
text: wpforms_builder.cancel,
|
||||
action: function() {
|
||||
|
||||
WPFormsFormTemplates.selectTemplateCancel();
|
||||
WPFormsBuilder.hideLoadingOverlay();
|
||||
},
|
||||
},
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Select template AJAX call error modal.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*
|
||||
* @param {string} error Error message.
|
||||
*/
|
||||
selectTemplateProcessError: function( error ) {
|
||||
|
||||
var content = error && error.length ? '<p>' + error + '</p>' : '';
|
||||
|
||||
$.alert( {
|
||||
title: wpforms_builder.heads_up,
|
||||
content: wpforms_builder.error_select_template + content,
|
||||
icon: 'fa fa-exclamation-circle',
|
||||
type: 'orange',
|
||||
buttons: {
|
||||
confirm: {
|
||||
text: wpforms_builder.ok,
|
||||
btnClass: 'btn-confirm',
|
||||
keys: [ 'enter' ],
|
||||
action: function() {
|
||||
|
||||
WPFormsFormTemplates.selectTemplateCancel();
|
||||
WPFormsBuilder.hideLoadingOverlay();
|
||||
},
|
||||
},
|
||||
},
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Open required addons alert.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.8.2 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.addonsModal` instead.
|
||||
*
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
* @param {jQuery} $button Use template button object.
|
||||
*/
|
||||
addonsModal: function( formName, template, $button ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.addonsModal( formName, template, $button )" has been deprecated, please use the new "WPFormsFormTemplates.addonsModal( formName, template, $button, callback )" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.addonsModal( formName, template, $button, app.selectTemplateProcessAjax );
|
||||
},
|
||||
|
||||
/**
|
||||
* Install & Activate addons via AJAX.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.8.2 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.installActivateAddons` instead.
|
||||
*
|
||||
* @param {Array} addons Addons slugs.
|
||||
* @param {object} previousModal Previous modal instance.
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
*/
|
||||
installActivateAddons: function( addons, previousModal, formName, template ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.installActivateAddons( addons, previousModal, formName, template )" has been deprecated, please use the new "WPFormsFormTemplates.installActivateAddons( addons, previousModal, formName, template, callback )" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.installActivateAddons( addons, previousModal, formName, template, app.selectTemplateProcessAjax );
|
||||
},
|
||||
|
||||
/**
|
||||
* Install & Activate addons error modal.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.8.2 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.installActivateAddonsError` instead.
|
||||
*
|
||||
* @param {string} formName Name of the form.
|
||||
* @param {string} template Template slug.
|
||||
*/
|
||||
installActivateAddonsError: function( formName, template ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.installActivateAddonsError( formName, template )" has been deprecated, please use the new "WPFormsFormTemplates.installActivateAddonsError( formName, template, callback )" function instead!' );
|
||||
|
||||
WPFormsFormTemplates.installActivateAddonsError( formName, template, app.selectTemplateProcessAjax );
|
||||
},
|
||||
|
||||
/**
|
||||
* Install & Activate single addon via AJAX.
|
||||
*
|
||||
* @since 1.6.8
|
||||
* @since 1.8.2 Deprecated.
|
||||
*
|
||||
* @deprecated Use `WPFormsFormTemplates.installActivateAddonAjax` instead.
|
||||
*
|
||||
* @param {string} addon Addon slug.
|
||||
*
|
||||
* @returns {Promise} jQuery ajax call promise.
|
||||
*/
|
||||
installActivateAddonAjax: function( addon ) {
|
||||
|
||||
console.warn( 'WARNING! Function "WPForms.Admin.Builder.Setup.installActivateAddonAjax( addon )" has been deprecated, please use the new "WPFormsFormTemplates.installActivateAddonAjax( addon )" function instead!' );
|
||||
|
||||
return WPFormsFormTemplates.installActivateAddonAjax( addon );
|
||||
},
|
||||
|
||||
/**
|
||||
* Initiate template processing for a new form.
|
||||
*
|
||||
* @since 1.6.8
|
||||
*/
|
||||
applyTemplateOnRequest: function() {
|
||||
|
||||
var urlParams = new URLSearchParams( window.location.search ),
|
||||
templateId = urlParams.get( 'template_id' );
|
||||
|
||||
if (
|
||||
urlParams.get( 'view' ) !== 'setup' ||
|
||||
urlParams.get( 'form_id' ) ||
|
||||
! templateId
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
el.$panel.find( '.wpforms-template .wpforms-btn[data-template="' + templateId + '"]' ).trigger( 'click' );
|
||||
},
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
}( document, window, jQuery ) );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.Setup.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/setup.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/setup.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@@ -0,0 +1,107 @@
|
||||
/* global WPForms, jQuery, Map, wpforms_builder, wpforms_builder_providers, _ */
|
||||
|
||||
var WPForms = window.WPForms || {};
|
||||
WPForms.Admin = WPForms.Admin || {};
|
||||
WPForms.Admin.Builder = WPForms.Admin.Builder || {};
|
||||
|
||||
WPForms.Admin.Builder.Templates = WPForms.Admin.Builder.Templates || ( function( document, window, $ ) {
|
||||
'use strict';
|
||||
|
||||
/**
|
||||
* Private functions and properties.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
var __private = {
|
||||
|
||||
/**
|
||||
* All templating functions for providers are stored here in a Map.
|
||||
* Key is a template name, value - Underscore.js templating function.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @type {Map}
|
||||
*/
|
||||
previews: new Map(),
|
||||
};
|
||||
|
||||
/**
|
||||
* Public functions and properties.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @type {Object}
|
||||
*/
|
||||
var app = {
|
||||
|
||||
/**
|
||||
* Start the engine. DOM is not ready yet, use only to init something.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*/
|
||||
init: function() {
|
||||
|
||||
// Do that when DOM is ready.
|
||||
$( app.ready );
|
||||
},
|
||||
|
||||
/**
|
||||
* DOM is fully loaded.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*/
|
||||
ready: function() {
|
||||
|
||||
$( '#wpforms-panel-providers' ).trigger( 'WPForms.Admin.Builder.Templates.ready' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Register and compile all templates.
|
||||
* All data is saved in a Map.
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @param {string[]} templates Array of template names.
|
||||
*/
|
||||
add: function( templates ) {
|
||||
|
||||
templates.forEach( function( template ) {
|
||||
if ( typeof template === 'string' ) {
|
||||
__private.previews.set( template, wp.template( template ) );
|
||||
}
|
||||
} );
|
||||
},
|
||||
|
||||
/**
|
||||
* Get a templating function (to compile later with data).
|
||||
*
|
||||
* @since 1.4.8
|
||||
*
|
||||
* @param {string} template ID of a template to retrieve from a cache.
|
||||
*
|
||||
* @returns {*} A callable that after compiling will always return a string.
|
||||
*/
|
||||
get: function( template ) {
|
||||
|
||||
var preview = __private.previews.get( template );
|
||||
|
||||
if ( typeof preview !== 'undefined' ) {
|
||||
return preview;
|
||||
}
|
||||
|
||||
return function() {
|
||||
return '';
|
||||
};
|
||||
},
|
||||
|
||||
};
|
||||
|
||||
// Provide access to public functions/properties.
|
||||
return app;
|
||||
|
||||
} )( document, window, jQuery );
|
||||
|
||||
// Initialize.
|
||||
WPForms.Admin.Builder.Templates.init();
|
||||
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/templates.min.js
vendored
Normal file
1
wp-content/plugins/wpforms-lite/assets/js/components/admin/builder/templates.min.js
vendored
Normal file
@@ -0,0 +1 @@
|
||||
var WPForms=window.WPForms||{};WPForms.Admin=WPForms.Admin||{},WPForms.Admin.Builder=WPForms.Admin.Builder||{},WPForms.Admin.Builder.Templates=WPForms.Admin.Builder.Templates||function(e){"use strict";var r={previews:new Map},i={init:function(){e(i.ready)},ready:function(){e("#wpforms-panel-providers").trigger("WPForms.Admin.Builder.Templates.ready")},add:function(e){e.forEach(function(e){"string"==typeof e&&r.previews.set(e,wp.template(e))})},get:function(e){e=r.previews.get(e);return void 0!==e?e:function(){return""}}};return i}((document,window,jQuery)),WPForms.Admin.Builder.Templates.init();
|
||||
Reference in New Issue
Block a user