https://onlineborenkopen.nl/wp-content/themes/Impreza/common/js/elements/list-search.js?ver=8.39.2

1/**
2 * UpSolution Element: List Search
3 */
4! function( $, _undefined ) {
5	"use strict";
6
7	const DELETE_FILTER = null;
8	const urlManager = $ush.urlManager();
9	const urlParam = '_s';
10
11	/**
12	 * @param {Node} container.
13	 */
14	function usListSearch( container ) {
15		const self = this;
16
17		// Bondable events
18		self._events = {
19			searchTextChanged: self._searchTextChanged.bind( self ),
20			formSubmit: self._formSubmit.bind( self ),
21		};
22
23		// Elements
24		self.$container = $( container );
25		self.$input = $( 'input', container );
26		self.$pageContent = $( 'main#page-content' );
27		self.$message = $( '.w-search-message', container );
28
29		// Private "Variables"
30		self.name = self.$input.attr( 'name' );
31
32		// Sets value from URL
33		if ( self.changeURLParams() ) {
34			let urlValue = urlManager.get( urlParam );
35			if ( ! $ush.isUndefined( urlValue ) ) {
36				self.$input.val( urlValue );
37			}
38		}
39
40		// Events
41		self.$container
42			.on( 'input', 'input', $ush.throttle( self._events.searchTextChanged, /* wait */300, /* no_trailing */false ) )
43			.on( 'click', 'buttom', self._events.searchTextChanged )
44			.on( 'submit', 'form', self._events.formSubmit );
45
46		// Defines enter presses in field
47		$us.$document.on( 'keypress', ( e ) => {
48			if ( self.$input.is( ':focus' ) && e.keyCode === $ush.ENTER_KEYCODE ) {
49				e.preventDefault();
50				self._events.searchTextChanged( e );
51			}
52		});
53	}
54
55	// List Search API
56	$.extend( usListSearch.prototype, {
57
58		/**
59		 * Determines if enabled URL.
60		 *
61		 * @return {Boolean} True if enabled url, False otherwise.
62		 */
63		changeURLParams: function() {
64			return this.$container.hasClass( 'change_url_params' );
65		},
66
67		/**
68		 * @event handler
69		 * @param {Event} e The Event interface represents an event which takes place in the DOM.
70		 */
71		_formSubmit: function( e ) {
72			e.preventDefault();
73			this._events.searchTextChanged( e );
74		},
75
76		/**
77		 * @event handler
78		 * @param {Event} e The Event interface represents an event which takes place in the DOM.
79		 */
80		_searchTextChanged: function( e ) {
81			const self = this;
82
83			const $firstList = $( `
84				.w-grid.us_post_list:visible,
85				.w-grid.us_product_list:visible,
86				.w-grid-none:visible
87			`, self.$pageContent ).first();
88
89			if ( $firstList.hasClass( 'w-grid' ) ) {
90				self.$message.addClass( 'hidden' ).text('');
91				$firstList.addClass( 'used_by_list_search' );
92
93			} else if ( ! $firstList.hasClass( 'w-grid-none' ) ) {
94				self.$message
95					.html( 'No suitable list found. Add <b>Post List</b> or <b>Product List</b> elements.' ) // do not need to translate
96					.removeClass( 'hidden' );
97			}
98			if ( e.type === 'input' && ! self.$container.hasClass( 'live_search' ) ) {
99				return;
100			}
101			let value = self.$input.val();
102			if ( value === '' ) {
103				value = DELETE_FILTER;
104			}
105			if ( value === self.lastValue ) {
106				return;
107			}
108			self.lastValue = value;
109
110			if ( self.changeURLParams() ) {
111				urlManager.set( urlParam, value ).push();
112			}
113
114			$firstList.trigger( 'usListSearch', [ urlParam, value ] );
115		}
116
117	} );
118
119	$.fn.usListSearch = function() {
120		return this.each( function() {
121			$( this ).data( 'usListSearch', new usListSearch( this ) );
122		} );
123	};
124
125	$( () => {
126		$( '.w-search.for_list' ).usListSearch();
127	} );
128
129}( jQuery );