Index: /pro-bachkim-filespace/violetspace-prototype/assets/css/jquery/jqueryFileTree.css
===================================================================
--- /pro-bachkim-filespace/violetspace-prototype/assets/css/jquery/jqueryFileTree.css	(revision 3)
+++ /pro-bachkim-filespace/violetspace-prototype/assets/css/jquery/jqueryFileTree.css	(revision 4)
@@ -31,5 +31,5 @@
 
 /* Core Styles */
-.jqueryFileTree LI.home { background: url(../../images/filetree/home.png) left top no-repeat; }
+.jqueryFileTree LI.home { background: url(../../images/filetree/home.png) left top no-repeat;}
 .jqueryFileTree LI.directory { background: url(../../images/filetree/directory.png) left top no-repeat; }
 .jqueryFileTree LI.expanded { background: url(../../images/filetree/folder_open.png) left top no-repeat; }
Index: /pro-bachkim-filespace/violetspace-prototype/assets/js/filemanager/filemanager.js
===================================================================
--- /pro-bachkim-filespace/violetspace-prototype/assets/js/filemanager/filemanager.js	(revision 3)
+++ /pro-bachkim-filespace/violetspace-prototype/assets/js/filemanager/filemanager.js	(revision 4)
@@ -59,6 +59,11 @@
 
 		$('#btnNewFolder').click (function(){
-			//privateTree.expandAll();
-			//alert(privateTree.getCurrentDir());
+			var curDir = privateTree.getCurrentDir();
+			privateTree.createDir(curDir);
+		});
+
+		$('#btnDel').click (function() {
+			var curDir = privateTree.getCurrentDir();
+			privateTree.deleteDir(curDir);
 		});
 
