Help with code to create an array from contents of folder

**Jim Weinberg** · 04-15-2014, 02:01 PM

I recently upgraded a webpage using Ultimate Fade-in Slideshow script from version 1.5.1 to version 2.4. With the previous version I used a PHP script to build an array of photos from the contents of a folder. Here's the code (John, if you're reading this, I believe you gave me this code):

Code:

<?php
//call line: <script type="text/javascript" src="a/build_array.php?folder=b&array=c&usefilenames=d"></script>
// where a=relative location of the php script file
//       b=relative location of graphics folder
//       c=name of array to be built
//       d=use file names as captions:yes|no

Header("content-type: application/x-javascript");
function returnimages($arrayname) {
$dirname="../" . $_GET["folder"] . "/";
$pathname="" . $_GET["folder"] . "/";
$pattern="\.(jpg|jpeg|png|gif|bmp)$";
$curimage=0;
$str=',""';
if($handle = opendir($dirname)) {
while(false !== ($file = readdir($handle))){
if(eregi($pattern, $file)){
if($_GET["usefilenames"]=='yes')
$str = ', "' . preg_replace('/\.[^\.]*$/', '', $file) . '"';
echo $arrayname . '[' . $curimage .']=["' . $pathname . $file . '", "", ""' . $str . '];' . "\n";
$curimage++;
}
}

closedir($handle);
}
}

$arrayname=$_GET["array"];
echo 'var ' . $arrayname . '=new Array();' . "\n";
returnimages($arrayname);
?>

The array name was then passed to the slideshow script as a parameter in the call.

The new slide show version has the array as an option:

Code:

var ShowPics=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [400, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["Graphics/ShowPics/100_0466-A.jpg"],
		["Graphics/ShowPics/100_0467-A.jpg"],
		["Graphics/ShowPics/100_0469-A.jpg"],
		["Graphics/ShowPics/100_0470-A.jpg"],
		["Graphics/ShowPics/100_0471-A.jpg"],
		["Graphics/ShowPics/100_0472-A.jpg"]
	],
	displaymode: {type:'auto', pause:2000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})

What I'd like to do is replace the imagearray option and array definition with an array built by the PHP routine. I'm not a PHP coder, and really have no idea how to accomplish this.

Can someone please help me with this?

Thanks.

**Beverleyh** · 04-15-2014, 02:59 PM

This should do it - paste the PHP in green and blue in place of the JS array on your page;

Code:

var ShowPics=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [400, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [


<?php

     
$dir = '/home/www/website.com/Graphics/ShowPics/'; // root path to images
$path = 'Graphics/ShowPics/'; // path to echo in to page

$patterns = '\.(jpg|jpeg|png)$'; // only these file types
if($hd = opendir($dir)){               
	while(false !== ($fname = readdir($hd))){                       
		if(ereg('^\.{1,2}$',$fname)) continue; // exclude current directory, parent directory                              
		if(! ereg($patterns,$fname)) continue; // exclude file types not in $patterns           
 		$files_array[] = $fname;
		}
	} 
sort($files_array); // sort files a-z
for ($i = 0; $i < count($files_array); $i++) { 
	$comma = ($i != count($files_array) - 1) ? ',' : ''; // if next item exists in array set $comma as ',' else '' (nothing)
	echo "[\"$path$files_array[$i]\"]$comma<br/>"; 
	}
closedir($hd); 
?>


	],
	displaymode: {type:'auto', pause:2000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})

Should output this;

Code:

var ShowPics=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [400, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
		["Graphics/ShowPics/100_0466-A.jpg"],
		["Graphics/ShowPics/100_0467-A.jpg"],
		["Graphics/ShowPics/100_0469-A.jpg"],
		["Graphics/ShowPics/100_0470-A.jpg"],
		["Graphics/ShowPics/100_0471-A.jpg"],
		["Graphics/ShowPics/100_0472-A.jpg"]
	],
	displaymode: {type:'auto', pause:2000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})

Remember to change the variables in blue. This should also be placed inside the web page rather than in an external file.

**Jim Weinberg** · 04-15-2014, 03:19 PM

Hi Beverley.

Thank you so much for your help. That will definitely work. I see that you said to put the code in the web page, and I hope I'm not pressing my luck, but I have 7-10 different graphics folders and rather than replicate the PHP code in each slideshow definition (they're all on the same page), I'd really like to be able to put the common code in an external file and call it. Is that possible?

**Beverleyh** · 04-15-2014, 04:11 PM

Yes, you should just be able to turn it in to a function and pass the variables to it.

(untested)

Put this in an external .php file (e.g - "slide-array-function.php");

Code:

<?php
     
