?
Solved

generate html from directory and file structure in bash or javascript

Posted on 2011-05-06
7
Medium Priority
?
455 Views
Last Modified: 2012-05-11
I have a directory containing several other directories that contain files. I need to turn these into HTML.

How could I wrap each sub-folder in a <UL> and each filename in <li> ?

I'd like this to be in bash or javascript.
0
Comment
Question by:SonicVoom
7 Comments
 
LVL 5

Expert Comment

by:dexion432
ID: 35704400
in bash yes, in js you need to pass the folder structure to the script
0
 
LVL 2

Author Comment

by:SonicVoom
ID: 35704474
Bash then. or PHP...
0
 
LVL 20

Expert Comment

by:Proculopsis
ID: 35704628

If you can get the structure into JSON format, as in the root variable below, then it should be fairly simple:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

var root = [
  {
    name: "DiectoryA"
  }, 
  {
    name: "DiectoryB",
    children: [
      { name: "FileA" },
      {
        name: "DiectoryB2",
        children: [
          { name: "FileA-B2" },
          { name: "FileB-B2" }
        ]
      },
      { name: "FileC" }
    ],
  }, 
  {
    name: "DiectoryC"
  }
];

jQuery(document).ready( function() {

  $("#container").append( render( root ) );
  
});

function render( parent ) {
  var result = $( "<ul/>" );
  for( var directory in parent ) {
    $(result).append( $( "<li/>" ).text( parent[directory].name ).append( render( parent[directory].children ) ) );
  };
  return result;
}

</script>
</head>
<body>

<div id="container"></div>

</body>
</html>

Open in new window

0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 2

Author Comment

by:SonicVoom
ID: 35704784
I don't know how to read it all into JSON. It's more the reading part that I'm confused by than the formatting.
0
 
LVL 83

Expert Comment

by:leakim971
ID: 35706690
0
 
LVL 2

Accepted Solution

by:
SonicVoom earned 0 total points
ID: 35804194
I used this code that I found. It didn't do exactly what I was hoping for, but it made the process go a bit faster.

<?php
function filemap($d) {
$dir = $d; // folder, e.g.: 'images/', same dir as script use a '.'
$subDir;
$myDirectory = opendir($dir);

while($entryName = readdir($myDirectory)) { $dirArray[] = $entryName; } // get files
closedir($myDirectory); // close directory

sort($dirArray); // sort 'em
$indexCount	= count($dirArray); // count elements in array
print "<ul class='$dir'>\n";
// loop through the array of files and print them all
for($index=0; $index < $indexCount; $index++) {
	if (substr("$dirArray[$index]", 0, 1) != ".") { // don't list hidden files
//			if (strstr("$dirArray[$index]", ".")==".pdf" || strstr("$dirArray[$index]", ".")==".gif") { // get image file types
						//print "n.push(escape('$dirArray[$index]')); ";
						if (is_dir($dirArray[$index]) ) {
						}
						print "<li><a href='data/documents/$d/$dirArray[$index]'>$dirArray[$index]</a></li>\n ";
						}}//}
print "</ul>";		
}
filemap($_GET['dir']);
?>

Open in new window

0
 
LVL 2

Author Closing Comment

by:SonicVoom
ID: 35829946
No submitted solution solved my question, this was the result of my googling.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
The viewer will learn how to dynamically set the form action using jQuery.
In a recent question (https://www.experts-exchange.com/questions/29004105/Run-AutoHotkey-script-directly-from-Notepad.html) here at Experts Exchange, a member asked how to run an AutoHotkey script (.AHK) directly from Notepad++ (aka NPP). This video…
Suggested Courses
Course of the Month14 days, 15 hours left to enroll

839 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question