tags:

views:

383

answers:

3
+2  Q: 

dynamic image gallery

Hey all, my first post :D

Problem:

I'm trying to make a template gallery, not a slide show, which i can easily reuse on multiple sites.
Mostly for quick folio sites, where the owner wont know how to update the code to add pictures.

It needs to read all of the image files from a selected directory. (jpg, gif, png, bmp) It needs to be able to update content without any code changes. (dynamic load from folder) It needs to write out img tags to the viewed page. (using JavaScript for customization/css?)

The set of img tags output from the php/JavaScript need to be thumbnails which when clicked will link to the full def pictures, this can probably be handled with JavaScript when making the links initially.

Progress:

I found a php script that will read the files from a folder and save the urls to an array for use in JavaScript. However the code used to display the picture is done as a single block slide show, where as i need it to post all images separately not just replace the src of the same image.

Example:

root/index.htm - pastebin[.]com/m52568ed5
root/images/getimages.php - pastebin[.]com/f5395a572
root/images/pic01.png
root/images/pic03.jpg
root/images/asdfs.gif

So how do i get JavaScript to loop through the galleryarray[curimg] and write out my links?

I got this far, and got stuck.

function rotateimages(){
 // document.getElementById("slideshow").setAttribute("src", "res/gallery/painting/"+galleryarray[curimg])
 // curimg=(curimg<galleryarray.length-1)? curimg+1 : 0
 for (curimg=1;curimg!=0;curimg++;) {
 document.write("<div><img class='gallery' src='" + galleryarray[curimg] + "' /></div>")
 }
}

Thanks in advance, Braden.

EDIT: heres my sandbox to show whats going on

-EDIT: removed link

No matter how i change the output per item for example if i replace the whole section with a simple echo all i ever get is the following:

<!DOCTYPE html>
<html>
    <head>
        <title>My Gallery</title>
    </head>

    <body>
        <div id="gallery"></div>
    </body>
</html>

Seems like it gets stuck when it tries to run the 'foreach()'

Heres the current php:

<?php

function getDirTree($dir,$p=true) {
    $d = dir($dir);$x=array();
    while (false !== ($r = $d->read())) {
        if($r!="."&&$r!=".."&&(($p==false&&is_dir($dir.$r))||$p==true)) {
                $x[$r] = (is_dir($dir.$r)?array():(is_file($dir.$r)?true:false));
        }
    }

    foreach ($x as $key => $value) {
        if (is_dir($dir.$key."/")) {
                $x[$key] = getDirTree($dir.$key."/",$p);
        }
    }

    ksort($x);
    return $x;
}

$tree = getDirTree("./res/gallery/");

echo '<div id="gallery">';

foreach($tree as $element => $eval) {
    if (is_array($eval)) {

        foreach($eval as $file => $value) {
                if (strstr($file, "jpg")) {
                        $file = 'res/gallery/'.$element.'/'.$file;
                        echo 'test'; //test//echo '<a href="'.$file.'">test</a>'; //test// <img class="gallery" src="'.$file.'" alt="'.$file.'"/></a>';
                }
        }


    }
}
echo '</div>';

considering as i have Never done php before i started this, i think im doing ok.

A: 

You can use PHP to write out the img tags.

Also, your for loop will run infinitely, because it has an end condition which is always true.

EDIT: Looking at your pastebin, it looks like you've misunderstood how PHP works. <script src="res/getimages.php"></script> will not work, as script tags are read on the client side. PHP is run on the server side. To run res/getimages.php, you'll have to do something like:

<?php //This is a PHP opening tag; anything after this is PHP code
include('res/getimage.php'); //Imports the PHP file into index.php
?> <!--this is the closing PHP tag - anything after this is HTML -->

I would highly recommend working through a quick tutorial, such as the W3Schools PHP Tutorial, which will really help you through this. Same for JavaScript. You can keep asking questions about how this all works, but you'll never really understand it, and won't be able to work out how to put all the bits together. Just give it a few hours!

Skilldrick  2009-12-13 10:54:47
ok cool, but i dont know the php to do that :) mind helping me out?and yes i know it runs indefinitly, how do i stop it was one of my questions.
Brae  2009-12-13 10:56:49
btw, holy hell that was a quick reply.
Brae  2009-12-13 10:57:37
So why did you tag the question PHP ?
pavium  2009-12-13 11:00:19
cuz like skilldrick said, you can code the img tags with php, i just dont know how to do that.
Brae  2009-12-13 11:01:17
"Looking at your pastebin, it looks like you've misunderstood how PHP works."thats cuz i dont know php, i got this script from a different site, however when uploaded and used with the origional slideshow code, it works perfectly.
Brae  2009-12-13 11:03:40
I meant, if you don't know PHP, why did you tag it that way? A PHP solution isn't going to help without a good deal of hand-holding.
pavium  2009-12-13 11:05:30
what do you mean? it says 'post a question' and it involves php, did i do something wrong?
Brae  2009-12-13 11:14:29
I'm not trying to put you off, Braden, but StackOverflow is meant to be a site where programmers help each other to get their code right. When a question appears which gives the impression no work has been done, but 'plz send teh codez' it causes resentment. On the other hand, *your* question provided a *lot* more background information than a typical first question, but please remember this is supposed to be a collaborative effort. Show us what *you* have done and we might be able to suggest improvements.
pavium  2009-12-13 11:32:06
ye i understand, ill be going through those php tuts soon as i get php running on my comp, so i dont have to upload every-single-tedious-change.
Brae  2009-12-13 11:41:43
+1  A: 

