Problem with thumbnails after newly added - PHP on-the-fly method

Question

to those that may have read my previous question that got solved a couple minutes ago >.<

The on-the-fly php script works perfectly, but when I went to upload new images into a gallery which I made myself, the images are resized to 150 x 150 for what I wanted... however, when it comes to new images being added it is all black...

As you can see the three black images that were uploaded to the folder and the directory added to the database.

The other (non-black images) are already resized with image.php.

What is causing this?

If I view the source, the code is fine... the while loop in the PHP generates an output like this:

<div class="view-wrap" id="photo-10">
    <div class="view-icon">
        <div class="img-label">
            <a href="#" id="10" class="delete"><img src="img/small-delete.png" /> Delete</a>
        </div>

        <a href="img/events/Paintballing/24251_1395408043148_1170626626_1204038_5382765_n.jpg">
            <img src="image.php?dir=img/events/Paintballing/24251_1395408043148_1170626626_1204038_5382765_n.jpg" alt="" width="110" height="110" />
        </a>
    </div>
</div>

An example of one block.

If I view the source (in Firefox) and click on the image.php?dir=img/events/Paintballing/24251_1395408043148_1170626626_1204038_5382765_n.jpg by exmaple, I can see the thumbnail at it's 150 x 150 size but in the layout, it shows a black thumbnail...

Does anyone know why this is happening?

EDIT:

<?php 

$dir = $_GET['dir'];

header('Content-type: image/jpeg'); 

$create = imagecreatetruecolor(150, 150); 

$img = imagecreatefromjpeg($dir);

list($width, $height) = getimagesize($dir);

imagecopyresampled($create, $img, 0, 0, 0, 0, 150, 150, $width, $height);

imagejpeg($create, null, 100); 

?>

This is image.php.

Answer 1

Thanks for updating your post.

Are you positive that the image is a jpg/jpeg that your uploading.

Try changing to the following

<?php 

$dir = $_GET['dir'];
$ext = strtoupper(pathinfo($dir, PATHINFO_EXTENSION));
switch($ext)
{
    case 'jpeg':
    case 'jpg':
        $img = imagecreatefromjpeg($dir);
    break;
    case 'png':
        $img = imagecreatefrompng($dir);
    break;
    case 'gif':
        $img = imagecreatefromgif($dir);
    break;
}
if(isset(img))
{
    header('Content-type: image/jpeg'); 
    $create = imagecreatetruecolor(150, 150); 
    list($width, $height) = getimagesize($dir);
    imagecopyresampled($create, $img, 0, 0, 0, 0, 150, 150, $width, $height);
    imagejpeg($create, null, 100); 
}else
{
   echo sprintf('Unable to process image, Unknown format %s',$ext);
}
?>

Answer 2

Rather than stretching the images why not add a border?

Here's the function

    function resize_to_canvas($filename,$canvas_w=100,$canvas_h=225){
list($width, $height, $type) = getimagesize($filename);

$original_overcanvas_w = $width/$canvas_w;
$original_overcanvas_h = $height/$canvas_h;

$dst_w = round($width/max($original_overcanvas_w,$original_overcanvas_h),0);
$dst_h = round($height/max($original_overcanvas_w,$original_overcanvas_h),0);

$dst_image = imagecreatetruecolor($canvas_w, $canvas_h);
$background = imagecolorallocate($dst_image, 255, 255, 255);
imagefill($dst_image, 0, 0, $background);

$src_image = imagecreatefromjpeg($filename);
imagecopyresampled($dst_image, $src_image, ($canvas_w-$dst_w)/2, ($canvas_h-$dst_h)/2, 0, 0, $dst_w, $dst_h, $width, $height);
imagegif($dst_image, $filename);
imagedestroy($dst_image);}

This function will replace the original file but is easily modified to create a new thumbnail image. Just change the file name the line imagegif($dst_image, $filename);