Hey Tom,
Just an update in case you are interested. I got this working for GD. I am sure it would be quite simple for ImageMagick as well by applying the same theory.
Just so you know what I did to get it to work on my site. It is far from polished per se but its a good starting point at least for you ??
Keep in mind what I have added to my functions.php file and as the include file could be incorporated into your own plugin instead. I was just trying to stay out of it as much as possible in case you publish any other updates.
File adjustments:
my functions.php
function rs_add_scale_to_image_editor( $editors ) {
if( ! class_exists( 'WP_Image_Editor_Scale' ) )
include( 'inc/image-editor-scale.php' );
array_unshift( $editors, 'WP_Image_Editor_Scale' );
return $editors;
}
add_filter( 'wp_image_editors', 'rs_add_scale_to_image_editor' );
new file saved in my theme/inc/ folder image-editor-scale.php
class WP_Image_Editor_Scale extends WP_Image_Editor_GD {
public function hex2rgb($hex) {
$hex = str_replace("#", "", $hex);
if(strlen($hex) == 3) {
$r = hexdec(substr($hex,0,1).substr($hex,0,1));
$g = hexdec(substr($hex,1,1).substr($hex,1,1));
$b = hexdec(substr($hex,2,1).substr($hex,2,1));
} else {
$r = hexdec(substr($hex,0,2));
$g = hexdec(substr($hex,2,2));
$b = hexdec(substr($hex,4,2));
}
$rgb = array($r, $g, $b);
//return implode(",", $rgb); // returns the rgb values separated by commas
return $rgb; // returns an array with the rgb values
}
public function scale ( $max_w, $max_h, $color ) {
// Get the current image size
$size = $this->size;
$src_w = $size['width'];
$src_h = $size['height'];
/* Lets do some math that is needed for scaling and placing the resized image
*****************************************************************************/
// Set our defaults for either max height or max width
$new_w = $max_w;
$new_h = $max_h;
// Set our defaults for where to place the resized image in the new image
$align_w = 0;
$align_h = 0;
// Determine if the image is landscape or portrait
if( $src_w > $src_h ){
$ratio = $src_h / $src_w;
$new_h = (int)round($new_w * $ratio); // Proportionatly Scale height of image to fit MAX frame
$align_h = ($max_h - $new_h) / 2; // Center resized image in new image
// Double check that the new dimensions dont break the containers height restrictions
if ( $new_h > $max_h ){
$new_h = $max_h; // Set the height of the image to the max height of the container
$new_w = (int)round($new_h / $ratio); // Determine new width to make image fit max height
$align_h = 0; // Its full height so align to top
$align_w = ($max_w - $new_w) / 2; // Center across the width
}
}else{
$ratio = $src_w / $src_h;
$new_w = (int)round($new_h * $ratio); // Proportionatly Scale width of image to fit MAX frame
$align_w = ($max_w - $new_w) / 2; // Center resized image in new image
}
/*****************************************************************************/
// Create a new image based on the max dimensions provided
$scaled_image = wp_imagecreatetruecolor( $max_w, $max_h );
if ( function_exists( 'imageantialias' ) )
imageantialias( $scaled_image, true );
// Convert the users hex value to RGB
$rgb = $this->hex2rgb ( $color );
// Color the image background
$color = imagecolorallocatealpha ( $scaled_image , $rgb[0] , $rgb[1] , $rgb[2] , 0 );
imagefilledrectangle( $scaled_image, 0, 0, $max_w, $max_h, $color);
// Copy the old image, scale it to fit proportionatly into the new image with no cropping
$old_image = imagecreatefromjpeg($this->file);
imagecopyresampled ( $scaled_image, $old_image, $align_w, $align_h, 0, 0, $new_w, $new_h, $src_w, $src_h);
// Update WP and finish
if ( is_resource( $scaled_image ) ) {
imagedestroy( $this->image );
$this->image = $scaled_image;
$this->update_size();
return true;
}
return new WP_Error( 'image_scale_error', __('Image crop failed.'), $this->file );
}
}
Edits to your files:
metaslider.imagehelper.class.php
added private $color; to opening declarations
added $this->color = $color; to your __construct
commented out the following lines in your ‘resize_image’ function
/*
$dims = image_resize_dimensions($orig_size['width'], $orig_size['height'], $dest_size['width'], $dest_size['height'], true);
if ($dims) {
list($dst_x, $dst_y, $src_x, $src_y, $dst_w, $dst_h, $src_w, $src_h) = $dims;
$image->crop($src_x, $src_y, $src_w, $src_h, $dst_w, $dst_h);
}
*/
added $image->scale( $this->container_width, $this->container_height, $this->color ); in place of the commented lines
By just adding the above lines the image will always have a black background. If you want users to enter a custom value without editing code then the follow has to be added / changed in your plugin itself.
ml-slider.php
added this to your ‘render_admin_page’ function after height and width
'color' => array('priority' => 25, 'type' => 'text', 'size' => 6, 'value' => $this->slider->get_setting('color') == 'false' ? 'FFFFFF' : $this->slider->get_setting('color'), 'label' => __("BG Color", "metaslider"), 'class' => 'coin flex responsive nivo', 'helptext' => __("Slideshow background color", "metaslider"), 'after' => __("", "metaslider") ),
metaslide.image.class.php
adjusted all the ‘new MetaSliderImageHelper()’ calls to include ‘color’ option (either $settings['color'] or $this->settings['color']
I hope that helps you or anyone else looking into this idea.
Cheers
Ryan
