Insert Images by Directory

[Risket]

Does anyone know of a way to automatically insert images from a directory?

Basically I wanted to display a gallery of images but instead of manually adding all the HTML code to display a thumbnail and a link to open the full view in another tab/window, I wanted to see if I could insert a script that would look at a target directory and generate the code for every image it finds in the directory.

I'm posting this in here because I don't know if this could be done with a PHP script or a JavaScript or another script.

Thanks!

[blue-eye-labs]

In terms of PHP you can do this as follows:

function scanDirectory($path, $recursive=false, $conditions=array()) {
        $exts = array();
        $noms = array();
        
        if(is_array($conditions)) {
            foreach($conditions as $condition => $value) {
                if($condition == "name") {
                    $array =& $noms;
                } elseif($condition == "extension") {
                    $array =& $exts;
                }
                $vals = explode(",", $value);
                foreach($vals as $v) {
                    array_push($array, $v);
                }
            }
        }
        
        $files = array();
        if($handle = opendir($path)){
            while(false !== ($file = readdir($handle))) {
                if($file != "." && $file != "..") {
                    if(is_dir($path . "/" . $file)) {
                        if($recursive == true) {
                            $ftmp = scanDirectory($path . "/" . $file . "/", $recursive, $conditions);
                            if(is_array($ftmp)) {
                                $files = array_merge($files, $ftmp);
                            }
                        }
                    } else {
                        $ext_match = (count($exts)>0) ? false : true;
                        $nom_match = (count($noms)>0) ? false : true;
                        
                        if($ext_match == false) {
                            foreach($exts as $ex) {
                                if(substr_count(pathinfo($path . "/" . $file, PATHINFO_EXTENSION), $ex)>0) {
                                    $ext_match = true;
                                }
                            }
                        }
                        if($nom_match == false) {
                            foreach($noms as $n) {
                                if(substr_count($file, $n) > 0) {
                                    $nom_match = true;
                                }
                            }
                        }
                        
                        if($nom_match == true && $ext_match == true) {
                            array_push($files, $path . "/" . $file);
                        }
                    }
                }
            }
             closedir($handle);
        } else {
            $files = false;
        }
        return $files;
    } 

(This is adapted from a class I wrote to deal with the Filesystem but it should work as I've presented it).

If you need an explanation of the code then ask me. Essentially it iterates through all the files in a directory (and can recursively scan directories) and it adds them to an array if they match the criteria (which are optional).

Exempli gratia:

$files = scanDirectory("/path/to/my/files/", true, "extension:jpg");
foreach($files as $file) {
    echo "<a href='$file' title='an image'><img src='$file' alt='image' /></a>";
} 

[Risket]

Thank you very much for the help!

I wanted to keep the script really small and I had a hard time when inserting that into a page. The page I needed it on is generated by a template I used when setting up this web site for my wife and her mothers store. I was having a hard time including this script in the page.

I decided to keep it really simple and I just decided to use a mass file-renamer to give all the images a similar name with incrementing numbers following. I then used the following JavaScript loop to display them:

<script type="text/javascript">
   var i=0;
   for (i=0;i<=23;i=i+1)
     {
     document.write("<div class='gal'><a href='images/store/store" + i + ".jpg' target='new'>")
     document.write("<img src='images/store/store" + i + ".jpg' width='150'>")
     document.write("</a></div>")
     }
</script>

I then applied a class to the "gal" DIV. It looked sloppy with some images taller than other so I set a fixed size for the images as well as the DIV and made the overflow hidden.

Here is the store gallery page to see the outcome of this method I used:
http://www.sniffanyandcompany.com/in...age=page&id=29

[blue-eye-labs]

It's a PHP function so you would need to insert it between <?php ?> tags.
Your approach has worked, of course, but you'll still have to update the script every time new images are added and you'll have to keep your renaming convention.
What do you mean you had trouble inserting it?

[Risket]

I was changing the directory in places I didn't need to. I realized I only needed to change it in the second piece of code.

I got it working on a test page. Unfortunately when I insert the code into the PHP generated page on our web site it does not show the code.

[Risket]

Never mind, I got it working! Thank you very much for the script!

The store template we're using is made by Zen-Cart so I had to dig around for a fix to enable PHP script on "ezpages" (which are generated in the administrator area). I applied the fix and the script works perfectly.

If you'd like to check out how it looks:
http://www.sniffanyandcompany.com/in...f170f7416f2a1e

It looks about the same as the JavaScript I used but, of course, it's much better since I won't have to rename images or update the loop count every time.

Again thank you very much for this script!

[blue-eye-labs]

Glad to have helped.