Closes #504 AVIF support

assets/js/options.js

@@ -138,7 +138,7 @@ window.imagify = window.imagify || {};
 	/**
 	 * Fade CDN URL field.
 	 */
-	$( '[name="imagify_settings[display_webp_method]"]' ).on( 'change.imagify init.imagify', function( e ) {
+	$( '[name="imagify_settings[display_nextgen_method]"]' ).on( 'change.imagify init.imagify', function( e ) {
 		if ( 'picture' === e.target.value ) {
 			$( e.target ).closest( '.imagify-radio-group' ).next( '.imagify-options-line' ).removeClass( 'imagify-faded' );
 		} else {
@@ -496,7 +496,7 @@ window.imagify = window.imagify || {};
 				.on( 'imagifybeat-send', this.addRequirementsImagifybeat )
 				.on( 'imagifybeat-tick', { imagifyOptionsBulk: this }, this.processRequirementsImagifybeat );
 
-			if ( false !== imagifyOptions.bulk.progress_webp.total && false !== imagifyOptions.bulk.progress_webp.remaining ) {
+			if ( false !== imagifyOptions.bulk.progress_next_gen.total && false !== imagifyOptions.bulk.progress_next_gen.remaining ) {
 				// Reset properties.
 				w.imagify.optionsBulk.error            = false;
 				w.imagify.optionsBulk.working          = true;
@@ -511,10 +511,10 @@ window.imagify = window.imagify || {};
 
 				this.$missingWebpMessage.hide().attr('aria-hidden', 'true');
 
-				processed = imagifyOptions.bulk.progress_webp.total - imagifyOptions.bulk.progress_webp.remaining;
-				progress = Math.floor( processed / imagifyOptions.bulk.progress_webp.total * 100 );
+				processed = imagifyOptions.bulk.progress_next_gen.total - imagifyOptions.bulk.progress_next_gen.remaining;
+				progress = Math.floor( processed / imagifyOptions.bulk.progress_next_gen.total * 100 );
 				this.$progressBar.css( 'width', progress + '%' );
-				this.$progressText.text( processed + '/' + imagifyOptions.bulk.progress_webp.total );
+				this.$progressText.text( processed + '/' + imagifyOptions.bulk.progress_next_gen.total );
 
 				this.$progressWrap.slideDown().attr( 'aria-hidden', 'false' ).removeClass( 'hidden' );
 			}
@@ -655,7 +655,7 @@ window.imagify = window.imagify || {};
 
 			_this = this;
 
-			$.get( this.getAjaxUrl( 'MissingWebp', imagifyOptions.bulk.contexts ) )
+			$.get( this.getAjaxUrl( 'MissingNextGen', imagifyOptions.bulk.contexts ) )
 				.done( function( response ) {
 					var errorMessage;
 

classes/Avif/Apache.php

@@ -0,0 +1,31 @@
+<?php
+declare(strict_types=1);
+
+namespace Imagify\Avif;
+
+use Imagify\WriteFile\AbstractApacheDirConfFile;
+
+/**
+ * Add and remove contents to the .htaccess file to display AVIF images on the site.
+ */
+class Apache extends AbstractApacheDirConfFile {
+
+	/**
+	 * Name of the tag used as block delemiter.
+	 *
+	 * @var string
+	 */
+	const TAG_NAME = 'Imagify: avif file type';
+
+	/**
+	 * Get unfiltered new contents to write into the file.
+	 *
+	 * @return string
+	 */
+	protected function get_raw_new_contents() {
+		return trim( '
+<IfModule mod_mime.c>
+	AddType image/avif .avif
+</IfModule>' );
+	}
+}

classes/Avif/Display.php

@@ -0,0 +1,169 @@
+<?php
+declare(strict_types=1);
+
+namespace Imagify\Avif;
+
+use Imagify\EventManagement\SubscriberInterface;
+use Imagify\Notices\Notices;
+use Imagify\WriteFile\WriteFileInterface;
+
+/**
+ * Display AVIF images on the site using picture tag.
+ */
+class Display implements SubscriberInterface {
+	/**
+	 * Server conf object.
+	 *
+	 * @var WriteFileInterface|null
+	 * @since 1.9
+	 */
+	protected $server_conf = null;
+
+	/**
+	 * Returns an array of events this subscriber listens to
+	 *
+	 * @return array
+	 */
+	public static function get_subscribed_events() {
+		return [
+			'imagify_settings_on_save' => [ 'maybe_add_rewrite_rules', 12 ],
+			'imagify_activation'       => 'activate',
+			'imagify_deactivation'     => 'deactivate',
+		];
+	}
+
+	/**
+	 * If display Next-Gen images, add the AVIF type to the .htaccess/etc file.
+	 *
+	 * @since 1.9
+	 *
+	 * @param array $values The option values.
+	 *
+	 * @return array
+	 */
+	public function maybe_add_rewrite_rules( $values ) {
+		if ( ! $this->get_server_conf() ) {
+			return $values;
+		}
+
+		$enabled = isset( $values['display_nextgen'] ) ? true : false;
+		$result  = false;
+
+		if ( $enabled ) {
+			// Add the AVIF file type.
+			$result = $this->get_server_conf()->add();
+		} elseif ( ! $enabled ) {
+			// Remove the AVIF file type.
+			$result = $this->get_server_conf()->remove();
+		}
+
+		if ( ! is_wp_error( $result ) ) {
+			return $values;
+		}
+
+		// Display an error message.
+		if ( is_multisite() && strpos( wp_get_referer(), network_admin_url( '/' ) ) === 0 ) {
+			Notices::get_instance()->add_network_temporary_notice( $result->get_error_message() );
+
+			return $values;
+		}
+
+		Notices::get_instance()->add_site_temporary_notice( $result->get_error_message() );
+
+		return $values;
+	}
+
+	/**
+	 * Add rules on plugin activation.
+	 *
+	 * @since 1.9
+	 */
+	public function activate() {
+		$conf = $this->get_server_conf();
+
+		if ( ! $conf ) {
+			return;
+		}
+
+		if ( ! get_imagify_option( 'display_nextgen' ) ) {
+			return;
+		}
+
+		if ( is_wp_error( $conf->is_file_writable() ) ) {
+			return;
+		}
+
+		$conf->add();
+	}
+
+	/**
+	 * Remove rules on plugin deactivation.
+	 *
+	 * @since 1.9
+	 */
+	public function deactivate() {
+		$conf = $this->get_server_conf();
+
+		if ( ! $conf ) {
+			return;
+		}
+
+		$file_path  = $conf->get_file_path();
+		$filesystem = \Imagify_Filesystem::get_instance();
+
+		if ( ! $filesystem->exists( $file_path ) ) {
+			return;
+		}
+		if ( ! $filesystem->is_writable( $file_path ) ) {
+			return;
+		}
+
+		$conf->remove();
+	}
+
+	/**
+	 * Get the path to the directory conf file.
+	 *
+	 * @since 1.9
+	 *
+	 * @param  bool $relative True to get a path relative to the site’s root.
+	 * @return string|bool    The file path. False on failure.
+	 */
+	public function get_file_path( $relative = false ) {
+		if ( ! $this->get_server_conf() ) {
+			return false;
+		}
+
+		$file_path = $this->get_server_conf()->get_file_path();
+
+		if ( $relative ) {
+			return \Imagify_Filesystem::get_instance()->make_path_relative( $file_path );
+		}
+
+		return $file_path;
+	}
+
+	/**
+	 * Get the server conf instance.
+	 * Note: nothing needed for nginx.
+	 *
+	 * @since 1.9
+	 *
+	 * @return WriteFileInterface
+	 */
+	protected function get_server_conf() {
+		global $is_apache, $is_iis7;
+
+		if ( isset( $this->server_conf ) ) {
+			return $this->server_conf;
+		}
+
+		if ( $is_apache ) {
+			$this->server_conf = new Apache();
+		} elseif ( $is_iis7 ) {
+			$this->server_conf = new IIS();
+		}
+
+		return $this->server_conf;
+	}
+}

classes/Avif/IIS.php

@@ -0,0 +1,32 @@
+<?php
+declare(strict_types=1);
+
+namespace Imagify\Avif;
+
+use Imagify\WriteFile\AbstractIISDirConfFile;
+
+/**
+ * Add and remove contents to the web.config file to display AVIF images on the site.
+ */
+class IIS extends AbstractIISDirConfFile {
+
+	/**
+	 * Name of the tag used as block delemiter.
+	 *
+	 * @var string
+	 */
+	const TAG_NAME = 'Imagify: avif file type';
+
+	/**
+	 * Get unfiltered new contents to write into the file.
+	 *
+	 * @return array
+	 */
+	protected function get_raw_new_contents() {
+		return trim( '
+<!-- @parent /configuration/system.webServer -->
+<staticContent name="' . esc_attr( static::TAG_NAME ) . ' 1">
+	<mimeMap fileExtension=".avif" mimeType="image/avif" />
+</staticContent>' );
+	}
+}

classes/Avif/RewriteRules/Apache.php

@@ -0,0 +1,59 @@
+<?php
+declare(strict_types=1);
+
+namespace Imagify\Avif\RewriteRules;
+
+use Imagify\WriteFile\AbstractApacheDirConfFile;
+
+/**
+ * Add and remove rewrite rules to the .htaccess file to display AVIF images on the site.
+ */
+class Apache extends AbstractApacheDirConfFile {
+
+	/**
+	 * Name of the tag used as block delimiter.
+	 *
+	 * @var    string
+	 */
+	const TAG_NAME = 'Imagify: rewrite rules for avif';
+
+	/**
+	 * Get unfiltered new contents to write into the file.
+	 *
+	 * @access protected
+	 *
+	 * @return string
+	 */
+	protected function get_raw_new_contents() {
+		$extensions = $this->get_extensions_pattern();
+		$extensions = str_replace( '|avif', '', $extensions );
+		$home_root  = wp_parse_url( home_url( '/' ) );
+		$home_root  = $home_root['path'];
+
+		return trim( '
+<IfModule mod_setenvif.c>
+	# Vary: Accept for all the requests to jpeg, png, and gif.
+	SetEnvIf Request_URI "\.(' . $extensions . ')$" REQUEST_image
+</IfModule>
+
+<IfModule mod_rewrite.c>
+	RewriteEngine On
+	RewriteBase ' . $home_root . '
+
+	# Check if browser supports AVIF images.
+	# Update the MIME type accordingly.
+	RewriteCond %{HTTP_ACCEPT} image/avif
+
+	# Check if AVIF replacement image exists.
+	RewriteCond %{REQUEST_FILENAME}.avif -f
+
+	# Serve AVIF image instead.
+	RewriteRule (.+)\.(' . $extensions . ')$ $1.$2.avif [T=image/avif,NC]
+</IfModule>
+
+<IfModule mod_headers.c>
+	# Update the MIME type accordingly.
+	Header append Vary Accept env=REQUEST_image
+</IfModule>' );
+	}
+}