import { __ } from '@wordpress/i18n';

[0] Fix | Delete

import { speak } from '@wordpress/a11y';

[1] Fix | Delete

import { SELECTORS } from './constants';

[2] Fix | Delete

import API from './classes/api';

[3] Fix | Delete

import ControlSync from './classes/control/control-sync';

[4] Fix | Delete

import ControlStates from './classes/control/control-states';

[5] Fix | Delete

import ControlMeta from './classes/control/control-meta';

[6] Fix | Delete

import OptimizationDetails from './classes/optimization-details';

[7] Fix | Delete

[8] Fix | Delete

class OptimizationControl {

[9] Fix | Delete

constructor() {

[10] Fix | Delete

this.controlSyncRequestInProgress = false;

[11] Fix | Delete

[12] Fix | Delete

this.init();

[13] Fix | Delete

[14] Fix | Delete

this.controlSync = new ControlSync();

[15] Fix | Delete

}

[16] Fix | Delete

[17] Fix | Delete

init() {

[18] Fix | Delete

this.initEventListeners();

[19] Fix | Delete

[20] Fix | Delete

setInterval( () => this.runStatusCheckLoop(), 5000 );

[21] Fix | Delete

}

[22] Fix | Delete

[23] Fix | Delete

async runStatusCheckLoop() {

[24] Fix | Delete

if ( this.controlSyncRequestInProgress ) {

[25] Fix | Delete

return;

[26] Fix | Delete

}

[27] Fix | Delete

[28] Fix | Delete

this.controlSyncRequestInProgress = true;

[29] Fix | Delete

[30] Fix | Delete

await this.controlSync.run();

[31] Fix | Delete

[32] Fix | Delete

this.controlSyncRequestInProgress = false;

[33] Fix | Delete

}

[34] Fix | Delete

[35] Fix | Delete

initEventListeners() {

[36] Fix | Delete

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

[37] Fix | Delete

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

[38] Fix | Delete

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

[39] Fix | Delete

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

[40] Fix | Delete

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

[41] Fix | Delete

}

[42] Fix | Delete

[43] Fix | Delete

async handleOptimizeButtonClick( e ) {

[44] Fix | Delete

if ( ! e.target.closest( `${ SELECTORS.optimizeButtonSelector }, ${ SELECTORS.tryAgainOptimizeButtonSelector }` ) ) {

[45] Fix | Delete

return;

[46] Fix | Delete

}

[47] Fix | Delete

[48] Fix | Delete

speak( __( 'Optimization is in progress', 'image-optimization' ), 'assertive' );

[49] Fix | Delete

[50] Fix | Delete

const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );

[51] Fix | Delete

const states = new ControlStates( controlWrapper );

[52] Fix | Delete

[53] Fix | Delete

states.renderLoading( 'optimize' );

[54] Fix | Delete

[55] Fix | Delete

try {

[56] Fix | Delete

controlWrapper.dataset.isFrozen = true;

[57] Fix | Delete

[58] Fix | Delete

await API.optimizeSingleImage( {

[59] Fix | Delete

imageId: new ControlMeta( controlWrapper ).getImageId(),

[60] Fix | Delete

reoptimize: false,

[61] Fix | Delete

} );

[62] Fix | Delete

} catch ( error ) {

[63] Fix | Delete

states.renderError( error );

[64] Fix | Delete

}

[65] Fix | Delete

}

[66] Fix | Delete

[67] Fix | Delete

async handleReoptimizeButtonClick( e ) {

[68] Fix | Delete

if ( ! e.target.closest( `${ SELECTORS.reoptimizeButtonSelector }, ${ SELECTORS.tryAgainReoptimizeButtonSelector }` ) ) {

[69] Fix | Delete

return;

[70] Fix | Delete

}

[71] Fix | Delete

[72] Fix | Delete

speak( __( 'Reoptimizing is in progress', 'image-optimization' ), 'assertive' );

[73] Fix | Delete

[74] Fix | Delete

const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );

[75] Fix | Delete

const states = new ControlStates( controlWrapper );

[76] Fix | Delete

[77] Fix | Delete

states.renderLoading( 'reoptimize' );

[78] Fix | Delete

[79] Fix | Delete

