Merge pull request #45 from av3nger/release/1.9.1

Release/1.9.1

CHANGELOG.md

@@ -1,3 +1,14 @@
+= 1.9.1 - 23.04.2024 =
+
+Added:
+* Integration with Elementor lightbox
+
+Fixed:
+* NaN undefined error in compression savings stats
+* AI image captioning when custom image paths are set
+* WPML compatibility
+* "Disable WordPress image sizes" option causing issues with image URLs
+
 = 1.9.0 - 22.03.2024 =
 
 Added:

README.md

@@ -1,12 +1,12 @@
 === Offload, AI & Optimize with Cloudflare Images ===
 Plugin Name: Offload, AI & Optimize with Cloudflare Images
 Contributors: vanyukov
-Tags: cdn, cloudflare images, offload images, compress, cloudflare, optimize
+Tags: cdn, cloudflare images, image ai, compress, optimize
 Donate link: https://www.paypal.com/donate/?business=JRR6QPRGTZ46N&no_recurring=0&item_name=Help+support+the+development+of+the+Cloudflare+Images+plugin+for+WordPress&currency_code=AUD
 Requires at least: 5.6
 Requires PHP: 7.0
 Tested up to: 6.5
-Stable tag: 1.9.0
+Stable tag: 1.9.1
 License: GPLv2 or later
 License URI: https://www.gnu.org/licenses/gpl-2.0.html
 
@@ -102,6 +102,17 @@ If something is still not working for you, please let me know by creating a supp
 
 == Changelog ==
 
+= 1.9.1 - 23.04.2024 =
+
+Added:
+* Integration with Elementor lightbox
+
+Fixed:
+* NaN undefined error in compression savings stats
+* AI image captioning when custom image paths are set
+* WPML compatibility
+* "Disable WordPress image sizes" option causing issues with image URLs
+
 = 1.9.0 - 22.03.2024 =
 
 Added:

app/class-core.php

@@ -188,6 +188,7 @@ private function init_integrations() {
 		$loader->integration( 'acf' );
 		$loader->integration( 'wpml' );
 		$loader->integration( 'shortpixel' );
+		$loader->integration( 'elementor' );
 	}
 
 	/**

app/class-image.php

@@ -324,7 +324,11 @@ private function generate_url( string $image_url, bool $is_src = false ) {
 			$original = preg_replace( '/-\d+x\d+(?=\.(jpg|jpeg|png|gif)$)/i', '', $image_url );
 		} elseif ( false !== strpos( $image_url, '-scaled.' ) ) {
 			$original = str_replace( '-scaled.', '.', $image_url );
-			$size[1]  = apply_filters( 'big_image_size_threshold', 2560 );
+
+			$scaled_size = apply_filters( 'big_image_size_threshold', 2560 );
+			$scaled_size = false === $scaled_size ? 2560 : $scaled_size;
+
+			$size[1] = $scaled_size;
 		} else {
 			$original = $image_url;
 		}
@@ -357,7 +361,10 @@ private function generate_url( string $image_url, bool $is_src = false ) {
 			return false;
 		}
 
-		list( $hash, $this->cf_image_id ) = Cloudflare_Images::get_hash_id_url_string( $this->id );
+		// This is used with WPML integration.
+		$attachment_id = apply_filters( 'cf_images_media_post_id', $this->id );
+
+		list( $hash, $this->cf_image_id ) = Cloudflare_Images::get_hash_id_url_string( $attachment_id );
 
 		if ( empty( $this->cf_image_id ) || ( empty( $hash ) && ! apply_filters( 'cf_images_module_enabled', false, 'custom-path' ) ) ) {
 			return false;

app/integrations/class-elementor.php

@@ -0,0 +1,71 @@
+<?php
+/**
+ * Integration class for the Elementor page builder
+ *
+ * This class adds compatibility with the Elementor plugin.
+ *
+ * @link https://vcore.au
+ *
+ * @package CF_Images
+ * @subpackage CF_Images/App/Integrations
+ * @author Anton Vanyukov <[email protected]>
+ * @since 1.9.1
+ */
+
+namespace CF_Images\App\Integrations;
+
+use CF_Images\App\Traits;
+use Elementor\Widget_Base;
+use Elementor\Widget_Image_Carousel;
+
+if ( ! defined( 'WPINC' ) ) {
+	die;
+}
+
+/**
+ * Elementor class.
+ *
+ * @since 1.9.1
+ */
+class Elementor {
+	use Traits\Helpers;
+
+	/**
+	 * Class constructor.
+	 *
+	 * @since 1.9.1
+	 */
+	public function __construct() {
+		add_filter( 'elementor/widget/render_content', array( $this, 'add_lightbox_support' ), 10, 2 );
+	}
+
+	/**
+	 * Fix lightbox widgets in Elementor.
+	 *
+	 * The frontend.js script in Elementor has the isLightboxLink() function which checks if the lightbox link is valid.
+	 * This function checks if a link ends with a supported extension (png|jpe?g|gif|svg|webp). Cloudflare Images links,
+	 * on the other hand, do not end with an extension, but rather with a set of parameters. To fix this we can append
+	 * a hash #.jpg to the end of all image URLs.
+	 *
+	 * @since 1.9.1
+	 *
+	 * @param string      $widget_content The content of the widget.
+	 * @param Widget_Base $widget         The widget.
+	 */
+	public function add_lightbox_support( string $widget_content, Widget_Base $widget ): string {
+		if ( ! $widget instanceof Widget_Image_Carousel ) {
+			return $widget_content;
+		}
+
+		// Regular expression to find <a> tags with data-elementor-open-lightbox="yes" and Cloudflare Images links.
+		$pattern = '/(<a\s[^>]*data-elementor-open-lightbox="yes"[^>]*href=")(' . preg_quote( $this->get_cdn_domain(), '/' ) . '[^"]+)(")/i';
+
+		// Callback function to append '#.jpg' to the href attribute.
+		$callback = function ( $matches ) {
+			// Append '#.jpg' only if it's not already appended.
+			return $matches[1] . $matches[2] . ( substr( $matches[2], -5 ) !== '#.jpg' ? '#.jpg' : '' ) . $matches[3];
+		};
+
+		return preg_replace_callback( $pattern, $callback, $widget_content );
+	}
+}

