Feat: bulk optimization

package.json

@@ -37,8 +37,12 @@
 	},
 	"dependencies": {
 		"@mediabunny/mp3-encoder": "^1.25.0",
+		"browser-image-compression": "^2.0.2",
+		"classnames": "^2.5.1",
+		"heic2any": "^0.0.4",
 		"mediabunny": "^1.25.0",
-		"svgo": "^4.0.0",
-		"heic2any": "^0.0.4"
+		"mime": "^4.1.0",
+		"resemblejs": "^5.0.0",
+		"svgo": "^4.0.0"
 	}
 }

readme.txt

@@ -2,7 +2,7 @@
 Contributors: bfintal, gambitph
 Tags: image, optimization, compress, convert, webp
 Requires at least: 6.7.4
-Tested up to: 6.9
+Tested up to: 6.9.1
 Requires PHP: 8.0
 Stable tag: 1.2.2
 License: GPLv2 or later

src/admin/class-admin.php

@@ -199,6 +199,8 @@ public function enqueue_admin_scripts( $hook ) {
 				'stats' => $stats,
 				'imageSizes' => $formatted_sizes,
 				'ratingDismissed' => '1' === get_option( 'cimo_rating_dismissed', '0' ) ? '1' : '0',
+				'isPremium' => CIMO_BUILD === 'premium',
+				'uploadsUrl' => wp_upload_dir()['baseurl'],
 			] );
 		}
 

src/admin/class-meta-box.php

@@ -90,6 +90,35 @@ function cimo_get_media_type_label( $mimetype ) {
 						$optimization_savings = $compression_savings !== null ? number_format( 100 - ( $compression_savings * 100 ), 2 ) : null;
 						$original_filesize = isset( $cimo['originalFilesize'] ) ? floatval( $cimo['originalFilesize'] ) : 0;
 						$converted_filesize = isset( $cimo['convertedFilesize'] ) ? floatval( $cimo['convertedFilesize'] ) : 0;
+
+						$is_bulk_optimized = isset( $cimo['bulk_optimization'] ) &&
+							is_array( $cimo['bulk_optimization'] ) &&
+							! empty( $cimo['bulk_optimization'] );
+
+						// For bulk optimization, we need to recalculate the optimization savings percentage
+						// based on the original and converted file sizes for all the thumbnails
+						if ( $is_bulk_optimized ) {
+							$bulk_optimization_count = count( $cimo['bulk_optimization'] );
+							$bulk_optimization_sizes = array_keys( $cimo['bulk_optimization'] );
+
+							// Gather all original and converted file sizes for bulk_optimization
+							$bulk_original_filesize = 0;
+							$bulk_converted_filesize = 0;
+							if ( $is_bulk_optimized ) {
+								foreach ( $cimo['bulk_optimization'] as $size_key => $bulk_data ) {
+									$orig = isset( $bulk_data['originalFilesize'] ) ? floatval( $bulk_data['originalFilesize'] ) : 0;
+									$conv = isset( $bulk_data['convertedFilesize'] ) ? floatval( $bulk_data['convertedFilesize'] ) : 0;
+									$bulk_original_filesize += $orig;
+									$bulk_converted_filesize += $conv;
+								}
+							}
+
+							$original_filesize = $bulk_original_filesize;
+							$converted_filesize = $bulk_converted_filesize;
+
+							$optimization_savings = number_format( 100 * ( $original_filesize - $converted_filesize ) / $original_filesize, 2 );
+						}
+
 						$kb_saved = cimo_format_filesize( $original_filesize - $converted_filesize, 1, true );
 						$optimization_savings_class = ( $optimization_savings > 0 ) ? 'cimo-optimization-savings-up' : 'cimo-optimization-savings-down';
 
@@ -121,33 +150,74 @@ function cimo_get_media_type_label( $mimetype ) {
 
 						// Optimization savings
 						echo '<li class="cimo-compression-savings ' . esc_attr( $optimization_savings_class ) . '">';
-						echo 'Saved ' . esc_html( $optimization_savings ) . '% <span class="cimo-compression-savings-bytes">(' . esc_html( $kb_saved ) . ')</span>';
+						echo sprintf(
+							/* translators: %s: percentage saved */
+							esc_html__( 'Saved %s%%', 'cimo-image-optimizer' ),
+							esc_html( $optimization_savings )
+						);
+						echo ' <span class="cimo-compression-savings-bytes">(' . esc_html( $kb_saved ) . ')</span>';
 						echo '</li>';
 
 						// Filesize original
 						echo '<li class="cimo-filesize-original">';
-						echo 'Original: <span class="cimo-value">' . esc_html( $original_size ) . '</span>';
+						echo sprintf(
+							/* translators: %s: original file size */
+							esc_html__( 'Original: %s', 'cimo-image-optimizer' ),
+							'<span class="cimo-value">' . esc_html( $original_size ) . '</span>'
+						);
 						echo '</li>';
 
 						// Filesize optimized
 						echo '<li class="cimo-filesize-optimized">';
-						echo 'Optimized: <span class="cimo-value">' . esc_html( $converted_size ) . '</span>';
+						$arrow = $converted_filesize < $original_filesize ? '↓' : ( $converted_filesize > $original_filesize ? '↑' : '' );
+						echo sprintf(
+							/* translators: %s: optimized file size */
+							esc_html__( 'Optimized: %s', 'cimo-image-optimizer' ),
+							'<span class="cimo-value">' . esc_html( $arrow ) . ' ' . esc_html( $converted_size ) . '</span>'
+						);
 						echo '</li>';
 
-						// Converted format
-						echo '<li class="cimo-converted">';
-						echo '🏞️ Converted to <span class="cimo-value">' . esc_html( $converted_format ) . '</span>';
-						echo '</li>';
+						if ( ! $is_bulk_optimized ) {
 
-						// Conversion time
-						echo '<li class="cimo-time">';
-						echo '⚡️ Done in <span class="cimo-value">' . esc_html( $converttime_str ) . '</span>';
-						echo '</li>';
+							// Converted format
+							echo '<li class="cimo-converted">';
+							echo '🏞️ ' . sprintf(
+								/* translators: %s: converted format */
+								esc_html__( 'Converted to %s', 'cimo-image-optimizer' ),
+								'<span class="cimo-value">' . esc_html( $converted_format ) . '</span>'
+							);
+							echo '</li>';
+
+							// Conversion time
+							echo '<li class="cimo-time">';
+							echo '⚡️ ' . sprintf(
+								/* translators: %s: conversion time */
+								esc_html__( 'Done in %s', 'cimo-image-optimizer' ),
+								'<span class="cimo-value">' . esc_html( $converttime_str ) . '</span>'
+							);
+							echo '</li>';
+
+						} else {
+
+							// Bulk optimization number
+							echo '<li class="cimo-bulk-optimization-number">';
+							echo '🏞️ ' . sprintf(
+								/* translators: %s: bulk optimization count */
+								esc_html__( '%s thumbnail(s) processed', 'cimo-image-optimizer' ),
+								'<span class="cimo-value">' . esc_html( $bulk_optimization_count ) . '</span>'
+							);
+							echo '</li>';
+
+							// Bulk optimization note
+							echo '<li class="cimo-bulk-optimization-note">';
+							echo '⚡️ ' . esc_html__( 'Bulk optimized', 'cimo-image-optimizer' );
+							echo '</li>';
+						}
 
 						echo '</ul>';
 						// echo '</div>';
 					} else {
-						echo '<p>Cimo did not optimize this attachment.</p>';
+						echo '<p>' . esc_html__( 'Cimo did not optimize this attachment.', 'cimo-image-optimizer' ) . '</p>';
 					}
 				},
 				'attachment',