function imageSlideArray($dir, $path) {

//$dir = '/home/www/website.com/Graphics/ShowPics/'; // root path to images
//$path = 'Graphics/ShowPics/'; // path to echo in to page

$patterns = '\.(jpg|jpeg|png)$'; // only these file types
if($hd = opendir($dir)){               
	while(false !== ($fname = readdir($hd))){                       
		if(ereg('^\.{1,2}$',$fname)) continue; // exclude current directory, parent directory                              
		if(! ereg($patterns,$fname)) continue; // exclude file types not in $patterns           
 		$files_array[] = $fname;
		}
	} 
sort($files_array); // sort files a-z
for ($i = 0; $i < count($files_array); $i++) { 
	$comma = ($i != count($files_array) - 1) ? ',' : ''; // if next item exists in array set $comma as ',' else '' (nothing)
	echo "[\"$path$files_array[$i]\"]$comma<br/>"; 
	}
closedir($hd);

} 
?>

Then on your web page, include the function file at the top;

Code:

<?php include('path/to/slide-array-function.php');?>

And call it like this;

Code:

var ShowPics=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [400, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [

<?php imageSlideArray('/home/www/website.com/Graphics/ShowPics/', 'Graphics/ShowPics/');?>

	],
	displaymode: {type:'auto', pause:2000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})

**Beverleyh** · 04-15-2014, 04:23 PM

Just a note - ereg() was deprecated from PHP v5.3.0

I say now because I realised after I copied and paste part of the code above from one of my older websites running v5.2.?

Depending on the version of PHP you (or anyone looking in on this thread) is using, you might need to replace these lines;

replace;

Code:

$patterns = '\.(jpg|jpeg|png)$'; // only these file types

with;

Code:

$patterns = '/\.(jpg|jpeg|png)$/'; // only these file types

replace;

Code:

		if(ereg('^\.{1,2}$',$fname)) continue; // exclude current directory, parent directory                              
		if(! ereg($patterns,$fname)) continue; // exclude file types not in $patterns

with

Code:

		if(preg_match('/^\.{1,2}$/',$fname)) continue; // exclude current directory, parent directory 
		if(!preg_match($patterns,$fname)) continue; // exclude file types not in $patterns

**Jim Weinberg** · 04-15-2014, 05:40 PM

Beverley.

Tried your recommendations, but no go. The PHP routine, which I called build_array.php, is exactly as you specified. Here's the code from the webpage:

Code:

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta http-equiv="Content-Style-Type" content="text/css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<?php include('http://www.ohiobuttons.org/test/Script_Files/build_array.php');?>

<script type="text/javascript" src="Script_Files/fadeslideshow.js">
/***********************************************
* Ultimate Fade In Slideshow v2.0- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for this script and 100s more
***********************************************/

</script>

<script>
var ShowPics=new fadeSlideShow({
	wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
	dimensions: [400, 300], //width/height of gallery in pixels. Should reflect dimensions of largest image
	imagearray: [
<?php imageSlideArray('http://www.ohiobuttons.org/Graphics/ShowPics/CurrentShow/', 'http://www.ohiobuttons.org/Graphics/ShowPics/CurrentShow/');?>
	],
	displaymode: {type:'auto', pause:2000, cycles:1, wraparound:false},
	persist: false, //remember last viewed slide and recall within same session?
	fadeduration: 500, //transition duration (milliseconds)
	descreveal: "none",
	togglerid: ""
})
</script>

</head>

The Body's the same as before (with the original array definition).

BTW, I made the other code replacements you suggested.

Thanks.

**Beverleyh** · 04-15-2014, 06:13 PM

The first variable path in the imageSlideArray() and the path in the include() need to be a server path rather than http ones used in HTML.

They'll look something like this;
/home/www/mywebsite.com/images/
/home/user/public_html/images/
/www/user/mywebsite.com/images/

If you're not sure, check in your web hosts control panel. There are ways to do it using $_SERVER variables in PHP but I'm on the road now so can't give examples. If you Google something like "finding server paths" you'll find more info though.

**Jim Weinberg** · 04-15-2014, 07:55 PM

Beverley.

I think I know what you're referring to. I changed the include to:

Code:

<?php include('test/Script_Files/build_array.php');?>

and the function call to:

Code:

<?php imageSlideArray('test/Graphics/ShowPics/', 'Graphics/ShowPics/');?>

.

These are the server paths relative to the invoking webpage.

If that's right, then it's something else as the page still doesn't show the slides.

If it's not right, then I'll have to call the server people tomorrow (couldn't do it today).

**jscheuer1** · 04-15-2014, 08:08 PM

If you want more help, please include a link to the page on your site that contains the problematic code so we can check it out.

**Beverleyh** · 04-15-2014, 09:02 PM

Try using full and absolute server paths while you troubleshoot - those are the ones like I posted earlier. The ones you're using are relative so they might not be resolving properly/as expected.

Also, it sounds obvious, but make sure your page ends with the .php extension and not .htm or .html (unless your server is setup to parse PHP on HTML pages). PHP can't run on a static HTML page so that could be throwing a spanner in the works before you've even started.

Failing that, yes, please post a link to your page.