Simple Meta Content Refresh Slideshow and Image Browser
The
demo shows how this slideshow refreshes it's pages every given time.
Browsing is simply a matter if overriding the content refresh by clicking on next or previous links.
Images are preloaded: the first call loads the image to be showed and the next image, which it hides.
The browser can instantly show the next image because it's already cached - meanwhile the next gets preloaded.
This slideshow will not need any scripting in the browser (like javascript) itself, but ofcourse the browser will have to support content refresh.
Slideshow PHP Source
<?
/********* Simple Meta Content Refresh Slideshow ***********/
/******************** By Paul Barends **********************/
/********************* ALLAYERS.COM ************************/
/*
// Call the script with the following params:
// -> "t" is the refresh time in seconds. Example: slide.php?t=5
// -> "dir" is a directory, default is current. Example: slide.php?t=10&dir=./images
*/
function getPix($dir){
// opening directory for reading
$handle = opendir($dir);
// reading all filenames
while($file = readdir($handle)){
// skip directories
if (!is_dir($file)){
// if the file is not an image, getimagesize won't result (or error :-)
$img = getimagesize($dir."/".$file);
// 1,2,3 = gif, jpg, png
if ($img[2]>0 && $img[2]<4) $filenames[] = $dir."/".$file;
}
}// end while
usort($filenames, "cmp");
return $filenames;
}
function cmp($a,$b)
{
return strcasecmp($a, $b);
}
/***********************MAIN SCRIPT*************************/
// if not supplied default time
if(!$t)$t=10;
if(!$dir)$dir=".";
// To not have to read all the filenames all the time the initial selection is passed by URL
$data = getPix($dir); // array
// determine cycles
if (!$cycle) $cycle = 0;
if ($cycle == sizeof($data)) $cycle = 0;
$next = $cycle+1;
$prev = $cycle-1;
if ($prev<0)$prev = sizeof($data)-1;
//complete refresh url
$nexturl = $PHP_SELF."?cycle=".($next)."&t=".$t."&dir=".$dir;
$prevurl = $PHP_SELF."?cycle=".($prev)."&t=".$t."&dir=".$dir;
?>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<META HTTP-EQUIV="Refresh" Content="<?=$t?>; url=<?=$nexturl?>">
<META HTTP-EQUIV="Expires" CONTENT="0">
<title>slideshow demo page</title>
</head>
<body>
<?
// display
$title = str_replace("_"," ",$data[$cycle]);
$title = str_replace(array(".","/","gif","jpg","png"),"",$title);
?>
<div align="center">
<form name="timeform">
<table align="center" width="60%">
<tr>
<td width="100"><A href="<?=$prevurl?>">< Back</A></td>
<td align="center">Timing</td>
<td width="100" align="right"><A href="<?=$nexturl?>">Next ></A></td>
</tr>
<tr>
<td></td>
<td align="center">
<select name="t" onchange="document.timeform.submit();">
<?
for($i=3;$i<27;$i++){
echo "<option value='$i'";
if ($i==$t)echo " selected";
echo ">$i sec";
}
?>
</option>
</select></td>
<td>
<input type="hidden" name="cycle" value="<?=$cycle;?>">
</td>
</tr>
</table>
</form>
</div>
<div align="center" style="left-margin:auto;right-margin:auto;">
<p><?=$title?></p>
<IMG align="absmiddle" src="<?=$url.$data[$cycle]?>" title="<?=$title?>">
</div>
<?
// now add a hidden image for caching
if ($next)echo"<IMG style=\"display:none\" src=\"".$url.$data[$next]."\">\n";
?>
</body>
</html>