Skip to content

Commit

Permalink
Merge pull request #22 from justcoded/develop
Browse files Browse the repository at this point in the history 
Patch: generation images srcset/sizes in content. Update requires at least version WordPress. Added hard coded filters for crop image plugin.
  • Loading branch information
@aprokopenko
aprokopenko authored Apr 3, 2018
2 parents 0819eca + cf9fea2 commit 9e36cb8
Show file tree
Hide file tree
Showing 3 changed files with 158 additions and 24 deletions.
173 changes: 152 additions & 21 deletions components/PostAttachment.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -30,13 +30,30 @@ public function __construct() {
}

/**
* Add hooks which patch wordpress <img> srcset and sizes attributes.
* Add hooks which patch WordPress <img> srcset and sizes attributes.
*/
public function add_image_responsive_hooks() {
// Starting from WordPress 4.6 or 4.7 it change the way main content responsive images works.
// We remove standard filter and replace it with our filter.
remove_filter( 'the_content', 'wp_make_content_images_responsive' );
add_filter( 'the_content', array( $this, 'make_content_images_responsive' ) );

// hooks to make responsive usual WordPress thumbnail functions.
// Probably doesn't work for WordPress 4.7+ or 4.8+.
add_filter( 'wp_get_attachment_image_src', array( $this, 'set_calculated_image_size_cache' ), 10, 4 );
add_filter( 'wp_calculate_image_srcset', array( $this, 'calculate_image_srcset' ), 10, 5 );
add_filter( 'wp_calculate_image_sizes', array( $this, 'calculate_image_sizes' ), 10, 5 );

// patch image sizes list for "Just Image Optimizer" to show all available image sizes.
add_filter( 'jio_settings_image_sizes', array( $this, 'add_jio_image_sizes' ) );

// Add filters for compatibility with manual "Crop Images" Plugins.
if ( isset( $_GET['action'] )
&& ( $_GET['action'] === 'pte_ajax' || $_GET['action'] === 'mic_editor_window' )
) {
add_filter( 'intermediate_image_sizes', array( $this, 'force_register_rwd_image_sizes' ) );
add_filter( 'wp_update_attachment_metadata', array( $this, 'update_attachment_rwd_metadata' ), 10, 2 );
}
}

/**
Expand Down Expand Up @@ -71,10 +88,10 @@ public function after_theme_setup() {
/**
* Set image size
*
* @param string $image image source.
* @param string $image image source.
* @param int $attachment_id media attachment ID.
* @param mixed $size size details.
* @param boolean $icon not used.
* @param mixed $size size details.
* @param boolean $icon not used.
*
* @return string
*/
Expand All @@ -84,12 +101,66 @@ public function set_calculated_image_size_cache( $image, $attachment_id, $size,
return $image;
}

/**
* Filters 'img' elements in post content to add 'srcset' and 'sizes' attributes.
*
* @since 4.4.0
*
* @see wp_image_add_srcset_and_sizes()
*
* @param string $content The raw post content to be filtered.
*
* @return string Converted content with 'srcset' and 'sizes' attributes added to images.
*/
public function make_content_images_responsive( $content ) {
if ( ! preg_match_all( '/<img [^>]+>/', $content, $matches ) ) {
return $content;
}

$selected_images = $attachment_ids = array();

foreach ( $matches[0] as $image ) {
if ( false === strpos( $image, ' srcset=' )
&& preg_match( '/wp-image-([0-9]+)/i', $image, $class_id )
&& ( $attachment_id = absint( $class_id[1] ) )
) {
/**
* If exactly the same image tag is used more than once, overwrite it.
* All identical tags will be replaced later with 'str_replace()'.
*/
$selected_images[ $image ] = $attachment_id;
// Overwrite the ID when the same image is included more than once.
$attachment_ids[ $attachment_id ] = true;
}
}

if ( count( $attachment_ids ) > 1 ) {
/*
* Warm the object cache with post and meta information for all found
* images to avoid making individual database calls.
*/
_prime_post_caches( array_keys( $attachment_ids ), false, true );
}

foreach ( $selected_images as $image => $attachment_id ) {
if ( preg_match( '/size-([a-z]+)/i', $image, $size ) && has_image_size( $size[1] ) ) {
// TODO: check that alt is stay the same as it was in content.
$content = str_replace( $image, get_rwd_attachment_image( $attachment_id, $size[1], 'img' ), $content );
} else {
$image_meta = wp_get_attachment_metadata( $attachment_id );
$content = str_replace( $image, wp_image_add_srcset_and_sizes( $image, $image_meta, $attachment_id ), $content );
}
}

return $content;
}

/**
* Calculate image sizes for srcset
*
* @param array $sources Image file pathes grouped by image width dimention.
* @param array $sources Image file pathes grouped by image width dimention.
* @param array $size_array Image widthes, which are lower than image, which should be displayed.
* @param string $image_src Image src of resized image of "last_image_size_called" size.
* @param string $image_src Image src of resized image of "last_image_size_called" size.
* @param array $image_meta Image information with final dimension for each registered image size.
* @param int $attachment Attachment ID.
*
Expand All @@ -99,9 +170,9 @@ public function calculate_image_srcset( $sources, $size_array, $image_src, $imag
/* @var $rwd_image_sizes RwdSet[] */
global $rwd_image_sizes;
if ( empty( $this->calculated_image_size )
|| is_array( $this->calculated_image_size )
|| ! array_key_exists( $this->calculated_image_size, $image_meta['sizes'] )
|| empty( $rwd_image_sizes[ $this->calculated_image_size ]->options )
|| is_array( $this->calculated_image_size )
|| ! array_key_exists( $this->calculated_image_size, $image_meta['sizes'] )
|| empty( $rwd_image_sizes[ $this->calculated_image_size ]->options )
) {
return $sources;
}
Expand Down Expand Up @@ -139,10 +210,10 @@ public function calculate_image_srcset( $sources, $size_array, $image_src, $imag
/**
* Calculate image sizes
*
* @param array $sizes Img sizes attribute, generated by WP.
* @param mixed $size_array Some width and height, not sure how it's used.
* @param string $image_src Resized image original source.
* @param array $image_meta Image information with final dimension for each registered image size.
* @param array $sizes Img sizes attribute, generated by WP.
* @param mixed $size_array Some width and height, not sure how it's used.
* @param string $image_src Resized image original source.
* @param array $image_meta Image information with final dimension for each registered image size.
* @param int $attachment_id Attachment ID.
*
* @return array
Expand All @@ -151,8 +222,8 @@ public function calculate_image_sizes( $sizes, $size_array, $image_src, $image_m
/* @var $rwd_image_sizes RwdSet[] */
global $rwd_image_sizes;
if ( empty( $this->calculated_image_size )
|| is_array( $this->calculated_image_size )
|| empty( $rwd_image_sizes[ $this->calculated_image_size ]->options )
|| is_array( $this->calculated_image_size )
|| empty( $rwd_image_sizes[ $this->calculated_image_size ]->options )
) {
return $sizes;
}
Expand Down Expand Up @@ -188,18 +259,18 @@ public function calculate_image_sizes( $sizes, $size_array, $image_src, $image_m
/**
* Clean up <img> "src" attribute at all if we generate correct srcset and sizes attributes.
*
* @param array $attr Attributes for the image markup.
* @param array $attr Attributes for the image markup.
* @param WP_Post $attachment Image attachment post.
* @param string|array $size Requested size. Image size or array of width and height values
* @param string|array $size Requested size. Image size or array of width and height values
* (in that order). Default 'thumbnail'.
*
* @return mixed
*/
public function attachment_image_attributes( $attr, $attachment, $size ) {
global $rwd_image_sizes;
if ( empty( $size )
|| is_array( $size )
|| empty( $rwd_image_sizes[ $size ] )
|| is_array( $size )
|| empty( $rwd_image_sizes[ $size ] )
) {
return $attr;
}
Expand All @@ -216,7 +287,7 @@ public function attachment_image_attributes( $attr, $attachment, $size ) {
* WordPress by default add keys like thumbnail, medium, etc.
* To speed up loop of regeneration we need to remove duplicated keys.
*
* @param array $image_sizes Image size names array.
* @param array $image_sizes Image size names array.
*
* @return mixed
*/
Expand Down Expand Up @@ -246,4 +317,64 @@ public function add_jio_image_sizes( $image_sizes ) {
return $image_sizes;
}

}
/**
* Filters the list of intermediate image sizes for cropped images.
*
* @param array $image_sizes An array of intermediate image sizes. Defaults
* are 'thumbnail', 'medium', 'medium_large', 'large'.
*
* @return array
*/
public function force_register_rwd_image_sizes( $image_sizes ) {
global $rwd_image_options, $_wp_additional_image_sizes;
foreach ( $rwd_image_options as $subkey => $option ) {
$image_sizes[] = $subkey;

$_wp_additional_image_sizes[ $subkey ] = array(
'width' => $option->size->w,
'height' => $option->size->h,
'crop' => $option->size->crop,
);

if ( $option->retina_options ) {
foreach ( $option->retina_options as $retina_descriptor => $multiplier ) {
$retina_key = ImageSize::get_retina_key( $option->key, $retina_descriptor );
$image_sizes[] = $retina_key;

$_wp_additional_image_sizes[ $retina_key ] = array(
'width' => $option->size->w * $multiplier,
'height' => $option->size->h * $multiplier,
'crop' => $option->size->crop,
);
}
}
}

return array_unique( $image_sizes );
}

/**
* Filters the updated attachment meta data for cropped images.
* Set param rwd_width, rwd_height, crop.
*
* @param array $data Array of updated attachment meta data.
* @param int $attachment_id Attachment post ID.
*
* @return array
*/
public function update_attachment_rwd_metadata( $data, $attachment_id ) {
$current_metadata = wp_get_attachment_metadata( $attachment_id );
if ( empty( $current_metadata ) ) {
return $data;
}
foreach ( $current_metadata['sizes'] as $current_key => $current_sizes ) {
foreach ( $data['sizes'] as $data_key => $data_sizes ) {
if ( $current_key === $data_key ) {
$data['sizes'][ $data_key ] = array_merge( $current_sizes, $data_sizes );
}
}
}

return $data;
}
}
4 changes: 2 additions & 2 deletions just-responsive-images.php
View file
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
Plugin Name: Just Responsive Images
Description: Providing full control to set your own responsive image properties for WordPress 4.4+, the ability to use the &lt;picture&gt; tag, auto-generate image backgrounds and supports retina images.
Tags: responsive post thumbnail, post thumbnail as background, retina support, retina image, retina post thumbnail, responsive post attachment, responsive images, responsive attachments, post thumbnails, media
Version: 1.5
Version: 1.5.1
Author: JustCoded / Alex Prokopenko
Author URI: http://justcoded.com/
License: GPL3
Expand Down Expand Up @@ -49,7 +49,7 @@ class JustResponsiveImages extends core\Singleton {
protected function __construct() {
// init plugin name and version.
self::$plugin_name = __( 'Just Responsive Images', JustResponsiveImages::TEXTDOMAIN );
self::$version = '1.500';
self::$version = '1.501';

// init features, which this plugin is created for.
new components\Maintenance();
Expand Down
5 changes: 4 additions & 1 deletion readme.txt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ Description: Providing full control to set your own responsive image properties
Tags: responsive post thumbnail, post thumbnail as background, retina support, retina image, retina post thumbnail, responsive post attachment, responsive images, responsive attachments, post thumbnails, media
Author: JustCoded / Alex Prokopenko
Author URI: http://justcoded.com/
Requires at least: 4.4
Requires at least: 4.5
Tested up to: 4.9.4
Requires PHP: >=5.6
License: GPL3
Expand Down Expand Up @@ -82,6 +82,9 @@ There are no any special upgrade instructions for version 1.0 - 1.3
To upgrade remove the old plugin folder. After than follow the installation steps 1-2.

== Changelog ==
= Version 1.5.1 - 3 April 2018 =
* Added compatibility with Crop Images plugin
* Fix main editor content responsive images (it was broken after some WP update)
= Version 1.5 - 15 March 2018 =
* Added compatibility with Just Image Optimizer plugin
= Version 1.4.1 - 9 March 2018 =
Expand Down

0 comments on commit 9e36cb8

Please sign in to comment.