Multiple Image Upload and Resize Form

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
mikeyray
Forum Newbie
Posts: 5
Joined: Wed Dec 31, 2008 6:55 pm

Multiple Image Upload and Resize Form

Post by mikeyray »

I am VERY new to PHP, but I am trying to adapt code from http://www.4wordsystems.com/php_image_resize.php to work with multiple images. Can anyone please help?

I know I need to place it in a loop of some kind, but I don't know how to write the code for that. Here is the code:

HTML FORM CODE:

Code: Select all

<form action="upload.php" method="post" enctype="multipart/form-data" >
<input type="file" name="uploadfile"/>
<input type="submit"/>
</form>
upload.php CODE:

Code: Select all

<?php
 
// This is the temporary file created by PHP
$uploadedfile = $_FILES['uploadfile']['tmp_name'];
 
// Create an Image from it so we can do the resize
$src = imagecreatefromjpeg($uploadedfile);
 
// Capture the original size of the uploaded image
list($width,$height)=getimagesize($uploadedfile);
 
// For our purposes, I have resized the image to be
// 600 pixels wide, and maintain the original aspect
// ratio. This prevents the image from being "stretched"
// or "squashed". If you prefer some max width other than
// 600, simply change the $newwidth variable
$newwidth=600;
$newheight=($height/$width)*600;
$tmp=imagecreatetruecolor($newwidth,$newheight);
 
// this line actually does the image resizing, copying from the original
// image into the $tmp image
imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
 
// now write the resized image to disk. I have assumed that you want the
// resized, uploaded image file to reside in the ./images subdirectory.
$filename = "images/". $_FILES['uploadfile']['name'];
imagejpeg($tmp,$filename,100);
 
// For our purposes, I have resized the image to be
// 150 pixels high, and maintain the original aspect
// ratio. This prevents the image from being "stretched"
// or "squashed". If you prefer some max height other than
// 150, simply change the $newheight variable
$newheight=150;
$newwidth=($width/$height)*150;
$tmp=imagecreatetruecolor($newwidth,$newheight);
 
// this line actually does the image resizing, copying from the original
// image into the $tmp image
imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
 
// now write the resized image to disk. I have assumed that you want the
// resized, uploaded image file to reside in the ./images subdirectory.
$filename = "images/thumb_". $_FILES['uploadfile']['name'];
imagejpeg($tmp,$filename,100);
 
imagedestroy($src);
imagedestroy($tmp); // NOTE: PHP will clean up the temp file it created when the request
// has completed.
 
echo "Successfully Uploaded: <img src='".$filename."'>";
 
?>
The image is uploaded, resized twice, and saved twice (one larger image, and one thumbnail).

Does anyone know what the looping code should look like? Thanks
watson516
Forum Contributor
Posts: 198
Joined: Mon Mar 20, 2006 9:19 pm
Location: Hamilton, Ontario

Re: Multiple Image Upload and Resize Form

Post by watson516 »

Each file that you upload needs it's own file input. If you have one, you can only upload one file. Here is a pretty cool way of doing the form.

As for the php side of it, you would just have to loop through the file array resizing and saving each image.
mikeyray
Forum Newbie
Posts: 5
Joined: Wed Dec 31, 2008 6:55 pm

Re: Multiple Image Upload and Resize Form

Post by mikeyray »

That is a cool form - too bad I'm too new to be able to use it!

The big problem I have is in writing the php for the loop - I have never done anything like it before, and anytime I try to write anything based off of other forms it doesn't work out - I get errors and whatnot.

Do you happen to know what the loop code would look like?
watson516
Forum Contributor
Posts: 198
Joined: Mon Mar 20, 2006 9:19 pm
Location: Hamilton, Ontario

Re: Multiple Image Upload and Resize Form

Post by watson516 »

Code: Select all

...
<form  method="post" action="upload.php" enctype="multipart/form-data">
    <input type="file" name="photos[]"><br />
    <input type="file" name="photos[]"><br />
    <input type="file" name="photos[]"><br />
    <input type="submit" value="Upload" />
</form>
...
upload.php

Code: Select all

<?php
...
foreach ($_FILES[photos][name] as $key => $value) {
      $uploadfile = $uploaddir . basename($_FILES[photos][name][$key]); 
       //echo $uploadfile;
       if (move_uploaded_file($_FILES['photos']['tmp_name'][$key], $uploadfile)) { echo $value . ' uploaded<br>'; }
}
...
?>
You would have to stick the resizing code in the foreach loop but that should be pretty easy to figure out.
mikeyray
Forum Newbie
Posts: 5
Joined: Wed Dec 31, 2008 6:55 pm

