1 files changed, 94 insertions, 49 deletions

diff --git a/src/ws/view.js b/src/ws/view.js
index 2c9d507..986e3f9 100644
--- a/src/ws/view.js
+++ b/src/ws/view.js
@@ -82,6 +82,11 @@ function deleteNode(id)
 
 function getElementAfter(e)
 {
+	if(e.target.className != "children")
+	{
+		return null;
+	}
+
 	var element_after = null;
 	var min_y_diff = 9999999999999;
 	for(i = 0; i < e.target.children.length; ++i)
@@ -102,15 +107,22 @@ function getElementAfter(e)
 	return element_after;
 }
 
-function drag(target, e)
+function drag(e)
 {
-	e.dataTransfer.setData('id', target.id);
+	// e.target is always a node.element here
+	var id = e.target.id;
+	e.dataTransfer.setData('id', id);
 	e.stopPropagation(); // <--- this fixes the drag target problem
-	update(idFromStr(target.id), "dragged", "true");
+	update(idFromStr(id), "dragged", "true");
 }
 
 function dragenter(e)
 {
+	// Only highlight children areas
+	if(e.target.className != "children")
+	{
+		return;
+	}
 	e.target.style.backgroundColor = "#646588";
 	last_over = e.target;
 }
@@ -118,6 +130,12 @@ function dragenter(e)
 var last_after = null;
 function dragover(e)
 {
+//	// Only highlight children areas
+//	if(e.target.className != "children")
+//	{
+//		return;
+//	}
+
 	e.preventDefault();
 
 	var after = getElementAfter(e);
@@ -134,11 +152,29 @@ function dragover(e)
 
 function dragleave(e)
 {
+	// Only highlight children areas
+	if(e.target.className != "children")
+	{
+		return;
+	}
+
 	e.target.style.backgroundColor = "#aaa";
 }
 
 function dragEnd(e)
 {
+	e.stopPropagation();
+
+	// FIXME: This doesn't seem to work in Chromium 65
+	var id = e.dataTransfer.getData('id');
+	update(idFromStr(id), "dragged", "false");
+
+//	// Only highlight children areas
+//	if(e.target.className != "children")
+//	{
+//		return;
+//	}
+
 	e.target.style.backgroundColor = "#aaa";
 
 	if(last_after != null)
@@ -154,20 +190,26 @@ function dragEnd(e)
 	}
 
 	e.preventDefault();
-	e.stopPropagation();
-
-	// FIXME: This doesn't seem to work in Chromium 65
-	var id = e.dataTransfer.getData('id');
-	update(idFromStr(id), "dragged", "false");
 }
 
 function drop(e)
 {
+	e.stopPropagation();
+
+	// Only allow drops in children areas
+	if(e.target.className != "children")
+	{
+		return;
+	}
+
 	var id = e.dataTransfer.getData('id');
-	update(idFromStr(id), "dragged", "false");
+	//update(idFromStr(id), "dragged", "false");
 
+	// Get drop id from targets parent (children tag inside the node)
+	var dropid = e.target.parentElement.id;
+	console.log("dropid: " + dropid);
 	// Prevent dropping on item itself
-	if(id == e.target.id)
+	if(id == dropid)
 	{
 		return;
 	}
@@ -178,7 +220,7 @@ function drop(e)
 	{
 		before_id = idFromStr(element_after.id);
 	}
-	move(idFromStr(id), idFromStr(e.target.id), before_id);
+	move(idFromStr(id), idFromStr(dropid), before_id);
 }
 
 function subscribeMe(target, e)
@@ -193,28 +235,6 @@ function unsubscribeMe(target, e)
 	unsubscribe(target.nodeid);
 }
 
-function showHideChildren(target, e)
-{
-	e.stopPropagation();
-	updateid = idFromStr(target.id);
-	if(target.style.backgroundColor != "red")
-	{
-		target.style.backgroundColor = "red";
-		for(i = 1; i < target.childNodes.length; i++)
-		{
-			target.childNodes[i].style.display = "none";
-		}
-	}
-	else
-	{
-		target.style.backgroundColor = "#aaa";
-		for(i = 1; i < target.childNodes.length; i++)
-		{
-			target.childNodes[i].style.display = "block";
-		}
-	}
-}
-
 function node_submit()
 {
 	var data = document.getElementById("input_node_data");
@@ -238,52 +258,77 @@ var lineedit;
 var lineeditparent;
 function onKeyUpHandler(e)
 {
+	var node = findNodeFromString(e.target.id);
+	if(node == null)
+	{
+		return; // no node
+	}
+
+	var lineedit = e.target;
+	var updateid = idFromStr(lineedit.id);
+
 	if(e.which == 13)
 	{ // enter
-		lineeditparent.removeChild(lineedit);
-		lineeditparent.nodeValue = 'updating...';
+		node.data_element.removeChild(lineedit);
+		//node.data_element.nodeValue = 'updating...';
 		update(updateid, "title", lineedit.value);
 	}
 	if(e.which == 27)
 	{ // escape
-		lineeditparent.removeChild(lineedit);
+		node.data_element.removeChild(lineedit);
 	}
 }
 
 function onLostFocusHandler(e)
 {
-	lineeditparent.removeChild(lineedit);
+	var node = findNodeFromString(e.target.id);
+	if(node == null)
+	{
+		return; // no node
+	}
+
+	var lineedit = e.target;
+
+	node.data_element.removeChild(lineedit);
 }
 
 function editTitle(e)
 {
 	e.stopPropagation();
-	updateid = idFromStr(e.target.id);
-	subscriptionId = subscriptionIdFromStr(e.target.id);
-
-	var node = findNode(updateid, subscriptionId);
+	var node = findNodeFromString(e.target.id);
+	if(node == null)
+	{
+		return; // no node
+	}
 
-	lineedit = document.createElement("input");
+	var lineedit = document.createElement("input");
 	lineedit.setAttribute("class", "edit");
 	lineedit.setAttribute("onkeyup", "onKeyUpHandler(event)");
 	lineedit.setAttribute("onblur", "onLostFocusHandler(event)");
 	lineedit.value = node.getTitle();
-	e.target.appendChild(lineedit);
-	//e.target.insertBefore(e.target.childNodes[2], lineedit);
-	lineeditparent = e.target;
+	lineedit.id = e.target.id;
+	node.data_element.appendChild(lineedit);
+	//lineeditparent = e.target;
 	lineedit.focus();
 }
 
 function addChild(e)
 {
 	e.stopPropagation();
-	id = idFromStr(e.target.parentElement.id);
+	id = idFromStr(e.target.parentElement.parentElement.id);
 	create("x", id, -1);
 }
 
 function collapse(e)
 {
-	var id = e.target.parentElement.id;
+	var id = e.target.parentElement.parentElement.id;
+
+	var node = findNodeFromString(id);
+	if(node == null)
+	{
+		return; // no node
+	}
+
 	var collapsed = getCookie(id+"_collapsed") == "true";
 	collapsed = !collapsed;
 	setCookie(id+"_collapsed", collapsed?"true":"false");
@@ -291,10 +336,10 @@ function collapse(e)
 	e.stopPropagation();
 	if(collapsed)
 	{
-		e.target.parentElement.style.maxHeight = "32px";
+		node.children_element.classList.add('collapsed');
 	}
 	else
 	{
-		e.target.parentElement.style.maxHeight = "inherit";
+		node.children_element.classList.remove('collapsed');
 	}
 }