Highlight drop targets on mouse over.

1 files changed, 24 insertions, 11 deletions

diff --git a/proto.js b/proto.js
index 2c29cde..c21ec5e 100644
--- a/proto.js
+++ b/proto.js
@@ -96,9 +96,11 @@ var socket_lm;
 var color = "#000000";
 var dragged = "";
 
-document.body.setAttribute("ondrop", "dropInBody(event)");
-document.body.setAttribute("ondragenter", "return false");
-document.body.setAttribute("ondragover", "return false");
+var board = document.getElementById("board");
+board.setAttribute("ondrop", "dropInBody(event)");
+board.setAttribute("ondragover", "return false");
+board.setAttribute("ondragenter", "return dragenter(this)");
+board.setAttribute("ondragleave", "return dragleave(this)");
 
 
 if (BrowserDetect.browser == "Firefox") {
@@ -155,8 +157,8 @@ try {
       if(cmd == "del") {
         var id = msg[1];
         var task = document.getElementById("task_" + id);
-        //todo: remove from parent not body
-	document.body.removeChild(task);
+        //todo: remove from parent not board
+        board.removeChild(task);
       }
       else if(cmd == "move") {
         var id = msg[1];
@@ -169,10 +171,10 @@ try {
 	        parent_task.appendChild(task);
         }
         else {
-          document.body.appendChild(task);
+          board.appendChild(task);
         }
 //	task.parentNode.removeChild(task);
-//	document.body.removeChild(task);
+//	board.removeChild(task);
 //	parent_task.appendChild(task);
 //        task.style.left = left + "px";
 //        task.style.top = top + "px";
@@ -187,9 +189,10 @@ try {
         task.name = "task";
         task.setAttribute("class", "task");
         task.setAttribute("ondrop", "drop(this, event)");
-        task.setAttribute("ondragenter", "return false");
+        task.setAttribute("ondragenter", "return dragenter(this)");
+        task.setAttribute("ondragleave", "return dragleave(this)");
         task.setAttribute("ondragover", "return false");
-	task.setAttribute("draggable", true);
+        task.setAttribute("draggable", true);
         task.setAttribute("ondragstart", "drag(this, event)");
 
 	task.id = "task_" + id;
@@ -210,7 +213,7 @@ try {
 //        dlButton.setAttribute("onclick", "deleteTask(" + id +")");
 //        task.appendChild(dlButton);
 
-//        document.body.appendChild(task);
+//        board.appendChild(task);
       	
         var parent_task = document.getElementById("task_" + parent_id);
 
@@ -218,7 +221,7 @@ try {
           parent_task.appendChild(task);
 	}
 	else {
-          document.body.appendChild(task);
+          board.appendChild(task);
 	}
       }
       else if(cmd == "update") {
@@ -317,6 +320,16 @@ function drop(target, e) {
 //  target.appendChild(task);
 }
 
+function dragenter(obj) {
+  obj.style.backgroundColor = 'red';
+  return false;
+}
+
+function dragleave(obj) {
+  obj.style.backgroundColor = 'grey';
+  return false;
+}
+
 function dropInBody(e) {
   e.preventDefault();
   e.stopPropagation();