21 Apr 2008

Image Rotator 1.0

I was working on the TCE Website today and the white space between the "nav bar" and the "contact us" section was looking empty.

I thought it would be nice if visitors could have a random image each time they loaded a page, this would require a nice little PHP script I wrote called Image Rotator.

The way this works is thus, firstly you setup a directory containing a pool of images, then you give them the same filename with a key after it. For example image0.png, image1.png, image2.png ... The script then displays one of those images at random whenever it is executed.

Now for the source


// Image Rotator 1.0
// James Januszka 2008
// http://jims-tech.blogspot.com

// Variables
$dir="images"; // Directory containing images
$files = scandir($dir);
$string = "sidepic"; // Prefix of each image
$extention ="jpg"; // Image Filetype
$alt = "Closeup of Food"; // Alt text for the image
$width = 180; // Width of image in pixels
$height = 250; // Height of image in pixels

foreach ($files as $file) // Loop through each file in the directory
{

if ($file=ereg($string, $file)) // Regular expression to see if the filename contains $string
{
$j =$j+1;

}

}
$count = $j -1; // Ugly Hack; the rand() function generates a number between 0 and $count

srand(time());
$random = (rand()%$count);
$image="$dir/$string$random.$extention"; // Generates a path to the image(directory+prefix+random+extention)
echo("*img src='$image' alt='$alt' width=$width height=$height*"); //Displays image ;) (*I had to remove the
angle brackets from this line so blogger would display it!)


It may look complicated at first, but its really simple. At the top of the code I define the variables used in the script, most of these are do to with the rendering of HTML code that displays the images. Next it scans through the image directory and builds an array containing the images, finally it displays an image at random.

One of the cool things about the script is this routine;

foreach ($files as $file) // Loop through each file in the directory
{

if ($file=ereg($string, $file)) // Regular expression to see if the filename contains $string
{
$j =$j+1;

}

}

It scans through the directory and uses a regular expression to find and count how many files are prefixed with $string, ignoring all other files in the directory, it needs to know how many pictures there are for the pseudo-random generator to work.

The final part of this script, shown below, generates a pseudo-random number and uses that to pick and display an image.

srand(time());
$random = (rand()%$count);
$image="$dir/$string$random.$extention"; // Generates a path to the image(directory+prefix+random+extention)
echo("*img src='$image' alt='$alt' width=$width height=$height*"); //Displays image ;) (*I had to remove the
angle brackets from this line so blogger would display it!)

Well thats the script, you are free to use it as you will, and you can make any changes that you desire, just as long as you credit me.

No comments:

Post a Comment