INTRODUCTION TO PHP AND MySQL – WORKING WITH FILES AND DIRECTORIES – CREATING A PHOTOGALLERY
This exercise will use what you’ve learned about manipulating directories and using different file functions. This script scans a specified directory for digital photographs and dynamically generates a web page to display these images.
1. Create a new folder in your My PHP Sites folder called PhotoGallery.
2. Within this folder create a new folder called photos. On the BREO locate a zipped file PhotoGallery images.zip. Download and unzip this file, and copy the image files to your photos folder.
3. Create a new Dreamweaver site pointing to the PhotoGallery folder. You will need to add Remote Info and Testing Server information, and create a new folder on the server Photogallery to which you will publish.
4. Open a new PHP file, and enter the following code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Creating An Image Gallery</title>
<style type="text/css">
ul {
list-style-type: none;
}
li {
float: left;
padding: 10px;
margin: 10px;
font: bold 10px Verdana, sans-serif;
}
img {
display: block;
border: 1px solid #333300;
margin-bottom: 5px;
}
</style>
</head>
<body>
<h2>Creating An Image Gallery</h2>
<ul>
<?php
// define location of photo images
// this must be a location accessible by the script owner
$photosDir = './photos';
// define which file extensions are images
$photosExt = array('gif', 'jpg', 'jpeg', 'tif', 'tiff', 'bmp', 'png');
// initialize array to hold file names of images found
$photosList = array();
// read directory contents
// build photo list
if (file_exists($photosDir)) {
$dp = opendir($photosDir) or die ('Cannot open directory');
while ($file = readdir($dp)) {
if ($file != '.' & $file != '..') {
$fileData = pathinfo($file);
if (in_array($fileData['extension'], $photosExt)) {
$photosList[] = "$photosDir/$file";
}
}
}
closedir($dp);
} else {
die ('ERROR: Directory does not exist.');
}
// iterate over photo list
// display each image and file name
if (count($photosList) > 0) {
for ($x=0; $x<count($photosList); $x++) {
?>
<li>
<img height="150" width="200" src="<?php echo $photosList[$x]; ?>" />
<?php echo basename($photosList[$x]); ?<br/>
<?php echo round(filesize($photosList[$x])/1024) . ' KB'; ?>
</li>
<?php
}
} else {
die(‘No images found in directory');
}
?>
</ul>
</body>
</html>
5. Save your PHP file as gallery.php.
Note: This code begins by defining the path to the directory containing your digital images. It also sets up an array named $photosExt containing common file extensions for digital photographs. This information is useful when searching for image files in the named directory.
Having set up these two variables, the listing uses PHP’s opendir() and readdir() functions to iterate over the specified directory and process each entry in it. If an entry’s file extension is found to match an element from $photosExt, the file and path are added to a separate $photosList array.
This process continues until all the entries in the named directory are processed.
Assuming at least one image has been found, the next (and final) step is to generate the HTML code to display the images on a web page. This is accomplished by iterating over $photosList with a foreach loop and generating an <img /> tag for each file found in it, together with the image’s filename and file size in kilobytes. The image references thus created are formatted as elements of a horizontal HTML list, such that they appear neatly arranged on the final output page.
It’s quite easy to use PHP’s directory and file functions to iterate through a directory and process the files found within it.
6. Publish your file, and view the published file in a browser.
Your web page should appear as shown below:
A dynamically generated Web photo gallery
A - Introduction to PHP and MySQL - Working with Files and Directories - Creating a PhotoGallery
Page 4 of 4 Version 2