Edit File by line

/* global WP_Smush */

[0] Fix | Delete

/* global ajaxurl */

[1] Fix | Delete

[2] Fix | Delete

/**

[3] Fix | Delete

* WebP functionality.

[4] Fix | Delete

[5] Fix | Delete

* @since 3.8.0

[6] Fix | Delete

[7] Fix | Delete

import Fetcher from '../utils/fetcher';

[8] Fix | Delete

[9] Fix | Delete

(function () {

[10] Fix | Delete

'use strict';

[11] Fix | Delete

[12] Fix | Delete

WP_Smush.WebP = {

[13] Fix | Delete

nonceField: document.getElementsByName('wp_smush_options_nonce'),

[14] Fix | Delete

toggleModuleButton: document.getElementById('smush-toggle-webp-button'),

[15] Fix | Delete

recheckStatusButton: document.getElementById('smush-webp-recheck'),

[16] Fix | Delete

recheckStatusLink: document.getElementById('smush-webp-recheck-link'),

[17] Fix | Delete

showWizardButton: document.getElementById('smush-webp-toggle-wizard'),

[18] Fix | Delete

switchWebpMethod: document.getElementById('smush-switch-webp-method' ),

[19] Fix | Delete

[20] Fix | Delete

init() {

[21] Fix | Delete

this.maybeShowDeleteAllSuccessNotice();

[22] Fix | Delete

[23] Fix | Delete

/**

[24] Fix | Delete

* Handles the "Deactivate" and "Get Started" buttons on the WebP page.

[25] Fix | Delete

[26] Fix | Delete

if (this.toggleModuleButton) {

[27] Fix | Delete

this.toggleModuleButton.addEventListener('click', (e) =>

[28] Fix | Delete

this.toggleWebp(e)

[29] Fix | Delete

);

[30] Fix | Delete

}

[31] Fix | Delete

[32] Fix | Delete

/**

[33] Fix | Delete

* Handle "RE-CHECK STATUS' button click on WebP page.

[34] Fix | Delete

[35] Fix | Delete

if (this.recheckStatusButton) {

[36] Fix | Delete

this.recheckStatusButton.addEventListener('click', (e) => {

[37] Fix | Delete

e.preventDefault();

[38] Fix | Delete

this.recheckStatus();

[39] Fix | Delete

});

[40] Fix | Delete

}

[41] Fix | Delete

[42] Fix | Delete

/**

[43] Fix | Delete

* Handle "RE-CHECK STATUS' link click on WebP page.

[44] Fix | Delete

[45] Fix | Delete

if (this.recheckStatusLink) {

[46] Fix | Delete

this.recheckStatusLink.addEventListener('click', (e) => {

[47] Fix | Delete

e.preventDefault();

[48] Fix | Delete

this.recheckStatus();

[49] Fix | Delete

});

[50] Fix | Delete

}

[51] Fix | Delete

[52] Fix | Delete

/**

[53] Fix | Delete

* Handles the "Delete WebP images" button.

[54] Fix | Delete

[55] Fix | Delete

if (document.getElementById('wp-smush-webp-delete-all')) {

[56] Fix | Delete

document

[57] Fix | Delete

.getElementById('wp-smush-webp-delete-all')

[58] Fix | Delete

.addEventListener('click', (e) => this.deleteAll(e));

[59] Fix | Delete

}

[60] Fix | Delete

[61] Fix | Delete

if (this.showWizardButton) {

[62] Fix | Delete

this.showWizardButton.addEventListener(

[63] Fix | Delete

'click',

[64] Fix | Delete

this.toggleWizard

[65] Fix | Delete

);

[66] Fix | Delete

}

[67] Fix | Delete

[68] Fix | Delete

if ( this.switchWebpMethod ) {

[69] Fix | Delete

this.switchWebpMethod.addEventListener(

[70] Fix | Delete

'click',

[71] Fix | Delete

( e ) => {

[72] Fix | Delete

e.preventDefault();

[73] Fix | Delete

e.target.classList.add('wp-smush-link-in-progress');

[74] Fix | Delete

this.switchMethod( this.switchWebpMethod.dataset.method );

[75] Fix | Delete

}

[76] Fix | Delete

);

[77] Fix | Delete

}

[78] Fix | Delete

[79] Fix | Delete

[80] Fix | Delete

switchMethod( newMethod ) {

[81] Fix | Delete

Fetcher.webp.switchMethod( newMethod ).then( ( res ) => {

[82] Fix | Delete

if ( ! res?.success ) {

[83] Fix | Delete

WP_Smush.helpers.showNotice( res );

[84] Fix | Delete

return;

[85] Fix | Delete

}

[86] Fix | Delete

window.location.reload();

[87] Fix | Delete

} );

[88] Fix | Delete

[89] Fix | Delete

[90] Fix | Delete

/**

[91] Fix | Delete

* Toggle WebP module.

[92] Fix | Delete

[93] Fix | Delete

* @param {Event} e

[94] Fix | Delete

[95] Fix | Delete

toggleWebp(e) {

[96] Fix | Delete

e.preventDefault();

[97] Fix | Delete

[98] Fix | Delete

const button = e.currentTarget,

[99] Fix | Delete

doEnable = 'enable' === button.dataset.action;

[100] Fix | Delete

[101] Fix | Delete

button.classList.add('sui-button-onload');

[102] Fix | Delete

[103] Fix | Delete

const xhr = new XMLHttpRequest();

[104] Fix | Delete

xhr.open('POST', ajaxurl + '?action=smush_webp_toggle', true);

[105] Fix | Delete

xhr.setRequestHeader(

[106] Fix | Delete

'Content-type',

[107] Fix | Delete

'application/x-www-form-urlencoded'

[108] Fix | Delete

);

[109] Fix | Delete

[110] Fix | Delete

xhr.onload = () => {

[111] Fix | Delete

const res = JSON.parse(xhr.response);

[112] Fix | Delete

[113] Fix | Delete

if (200 === xhr.status) {

[114] Fix | Delete

if ('undefined' !== typeof res.success && res.success) {

[115] Fix | Delete

const scanPromise = this.runScan();

[116] Fix | Delete

scanPromise.onload = () => {

[117] Fix | Delete

window.location.href =

[118] Fix | Delete

window.wp_smush_msgs.localWebpURL;

[119] Fix | Delete

};

[120] Fix | Delete

} else if ('undefined' !== typeof res.data.message) {

[121] Fix | Delete

this.showNotice(res.data.message);

[122] Fix | Delete

button.classList.remove('sui-button-onload');

[123] Fix | Delete

}

[124] Fix | Delete

} else {

[125] Fix | Delete

let message = window.wp_smush_msgs.generic_ajax_error;

[126] Fix | Delete

if (res && 'undefined' !== typeof res.data.message) {

[127] Fix | Delete

message = res.data.message;

[128] Fix | Delete

}

[129] Fix | Delete

this.showNotice(message);

[130] Fix | Delete

button.classList.remove('sui-button-onload');

[131] Fix | Delete

}

[132] Fix | Delete

};

[133] Fix | Delete

[134] Fix | Delete

xhr.send(

[135] Fix | Delete

'param=' + doEnable + '&_ajax_nonce=' + this.nonceField[0].value

[136] Fix | Delete

);

[137] Fix | Delete

[138] Fix | Delete

[139] Fix | Delete

/**

[140] Fix | Delete

* re-check server configuration for WebP.

[141] Fix | Delete

[142] Fix | Delete

recheckStatus() {

[143] Fix | Delete

this.recheckStatusButton.classList.add('sui-button-onload');

[144] Fix | Delete

[145] Fix | Delete

const xhr = new XMLHttpRequest();

[146] Fix | Delete

xhr.open('POST', ajaxurl + '?action=smush_webp_get_status', true);

[147] Fix | Delete

xhr.setRequestHeader(

[148] Fix | Delete

'Content-type',

[149] Fix | Delete

'application/x-www-form-urlencoded'

[150] Fix | Delete

);

[151] Fix | Delete

xhr.onload = () => {

[152] Fix | Delete

this.recheckStatusButton.classList.remove('sui-button-onload');

[153] Fix | Delete

let message = false;

[154] Fix | Delete

const res = JSON.parse(xhr.response);

[155] Fix | Delete

if (200 === xhr.status) {

[156] Fix | Delete

const isConfigured = res.success ? '1' : '0';

[157] Fix | Delete

if (

[158] Fix | Delete

isConfigured !==

[159] Fix | Delete

this.recheckStatusButton.dataset.isConfigured

[160] Fix | Delete

) {

[161] Fix | Delete

// Reload the page when the configuration status changed.

[162] Fix | Delete

location.reload();

[163] Fix | Delete

}

[164] Fix | Delete

} else {

[165] Fix | Delete

message = window.wp_smush_msgs.generic_ajax_error;

[166] Fix | Delete

}

[167] Fix | Delete

[168] Fix | Delete

if (res && res.data) {

[169] Fix | Delete

message = res.data;

[170] Fix | Delete

}

[171] Fix | Delete

[172] Fix | Delete

if (message) {

[173] Fix | Delete

this.showNotice(message);

[174] Fix | Delete

}

[175] Fix | Delete

};

[176] Fix | Delete

xhr.send('_ajax_nonce=' + window.wp_smush_msgs.webp_nonce);

[177] Fix | Delete

[178] Fix | Delete

[179] Fix | Delete

deleteAll(e) {

[180] Fix | Delete

const button = e.currentTarget;

[181] Fix | Delete

button.classList.add('sui-button-onload');

[182] Fix | Delete

[183] Fix | Delete

let message = false;

[184] Fix | Delete

const xhr = new XMLHttpRequest();

[185] Fix | Delete

xhr.open('POST', ajaxurl + '?action=smush_webp_delete_all', true);

[186] Fix | Delete

xhr.setRequestHeader(

[187] Fix | Delete

'Content-type',

[188] Fix | Delete

'application/x-www-form-urlencoded'

[189] Fix | Delete

);

[190] Fix | Delete

[191] Fix | Delete

xhr.onload = () => {

[192] Fix | Delete

const res = JSON.parse(xhr.response);

[193] Fix | Delete

if (200 === xhr.status) {

[194] Fix | Delete

if ('undefined' !== typeof res.success && res.success) {

[195] Fix | Delete

const scanPromise = this.runScan();

[196] Fix | Delete

scanPromise.onload = () => {

[197] Fix | Delete

location.search =

[198] Fix | Delete

location.search + '&notice=webp-deleted';

[199] Fix | Delete

};

[200] Fix | Delete

} else {

[201] Fix | Delete

message = window.wp_smush_msgs.generic_ajax_error;

[202] Fix | Delete

}

[203] Fix | Delete

} else {

[204] Fix | Delete

message = window.wp_smush_msgs.generic_ajax_error;

[205] Fix | Delete

}

[206] Fix | Delete

[207] Fix | Delete

if (res && res.data && res.data.message) {

[208] Fix | Delete

message = res.data.message;

[209] Fix | Delete

}

[210] Fix | Delete

[211] Fix | Delete

if (message) {

[212] Fix | Delete

button.classList.remove('sui-button-onload');

[213] Fix | Delete

[214] Fix | Delete

const noticeMessage = `${message}`;

[215] Fix | Delete

const noticeOptions = {

[216] Fix | Delete

type: 'error',

[217] Fix | Delete

icon: 'info',

[218] Fix | Delete

autoclose: {

[219] Fix | Delete

show: false,

[220] Fix | Delete

[221] Fix | Delete

};

[222] Fix | Delete

[223] Fix | Delete

window.SUI.openNotice(

[224] Fix | Delete

'wp-smush-webp-delete-all-error-notice',

[225] Fix | Delete

noticeMessage,

[226] Fix | Delete

noticeOptions

[227] Fix | Delete

);

[228] Fix | Delete

}

[229] Fix | Delete

};

[230] Fix | Delete

[231] Fix | Delete

xhr.send('_ajax_nonce=' + this.nonceField[0].value);

[232] Fix | Delete

[233] Fix | Delete

[234] Fix | Delete

toggleWizard(e) {

[235] Fix | Delete

e.currentTarget.classList.add('sui-button-onload');

[236] Fix | Delete

[237] Fix | Delete

const xhr = new XMLHttpRequest();

[238] Fix | Delete

xhr.open(

[239] Fix | Delete

'GET',

[240] Fix | Delete

ajaxurl +

[241] Fix | Delete

'?action=smush_toggle_webp_wizard&_ajax_nonce=' +

[242] Fix | Delete

window.wp_smush_msgs.webp_nonce,

[243] Fix | Delete

true

[244] Fix | Delete

);

[245] Fix | Delete

xhr.onload = () => location.href = window.wp_smush_msgs.localWebpURL;

[246] Fix | Delete

xhr.send();

[247] Fix | Delete

[248] Fix | Delete

[249] Fix | Delete

/**

[250] Fix | Delete

* Triggers the scanning of images for updating the images to re-smush.

[251] Fix | Delete

[252] Fix | Delete

* @since 3.8.0

[253] Fix | Delete

[254] Fix | Delete

runScan() {

[255] Fix | Delete

const xhr = new XMLHttpRequest(),

[256] Fix | Delete

nonceField = document.getElementsByName(

[257] Fix | Delete

'wp_smush_options_nonce'

[258] Fix | Delete

);

[259] Fix | Delete

[260] Fix | Delete

xhr.open('POST', ajaxurl + '?action=scan_for_resmush', true);

[261] Fix | Delete

xhr.setRequestHeader(

[262] Fix | Delete

'Content-type',

[263] Fix | Delete

'application/x-www-form-urlencoded'

[264] Fix | Delete

);

[265] Fix | Delete

[266] Fix | Delete

xhr.send('_ajax_nonce=' + nonceField[0].value);

[267] Fix | Delete

[268] Fix | Delete

return xhr;

[269] Fix | Delete

[270] Fix | Delete

[271] Fix | Delete

/**

[272] Fix | Delete

* Show message (notice).

[273] Fix | Delete

[274] Fix | Delete

* @param {string} message

[275] Fix | Delete

* @param {string} type

[276] Fix | Delete

[277] Fix | Delete

showNotice(message, type) {

[278] Fix | Delete

if ('undefined' === typeof message) {

[279] Fix | Delete

return;

[280] Fix | Delete

}

[281] Fix | Delete

[282] Fix | Delete

const noticeMessage = `${message}`;

[283] Fix | Delete

const noticeOptions = {

[284] Fix | Delete

type: type || 'error',

[285] Fix | Delete

icon: 'info',

[286] Fix | Delete

dismiss: {

[287] Fix | Delete

show: true,

[288] Fix | Delete

label: window.wp_smush_msgs.noticeDismiss,

[289] Fix | Delete

tooltip: window.wp_smush_msgs.noticeDismissTooltip,

[290] Fix | Delete

[291] Fix | Delete

autoclose: {

[292] Fix | Delete

show: false,

[293] Fix | Delete

[294] Fix | Delete

};

[295] Fix | Delete

[296] Fix | Delete

window.SUI.openNotice(

[297] Fix | Delete

'wp-smush-ajax-notice',

[298] Fix | Delete

noticeMessage,

[299] Fix | Delete

noticeOptions

[300] Fix | Delete

);

[301] Fix | Delete

[302] Fix | Delete

[303] Fix | Delete

/**

[304] Fix | Delete

* Show delete all webp success notice.

[305] Fix | Delete

[306] Fix | Delete

maybeShowDeleteAllSuccessNotice() {

[307] Fix | Delete

if (!document.getElementById('wp-smush-webp-delete-all-notice')) {

[308] Fix | Delete

return;

[309] Fix | Delete

}

[310] Fix | Delete

const noticeMessage = `${

[311] Fix | Delete

document.getElementById('wp-smush-webp-delete-all-notice')

[312] Fix | Delete

.dataset.message

[313] Fix | Delete

}`;

[314] Fix | Delete

[315] Fix | Delete

const noticeOptions = {

[316] Fix | Delete

type: 'success',

[317] Fix | Delete

icon: 'check-tick',

[318] Fix | Delete

dismiss: {

[319] Fix | Delete

show: true,

[320] Fix | Delete

[321] Fix | Delete

};

[322] Fix | Delete

[323] Fix | Delete

window.SUI.openNotice(

[324] Fix | Delete

'wp-smush-webp-delete-all-notice',

[325] Fix | Delete

noticeMessage,

[326] Fix | Delete

noticeOptions

[327] Fix | Delete

);

[328] Fix | Delete

[329] Fix | Delete

};

[330] Fix | Delete

[331] Fix | Delete

WP_Smush.WebP.init();

[332] Fix | Delete

})();

[333] Fix | Delete

[334] Fix | Delete