Re: Multiple Image Upload and Resize Form

Post by mikeyray »

OK, so I have been messing around with the code you sent me and here is where I'm at:

Code: Select all

<?php
 
foreach ($_FILES[photos][name] as $key => $value) {
      $uploadedfile = $uploaddir . basename($_FILES[photos][name][$key]);
 
// Create an Image from it so we can do the resize
$src = imagecreatefromjpeg($uploadedfile);
 
// Capture the original size of the uploaded image
list($width,$height)=getimagesize($uploadedfile);
 
// For our purposes, I have resized the image to be
// 600 pixels wide, and maintain the original aspect
// ratio. This prevents the image from being "stretched"
// or "squashed". If you prefer some max width other than
// 600, simply change the $newwidth variable
$newwidth=600;
$newheight=($height/$width)*600;
$tmp=imagecreatetruecolor($newwidth,$newheight);
 
// this line actually does the image resizing, copying from the original
// image into the $tmp image
imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
 
// now write the resized image to disk. I have assumed that you want the
// resized, uploaded image file to reside in the ./images subdirectory.
$filename = "images/". $_FILES['photos']['name'];
imagejpeg($tmp,$filename,100);
 
// For our purposes, I have resized the image to be
// 150 pixels high, and maintain the original aspect
// ratio. This prevents the image from being "stretched"
// or "squashed". If you prefer some max height other than
// 150, simply change the $newheight variable
$newheight=150;
$newwidth=($width/$height)*150;
$tmp=imagecreatetruecolor($newwidth,$newheight);
 
// this line actually does the image resizing, copying from the original
// image into the $tmp image
imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
 
// now write the resized image to disk. I have assumed that you want the
// resized, uploaded image file to reside in the ./images subdirectory.
$filename = "images/thumb_". $_FILES['photos']['name'];
imagejpeg($tmp,$filename,100);
 
imagedestroy($src);
imagedestroy($tmp); // NOTE: PHP will clean up the temp file it created when the request
// has completed.
 
       //echo $uploadfile;
       if (move_uploaded_file($_FILES['photos']['tmp_name'][$key], $uploadfile)) { echo $value . ' uploaded<br>'; }
}
 
?>
I removed my first few lines with the

Code: Select all

// This is the temporary file created by PHP
$uploadedfile = $_FILES['uploadfile']['tmp_name'];
in it, and I changed all of the instances of 'uploadfile' to 'photos' to match up with the names you gave in the html code, but now when I go to test it I get a message saying:
Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/phpRXBG6k' to '' in /home/mike9210/public_html/bcvt.ca/new/uploaded.php on line 53

Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/phpBTPJ5V' to '' in /home/mike9210/public_html/bcvt.ca/new/uploaded.php on line 53

Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/php9pjGlF' to '' in /home/mike9210/public_html/bcvt.ca/new/uploaded.php on line 53
Any ideas? As I said in the original post, I can make it work with just one image, so I know that there is nothing wrong with the server in that I cannot upload to it - I have done it!
watson516
Forum Contributor
Posts: 198
Joined: Mon Mar 20, 2006 9:19 pm
Location: Hamilton, Ontario

Re: Multiple Image Upload and Resize Form

Post by watson516 »

mikeyray wrote:
Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/phpRXBG6k' to '' in /home/mike9210/public_html/bcvt.ca/new/uploaded.php on line 53

Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/phpBTPJ5V' to '' in /home/mike9210/public_html/bcvt.ca/new/uploaded.php on line 53

Warning: move_uploaded_file() [function.move-uploaded-file]: Unable to move '/tmp/php9pjGlF' to '' in /home/mike9210/public_html/bcvt.ca/new/uploaded.php on line 53
Have you gone ahead and set $uploadfile? Your warning says that it is unable to move the file '/tmp/...' to '' (an empty string). $uploadfile is the destination file including the save path.

bool move_uploaded_file ( string $filename , string $destination )
mikeyray
Forum Newbie
Posts: 5
Joined: Wed Dec 31, 2008 6:55 pm

Re: Multiple Image Upload and Resize Form

Post by mikeyray »

