diff --git a/compiler/datasheet/server_scripts/__init__.py b/compiler/datasheet/server_scripts/__init__.py
index f702e604..f670aeaf 100644
--- a/compiler/datasheet/server_scripts/__init__.py
+++ b/compiler/datasheet/server_scripts/__init__.py
@@ -7,23 +7,18 @@ from filelist import *
 filedir = './files'
 file_data = './filelist.info'
 
-def render_without_request(template_name, **template_vars):
-    env = jinja2.Environment(
-            loader = jinja2.PackageLoader('server_scripts','templates')
-    )
-    template = env.get_template(template_name)
-    return template.render(**template_vars)
 
 app = Flask('server_scripts')
 
+
 if __name__ == '__main__':
     
     files = filelist()
 
     files.update_filelist(filedir,file_data)
     
-    f = open('./output/index.html','w')
+    f = open('./index.html','w')
     with app.app_context():
-        f.write(render_template('index.html', files=files.list))
+        f.write(render_template('index.html', filedir = filedir , os = os))
 
        
diff --git a/compiler/datasheet/server_scripts/filelist.py b/compiler/datasheet/server_scripts/filelist.py
index 01f32682..ec2eee88 100644
--- a/compiler/datasheet/server_scripts/filelist.py
+++ b/compiler/datasheet/server_scripts/filelist.py
@@ -16,3 +16,4 @@ class filelist:
 
 
 
+
diff --git a/compiler/datasheet/server_scripts/files/temp/testfolder/file1 b/compiler/datasheet/server_scripts/files/temp/testfolder/file1
new file mode 100644
index 00000000..e69de29b
diff --git a/compiler/datasheet/server_scripts/files/temp/testfolder/file2 b/compiler/datasheet/server_scripts/files/temp/testfolder/file2
new file mode 100644
index 00000000..e69de29b
diff --git a/compiler/datasheet/server_scripts/files/temp/testfolder2/file3 b/compiler/datasheet/server_scripts/files/temp/testfolder2/file3
new file mode 100644
index 00000000..e69de29b
diff --git a/compiler/datasheet/server_scripts/files/temp/testfolder2/file4 b/compiler/datasheet/server_scripts/files/temp/testfolder2/file4
new file mode 100644
index 00000000..e69de29b
diff --git a/compiler/datasheet/server_scripts/templates/index.html b/compiler/datasheet/server_scripts/templates/index.html
index ae448a80..a2e3ec13 100644
--- a/compiler/datasheet/server_scripts/templates/index.html
+++ b/compiler/datasheet/server_scripts/templates/index.html
@@ -1,5 +1,39 @@
-<ul>
-    {% for file in files %}
-    <li><a href="{{ file }}">{{ file }}</a></li>
-    {% endfor %}
+
+</ul>
+    <link rel="stylesheet" href="static/index.css">
+
+
+    {% for root, dir, files in os.walk(filedir) %}
+    
+
+    <button class="collapsible">{{ root }}</button>
+    <div class="content">
+        {% for f in files %}
+        <button class="collapsible">{{ f }}</button>
+        <div class="content">
+            <p> file information </p> 
+         </div>
+        {% endfor %}
+    </div>
+
+
+    {% endfor %}
+
+
+    <script type="text/javascript">
+        var coll = document.getElementsByClassName("collapsible");
+        var i;
+
+        for (i = 0; i < coll.length; i++) {
+            coll[i].addEventListener("click", function() {
+        this.classList.toggle("active");
+        var content = this.nextElementSibling;
+        if (content.style.display === "block") {
+            content.style.display = "none";
+        } else {
+          content.style.display = "block";
+        }
+          });
+        }
+        </script>
 </ul>