← All changes | assets/js/options.js +68 -11 2.2.9 → trunk View file →

		@@ -45,9 +45,12 @@
45	45	} ).then( function() {
46	46	location.reload();
47	47	} );
48	48	}
49		-
	49	+ } )
	50	+ .always( function() {
	51	+ // Always release the lock, even when the request was aborted or failed,
	52	+ // so a following blur can trigger a fresh check instead of staying stuck.
50	53	busy = false;
51	54	} );
52	55	} );
53	56
		@@ -515,9 +518,9 @@
515	518	/*
516	519	* Init.
517	520	*/
518	521	init: function () {
519		- var processed, progress;
	522	+ var progress;
520	523	this.$missingWebpElement = $('.generate-missing-webp');
521	524	this.$missingWebpMessage = $('.generate-missing-webp p');
522	525
523	526	this.$button = $( '#imagify-generate-webp-versions' );
		@@ -555,12 +558,11 @@
555	558	w.imagify.beat.disableSuspend();
556	559
557	560	this.$missingWebpMessage.hide().attr('aria-hidden', 'true');
558	561
559		- processed = imagifyOptions.bulk.progress_next_gen.total - imagifyOptions.bulk.progress_next_gen.remaining;
560		- progress = Math.floor( processed / imagifyOptions.bulk.progress_next_gen.total * 100 );
561		- this.$progressBar.css( 'width', progress + '%' );
562		- this.$progressText.text( processed + '/' + imagifyOptions.bulk.progress_next_gen.total );
	562	+ progress = this.getProgress( imagifyOptions.bulk.progress_next_gen.total, imagifyOptions.bulk.progress_next_gen.remaining );
	563	+ this.$progressBar.css( 'width', progress.percent + '%' );
	564	+ this.$progressText.text( progress.processed + '/' + progress.total );
563	565
564	566	this.$progressWrap.slideDown().attr( 'aria-hidden', 'false' ).removeClass( 'hidden' );
565	567	}
566	568	},
		@@ -622,8 +624,28 @@
622	624	data[ imagifyOptions.bulk.imagifybeatIDs.progress ] = imagifyOptions.bulk.contexts;
623	625	},
624	626
625	627	/**
	628	+ * Compute a display-safe progress state.
	629	+ *
	630	+ * `total` is a snapshot taken when the run started, while `remaining` is recounted on
	631	+ * every Imagifybeat tick. Anything that grows the workload mid-run pushes `remaining`
	632	+ * above `total`: uploading new media while the run is in progress, or switching the
	633	+ * Next-Gen format so that every media is suddenly missing one. `total - remaining` then
	634	+ * rendered as a negative count, and a snapshot of 0 divided by zero on top of that.
	635	+ *
	636	+ * Track the largest workload seen instead, so the count never goes negative and the
	637	+ * denominator reflects what is actually left to do.
	638	+ *
	639	+ * @param {number} total Number of media to process when the run started.
	640	+ * @param {number} remaining Number of media still waiting to be processed.
	641	+ * @return {object} Object with `processed`, `total` and `percent` keys.
	642	+ */
	643	+ getProgress: function ( total, remaining ) {
	644	+ return w.imagify.getProgress( total, remaining );
	645	+ },
	646	+
	647	+ /**
626	648	* Listen for the custom event "imagifybeat-tick" on $(document).
627	649	* It allows to update various data periodically.
628	650	*
629	651	* @param {object} e Event object.
		@@ -629,9 +651,9 @@
629	651	* @param {object} e Event object.
630	652	* @param {object} data Object containing all Imagifybeat IDs.
631	653	*/
632	654	processQueueImagifybeat: function ( e, data ) {
633		- var images_status, processed, progress;
	655	+ var images_status, progress;
634	656
635	657	if ( e.data.imagifyOptionsBulk && typeof data[ imagifyOptions.bulk.imagifybeatIDs.progress ] === 'undefined' ) {
636	658	return;
637	659	}
		@@ -647,12 +669,11 @@
647	669	e.data.imagifyOptionsBulk.processFinished();
648	670	return;
649	671	}
650	672
651		- processed = images_status.total - images_status.remaining;
652		- progress = Math.floor( processed / images_status.total * 100 );
653		- e.data.imagifyOptionsBulk.$progressBar.css( 'width', progress + '%' );
654		- e.data.imagifyOptionsBulk.$progressText.text( processed + '/' + images_status.total );
	673	+ progress = e.data.imagifyOptionsBulk.getProgress( images_status.total, images_status.remaining );
	674	+ e.data.imagifyOptionsBulk.$progressBar.css( 'width', progress.percent + '%' );
	675	+ e.data.imagifyOptionsBulk.$progressText.text( progress.processed + '/' + progress.total );
655	676	},
656	677
657	678	/**
658	679	* Add a Imagifybeat ID for requirements on "imagifybeat-send" event.
		@@ -1035,4 +1056,40 @@
1035	1056	}
1036	1057	} );
1037	1058
1038	1059	} )(window, document, jQuery);
	1060	+
	1061	+// Imagify Analytics opt-in toggle ================================================================
	1062	+(function($) {
	1063	+
	1064	+ var $checkbox = $( '#imagify-analytics-enabled' );
	1065	+
	1066	+ if ( ! $checkbox.length ) {
	1067	+ return;
	1068	+ }
	1069	+
	1070	+ $checkbox.on( 'change.imagify-analytics', function() {
	1071	+ var nonce = $( this ).data( 'nonce' );
	1072	+
	1073	+ $.post( ajaxurl, {
	1074	+ action: 'imagify_toggle_tracking_optin',
	1075	+ value: $( this ).prop( 'checked' ) ? 1 : 0,
	1076	+ nonce: nonce
	1077	+ } );
	1078	+ } );
	1079	+
	1080	+ $( document ).on( 'click.imagify-analytics', '#imagify-analytics-enable-from-modal', function() {
	1081	+ $( '.imagify-modal.modal-is-open .close-btn' ).trigger( 'click.imagify' );
	1082	+ $checkbox.prop( 'checked', true ).trigger( 'change.imagify-analytics' );
	1083	+ } );
	1084	+
	1085	+})(jQuery);
	1086	+
	1087	+// Imagify Analytics opt-in notice: toggle the data preview =======================================
	1088	+(function($) {
	1089	+
	1090	+ $( document ).on( 'click.imagify-analytics', '.imagify-analytics-preview-toggle', function( e ) {
	1091	+ e.preventDefault();
	1092	+ $( this ).closest( 'p' ).next( '.imagify-analytics-data-container' ).slideToggle();
	1093	+ } );
	1094	+
	1095	+})(jQuery);