You were right - I missed adding the $uploadfile - I think I omitted it because I mis-read it and thought I was declaring $uploadedfile twice. However, even after adding it it was still coming back with errors, so I read through the code and added the single quotation marks to line 4 for 'photos' and 'name'. Now when I run the script it runs all the way through and echoes back
DSC_5534.jpg uploaded
etc., but nothing is actually saved on the server.

Do you have any ideas why nothing is being saved? I know I don't know much about php, but it looks like we're telling it to save to the "/images" directly (which I have created on the server).

Here is the complete php script as of now:

Code: Select all

<?php
 
foreach ($_FILES[photos][name] as $key => $value) {
       $uploadfile = $uploaddir . basename($_FILES['photos']['name'][$key]); 
 
// This is the temporary file created by PHP
$uploadedfile = $_FILES['photos']['tmp_name'];
 
// Create an Image from it so we can do the resize
$src = imagecreatefromjpeg($uploadedfile);
 
// Capture the original size of the uploaded image
list($width,$height)=getimagesize($uploadedfile);
 
// For our purposes, I have resized the image to be
// 600 pixels wide, and maintain the original aspect
// ratio. This prevents the image from being "stretched"
// or "squashed". If you prefer some max width other than
// 600, simply change the $newwidth variable
$newwidth=600;
$newheight=($height/$width)*600;
$tmp=imagecreatetruecolor($newwidth,$newheight);
 
// this line actually does the image resizing, copying from the original
// image into the $tmp image
imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
 
// now write the resized image to disk. I have assumed that you want the
// resized, uploaded image file to reside in the ./images subdirectory.
$filename = "images/". $_FILES['photos']['name'];
imagejpeg($tmp,$filename,100);
 
// For our purposes, I have resized the image to be
// 150 pixels high, and maintain the original aspect
// ratio. This prevents the image from being "stretched"
// or "squashed". If you prefer some max height other than
// 150, simply change the $newheight variable
$newheight=150;
$newwidth=($width/$height)*150;
$tmp=imagecreatetruecolor($newwidth,$newheight);
 
// this line actually does the image resizing, copying from the original
// image into the $tmp image
imagecopyresampled($tmp,$src,0,0,0,0,$newwidth,$newheight,$width,$height);
 
// now write the resized image to disk. I have assumed that you want the
// resized, uploaded image file to reside in the ./images subdirectory.
$filename = "images/thumb_". $_FILES['photos']['name'];
imagejpeg($tmp,$filename,100);
 
imagedestroy($src);
imagedestroy($tmp); // NOTE: PHP will clean up the temp file it created when the request
// has completed.
 
       //echo $uploadedfile;
       if (move_uploaded_file($_FILES['photos']['tmp_name'][$key], $uploadedfile)) { echo $value . ' uploaded<br>'; }
}
 
?>
watson516
Forum Contributor
Posts: 198
Joined: Mon Mar 20, 2006 9:19 pm
Location: Hamilton, Ontario

Re: Multiple Image Upload and Resize Form

Post by watson516 »

What is $uploaddir?
mikeyray
Forum Newbie
Posts: 5
Joined: Wed Dec 31, 2008 6:55 pm

Re: Multiple Image Upload and Resize Form

Post by mikeyray »

I'm not too sure - it was in that chunk of code you posted up yesterday, but I don't see where it was declared itself - does that mean that we would need to assign a value to it?
watson516 wrote:

Code: Select all

...
<form  method="post" action="upload.php" enctype="multipart/form-data">
    <input type="file" name="photos[]"><br />
    <input type="file" name="photos[]"><br />
    <input type="file" name="photos[]"><br />
    <input type="submit" value="Upload" />
</form>
...
upload.php

Code: Select all

<?php
...
foreach ($_FILES[photos][name] as $key => $value) {
      $uploadfile = $uploaddir . basename($_FILES[photos][name][$key]); 
       //echo $uploadfile;
       if (move_uploaded_file($_FILES['photos']['tmp_name'][$key], $uploadfile)) { echo $value . ' uploaded<br>'; }
}
...
?>
You would have to stick the resizing code in the foreach loop but that should be pretty easy to figure out.
watson516
Forum Contributor
Posts: 198
Joined: Mon Mar 20, 2006 9:19 pm
Location: Hamilton, Ontario

Re: Multiple Image Upload and Resize Form

Post by watson516 »

Yeah... You should probably put the directory in there where you want to upload your files to. Otherwise PHP doesn't know where to put them.
Post Reply