Very simple auto gallery script, photos.php:

<?php
function getDirTree($dir,$p=true) {
    $d = dir($dir);$x=array();
    while (false !== ($r = $d->read())) {
     if($r!="."&&$r!=".."&&(($p==false&&is_dir($dir.$r))||$p==true)) {
      $x[$r] = (is_dir($dir.$r)?array():(is_file($dir.$r)?true:false));
     }
    }

    foreach ($x as $key => $value) {
     if (is_dir($dir.$key."/")) {
      $x[$key] = getDirTree($dir.$key."/",$p);
     }
    }

    ksort($x);
    return $x;
}

$tree = getDirTree("./foto/");

echo '<div id="gallery">';
echo '<ul class="linone">';
foreach($tree as $element => $eval) {
    if (is_array($eval)) {
     echo '<li><h4>'.$element.'</h4>';
     echo '<ul class="linone photos">';
     foreach($eval as $file => $value) {
      if (strstr($file, "jpg")) {
       $file = 'foto/'.$element.'/'.$file;
       echo '<li><a href="'.$file.'"><img src="'.$thumb.'" alt="'.$thumb.'"/></a></li>';
      }
     }
     echo '</ul>';
     echo '</li>';
    }
}
echo '</ul>';
echo '</div>';

Also I use the lightbox jQuery plugin to make this gallery comfortable to view.

And also managing photos for this page is very-very simple - you just need to upload .jpg files to your photos directory ('/foto/', for this example).

index.php:

<!DOCTYPE html>
<html>
    <head>
     <title>My Gallery</title>
    </head>

    <body>
     <?php require_once('photos.php') ?>
    </body>
</html>

This file will include photos.php file and runs it, output of photos.php script will come between tags.

Sergey Kuznetsov  2009-12-13 11:04:09
looks interesting ill give it a crack and post results.
Brae  2009-12-13 11:05:35
i changed the directory, and uploaded but its not working :Sheres my current htm file that loads the php - http://pastebin.com/f4fce85e
Brae  2009-12-13 11:13:35
You can't include PHP file with <script> tag (with <script> tags you can include JS files), I show you an index.php file (without <head> and other tags). Ok you can make as I show you in edited answer, wait a minute.
Sergey Kuznetsov  2009-12-13 11:18:07
your codes missing the ed "?>" even so, i tryed it and notihng happend, no pictures came up, no errors, nothing.
Brae  2009-12-13 11:26:42
Yes, of course. If yours script file is full of PHP code you need to write "<?php" in the start of file and "?>" in the end of it (but this is not necessary, but about this rule know advanced PHP coders :)). But if you write a mix of HTML and PHP code you need to start PHP parts with "<?php" and end it with "?>" tags.
Sergey Kuznetsov  2009-12-13 11:28:58
i see i see, ok im going to put up a test page to show whats happening, hold tight
Brae  2009-12-13 11:32:41
thanks for all the help, i got it working :D - http://pastebin.com/f67c6b50
Brae  2009-12-15 10:53:16
A: 

Thanks to everyone who helped out, a huge thanks to Sergey Kunetsov for his gallery script which after slight modification worked perfectly.

and for anyone who wants it, heres the final working php.

http://pastebin.com/f442f31f3

the folder that get displayed is the $path.

Enjoy, and thanks again.

Brae  2009-12-14 19:00:30

related questions

IDE suggestions: Eclipse IDE vs. Zend Studio ( confused )
MySQL/Apache Error in PHP MySQL query
Lightweight IDE for Linux
What PHP framework would you choose for a new application and why?
Why is my ternary expression not working?
How can I get at the matches when using preg_replace in PHP?
Mechanisms for tracking DB schema changes
Wordpress theme development offline tools
Using object property as default for method property
How can I get the authenticated user name under Apache using plain HTTP authentication and PHP?
Make XAMPP/Apache serve file outside of htdocs
How do you debug PHP scripts?
PHP Variables passed by value or by reference?
Best way to implement unit testing in PHP
Connect PHP to an AS/400
Best way to access Exchange using PHP?
PHP Session Security
How do I access a remote form in php?
What's the best way to generate a tag cloud from an array? (using h1 through h6 for sizing)
Apache/PHP: error_log per Virtual Host?
How do I track file downloads with apache/PHP
How would you access Object properties from within an object method?
Flat File Databases in PHP
Best way to allow plugins for a PHP application
Latest information on PHP upcoming releases