Snippets | Nomads | Projects | Applications
Nomads | Philosophy | Index
Dir_Nav | Dir_Nav Source | Dir_Nav Demo
Copy Source Code below or Download them all zipped:
Dir_Nav.zip
To Install:
- Copy/Create the directory .dir_nav - with its contents, to the root of your domain.
Otherwise you can edit paths in .index.php & .directory.php to match your installation - see comments.
- Edit .setup.php to give the Site Title, root path, and Name of your Home/Root Page.
- Copy the two files in the "each_directory" directory into any directory you want to display using this code.
Be sure you are not using an .htaccess file to block access to the directories you now want visible.
In the Master Directory ".dir_nav"
You will need to edit the .setup.php file
Dir_Nav SOURCE CODE: .setup.php Edit to match your Web-Site Needs:
<?
$SiteTitle = "Snippets Pub: File Listing" ;
$HostedRoot = "/Main/Welcome" ;
$HostedRootName = "Snippets Pub Home" ;
?>
Dir_Nav SOURCE CODE: .error.php
<?php
$status=$_SERVER['REDIRECT_STATUS'];
$codes=array(
400 => array('400 Bad Request', 'The request cannot be fulfilled due to bad syntax.'),
401 => array('401 Login Error', 'It appears that the password and/or user-name you entered was incorrect. <a href="#" onclick="window.location.reload()">Click here</a> to return to the login page.'),
403 => array('403 Forbidden', 'The server has refused to fulfill your request.'),
404 => array('404 Not Found', 'Whoops, sorry, but the document you requested was not found on this server.'),
405 => array('405 Method Not Allowed', 'The method specified in the Request-Line is not allowed for the specified resource.'),
408 => array('408 Request Timeout', 'Your browser failed to send a request in the time allowed by the server.'),
414 => array('414 URL To Long', 'The URL you entered is longer than the maximum length.'),
500 => array('500 Internal Server Error', 'The request was unsuccessful due to an unexpected condition encountered by the server.'),
502 => array('502 Bad Gateway', 'The server received an invalid response from the upstream server while trying to fulfill the request.'),
504 => array('504 Gateway Timeout', 'The upstream server failed to send a request in the time allowed by the server.'),
);
$errortitle = $codes[$status][0];
$message = $codes[$status][1];
?>
<!doctype html>
<html>
<head>
<title>That's an Error!</title>
<style>
html
{color:#333;
font-family: "Lucida Console", Courier, monospace;
font-size:14px;
background:#eeeeee;}
.content
{margin:0 auto;
width:1000px;
margin-top:20px;
padding:10px 0 10px 0;
border:1px solid #EEE;
background: none repeat scroll 0 0 white;
box-shadow: 0 5px 10px -5px rgba(0, 0, 0, 0.5);
position: relative;
}
h1
{font-size:18px;
text-align:center;}
h1.title
{color:red;}
h2
{font-size:16px;
text-align:center;}
p
{text-align:center;}
hr
{border:#fe4902 solid 1px;}
</style>
</head>
<body>
<div class="content">
<h1>Sorry, but that's an error!</h1>
<h1 class="title"><?php echo $errortitle; ?></h1>
<hr>
<p><?php echo $message;?></p>
</div>
</body>
</html>Dir_Nav SOURCE CODE: .style.css
* {
padding:0;
margin:0;
}
body {
color: #333;
font: 14px Sans-Serif;
padding: 50px;
background: #eee;
}
h1 {
text-align: center;
padding: 20px 0 12px 0;
margin: 0;
}
h2 {
font-size: 16px;
text-align: center;
padding: 0 0 12px 0;
}
#container {
box-shadow: 0 5px 10px -5px rgba(0,0,0,0.5);
position: relative;
background: white;
}
table {
background-color: #F3F3F3;
border-collapse: collapse;
width: 100%;
margin: 15px 0;
}
th {
background-color: #3A36BA;
color: #FFF;
cursor: pointer;
padding: 5px 10px;
}
th small {
font-size: 9px;
}
td, th {
text-align: left;
}
a {
text-decoration: none;
}
a:visited {
color: blue;
}
td a {
color: #663300;
display: block;
padding: 5px 10px;
}
th a {
padding-left: 0
}
td:first-of-type a {
background: url(.images/file.png) no-repeat 10px 50%;
padding-left: 35px;
}
th:first-of-type {
padding-left: 35px;
}
td:not(:first-of-type) a {
background-image: none !important;
}
tr:nth-of-type(odd) {
background-color: #E6E6E6;
}
tr:hover td {
background-color:#CACACA;
}
tr:hover td a {
color: #000;
}
/* icons for file types (icons by famfamfam) */
/* images */
table tr td:first-of-type a[href$=".jpg"],
table tr td:first-of-type a[href$=".png"],
table tr td:first-of-type a[href$=".gif"],
table tr td:first-of-type a[href$=".svg"],
table tr td:first-of-type a[href$=".jpeg"]
{background-image: url(.images/image.png);}
/* zips */
table tr td:first-of-type a[href$=".zip"]
{background-image: url(.images/zip.png);}
/* css */
table tr td:first-of-type a[href$=".css"]
{background-image: url(.images/css.png);}
/* docs */
table tr td:first-of-type a[href$=".doc"],
table tr td:first-of-type a[href$=".docx"],
table tr td:first-of-type a[href$=".ppt"],
table tr td:first-of-type a[href$=".pptx"],
table tr td:first-of-type a[href$=".pps"],
table tr td:first-of-type a[href$=".ppsx"],
table tr td:first-of-type a[href$=".xls"],
table tr td:first-of-type a[href$=".xlsx"]
{background-image: url(.images/office.png)}
/* videos */
table tr td:first-of-type a[href$=".avi"],
table tr td:first-of-type a[href$=".wmv"],
table tr td:first-of-type a[href$=".mp4"],
table tr td:first-of-type a[href$=".mov"],
table tr td:first-of-type a[href$=".m4a"]
{background-image: url(.images/video.png);}
/* audio */
table tr td:first-of-type a[href$=".mp3"],
table tr td:first-of-type a[href$=".ogg"],
table tr td:first-of-type a[href$=".aac"],
table tr td:first-of-type a[href$=".wma"]
{background-image: url(.images/audio.png);}
/* web pages */
table tr td:first-of-type a[href$=".html"],
table tr td:first-of-type a[href$=".htm"],
table tr td:first-of-type a[href$=".xml"]
{background-image: url(.images/xml.png);}
table tr td:first-of-type a[href$=".php"]
{background-image: url(.images/php.png);}
table tr td:first-of-type a[href$=".js"]
{background-image: url(.images/script.png);}
/* directories */
table tr.dir td:first-of-type a
{background-image: url(.images/folder.png);}Dir_Nav SOURCE CODE: .directory.php
<?
$dir_nav_path = "/.dir_nav/" ;
$setpath = $_SERVER['DOCUMENT_ROOT'];
$setpath .= $dir_nav_path ;
$setpath .= ".setup.php";
include_once($setpath);
?>
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<link rel="shortcut icon" href="/favicon.ico">
<title><?php echo getCurrentDirectory(); /* Returns The Current PHP Folder Name */?> Directory Contents</title>
<link rel="stylesheet" href="<?php echo $dir_nav_path; ?>.style.css">
<script src=<?php echo $dir_nav_path; ?>.sorttable.js></script>
<script>
function goBack() {
window.history.back();
}
function closeWin() {
window.close(); // Closes the new window
}
</script>
</head>
<body>
<div id="container">
<h1><? echo $SiteTitle;?></h1>
<h2>File List for the -{ <?php echo getCurrentDirectory() ; /* Returns The Current PHP File Name */?> }- Directory</h2>
<h3> <a href="<?php echo $HostedRoot; ?>"><?php echo $HostedRootName; ?></a></h3>
<h3> <a href="../"> - Up One Directory</a></h3>
<table class="sortable">
<thead>
<tr>
<th>Filename</th>
<th>Type</th>
<th>Size</th>
<th>Date Modified</th>
</tr>
</thead>
<tbody><?php
// Adds pretty filesizes
function pretty_filesize($file) {
$size=filesize($file);
if($size<1024){$size=$size." Bytes";}
elseif(($size<1048576)&&($size>1023)){$size=round($size/1024, 1)." KB";}
elseif(($size<1073741824)&&($size>1048575)){$size=round($size/1048576, 1)." MB";}
else{$size=round($size/1073741824, 1)." GB";}
return $size;
}
// Checks to see if veiwing hidden files is enabled
if($_SERVER['QUERY_STRING']=="hidden")
{$hide="";
$ahref="./";
$atext="Hide";}
else
{$hide=".";
$ahref="./?hidden";
$atext="Show";}
// Opens directory
$myDirectory=opendir(".");
// Gets each entry
while($entryName=readdir($myDirectory)) {
$dirArray[]=$entryName;
}
// Closes directory
closedir($myDirectory);
// Counts elements in array
$indexCount=count($dirArray);
// Sorts files
sort($dirArray);
// Loops through the array of files
for($index=0; $index < $indexCount; $index++) {
// Decides if hidden files should be displayed, based on query above.
if(substr("$dirArray[$index]", 0, 1)!=$hide) {
// Resets Variables
$favicon= "";
$class= "file";
// Gets File Names
$name= $dirArray[$index];
$namehref= $dirArray[$index];
// Gets Date Modified
$modtime= date("M j Y g:i A", filemtime($dirArray[$index]));
$timekey= date("YmdHis", filemtime($dirArray[$index]));
// Separates directories, and performs operations on those directories
if(is_dir($dirArray[$index]))
{
$extn="<Directory>";
$size="<Directory>";
$sizekey="0";
$class="dir";
// Gets favicon.ico, and displays it, only if it exists.
if(file_exists("$namehref/favicon.ico"))
{
$favicon=" style='background-image:url($namehref/favicon.ico);'";
$extn="<Website>";
}
// Cleans up . and .. directories
if($name=="."){$name=". (Current Directory)"; $extn="<System Dir>"; $favicon=" style='background-image:url($namehref/.favicon.ico);'";}
if($name==".."){$name=".. (Parent Directory)"; $extn="<System Dir>";}
}
// File-only operations
else{
// Gets file extension
$extn=pathinfo($dirArray[$index], PATHINFO_EXTENSION);
// Prettifies file type
switch ($extn){
case "mp3": $extn="mp3 File"; break;
case "png": $extn="PNG Image"; break;
case "jpg": $extn="JPEG Image"; break;
case "jpeg": $extn="JPEG Image"; break;
case "svg": $extn="SVG Image"; break;
case "gif": $extn="GIF Image"; break;
case "ico": $extn="Windows Icon"; break;
case "txt": $extn="Text File"; break;
case "log": $extn="Log File"; break;
case "htm": $extn="HTML File"; break;
case "html": $extn="HTML File"; break;
case "xhtml": $extn="HTML File"; break;
case "shtml": $extn="HTML File"; break;
case "php": $extn="PHP Script"; break;
case "js": $extn="Javascript File"; break;
case "css": $extn="Stylesheet"; break;
case "pdf": $extn="PDF Document"; break;
case "xls": $extn="Spreadsheet"; break;
case "xlsx": $extn="Spreadsheet"; break;
case "doc": $extn="Microsoft Word Document"; break;
case "docx": $extn="Microsoft Word Document"; break;
case "zip": $extn="ZIP Archive"; break;
case "htaccess": $extn="Apache Config File"; break;
case "exe": $extn="Windows Executable"; break;
default: if($extn!=""){$extn=strtoupper($extn)." File";} else{$extn="Unknown";} break;
}
// Gets and cleans up file size
$size=pretty_filesize($dirArray[$index]);
$sizekey=filesize($dirArray[$index]);
}
// Output
echo("
<tr class='$class'>
<td><a href='./$namehref'$favicon class='name'>$name</a></td>
<td><a href='./$namehref'>$extn</a></td>
<td sorttable_customkey='$sizekey'><a href='./$namehref'>$size</a></td>
<td sorttable_customkey='$timekey'><a href='./$namehref'>$modtime</a></td>
</tr>");
}
}
?>
</tbody>
</table>
</div>
</script>'iframe_guest.js'</script>
</body>
</html>
<?php
function getCurrentDirectory() {
$path = dirname($_SERVER['PHP_SELF']);
$position = strrpos($path,'/') + 1;
return substr($path,$position);
}
?>Dir_Nav SOURCE CODE: .sorttable.js [Adds Nifty Sorting Feature!]
/*
SortTable
version 2
7th April 2007
Stuart Langridge, http://www.kryogenix.org/code/browser/sorttable/
Instructions:
Download this file
Add <script src="sorttable.js"></script> to your HTML
Add class="sortable" to any table you'd like to make sortable
Click on the headers to sort
Thanks to many, many people for contributions and suggestions.
Licenced as X11: http://www.kryogenix.org/code/browser/licence.html
This basically means: do what you want with it.
*/
var stIsIE = /*@cc_on!@*/false;
sorttable = {
init: function() {
// quit if this function has already been called
if (arguments.callee.done) return;
// flag this function so we don't do the same thing twice
arguments.callee.done = true;
// kill the timer
if (_timer) clearInterval(_timer);
if (!document.createElement || !document.getElementsByTagName) return;
sorttable.DATE_RE = /^(\d\d?)[\/\.-](\d\d?)[\/\.-]((\d\d)?\d\d)$/;
forEach(document.getElementsByTagName('table'), function(table) {
if (table.className.search(/\bsortable\b/) != -1) {
sorttable.makeSortable(table);
}
});
},
makeSortable: function(table) {
if (table.getElementsByTagName('thead').length == 0) {
// table doesn't have a tHead. Since it should have, create one and
// put the first table row in it.
the = document.createElement('thead');
the.appendChild(table.rows[0]);
table.insertBefore(the,table.firstChild);
}
// Safari doesn't support table.tHead, sigh
if (table.tHead == null) table.tHead = table.getElementsByTagName('thead')[0];
if (table.tHead.rows.length != 1) return; // can't cope with two header rows
// Sorttable v1 put rows with a class of "sortbottom" at the bottom (as
// "total" rows, for example). This is B&R, since what you're supposed
// to do is put them in a tfoot. So, if there are sortbottom rows,
// for backwards compatibility, move them to tfoot (creating it if needed).
sortbottomrows = [];
for (var i=0; i<table.rows.length; i++) {
if (table.rows[i].className.search(/\bsortbottom\b/) != -1) {
sortbottomrows[sortbottomrows.length] = table.rows[i];
}
}
if (sortbottomrows) {
if (table.tFoot == null) {
// table doesn't have a tfoot. Create one.
tfo = document.createElement('tfoot');
table.appendChild(tfo);
}
for (var i=0; i<sortbottomrows.length; i++) {
tfo.appendChild(sortbottomrows[i]);
}
delete sortbottomrows;
}
// work through each column and calculate its type
headrow = table.tHead.rows[0].cells;
for (var i=0; i<headrow.length; i++) {
// manually override the type with a sorttable_type attribute
if (!headrow[i].className.match(/\bsorttable_nosort\b/)) { // skip this col
mtch = headrow[i].className.match(/\bsorttable_([a-z0-9]+)\b/);
if (mtch) { override = mtch[1]; }
if (mtch && typeof sorttable["sort_"+override] == 'function') {
headrow[i].sorttable_sortfunction = sorttable["sort_"+override];
} else {
headrow[i].sorttable_sortfunction = sorttable.guessType(table,i);
}
// make it clickable to sort
headrow[i].sorttable_columnindex = i;
headrow[i].sorttable_tbody = table.tBodies[0];
dean_addEvent(headrow[i],"click", function(e) {
if (this.className.search(/\bsorttable_sorted\b/) != -1) {
// if we're already sorted by this column, just
// reverse the table, which is quicker
sorttable.reverse(this.sorttable_tbody);
this.className = this.className.replace('sorttable_sorted',
'sorttable_sorted_reverse');
this.removeChild(document.getElementById('sorttable_sortfwdind'));
sortrevind = document.createElement('span');
sortrevind.id = "sorttable_sortrevind";
sortrevind.innerHTML = stIsIE ? ' <font face="webdings">5</font>' : ' ▴';
this.appendChild(sortrevind);
return;
}
if (this.className.search(/\bsorttable_sorted_reverse\b/) != -1) {
// if we're already sorted by this column in reverse, just
// re-reverse the table, which is quicker
sorttable.reverse(this.sorttable_tbody);
this.className = this.className.replace('sorttable_sorted_reverse',
'sorttable_sorted');
this.removeChild(document.getElementById('sorttable_sortrevind'));
sortfwdind = document.createElement('span');
sortfwdind.id = "sorttable_sortfwdind";
sortfwdind.innerHTML = stIsIE ? ' <font face="webdings">6</font>' : ' ▾';
this.appendChild(sortfwdind);
return;
}
// remove sorttable_sorted classes
theadrow = this.parentNode;
forEach(theadrow.childNodes, function(cell) {
if (cell.nodeType == 1) { // an element
cell.className = cell.className.replace('sorttable_sorted_reverse','');
cell.className = cell.className.replace('sorttable_sorted','');
}
});
sortfwdind = document.getElementById('sorttable_sortfwdind');
if (sortfwdind) { sortfwdind.parentNode.removeChild(sortfwdind); }
sortrevind = document.getElementById('sorttable_sortrevind');
if (sortrevind) { sortrevind.parentNode.removeChild(sortrevind); }
this.className += ' sorttable_sorted';
sortfwdind = document.createElement('span');
sortfwdind.id = "sorttable_sortfwdind";
sortfwdind.innerHTML = stIsIE ? ' <font face="webdings">6</font>' : ' ▾';
this.appendChild(sortfwdind);
// build an array to sort. This is a Schwartzian transform thing,
// i.e., we "decorate" each row with the actual sort key,
// sort based on the sort keys, and then put the rows back in order
// which is a lot faster because you only do getInnerText once per row
row_array = [];
col = this.sorttable_columnindex;
rows = this.sorttable_tbody.rows;
for (var j=0; j<rows.length; j++) {
row_array[row_array.length] = [sorttable.getInnerText(rows[j].cells[col]), rows[j]];
}
/* If you want a stable sort, uncomment the following line */
//sorttable.shaker_sort(row_array, this.sorttable_sortfunction);
/* and comment out this one */
row_array.sort(this.sorttable_sortfunction);
tb = this.sorttable_tbody;
for (var j=0; j<row_array.length; j++) {
tb.appendChild(row_array[j][1]);
}
delete row_array;
});
}
}
},
guessType: function(table, column) {
// guess the type of a column based on its first non-blank row
sortfn = sorttable.sort_alpha;
for (var i=0; i<table.tBodies[0].rows.length; i++) {
text = sorttable.getInnerText(table.tBodies[0].rows[i].cells[column]);
if (text != '') {
if (text.match(/^-?[£$¤]?[\d,.]+%?$/)) {
return sorttable.sort_numeric;
}
// check for a date: dd/mm/yyyy or dd/mm/yy
// can have / or . or - as separator
// can be mm/dd as well
possdate = text.match(sorttable.DATE_RE)
if (possdate) {
// looks like a date
first = parseInt(possdate[1]);
second = parseInt(possdate[2]);
if (first > 12) {
// definitely dd/mm
return sorttable.sort_ddmm;
} else if (second > 12) {
return sorttable.sort_mmdd;
} else {
// looks like a date, but we can't tell which, so assume
// that it's dd/mm (English imperialism!) and keep looking
sortfn = sorttable.sort_ddmm;
}
}
}
}
return sortfn;
},
getInnerText: function(node) {
// gets the text we want to use for sorting for a cell.
// strips leading and trailing whitespace.
// this is *not* a generic getInnerText function; it's special to sorttable.
// for example, you can override the cell text with a customkey attribute.
// it also gets .value for <input> fields.
hasInputs = (typeof node.getElementsByTagName == 'function') &&
node.getElementsByTagName('input').length;
if (node.getAttribute("sorttable_customkey") != null) {
return node.getAttribute("sorttable_customkey");
}
else if (typeof node.textContent != 'undefined' && !hasInputs) {
return node.textContent.replace(/^\s+|\s+$/g, '');
}
else if (typeof node.innerText != 'undefined' && !hasInputs) {
return node.innerText.replace(/^\s+|\s+$/g, '');
}
else if (typeof node.text != 'undefined' && !hasInputs) {
return node.text.replace(/^\s+|\s+$/g, '');
}
else {
switch (node.nodeType) {
case 3:
if (node.nodeName.toLowerCase() == 'input') {
return node.value.replace(/^\s+|\s+$/g, '');
}
case 4:
return node.nodeValue.replace(/^\s+|\s+$/g, '');
break;
case 1:
case 11:
var innerText = '';
for (var i = 0; i < node.childNodes.length; i++) {
innerText += sorttable.getInnerText(node.childNodes[i]);
}
return innerText.replace(/^\s+|\s+$/g, '');
break;
default:
return '';
}
}
},
reverse: function(tbody) {
// reverse the rows in a tbody
newrows = [];
for (var i=0; i<tbody.rows.length; i++) {
newrows[newrows.length] = tbody.rows[i];
}
for (var i=newrows.length-1; i>=0; i--) {
tbody.appendChild(newrows[i]);
}
delete newrows;
},
/* sort functions
each sort function takes two parameters, a and b
you are comparing a[0] and b[0] */
sort_numeric: function(a,b) {
aa = parseFloat(a[0].replace(/[^0-9.-]/g,''));
if (isNaN(aa)) aa = 0;
bb = parseFloat(b[0].replace(/[^0-9.-]/g,''));
if (isNaN(bb)) bb = 0;
return aa-bb;
},
sort_alpha: function(a,b) {
if (a[0].toLowerCase()==b[0].toLowerCase()) return 0;
if (a[0].toLowerCase()<b[0].toLowerCase()) return -1;
return 1;
},
sort_ddmm: function(a,b) {
mtch = a[0].match(sorttable.DATE_RE);
y = mtch[3]; m = mtch[2]; d = mtch[1];
if (m.length == 1) m = '0'+m;
if (d.length == 1) d = '0'+d;
dt1 = y+m+d;
mtch = b[0].match(sorttable.DATE_RE);
y = mtch[3]; m = mtch[2]; d = mtch[1];
if (m.length == 1) m = '0'+m;
if (d.length == 1) d = '0'+d;
dt2 = y+m+d;
if (dt1==dt2) return 0;
if (dt1<dt2) return -1;
return 1;
},
sort_mmdd: function(a,b) {
mtch = a[0].match(sorttable.DATE_RE);
y = mtch[3]; d = mtch[2]; m = mtch[1];
if (m.length == 1) m = '0'+m;
if (d.length == 1) d = '0'+d;
dt1 = y+m+d;
mtch = b[0].match(sorttable.DATE_RE);
y = mtch[3]; d = mtch[2]; m = mtch[1];
if (m.length == 1) m = '0'+m;
if (d.length == 1) d = '0'+d;
dt2 = y+m+d;
if (dt1==dt2) return 0;
if (dt1<dt2) return -1;
return 1;
},
shaker_sort: function(list, comp_func) {
// A stable sort function to allow multi-level sorting of data
// see: http://en.wikipedia.org/wiki/Cocktail_sort
// thanks to Joseph Nahmias
var b = 0;
var t = list.length - 1;
var swap = true;
while(swap) {
swap = false;
for(var i = b; i < t; ++i) {
if ( comp_func(list[i], list[i+1]) > 0 ) {
var q = list[i]; list[i] = list[i+1]; list[i+1] = q;
swap = true;
}
} // for
t--;
if (!swap) break;
for(var i = t; i > b; --i) {
if ( comp_func(list[i], list[i-1]) < 0 ) {
var q = list[i]; list[i] = list[i-1]; list[i-1] = q;
swap = true;
}
} // for
b++;
} // while(swap)
}
}
/* ******************************************************************
Supporting functions: bundled here to avoid depending on a library
****************************************************************** */
// Dean Edwards/Matthias Miller/John Resig
/* for Mozilla/Opera9 */
if (document.addEventListener) {
document.addEventListener("DOMContentLoaded", sorttable.init, false);
}
/* for Internet Explorer */
/*@cc_on @*/
/*@if (@_win32)
document.write("<script id=__ie_onload defer src=javascript:void(0)><\/script>");
var script = document.getElementById("__ie_onload");
script.onreadystatechange = function() {
if (this.readyState == "complete") {
sorttable.init(); // call the onload handler
}
};
/*@end @*/
/* for Safari */
if (/WebKit/i.test(navigator.userAgent)) { // sniff
var _timer = setInterval(function() {
if (/loaded|complete/.test(document.readyState)) {
sorttable.init(); // call the onload handler
}
}, 10);
}
/* for other browsers */
window.onload = sorttable.init;
// written by Dean Edwards, 2005
// with input from Tino Zijdel, Matthias Miller, Diego Perini
// http://dean.edwards.name/weblog/2005/10/add-event/
function dean_addEvent(element, type, handler) {
if (element.addEventListener) {
element.addEventListener(type, handler, false);
} else {
// assign each event handler a unique ID
if (!handler.$$guid) handler.$$guid = dean_addEvent.guid++;
// create a hash table of event types for the element
if (!element.events) element.events = {};
// create a hash table of event handlers for each element/event pair
var handlers = element.events[type];
if (!handlers) {
handlers = element.events[type] = {};
// store the existing event handler (if there is one)
if (element["on" + type]) {
handlers[0] = element["on" + type];
}
}
// store the event handler in the hash table
handlers[handler.$$guid] = handler;
// assign a global event handler to do all the work
element["on" + type] = handleEvent;
}
};
// a counter used to create unique IDs
dean_addEvent.guid = 1;
function removeEvent(element, type, handler) {
if (element.removeEventListener) {
element.removeEventListener(type, handler, false);
} else {
// delete the event handler from the hash table
if (element.events && element.events[type]) {
delete element.events[type][handler.$$guid];
}
}
};
function handleEvent(event) {
var returnValue = true;
// grab the event object (IE uses a global event object)
event = event || fixEvent(((this.ownerDocument || this.document || this).parentWindow || window).event);
// get a reference to the hash table of event handlers
var handlers = this.events[event.type];
// execute each event handler
for (var i in handlers) {
this.$$handleEvent = handlers[i];
if (this.$$handleEvent(event) === false) {
returnValue = false;
}
}
return returnValue;
};
function fixEvent(event) {
// add W3C standard event methods
event.preventDefault = fixEvent.preventDefault;
event.stopPropagation = fixEvent.stopPropagation;
return event;
};
fixEvent.preventDefault = function() {
this.returnValue = false;
};
fixEvent.stopPropagation = function() {
this.cancelBubble = true;
}
// Dean's forEach: http://dean.edwards.name/base/forEach.js
/*
forEach, version 1.0
Copyright 2006, Dean Edwards
License: http://www.opensource.org/licenses/mit-license.php
*/
// array-like enumeration
if (!Array.forEach) { // mozilla already supports this
Array.forEach = function(array, block, context) {
for (var i = 0; i < array.length; i++) {
block.call(context, array[i], i, array);
}
};
}
// generic enumeration
Function.prototype.forEach = function(object, block, context) {
for (var key in object) {
if (typeof this.prototype[key] == "undefined") {
block.call(context, object[key], key, object);
}
}
};
// character enumeration
String.forEach = function(string, block, context) {
Array.forEach(string.split(""), function(chr, index) {
block.call(context, chr, index, string);
});
};
// globally resolve forEach enumeration
var forEach = function(object, block, context) {
if (object) {
var resolve = Object; // default
if (object instanceof Function) {
// functions have a "length" property
resolve = Function;
} else if (object.forEach instanceof Function) {
// the object implements a custom forEach method so use that
object.forEach(block, context);
return;
} else if (typeof object == "string") {
// the object is a string
resolve = String;
} else if (typeof object.length == "number") {
// the object is array-like
resolve = Array;
}
resolve.forEach(object, block, context);
}
};
Finally for decoration you might like to have images to go with file types.
You will add a directory inside of .dir_nav called .images
Download this file and unzip the images into your .images directory.
.images.zip
In Each Searchable Directory you need:
(If you already have an .htaccess file in the directory you will need to merge this code with that file:)
Dir_Nav SOURCE CODE: .htaccess
ErrorDocument 400 /.dir_nav/.error.php
ErrorDocument 401 /.dir_nav/.error.php
ErrorDocument 403 /.dir_nav/.error.php
ErrorDocument 404 /.dir_nav/.error.php
ErrorDocument 405 /.dir_nav/.error.php
ErrorDocument 408 /.dir_nav/.error.php
ErrorDocument 414 /.dir_nav/.error.php
ErrorDocument 500 /.dir_nav/.error.php
ErrorDocument 502 /.dir_nav/.error.php
ErrorDocument 504 /.dir_nav/.error.php
DirectoryIndex index.htm index.html index.shtml index.php default.php .index.phpDir_Nav SOURCE CODE: .index.php
<?php
$dir_nav_path = "/.dir_nav/" ;
$path = $_SERVER['DOCUMENT_ROOT'];
$path .= $dir_nav_path ;
$path .= ".directory.php";
include_once($path);
?>