Ben Nadel
On User Experience (UX) Design, JavaScript, ColdFusion, Node.js, Life, and Love.
I am the chief technical officer at InVision App, Inc - a prototyping and collaboration platform for designers, built by designers. I also rock out in JavaScript and ColdFusion 24x7.
Meanwhile on Twitter
Loading latest tweet...
Ben Nadel at CFUNITED 2010 (Landsdown, VA) with: Mike Collins

Ask Ben: Creating An Archive Folder / File List (Part II)

By Ben Nadel on

A while back, I was asked how to make a simple ColdFusion page that would allow the viewing of archive folders and their contents. At the time, the page was designed to handle a single list of directories and then a single list of sub-files. I have been asked to update that code to allow for sub-directories and sub-sub-directories (you get the point).

Below is the updated code that allows for a single page to point to a directory and drill down through all the sub directories. All files are linked directly. All sub folders get viewed via the URL.folder variable that keeps getting passed back to the same ColdFusion script.

I am not taking into account the different slashes on different platforms. For this demo, the backward slash is considered a "server" slash for a server path and the forward slash is considered a "web" slash for web-based paths (ie. URLs).

  • <!--- Kill extra output. --->
  • <cfsilent>
  •  
  • <!---
  • This is the name of the archive folder for which we
  • want to list out the archive documents and sub folders.
  • --->
  • <cfparam
  • name="URL.folder"
  • type="string"
  • default=""
  • />
  •  
  • <!--- Decode the folder value. --->
  • <cfset URL.folder = UrlDecode( URL.folder ) />
  •  
  • <!---
  • For security reasons, we want to get rid of any suspect
  • values in the folder variable. These include "../"
  • which would go to a parent directory or "/" which will
  • go to the root perhaps.
  • --->
  • <cfset URL.folder = URL.folder.ReplaceAll(
  • "(\.\.[\\/])+", ""
  • ).ReplaceAll(
  • "([\\/]){2,}", "$1"
  • ) />
  •  
  • <!---
  • Set the directory path of the root archive
  • directory (this one). This is the folder in which
  • you want to allow users to browse archive folders
  • and files.
  • --->
  • <cfset strRoot = ExpandPath( "./" ) />
  •  
  •  
  • <!---
  • Check to see if we have an archive folder selected.
  • If we do, then we want to query that one. If not,
  • then we want to get the list of all the archive folders.
  • Furthermore, if we have an archive folder, just
  • check to make sure the folder exists.
  • --->
  • <cfif (
  • Len( URL.folder ) AND
  • DirectoryExists( strRoot & "\" & URL.folder )
  • )>
  •  
  • <!--- Set the query path to be the archive folder. --->
  • <cfset strQueryPath = (strRoot & "\" & URL.folder) />
  •  
  • <!---
  • Add the trailing slash to the folder for use with
  • further linking. Going foward, we can assume the
  • the folder variable will have this trailing slash.
  • --->
  • <cfset URL.folder = (URL.folder & "\") />
  •  
  • <cfelse>
  •  
  • <!---
  • We have no archive folder selected (or it did not
  • exist). Query the root directory.
  • --->
  • <cfset strQueryPath = strRoot />
  •  
  • <!---
  • Reset the folder variable so we don't get confused
  • later on.
  • --->
  • <cfset URL.folder = "" />
  •  
  • </cfif>
  •  
  •  
  • <!---
  • Query for the files / folders in the selected
  • directory (might be root OR an archive folder).
  • --->
  • <cfdirectory
  • action="LIST"
  • directory="#strQueryPath#"
  • recurse="false"
  • name="qDirectoryList"
  • />
  •  
  • </cfsilent>
  •  
  • <cfoutput>
  • <html>
  • <head>
  • <title>Document Archive</title>
  • </head>
  • <body>
  •  
  • <h1>
  • Document Archive
  • </h1>
  •  
  • <!---
  • Check to see if we are deeper than the root directory.
  • We will know that we are if our folder variable has
  • some value in it. If it does, we will provide tools
  • to jump up a single directory or to go back to the
  • archivee root.
  • --->
  • <cfif Len( URL.folder )>
  •  
  • <h2>
  • #URL.folder#
  • </h2>
  •  
  • <p>
  • &laquo; <a href="#CGI.script_name#">Back to Archive Root</a>
  • </p>
  •  
  •  
  • <!---
  • When outputting the parent directory path, be sure
  • to strip out the last directory and traililng slash
  • from the existing folder path.
  • --->
  • <p>
  • &laquo; <a href="#CGI.script_name#?folder=#UrlEncodedFormat( URL.folder.ReplaceAll( "[\\/]?[^\\/]+[\\/]?$", "" ) )#">Back to Parent Directory</a>
  • </p>
  •  
  • <hr />
  •  
  • </cfif>
  •  
  •  
  • <!---
  • Loop over directory list. This may contain both files
  • and folders. If we come across a folder or sub
  • directory, then we will provide a link to view that
  • directory (through the archive viewer). If we come
  • across a file, we will link directly to that file.
  • --->
  • <cfloop query="qDirectoryList">
  •  
  • <!---
  • Check to see if we are dealing with a sub folder.
  • --->
  • <cfif (qDirectoryList.Type EQ "Dir")>
  •  
  • <!---
  • We are dealing with a directory. Add this folder
  • name to the folder path we are sending back
  • in the URL. Since we are dealing with a server
  • path at this point, replace any "Web" slashes
  • with "server" slashes... / -to- \.
  • --->
  • <p>
  • <a href="#CGI.script_name#?folder=#UrlEncodedFormat( URL.folder.ReplaceAll( "/", "\\" ) & qDirectoryList.name )#">#qDirectoryList.name#</a> &raquo;
  • </p>
  •  
  • <cfelse>
  •  
  • <!---
  • We are dealing with a file. Output the link
  • to the file from the root directory (since
  • that is where we still are from the browser's).
  • standpoint. Include the name of the sub folder
  • in the path. Since we are dealing with a web
  • path, replace all "server" slashes with "web"
  • slashes... \ -to- /.
  • --->
  • <p>
  • <a href="./#URL.folder.ReplaceAll( "\\", "/" )##qDirectoryList.name#">#qDirectoryList.name#</a>
  • </p>
  •  
  • </cfif>
  •  
  • </cfloop>
  •  
  • </body>
  • </html>
  • </cfoutput>

Hope that helps.




Reader Comments

Post A Comment

You — Get Out Of My Dreams, Get Into My Comments
Live in the Now
Oops!
Comment Etiquette: Please do not post spam. Please keep the comments on-topic. Please do not post unrelated questions or large chunks of code. And, above all, please be nice to each other - we're trying to have a good conversation here.