From 1a6fd4f87ec2bcad55765c189e6659e49c1e6dc4 Mon Sep 17 00:00:00 2001 From: Morten Sorvig Date: Mon, 17 Aug 2009 06:17:34 +0200 Subject: Refactor the drag-drop handler --- src/draghandler.js | 79 ++++------------------------------------------ src/eventhandler.js | 71 ++++++++++++++++++++++++++++++++++++++--- src/eventqueue.cpp | 2 +- src/webclientserver.h | 1 + src/widgeteventhandler.cpp | 2 +- 5 files changed, 77 insertions(+), 78 deletions(-) diff --git a/src/draghandler.js b/src/draghandler.js index 62bcd25..36fc724 100644 --- a/src/draghandler.js +++ b/src/draghandler.js @@ -4,81 +4,16 @@ * http://www.webtoolkit.info/ * **/ + +function draghandler(webclient) +{ + this.webclient = webclient; +} + var DragHandler = { // private property. _oElem : null, + webclient : null, - // public method. Attach drag handler to an element. - attach : function(oElem) { - oElem.onmousedown = DragHandler._dragBegin; - - // callbacks - oElem.dragBegin = new Function(); - oElem.drag = new Function(); - oElem.dragEnd = new Function(); - - return oElem; - }, - - - // private method. Begin drag process. - _dragBegin : function(e) { - var oElem = DragHandler._oElem = this; - - if (isNaN(parseInt(oElem.style.left))) { oElem.style.left = '0px'; } - if (isNaN(parseInt(oElem.style.top))) { oElem.style.top = '0px'; } - - var x = parseInt(oElem.style.left); - var y = parseInt(oElem.style.top); - - e = e ? e : window.event; - oElem.mouseX = e.clientX; - oElem.mouseY = e.clientY; - - oElem.dragBegin(oElem, x, y); - - document.onmousemove = DragHandler._drag; - document.onmouseup = DragHandler._dragEnd; - return false; - }, - - - // private method. Drag (move) element. - _drag : function(e) { - var oElem = DragHandler._oElem; - - var x = parseInt(oElem.style.left); - var y = parseInt(oElem.style.top); - - e = e ? e : window.event; - moveElement(oElem, x + (e.clientX - oElem.mouseX), y + (e.clientY - oElem.mouseY)); - -// oElem.style.left = x + (e.clientX - oElem.mouseX) + 'px'; -// oElem.style.top = y + (e.clientY - oElem.mouseY) + 'px'; - - oElem.mouseX = e.clientX; - oElem.mouseY = e.clientY; - - oElem.drag(oElem, x, y); - - return false; - }, - - - // private method. Stop drag process. - _dragEnd : function() { - var oElem = DragHandler._oElem; - - var x = parseInt(oElem.style.left); - var y = parseInt(oElem.style.top); - - oElem.dragEnd(oElem, x, y); - - sendMoveMessage(oElem); - - document.onmousemove = null; - document.onmouseup = null; - DragHandler._oElem = null; - } } diff --git a/src/eventhandler.js b/src/eventhandler.js index ab676ad..cca4e96 100644 --- a/src/eventhandler.js +++ b/src/eventhandler.js @@ -123,7 +123,7 @@ function createElement(widgetType, id) } else if (widgetType == "midisubwindow") { // console.log("midisubwindow") element = this.createWidgetElement(id); - DragHandler.attach(element); + dojo.connect(element, 'onmousedown', this, dragBegin); } else { element = this.createWidgetElement(id); } @@ -167,16 +167,28 @@ function updateText(element, text) element.value = text; } -function moveElement(contentElement, x, y) +function setElementRelativePosition(contentElement, x, y) { +// console.log("set element relative posisiton " + x + " " + y); var element = contentElement.structureElement; element.style.left = x; element.style.top = y; } +function moveElement(contentElement, dx, dy) +{ + var element = contentElement.structureElement; + element.style.left = parseInt(element.style.left) + dx; + element.style.top = parseInt(element.style.top) + dy; +// console.log("move element " + dx + " " + dy + element.style.left); +} + function sendMoveMessage(element) { - var message = this.jsonUrl + JSON.stringify({ "type" : "positionupdate", "id" : element.pointer, "x" : element.style.left, "y" : element.style.top }); + var structureElement = element.structureElement; +// console.log("element.structureElement" + structureElement + " " + element.pointer); + var message = this.jsonUrl + JSON.stringify({ "type" : "positionupdate", "id" : element.pointer, + "x" : structureElement.style.left, "y" : structureElement.style.top }); this.request(message); } @@ -257,7 +269,7 @@ function eventHandler(text) element.src = source; } else if (type == "geometry") { // console.log("geometry x " + event.x + " y " + event.y + " w " + event.w + " h " + event.h); - this.moveElement(element, event.x, event.y) + this.setElementRelativePosition(element, event.x, event.y) element.style.width = event.w; element.style.height = event.h; @@ -380,6 +392,52 @@ function getElementsByClass(searchClass,node,tag) { var webclientObjectCounter = 0; + function dragBegin (event) { + event = event ? event : window.event; + + var element = event.target.structureElement; + if (isNaN(parseInt(element.style.left))) { element.style.left = '0px'; } + if (isNaN(parseInt(element.style.top))) { element.style.top = '0px'; } + + var x = parseInt(element.style.left); + var y = parseInt(element.style.top); + + this.mouseX = event.clientX; + this.mouseY = event.clientY; + this.dragHandler = dojo.connect(document, 'onmousemove', this, drag); + this.dragEndHandler = dojo.connect(document, 'onmouseup', this, dragEnd); + this.dragElement = event.target; + + return false; + } + + function drag(event) { + var element = this.dragElement.structureElement; + //console.log(this.dragElement + this.dragElement.structureElement) + //console.log("Drag " + this + " " + this.dragElement + " " + element) + var x = parseInt(element.style.left); + var y = parseInt(element.style.top); + + event = event ? event : window.event; + + var dx = event.clientX - this.mouseX; + var dy = event.clientY - this.mouseY; + + this.moveElement(this.dragElement, dx, dy); + + this.mouseX = event.clientX; + this.mouseY = event.clientY; + + return false; + } + + function dragEnd(event) { + this.sendMoveMessage(this.dragElement); + dojo.disconnect(this.dragHandler); + dojo.disconnect(this.dragEndHandler); + } + + function setUpWebClientObject(webclientObject) { webclientObject.baseUrl = webclientObject.attributes["src"].value + "/"; @@ -403,6 +461,7 @@ function setUpWebClientObject(webclientObject) webclientObject.createTextInputElement = createTextInputElement; webclientObject.createButtonInputElement = createButtonInputElement; webclientObject.createElement = createElement + webclientObject.setElementRelativePosition = setElementRelativePosition webclientObject.moveElement = moveElement webclientObject.sendMoveMessage = sendMoveMessage webclientObject.eventHandler = eventHandler; @@ -419,6 +478,10 @@ function setUpWebClientObject(webclientObject) webclientObject.inputElementKeyPress = inputElementKeyPress webclientObject.inputElementKeyRelease = inputElementKeyRelease + webclientObject.dragBegin = dragBegin; + webclientObject.drag = drag; + webclientObject.dragEnd = dragEnd; + // console.log(webclientObject); // console.log(webclientObject.baseUrl); } diff --git a/src/eventqueue.cpp b/src/eventqueue.cpp index 8c9dc36..db5b87c 100644 --- a/src/eventqueue.cpp +++ b/src/eventqueue.cpp @@ -82,7 +82,7 @@ void EventQueue::handleRequest(HttpRequest *request, HttpResponse *response) DEBUG << "idle"; response->setBody(queueToByteArray()); - // If the part starts with "/josn" then the rest of the string is an json-encoded + // If the part starts with "/json" then the rest of the string is an json-encoded // string object. } else if (path.startsWith("/json")) { QByteArray jsonText = path.mid(5); // remove "/json" diff --git a/src/webclientserver.h b/src/webclientserver.h index ad9a0cf..9a823df 100644 --- a/src/webclientserver.h +++ b/src/webclientserver.h @@ -70,6 +70,7 @@ public: HttpRequest m_idleRequest; HttpResponse m_idleResponse; Server *m_server; + }; class FileServer : public QObject diff --git a/src/widgeteventhandler.cpp b/src/widgeteventhandler.cpp index 4cbfbb0..ce69de8 100644 --- a/src/widgeteventhandler.cpp +++ b/src/widgeteventhandler.cpp @@ -310,7 +310,7 @@ void WidgetEventHandler::widgetPaint(QWidget *widget, const QRect &updateRect) grabbing = true; // prevent recusion //DEBUG << "render"; // grab widget only, no background or children - widget->render(&image, updateRect.topLeft(), QRegion(updateRect), QWidget::RenderFlags(0)); + widget->render(&image, QPoint(0,0), QRegion(QRect(QPoint(0,0), widget->size())), QWidget::RenderFlags(0)); //DEBUG << "render done"; grabbing = false; -- cgit v1.2.3