Hacking jQueryFileTree to display specified file extensions

Up until now, I’ve used the linux utility ‘tree’ to display the contents of a directory and it’s contents.

Yesterday, I decided to make it prettier.


The hunt began for a utility that displayed file system contents in a tree view. I stumbled across a few, but the one that I picked, mainly because of it’s ease was jQuery File Tree.

A couple hours playing around I had it playing nicely with Twitter Bootstrap site, but one thing that it didn’t do was to only display specific file types, so here is my quick and dirty hack to make it work.


I used the PHP connector jqueryFileTree.php and did a few things:

I added a new variable:

Updated the if statement for files to check for the file types:

Then added a new function to do the check:

All up it turned it into this:

Quite happy with the results!

Feel free to comment on improvements, as I’m a n00b to PHP and programming in general!