try {

[80] Fix | Delete

controlWrapper.dataset.isFrozen = true;

[81] Fix | Delete

[82] Fix | Delete

await API.optimizeSingleImage( {

[83] Fix | Delete

imageId: new ControlMeta( controlWrapper ).getImageId(),

[84] Fix | Delete

reoptimize: true,

[85] Fix | Delete

} );

[86] Fix | Delete

} catch ( error ) {

[87] Fix | Delete

states.renderError( error );

[88] Fix | Delete

}

[89] Fix | Delete

}

[90] Fix | Delete

[91] Fix | Delete

async handleRestoreButtonClick( e ) {

[92] Fix | Delete

if ( ! e.target.closest( `${ SELECTORS.restoreButtonSelector }, ${ SELECTORS.tryAgainRestoreButtonSelector }` ) ) {

[93] Fix | Delete

return;

[94] Fix | Delete

}

[95] Fix | Delete

[96] Fix | Delete

speak( __( 'Image restoring is in progress', 'image-optimization' ), 'assertive' );

[97] Fix | Delete

[98] Fix | Delete

const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );

[99] Fix | Delete

const states = new ControlStates( controlWrapper );

[100] Fix | Delete

[101] Fix | Delete

states.renderLoading( 'restore' );

[102] Fix | Delete

[103] Fix | Delete

try {

[104] Fix | Delete

controlWrapper.dataset.isFrozen = true;

[105] Fix | Delete

[106] Fix | Delete

await API.restoreSingleImage( new ControlMeta( controlWrapper ).getImageId() );

[107] Fix | Delete

} catch ( error ) {

[108] Fix | Delete

states.renderError( error );

[109] Fix | Delete

}

[110] Fix | Delete

}

[111] Fix | Delete

[112] Fix | Delete

async handleOptimizationDetailsOpen( e ) {

[113] Fix | Delete

if ( ! e.target.closest( `${ SELECTORS.optimizationDetailsButtonSelector }` ) ) {

[114] Fix | Delete

return;

[115] Fix | Delete

}

[116] Fix | Delete

[117] Fix | Delete

const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );

[118] Fix | Delete

const imageId = new ControlMeta( controlWrapper ).getImageId();

[119] Fix | Delete

[120] Fix | Delete

try {

[121] Fix | Delete

OptimizationDetails.initModal();

[122] Fix | Delete

OptimizationDetails.renderLoading();

[123] Fix | Delete

[124] Fix | Delete

const details = await API.getOptimizationDetails( imageId );

[125] Fix | Delete

[126] Fix | Delete

OptimizationDetails.openModal();

[127] Fix | Delete

OptimizationDetails.renderData( imageId, details );

[128] Fix | Delete

} catch ( error ) {

[129] Fix | Delete

OptimizationDetails.openModal();

[130] Fix | Delete

OptimizationDetails.renderError( error.message );

[131] Fix | Delete

}

[132] Fix | Delete

}

[133] Fix | Delete

[134] Fix | Delete

async handleOptimizationDetailsClick( e ) {

[135] Fix | Delete

if ( ! e.target.closest( `${ SELECTORS.optimizationDetailsOptimizeButtonSelector }` ) ) {

[136] Fix | Delete

return;

[137] Fix | Delete

}

[138] Fix | Delete

[139] Fix | Delete

const imageId = parseInt( e.target.dataset?.imageId, 10 );

[140] Fix | Delete

[141] Fix | Delete

await API.optimizeSingleImage( { imageId } );

[142] Fix | Delete

[143] Fix | Delete

const controlWrapper = document.querySelector( `.image-optimization-control[data-image-optimization-image-id="${ imageId }"]` );

[144] Fix | Delete

[145] Fix | Delete

if ( controlWrapper ) {

[146] Fix | Delete

new ControlStates( controlWrapper ).renderLoading( 'optimize' );

[147] Fix | Delete

}

[148] Fix | Delete

[149] Fix | Delete

OptimizationDetails.closeModal();

[150] Fix | Delete

}

[151] Fix | Delete

}

[152] Fix | Delete

[153] Fix | Delete

export default OptimizationControl;

[154] Fix | Delete

[155] Fix | Delete