image manipulation

[saunders1989]

i have images that are 90% A4 size and some that are post card size. when i click on the thumbnails i create i display the full sized image but A4 is massive to display so i need to shrink it down to fit on the screen.

i create the thumbnails from the original image in the first place so i thought i could use the same code to just shrink the oringal image to a size thats suitable. (the code just grabs the image from the folder and just shrinks it down)

to display the thumbnail is use this code :

while ($row = $result->fetch_assoc()) {
    
echo "<a href=\"image.php?id=" . $row['id'] . "\">";
echo "<img src=\"imageResize.php?imageFilename=" . $row['name'] . "&maxHeight=120,&maxWidth=150\" />\n";
echo "</a>\n";

}
    
?> 

but when i click on the thumbnail to display the full sized image i used this:

while($row = $result->fetch_row()) {
echo "<img src=\"" . $row[2] . "\" />";
} 

i need to somehow in the src use imageResize but ive tried a fair amount of ways but have not figured it out yet. could someone please advise

Thanks

[hash]

imageResize.php is a script that takes parameters and outputs an image. You need to use that as your src.

[Raju Gautam]

If I have understood what you want:
- Find the width and height of the image (original).

list($width, $height) = getimagesize($row['name']); 

- Check if the image is bigger than the post card (or your default size) and use imageResize.php and pass the width and height if it is bigger one.

if($width > $postcardwidth || $height > $postcardheight){
    echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "&maxHeight=" . $height . "&maxWidth=" . $width . "\" />\n"; 
}
else{
    echo "<img src=\"" . $row[2] . "\" />"; 
} 

[saunders1989]

i know i need to use it as my source as i have used it in my thumbnail creation but dont understand the code to use.

what i think i need is how to use the imageResize file as my img src like the one for my thumbnails. but when i try doing something similair it doesnt display the image.

could you please explain where i might be going wrong?

also do you want to see the script i have got?

[guido2004]

also do you want to see the script i have got?

yes

[saunders1989]

here is imageResize:

<?php

error_reporting(E_ALL &~ E_NOTICE);

$image = "C:/wamp/www/Blean_Photos/images/" . $_GET['imageFilename'];

switch(strtolower(substr($_GET['imageFilename'], -3))) {
case "jpg" :
$fileType = "jpeg";
$imageCreateFunction = "imagecreatefromjpeg";
$imageOutputFunction = "imagejpeg";
break;
case "jpeg" :
$fileType = "jpeg";
$imageCreateFunction = "imagecreatefromjpeg";
$imageOutputFunction = "imagejpeg";
break;
case "png" :
$fileType = "png";
$imageCreateFunction = "imagecreatefrompng";
$imageOutputFunction = "imagepng";
break;
}

if(!$_GET['maxWidth']) {
$maxWidth = 100;
} else {
$maxWidth = $_GET['maxWidth'];
}

if(!$_GET['maxHeight']) {
$maxHeight = 150;
} else {
$maxHeight = $_GET['maxHeight'];
}

$size = GetImageSize($image);
$originalWidth = $size[0];
$originalHeight = $size[1];

$x_ratio = $maxWidth / $originalWidth;
$y_ratio = $maxHeight / $originalHeight;

// check that the new width and height aren't bigger than the original values.

if (($originalWidth <= $maxWidth) && ($originalHeight <= $maxHeight)) { // the new values are higher than the original, don't resize or we'll lose quality
$newWidth = $originalWidth;
$newHeight = $originalHeight;
} else if (($x_ratio * $originalHeight) < $maxHeight) {
$newHeight = ceil($x_ratio * $originalHeight);
$newWidth = $maxWidth;
} else {
$newWidth = ceil($y_ratio * $originalWidth);
$newHeight = $maxHeight;
}

$src = $imageCreateFunction($image);
$dst = imagecreatetruecolor($newWidth, $newHeight);

// Resample
$thumbnail = imagecopyresampled($dst, $src, 0, 0, 0, 0, $newWidth, $newHeight, $originalWidth, $originalHeight);
unset($image);
// Output


Header('Content-type: image/' . $fileType);
$imageOutputFunction($dst);

ImageDestroy($src);
ImageDestroy($dst);

?>

[guido2004]

here is imageResize:

Sorry, I meant image.php

[saunders1989]

sorry i missunderstood what you wanted ill give you both: here is the thumbnails page:

<?php

