upskill-event-manager/assets/js/search-fields.js

/**
 * 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() {
			$( '.wpforms-add-fields-button-clone' ).on( 'click', function( e ) {
				e.preventDefault();
				e.stopPropagation();

				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();