app/integrations/class-wpml.php

@@ -32,6 +32,12 @@ class Wpml {
 	 * @since 1.4.0
 	 */
 	public function __construct() {
+		global $sitepress;
+
+		if ( ! $sitepress ) {
+			return;
+		}
+
 		add_filter( 'cf_images_media_post_id', array( $this, 'get_original_image_id' ) );
 		add_action( 'cf_images_before_wp_query', array( $this, 'remove_wpml_filters' ) );
 		add_action( 'cf_images_upload_success', array( $this, 'update_image_meta' ), 10, 2 );

app/modules/class-cloudflare-images.php

@@ -149,6 +149,9 @@ public function get_attachment_image_src( $image, $attachment_id, $size ) {
 			return $image;
 		}
 
+		// This is used with WPML integration.
+		$attachment_id = apply_filters( 'cf_images_media_post_id', $attachment_id );
+
 		list( $hash, $cloudflare_image_id ) = self::get_hash_id_url_string( (int) $attachment_id );
 
 		if ( empty( $cloudflare_image_id ) || ( empty( $hash ) && ! $this->is_module_enabled( false, 'custom-path' ) ) ) {
@@ -202,6 +205,7 @@ public function get_attachment_image_src( $image, $attachment_id, $size ) {
 		// Handle `scaled` images.
 		if ( false !== strpos( $image[0], '-scaled' ) ) {
 			$scaled_size = apply_filters( 'big_image_size_threshold', 2560 );
+			$scaled_size = false === $scaled_size ? 2560 : $scaled_size;
 
 			/**
 			 * This covers two cases:

app/modules/class-image-ai.php

@@ -138,12 +138,23 @@ public function ajax_caption_image() {
 	 * @return string|void|WP_Error
 	 */
 	private function caption_image( int $attachment_id ) {
+		$restore_filter = false;
+		if ( has_filter( 'cf_images_hash', '__return_empty_string' ) ) {
+			$restore_filter = true;
+			remove_filter( 'cf_images_hash', '__return_empty_string' );
+		}
+
 		list( $hash, $cloudflare_image_id ) = Cloudflare_Images::get_hash_id_url_string( $attachment_id );
 
 		if ( empty( $cloudflare_image_id ) || ( empty( $hash ) && ! $this->is_module_enabled( false, 'custom-path' ) ) ) {
 			$image = wp_get_original_image_url( $attachment_id );
 		} else {
-			$image = trailingslashit( $this->get_cdn_domain() . "/$hash" ) . "$cloudflare_image_id/w=9999";
+			// Use the default Cloudflare Images URL here, so we do not get issues with access.
+			$image = trailingslashit( "https://imagedelivery.net/$hash" ) . "$cloudflare_image_id/w=9999";
+		}
+
+		if ( $restore_filter ) {
+			add_filter( 'cf_images_hash', '__return_empty_string' );
 		}
 
 		try {

assets/_src/js/helpers/format.ts

@@ -1,5 +1,5 @@
 export const formatBytes = (bytes: number, decimals: number = 2) => {
-	if (bytes === 0) {
+	if (isNaN(bytes) || bytes <= 0) {
 		return '0 B';
 	}
 

assets/_src/modules/fuzion/ai-stats.tsx

@@ -100,8 +100,8 @@ const CompressionStats = () => {
 							</p>
 							<p className="title">
 								{formatBytes(
-									(stats.size_before ?? 0) -
-										(stats.size_after ?? 0)
+									Number(stats.size_before ?? 0) -
+										Number(stats.size_after ?? 0)
 								)}
 							</p>
 						</div>

cf-images.php

@@ -14,7 +14,7 @@
  * Plugin Name:       Offload Media to Cloudflare Images
  * Plugin URI:        https://vcore.au
  * Description:       Offload media library images to the `Cloudflare Images` service.
- * Version:           1.9.0
+ * Version:           1.9.1
  * Author:            Anton Vanyukov
  * Author URI:        https://vcore.au
  * License:           GPL-2.0+
@@ -31,7 +31,7 @@
 	die;
 }
 
-define( 'CF_IMAGES_VERSION', '1.9.0' );
+define( 'CF_IMAGES_VERSION', '1.9.1' );
 define( 'CF_IMAGES_DIR_URL', plugin_dir_url( __FILE__ ) );
 
 require_once 'app/class-activator.php';

package.json

@@ -1,7 +1,7 @@
 {
   "name": "cf-images",
   "description": "Offload, Store, Resize & Optimize with Cloudflare Images",
-  "version": "1.9.0",
+  "version": "1.9.1",
   "main": "cf-images.php",
   "author": "Anton Vanyukov",
   "license": "GPL-2.0-or-later",