/* set up the database connection because real_escape_string() relies on an open connection to work */

$dbLink = new mysqli('localhost', 'root', '', 'gallery');
if(mysqli_connect_errno()) {
die("MySQL connection failed: ". mysqli_connect_error());
}

/* check that $_GET['gallery'] has a value and the value is numeric - ie someone hasn't changed the url to just gallery.php or tried to be clever & entered gallery.php?gallery=bob */

if(isset($_GET['gallery']) && is_numeric($_GET['gallery'])) {
/* $_GET['gallery'] passes our test, so perform security functions on it & assign it to the $gallery variable */
$gallery = $dbLink->real_escape_string($_GET['gallery']);
} else {
/* it doesn't exist or it isn't numeric so assign a default value so our query below always gets constructed properly & safely */
$gallery = 1;
}

/* construct the query */
$query = "SELECT id, name, size, image_path FROM images WHERE gallery_type_id = $gallery";

/* run the query */
$result = $dbLink->query($query);

/* loop through the results & display the images */
while ($row = $result->fetch_assoc()) {
    
echo "<a href=\"image.php?id=" . $row['id'] . "\">";
echo "<img src=\"imageResize.php?imageFilename=" . $row['name'] . "&maxHeight=120,&maxWidth=150\" />\n";
echo "</a>\n";

}        
?>

and here is image.php

<?php
$dbLink = new mysqli('localhost', 'root', '', 'gallery');
if(mysqli_connect_errno()) {
die("MySQL connection failed: ". mysqli_connect_error());
}

if(isset($_GET['id']) && is_numeric($_GET['id'])) {
/* $_GET['id'] passes our test, so perform security functions on it & assign it to the $id variable */
$id= $dbLink->real_escape_string($_GET['id']);
} else {
/* it doesn't exist or it isn't numeric so assign a default value so our query below always gets constructed properly & safely */
$id = 1;
}


/* construct the query */
$query = "SELECT name, size, image_path FROM images WHERE id = $id";

/* run the query */
$result = $dbLink->query($query);

while($row = $result->fetch_row()) {
echo "<img src=\"" . $row[2] . "\" />"; // you could also play with the other $row[] variables returned by the query here.
}

?>

[Raju Gautam]

Did you try what i said before in image.php inside the while loop?
- Find the width and height of the image (original).

list($width, $height) = getimagesize($row[2]); 

- Check if the image is bigger than the post card (or your default size) and use imageResize.php and pass the width and height if it is bigger one.

if($width > $postcardwidth || $height > $postcardheight){
    echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "&maxHeight=" . $height . "&maxWidth=" . $width . "\" />\n"; 
}
else{
    echo "<img src=\"" . $row[2] . "\" />"; 
} 

PS: You don't have to use while loop here in image.php because you are getting a single record/row.

$row = $result->fetch_row();
echo "<img src=\"" . $row[2] . "\" />"; 

[saunders1989]

would the new code be:

<?php

$dbLink = new mysqli('localhost', 'root', '', 'gallery');

if(mysqli_connect_errno()) {

die("MySQL connection failed: ". mysqli_connect_error());

}



if(isset($_GET['id']) && is_numeric($_GET['id'])) {

/* $_GET['id'] passes our test, so perform security functions on it & assign it to the $id variable */

$id= $dbLink->real_escape_string($_GET['id']);

} else {

/* it doesn't exist or it isn't numeric so assign a default value so our query below always gets constructed properly & safely */

$id = 1;

}





/* construct the query */

$query = "SELECT name, size, image_path FROM images WHERE id = $id";



/* run the query */

$result = $dbLink->query($query);



while($row = $result->fetch_row()) {
list($width, $height) = getimagesize($row[2]); 


}

if($width > $postcardwidth || $height > $postcardheight){
    echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "&maxHeight=" . $height . "&maxWidth=" . $width . "\" />\n"; 
}
else{
    echo "<img src=\"" . $row[2] . "\" />"; 
} 




?>

i just dont get what the variable postcardwidth and height are about?
can you just explain a little more please

[guido2004]

What rajug is saying, is that you can check the actual image size against the max image size you want to use, and if the image is bigger you call the resize script.
In his script, he uses two variables that would contain the post card size you talked about in your OP, but you can of course use any size you want.

I think there's a little error in his code. It should be:

$row = $result->fetch_row();
list($width, $height) = getimagesize($row[2]); 
if ($width > $maxwidth || $height > $maxheight) {
  echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "&maxHeight=" . $maxheight . "&maxWidth=" . $maxwidth . "\" />\n"; 
} else {
  echo "<img src=\"" . $row[2] . "\" />"; 
}

[saunders1989]

oh okay. so i can take out the stuff i placed in and literally have this?

<?php



$dbLink = new mysqli('localhost', 'root', '', 'gallery');



if(mysqli_connect_errno()) {



die("MySQL connection failed: ". mysqli_connect_error());



}







if(isset($_GET['id']) && is_numeric($_GET['id'])) {



/* $_GET['id'] passes our test, so perform security functions on it & assign it to the $id variable */



$id= $dbLink->real_escape_string($_GET['id']);



} else {



/* it doesn't exist or it isn't numeric so assign a default value so our query below always gets constructed properly & safely */



$id = 1;



}











/* construct the query */



$query = "SELECT name, size, image_path FROM images WHERE id = $id";







/* run the query */



$result = $dbLink->query($query);

$row = $result->fetch_row();
list($width, $height) = getimagesize($row[2]);
if ($width > $maxwidth || $height > $maxheight) {
  echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "&maxHeight=" . $maxheight . "&maxWidth=" . $maxwidth . "\" />\n";
} else {
  echo "<img src=\"" . $row[2] . "\" />";
}

[guido2004]

You'll have to define $maxwidth and $maxheight somewhere.

[saunders1989]

do i not define them in imageResize though?

or i can do this:

[guido2004]

No, you pass them to imageResize.php as parameters in the query string ("&maxHeight=" . $maxheight . "&maxWidth=" . $maxwidth).
In imageResize.php, if no parameters are passed, a default height and width is used. But you are passing them, so if you don't give them a value, it won't work. Of course, you can also try calling imageResize.php without passing the height and width parameters.

[saunders1989]

sorry my bad forgot to add the code in the other post:

?php

$dbLink = new mysqli('localhost', 'root', '', 'gallery');

if(mysqli_connect_errno()) {


die("MySQL connection failed: ". mysqli_connect_error());


}


if(isset($_GET['id']) && is_numeric($_GET['id'])) {

/* $_GET['id'] passes our test, so perform security functions on it & assign it to the $id variable */

$id= $dbLink->real_escape_string($_GET['id']);

} else {

/* it doesn't exist or it isn't numeric so assign a default value so our query below always gets constructed properly & safely */
$id = 1;
}

/* construct the query */
$query = "SELECT name, size, image_path FROM images WHERE id = $id";

/* run the query */
$result = $dbLink->query($query);

$maxheight=300;
maxwidth=250;


$row = $result->fetch_row();

list($width, $height) = getimagesize($row[2]);

if ($width > $maxwidth || $height > $maxheight) {

  echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "&maxHeight=" . $maxheight . "&maxWidth=" . $maxwidth . "\" />\n";

} else {

  echo "<img src=\"" . $row[2] . "\" />";

} 

[Raju Gautam]

do i not define them in imageResize though?

or i can do this:

If you dont need those in imageResize then you dont have to define them otherwise you have to define them in both files i guess.

[saunders1989]

im really sorry. your last post has confused me.

in imageResize i have a maxwidth and a maxheight set. i will change that as they are set at thumbnail size. but what your tryingto say has confused me

[guido2004]

or i can do this:

Yes you can. Watch out: there is a $ missing

[guido2004]

im really sorry. your last post has confused me.

in imageResize i have a maxwidth and a maxheight set. i will change that as they are set at thumbnail size. but what your tryingto say has confused me

You do not have a maxwidth and maxheight set in imageResize.

if(!$_GET['maxWidth']) {
  $maxWidth = 100;
} else {
  $maxWidth = $_GET['maxWidth'];
}

This is a piece of imageResize. It says: if you passed me a parameter called maxWidth, then I'll use its value as max width. If you didn't pass me such a parameter, I'll use 100 as max width.

So you have two choices.
1) Define a value for maxWidth and maxHeight in the script that calls imageResize (as you did in the last script you posted: $maxheight=300; $maxwidth=250; )
2) Call imageResize without the maxWidth and maxHeight parameters:

echo "<img src=\"imageResize.php?imageFilename=" . $row[2] . "\" />\n";

[saunders1989]

the second option doesnt work, ive tried that method first but it doesnt display my image at all.

is the next step to use the code i tried writing?