Falconix
04-30-2003, 09:44 PM
I'm putting together a bit of code, using Javascript/DHTML, that displays a file system stored in an array. The problem is, well... it's not working... you'll see what I mean. And thanks to Dave Clark who solved my earlier problem, while working on the same code. :) Here's the code right now:
<html>
<head>
<title>Files</title>
<style type="text/css">
<!--
body {padding: 8px; background-color: #FFB65D; font-family: Verdana, Arial; font-size: 13px; margin-left: 15px; margin-right: 15px;}
a.fscp:link {color: #004A85; text-decoration: underline; font-weight: bold;}
a.fscp:active {color: #004A85; text-decoration: underline; font-weight: bold;}
a.fscp:visited {color: #004A85; text-decoration: underline; font-weight: bold;}
a.fscp:hover {color: #4F02D5; text-decoration: underline; font-weight: bold;}
table.mainTbl {background-color: F4B710; border-width: 1px; border-color: #000000; border-style: solid; padding-left: 3px; padding-right: 0px; padding-top: 2px; padding-bottom: 2px; padding-left: 20px; width: 100%;}
table.dirTbl {border-width: 1px; border-right-width: 0px; border-color: #000000; border-style: solid; margin-top: 2px; margin-bottom: 2px; padding-left: 20px; padding-top: 2px; padding-bottom: 2px; width: 100%;}
-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
var filesystem = new Array(1);
filesystem[0] = "ROOT";
filesystem[1] = new Array(1);
filesystem[1][0] = "DFG";
filesystem[1][1] = "DFGtest.html";
filesystem[1][2] = "DFGtest2.html";
filesystem[1][3] = "DFGtest3.html";
filesystem[1][4] = "DFGtest4.html";
filesystem[1][5] = "DFGtest5.html";
filesystem[1][6] = "WholeSiteGIF.gif";
filesystem[1][7] = "banner.gif";
filesystem[1][8] = "bottombar.gif";
filesystem[1][9] = "greenbar.gif";
filesystem[1][10] = "indexWEB.html";
filesystem[1][11] = "indexWEB2.html";
filesystem[1][12] = "leftbar.gif";
filesystem[1][13] = "rightbar.gif";
filesystem[1][14] = "smallbar.gif";
filesystem[2] = new Array(1);
filesystem[2][0] = "Design";
filesystem[2][1] = "banner.gif";
filesystem[2][2] = "designTest.html";
filesystem[2][3] = "go.gif";
filesystem[2][4] = "go2.gif";
filesystem[2][5] = "listArrow.gif";
filesystem[2][6] = "sideBanner1.jpg";
filesystem[2][7] = "sideBanner2.jpg";
filesystem[2][8] = "sideBanner3.jpg";
filesystem[2][9] = "sideBanner4.jpg";
filesystem[3] = new Array(1);
filesystem[3][0] = "Includes";
filesystem[3][1] = "LowerFormat1.inc";
filesystem[3][2] = "LowerFormat2.inc";
filesystem[3][3] = "UpperFormat1.inc";
filesystem[3][4] = "UpperFormat2.inc";
filesystem[3][5] = "WS_FTP.LOG";
filesystem[3][6] = "cookies.php";
filesystem[3][7] = "database.php";
filesystem[3][8] = "variables.inc";
filesystem[4] = new Array(1);
filesystem[4][0] = "FAKE";
filesystem[4][1] = new Array(1);
filesystem[4][1][0] = "FAKE2";
filesystem[4][1][1] = "FILE";
filesystem[4][1][2] = "FILE2";
filesystem[4][2] = "HAHAHA";
filesystem[4][3] = "HAHAHA2";
filesystem[5] = "ImageCounterLog.txt";
filesystem[6] = "PHPopenfiles.php";
filesystem[7] = "PHPreaddir.php";
filesystem[8] = "affiliate.php";
filesystem[9] = "base64.php";
filesystem[10] = "cheats.php";
filesystem[11] = "forums.php";
filesystem[12] = "guides.php";
filesystem[13] = "index.php";
filesystem[14] = "jukebox.php";
filesystem[15] = "layout.html";
filesystem[16] = "links.php";
filesystem[17] = "movies.php";
filesystem[18] = "music.php";
filesystem[19] = "phptest.php";
filesystem[20] = "reviews.php";
filesystem[21] = "rpg.php";
filesystem[22] = "screenshots.php";
filesystem[23] = "siteinfo.php";
filesystem[24] = "specs.php";
filesystem[25] = "sql_info.php";
filesystem[26] = "test.php";
function onClickDir(path)
{
var addedHTML = "";
newSect = document.getElementById(path);
var dirToShow = eval("filesystem["+(path.split("/").join("]["))+"]");
for (var i=1; i<dirToShow.length; i++)
{
if((typeof dirToShow[i]) == "object")
{
addedHTML += "<tr><td><table class=\"dirTbl\" cellpadding=\"0\" cellspacing=\"0\"><tr><td><tr><td><a href=\"javascript:onClickDir(\'" + path + "/" + i + "\');\" class=\"fscp\">" + dirToShow[i][0] + "</a></td></tr><span id=\"" + path + "/" + i + "\"></span></table></td></tr>";
}
else
{
addedHTML += "<tr><td>" + dirToShow[i] + "</td></tr>";
}
}
newSect.innerHTML = addedHTML;
}
function makeMain()
{
var MainHTML = "<table class=\"mainTbl\" cellpadding=\"0\" cellspacing=\"0\"><tr><td>" + filesystem[0] + "</td></tr>";
for(var i=1; i<filesystem.length; i++)
{
if((typeof filesystem[i]) == "object")
{
MainHTML += "<tr><td><table class=\"dirTbl\" cellpadding=\"0\" cellspacing=\"0\"><tr><td><a href=\"javascript:onClickDir(\'" + i + "\');\" class=\"fscp\">" + filesystem[i][0] + "</a></td></tr><span id=\"" + i + "\"></span></table></td></tr>";
}
else
{
MainHTML += "<tr><td>" + filesystem[i] + "</td></tr>";
}
}
MainHTML += "</table>";
return MainHTML;
}
-->
</script>
</head>
<body>
<h1>Filesystem:</h1>
<span id="main"></span>
<br />
<form name="form1">
<textarea name="text1" cols="40" rows="8"></textarea>
</form>
<script language="Javascript" type="text/javascript">
<!--
MainSect = document.getElementById("main");
MainSect.innerHTML = makeMain();
document.form1.text1.value = makeMain();
-->
</script>
</body>
</html>
The script seems to be fine, but when I click on the directory links, nothing shows up. Here's the page:
www.cgplatinum.com/Design/JStest.html
It's sort of a big problem, so any help I got would be nice. :D Basically, the problem lies within the onClickDir(path) function. The rest was working before I added that. And the textbox is used for debugging and stuff like that.
And, just for the record, all the files are fake.
<html>
<head>
<title>Files</title>
<style type="text/css">
<!--
body {padding: 8px; background-color: #FFB65D; font-family: Verdana, Arial; font-size: 13px; margin-left: 15px; margin-right: 15px;}
a.fscp:link {color: #004A85; text-decoration: underline; font-weight: bold;}
a.fscp:active {color: #004A85; text-decoration: underline; font-weight: bold;}
a.fscp:visited {color: #004A85; text-decoration: underline; font-weight: bold;}
a.fscp:hover {color: #4F02D5; text-decoration: underline; font-weight: bold;}
table.mainTbl {background-color: F4B710; border-width: 1px; border-color: #000000; border-style: solid; padding-left: 3px; padding-right: 0px; padding-top: 2px; padding-bottom: 2px; padding-left: 20px; width: 100%;}
table.dirTbl {border-width: 1px; border-right-width: 0px; border-color: #000000; border-style: solid; margin-top: 2px; margin-bottom: 2px; padding-left: 20px; padding-top: 2px; padding-bottom: 2px; width: 100%;}
-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
var filesystem = new Array(1);
filesystem[0] = "ROOT";
filesystem[1] = new Array(1);
filesystem[1][0] = "DFG";
filesystem[1][1] = "DFGtest.html";
filesystem[1][2] = "DFGtest2.html";
filesystem[1][3] = "DFGtest3.html";
filesystem[1][4] = "DFGtest4.html";
filesystem[1][5] = "DFGtest5.html";
filesystem[1][6] = "WholeSiteGIF.gif";
filesystem[1][7] = "banner.gif";
filesystem[1][8] = "bottombar.gif";
filesystem[1][9] = "greenbar.gif";
filesystem[1][10] = "indexWEB.html";
filesystem[1][11] = "indexWEB2.html";
filesystem[1][12] = "leftbar.gif";
filesystem[1][13] = "rightbar.gif";
filesystem[1][14] = "smallbar.gif";
filesystem[2] = new Array(1);
filesystem[2][0] = "Design";
filesystem[2][1] = "banner.gif";
filesystem[2][2] = "designTest.html";
filesystem[2][3] = "go.gif";
filesystem[2][4] = "go2.gif";
filesystem[2][5] = "listArrow.gif";
filesystem[2][6] = "sideBanner1.jpg";
filesystem[2][7] = "sideBanner2.jpg";
filesystem[2][8] = "sideBanner3.jpg";
filesystem[2][9] = "sideBanner4.jpg";
filesystem[3] = new Array(1);
filesystem[3][0] = "Includes";
filesystem[3][1] = "LowerFormat1.inc";
filesystem[3][2] = "LowerFormat2.inc";
filesystem[3][3] = "UpperFormat1.inc";
filesystem[3][4] = "UpperFormat2.inc";
filesystem[3][5] = "WS_FTP.LOG";
filesystem[3][6] = "cookies.php";
filesystem[3][7] = "database.php";
filesystem[3][8] = "variables.inc";
filesystem[4] = new Array(1);
filesystem[4][0] = "FAKE";
filesystem[4][1] = new Array(1);
filesystem[4][1][0] = "FAKE2";
filesystem[4][1][1] = "FILE";
filesystem[4][1][2] = "FILE2";
filesystem[4][2] = "HAHAHA";
filesystem[4][3] = "HAHAHA2";
filesystem[5] = "ImageCounterLog.txt";
filesystem[6] = "PHPopenfiles.php";
filesystem[7] = "PHPreaddir.php";
filesystem[8] = "affiliate.php";
filesystem[9] = "base64.php";
filesystem[10] = "cheats.php";
filesystem[11] = "forums.php";
filesystem[12] = "guides.php";
filesystem[13] = "index.php";
filesystem[14] = "jukebox.php";
filesystem[15] = "layout.html";
filesystem[16] = "links.php";
filesystem[17] = "movies.php";
filesystem[18] = "music.php";
filesystem[19] = "phptest.php";
filesystem[20] = "reviews.php";
filesystem[21] = "rpg.php";
filesystem[22] = "screenshots.php";
filesystem[23] = "siteinfo.php";
filesystem[24] = "specs.php";
filesystem[25] = "sql_info.php";
filesystem[26] = "test.php";
function onClickDir(path)
{
var addedHTML = "";
newSect = document.getElementById(path);
var dirToShow = eval("filesystem["+(path.split("/").join("]["))+"]");
for (var i=1; i<dirToShow.length; i++)
{
if((typeof dirToShow[i]) == "object")
{
addedHTML += "<tr><td><table class=\"dirTbl\" cellpadding=\"0\" cellspacing=\"0\"><tr><td><tr><td><a href=\"javascript:onClickDir(\'" + path + "/" + i + "\');\" class=\"fscp\">" + dirToShow[i][0] + "</a></td></tr><span id=\"" + path + "/" + i + "\"></span></table></td></tr>";
}
else
{
addedHTML += "<tr><td>" + dirToShow[i] + "</td></tr>";
}
}
newSect.innerHTML = addedHTML;
}
function makeMain()
{
var MainHTML = "<table class=\"mainTbl\" cellpadding=\"0\" cellspacing=\"0\"><tr><td>" + filesystem[0] + "</td></tr>";
for(var i=1; i<filesystem.length; i++)
{
if((typeof filesystem[i]) == "object")
{
MainHTML += "<tr><td><table class=\"dirTbl\" cellpadding=\"0\" cellspacing=\"0\"><tr><td><a href=\"javascript:onClickDir(\'" + i + "\');\" class=\"fscp\">" + filesystem[i][0] + "</a></td></tr><span id=\"" + i + "\"></span></table></td></tr>";
}
else
{
MainHTML += "<tr><td>" + filesystem[i] + "</td></tr>";
}
}
MainHTML += "</table>";
return MainHTML;
}
-->
</script>
</head>
<body>
<h1>Filesystem:</h1>
<span id="main"></span>
<br />
<form name="form1">
<textarea name="text1" cols="40" rows="8"></textarea>
</form>
<script language="Javascript" type="text/javascript">
<!--
MainSect = document.getElementById("main");
MainSect.innerHTML = makeMain();
document.form1.text1.value = makeMain();
-->
</script>
</body>
</html>
The script seems to be fine, but when I click on the directory links, nothing shows up. Here's the page:
www.cgplatinum.com/Design/JStest.html
It's sort of a big problem, so any help I got would be nice. :D Basically, the problem lies within the onClickDir(path) function. The rest was working before I added that. And the textbox is used for debugging and stuff like that.
And, just for the record, all the files are fake.