From 39e9508260335eb5cd817e9899a11cb011efdbed Mon Sep 17 00:00:00 2001 From: Bent Bisballe Nyeng Date: Fri, 30 Mar 2012 11:37:58 +0200 Subject: Add observe protocol and connection handler. --- proto.js | 186 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++------- 1 file changed, 168 insertions(+), 18 deletions(-) (limited to 'proto.js') diff --git a/proto.js b/proto.js index c21ec5e..0baf22d 100644 --- a/proto.js +++ b/proto.js @@ -92,7 +92,8 @@ var down = 0; var no_last = 1; var last_x = 0, last_y = 0; var ctx; -var socket_lm; +var socket_task; +var socket_observe; var color = "#000000"; var dragged = ""; @@ -104,20 +105,22 @@ board.setAttribute("ondragleave", "return dragleave(this)"); if (BrowserDetect.browser == "Firefox") { - socket_lm = new MozWebSocket(get_appropriate_ws_url(), "lws-task-protocol"); + socket_task = new MozWebSocket(get_appropriate_ws_url(), "lws-task-protocol"); + socket_observe = new MozWebSocket(get_appropriate_ws_url(), "lws-observe-protocol"); } else { - socket_lm = new WebSocket(get_appropriate_ws_url(), "lws-task-protocol"); + socket_task = new WebSocket(get_appropriate_ws_url(), "lws-task-protocol"); + socket_observe = new WebSocket(get_appropriate_ws_url(), "lws-observe-protocol"); } try { - socket_lm.onopen = function() { - document.getElementById("wslm_status").style.backgroundColor = "#40ff40"; - document.getElementById("wslm_status").textContent = " websocket connection opened "; + socket_task.onopen = function() { + document.getElementById("wstask_status").style.backgroundColor = "#40ff40"; + document.getElementById("wstask_status").textContent = "TaskProto websocket connection opened "; // document.getElementById("box").style.display = "none"; } - socket_lm.onmessage = function got_packet(msg) { - document.getElementById("wslm_lastmsg").textContent = msg.data; + socket_task.onmessage = function got_packet(msg) { + document.getElementById("wstask_lastmsg").textContent = msg.data; var msgs = new Array(); var idx = 0; @@ -241,9 +244,149 @@ try { } } - socket_lm.onclose = function(){ - document.getElementById("wslm_status").style.backgroundColor = "#ff4040"; - document.getElementById("wslm_status").textContent = " websocket connection CLOSED "; + socket_task.onclose = function(){ + document.getElementById("wstask_status").style.backgroundColor = "#ff4040"; + document.getElementById("wstask_status").textContent = "TaskProto websocket connection CLOSED "; + } +} catch(exception) { + alert('

Error' + exception + '

'); +} + +try { + socket_observe.onopen = function() { + document.getElementById("wsobserve_status").style.backgroundColor = "#40ff40"; + document.getElementById("wsobserve_status").textContent = "ObserveProto websocket connection opened "; + // document.getElementById("box").style.display = "none"; + } + + socket_observe.onmessage = function got_packet(msg) { + document.getElementById("wsobserve_lastmsg").textContent = msg.data; + + var msgs = new Array(); + var idx = 0; + msgs[idx] = ''; + var c = 0; + var instring = false; + for(c = 0; c < msg.data.length; c++) { + if(msg.data[c] == '"' && c > 0 && msg.data[c - 1] != '\\') instring = !instring; + if(msg.data[c] == ';' && instring == false) { + idx++; + msgs[idx] = ''; + } + if(msg.data[c] != ';' || instring == true) msgs[idx] += msg.data[c]; + } + + f = 0; + while (f < msgs.length - 1) { + var msg = new Array(); + instring = false; + idx = 0; + msg[idx] = ''; + for(c = 0; c < msgs[f].length; c++) { + if(msgs[f][c] == '"' && c > 0 && msgs[f][c - 1] != '\\') { + instring = !instring; + continue; + } + if(msgs[f][c] == ' ' && instring == false) { + msg[idx] = msg[idx].replace("\\\\","\\").replace("\\\"","\""); + idx++; + msg[idx] = ''; + } + if(msgs[f][c] != ' ' || instring == true) msg[idx] += msgs[f][c]; + } + + var cmd = msg[0]; + + if(cmd == "del") { + var id = msg[1]; + var task = document.getElementById("task_" + id); + //todo: remove from parent not board + board.removeChild(task); + } + else if(cmd == "move") { + var id = msg[1]; + var parent_id = msg[2]; +// var left = msg[2]; +// var top = msg[3]; + var task = document.getElementById("task_" + id); + if(parent_id != -1) { + var parent_observe = document.getElementById("task_" + parent_id); + parent_observe.appendChild(task); + } + else { + board.appendChild(task); + } +// task.parentNode.removeChild(task); +// board.removeChild(task); +// parent_observe.appendChild(task); +// task.style.left = left + "px"; +// task.style.top = top + "px"; + } + else if(cmd == "add") { + var id = msg[1]; + var title = msg[2]; + var description = msg[3]; + var parent_id = msg[4]; + + var task = document.createElement("div"); + task.name = "task"; + task.setAttribute("class", "task"); + task.setAttribute("ondrop", "drop(this, event)"); + task.setAttribute("ondragenter", "return dragenter(this)"); + task.setAttribute("ondragleave", "return dragleave(this)"); + task.setAttribute("ondragover", "return false"); + task.setAttribute("draggable", true); + task.setAttribute("ondragstart", "drag(this, event)"); + + task.id = "task_" + id; + + var taskText = document.createTextNode(title + ": " + description + " :" + task.id); + taskText.id = "txt"; + task.appendChild(taskText); + +// task.style.position = "absolute"; +// task.style.left = left + "px"; +// task.style.top = top + "px"; +// task.setAttribute("onMouseDown", "dragged = '" + id + "';"); + +// var dlButton = document.createElement("input"); +// dlButton.type = "button"; +// dlButton.value = "Remove"; +// dlButton.onclick = "deleteTask(document.getElementById(" + task.id + ").id"; +// dlButton.setAttribute("onclick", "deleteTask(" + id +")"); +// task.appendChild(dlButton); + +// board.appendChild(task); + + var parent_observe = document.getElementById("task_" + parent_id); + + if(parent_observe) { + parent_observe.appendChild(task); + } + else { + board.appendChild(task); + } + } + else if(cmd == "update") { + var id = msg[1]; + var title = msg[2]; + var description = msg[3]; + + var task = document.getElementById("task_" + id); + + var taskText = document.createTextNode(title + ": " + description + " :" + task.id); + task.appendChild(taskText); + } + f++; +// document.getElementById("box").style.top = i[3] + "px"; +// document.getElementById("box").style.left = i[2] + "px"; +// document.getElementById("box").style.display = "block"; + } + } + + socket_observe.onclose = function(){ + document.getElementById("wsobserve_status").style.backgroundColor = "#ff4040"; + document.getElementById("wsobserve_status").textContent = "ObserveProto websocket connection CLOSED "; } } catch(exception) { alert('

Error' + exception + '

'); @@ -286,12 +429,17 @@ function update_color() { // x = ev.clientX; // y = ev.clientY; -// socket_lm.send("move " + dragged + " " + x + " " + y); +// socket_observe.send("move " + dragged + " " + x + " " + y); //} -function submit() { - var data = document.getElementById("input_data").value; - socket_lm.send(data); +function task_submit() { + var data = document.getElementById("input_task_data").value; + socket_task.send(data); +} + +function observe_submit() { + var data = document.getElementById("input_observe_data").value; + socket_observe.send(data); } function clear() { @@ -299,15 +447,17 @@ function clear() { } function deleteTask(id) { - socket_lm.send("del " + id + ";"); + socket_task.send("del " + id + ";"); } function drag(target, e) { + e.target.style.opacity = '0.4'; e.dataTransfer.setData('Text', target.id); e.stopPropagation(); // <--- this fixes the drag target problem } function drop(target, e) { + this.style.opacity = '1.0'; e.preventDefault(); e.stopPropagation(); @@ -315,7 +465,7 @@ function drop(target, e) { var task = document.getElementById(id); // task.parentNode.removeChild(task); // alert("move " + id.substring(5, id.length) + " " + target.id.substring(5,target.id.length) + ";"); - socket_lm.send("move " + id.substring(5, id.length) + " " + target.id.substring(5, target.id.length) + ";"); + socket_task.send("move " + id.substring(5, id.length) + " " + target.id.substring(5, target.id.length) + ";"); // target.appendChild(task); } @@ -338,7 +488,7 @@ function dropInBody(e) { var task = document.getElementById(id); // task.parentNode.removeChild(task); // alert("move " + id.substring(5, id.length) + " " + target.id.substring(5,target.id.length) + ";"); - socket_lm.send("move " + id.substring(5, id.length) + " -1;"); + socket_task.send("move " + id.substring(5, id.length) + " -1;"); // target.appendChild(task); } -- cgit v1.2.3