Index: /pro-bachkim-filespace/violetspace-prototype/assets/js/vsfilemanager.js
===================================================================
--- /pro-bachkim-filespace/violetspace-prototype/assets/js/vsfilemanager.js	(revision 3)
+++ /pro-bachkim-filespace/violetspace-prototype/assets/js/vsfilemanager.js	(revision 4)
@@ -3,6 +3,4 @@
 	$.extend($.fn, {
 		violetTree: function(o) {
-			var loadedNode = null;
-
 			if( !o ) var o = {};
 			if( o.user == undefined ) o.user = null;
@@ -19,87 +17,112 @@
 			if( o.collapseEasing == undefined ) o.collapseEasing = null;
 
-			$(this).each( function() {
-				function loadTree() {
-					if (o.dataSource == 'AJAX') {
-						$.post(o.script, 
-							function(data){
-								if (!data) return;
-								var parsedData = $.parseJSON(data);
-								o.data = parsedData;
-								renderTree ();
-							}
-						) 
-						.done(function() {
-							//alert( "second success" );
+			// PRIVATE methods
+			var loadTree = function () {
+				if (o.dataSource == 'AJAX') {
+					$.post(o.script, 
+						function(data){
+							if (!data) return;
+							var parsedData = $.parseJSON(data);
+							o.data = parsedData;
+							renderTree ();
+						}
+					).done(function() {}).fail(function() {}).always(function() {});
+				}				
+			};
+
+			var renderTree = function  () {
+				var homeNode = createNode({
+					id:0,
+					name:o.homeDirNameDisplay,
+				});
+
+				selectDir($(homeNode).find('> A'));
+
+				if (o.data != null) {
+					for (var i = 0; i < o.data.length ; i++) {
+						var node = createNode ({
+							id: o.data[i].id,
+							name: o.data[i].name,
+							curentNode: $('#' + o.dirIDprefix + o.data[i].parentID).find('> A'),
+							hidden: (o.data[i].parentID > 0) ? true : false
 						})
-						.fail(function() {
-							//alert( "error" );
-						})
-						.always(function() {
-							//alert( "finished" );
-						});
-					}				
-				};
+					};
+				}
+			};
 
-				function renderTree () {
-					$(o.container).click(function(){return false;}).mousedown(function(){return false;});
-					$(o.container).bind("contextmenu",function(e){e.preventDefault();});
+			//Create a node of Tree
+			var createNode = function (d) {
+				if( !d ) var d = {};
+				if( d.id == undefined ) d.id = null;
+				if( d.name == undefined ) d.name = null;
+				if( d.curentNode == undefined ) d.curentNode = null;
+				if( d.hidden == undefined ) d.hidden = true;
+				if( d.clickEvent == undefined ) d.clickEvent = openDir;
+				if( d.customEvent == undefined ) d.customEvent = null; //customEvent.eventName, customEvent.eventTrigger
+				
+				if (d.curentNode != null) {
+					var strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + d.id + '" class="directory collapsed"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
 
-					//Home directory
-					strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + 0 + '" class="home"><a href="#" rel="spacehome">' + o.homeDirNameDisplay + '</a></li></ul>';
+					$(d.curentNode).parent().append(strHTML);
+					if (d.hidden == true) 
+						$('#' + o.dirIDprefix + d.id).parent().css('display','none');
+					
+				}else if (d.id == 0){
+					var strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + d.id + '" class="home"><a href="#" rel="' + d.name + '">' + d.name + '</a></li></ul>';
 					$(o.container).append(strHTML);
-					$('#' + o.dirIDprefix + 0).find('a').click(function(){return false;}).mousedown(function(){return false;});
-					$('#' + o.dirIDprefix + 0).find('a').bind("contextmenu",function(e){
-				        e.preventDefault();
-				        showContextMenu (this);
-					});
-
-					if (o.data != null) {
-						for (var i = 0; i < o.data.length ; i++) {
-							strHTML = '<ul class="jqueryFileTree"><li id="' + o.dirIDprefix + o.data[i].id + '" class="directory collapsed"><a href="#" rel="' + o.data[i].name + '">' + o.data[i].name + '</a></li></ul>';
-
-							if (o.data[i].parentID > 0){
-								$('#' + o.dirIDprefix + o.data[i].parentID).append(strHTML);
-								$('#' + o.dirIDprefix + o.data[i].id).parent().css('display','none');
-							}
-							else {
-								
-								$('#' + o.dirIDprefix + 0).append(strHTML);
-							}
-
-							$('#' + o.dirIDprefix + o.data[i].id).find('a').click(function(){openDir(this);return false;}).mousedown(function(){return false;});
-							$('#' + o.dirIDprefix + o.data[i].id).find('a').bind("contextmenu",function(e){
-						        e.preventDefault();
-						        showContextMenu (this);
-						     });
-						};
-					}
-				};
-
-				function openDir (o) {
-					if( $(o).parent().hasClass('collapsed') ) {
-						$(o).parent().find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
-						$(o).parent().removeClass('collapsed').addClass('expanded');
-					}
-					else if( $(o).parent().hasClass('expanded') ) {
-						$(o).parent().find('> UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
-						$(o).parent().removeClass('expanded').addClass('collapsed');
-					}
-					selectDir(o);
 				}
 
-				function selectDir(o) {
-					$('.currentDir').removeClass('currentDir');
-					$(o).addClass('currentDir');
+				//bind event on new node
+				$('#' + o.dirIDprefix + d.id).find('a').bind("click", function(e){d.clickEvent(this)});
+				$('#' + o.dirIDprefix + d.id).find('a').bind("contextmenu",function(e){
+			        e.preventDefault();
+			        showContextMenu (this);
+				});
+
+				if (d.customEvent != null) 
+					$('#' + o.dirIDprefix + d.id).find('a').bind(d.customEvent.eventName, function(e){d.customEvent.eventTrigger(this)});
+
+				return $('#' + o.dirIDprefix + d.id);
+			}
+			//END - Create a node of Tree
+
+			var deleteNode = function (n) {
+				if (!$(n).parent().hasClass('home'))
+					$(n).remove();
+			}
+
+			var isHome = function (n) {
+				return $(n).parent().hasClass('home');
+			}
+
+			var countNodeChild = function (n) {
+				var parent = $(n).parent();
+				return $(parent).find('UL').size();
+			}
+
+			var openDir = function (o) {
+				if( $(o).parent().hasClass('collapsed') ) {
+					$(o).parent().find('> UL:hidden').slideDown({ duration: o.expandSpeed, easing: o.expandEasing });
+					$(o).parent().removeClass('collapsed').addClass('expanded');
 				}
+				else if( $(o).parent().hasClass('expanded') ) {
+					$(o).parent().find('> UL').slideUp({ duration: o.collapseSpeed, easing: o.collapseEasing });
+					$(o).parent().removeClass('expanded').addClass('collapsed');
+				}
+				selectDir(o);
+			}
 
-				function showContextMenu (n) {
-					alert ('showContextMenu on ' + $(n).text());
-				};
+			var selectDir = function (c) {
+				$('.currentDir').removeClass('currentDir');
+				$(c).addClass('currentDir');
+			}
 
+			var showContextMenu = function  (n) {
+				alert ('showContextMenu on ' + $(n).text());
+			};
 
+			loadTree();
+			// END - PRIVATE methods
 
-				loadTree();
-			});
 
 			this.expandAll = function() {
@@ -107,19 +130,47 @@
 			};
 
-			this.getCurrentDir = function() {
+			this.getCurrentDirName = function() {
 				return $(o.container).find('.currentDir').attr('rel');
 			};
 
-			this.createDir = function() {
-					/**
-					* 1. Send request create directory to server
-					* 2. Get ID of new directory from server
-					* 3. Create node of tree
-					*/
+			this.getCurrentDir = function() {
+				return $(o.container).find('.currentDir');
+			};
 
+			this.createDir = function(c) {
 
-					$.post(o.script,{action:"create_dir",parentID:pid}, function (data) {
+				var cid = $(c).parent().attr('id');
+				var pid = cid.substring(o.dirIDprefix.length, cid.length);
 
+				var dirName = prompt("Please enter new directory name", "");
+
+				$.post(o.script,{action:"create_dir",parentID:pid,name:dirName}, function (data) {
+					if (!data) return;
+					var parsedData = $.parseJSON(data);
+
+					createNode({
+						id: parsedData.id,
+						name: parsedData.name,
+						curentNode: c,
+						hidden: false,
+						//customEvent: {eventName: "click", eventTrigger: function(o){alert('This click!')}}
 					});
+				});
+			}
+
+			this.deleteDir = function (c) {
+				var childExisted = (countNodeChild(c) > 0) ? true:false;
+				var confirmDel = false;
+				var confirmChild = true;
+
+				if (isHome(c)) return;
+
+				confirmDel = confirm('Are you sure you want to delete this Directory?');
+
+				if (childExisted > 0 && confirmDel)
+					confirmChild = confirm('This node has childs, you still want to delete it?');
+
+				if (confirmDel && confirmChild)	deleteNode(c);
+
 			}
 
@@ -130,9 +181,4 @@
 			return this.initialize();
 		},
-		
-		
-		/*violetGrid: function(o, h) {
-
-		}*/
 	});
 
Index: /pro-bachkim-filespace/violetspace-prototype/getdata.php
===================================================================
--- /pro-bachkim-filespace/violetspace-prototype/getdata.php	(revision 3)
+++ /pro-bachkim-filespace/violetspace-prototype/getdata.php	(revision 4)
@@ -22,5 +22,12 @@
 		);
 
-if (count($_POST) == 0) {
+if (isset($_POST['action'])) {
+	if ($_POST['action'] == 'create_dir') {
+		$newID = 9;
+		$aryNewDir = array('id' => $newID, 'name' => $_POST['name'], 'parentID' => $_POST['parentID']);
+		echo json_encode($aryNewDir);
+	}
+}
+else {
 	echo json_encode($aryDir);
 }
Index: /pro-bachkim-filespace/violetspace-prototype/index.html
===================================================================
--- /pro-bachkim-filespace/violetspace-prototype/index.html	(revision 3)
+++ /pro-bachkim-filespace/violetspace-prototype/index.html	(revision 4)
@@ -36,4 +36,5 @@
 			<div class="btn-group">
 				<button id="btnNewFolder" class="btn btn-success" title="Táº¡o thÆ° má»¥c má»i"><i class="icon-folder-close"></i></button>
+				<button id="btnDel" class="btn btn-success" title="XÃ³a"><i class="icon-eraser"></i></button>
 				<button class="btn btn-success" title="Sao chÃ©p"><i class="icon-copy"></i></button>
 				<button class="btn btn-success" title="Cáº¯t"><i class="icon-cut"></i></button>
