Part 2
Intro
This is the 2nd part in a two-part blog where I present a simple example of a JavaScript folder browser. In Part 1 I provided all the JavaScript required. By itself it may have seemed an academic exercise, but once you appreciate that it isn’t hard to write a program which creates the JavaScript objects from your server’s directory structure, well, now you have something that’s pretty powerful and useful.
The details
I considered writing this in Python, which seems to be a more current language, but old habits die hard as they say. I just know Perl too well to suffer the pain of learning all those neat tricks all over again in another language. Maybe someday I’ll re-write it in Python.
Notice the recursion through the directories? I first used that 17 years ago! Why throw out good code?
Here is the code, which I named scan.pl:
#!/usr/bin/perl # DrJ - 7/2012 # scan picture-containing directories using recursion and build javascript objects from them use Getopt::Std; getopts('d:j:'); $homedir = $opt_d; $jsfile = $opt_j; usage() if ! $opt_d || ! $opt_j; $DEBUG = 0; print "Homedir: $homedir, jsfile: $jsfile\n"; open(JS,">$jsfile") || die "Cannot open JavaScript file: $jsfile!!\n"; $date = `date +%D`; ($homedirnoslash) = $homedir =~ /^\/(.+)/; # assumes leading "/" # print opening of function print JS qq#function init() { // Generated data from scan.pl - DrJ $date folder['browse'] = {path:'',depth:0,kids:['$homedirnoslash']}; #; # get things going with our recursive function traverse($homedir,0); # closing statement print JS qq(}\n); # close of init JavaScript function close(JS); sub traverse { my ($dir,$depth) = @_; my @kids = (); print "Traverse. dir: $dir\n" if $DEBUG; opendir(DIR, $dir) || die "Cannot open dir $dir!!\n"; foreach (readdir(DIR)) { next if $_ eq '.' || $_ eq '..'; print "Traverse. file: $_\n" if $DEBUG; $path = "$dir/$_"; if (-d $path) { # a directory # we want only the last part of the path (my $lastpath) = $path =~ /([^\/]+)$/; push(@kids,$lastpath); traverse($path,$depth + 1); # recurse! } elsif ($_=~/$filespec/) { # } } # end loop over files in this directory # write out the JS objects print JS qq(folder["$dir"] = {path:"$dir",depth:$depth,kids:[); my $i = 0; # kids are in jumbled order. Do regular sort on them. foreach (sort @kids) { $comma = $i++ > 0 ? "," : ""; print JS qq($comma"$_"); } # end of object. close it out. print JS qq(]};\n); } # end sub traverse # sub usage { print "usage: $0 -d root_directory -j JavaScript_output_file\n"; exit(1); } |
It’s pretty self-explanatory. Call it like this example:
> ./scan.pl -d /homepic -j init.js
and it produces an init.js file filled with an init() function and all the necessary folder objects, assuming the top-level folder to browse is /homepic.
My init.js looks like this:
function init() { // Generated data from scan.pl - DrJ 07/27/12 folder['browse'] = {path:'',depth:0,kids:['homepic']}; folder["/homepic/pictures_chronological/2011_06"] = {path:"/homepic/pictures_chronological/2011_06",depth:2,kids:[]}; // lots more lines like this omitted folder["/homepic"] = {path:"/homepic",depth:0,kids:["kodak_pictures","pictures_chronological"]}; } |
And I tested it in browse13.html, which looks just like browse12.html, except I got rid of the init() function and added an include line at the top:
<html> <head> <script type="text/javascript" src="init.js"></script> ... |
I am a little concerned about performance. This clearly isn’t designed to scale to tens of thousands of directories, but will it be sufficiently fast for my purposes? My init.js is 213 lines and about 25 KB in size. browse13.html which calls it loads fast and runs fast. So, yes, success!
Part 1, A Simple Javascript Folder Browser
Conclusion
We have created a fairly powerful and general-purpose folder browser out of fairly simple usage of JavaScript and Perl. It makes an ideal base upon which to build further.
One reply on “A simple Perl script to build JavaScript folder objects”
[…] Dr John's Tech Talk Technical Discussion of Internet Infrastructure Skip to content HomeSample Page ← The IT Detective Agency: Two of our sites got cut off! A simple Perl script to build JavaScript folder objects → […]