I have to create a photo album with thumbnails. I have three pages. An index.photo.php page, showpage.php, and show.php. The index page simply has
<html>
<meta http-equiv="refresh"
content="0;url=showpage.php?page=1">
</html>
The showpage page has this:
<style type="text/css">
body { font-family: Georgia;
background-color: #666666; }
a { text-decoration: none;
color: #FFFFFF; }
a:hover { color: #888888; }
</style>
<center>
<h2>Photo Gallery of Flowers</h2>
Please, click each thumbnail image to see more details. Thanks.
<p>
<?php
#### Resizing Function #########
function imageResize($width, $height, $target) {
if ($width > $height) {
$percentage = ($target / $width);
}
else {
$percentage = ($target / $height);
}
$width = round($width * $percentage);
$height = round($height * $percentage);
return "width=\"$width\" height=\"$height\"";
}
#################################
echo ("<table border=1 cellpadding=5 cellspacing=5><tr>");
$page=$_GET['page'];
$mydir = dir('images'); # read every file in the directory of "data"
while(($file = $mydir->read()) !== false) {
if (stristr($file, "JPG")){ # only JPG files
$total++;
if ($total>28*($page-1) && $total<=28*($page)){
$count++;
$mysize = getimagesize("images/$file");
echo ("<td width=100 align=center valign=middle><a href=./view/show.php?id=$total>");
echo ("<img src=images/$file ");
echo (imageResize($mysize[0], $mysize[1], 100)); # thumbnail size 100 pixel
echo (" border=0></a></td>");
if ($count>6){
echo ("</tr><tr>");
$count=0;
}
} #total<15
}
}
# fill out the blank cells with *
if ($count>0){
for ($i=$count; $i<7; $i++){
echo ("<td align=center width=100>*</td>");
}
echo ("</tr>");
}
echo ("</table><p>");
# prepare the navigation menu for more images/pages
$n=((int)($total/29))+1;
for ($i=1; $i<$n+1; $i++){
if ($i==$page){
echo ("<b>$i</b> ");
}
else {
echo ("<a href=showpage.php?page=".$i.">".$i."</a> "); # page navigation; 28 images per page
}
}
?>
</center>
</body>
</html>
The show page has
<html>
<style type="text/css">
body { font-family: Georgia;
background-color: #666666; }
a { text-decoration: none;
color: #FFFFFF; }
a:hover { color: #888888; }
</style>
<?php
# gather necessary information from the previous page with GET method
$id=$_GET['id'];
$interval=$_GET['interval'];
$last=$_GET['last'];
# if the slide show is on, show the next one, if nothing left, back to the first image
if ($interval){
echo ("<font size=2>Slid Show ON with $interval Seconds of Interval!</font><p>");
$forward=$id+1;
if ($forward>$_GET['last']){$forward=1;}
echo ('<META HTTP-EQUIV=Refresh CONTENT="'.$interval.';
URL=show.php?id='.$forward.'&interval='.$interval.'&last='.$last.'">');
}
# this function is for resizing a given image, currently set with 600 pixel.
function imageResize($width, $height, $target) {
if ($width > $height) {$percentage = ($target / $width); }
else { $percentage = ($target / $height); }
$width = round($width * $percentage);
$height = round($height * $percentage);
return "width=\"$width\" height=\"$height\"";
}
# read every file from "data" directory (folder), and get only JPG files. case insensitive for "JPG"
$mydir = dir('images');
while(($file = $mydir->read()) !== false) {
if (stristr($file, "JPG")){
$count++;
if ($id==$count){
$filename="images".$file;
$current=$id;
}
}
}
# se the current image, and the previous and the next one by number (+/-)
$last=$count;
$previous=$current-1;
$next=$current+1;
if ($current==1){$previous=$last;} # avoid the minus number
if ($current==$last){$next=1;} # avoid the out of range number
# get the image size into an array
$mysize = getimagesize("$filename");
echo ("<a href=show.php?id=".$previous.">Previous Image</a> | ");
echo ("<a href=../index.php>HOME</a> | ");
echo ("<a href=show.php?id=".$next.">Next Image</a>");
echo ("<p>");
echo ("<a href=$filename target=_blank><img src=$filename ");
if ($mysize[0]>600 && $mysize[1]>600){ # width AND height are greater than 600 pixel
echo (imageResize($mysize[0], $mysize[1], 600)); # resize upto 600 pixel
}
echo ("border=0></a>");
echo ("<p>");
?>
<form action=show.php>
Change Slide Show Interval:
<SELECT NAME="interval">
<OPTION value=5>5 seconds
<OPTION value=10>10 seconds
<OPTION value=15>15 seconds
</SELECT>
<input type=hidden name=id value=<? echo $id; ?>>
<input type=hidden name=last value=<? echo $last; ?>>
<input type=submit value="GO!">
</form>
</body>
</html>
The index page redirects to the showpage page. I haven't been able to figure out how to get my pictures to show and how the pages are being redirected. Any help would be appreciated.
