JS Array Not Passing through Function

[JNerd]

I am coding a site for a friend who wants an image slideshow on her homepage. I've written a function that requests an array and that should pull in the images at timed intervals. Here is a snippet of the default.js code.

var nImg = 0;

function slideShow(arr)
{
	// This changes the image
	var fullPath = document.getElementById('img').src;
	var lastnum = fullPath.lastIndexOf("/") + 1;
	var parentFolder = fullPath.slice(0, lastnum);
	var newImg = parentFolder + arr[nImg];
	document.getElementById('img').src = newImg;

	// This tests to see if it should loop back to the first image
	if (nImg == arr.length - 1)
	{ nImg = 0; }
	else
	{ nImg = nImg + 1; }
 
	var reset = setTimeout("slideShow(" + arr + ")", 6000);
}

Here is the snippet from the homepage that should call the function:

<script type="text/javascript" runat="server">
	var arrHome = new Array("dress1.jpg", "dress2.jpg", "dress3.jpg", "dress4.jpg", "dress5.jpg", "dress6.jpg", "dress7.jpg");
	slideShow(arrHome);
</script>

However, the array will not pass through the function. If I create an array within default.js, it works fine. The problem lies with trying to pass in an array from the HTML. Granted, I could just work in the JS and not worry about the HTML. However, there are two problems:

1. Once I've finished coding this site, I want my friend to manage it herself. I do NOT want her touching the JS.
2. I would like to be able to use this script on several pages, using different arrays.

An alternate solution I've thought of is using JS to browse the contents of a directory and use any and all images located in that folder. I know I did this with PHP once; is there a similar code in JS?

Any help you could give me would be greatly appreciated.

[rnd me]

var reset = setTimeout(function(){slideShow( arr )}, 6000);

[JNerd]

Such a simple solution! Thanks so very much!

[mrhoo]

If your source file paths are identical except for the number, and they are sequential, just replace the image number with the next.

function slideShow(min, max){
    var fullpath= document.getElementById('img').src, newImg;
    
    if(typeof min== 'number'){
        slideshow.min= min;
        slideshow.max= max;
        slideshow.count= min-1;
    }
    if(++slideshow.count> slideshow.max) slideshow.count= slideshow.min;
    newImg= fullpath.replace(/\d+\.jpg/, slideshow.count+'.jpg';
    document.getElementById('img').src= newImg;
    slideshow.reset= setTimeout(slideShow, 6000);
}
window.onload= function(){
    slideShow(1, 7);
}

You would only need to handle an array if they were not named as sequential strings, or had different paths.

function slideShow(arr){
    var fullpath= document.getElementById('img').src, newImg;
    fullpath= fullpath.substring(0, fullpath.lastIndexOf('/')+1);  
    // if they are in the same folder -otherwise, pass and set the whole path from the array
    if(arr.constructor== Array){
        slideshow.pics= arr;
        slideshow.count= -1;
    }
    if(++slideshow.count== slideshow.pics.length) slideshow.count= 0;
    newImg= fullpath+slideshow.pics[slideshow.count];
    document.getElementById('img').src= newImg;
    slideshow.reset= setTimeout(slideShow, 6000);
}
window.onload= function(){
    slideShow(["aline.jpg", "mini.jpg", "maxi.jpg", "sheath.jpg", "sari.jpg", "wedding.jpg", "lilblack.jpg"]);

//It's good to be able to pause and restart a slideshow:

    document.getElementById('img').onclick= function(){
        if(slideshow.reset){
            clearTimeout(slideshow.reset);
            delete slideshow.reset;
        }
        else slideShow();
    }
}