https://www.thunder1045.com/wp-content/plugins/the-events-calendar…/resources/js/views/tooltip.js?ver=5.6.0

1/**
2 * Makes sure we have all the required levels on the Tribe Object
3 *
4 * @since  4.9.4
5 *
6 * @type   {PlainObject}
7 */
8tribe.events = tribe.events || {};
9tribe.events.views = tribe.events.views || {};
10
11/**
12 * Configures Views Tooltip Object in the Global Tribe variable
13 *
14 * @since  4.9.4
15 *
16 * @type   {PlainObject}
17 */
18tribe.events.views.tooltip = {};
19
20/**
21 * Initializes in a Strict env the code that manages the Event Views
22 *
23 * @since  4.9.4
24 *
25 * @param  {PlainObject} $   jQuery
26 * @param  {PlainObject} obj tribe.events.views.tooltip
27 *
28 * @return {void}
29 */
30( function( $, obj ) {
31	'use strict';
32	var $document = $( document );
33
34	/**
35	 * Config used for tooltip setup
36	 *
37	 * @since 4.9.10
38	 *
39	 * @type {PlainObject}
40	 */
41	obj.config = {
42		delayHoverIn: 300,
43		delayHoverOut: 300,
44	};
45
46	/**
47	 * Selectors used for configuration and setup
48	 *
49	 * @since 4.9.10
50	 *
51	 * @type {PlainObject}
52	 */
53	obj.selectors = {
54		tooltipTrigger: '[data-js~="tribe-events-tooltip"]',
55		tribeEventsTooltipTriggerHoverClass: '.tribe-events-tooltip-trigger--hover',
56		tribeEventsTooltipThemeClass: '.tribe-events-tooltip-theme',
57		tribeEventsTooltipThemeHoverClass: '.tribe-events-tooltip-theme--hover',
58		tribeCommonClass: '.tribe-common',
59		tribeEventsClass: '.tribe-events',
60	};
61
62	/**
63	 * Handle tooltip focus event
64	 *
65	 * @since 4.9.10
66	 *
67	 * @param {Event} event event object
68	 *
69	 * @return {void}
70	 */
71	obj.handleOriginFocus = function( event ) {
72		setTimeout( function() {
73			if (
74				event.data.target.is( ':focus' ) ||
75				event.data.target.hasClass( obj.selectors.tribeEventsTooltipTriggerHoverClass.className() )
76			) {
77				event.data.target.tooltipster( 'open' );
78			}
79		}, obj.config.delayHoverIn );
80	};
81
82	/**
83	 * Handle tooltip blur event
84	 *
85	 * @since 4.9.4
86	 *
87	 * @param {Event} event event object
88	 *
89	 * @return {void}
90	 */
91	obj.handleOriginBlur = function( event ) {
92		event.data.target.tooltipster( 'close' );
93	};
94
95	/**
96	 * Handle origin mouseenter and touchstart events
97	 *
98	 * @since 4.9.10
99	 *
100	 * @param {Event} event event object
101	 *
102	 * @return {void}
103	 */
104	obj.handleOriginHoverIn = function( event ) {
105		event.data.target.addClass( obj.selectors.tribeEventsTooltipTriggerHoverClass.className() );
106	};
107
108	/**
109	 * Handle origin mouseleave and touchleave events
110	 *
111	 * @since 4.9.10
112	 *
113	 * @param {Event} event event object
114	 *
115	 * @return {void}
116	 */
117	obj.handleOriginHoverOut = function( event ) {
118		event.data.target.removeClass( obj.selectors.tribeEventsTooltipTriggerHoverClass.className() );
119	};
120
121	/**
122	 * Handle tooltip mouseenter and touchstart event
123	 *
124	 * @since 4.9.10
125	 *
126	 * @param {Event} event event object
127	 *
128	 * @return {void}
129	 */
130	obj.handleTooltipHoverIn = function( event ) {
131		event.data.target.addClass( obj.selectors.tribeEventsTooltipThemeHoverClass.className() );
132	};
133
134	/**
135	 * Handle tooltip mouseleave and touchleave events
136	 *
137	 * @since 4.9.10
138	 *
139	 * @param {Event} event event object
140	 *
141	 * @return {void}
142	 */
143	obj.handleTooltipHoverOut = function( event ) {
144		event.data.target.removeClass( obj.selectors.tribeEventsTooltipThemeHoverClass.className() );
145	};
146
147	/**
148	 * Handle tooltip instance closing event
149	 *
150	 * @since 4.9.10
151	 *
152	 * @param {Event} event event object
153	 *
154	 * @return {void}
155	 */
156	obj.handleInstanceClose = function( event ) {
157		var $origin = event.data.origin;
158		var $tooltip = $( event.tooltip );
159
160		// if trigger is focused, hovered, or tooltip is hovered, do not close tooltip
161		if (
162			$origin.is( ':focus' ) ||
163			$origin.hasClass( obj.selectors.tribeEventsTooltipTriggerHoverClass.className() ) ||
164			$tooltip.hasClass( obj.selectors.tribeEventsTooltipThemeHoverClass.className() )
165		) {
166			event.stop();
167		}
168	};
169
170	/**
171	 * Handle tooltip instance close event
172	 *
173	 * @since 4.9.10
174	 *
175	 * @param {Event} event event object
176	 *
177	 * @return {void}
178	 */
179	obj.handleInstanceClosing = function( event ) {
180		$( event.tooltip )
181			.off( 'mouseenter touchstart', obj.handleTooltipHoverIn )
182			.off( 'mouseleave touchleave', obj.handleTooltipHoverOut );
183	};
184
185	/**
186	 * Override of the `functionInit` tooltipster method.
187	 * A custom function to be fired only once at instantiation.
188	 *
189	 * @since 4.9.10
190	 *
191	 * @param {Tooltipster} instance instance of Tooltipster
192	 * @param {PlainObject} helper   helper object with tooltip origin
193	 *
194	 * @return {void}
195	 */
196	obj.onFunctionInit = function( instance, helper ) {
197		var $origin = $( helper.origin );
198		$origin
199			.on( 'focus', { target: $origin }, obj.handleOriginFocus )
200			.on( 'blur', { target: $origin }, obj.handleOriginBlur )
201			.on( 'mouseenter touchstart', { target: $origin }, obj.handleOriginHoverIn )
202			.on( 'mouseleave touchleave', { target: $origin }, obj.handleOriginHoverOut );
203		instance
204			.on( 'close', { origin: $origin }, obj.handleInstanceClose )
205			.on( 'closing', { origin: $origin }, obj.handleInstanceClosing );
206	};
207
208	/**
209	 * Override of the `functionReady` tooltipster method.
210	 * A custom function to be fired when the tooltip and its contents have been added to the DOM.
211	 *
212	 * @since 4.9.10
213	 *
214	 * @param {Tooltipster} instance instance of Tooltipster
215	 * @param {PlainObject} helper   helper object with tooltip origin
216	 *
217	 * @return {void}
218	 */
219	obj.onFunctionReady = function( instance, helper ) {
220		var $tooltip = $( helper.tooltip );
221		$tooltip
222			.on( 'mouseenter touchstart', { target: $tooltip }, obj.handleTooltipHoverIn )
223			.on( 'mouseleave touchleave', { target: $tooltip }, obj.handleTooltipHoverOut );
224	};
225
226	/**
227	 * Deinitialize accessible tooltips via tooltipster
228	 *
229	 * @since 4.9.10
230	 *
231	 * @param {jQuery} $container jQuery object of view container.
232	 *
233	 * @return {void}
234	 */
235	obj.deinitTooltips = function( $container ) {
236		$container
237			.find( obj.selectors.tooltipTrigger )
238			.each( function( index, trigger ) {
239				$( trigger )
240					.off()
241					.tooltipster( 'instance' )
242					.off();
243			} );
244	};
245
246	/**
247	 * Initialize accessible tooltips via tooltipster
248	 *
249	 * @since 4.9.10
250	 *
251	 * @param {jQuery} $container jQuery object of view container.
252	 *
253	 * @return {void}
254	 */
255	obj.initTooltips = function( $container ) {
256		var theme = $container.data( 'tribeEventsTooltipTheme' );
257
258		$container
259			.find( obj.selectors.tooltipTrigger )
260			.each( function( index, trigger ) {
261				$( trigger ).tooltipster( {
262					animationDuration: 0,
263					interactive: true,
264					delay: [ obj.config.delayHoverIn, obj.config.delayHoverOut ],
265					delayTouch: [ obj.config.delayHoverIn, obj.config.delayHoverOut ],
266					theme: theme,
267					functionInit: obj.onFunctionInit,
268					functionReady: obj.onFunctionReady,
269				} );
270			} );
271	};
272
273	/**
274	 * Initialize tooltip theme
275	 *
276	 * @since 4.9.10
277	 *
278	 * @param {jQuery} $container jQuery object of view container.
279	 *
280	 * @return {void}
281	 */
282	obj.initTheme = function( $container ) {
283		$container.trigger( 'beforeTooltipInitTheme.tribeEvents', [ $container ] );
284
285		var theme = [
286			obj.selectors.tribeEventsTooltipThemeClass.className(),
287			obj.selectors.tribeCommonClass.className(),
288			obj.selectors.tribeEventsClass.className(),
289		];
290		$container.data( 'tribeEventsTooltipTheme', theme );
291
292		$container.trigger( 'afterTooltipInitTheme.tribeEvents', [ $container ] );
293	};
294
295	/**
296	 * Deinitialize tooltip JS.
297	 *
298	 * @since 4.9.5
299	 *
300	 * @param  {Event}       event    event object for 'beforeAjaxSuccess.tribeEvents' event
301	 * @param  {jqXHR}       jqXHR    Request object
302	 * @param  {PlainObject} settings Settings that this request was made with
303	 *
304	 * @return {void}
305	 */
306	obj.deinit = function( event, jqXHR, settings ) {
307		var $container = event.data.container;
308		obj.deinitTooltips( $container );
309		$container.off( 'beforeAjaxSuccess.tribeEvents', obj.deinit );
310	};
311
312	/**
313	 * Initialize tooltips JS.
314	 *
315	 * @since 4.9.5
316	 *
317	 * @param {Event}   event      event object for 'afterSetup.tribeEvents' event
318	 * @param {integer} index      jQuery.each index param from 'afterSetup.tribeEvents' event.
319	 * @param {jQuery}  $container jQuery object of view container.
320	 * @param {object}  data       data object passed from 'afterSetup.tribeEvents' event.
321	 *
322	 * @return {void}
323	 */
324	obj.init = function( event, index, $container, data ) {
325		obj.initTheme( $container );
326		obj.initTooltips( $container );
327		$container.on( 'beforeAjaxSuccess.tribeEvents', { container: $container }, obj.deinit );
328	};
329
330	/**
331	 * Handles the initialization of the scripts when Document is ready
332	 *
333	 * @since  4.9.4
334	 *
335	 * @return {void}
336	 */
337	obj.ready = function() {
338		$document.on( 'afterSetup.tribeEvents', tribe.events.views.manager.selectors.container, obj.init );
339	};
340
341	// Configure on document ready
342	$( obj.ready );
343} )( jQuery, tribe.events.views.tooltip );