[Oisín]

Okay, here's what I want to do - not very hard, but since I have no idea what I'm doing in PHP, I still can't do it

I have a folder on my webspace which contains photos numerically named (ie. 01.jpg, 02.jpg, etc.). I would like to make a simple page with PHP (well, or JavaScript or something) that simply displayed all the images in this folder, basically running some sort of function seeing if there is a file with a name numerically one higher than the last one, and if there is, add another div and put the picture inside.

So, basically, something like [warning, bad PHP mock-up (which is probably more like JavaScript than PHP anyway) alert] this:

[PHP]<?php if folderHasImg('00.jpg') or folderHasImg(+1'.jpg') ?>

<div><img src="00.jpg"></div>

<?php } ?>[/PHP]

Yeah, you get the meaning, I hope...

Is this something that some PHP wiz can whip up in 30 seconds for me? Or is it more bothersome than it would seem?

TIA for help

[Chris O'Brien]

If you have all the images labelled liked that and know how many images there are (and the listing is continuous) then you can easily do it in JavaScript.

However, here's some PHP code (quick 'n' dirty and not tested, so play around with it some more):
[php]
if ($img_dir = opendir('/path/to/image_folder')) {
while (false !== ($file = readdir($img_dir))) {
if ($file != "." && $file != "..") {
echo "<div><img src=\"" . $file . "\" /></div>\n";
}
}
closedir($img_dir);
}
[/php]

Obviously, that's assuming all the files in the directory are images... And I've added the <div> tags round, although I'm not sure why you want them

Note, the above is taken pretty much straight from the PHP documentation - apparently having the false !== part is the correct way to do, so that's what I've done.

[mrwalker]

Originally posted by Black Book:
apparently having the false !== part is the correct way to do, so that's what I've done.

That's because of dynamic typing in PHP. If the filename returned in $file = readdir($img_dir) was a string equal to "0" (ie the file had been named "0"), it would evaluate as false and break your loop. Using !== or the opposite, === means that the types are compared too


-mrwalker

[Chris O'Brien]

Originally posted by mrwalker:
That's because of dynamic typing in PHP. If the filename returned in $file = readdir($img_dir) was a string equal to "0" (ie the file had been named "0"), it would evaluate as false and break your loop. Using !== or the opposite, === means that the types are compared too


-mrwalker

Cheers for clearing that up

[Oisín]

Heh, I knew I could count on you guys - go out for a bite to eat for dinner, and when you come back, voil�, the NN'ers have solved all your problems

Originally posted by Black Book:
If you have all the images labelled liked that and know how many images there are (and the listing is continuous) then you can easily do it in JavaScript.

I have them all labelled like that, but don't know how many images there are. The idea is that later on, I will replace the photos now in the folder with other photos (not necessarily the same amount), and then the page will be automatically updated to show all the new ones/not show empty holders if there are fewer.

Obviously, that's assuming all the files in the directory are images... And I've added the <div> tags round, although I'm not sure why you want them

For styling

Okay, I'll play around with it awhile, try to make complete sense of it via the Documentation, and then come back and ask more when I fail

Thanks for now

[Oisín]

Okay, first hurdle...

I get this error message:

"Warning: opendir() [function.opendir]: open_basedir restriction in effect. File(/photos/) is not within the allowed path(s): (/STORE/eithne_dk/) in /STORE/eithne_dk/public_html/denis/index.php on line 17

Warning: opendir(/photos/) [function.opendir]: failed to open dir: Operation not permitted in /STORE/eithne_dk/public_html/denis/index.php on line 17"

So, I ran a phpinfo() to see what it said about open_basedir (from what I gather, if it says "no value", there should be no problems). Well, under local value, it says "/STORE/eithne_dk/:/tmp/"; under master value, it says "no value".

I'm not understanding...

Edit: Oh, should probably provide link

[Chris O'Brien]

You're just using the wrong path, it would seem. Where is the photo directory in relation to index.php? You'll likely just need to remove the leading forward slash.

e.g. if index.php is in folder denis, and the photos dir is also in the denis directory, then the path to use is just photos/ and not /photos/.

Edit: just checked your site, and it is as I described in the above example. So just use photos/ as your path.

[Oisín]

D'oh d'oh d'oh d'oh d'oh!!!

Yeah, sorry for that... I was sure I had tried without the first slash too, but just to make sure, I tried again - and whaddya know, it worked perfectly... Thank you for being patient and answering idiot questions that I turn out to know the answers to perfectly well

[Oisín]

Edit: Nevermind, figured it out finally...

(P.S.: What's up with the servers? I keep getting the MacNN forum database error message when I try posting, but it's not 4:30 in the afternoon )

[Chris O'Brien]

Sorry, that's my fault. A slight oversight by me.

try this:
[php]
$path = "photos/";
if ($img_dir = opendir($path)) {
____while (false !== ($file = readdir($img_dir))) {
________if ($file != "." && $file != "..") {
____________echo "<div><img src=\"" . $path . $file . "\" /></div>\n";
________}
____}
____closedir($img_dir);
}
[/php]

Sorry about that - readdir is just returning the files within the directory, not their path.

[Oisín]

Originally posted by Black Book:
Sorry, that's my fault. A slight oversight by me.

Sorry about that - readdir is just returning the files within the directory, not their path.

No problem, I figured it out Had to change a little here and there in order for it to stop outputting $img_dir as "Resource #2" all the time, so in the end it ended up looking like this (with a little extra hiddlyhoops because I want to place the images in different divs depending on whether it's a portrait or landscape image):

[PHP]<?php

$img_dir = "../photos/denis/";

if (is_dir($img_dir)) {
if ($dh = opendir($img_dir)) {
while (($file = readdir($dh)) !== false) {
if ($file != "." && $file != "..") {
$img = ImageCreateFromJpeg($img_dir . $file);
if (imagesx($img) == '480') {
echo "<div class=\"holderleft\"><img src=\"$img_dir" . $file . "\" /></div>\n";
} else {
echo "<div class=\"holderright\"><img src=\"$img_dir" . $file . "\" /></div>\n";
}
}
}
}
} ?>[/PHP]

[Oisín]

*bumpety-bump-dump*

So... now that I got the first part out of the way, I wanted to make each picture a thumbnail link that, when clicked, will show the image clicked on in big size. This I could of course do with JavaScript pretty easily, but I figured since I'm doing this to get just a teensy weensy bit under the skin of PHP, I might as well try with that. But is that even possible to do in PHP? I mean, dynamically changing the source of the big image in the middle of the page without reloading the page would happen in the browser, right? And PHP is only server-side, right? So, am I "stuck" with JavaScript for this part of the page?

[mrwalker]

Originally posted by Ois�n:
*bumpety-bump-dump*

So... now that I got the first part out of the way, I wanted to make each picture a thumbnail link that, when clicked, will show the image clicked on in big size. This I could of course do with JavaScript pretty easily, but I figured since I'm doing this to get just a teensy weensy bit under the skin of PHP, I might as well try with that. But is that even possible to do in PHP? I mean, dynamically changing the source of the big image in the middle of the page without reloading the page would happen in the browser, right? And PHP is only server-side, right? So, am I "stuck" with JavaScript for this part of the page?

Ois�n,

That way the browser would be loading the full size image and displaying it as at thumbnail size, then displaying it larger.

You are right; this cannot be done in PHP without reloading because the click would need to be sent back to the server, processed and sent back to the client.

Why not go to another page to view the full size image?


-mrwalker

[Oisín]

Originally posted by mrwalker:
That way the browser would be loading the full size image and displaying it as at thumbnail size, then displaying it larger.

Yup - for now, that is exactly what I want

I don't care that it will take a little longer for the page to load initially, I just want the pictures to pop up full size immediately, without the browser having to reload it. (I did it with JavaScript, 'cause I figured the answer would probably be what you wrote, that it wouldn't be possible in PHP without resending/reloading; here it is again)

Why not go to another page to view the full size image?

Maybe I'll change to that method later on, or change to having thumbnails and full-size images separated, but for now I prefer the other way

[mrwalker]

Originally posted by Ois�n:
here it is again

All makes sense now - nicely done


-mrwalker

[ppmax]

Not to sound like a **** head, but one element of web design is considering how long it will take for a user to load a page. Im afraid that the site here fails that measure--who wants to wait for 20 big jpgs to load?

By modifying your PHP you can have one dir for thumbs and one for full size images. Provided these dirs have the same numbers of files in them you can use the index of the thumbnails image array to link to the related image in the big pics folder. More simply, if you named the pics in the thumbs folder and the big pics folder exactly the same, all you would have to do is change the path in the url....

[Oisín]

Originally posted by ppmax:
Not to sound like a **** head, but one element of web design is considering how long it will take for a user to load a page. Im afraid that the site here fails that measure--who wants to wait for 20 big jpgs to load?

By modifying your PHP you can have one dir for thumbs and one for full size images. Provided these dirs have the same numbers of files in them you can use the index of the thumbnails image array to link to the related image in the big pics folder. More simply, if you named the pics in the thumbs folder and the big pics folder exactly the same, all you would have to do is change the path in the url....

Yeah, I know - I was considering which option to go with, but Denis (the guy whose pictures they all are, and who is sending the link to family and friends) preferred this way...

And actually, it should be possible to make the thumbnails through PHP without even having a folder with thumbnails beforehand, shouldn't it? I think I saw a script that did that somewhere in the Manual at php.net...