ファイルビューアー（ファイラー）

filerObj = new Object();
filerObj.basepath = "http://www.openspc2.org/~openspc/shuwa/chapter21/sample1/";
filerObj.path = "/";
filerObj.history = [];
filerObj.getFilelist = function() {
var url = "filelist.cgi?path="+filerObj.path+"&cache="+(new Date()).getTime();
new Ajax.Request(url, { method: "get", onComplete:filerObj.viewFile });
}
filerObj.viewFile = function(httpObj) {
var LF = String.fromCharCode(10);
var list = httpObj.responseText.split(LF);
var txt = "";
if (filerObj.history.length > 0) { // ヒストリーが1以上ある場合の処理
txt += "<img src='images/up.gif'>";
txt +="<a href='javascript:filerObj.back()'>1つ上のディレクトリへ移動</a><br>";
}
list.pop();
for (var i=0; i<3; i++) list.shift(); // 余計な情報を削除
filerObj.getPath(); // 現在のパスを求める
for (i =0; i<list.length; i++) { // ファイル/ディレクトリの数だけ処理
var fileInfo = list[i].split(" ");
var filename = fileInfo[fileInfo.length-1];
if (fileInfo[0].charAt(0) == "d") {
txt += "<img src='images/dir.gif'>";
txt += "<a href=javascript:filerObj.changeDir('"+filename+"')>"+filename+"</a><br>";
}else{
txt += "<img src='images/file.gif'>";
txt += "<a href='"+filerObj.basepath+filerObj.path+filename+"' target='content'>"+filename+"</a><br>";
}
}
$("result").innerHTML = txt;
}
// ディレクトリ変更処理
filerObj.changeDir = function(dPath) {
if (dPath) filerObj.history.push(dPath);
filerObj.getPath();
$("filePath").innerHTML = filerObj.path;
filerObj.getFilelist();
}
// ヒストリー処理（History Back)
filerObj.back = function() {
if (filerObj.history.length > 0) {
filerObj.history.pop();
filerObj.changeDir();
}
}
// パスを連結して返す
filerObj.getPath = function() {
filerObj.path = "/";
for (var i=0; i<filerObj.history.length; i++) {
filerObj.path += filerObj.history[i]+"/";
}
}
window.onload = filerObj.getFilelist;

・サンプルを実行
・サンプルをダウンロード

　説明などは本書を参考にしてください。JavaScript以外のソースはデータをダウンロードするか本書を参照してください。