https://www.kzoz.com/wp-content/plugins/the-events-calendar-new/sr…/js/views/breakpoints.js?ver=5.1.5

1/* globals jQuery, tribe */
2/**
3 * Makes sure we have all the required levels on the Tribe Object
4 *
5 * @since 5.0.0
6 *
7 * @type   {Object}
8 */
9tribe.events = tribe.events || {};
10tribe.events.views = tribe.events.views || {};
11
12/**
13 * Configures Breakpoints Object in the Global Tribe variable
14 *
15 * @since 5.0.0
16 *
17 * @type   {Object}
18 */
19tribe.events.views.breakpoints = {};
20
21/**
22 * Initializes in a Strict env the code that manages the Event Views
23 *
24 * @since  5.0.0
25 *
26 * @param  {FunctionConstructor} $   jQuery
27 * @param  {Object} obj tribe.events.views.breakpoints
28 *
29 * @return {void}
30 */
31( function( $, obj ) {
32	'use strict';
33	var $document = $( document );
34
35	/**
36	 * Selectors used for configuration and setup
37	 *
38	 * @since 5.0.0
39	 *
40	 * @type {Object}
41	 */
42	obj.selectors = {
43		container: '[data-js="tribe-events-view"]',
44		dataScript: '[data-js="tribe-events-view-data"]',
45		breakpointClassPrefix: 'tribe-common--breakpoint-',
46	};
47
48	/**
49	 * Object of breakpoints
50	 *
51	 * @since 5.0.0
52	 *
53	 * @type {Object}
54	 */
55	obj.breakpoints = {};
56
57	/**
58	 * Sets container classes based on breakpoint
59	 *
60	 * @since  5.0.0
61	 *
62	 * @param  {jQuery}  $container jQuery object of view container.
63	 * @param  {object}  data       data object passed from 'afterSetup.tribeEvents' event.
64	 *
65	 * @return {void}
66	 */
67	obj.setContainerClasses = function( $container, data ) {
68		if ( !data || !data.breakpoints ) {
69			return;
70		}
71
72		if ( !$container || !$container.length || !$container[0] ) {
73			return;
74		}
75
76		var breakpoints = Object.keys( data.breakpoints );
77
78		breakpoints.forEach( function( breakpoint ) {
79			var className = obj.selectors.breakpointClassPrefix + breakpoint;
80			obj.breakpoints[ breakpoint ] = data.breakpoints[ breakpoint ];
81
82			if ( $container.outerWidth() < data.breakpoints[ breakpoint ] ) {
83				$container.removeClass( className );
84			} else {
85				$container.addClass( className );
86			}
87		} );
88	};
89
90	/**
91	 * Handles resize event for window
92	 *
93	 * @since  5.0.0
94	 *
95	 * @param  {Event} event event object for 'resize' event
96	 *
97	 * @return {void}
98	 */
99	obj.handleResize = function( event ) {
100		obj.setContainerClasses( event.data.container, event.data.data );
101	};
102
103	/**
104	 * Unbinds events for container
105	 *
106	 * @since  5.0.0
107	 *
108	 * @param  {jQuery} $container jQuery object of view container
109	 *
110	 * @return {void}
111	 */
112	obj.unbindEvents = function( $container ) {
113		$container
114			.off( 'resize.tribeEvents', obj.handleResize )
115			.off( 'beforeAjaxSuccess.tribeEvents', obj.deinit );
116	};
117
118	/**
119	 * Binds events for container
120	 *
121	 * @since  5.0.0
122	 *
123	 * @param  {jQuery}  $container jQuery object of view container.
124	 * @param  {object}  data       data object passed from 'afterSetup.tribeEvents' event.
125	 *
126	 * @return {void}
127	 */
128	obj.bindEvents = function( $container, data ) {
129		$container
130			.on( 'resize.tribeEvents', { container: $container, data: data }, obj.handleResize )
131			.on( 'beforeAjaxSuccess.tribeEvents', { container: $container }, obj.deinit );
132	};
133
134	/**
135	 * De-initialize breakpoints JS
136	 *
137	 * @since  5.0.0
138	 *
139	 * @param  {Event}       event    event object for 'beforeAjaxSuccess.tribeEvents' event
140	 * @param  {jqXHR}       jqXHR    Request object
141	 * @param  {Object} settings Settings that this request was made with
142	 *
143	 * @return {void}
144	 */
145	obj.deinit = function( event, jqXHR, settings ) {
146		obj.unbindEvents( event.data.container );
147	};
148
149	/**
150	 * Common initialization tasks
151	 *
152	 * @since  5.0.0
153	 *
154	 * @param  {jQuery}  $container jQuery object of view container.
155	 * @param  {object}  data       data object passed from 'afterSetup.tribeEvents' event.
156	 *
157	 * @return {void}
158	 */
159	obj.initTasks = function( $container, data ) {
160		if ( ! ( $container instanceof jQuery ) ) {
161			// eslint-disable-next-line no-param-reassign
162			$container = $( $container );
163		}
164
165		obj.bindEvents( $container, data );
166		obj.setContainerClasses( $container, data );
167
168		var state = { initialized: true };
169		$container.data( 'tribeEventsBreakpoints', state );
170	};
171
172	/**
173	 * Initialize breakpoints JS
174	 *
175	 * @since  5.0.0
176	 *
177	 * @param  {Event}   event      event object for 'afterSetup.tribeEvents' event
178	 * @param  {int}     index      jQuery.each index param from 'afterSetup.tribeEvents' event.
179	 * @param  {jQuery}  $container jQuery object of view container.
180	 * @param  {object}  data       data object passed from 'afterSetup.tribeEvents' event.
181	 *
182	 * @return {void}
183	 */
184	obj.init = function( event, index, $container, data ) {
185		if ( ! ( $container instanceof jQuery ) ) {
186			// eslint-disable-next-line no-param-reassign
187			$container = $( $container );
188		}
189
190		var state = $container.data( 'tribeEventsBreakpoints' );
191		if ( state && state.initialized ) {
192			return;
193		}
194
195		obj.initTasks( $container, data );
196	};
197
198	/**
199	 * Setup breakpoints JS
200	 *
201	 * @since  5.0.0
202	 *
203	 * @param  {HTMLElement} container HTML element of the script tag calling setup
204	 *
205	 * @return {void}
206	 */
207	obj.setup = function( container ) {
208		var $container = $( container );
209
210		if ( ! $container.is( obj.selectors.container ) ) {
211			return;
212		}
213		var $data = $container.find( obj.selectors.dataScript );
214		var data = {};
215
216		// If we have data element set it up.
217		if ( $data.length ) {
218			data = JSON.parse( $data.text().trim() );
219		}
220
221		obj.initTasks( $container, data );
222	};
223
224	/**
225	 * Handles the initialization of breakpoints when Document is ready
226	 *
227	 * @since  5.0.0
228	 *
229	 * @return {void}
230	 */
231	obj.ready = function() {
232		$document.on( 'afterSetup.tribeEvents', obj.selectors.container, obj.init );
233	};
234
235	// Configure on document ready
236	$( obj.ready );
237} )( jQuery, tribe.events.views.breakpoints );