Member Avatar for okparrothead

Hello gang,
Here I am with another Newbie question.

I'm creating a photo gallery for my Web site.

Right now I use a series of links to create the gallery:

<a href="./images/gallery/photo1.php"><img src="./images/gallery/thumbs/tn_photo1.php"></a>
<a href="./images/gallery/photo2.php"><img src="./images/gallery/thumbs/tn_photo2.php"></a>
<a href="./images/gallery/photo3.php"><img src="./images/gallery/thumbs/tn_photo3.php"></a>

My Linux host will already make the thumbnails from images I upload, and I've styled the links so they appear the way I want them to and it works fine.

I would like to be able to generate these links using a php script instead of having to make the above by hand. I'd like it to read the filenames in the gallery folder and create the links.

I looked at the oepndir command, but I don't know how I can make it create a link. I'm just plain confused.

Thanks for anyhelp you can give me.

Peace

  • 2 Contributors
  • 2 Replies
  • 136 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by okparrothead
Member Avatar for digital-ether

Hi,

What you want to do is:

Open a directory handle and read each element in the directory.
When you read a directory, it returns all the elements in the directory.
Some of these are files, and some folders and it will also return two "virtual" folders "." and "..".

When you read a directory element usign readdir(/* opendir handle */) it will return the element name, such as the file name, or the directory name.

What you need is to get the file name, and create a link with it.

Example:

Here's an example page that should do what you want. In the example all files in the subdirectory "imgs" will be read and displayed by the php script.

/<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Show Images in Folder (simple gallery)</title>

<style type="text/css">

.img { 
	border: 1px solid #ccc;
	float: left;
	text-align: center;
	padding: 2px;
}

.img_label {
	border-bottom: 1px dotted #eee;
	display: block;
}

.sep {
	clear: both;
}

</style>

</head>

<body>

<?php

/**
* Read files in a directory
* @author digital-ether at fijiwebdesign.com
*
* @param string directory path
*/
function read_dir_elements($dir_path, $func) {
	if ($dh = opendir($dir_path)) {

		while ($el = readdir($dh)) {
			$path = $dir_path.'/'.$el;
	
			if (is_file($path)) {
				// execute callback function with the file path ($el) as a parameter
				call_user_func($func, $el);
			}

		}   
            
	   closedir($dh);

	} else {
		return false;
	}

	return true;
}

// example usage

$dir_path = 'imgs/';
$web_path = 'imgs/';

echo '<div class="gallery">';
read_dir_elements($dir_path, 'make_gallery_link');
echo '<div class="sep"></div>';
echo '</div>';

echo 'some more content';

// write the gallery link given the filename
function make_gallery_link($filename) {
	global $web_path;
	
	$img_name = preg_replace("/\.([^\.]*)$/", '', $filename);
	
	echo '<div class="img">';
	echo '<img src="'.$web_path.$filename.'" border="0" />';
	echo '<span class="img_label"><a href="'.$web_path.$filename.'">'.$img_name.'</a></span>';
	echo '</div>';
}

?>

</body>
</html>

Explanation:

The function below reads through all the files in a directory:

/**
* Read files in a directory
* @author digital-ether at fijiwebdesign.com
*
* @param string directory path
*/
function read_dir_elements($dir_path, $func) {
	if ($dh = opendir($dir_path)) {

		while ($el = readdir($dh)) {
			$path = $dir_path.'/'.$el;
	
			if (is_file($path)) {
				// execute callback function with the file path ($el) as a parameter
				call_user_func($func, $el);
			}

		}   
            
	   closedir($dh);

	} else {
		return false;
	}

	return true;
}

The bit of code:

if (is_file($path)) {
				// execute callback function with the file path ($el) as a parameter
				call_user_func($func, $el);
			}

checks if the element just read is a file. If it is, it then calls a callback function that you defined in read_dir_elements($dir_path, $func) as the second parameter.

I've created the function "make_gallery_link()" so that it can be called each time a file is read in the directory:

// write the gallery link given the filename
function make_gallery_link($filename) {
	global $web_path;
	
	$img_name = preg_replace("/\.([^\.]*)$/", '', $filename);
	
	echo '<div class="img">';
	echo '<img src="'.$web_path.$filename.'" border="0" />';
	echo '<span class="img_label"><a href="'.$web_path.$filename.'">'.$img_name.'</a></span>';
	echo '</div>';
}

This function outputs an image in the directory in the format:

<div class="img">
   <img src="imgs/icon_exclaim.gif" border="0" />
      <span class="img_label">
         <a href="imgs/icon_exclaim.gif">icon_exclaim</a>
      </span>
</div>

Note: I've just done this so that it is easy to style with CSS. It makes your php coding simpler also as you do not have to worry about the structure of the html output.

The main this is just that readdir($dh) returns a string, which is the name of the file or subdirectory in the directory being read. This string is then used to create the url and src to the img file.

Hope that helps.

;)

commented: Very Helpful +1
Member Avatar for okparrothead

digital-ether,

I've tried to create a script like this on more than one occasion, but no joy. Your instructions have finally gotten through my clumsy mind.

Thank you SO much.

Peace

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.