images/directory listing script

**djr33** · 10-18-2006, 07:11 AM

I could write this myself, but it would take a while.

Is there an existing script to check a directory for inner directories and images and display links to them?

GD scaled thumbnail preview would be awesome, but probably more than I could hope to find.

**tech_support** · 10-18-2006, 07:20 AM

http://www.phpxplorer.org/phpXplorer/webIndex.php

**djr33** · 10-18-2006, 07:39 AM

Very interesting and thanks.
However, that's more than I need.
I just want images and directories, with, perhaps an image preview. But not something that complex.

I might be able to use it if I don't find an alternate.

**Strangeplant** · 10-18-2006, 12:33 PM

Code:

<?php
/* ================================================================
== Directory Contents Listing of Compressed Raw Lidar Data Files ==
== DirSelect.php                                                 ==
== Lists only WinRAR files - line 60                  ==
== Install as /webmail/apache/htdocs/noaa/wc/LidarArk/index.php  ==
== Uses /webmail/apache/htdocs/noaa/wc/LidarArk/lib/style.css    ==
== Tom Legbandt 08/15/06                                         ==
=================================================================*/
function _begin_ahtml()
{
  ?>
  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
  <html>
  <head>
    <META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
    <link rel="STYLESHEET" type="text/css" href="lib/style.css">
    <title>Raw Lidar Data Archive</title>
  </head>
  <body>
  <?
}
function _page_atop()
{
  ?>
  <div style="text-align: center; color: rgb(102, 102, 102);"><b>
  <span style="font-size: 20pt; font-family: Microsoft Sans Serif; color: #808000;">WEATHER CENTER RAW LIDAR DATA ARCHIVE</span><br>
  <span style="font-size: 16pt; font-family: Trebuchet MS; color: gray;">The City College of New York</span><br>
  <span style="font-size: 10pt; font-family: Trebuchet MS; color: #808000;">138th Street &amp; Convent Avenue, New York, NY 10031<br><br></span></b>
  </div> 
<?
}
function _end_ahtml()
{
  ?>
  <p align="center">For additional files you may need that are not listed, contact <a href="mailto: weatherman@ee.ccny.cuny.edu">weatherman</a></p>
  </body>
  </html>
  <?
}

include_once("inc/auth.inc.php");
$user = _check_auth($_COOKIE);
$myFile = "/webmail/apache/htdocs/noaa/wc/Logs/DataAccess.log";
$fh = fopen($myFile, 'a') or die('cannot open file');
$stringData = date("Y/m/d H:i:s")." ".$user['user_name']." ".$_SERVER['REMOTE_ADDR']." ".$_SERVER['SCRIPT_FILENAME']."\n";
fwrite($fh, $stringData);
fclose($fh);
$dir = ".";
$directories = array();
$files = array();
$dir = (substr($dir, -1) == '/') ? substr($dir, 0, -1) : $dir;
if(is_dir($dir)){
    if($handle = opendir($dir)){
        while(false !== ($file = readdir($handle))){
            if($file != "." && $file != ".."){
                if(is_dir($dir.'/'.$file)){
                    $directories[$file] = filemtime($dir.'/'.$file);
                } else {
                    if(strpos($file, '.rar') !== false) $files[$file] = filemtime($dir.'/'.$file);
                }
            }
        }
        closedir($handle);
    } else {
        die('Could not open directory.');
    }
} else {
    die('Invalid directory.');
}

if($_GET['sort'] == 'alpha'){
    if($_GET['mode'] == 'desc'){
        krsort($files);
        $highlight = 'alpha_desc';
    } else {
        ksort($files);
        $highlight = 'alpha_asc';
    }
} else {
    if($_GET['mode'] == 'asc'){
        asort($files, SORT_NUMERIC);
        $highlight = 'date_asc';
    } else {
        arsort($files, SORT_NUMERIC);
        $highlight = 'date_desc';
    }
}
$sort_alpha_asc = ($highlight == 'alpha_asc') ? '<b>Asc</b>' : '<a href="?sort=alpha&mode=asc">Asc</a>';
$sort_alpha_desc = ($highlight == 'alpha_desc') ? '<b>Desc</b>' : '<a href="?sort=alpha&mode=desc">Desc</a>';
$sort_date_asc = ($highlight == 'date_asc') ? '<b>Asc</b>' : '<a href="?sort=date&mode=asc">Asc</a>';
$sort_date_desc = ($highlight == 'date_desc') ? '<b>Desc</b>' : '<a href="?sort=date&mode=desc">Desc</a>';
  _begin_ahtml();
  _page_atop();
