first
This commit is contained in:
147
wp-content/plugins/wp-smushit/_src/js/smush/blocks.js
Normal file
147
wp-content/plugins/wp-smushit/_src/js/smush/blocks.js
Normal file
@@ -0,0 +1,147 @@
|
||||
/**
|
||||
* BLOCK: extend image block
|
||||
*/
|
||||
const { createHigherOrderComponent } = wp.compose,
|
||||
{ Fragment } = wp.element,
|
||||
{ InspectorControls } = wp.blockEditor,
|
||||
{ PanelBody } = wp.components;
|
||||
|
||||
/**
|
||||
* Transform bytes to human readable format.
|
||||
*
|
||||
* @param {number} bytes
|
||||
* @return {string} Readable size string.
|
||||
*/
|
||||
function humanFileSize( bytes ) {
|
||||
const thresh = 1024,
|
||||
units = [ 'kB', 'MB', 'GB', 'TB' ];
|
||||
|
||||
if ( Math.abs( bytes ) < thresh ) {
|
||||
return bytes + ' B';
|
||||
}
|
||||
|
||||
let u = -1;
|
||||
do {
|
||||
bytes /= thresh;
|
||||
++u;
|
||||
} while ( Math.abs( bytes ) >= thresh && u < units.length - 1 );
|
||||
|
||||
return bytes.toFixed( 1 ) + ' ' + units[ u ];
|
||||
}
|
||||
|
||||
/**
|
||||
* Generate Smush stats table.
|
||||
*
|
||||
* @param {number} id
|
||||
* @param {Object} stats
|
||||
* @return {*} Smush stats.
|
||||
*/
|
||||
export function smushStats( id, stats ) {
|
||||
if ( 'undefined' === typeof stats ) {
|
||||
return window.smush_vars.strings.gb.select_image;
|
||||
} else if ( 'string' === typeof stats ) {
|
||||
return stats;
|
||||
}
|
||||
|
||||
return (
|
||||
<div
|
||||
id="smush-stats"
|
||||
className="sui-smush-media smush-stats-wrapper hidden"
|
||||
style={ { display: 'block' } }
|
||||
>
|
||||
<table className="wp-smush-stats-holder">
|
||||
<thead>
|
||||
<tr>
|
||||
<th className="smush-stats-header">
|
||||
{ window.smush_vars.strings.gb.size }
|
||||
</th>
|
||||
<th className="smush-stats-header">
|
||||
{ window.smush_vars.strings.gb.savings }
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{ Object.keys( stats.sizes )
|
||||
.filter( ( item ) => 0 < stats.sizes[ item ].percent )
|
||||
.map( ( item, i ) => (
|
||||
<tr key={ i }>
|
||||
<td>{ item.toUpperCase() }</td>
|
||||
<td>
|
||||
{ humanFileSize(
|
||||
stats.sizes[ item ].bytes
|
||||
) }{ ' ' }
|
||||
( { stats.sizes[ item ].percent }% )
|
||||
</td>
|
||||
</tr>
|
||||
) ) }
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Fetch image data. If image is Smushing, update in 3 seconds.
|
||||
*
|
||||
* TODO: this could be optimized not to query so much.
|
||||
*
|
||||
* @param {Object} props
|
||||
*/
|
||||
export function fetchProps( props ) {
|
||||
const image = new wp.api.models.Media( { id: props.attributes.id } ),
|
||||
smushData = props.attributes.smush;
|
||||
|
||||
image.fetch( { attribute: 'smush' } ).done( function( img ) {
|
||||
if ( 'string' === typeof img.smush ) {
|
||||
props.setAttributes( { smush: img.smush } );
|
||||
//setTimeout( () => fetch( props ), 3000 );
|
||||
} else if (
|
||||
'undefined' !== typeof img.smush &&
|
||||
( 'undefined' === typeof smushData ||
|
||||
JSON.stringify( smushData ) !== JSON.stringify( img.smush ) )
|
||||
) {
|
||||
props.setAttributes( { smush: img.smush } );
|
||||
}
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Modify the block’s edit component.
|
||||
* Receives the original block BlockEdit component and returns a new wrapped component.
|
||||
*/
|
||||
const smushStatsControl = createHigherOrderComponent( ( BlockEdit ) => {
|
||||
return ( props ) => {
|
||||
// If not image block or not selected, return unmodified block.
|
||||
if (
|
||||
'core/image' !== props.name ||
|
||||
! props.isSelected ||
|
||||
'undefined' === typeof props.attributes.id
|
||||
) {
|
||||
return (
|
||||
<Fragment>
|
||||
<BlockEdit { ...props } />
|
||||
</Fragment>
|
||||
);
|
||||
}
|
||||
|
||||
const smushData = props.attributes.smush;
|
||||
fetchProps( props );
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<BlockEdit { ...props } />
|
||||
<InspectorControls>
|
||||
<PanelBody title={ window.smush_vars.strings.gb.stats }>
|
||||
{ smushStats( props.attributes.id, smushData ) }
|
||||
</PanelBody>
|
||||
</InspectorControls>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
}, 'withInspectorControl' );
|
||||
|
||||
wp.hooks.addFilter(
|
||||
'editor.BlockEdit',
|
||||
'wp-smush/smush-data-control',
|
||||
smushStatsControl
|
||||
);
|
138
wp-content/plugins/wp-smushit/_src/js/smush/cdn.js
Normal file
138
wp-content/plugins/wp-smushit/_src/js/smush/cdn.js
Normal file
@@ -0,0 +1,138 @@
|
||||
/* global WP_Smush */
|
||||
/* global ajaxurl */
|
||||
|
||||
/**
|
||||
* CDN functionality.
|
||||
*
|
||||
* @since 3.0
|
||||
*/
|
||||
( function() {
|
||||
'use strict';
|
||||
|
||||
WP_Smush.CDN = {
|
||||
cdnEnableButton: document.getElementById( 'smush-enable-cdn' ),
|
||||
cdnDisableButton: document.getElementById( 'smush-cancel-cdn' ),
|
||||
cdnStatsBox: document.querySelector( '.smush-cdn-stats' ),
|
||||
|
||||
init() {
|
||||
/**
|
||||
* Handle "Get Started" button click on disabled CDN page.
|
||||
*/
|
||||
if ( this.cdnEnableButton ) {
|
||||
this.cdnEnableButton.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
e.currentTarget.classList.add( 'sui-button-onload' );
|
||||
this.toggle_cdn( true );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle "Deactivate' button click on CDN page.
|
||||
*/
|
||||
if ( this.cdnDisableButton ) {
|
||||
this.cdnDisableButton.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
e.currentTarget.classList.add( 'sui-button-onload' );
|
||||
|
||||
this.toggle_cdn( false );
|
||||
} );
|
||||
}
|
||||
|
||||
this.updateStatsBox();
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle CDN.
|
||||
*
|
||||
* @since 3.0
|
||||
*
|
||||
* @param {boolean} enable
|
||||
*/
|
||||
toggle_cdn( enable ) {
|
||||
const nonceField = document.getElementsByName(
|
||||
'wp_smush_options_nonce'
|
||||
);
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open( 'POST', ajaxurl + '?action=smush_toggle_cdn', true );
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
xhr.onload = () => {
|
||||
if ( 200 === xhr.status ) {
|
||||
const res = JSON.parse( xhr.response );
|
||||
if ( 'undefined' !== typeof res.success && res.success ) {
|
||||
window.location.search = 'page=smush-cdn';
|
||||
} else if ( 'undefined' !== typeof res.data.message ) {
|
||||
WP_Smush.helpers.showErrorNotice( res.data.message );
|
||||
}
|
||||
} else {
|
||||
WP_Smush.helpers.showErrorNotice( 'Request failed. Returned status of ' + xhr.status );
|
||||
}
|
||||
};
|
||||
xhr.send(
|
||||
'param=' + enable + '&_ajax_nonce=' + nonceField[ 0 ].value
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* Update the CDN stats box in summary meta box. Only fetch new data when on CDN page.
|
||||
*
|
||||
* @since 3.0
|
||||
*/
|
||||
updateStatsBox() {
|
||||
if (
|
||||
'undefined' === typeof this.cdnStatsBox ||
|
||||
! this.cdnStatsBox
|
||||
) {
|
||||
return;
|
||||
}
|
||||
|
||||
// Only fetch the new stats, when user is on CDN page.
|
||||
if ( ! window.location.search.includes( 'page=smush-cdn' ) ) {
|
||||
return;
|
||||
}
|
||||
|
||||
this.toggleElements();
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open( 'POST', ajaxurl + '?action=get_cdn_stats', true );
|
||||
xhr.onload = () => {
|
||||
if ( 200 === xhr.status ) {
|
||||
const res = JSON.parse( xhr.response );
|
||||
if ( 'undefined' !== typeof res.success && res.success ) {
|
||||
this.toggleElements();
|
||||
} else if ( 'undefined' !== typeof res.data.message ) {
|
||||
WP_Smush.helpers.showErrorNotice( res.data.message );
|
||||
}
|
||||
} else {
|
||||
WP_Smush.helpers.showErrorNotice( 'Request failed. Returned status of ' + xhr.status );
|
||||
}
|
||||
};
|
||||
xhr.send();
|
||||
},
|
||||
|
||||
/**
|
||||
* Show/hide elements during status update in the updateStatsBox()
|
||||
*
|
||||
* @since 3.1 Moved out from updateStatsBox()
|
||||
*/
|
||||
toggleElements() {
|
||||
const spinner = this.cdnStatsBox.querySelector(
|
||||
'.sui-icon-loader'
|
||||
);
|
||||
const elements = this.cdnStatsBox.querySelectorAll(
|
||||
'.wp-smush-stats > :not(.sui-icon-loader)'
|
||||
);
|
||||
|
||||
for ( let i = 0; i < elements.length; i++ ) {
|
||||
elements[ i ].classList.toggle( 'sui-hidden' );
|
||||
}
|
||||
|
||||
spinner.classList.toggle( 'sui-hidden' );
|
||||
},
|
||||
};
|
||||
|
||||
WP_Smush.CDN.init();
|
||||
} )();
|
208
wp-content/plugins/wp-smushit/_src/js/smush/directory-scanner.js
Normal file
208
wp-content/plugins/wp-smushit/_src/js/smush/directory-scanner.js
Normal file
@@ -0,0 +1,208 @@
|
||||
/* global WP_Smush */
|
||||
/* global ajaxurl */
|
||||
|
||||
/**
|
||||
* Directory scanner module that will Smush images in the Directory Smush modal.
|
||||
*
|
||||
* @since 2.8.1
|
||||
*
|
||||
* @param {string|number} totalSteps
|
||||
* @param {string|number} currentStep
|
||||
* @return {Object} Scan object.
|
||||
* @class
|
||||
*/
|
||||
const DirectoryScanner = ( totalSteps, currentStep ) => {
|
||||
totalSteps = parseInt( totalSteps );
|
||||
currentStep = parseInt( currentStep );
|
||||
|
||||
let cancelling = false,
|
||||
failedItems = 0,
|
||||
skippedItems = 0;
|
||||
|
||||
const obj = {
|
||||
scan() {
|
||||
const remainingSteps = totalSteps - currentStep;
|
||||
if ( currentStep !== 0 ) {
|
||||
// Scan started on a previous page load.
|
||||
step( remainingSteps ).fail( this.showScanError );
|
||||
} else {
|
||||
jQuery
|
||||
.post( ajaxurl, {
|
||||
action: 'directory_smush_start',
|
||||
_ajax_nonce: window.wp_smush_msgs.nonce
|
||||
}, () =>
|
||||
step( remainingSteps ).fail( this.showScanError )
|
||||
)
|
||||
.fail( this.showScanError );
|
||||
}
|
||||
},
|
||||
|
||||
cancel() {
|
||||
cancelling = true;
|
||||
return jQuery.post( ajaxurl, {
|
||||
action: 'directory_smush_cancel',
|
||||
_ajax_nonce: window.wp_smush_msgs.nonce
|
||||
} );
|
||||
},
|
||||
|
||||
getProgress() {
|
||||
if ( cancelling ) {
|
||||
return 0;
|
||||
}
|
||||
// O M G ... Logic at it's finest!
|
||||
const remainingSteps = totalSteps - currentStep;
|
||||
return Math.min(
|
||||
Math.round(
|
||||
( parseInt( totalSteps - remainingSteps ) * 100 ) /
|
||||
totalSteps
|
||||
),
|
||||
99
|
||||
);
|
||||
},
|
||||
|
||||
onFinishStep( progress ) {
|
||||
jQuery( '.wp-smush-progress-dialog .sui-progress-state-text' ).html(
|
||||
currentStep -
|
||||
failedItems +
|
||||
'/' +
|
||||
totalSteps +
|
||||
' ' +
|
||||
window.wp_smush_msgs.progress_smushed
|
||||
);
|
||||
WP_Smush.directory.updateProgressBar( progress );
|
||||
},
|
||||
|
||||
onFinish() {
|
||||
WP_Smush.directory.updateProgressBar( 100 );
|
||||
window.location.href =
|
||||
window.wp_smush_msgs.directory_url + '&scan=done';
|
||||
},
|
||||
|
||||
/**
|
||||
* Displays an error when the scan request fails.
|
||||
*
|
||||
* @param {Object} res XHR object.
|
||||
*/
|
||||
showScanError( res ) {
|
||||
const dialog = jQuery( '#wp-smush-progress-dialog' );
|
||||
|
||||
// Add the error class to show/hide elements in the dialog.
|
||||
dialog
|
||||
.removeClass( 'wp-smush-exceed-limit' )
|
||||
.addClass( 'wp-smush-scan-error' );
|
||||
|
||||
// Add the error status and description to the error message.
|
||||
dialog
|
||||
.find( '#smush-scan-error' )
|
||||
.text( `${ res.status } ${ res.statusText }` );
|
||||
|
||||
// Show/hide the 403 error specific instructions.
|
||||
const forbiddenMessage = dialog.find( '.smush-403-error-message' );
|
||||
if ( 403 !== res.status ) {
|
||||
forbiddenMessage.addClass( 'sui-hidden' );
|
||||
} else {
|
||||
forbiddenMessage.removeClass( 'sui-hidden' );
|
||||
}
|
||||
},
|
||||
|
||||
limitReached() {
|
||||
const dialog = jQuery( '#wp-smush-progress-dialog' );
|
||||
|
||||
dialog.addClass( 'wp-smush-exceed-limit' );
|
||||
dialog
|
||||
.find( '#cancel-directory-smush' )
|
||||
.attr( 'data-tooltip', window.wp_smush_msgs.bulk_resume );
|
||||
dialog
|
||||
.find( '.sui-box-body .sui-icon-close' )
|
||||
.removeClass( 'sui-icon-close' )
|
||||
.addClass( 'sui-icon-play' );
|
||||
dialog
|
||||
.find( '#cancel-directory-smush' )
|
||||
.attr( 'id', 'cancel-directory-smush-disabled' );
|
||||
},
|
||||
|
||||
resume() {
|
||||
const dialog = jQuery( '#wp-smush-progress-dialog' );
|
||||
const resume = dialog.find( '#cancel-directory-smush-disabled' );
|
||||
|
||||
dialog.removeClass( 'wp-smush-exceed-limit' );
|
||||
dialog
|
||||
.find( '.sui-box-body .sui-icon-play' )
|
||||
.removeClass( 'sui-icon-play' )
|
||||
.addClass( 'sui-icon-close' );
|
||||
resume.attr( 'data-tooltip', 'Cancel' );
|
||||
resume.attr( 'id', 'cancel-directory-smush' );
|
||||
|
||||
obj.scan();
|
||||
},
|
||||
};
|
||||
|
||||
/**
|
||||
* Execute a scan step recursively
|
||||
*
|
||||
* Private to avoid overriding
|
||||
*
|
||||
* @param {number} remainingSteps
|
||||
*/
|
||||
const step = function( remainingSteps ) {
|
||||
if ( remainingSteps >= 0 ) {
|
||||
currentStep = totalSteps - remainingSteps;
|
||||
return jQuery.post(
|
||||
ajaxurl,
|
||||
{
|
||||
action: 'directory_smush_check_step',
|
||||
_ajax_nonce: window.wp_smush_msgs.nonce,
|
||||
step: currentStep,
|
||||
},
|
||||
( response ) => {
|
||||
// We're good - continue on.
|
||||
if (
|
||||
'undefined' !== typeof response.success &&
|
||||
response.success
|
||||
) {
|
||||
if (
|
||||
'undefined' !== typeof response.data &&
|
||||
'undefined' !== typeof response.data.skipped &&
|
||||
true === response.data.skipped
|
||||
) {
|
||||
skippedItems++;
|
||||
}
|
||||
|
||||
currentStep++;
|
||||
remainingSteps = remainingSteps - 1;
|
||||
obj.onFinishStep( obj.getProgress() );
|
||||
step( remainingSteps ).fail( obj.showScanError );
|
||||
} else if (
|
||||
'undefined' !== typeof response.data.error &&
|
||||
'dir_smush_limit_exceeded' === response.data.error
|
||||
) {
|
||||
// Limit reached. Stop.
|
||||
obj.limitReached();
|
||||
} else {
|
||||
// Error? never mind, continue, but count them.
|
||||
failedItems++;
|
||||
currentStep++;
|
||||
remainingSteps = remainingSteps - 1;
|
||||
obj.onFinishStep( obj.getProgress() );
|
||||
step( remainingSteps ).fail( obj.showScanError );
|
||||
}
|
||||
}
|
||||
);
|
||||
}
|
||||
return jQuery.post(
|
||||
ajaxurl,
|
||||
{
|
||||
action: 'directory_smush_finish',
|
||||
_ajax_nonce: window.wp_smush_msgs.nonce,
|
||||
items: totalSteps - ( failedItems + skippedItems ),
|
||||
failed: failedItems,
|
||||
skipped: skippedItems,
|
||||
},
|
||||
( response ) => obj.onFinish( response )
|
||||
);
|
||||
};
|
||||
|
||||
return obj;
|
||||
};
|
||||
|
||||
export default DirectoryScanner;
|
287
wp-content/plugins/wp-smushit/_src/js/smush/lazy-load.js
Normal file
287
wp-content/plugins/wp-smushit/_src/js/smush/lazy-load.js
Normal file
@@ -0,0 +1,287 @@
|
||||
/* global WP_Smush */
|
||||
/* global ajaxurl */
|
||||
|
||||
/**
|
||||
* Lazy loading functionality.
|
||||
*
|
||||
* @since 3.0
|
||||
*/
|
||||
( function() {
|
||||
'use strict';
|
||||
|
||||
WP_Smush.Lazyload = {
|
||||
lazyloadEnableButton: document.getElementById(
|
||||
'smush-enable-lazyload'
|
||||
),
|
||||
lazyloadDisableButton: document.getElementById(
|
||||
'smush-cancel-lazyload'
|
||||
),
|
||||
|
||||
init() {
|
||||
const self = this;
|
||||
|
||||
/**
|
||||
* Handle "Activate" button click on disabled Lazy load page.
|
||||
*/
|
||||
if ( this.lazyloadEnableButton ) {
|
||||
this.lazyloadEnableButton.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
e.currentTarget.classList.add( 'sui-button-onload' );
|
||||
|
||||
this.toggle_lazy_load( true );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle "Deactivate' button click on Lazy load page.
|
||||
*/
|
||||
if ( this.lazyloadDisableButton ) {
|
||||
this.lazyloadDisableButton.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
e.currentTarget.classList.add( 'sui-button-onload' );
|
||||
|
||||
this.toggle_lazy_load( false );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle "Remove icon" button click on Lazy load page.
|
||||
*
|
||||
* This removes the image from the upload placeholder.
|
||||
*
|
||||
* @since 3.2.2
|
||||
*/
|
||||
const removeSpinner = document.getElementById(
|
||||
'smush-remove-spinner'
|
||||
);
|
||||
if ( removeSpinner ) {
|
||||
removeSpinner.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
this.removeLoaderIcon();
|
||||
} );
|
||||
}
|
||||
const removePlaceholder = document.getElementById(
|
||||
'smush-remove-placeholder'
|
||||
);
|
||||
if ( removePlaceholder ) {
|
||||
removePlaceholder.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
this.removeLoaderIcon( 'placeholder' );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle "Remove" icon click.
|
||||
*
|
||||
* This removes the select icon from the list (not same as above functions).
|
||||
*
|
||||
* @since 3.2.2
|
||||
*/
|
||||
const items = document.querySelectorAll( '.smush-ll-remove' );
|
||||
if ( items && 0 < items.length ) {
|
||||
items.forEach( function( el ) {
|
||||
el.addEventListener( 'click', ( e ) => {
|
||||
e.preventDefault();
|
||||
e.target.closest( 'li' ).style.display = 'none';
|
||||
self.remove(
|
||||
e.target.dataset.id,
|
||||
e.target.dataset.type
|
||||
);
|
||||
} );
|
||||
} );
|
||||
}
|
||||
|
||||
this.handlePredefinedPlaceholders();
|
||||
},
|
||||
|
||||
/**
|
||||
* Handle background color changes for the two predefined placeholders.
|
||||
*
|
||||
* @since 3.7.1
|
||||
*/
|
||||
handlePredefinedPlaceholders() {
|
||||
const pl1 = document.getElementById( 'placeholder-icon-1' );
|
||||
if ( pl1 ) {
|
||||
pl1.addEventListener( 'click', () => this.changeColor( '#F3F3F3' ) );
|
||||
}
|
||||
|
||||
const pl2 = document.getElementById( 'placeholder-icon-2' );
|
||||
if ( pl2 ) {
|
||||
pl2.addEventListener( 'click', () => this.changeColor( '#333333' ) );
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Set color.
|
||||
*
|
||||
* @since 3.7.1
|
||||
* @param {string} color
|
||||
*/
|
||||
changeColor( color ) {
|
||||
document.getElementById( 'smush-color-picker' ).value = color;
|
||||
document.querySelector( '.sui-colorpicker-hex .sui-colorpicker-value > span > span' ).style.backgroundColor = color;
|
||||
document.querySelector( '.sui-colorpicker-hex .sui-colorpicker-value > input' ).value = color;
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle lazy loading.
|
||||
*
|
||||
* @since 3.2.0
|
||||
*
|
||||
* @param {string} enable
|
||||
*/
|
||||
toggle_lazy_load( enable ) {
|
||||
const nonceField = document.getElementsByName(
|
||||
'wp_smush_options_nonce'
|
||||
);
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open(
|
||||
'POST',
|
||||
ajaxurl + '?action=smush_toggle_lazy_load',
|
||||
true
|
||||
);
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
xhr.onload = () => {
|
||||
if ( 200 === xhr.status ) {
|
||||
const res = JSON.parse( xhr.response );
|
||||
if ( 'undefined' !== typeof res.success && res.success ) {
|
||||
window.location.search = 'page=smush-lazy-load';
|
||||
} else if ( 'undefined' !== typeof res.data.message ) {
|
||||
WP_Smush.helpers.showErrorNotice( res.data.message );
|
||||
document.querySelector( '.sui-button-onload' ).classList.remove( 'sui-button-onload' );
|
||||
}
|
||||
} else {
|
||||
WP_Smush.helpers.showErrorNotice( 'Request failed. Returned status of ' + xhr.status );
|
||||
document.querySelector( '.sui-button-onload' ).classList.remove( 'sui-button-onload' );
|
||||
}
|
||||
};
|
||||
xhr.send(
|
||||
'param=' + enable + '&_ajax_nonce=' + nonceField[ 0 ].value
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* Add lazy load spinner icon.
|
||||
*
|
||||
* @since 3.2.2
|
||||
* @param {string} type Accepts: spinner, placeholder.
|
||||
*/
|
||||
addLoaderIcon( type = 'spinner' ) {
|
||||
let frame;
|
||||
|
||||
// If the media frame already exists, reopen it.
|
||||
if ( frame ) {
|
||||
frame.open();
|
||||
return;
|
||||
}
|
||||
|
||||
// Create a new media frame
|
||||
frame = wp.media( {
|
||||
title: 'Select or upload an icon',
|
||||
button: {
|
||||
text: 'Select icon',
|
||||
},
|
||||
multiple: false, // Set to true to allow multiple files to be selected
|
||||
} );
|
||||
|
||||
// When an image is selected in the media frame...
|
||||
frame.on( 'select', function() {
|
||||
// Get media attachment details from the frame state
|
||||
const attachment = frame
|
||||
.state()
|
||||
.get( 'selection' )
|
||||
.first()
|
||||
.toJSON();
|
||||
|
||||
// Send the attachment URL to our custom image input field.
|
||||
const imageIcon = document.getElementById(
|
||||
'smush-' + type + '-icon-preview'
|
||||
);
|
||||
imageIcon.style.backgroundImage =
|
||||
'url("' + attachment.url + '")';
|
||||
imageIcon.style.display = 'block';
|
||||
|
||||
// Send the attachment id to our hidden input
|
||||
document
|
||||
.getElementById( 'smush-' + type + '-icon-file' )
|
||||
.setAttribute( 'value', attachment.id );
|
||||
|
||||
// Hide the add image link
|
||||
document.getElementById(
|
||||
'smush-upload-' + type
|
||||
).style.display = 'none';
|
||||
|
||||
// Unhide the remove image link
|
||||
const removeDiv = document.getElementById(
|
||||
'smush-remove-' + type
|
||||
);
|
||||
removeDiv.querySelector( 'span' ).innerHTML =
|
||||
attachment.filename;
|
||||
removeDiv.style.display = 'block';
|
||||
} );
|
||||
|
||||
// Finally, open the modal on click
|
||||
frame.open();
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove lazy load spinner icon.
|
||||
*
|
||||
* @since 3.2.2
|
||||
* @param {string} type Accepts: spinner, placeholder.
|
||||
*/
|
||||
removeLoaderIcon: ( type = 'spinner' ) => {
|
||||
// Clear out the preview image
|
||||
const imageIcon = document.getElementById(
|
||||
'smush-' + type + '-icon-preview'
|
||||
);
|
||||
imageIcon.style.backgroundImage = '';
|
||||
imageIcon.style.display = 'none';
|
||||
|
||||
// Un-hide the add image link
|
||||
document.getElementById( 'smush-upload-' + type ).style.display =
|
||||
'block';
|
||||
|
||||
// Hide the delete image link
|
||||
document.getElementById( 'smush-remove-' + type ).style.display =
|
||||
'none';
|
||||
|
||||
// Delete the image id from the hidden input
|
||||
document
|
||||
.getElementById( 'smush-' + type + '-icon-file' )
|
||||
.setAttribute( 'value', '' );
|
||||
},
|
||||
|
||||
/**
|
||||
* Remove item.
|
||||
*
|
||||
* @param {number} id Image ID.
|
||||
* @param {string} type Accepts: spinner, placeholder.
|
||||
*/
|
||||
remove: ( id, type = 'spinner' ) => {
|
||||
const nonceField = document.getElementsByName(
|
||||
'wp_smush_options_nonce'
|
||||
);
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open( 'POST', ajaxurl + '?action=smush_remove_icon', true );
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
xhr.send(
|
||||
'id=' +
|
||||
id +
|
||||
'&type=' +
|
||||
type +
|
||||
'&_ajax_nonce=' +
|
||||
nonceField[ 0 ].value
|
||||
);
|
||||
},
|
||||
};
|
||||
|
||||
WP_Smush.Lazyload.init();
|
||||
} )();
|
180
wp-content/plugins/wp-smushit/_src/js/smush/media.js
Normal file
180
wp-content/plugins/wp-smushit/_src/js/smush/media.js
Normal file
@@ -0,0 +1,180 @@
|
||||
/* global smush_vars */
|
||||
/* global _ */
|
||||
|
||||
/**
|
||||
* Adds a Smush Now button and displays stats in Media Attachment Details Screen
|
||||
*/
|
||||
(function ($, _) {
|
||||
'use strict';
|
||||
|
||||
// Local reference to the WordPress media namespace.
|
||||
const smushMedia = wp.media,
|
||||
sharedTemplate =
|
||||
"<span class='setting smush-stats' data-setting='smush'>" +
|
||||
"<span class='name'><%= label %></span>" +
|
||||
"<span class='value'><%= value %></span>" +
|
||||
'</span>',
|
||||
template = _.template(sharedTemplate);
|
||||
|
||||
/**
|
||||
* Create the template.
|
||||
*
|
||||
* @param {string} smushHTML
|
||||
* @return {Object} Template object
|
||||
*/
|
||||
const prepareTemplate = function (smushHTML) {
|
||||
/**
|
||||
* @param {Array} smush_vars.strings Localization strings.
|
||||
* @param {Object} smush_vars Object from wp_localize_script()
|
||||
*/
|
||||
return template({
|
||||
label: smush_vars.strings.stats_label,
|
||||
value: smushHTML,
|
||||
});
|
||||
};
|
||||
|
||||
if (
|
||||
'undefined' !== typeof smushMedia.view &&
|
||||
'undefined' !== typeof smushMedia.view.Attachment.Details.TwoColumn
|
||||
) {
|
||||
// Local instance of the Attachment Details TwoColumn used in the edit attachment modal view
|
||||
const smushMediaTwoColumn =
|
||||
smushMedia.view.Attachment.Details.TwoColumn;
|
||||
|
||||
/**
|
||||
* Add Smush details to attachment.
|
||||
*
|
||||
* A similar view to media.view.Attachment.Details
|
||||
* for use in the Edit Attachment modal.
|
||||
*
|
||||
* @see wp-includes/js/media-grid.js
|
||||
*/
|
||||
smushMedia.view.Attachment.Details.TwoColumn = smushMediaTwoColumn.extend(
|
||||
{
|
||||
initialize() {
|
||||
smushMediaTwoColumn.prototype.initialize.apply(this, arguments);
|
||||
this.listenTo(this.model, 'change:smush', this.render);
|
||||
},
|
||||
|
||||
render() {
|
||||
// Ensure that the main attachment fields are rendered.
|
||||
smushMedia.view.Attachment.prototype.render.apply(
|
||||
this,
|
||||
arguments
|
||||
);
|
||||
|
||||
const smushHTML = this.model.get('smush');
|
||||
if (typeof smushHTML === 'undefined') {
|
||||
return this;
|
||||
}
|
||||
|
||||
this.model.fetch();
|
||||
|
||||
/**
|
||||
* Detach the views, append our custom fields, make sure that our data is fully updated
|
||||
* and re-render the updated view.
|
||||
*/
|
||||
this.views.detach();
|
||||
this.$el
|
||||
.find('.settings')
|
||||
.append(prepareTemplate(smushHTML));
|
||||
this.views.render();
|
||||
|
||||
return this;
|
||||
},
|
||||
}
|
||||
);
|
||||
}
|
||||
|
||||
// Local instance of the Attachment Details TwoColumn used in the edit attachment modal view
|
||||
const smushAttachmentDetails = smushMedia.view.Attachment.Details;
|
||||
|
||||
/**
|
||||
* Add Smush details to attachment.
|
||||
*/
|
||||
smushMedia.view.Attachment.Details = smushAttachmentDetails.extend({
|
||||
initialize() {
|
||||
smushAttachmentDetails.prototype.initialize.apply(this, arguments);
|
||||
this.listenTo(this.model, 'change:smush', this.render);
|
||||
},
|
||||
|
||||
render() {
|
||||
// Ensure that the main attachment fields are rendered.
|
||||
smushMedia.view.Attachment.prototype.render.apply(this, arguments);
|
||||
|
||||
const smushHTML = this.model.get('smush');
|
||||
if (typeof smushHTML === 'undefined') {
|
||||
return this;
|
||||
}
|
||||
|
||||
this.model.fetch();
|
||||
|
||||
/**
|
||||
* Detach the views, append our custom fields, make sure that our data is fully updated
|
||||
* and re-render the updated view.
|
||||
*/
|
||||
this.views.detach();
|
||||
this.$el.append(prepareTemplate(smushHTML));
|
||||
|
||||
return this;
|
||||
},
|
||||
});
|
||||
|
||||
/**
|
||||
* Create a new MediaLibraryTaxonomyFilter we later will instantiate
|
||||
*
|
||||
* @since 3.0
|
||||
*/
|
||||
const MediaLibraryTaxonomyFilter = wp.media.view.AttachmentFilters.extend({
|
||||
id: 'media-attachment-smush-filter',
|
||||
|
||||
createFilters() {
|
||||
this.filters = {
|
||||
all: {
|
||||
text: smush_vars.strings.filter_all,
|
||||
props: { stats: 'all' },
|
||||
priority: 10,
|
||||
},
|
||||
|
||||
unsmushed: {
|
||||
text: smush_vars.strings.filter_not_processed,
|
||||
props: { stats: 'unsmushed' },
|
||||
priority: 20,
|
||||
},
|
||||
|
||||
excluded: {
|
||||
text: smush_vars.strings.filter_excl,
|
||||
props: { stats: 'excluded' },
|
||||
priority: 30,
|
||||
},
|
||||
|
||||
failed: {
|
||||
text: smush_vars.strings.filter_failed,
|
||||
props: { stats: 'failed_processing' },
|
||||
priority: 40,
|
||||
},
|
||||
};
|
||||
},
|
||||
});
|
||||
|
||||
/**
|
||||
* Extend and override wp.media.view.AttachmentsBrowser to include our new filter.
|
||||
*
|
||||
* @since 3.0
|
||||
*/
|
||||
const AttachmentsBrowser = wp.media.view.AttachmentsBrowser;
|
||||
wp.media.view.AttachmentsBrowser = wp.media.view.AttachmentsBrowser.extend({
|
||||
createToolbar() {
|
||||
// Make sure to load the original toolbar
|
||||
AttachmentsBrowser.prototype.createToolbar.call(this);
|
||||
this.toolbar.set(
|
||||
'MediaLibraryTaxonomyFilter',
|
||||
new MediaLibraryTaxonomyFilter({
|
||||
controller: this.controller,
|
||||
model: this.collection.props,
|
||||
priority: -75,
|
||||
}).render()
|
||||
);
|
||||
},
|
||||
});
|
||||
})(jQuery, _);
|
@@ -0,0 +1,45 @@
|
||||
import MixPanel from "../mixpanel";
|
||||
|
||||
class ProductAnalytics {
|
||||
init() {
|
||||
this.trackUltraLinks();
|
||||
}
|
||||
|
||||
trackUltraLinks() {
|
||||
const ultraUpsellLinks = document.querySelectorAll( '.wp-smush-upsell-ultra-compression' );
|
||||
if ( ! ultraUpsellLinks ) {
|
||||
return;
|
||||
}
|
||||
const getLocation = ( ultraLink ) => {
|
||||
const locations = {
|
||||
'settings': 'bulksmush_settings',
|
||||
'dashboard': 'dash_summary',
|
||||
'bulk': 'bulksmush_summary',
|
||||
'directory': 'directory_summary',
|
||||
'lazy-load': 'lazy_summary',
|
||||
'cdn': 'cdn_summary',
|
||||
'webp': 'webp_summary',
|
||||
};
|
||||
const locationId = ultraLink.classList.contains( 'wp-smush-ultra-compression-link' ) ? 'settings' : this.getCurrentPageSlug();
|
||||
return locations[locationId] || 'bulksmush_settings';
|
||||
}
|
||||
|
||||
ultraUpsellLinks.forEach( ( ultraLink ) => {
|
||||
const eventName = 'ultra_upsell_modal';
|
||||
ultraLink.addEventListener( 'click', (e) => {
|
||||
MixPanel.getInstance().track( eventName, {
|
||||
'Location': getLocation( e.target ),
|
||||
'Modal Action': 'direct_cta',
|
||||
});
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
getCurrentPageSlug(){
|
||||
const searchParams = new URLSearchParams(document.location.search);
|
||||
const pageSlug = searchParams.get("page");
|
||||
return 'smush' === pageSlug ? 'dashboard' : pageSlug.replace( 'smush-', '' );
|
||||
}
|
||||
}
|
||||
|
||||
( new ProductAnalytics() ).init();
|
173
wp-content/plugins/wp-smushit/_src/js/smush/settings.js
Normal file
173
wp-content/plugins/wp-smushit/_src/js/smush/settings.js
Normal file
@@ -0,0 +1,173 @@
|
||||
/* global ajaxurl */
|
||||
/* global wp_smush_msgs */
|
||||
/* global WP_Smush */
|
||||
/* global SUI */
|
||||
|
||||
( function( $ ) {
|
||||
'use strict';
|
||||
|
||||
/**
|
||||
* Bulk compress page.
|
||||
*/
|
||||
$( 'form#smush-bulk-form' ).on( 'submit', function( e ) {
|
||||
e.preventDefault();
|
||||
$( '#save-settings-button' ).addClass( 'sui-button-onload' );
|
||||
saveSettings( $( this ).serialize(), 'bulk' );
|
||||
// runReCheck();
|
||||
} );
|
||||
|
||||
/**
|
||||
* Lazy load page.
|
||||
*/
|
||||
$( 'form#smush-lazy-load-form' ).on( 'submit', function( e ) {
|
||||
e.preventDefault();
|
||||
$( '#save-settings-button' ).addClass( 'sui-button-onload-text' );
|
||||
saveSettings( $( this ).serialize(), 'lazy-load' );
|
||||
} );
|
||||
|
||||
/**
|
||||
* CDN page.
|
||||
*/
|
||||
$( 'form#smush-cdn-form' ).on( 'submit', function( e ) {
|
||||
e.preventDefault();
|
||||
$( '#save-settings-button' ).addClass( 'sui-button-onload-text' );
|
||||
saveSettings( $( this ).serialize(), 'cdn' );
|
||||
} );
|
||||
|
||||
/**
|
||||
* Integrations page.
|
||||
*/
|
||||
$( 'form#smush-integrations-form' ).on( 'submit', function( e ) {
|
||||
e.preventDefault();
|
||||
$( '#save-settings-button' ).addClass( 'sui-button-onload-text' );
|
||||
saveSettings( $( this ).serialize(), 'integrations' );
|
||||
} );
|
||||
|
||||
/**
|
||||
* Settings page.
|
||||
*/
|
||||
$( 'form#smush-settings-form' ).on( 'submit', function( e ) {
|
||||
e.preventDefault();
|
||||
$( '#save-settings-button' ).addClass( 'sui-button-onload-text' );
|
||||
saveSettings( $( this ).serialize(), 'settings' );
|
||||
} );
|
||||
|
||||
/**
|
||||
* Save settings.
|
||||
*
|
||||
* @param {string} settings JSON string of settings.
|
||||
* @param {string} page Settings page.
|
||||
*/
|
||||
function saveSettings( settings, page ) {
|
||||
const xhr = new XMLHttpRequest();
|
||||
|
||||
xhr.open( 'POST', ajaxurl + '?action=smush_save_settings', true );
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
|
||||
xhr.onload = () => {
|
||||
$( '#save-settings-button' ).removeClass(
|
||||
'sui-button-onload-text sui-button-onload'
|
||||
);
|
||||
|
||||
if ( 200 === xhr.status ) {
|
||||
const res = JSON.parse( xhr.response );
|
||||
if ( 'undefined' !== typeof res.success && res.success ) {
|
||||
showSuccessNotice( wp_smush_msgs.settingsUpdated );
|
||||
triggerSavedSmushSettingsEvent( res.data );
|
||||
} else if ( res.data && res.data.message ) {
|
||||
WP_Smush.helpers.showErrorNotice( res.data.message );
|
||||
} else {
|
||||
WP_Smush.helpers.showErrorNotice( 'Request failed.' );
|
||||
}
|
||||
} else {
|
||||
WP_Smush.helpers.showErrorNotice( 'Request failed. Returned status of ' + xhr.status );
|
||||
}
|
||||
};
|
||||
|
||||
xhr.send( 'page=' + page + '&' + settings + '&_ajax_nonce=' + wp_smush_msgs.nonce );
|
||||
}
|
||||
|
||||
function triggerSavedSmushSettingsEvent( status ) {
|
||||
document.dispatchEvent(
|
||||
new CustomEvent( 'onSavedSmushSettings', {
|
||||
detail: status
|
||||
} )
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Show successful update notice.
|
||||
*
|
||||
* @param {string} msg Notice message.
|
||||
*/
|
||||
function showSuccessNotice( msg ) {
|
||||
const noticeMessage = `<p>${ msg }</p>`,
|
||||
noticeOptions = {
|
||||
type: 'success',
|
||||
icon: 'check',
|
||||
};
|
||||
|
||||
SUI.openNotice( 'wp-smush-ajax-notice', noticeMessage, noticeOptions );
|
||||
|
||||
const loadingButton = document.querySelector( '.sui-button-onload' );
|
||||
if ( loadingButton ) {
|
||||
loadingButton.classList.remove( 'sui-button-onload' );
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* Re-check images from bulk smush and integrations pages.
|
||||
*/
|
||||
function runReCheck() {
|
||||
$( '#save-settings-button' ).addClass( 'sui-button-onload' );
|
||||
|
||||
const param = {
|
||||
action: 'scan_for_resmush',
|
||||
wp_smush_options_nonce: $( '#wp_smush_options_nonce' ).val(),
|
||||
type: 'media',
|
||||
};
|
||||
|
||||
// Send ajax, Update Settings, And Check For resmush.
|
||||
$.post( ajaxurl, $.param( param ) ).done( function() {
|
||||
$( '#save-settings-button' ).removeClass( 'sui-button-onload' );
|
||||
} );
|
||||
}
|
||||
|
||||
/**
|
||||
* Parse remove data change.
|
||||
*/
|
||||
$( 'input[name=keep_data]' ).on( 'change', function( e ) {
|
||||
const otherClass =
|
||||
'keep_data-true' === e.target.id
|
||||
? 'keep_data-false'
|
||||
: 'keep_data-true';
|
||||
e.target.parentNode.classList.add( 'active' );
|
||||
document
|
||||
.getElementById( otherClass )
|
||||
.parentNode.classList.remove( 'active' );
|
||||
} );
|
||||
|
||||
/**
|
||||
* Handle auto-detect checkbox toggle, to show/hide highlighting notice.
|
||||
*/
|
||||
$( 'input#detection' ).on( 'click', function() {
|
||||
const noticeDiv = $( '.smush-highlighting-notice' );
|
||||
const warningDiv = $( '.smush-highlighting-warning' );
|
||||
|
||||
// Setting enabled.
|
||||
if ( $( this ).is( ':checked' ) ) {
|
||||
// Highlighting is already active and setting not saved.
|
||||
if ( noticeDiv.length > 0 ) {
|
||||
noticeDiv.show();
|
||||
} else {
|
||||
warningDiv.show();
|
||||
}
|
||||
} else {
|
||||
noticeDiv.hide();
|
||||
warningDiv.hide();
|
||||
}
|
||||
} );
|
||||
}( jQuery ) );
|
1210
wp-content/plugins/wp-smushit/_src/js/smush/smush.js
Normal file
1210
wp-content/plugins/wp-smushit/_src/js/smush/smush.js
Normal file
File diff suppressed because it is too large
Load Diff
311
wp-content/plugins/wp-smushit/_src/js/smush/webp.js
Normal file
311
wp-content/plugins/wp-smushit/_src/js/smush/webp.js
Normal file
@@ -0,0 +1,311 @@
|
||||
/* global WP_Smush */
|
||||
/* global ajaxurl */
|
||||
|
||||
/**
|
||||
* WebP functionality.
|
||||
*
|
||||
* @since 3.8.0
|
||||
*/
|
||||
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
WP_Smush.WebP = {
|
||||
nonceField: document.getElementsByName('wp_smush_options_nonce'),
|
||||
toggleModuleButton: document.getElementById('smush-toggle-webp-button'),
|
||||
recheckStatusButton: document.getElementById('smush-webp-recheck'),
|
||||
recheckStatusLink: document.getElementById('smush-webp-recheck-link'),
|
||||
showWizardButton: document.getElementById('smush-webp-toggle-wizard'),
|
||||
|
||||
init() {
|
||||
this.maybeShowDeleteAllSuccessNotice();
|
||||
|
||||
/**
|
||||
* Handles the "Deactivate" and "Get Started" buttons on the WebP page.
|
||||
*/
|
||||
if (this.toggleModuleButton) {
|
||||
this.toggleModuleButton.addEventListener('click', (e) =>
|
||||
this.toggleWebp(e)
|
||||
);
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle "RE-CHECK STATUS' button click on WebP page.
|
||||
*/
|
||||
if (this.recheckStatusButton) {
|
||||
this.recheckStatusButton.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
this.recheckStatus();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle "RE-CHECK STATUS' link click on WebP page.
|
||||
*/
|
||||
if (this.recheckStatusLink) {
|
||||
this.recheckStatusLink.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
this.recheckStatus();
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* Handles the "Delete WebP images" button.
|
||||
*/
|
||||
if (document.getElementById('wp-smush-webp-delete-all')) {
|
||||
document
|
||||
.getElementById('wp-smush-webp-delete-all')
|
||||
.addEventListener('click', (e) => this.deleteAll(e));
|
||||
}
|
||||
|
||||
if (this.showWizardButton) {
|
||||
this.showWizardButton.addEventListener(
|
||||
'click',
|
||||
this.toggleWizard
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* Toggle WebP module.
|
||||
*
|
||||
* @param {Event} e
|
||||
*/
|
||||
toggleWebp(e) {
|
||||
e.preventDefault();
|
||||
|
||||
const button = e.currentTarget,
|
||||
doEnable = 'enable' === button.dataset.action;
|
||||
|
||||
button.classList.add('sui-button-onload');
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('POST', ajaxurl + '?action=smush_webp_toggle', true);
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
|
||||
xhr.onload = () => {
|
||||
const res = JSON.parse(xhr.response);
|
||||
|
||||
if (200 === xhr.status) {
|
||||
if ('undefined' !== typeof res.success && res.success) {
|
||||
const scanPromise = this.runScan();
|
||||
scanPromise.onload = () => {
|
||||
window.location.href =
|
||||
window.wp_smush_msgs.localWebpURL;
|
||||
};
|
||||
} else if ('undefined' !== typeof res.data.message) {
|
||||
this.showNotice(res.data.message);
|
||||
button.classList.remove('sui-button-onload');
|
||||
}
|
||||
} else {
|
||||
let message = window.wp_smush_msgs.generic_ajax_error;
|
||||
if (res && 'undefined' !== typeof res.data.message) {
|
||||
message = res.data.message;
|
||||
}
|
||||
this.showNotice(message);
|
||||
button.classList.remove('sui-button-onload');
|
||||
}
|
||||
};
|
||||
|
||||
xhr.send(
|
||||
'param=' + doEnable + '&_ajax_nonce=' + this.nonceField[0].value
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* re-check server configuration for WebP.
|
||||
*/
|
||||
recheckStatus() {
|
||||
this.recheckStatusButton.classList.add('sui-button-onload');
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('POST', ajaxurl + '?action=smush_webp_get_status', true);
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
xhr.onload = () => {
|
||||
this.recheckStatusButton.classList.remove('sui-button-onload');
|
||||
let message = false;
|
||||
const res = JSON.parse(xhr.response);
|
||||
if (200 === xhr.status) {
|
||||
const isConfigured = res.success ? '1' : '0';
|
||||
if (
|
||||
isConfigured !==
|
||||
this.recheckStatusButton.dataset.isConfigured
|
||||
) {
|
||||
// Reload the page when the configuration status changed.
|
||||
location.reload();
|
||||
}
|
||||
} else {
|
||||
message = window.wp_smush_msgs.generic_ajax_error;
|
||||
}
|
||||
|
||||
if (res && res.data) {
|
||||
message = res.data;
|
||||
}
|
||||
|
||||
if (message) {
|
||||
this.showNotice(message);
|
||||
}
|
||||
};
|
||||
xhr.send('_ajax_nonce=' + window.wp_smush_msgs.webp_nonce);
|
||||
},
|
||||
|
||||
deleteAll(e) {
|
||||
const button = e.currentTarget;
|
||||
button.classList.add('sui-button-onload');
|
||||
|
||||
let message = false;
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open('POST', ajaxurl + '?action=smush_webp_delete_all', true);
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
|
||||
xhr.onload = () => {
|
||||
const res = JSON.parse(xhr.response);
|
||||
if (200 === xhr.status) {
|
||||
if ('undefined' !== typeof res.success && res.success) {
|
||||
const scanPromise = this.runScan();
|
||||
scanPromise.onload = () => {
|
||||
location.search =
|
||||
location.search + '¬ice=webp-deleted';
|
||||
};
|
||||
} else {
|
||||
message = window.wp_smush_msgs.generic_ajax_error;
|
||||
}
|
||||
} else {
|
||||
message = window.wp_smush_msgs.generic_ajax_error;
|
||||
}
|
||||
|
||||
if (res && res.data && res.data.message) {
|
||||
message = res.data.message;
|
||||
}
|
||||
|
||||
if (message) {
|
||||
button.classList.remove('sui-button-onload');
|
||||
|
||||
const noticeMessage = `<p style="text-align: left;">${message}</p>`;
|
||||
const noticeOptions = {
|
||||
type: 'error',
|
||||
icon: 'info',
|
||||
autoclose: {
|
||||
show: false,
|
||||
},
|
||||
};
|
||||
|
||||
window.SUI.openNotice(
|
||||
'wp-smush-webp-delete-all-error-notice',
|
||||
noticeMessage,
|
||||
noticeOptions
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
xhr.send('_ajax_nonce=' + this.nonceField[0].value);
|
||||
},
|
||||
|
||||
toggleWizard(e) {
|
||||
e.currentTarget.classList.add('sui-button-onload');
|
||||
|
||||
const xhr = new XMLHttpRequest();
|
||||
xhr.open(
|
||||
'GET',
|
||||
ajaxurl +
|
||||
'?action=smush_toggle_webp_wizard&_ajax_nonce=' +
|
||||
window.wp_smush_msgs.webp_nonce,
|
||||
true
|
||||
);
|
||||
xhr.onload = () => location.reload();
|
||||
xhr.send();
|
||||
},
|
||||
|
||||
/**
|
||||
* Triggers the scanning of images for updating the images to re-smush.
|
||||
*
|
||||
* @since 3.8.0
|
||||
*/
|
||||
runScan() {
|
||||
const xhr = new XMLHttpRequest(),
|
||||
nonceField = document.getElementsByName(
|
||||
'wp_smush_options_nonce'
|
||||
);
|
||||
|
||||
xhr.open('POST', ajaxurl + '?action=scan_for_resmush', true);
|
||||
xhr.setRequestHeader(
|
||||
'Content-type',
|
||||
'application/x-www-form-urlencoded'
|
||||
);
|
||||
|
||||
xhr.send('_ajax_nonce=' + nonceField[0].value);
|
||||
|
||||
return xhr;
|
||||
},
|
||||
|
||||
/**
|
||||
* Show message (notice).
|
||||
*
|
||||
* @param {string} message
|
||||
* @param {string} type
|
||||
*/
|
||||
showNotice(message, type) {
|
||||
if ('undefined' === typeof message) {
|
||||
return;
|
||||
}
|
||||
|
||||
const noticeMessage = `<p>${message}</p>`;
|
||||
const noticeOptions = {
|
||||
type: type || 'error',
|
||||
icon: 'info',
|
||||
dismiss: {
|
||||
show: true,
|
||||
label: window.wp_smush_msgs.noticeDismiss,
|
||||
tooltip: window.wp_smush_msgs.noticeDismissTooltip,
|
||||
},
|
||||
autoclose: {
|
||||
show: false,
|
||||
},
|
||||
};
|
||||
|
||||
window.SUI.openNotice(
|
||||
'wp-smush-ajax-notice',
|
||||
noticeMessage,
|
||||
noticeOptions
|
||||
);
|
||||
},
|
||||
|
||||
/**
|
||||
* Show delete all webp success notice.
|
||||
*/
|
||||
maybeShowDeleteAllSuccessNotice() {
|
||||
if (!document.getElementById('wp-smush-webp-delete-all-notice')) {
|
||||
return;
|
||||
}
|
||||
const noticeMessage = `<p>${
|
||||
document.getElementById('wp-smush-webp-delete-all-notice')
|
||||
.dataset.message
|
||||
}</p>`;
|
||||
|
||||
const noticeOptions = {
|
||||
type: 'success',
|
||||
icon: 'check-tick',
|
||||
dismiss: {
|
||||
show: true,
|
||||
},
|
||||
};
|
||||
|
||||
window.SUI.openNotice(
|
||||
'wp-smush-webp-delete-all-notice',
|
||||
noticeMessage,
|
||||
noticeOptions
|
||||
);
|
||||
},
|
||||
};
|
||||
|
||||
WP_Smush.WebP.init();
|
||||
})();
|
Reference in New Issue
Block a user