...

View Full Version : Page of pictures PHP



chris24300
12-17-2009, 06:05 PM
Hi, I'm trying to make a web page so I can view images in my directory, to make my webserver more eye friendly. I learned HTML a while back so I'm still refreshing. I'm trying to build a page where the full picture is on the left half of the page and the right half is a list of all thumbnails. First off I have the page refreshing every 70 seconds to check for updated images. I have a php script that is supposed to read all images within a directory and export as gallery[0], [1], ...



<?
//PHP SCRIPT: getimages.php
Header("content-type: application/x-javascript");

//This function gets the file names of all images in the current directory
//and ouputs them as a JavaScript array
function returnimages($dirname=".") {
$pattern="(\.jpg$)|(\.jpeg$"); //valid image extensions
$files = array();
$curimage=0;
if($handle = opendir($dirname)) {
while(false !== ($file = readdir($handle))){
if(eregi($pattern, $file)){ //if this file is a valid image
//Output it as a JavaScript array element
echo 'gallery['.$curimage.']="'.$file .'";';
$curimage++;
}
}

closedir($handle);
}
return($files);
}

echo 'var gallery=new Array();'; //Define array in JavaScript
returnimages() //Output the array elements containing the image file names
?>


I found this script that is of a slideshow, but instead I would like to list the images individually. Does anyone know how to I can modify this script to do so? Or at least head me in the right direction. Here is the script


<script type="text/javascript">

var curimg=0
function rotateimages(){
document.getElementById("slideshow").setAttribute("src", "pics/"+galleryarray[curimg])
curimg=(curimg<galleryarray.length-1)? curimg+1 : 0
}

window.onload=function(){
setInterval("rotateimages()", 2500)
}
</script>

<div style="width: 170px; height: 160px">
<img id="slideshow" src="pics/bear.gif" />
</div>


I modified it slightly to give me the most recent image as my large thumbnail (full image) on the left half. This is where I'm stumped.


<script type="text/javascript">
var curimg=0
function newestimg(){
document.getElementById("largethumb").setAttribute("src", "images/"+gallery[curimg])
curimg=(curimg<gallery.length-1)? gallery.length-1 : curimg
}


All help is appreciated,
Chris

hdewantara
12-23-2009, 03:38 PM
If the images and also the directory
in your server are already "world readable",
why do you need the php?

regards,



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum