← All changes | modules/infinite-scroll/infinity.js +23 -24 13.7.2 → 16.3-a.1 View file →

		@@ -1,12 +1,12 @@
1	1	/* globals infiniteScroll, _wpmejsSettings, ga, _gaq, WPCOM_sharing_counts, MediaElementPlayer */
2	2	( function () {
3	3	// Open closure.
4	4	// Local vars.
5		- var Scroller, ajaxurl, stats, type, text, totop, loading_text;
	5	+ var Scroller, stats, type, text, totop, loading_text;
6	6
7	7	// IE requires special handling
8		- var isIE = -1 != navigator.userAgent.search( 'MSIE' );
	8	+ var isIE = -1 !== navigator.userAgent.search( 'MSIE' );
9	9	if ( isIE ) {
10	10	var IEVersion = navigator.userAgent.match( /MSIE\s?(\d+)\.?\d*;/ );
11	11	IEVersion = parseInt( IEVersion[ 1 ] );
12	12	}
		@@ -11,9 +11,9 @@
11	11	IEVersion = parseInt( IEVersion[ 1 ] );
12	12	}
13	13
14	14	// HTTP ajaxurl when site is HTTPS causes Access-Control-Allow-Origin failure in Desktop and iOS Safari
15		- if ( 'https:' == document.location.protocol ) {
	15	+ if ( 'https:' === document.location.protocol ) {
16	16	infiniteScroll.settings.ajaxurl = infiniteScroll.settings.ajaxurl.replace(
17	17	'http://',
18	18	'https://'
19	19	);
		@@ -45,9 +45,13 @@
45	45
46	46	// Handle element
47	47	this.handle = document.createElement( 'div' );
48	48	this.handle.setAttribute( 'id', 'infinite-handle' );
49		- this.handle.innerHTML = '<span><button>' + text.replace( '\\', '' ) + '</button></span>';
	49	+ var span = document.createElement( 'span' );
	50	+ var button = document.createElement( 'button' );
	51	+ button.textContent = text;
	52	+ span.appendChild( button );
	53	+ this.handle.appendChild( span );
50	54
51	55	// Footer settings
52	56	this.footer = {
53	57	el: document.getElementById( 'infinite-footer' ),
		@@ -62,9 +66,9 @@
62	66
63	67	// We have two type of infinite scroll
64	68	// cases 'scroll' and 'click'
65	69
66		- if ( type == 'scroll' ) {
	70	+ if ( type === 'scroll' ) {
67	71	// Bind refresh to the scroll event
68	72	// Throttle to check for such case every 300ms
69	73
70	74	// On event the case becomes a fact
		@@ -89,9 +93,9 @@
89	93
90	94	// Ensure that enough posts are loaded to fill the initial viewport, to compensate for short posts and large displays.
91	95	self.ensureFilledViewport();
92	96	this.body.addEventListener( 'is.post-load', self.checkViewportOnLoadBound );
93		- } else if ( type == 'click' ) {
	97	+ } else if ( type === 'click' ) {
94	98	if ( this.click_handle ) {
95	99	this.element.appendChild( this.handle );
96	100	}
97	101
		@@ -128,9 +132,9 @@
128	132	continue;
129	133	}
130	134
131	135	for ( var key in arguments[ i ] ) {
132		- if ( arguments[ i ].hasOwnProperty( key ) ) {
	136	+ if ( Object.hasOwn( arguments[ i ], key ) ) {
133	137	out[ key ] = arguments[ i ][ key ];
134	138	}
135	139	}
136	140	}
		@@ -241,9 +245,9 @@
241	245	try {
242	246	pageWrapper = document.getElementById( this.footer.wrap );
243	247	width = pageWrapper.getBoundingClientRect();
244	248	width = width.width;
245		- } catch ( err ) {
	249	+ } catch {
246	250	width = 0;
247	251	}
248	252
249	253	// Make the footer match the width of the page
		@@ -323,9 +327,9 @@
323	327	loader = document.createElement( 'div' );
324	328	loader.classList.add( 'infinite-loader' );
325	329	loader.setAttribute( 'role', 'progress' );
326	330	loader.innerHTML =
327		- '<div class="spinner"><div class="spinner-inner"><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div><div></div></div></div>';
	331	+ '<svg class="jetpack-spinner infinite-loader-spinner spinner" width="28" height="28" viewBox="0 0 100 100" xmlns="http://www.w3.org/2000/svg" aria-hidden="true" focusable="false"><circle cx="50" cy="50" r="46" fill="none" stroke="#ddd" stroke-width="8"/><path d="M 50 4 A 46 46 0 0 1 96 50" fill="none" stroke="currentColor" stroke-width="8" stroke-linecap="round"><animateTransform attributeName="transform" type="rotate" dur="1.4s" from="0 50 50" to="360 50 50" repeatCount="indefinite"/></path></svg>';
328	332	}
329	333	this.element.appendChild( loader );
330	334	}
331	335
		@@ -487,9 +491,9 @@
487	491	// Render the results
488	492	self.render.call( self, response );
489	493
490	494	// If 'click' type and there are still posts to fetch, add back the handle
491		- if ( type == 'click' ) {
	495	+ if ( type === 'click' ) {
492	496	// add focus to new posts, only in button mode as we know where page focus currently is and only if we have a wrapper
493	497	if ( infiniteScroll.settings.wrapper ) {
494	498	document
495	499	.querySelector(
		@@ -507,14 +511,12 @@
507	511	self.body.classList.remove( 'infinity-success' );
508	512	} else {
509	513	self.trigger( this.body, 'infinite-scroll-posts-end' );
510	514	}
	515	+ } else if ( self.click_handle ) {
	516	+ self.element.appendChild( self.handle );
511	517	} else {
512		- if ( self.click_handle ) {
513		- self.element.appendChild( self.handle );
514		- } else {
515		- self.trigger( this.body, 'infinite-scroll-posts-more' );
516		- }
	518	+ self.trigger( this.body, 'infinite-scroll-posts-more' );
517	519	}
518	520	} else if ( response.lastbatch ) {
519	521	self.disabled = true;
520	522
		@@ -646,9 +648,9 @@
646	648
647	649	/**
648	650	* Get element measurements relative to the viewport.
649	651	*
650		- * @returns {object}
	652	+ * @return {object}
651	653	*/
652	654	Scroller.prototype.measure = function ( element, expandClasses ) {
653	655	expandClasses = expandClasses || [];
654	656
		@@ -749,8 +751,9 @@
749	751	wrapperEls,
750	752	maxFactor = 0;
751	753
752	754	// xor - check if the state has changed
	755	+ // eslint-disable-next-line no-bitwise
753	756	if ( previousFullScrenState ^ currentFullScreenState ) {
754	757	// If we just switched to/from fullscreen,
755	758	// don't do the div clearing/caching or the
756	759	// URL setting. Doing so can break video playback
		@@ -804,9 +807,9 @@
804	807	self.history.path.replace( /%d/, page ) +
805	808	self.history.parameters;
806	809	}
807	810
808		- if ( window.location.href != pageSlug ) {
	811	+ if ( window.location.href !== pageSlug ) {
809	812	history.pushState( null, null, pageSlug );
810	813	}
811	814	};
812	815
		@@ -850,9 +853,9 @@
850	853	bubbles: true,
851	854	cancelable: true,
852	855	detail: opts.data || null,
853	856	} );
854		- } catch ( err ) {
	857	+ } catch {
855	858	e = document.createEvent( 'CustomEvent' );
856	859	e.initCustomEvent( eventName, true, true, opts.data || null );
857	860	}
858	861	el.dispatchEvent( e );
		@@ -861,15 +864,14 @@
861	864	/**
862	865	* Ready, set, go!
863	866	*/
864	867	var jetpackInfinityModule = function () {
865		- var bodyClasses = infiniteScroll.settings.body_class.split( ' ' );
866		-
867	868	// Check for our variables
868	869	if ( 'object' !== typeof infiniteScroll ) {
869	870	return;
870	871	}
871	872
	873	+ var bodyClasses = infiniteScroll.settings.body_class.split( ' ' );
872	874	bodyClasses.forEach( function ( className ) {
873	875	if ( className ) {
874	876	document.body.classList.add( className );
875	877	}
		@@ -874,11 +876,8 @@
874	876	document.body.classList.add( className );
875	877	}
876	878	} );
877	879
878		- // Set ajaxurl (for brevity)
879		- ajaxurl = infiniteScroll.settings.ajaxurl;
880		-
881	880	// Set stats, used for tracking stats
882	881	stats = infiniteScroll.settings.stats;
883	882
884	883	// Define what type of infinity we have, grab text for click-handle
		@@ -894,9 +893,9 @@
894	893
895	894	/**
896	895	* Monitor user scroll activity to update URL to correspond to archive page for current set of IS posts
897	896	*/
898		- if ( type == 'click' ) {
	897	+ if ( type === 'click' ) {
899	898	var timer = null;
900	899	window.addEventListener( 'scroll', function () {
901	900	// run the real scroll handler once every 250 ms.
902	901	if ( timer ) {