Using imagemagick to fill unused area of aspect with color

[maffp]

Hi!

I know that title description is unbelieveably lame but my question is this:

I have just moved to a new server which has imagemagick installed on it (my last only had GD). I would like to set up a PHP script which takes an uploaded picture, resizes it so that it is fits inside 640x480 and then fills any remainder up with white so that the remaining image is 640x480...

e.g.
Take a 640Wx960H jpeg.
Resizes it to 320Wx480H.
Fills the 160px each side of the image with white.
Saves the resulting jpeg (640x480)

Is this possible?

[Bonzo]

You description/maths do not quite add up but this code will add a 160px border to all sides.
Edit: Reading your post again I assume it depends on if it is a landscape or portrate picture. I was trying something to do this in one line of code the other night but had to use two lines. I do not have time tonight but give this a go and see if it works; I will try and have another look at the code tomorrow. Out of interest here was the other post - http://redux.imagemagick.org/discourse- ... f=1&t=8626

Untested !

Code: Select all

<?php 
// If the form has been submitted do this 
if ( $Submit ) { 
// Temporary upload image name 
$original_image = $_FILES['filename']['tmp_name'];  
// Name to save the image as - in this case the same as the original 
$new_image = $_FILES['filename']['name']; 

// Resize the image, add border and save 
exec("/usr/local/bin/convert $original_image -thumbnail 320x480 -bordercolor white -border 160 $new_image"); 
echo "File uploaded"; 
}
else { ?> 

<form method="post" action="<?php echo $PHP_SELF; ?>" enctype="multipart/form-data"> 
<label>File to upload:</label> 
<input type="file" name="filename"  /><br /> 
<input type="Submit" name="Submit" value="Submit" /> 
</form> 
<?php } ?> 

[maffp]

Hi Bonzo, It does make sense. I think you may have just misinterpreted what I wrote.

Basically, any image I upload must end up as 640x480 with any extra border bits filled in in white.

Therefore:

If I upload a 1280x960 photo it will resize to a 640x480 photo with no border.
If I upload a 320x480 photo there will be no resize but it will add a 160px white border on the left and right. Totalling 640x480.
If I upload a 1280x480 photo it will resize to 640x240 and add a 120px white border to the top and bottom. Totalling 640x480.

Does this make sense?

P.S. Can't try the code you gave me just now cos I'm away from my normal computer!

[maffp]

Wehey!

Been having a play around (I'm a fairly recent newbie to PHP and complete newbie to imagemagick) but I've just about sussed it:

Code: Select all

<?php
// If the form has been submitted do this
if ( $_POST['Submit'] ) {

// List of our known photo types
$knownTypes = array('image/pjpeg' => 'jpg','image/jpeg' => 'jpg');

// Temporary upload image name
$originalImage = $_FILES['filename']['tmp_name']; 

// Name to save the image as - in this case the same as the original
$newImage = $_FILES['filename']['name'];

// Get the image size
$size = GetImageSize($originalImage);
$width = $size[0];
$height = $size[1];
if($width > $height) {
	$newWidth = 640;
	$newHeight = 640 * $height / $width; 
	$borderY = (480 - $newHeight) / 2;
	$borderX = 0;
} else {
	$newWidth = 480 * $width / $height;
	$newHeight = 480; 
	$borderY = 0;
	$borderX = (640 - $newWidth) / 2;
}

// Resize the image, add border and save
exec("/usr/local/bin/convert $originalImage -thumbnail {$newWidth}x{$newHeight} -bordercolor black -border {$borderX}x{$borderY} $newImage");
echo "File uploaded";

} else {
?>

<form method="post" action="<?php echo $PHP_SELF; ?>" enctype="multipart/form-data">
<table cellpadding="0" cellspacing="0">
	<tr>
		<td><label for="filename">File:</label></td><td><input type="file" name="filename"  /></td>
	</tr>
	<tr>
		<td><label for="caption">Caption:</label></td><td><input type="text" name="caption" /></td>
	</tr>
	<tr>
		<td><label for="tooltip">Tooltip:</label></td><td><input type="text" name="tooltip" /></td>
	</tr>
	<tr>
		<td></td><td><input type="Submit" name="Submit" value="Submit" /></td>
	</tr>
</table>
</form>

<?php
}
?> 

Thanks so much for the start bonzo... would have had no idea where to begin otherwise!

[anthony]

For other methods and techniques see Im examples, Thumbnails, Padding Out the Image
http://www.imagemagick.org/Usage/thumbnails/#pad

These do not require you to do any math, Im does it for you. You just give it the final thumbnail size.

[Bonzo]

Glad you got what you wanted maffp; the other way I did it was to create a canvas at a set size and place the resized image on the canvas.
I forgot I had put an example on my site http://www.rubblewebs.co.uk/imagemagick/other.php this resizes the image, saves a tempory version, puts the resized image onto a background then deletes the tempory image. I tried to get it all on one comand line but it would not work that way; this saves some calculations.

You seem to be doing well considering you have just started with php and ImageMagick.

[maffp]

Thanks!

Will check those resources out when I get home from work. Before I do though, can anyone show me agood resource for detecting the file type uploaded and rejecting it if it's not a valid image? (as you can see, i started an array of file types).

[Bonzo]

The third part of the $size array is a file type e.g. $size[2]

Returns an array with 4 elements. Index 0 contains the width of the image in pixels. Index 1 contains the height. Index 2 is a flag indicating the type of the image: 1 = GIF, 2 = JPG, 3 = PNG, 4 = SWF, 5 = PSD, 6 = BMP, 7 = TIFF(intel byte order), 8 = TIFF(motorola byte order), 9 = JPC, 10 = JP2, 11 = JPX, 12 = JB2, 13 = SWC, 14 = IFF, 15 = WBMP, 16 = XBM. These values correspond to the IMAGETYPE constants that were added in PHP 4.3.0. Index 3 is a text string with the correct height="yyy" width="xxx" string that can be used directly in an IMG tag.

I have tended to write the codes for myself and always upload jpgs so have not implimented this before but something like the code below should work.

Code: Select all

<?php 
// If the form has been submitted do this 
if ( $Submit ) { 

// Temporary upload image name 
$original_image = $_FILES['filename']['tmp_name'];  
// Name to save the image as - in this case the same as the original 
$new_image = $_FILES['filename']['name']; 
// Get the image information
$size = GetImageSize($original_image);
// Array of allowed file types
$allowed = array("1","2","3");
// If the file type is in the arrar do the resize otherwise  print an error and end the script
if ( !in_array($size[2], $allowed) ){ exit("Invalid file type"); }
else {
// Resize the image, add border and save 
exec("/usr/local/bin/convert $original_image -thumbnail 320x480 -bordercolor white -border 160 $new_image"); 
echo "File uploaded"; 
}
// End the script with an error

 }

else { ?> 

<form method="post" action="<?php echo $PHP_SELF; ?>" enctype="multipart/form-data"> 
<label>File to upload:</label> 
<input type="file" name="filename"  /><br /> 
<input type="Submit" name="Submit" value="Submit" /> 
</form> 
<?php } ?> 

P.S. I have used my example code again but you should be able to transfer it over to your code.
This way does not rely on the extension either as a jpg could be jpg, JPG, jpeg etc.