From 3f5ffae533fa596a425c0e9615af249ffbe2e8b2 Mon Sep 17 00:00:00 2001 From: Tung Du Date: Wed, 21 Jul 2021 17:11:19 +0000 Subject: [PATCH 1/3] fix image processing action on post edit page for block editor --- src/js/media.js | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/src/js/media.js b/src/js/media.js index 36d6c4dd0..daa5e9dfa 100644 --- a/src/js/media.js +++ b/src/js/media.js @@ -44,9 +44,10 @@ ); }; - $( document ).ready( function() { + $( window ).load( function() { + if ( wp.media.frame ) { - wp.media.frame.on( 'edit:attachment', () => { + wp.media.frame.on( 'selection:toggle', () => { const altTagsButton = document.getElementById( 'classifai-rescan-alt-tags' ); const imageTagsButton = document.getElementById( 'classifai-rescan-image-tags' ); @@ -60,8 +61,10 @@ endpoint: '/classifai/v1/alt-tags/', callback: resp => { if ( resp ) { - const textField = document.getElementById( 'attachment-details-two-column-alt-text' ); - textField.value = resp; + const textField = document.getElementById( 'attachment-details-two-column-alt-text' ) ?? document.getElementById( 'attachment-details-alt-text' ); + if ( textField ) { + textField.value = resp; + } } } } @@ -84,8 +87,10 @@ endpoint: '/classifai/v1/ocr/', callback: resp => { if ( resp ) { - const textField = document.getElementById( 'attachment-details-two-column-description' ); - textField.value = resp; + const textField = document.getElementById( 'attachment-details-two-column-description' ) ?? document.getElementById( 'attachment-details-description' ); + if ( textField ) { + textField.value = resp; + } } } } From 42bab8869628583ae4662fb5f311675cab9d2a89 Mon Sep 17 00:00:00 2001 From: Tung Du Date: Wed, 21 Jul 2021 17:22:17 +0000 Subject: [PATCH 2/3] fix: ensure image processing buttons work on both media and edit pages --- src/js/media.js | 101 ++++++++++++++++++++++++------------------------ 1 file changed, 51 insertions(+), 50 deletions(-) diff --git a/src/js/media.js b/src/js/media.js index daa5e9dfa..bb69ef03d 100644 --- a/src/js/media.js +++ b/src/js/media.js @@ -44,68 +44,69 @@ ); }; - $( window ).load( function() { - - if ( wp.media.frame ) { - wp.media.frame.on( 'selection:toggle', () => { - - const altTagsButton = document.getElementById( 'classifai-rescan-alt-tags' ); - const imageTagsButton = document.getElementById( 'classifai-rescan-image-tags' ); - const ocrScanButton = document.getElementById( 'classifai-rescan-ocr' ); - const smartCropButton = document.getElementById( 'classifai-rescan-smart-crop' ); + const handleButtonsClick = () => { + const altTagsButton = document.getElementById( 'classifai-rescan-alt-tags' ); + const imageTagsButton = document.getElementById( 'classifai-rescan-image-tags' ); + const ocrScanButton = document.getElementById( 'classifai-rescan-ocr' ); + const smartCropButton = document.getElementById( 'classifai-rescan-smart-crop' ); - if ( altTagsButton ) { - altTagsButton.addEventListener( 'click', e => handleClick( - { - button: e.target, - endpoint: '/classifai/v1/alt-tags/', - callback: resp => { - if ( resp ) { - const textField = document.getElementById( 'attachment-details-two-column-alt-text' ) ?? document.getElementById( 'attachment-details-alt-text' ); - if ( textField ) { - textField.value = resp; - } - } + if ( altTagsButton ) { + altTagsButton.addEventListener( 'click', e => handleClick( + { + button: e.target, + endpoint: '/classifai/v1/alt-tags/', + callback: resp => { + if ( resp ) { + const textField = document.getElementById( 'attachment-details-two-column-alt-text' ) ?? document.getElementById( 'attachment-details-alt-text' ); + if ( textField ) { + textField.value = resp; } } - ) ); + } } + ) ); + } - if ( imageTagsButton ) { - imageTagsButton.addEventListener( 'click', e => handleClick( - { - button: e.target, - endpoint: '/classifai/v1/image-tags/' - } - ) ); + if ( imageTagsButton ) { + imageTagsButton.addEventListener( 'click', e => handleClick( + { + button: e.target, + endpoint: '/classifai/v1/image-tags/' } + ) ); + } - if ( ocrScanButton ) { - ocrScanButton.addEventListener( 'click', e => handleClick( - { - button: e.target, - endpoint: '/classifai/v1/ocr/', - callback: resp => { - if ( resp ) { - const textField = document.getElementById( 'attachment-details-two-column-description' ) ?? document.getElementById( 'attachment-details-description' ); - if ( textField ) { - textField.value = resp; - } - } + if ( ocrScanButton ) { + ocrScanButton.addEventListener( 'click', e => handleClick( + { + button: e.target, + endpoint: '/classifai/v1/ocr/', + callback: resp => { + if ( resp ) { + const textField = document.getElementById( 'attachment-details-two-column-description' ) ?? document.getElementById( 'attachment-details-description' ); + if ( textField ) { + textField.value = resp; } } - ) ); + } } + ) ); + } - if ( smartCropButton ) { - smartCropButton.addEventListener( 'click', e => handleClick( - { - button: e.target, - endpoint: '/classifai/v1/smart-crop/' - } - ) ); + if ( smartCropButton ) { + smartCropButton.addEventListener( 'click', e => handleClick( + { + button: e.target, + endpoint: '/classifai/v1/smart-crop/' } - } ); + ) ); + } + } + + $( window ).load( function() { + if ( wp.media.frame ) { + wp.media.frame.on( 'selection:toggle', handleButtonsClick ); + wp.media.frame.on( 'edit:attachment', handleButtonsClick ); } } ); } )( jQuery ) ; From bb54df5d9cf470e8ff55fbacde2324da9702bbfb Mon Sep 17 00:00:00 2001 From: Tung Du Date: Wed, 21 Jul 2021 17:39:05 +0000 Subject: [PATCH 3/3] fix: use different event for editors --- src/js/media.js | 14 +++++++++++--- 1 file changed, 11 insertions(+), 3 deletions(-) diff --git a/src/js/media.js b/src/js/media.js index bb69ef03d..f5ebe5ca7 100644 --- a/src/js/media.js +++ b/src/js/media.js @@ -44,6 +44,9 @@ ); }; + /** + * Handle click events for Image Processing buttons added to media modal. + */ const handleButtonsClick = () => { const altTagsButton = document.getElementById( 'classifai-rescan-alt-tags' ); const imageTagsButton = document.getElementById( 'classifai-rescan-image-tags' ); @@ -101,11 +104,16 @@ } ) ); } - } + }; + + $( document ).ready( function() { + if ( wp.media ) { + wp.media.view.Modal.prototype.on( 'open', function() { + wp.media.frame.on( 'selection:toggle', handleButtonsClick ); + } ); + } - $( window ).load( function() { if ( wp.media.frame ) { - wp.media.frame.on( 'selection:toggle', handleButtonsClick ); wp.media.frame.on( 'edit:attachment', handleButtonsClick ); } } );