src/admin/class-metadata.php

@@ -159,6 +159,9 @@ public function save_metadata( $request ) {
 				}
 			}
 
+			// Add our metadata key to note that this was optimized during upload.
+			$sanitized_metadata['optimized_during_upload'] = true;
+
 			// Save to a transient queue for metadata waiting for attachment creation
 			$transient_key = 'cimo_metadata_queue';
 			$queue = get_transient( $transient_key );
@@ -285,6 +288,11 @@ public function prepare_attachment_for_js( $response, $attachment, $meta ) {
 		 * @return array The updated metadata.
 		 */
 		public function preserve_cimo_metadata( $metadata, $attachment_id ) {
+			// If there's a metadata for cimo incoming, then normal operation.
+			if ( isset( $metadata['cimo'] ) ) {
+				return $metadata;
+			}
+
 			// Get the existing Cimo metadata from the attachment metadata.
 			$existing_metadata = wp_get_attachment_metadata( $attachment_id );
 			if ( $existing_metadata && isset( $existing_metadata['cimo'] ) ) {

src/admin/class-stats.php

@@ -84,6 +84,25 @@ private static function compute_stats( $existing_stats = null ) {
 					}
 
 					$cimo_data = $metadata['cimo'];
+
+					/**
+					 * This data comes from bulk optimizing media in the Media Library:
+					 */
+
+					if ( isset( $cimo_data['bulk_optimization'] ) ) {
+						foreach ( $cimo_data['bulk_optimization'] as $size => $data ) {
+							$updated_stats['media_optimized_num']++;
+							$original_size_b = isset( $data['originalFilesize'] ) ? (int) $data['originalFilesize'] : 0;
+							$converted_size_b = isset( $data['convertedFilesize'] ) ? (int) $data['convertedFilesize'] : 0;
+							$updated_stats['total_original_size'] += $original_size_b / 1024;
+							$updated_stats['total_optimized_size'] += $converted_size_b / 1024;
+						}
+					}
+
+					/**
+					 * This data comes from individually optimized images from the user uploading media:
+					 */
+
 					$updated_stats['media_optimized_num']++;
 
 					// Extract file sizes (bytes) and add to KB totals
@@ -153,5 +172,35 @@ private static function format_bytes( $bytes, $decimals = 2 ) {
 
 			return $value . ' ' . $sizes[ $i ];
 		}
+
+		/**
+		 * Update stats for when an attachment has been bulk optimized.
+		 *
+		 * @param int $attachment_id The attachment ID.
+		 * @param int $original_size The original file size in bytes.
+		 * @param int $optimized_size The optimized file size in bytes.
+		 */
+		public static function update_stats_bulk_optimized( $attachment_id, $original_size, $optimized_size ) {
+			$stats = self::get_stats();
+			$stats['media_optimized_num']++;
+			$stats['total_original_size'] += $original_size / 1024;
+			$stats['total_optimized_size'] += $optimized_size / 1024;
+			update_option( self::OPTION_KEY, $stats, false );
+		}
+
+		/**
+		 * Update stats for when an attachment has been restored from bulk optimization.
+		 *
+		 * @param int $attachment_id The attachment ID.
+		 * @param int $optimized_size The optimized file size in bytes.
+		 * @param int $restored_size The restored file size in bytes.
+		 */
+		public static function update_stats_bulk_restored( $attachment_id, $optimized_size, $restored_size ) {
+			$stats = self::get_stats();
+			$stats['media_optimized_num']--;
+			$stats['total_original_size'] -= $optimized_size / 1024;
+			$stats['total_optimized_size'] -= $restored_size / 1024;
+			update_option( self::OPTION_KEY, $stats, false );
+		}
 	}
 }