diff --git a/.DS_Store b/.DS_Store
new file mode 100644
index 0000000..410b06c
Binary files /dev/null and b/.DS_Store differ
diff --git a/ajax.js b/ajax.js
new file mode 100644
index 0000000..6da9170
--- /dev/null
+++ b/ajax.js
@@ -0,0 +1,69 @@
+function getXMLHttp()
+{
+  var xmlHttp
+
+  try
+  {
+    //Firefox, Opera 8.0+, Safari
+    xmlHttp = new XMLHttpRequest();
+  }
+  catch(e)
+  {
+    //Internet Explorer
+    try
+    {
+      xmlHttp = new ActiveXObject("Msxml2.XMLHTTP");
+    }
+    catch(e)
+    {
+      try
+      {
+        xmlHttp = new ActiveXObject("Microsoft.XMLHTTP");
+      }
+      catch(e)
+      {
+        alert("Your browser does not support AJAX!")
+        return false;
+      }
+    }
+  }
+  return xmlHttp;
+}
+
+function RequestImage(filename)
+{
+  var xmlHttp = getXMLHttp();
+  
+  xmlHttp.onreadystatechange = function()
+  {
+    if(xmlHttp.readyState == 4)
+    {
+      HandleResponse(xmlHttp.responseText, filename);
+    }
+  }
+
+  xmlHttp.open("GET", "ajax.php?var1=value1&var2=value2", true); 
+  xmlHttp.send(null);
+}
+
+function HandleResponse(response, filename)
+{
+    //document.getElementById('preview').innerHTML = ag.concat("/>\"");
+    document.getElementById('filtered').innerHTML = response;
+}
+
+function openFile(file) {
+    //document.getElementById('preview').innerHTML = "<img src=bank/rannou/25696c5.jpg>";
+    var im = "<img src=";
+    var ag = im.concat(file.substring(6));
+    document.getElementById('preview').innerHTML = ag.concat(" height=\"200\" width=\"200\" />");
+    //RequestImage(file);
+}
+
+function preview(file) {
+    RequestImage();
+    // get image name
+    // get filter
+    // server process
+    // server sends new image location
+}
\ No newline at end of file
diff --git a/ajax.php b/ajax.php
new file mode 100644
index 0000000..4645af7
--- /dev/null
+++ b/ajax.php
@@ -0,0 +1,4 @@
+<?php
+    $cat=&$_GET['var1'];
+    echo $cat;
+?>
diff --git a/bank/arrow_up.png b/bank/arrow_up.png
new file mode 100644
index 0000000..c797a2e
Binary files /dev/null and b/bank/arrow_up.png differ
diff --git a/bank/rannou/25696c5.jpg b/bank/rannou/25696c5.jpg
new file mode 100644
index 0000000..0e35b7b
Binary files /dev/null and b/bank/rannou/25696c5.jpg differ
diff --git a/bank/rannou/Sample16.jpg b/bank/rannou/Sample16.jpg
new file mode 100644
index 0000000..cf0c0e4
Binary files /dev/null and b/bank/rannou/Sample16.jpg differ
diff --git a/bank/rannou/Sample17.jpg b/bank/rannou/Sample17.jpg
new file mode 100644
index 0000000..2b9de79
Binary files /dev/null and b/bank/rannou/Sample17.jpg differ
diff --git a/bank/rannou/arrow_up.png b/bank/rannou/arrow_up.png
new file mode 100644
index 0000000..c797a2e
Binary files /dev/null and b/bank/rannou/arrow_up.png differ
diff --git a/bank/rannou/tot.txt b/bank/rannou/tot.txt
new file mode 100644
index 0000000..e69de29
diff --git a/bank/rannou25696c5.jpg b/bank/rannou25696c5.jpg
new file mode 100644
index 0000000..0e35b7b
Binary files /dev/null and b/bank/rannou25696c5.jpg differ
diff --git a/filters/denoise b/filters/denoise
new file mode 100644
index 0000000..e69de29
diff --git a/filters/rotate b/filters/rotate
new file mode 100644
index 0000000..e69de29
diff --git a/filters/sepia b/filters/sepia
new file mode 100644
index 0000000..e69de29
diff --git a/registeredarea.php b/registeredarea.php
index 7224c50..7d5c7ca 100644
--- a/registeredarea.php
+++ b/registeredarea.php
@@ -20,6 +20,10 @@
     $('#fileTreeDemo_1').fileTree({ root: full2, script: 'libs/connectors/jqueryFileTree.php' }, function(file) {
                                   openFile(file)
                                   ;})                  ;});
+$(document).ready( function() {
+                  $('#fileTreeDemo_2').fileTree({ root: '../../filters/', script: 'libs/connectors/jqueryFileTree.php' }, function(file) {
+                                                preview(file)
+                                                ;})                  ;});
 </script>
 
 <style>
@@ -111,14 +115,14 @@
 <tr>
 <td>Your images</td>
 <td>Preview</td>
-<td>Filter</td>
+<td>Filters</td>
 <td>Filtered image</td>
 </tr>
 <tr>
 <td><div id="fileTreeDemo_1" class="demo"></div></td>
 <td><div id="preview"></div></td>
-<td>row 2, cell 3</td>
-<td>row 2, cell 4</td>
+<td><div id="fileTreeDemo_2" class="demo"></div></td>
+<td><div id="filtered"></div></td>
 </tr>
 <tr>
 <td> <form enctype="multipart/form-data" action="upload.php" method="POST">
diff --git a/upload.php b/upload.php
new file mode 100644
index 0000000..6747f00
--- /dev/null
+++ b/upload.php
@@ -0,0 +1,12 @@
+<?php 
+    $target = "bank/rannou/"; 
+    $target = $target . basename( $_FILES['uploaded']['name']) ; 
+    $ok=1; 
+    if(move_uploaded_file($_FILES['uploaded']['tmp_name'], $target)) 
+    {
+        echo "The file ". basename( $_FILES['uploadedfile']['name']). " has been uploaded";
+    } 
+    else {
+        echo "Sorry, there was a problem uploading your file.";
+    }
+    ?>
\ No newline at end of file