echo "<center><p>Sort by: Date- $sort_date_asc | $sort_date_desc; Name- $sort_alpha_asc | $sort_alpha_desc</p></center>\n";

echo "<center><table border=\"0\">\n<tr><td><u>File</u></td><td width=\"25\"></td><td><u>Size</u></td><td width=\"25\"></td><td><u>Last Modified</u></td></tr>\n";
foreach($files as $file => $timestamp){
    echo "<tr><td><a href=\"$dir/$file\">$file</a></td><td></td><td>";
    $filesize = filesize($dir.'/'.$file);
    if($filesize >= 1048576){
        echo round($filesize / 1048576, 1).'MB';
    } else {
        echo round($filesize / 1024, 1).'kb';
    }
    echo '</td><td></td><td>'.date('M d Y H:i:s', $timestamp)."</td></tr>\n";
}
echo '</table></center>';
  _end_ahtml();
?>

You can take out this block of code for my password login and user tracking and put in your own controls, if any:

Code:

include_once("inc/auth.inc.php");
$user = _check_auth($_COOKIE);
$myFile = "/webmail/apache/htdocs/noaa/wc/Logs/DataAccess.log";
$fh = fopen($myFile, 'a') or die('cannot open file');
$stringData = date("Y/m/d H:i:s")." ".$user['user_name']." ".$_SERVER['REMOTE_ADDR']." ".$_SERVER['SCRIPT_FILENAME']."\n";
fwrite($fh, $stringData);
fclose($fh);

Once you have the file names and links, you can do anything you want with them. Change the file type(s) you want to list/display at line 60.

**Twey** · 10-18-2006, 07:47 PM

Woah Nelly

Here's a lighter-weight solution to the same problem (not that anything is wrong with yours, Strangeplant):

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Directory Listing</title>
    <style type="text/css">
      ul.dirlist, ul.dirlist li {
        list-style-type: none;
        padding-left: 1em;
      }
    </style>
  </head>
  <body>
    <?php
      $cwd = $_SERVER['REQUEST_URI'];
      $cwd = substr($cwd, 0, strrpos($cwd, '/' + 1));

      function paintUndersideOfFox($c) {
        echo('<ul class="dirlist">');
        $d = opendir($c);
        while($f = readdir($d)) {
          if(strpos($f, '.') === 0) continue;
          $ff = $c . '/' . $f;
          echo('<li><a href="' . $cwd . $ff . '">' . $ff . '</a></li>');
          if(is_dir($ff)) paintUndersideOfFox($ff);
        }
        echo('</ul>');
      }

      paintUndersideOfFox('.');
    ?>
  </body>
</html>

**djr33** · 10-18-2006, 10:29 PM

Thanks, Twey.
And thanks Strangeplant. I'm sure your solution is fine too... less text is just easier. But thanks for all the wok

Twey, I love your odd function names.

I'll use this now...

The more I look at it, Strangeplant's solution does offer quite a few more features, like filesize, filetype, etc.
Interesting.

**Strangeplant** · 10-19-2006, 01:04 PM

And sorting.....

**djr33** · 10-19-2006, 01:45 PM

I just did some modifications to the script (Twey's).

Strangeplant, the main thing that didn't work about your script was that it didn't include subdirectories. Twey's did that, so I could base what I did off of his.

So... here's what I ended up with.

I'd consider submitting to DD, assuming Twey is ok with it (I'd assume so, since he just wrote it up for this, from the looks of it.) Let me know what you think.

Not promising the code isn't messy... but it works.

This is the displaying page:

PHP Code:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
  <head>
    <title>Image Browser</title>
    <style type="text/css">
      ul.dirlist, ul.dirlist li {
        list-style-type: none;
        padding-left: 20;
      }
      a {
          color: #0000FF;
      }
    </style>
  </head>
  <body bgcolor="#000000" text="#0000FF">
    <?php
      $page = substr($_SERVER['SCRIPT_NAME'],(strrpos($_SERVER['SCRIPT_NAME'],"/")+1));
      function checkDir($c,$skipimages=0) {
        echo('<ul class="dirlist">');
        $d = opendir($c);
        while($f = readdir($d)) {
          if(strpos($f, '.') === 0) continue;
          $ff = $c . '/' . $f;
          if (strpos(strtolower($f), '.jpg') !== FALSE && $skipimages != 1) {
              $fff = '<img src="thumbnail.php?image='.urlencode($ff).'" border="">';
              echo('<a href="' . $ff . '">' . $fff . '</a>'."\n");
            }
          if(is_dir($ff)) {
              $ffdisp = $ff;
            if (substr($ff,0,2) == "./") $ffdisp = substr($ffdisp,2);
              echo '<li><a href="'.$page.'?'.urlencode($ffdisp).'"'.">$ffdisp</a></li>\n";
            global $dir;
            if ($ff == $dir) $skipimages = 0;
            else $skipimages = 1;
            checkDir($ff,$skipimages);
            }
        }
        echo("</ul>");
      }

    $uri = explode("?",$_SERVER['REQUEST_URI'],2);
    $dir = urldecode($uri[1]);
    if(is_dir($dir)) {
        checkDir($dir);
        if(strpos($dir,"/") !== FALSE) {
            $updir = "?".substr($dir,0,strrpos($dir,"/"));
            echo '<a href="'.$page.$updir.'">^up^</a><br>'."\n";
            }
        echo '<a href="'.$page.'">Images Main</a>'."\n";
        }
    else checkDir(".");
    ?>
  </body>
</html>

thumbnail.php (required)

PHP Code:


<?php
// The file
if ($_GET['image'] == "") die('Image Does Not Exist');
$filename = urldecode($_GET['image']);

// Set a maximum height and width
$width = 200;
$height = 200;


// Get new dimensions
list($width_orig, $height_orig) = getimagesize($filename);

$ratio_orig = $width_orig/$height_orig;

if ($width/$height > $ratio_orig) {
   $width = $height*$ratio_orig;
} else {
   $height = $width/$ratio_orig;
}

// Resample
$image_p = imagecreatetruecolor($width, $height);
$image = imagecreatefromjpeg($filename);
imagecopyresampled($image_p, $image, 0, 0, 0, 0, $width, $height, $width_orig, $height_orig);


// Content type
header('Content-type: image/jpeg');
// Output
imagejpeg($image_p, null, 30);

?>

thumbnail.php is just cut and paste from php.net's page on the imagecopyresampled() filter, plus changes in the top couple lines to include the get functions. I also moved the header down, 'cause that made sense.

The CSS/layout is customized to my site, but it's clean and shouldn't look too bad for others.

Test page:
http://ci-pro.com/truthandlies/images/
(This is for my current movie project. It has a bunch of images, mostly in the lowest level folders, but some in the middle ones. The script would work fine if they were in the top level, etc. as well.)

Problems:
1. There's a slight lag, especially with a lot of images. The GD rendering of the thumbnails is obviously server intensive. It isn't all that much slower, though, than loading the images would be anyway, and certainly not as slow as if the full size images were included with small height/width attributes and the whole image had to load.
2. I would like to display the number of images in a directory that isn't selected. This isn't crucial, but seems like the nice little piece that's missing. I did this, but it was a problem because I did it backwards.... the number was only available after the line with the link had been output.
3. It only works with JPGs. Not too hard to fix, but that's all I needed. That can be updated soon.

4. Just found an error. Images in a folder with subdirectories don't display. I'll figure this out tomorrow. For now, sleep. (It worked earlier. Something must be in conflict now.)

**Twey** · 10-19-2006, 07:36 PM

1. There's a slight lag, especially with a lot of images. The GD rendering of the thumbnails is obviously server intensive. It isn't all that much slower, though, than loading the images would be anyway, and certainly not as slow as if the full size images were included with small height/width attributes and the whole image had to load.

Render them once and store them to a file. Much more efficient.

**djr33** · 10-19-2006, 09:52 PM

Yeah, that's possible.

But I'm not looking to create a static image gallery.
I want this to be versatile and expand with new images added (or deleted).

Also, just realized a major design flaw... the directories are full, in the way that it's structed now.... it displays the full path as the link to the subdirectory.
I'm going to change that so that it is nice and just displays the last subdirectory, for easier navigation. I knew something was wrong with the layout.

Thread: images/directory listing script

Thread Tools

Search Thread

images/directory listing script

Bookmarks

Bookmarks

Posting Permissions