import { __ } from '@wordpress/i18n';
import { speak } from '@wordpress/a11y';
import { SELECTORS } from './constants';
import API from './classes/api';
import ControlSync from './classes/control/control-sync';
import ControlStates from './classes/control/control-states';
import ControlMeta from './classes/control/control-meta';
import OptimizationDetails from './classes/optimization-details';
class OptimizationControl {
constructor() {
this.controlSyncRequestInProgress = false;
this.init();
this.controlSync = new ControlSync();
}
init() {
this.initEventListeners();
setInterval( () => this.runStatusCheckLoop(), 5000 );
}
async runStatusCheckLoop() {
if ( this.controlSyncRequestInProgress ) {
return;
}
this.controlSyncRequestInProgress = true;
await this.controlSync.run();
this.controlSyncRequestInProgress = false;
}
initEventListeners() {
document.addEventListener( 'click', ( e ) => this.handleOptimizeButtonClick( e ) );
document.addEventListener( 'click', ( e ) => this.handleReoptimizeButtonClick( e ) );
document.addEventListener( 'click', ( e ) => this.handleRestoreButtonClick( e ) );
document.addEventListener( 'click', ( e ) => this.handleOptimizationDetailsOpen( e ) );
document.addEventListener( 'click', ( e ) => this.handleOptimizationDetailsClick( e ) );
}
async handleOptimizeButtonClick( e ) {
if ( ! e.target.closest( `${ SELECTORS.optimizeButtonSelector }, ${ SELECTORS.tryAgainOptimizeButtonSelector }` ) ) {
return;
}
speak( __( 'Optimization is in progress', 'image-optimization' ), 'assertive' );
const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );
const states = new ControlStates( controlWrapper );
states.renderLoading( 'optimize' );
try {
controlWrapper.dataset.isFrozen = true;
await API.optimizeSingleImage( {
imageId: new ControlMeta( controlWrapper ).getImageId(),
reoptimize: false,
} );
} catch ( error ) {
states.renderError( error );
}
}
async handleReoptimizeButtonClick( e ) {
if ( ! e.target.closest( `${ SELECTORS.reoptimizeButtonSelector }, ${ SELECTORS.tryAgainReoptimizeButtonSelector }` ) ) {
return;
}
speak( __( 'Reoptimizing is in progress', 'image-optimization' ), 'assertive' );
const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );
const states = new ControlStates( controlWrapper );
states.renderLoading( 'reoptimize' );
try {
controlWrapper.dataset.isFrozen = true;
await API.optimizeSingleImage( {
imageId: new ControlMeta( controlWrapper ).getImageId(),
reoptimize: true,
} );
} catch ( error ) {
states.renderError( error );
}
}
async handleRestoreButtonClick( e ) {
if ( ! e.target.closest( `${ SELECTORS.restoreButtonSelector }, ${ SELECTORS.tryAgainRestoreButtonSelector }` ) ) {
return;
}
speak( __( 'Image restoring is in progress', 'image-optimization' ), 'assertive' );
const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );
const states = new ControlStates( controlWrapper );
states.renderLoading( 'restore' );
try {
controlWrapper.dataset.isFrozen = true;
await API.restoreSingleImage( new ControlMeta( controlWrapper ).getImageId() );
} catch ( error ) {
states.renderError( error );
}
}
async handleOptimizationDetailsOpen( e ) {
if ( ! e.target.closest( `${ SELECTORS.optimizationDetailsButtonSelector }` ) ) {
return;
}
const controlWrapper = e.target.closest( SELECTORS.controlWrapperSelector );
const imageId = new ControlMeta( controlWrapper ).getImageId();
try {
OptimizationDetails.initModal();
OptimizationDetails.renderLoading();
const details = await API.getOptimizationDetails( imageId );
OptimizationDetails.openModal();
OptimizationDetails.renderData( imageId, details );
} catch ( error ) {
OptimizationDetails.openModal();
OptimizationDetails.renderError( error.message );
}
}
async handleOptimizationDetailsClick( e ) {
if ( ! e.target.closest( `${ SELECTORS.optimizationDetailsOptimizeButtonSelector }` ) ) {
return;
}
const imageId = parseInt( e.target.dataset?.imageId, 10 );
await API.optimizeSingleImage( { imageId } );
const controlWrapper = document.querySelector( `.image-optimization-control[data-image-optimization-image-id="${ imageId }"]` );
if ( controlWrapper ) {
new ControlStates( controlWrapper ).renderLoading( 'optimize' );
}
OptimizationDetails.closeModal();
}
}
export default OptimizationControl;
{
"name": "woocommerce/product-image",
"title": "Product Image",
"description": "Display the main product image.",
"category": "woocommerce-product-elements",
"attributes": {
"showProductLink": { "type": "boolean", "default": true },
"showSaleBadge": { "type": "boolean", "default": true },
"saleBadgeAlign": { "type": "string", "default": "right" },
"imageSizing": { "type": "string", "default": "single" },
"productId": { "type": "number", "default": 0 },
"isDescendentOfQueryLoop": { "type": "boolean", "default": false },
"isDescendentOfSingleProductBlock": {
"type": "boolean",
"default": false
},
"width": { "type": "string" },
"height": { "type": "string" },
"scale": { "type": "string", "default": "cover" },
"aspectRatio": { "type": "string" }
},
"supports": {
"interactivity": {
"clientNavigation": true
},
"html": false,
"__experimentalBorder": {
"radius": true,
"__experimentalSkipSerialization": true
},
"typography": {
"fontSize": true,
"__experimentalSkipSerialization": true
},
"spacing": {
"margin": true,
"padding": true
},
"dimensions": {
"aspectRatio": true,
"__experimentalSkipSerialization": true
},
"email": true
},
"selectors": {
"root": ".wp-block-woocommerce-product-image.wc-block-components-product-image, .wp-block-woocommerce-product-image .wc-block-components-product-image"
},
"ancestor": [
"woocommerce/all-products",
"woocommerce/single-product",
"woocommerce/product-template",
"core/post-template"
],
"usesContext": [ "imageId", "postId", "query", "queryId" ],
"keywords": [ "WooCommerce" ],
"textdomain": "woocommerce",
"apiVersion": 3,
"$schema": "https://schemas.wp.org/trunk/block.json"
}
Salon de thé | Les Filles du Thé
Aller au contenu
Bonjour très cher(e)s AmiThés ! L’Otaku, “ Thé et Mangas jusqu’au bout des doigts” n’est pas seulement un super salon de Thé Lillois, c’est aussi un lieu qui permet d’échanger ! En effet, Les Filles du Thé ont été contactées par Alex de WeskyTV pour une interview ! Alex avait trouvé notre carte et Vianney … Lire la suite Retour à l’Otaku pour l’interview d’une des Filles du Thé par Weskhy TV !
Bonjour à vous, nos chers Ami(e)s Thé ! Si vous voulez marcher dans les pas des Filles du Thé à Lille, un endroit incontournable, l’Otaku ! C’est au 7 rue Jean sans Peur … même pas peur ! Un royaume japonais au cœur de Lille ! Ouvert depuis octobre 2016, l’Otaku est le fruit … Lire la suite L’Otaku, Thés et Mangas jusqu’au bout des doigts !
Bonjour à toutes et à tous ! C’est en plein cœur de la campagne à Sars et Rosières plus précisément que les Filles du Thé se sont retrouvée Hors Saison, et non pas Hors sujet ! Hors Saison, un endroit pas comme les autres ! En effet, en arrivant, le ton est donné par les … Lire la suite Un Salon de Thé, pour les Filles du Thé, Hors Saison et hors du temps !
Bonjour à toutes et à tous, Nous avons tellement adoré le moment passé chez Kosyuen (vous pouvez aller voir l’article ici) que nous avions envie d’en savoir un peu plus. Anne-Laure, la gérante du salon de thé Japonais a gentiment accepté d’être interviewée et de nous livrer les secrets de Kosyuen. Retrouvez les infos sur … Lire la suite Interview | Kosyuen, LE salon de Thé JAPONAIS à PARIS
Bonjour à toutes et à tous, En cherchant un salon de thé sympa à Paris où passer un moment entre amis, j’ai (Juliette) demandé conseil à Valentine du blog Thé Café & Scones qui m’a tout de suite fait une top liste (ou une liste top) de petites merveilles de salons dignes de ce nom. … Lire la suite Kosyuen : Le salon de thé JAPONAIS en plein coeur de PARIS
Navigation des articles