update

gui/src/2D/advancedDynamicTexture.ts

@@ -878,8 +878,8 @@ export class AdvancedDynamicTexture extends DynamicTexture {
             }
             delete this._lastControlOver[pointerEvent.pointerId];
             if (this._lastControlDown[pointerEvent.pointerId] && this._lastControlDown[pointerEvent.pointerId] !== this._capturingControl[pointerEvent.pointerId]) {
-                this._lastControlDown[pointerEvent.pointerId]._forcePointerUp();
-                delete this._lastControlDown[pointerEvent.pointerId];
+               // this._lastControlDown[pointerEvent.pointerId]._forcePointerUp();
+              //  delete this._lastControlDown[pointerEvent.pointerId];
             }
         });
     }

guiEditor/src/diagram/graphCanvas.tsx

@@ -184,11 +184,10 @@ export class GraphCanvasComponent extends React.Component<IGraphCanvasComponentP
         super(props);
 
         props.globalState.onSelectionChangedObservable.add(selection => {  
-            this.selectedGuiNodes.forEach(element => {
-                element.isSelected = false;
-            }); 
-            //this._selectedGuiNodes = [];
             if (!selection) {
+                this.selectedGuiNodes.forEach(element => {
+                    element.isSelected = false;
+                }); 
                 this._selectedNodes = [];
                 this._selectedGuiNodes = [];
                 this._selectedLink = null;
@@ -476,7 +475,7 @@ export class GraphCanvasComponent extends React.Component<IGraphCanvasComponentP
 
     onMove(evt: React.PointerEvent) {        
         // Selection box
-        if (this._selectionBox) {
+        /*if (this._selectionBox) {
             const rootRect = this.canvasContainer.getBoundingClientRect();      
 
             const localX = evt.pageX - rootRect.left;
@@ -570,15 +569,25 @@ export class GraphCanvasComponent extends React.Component<IGraphCanvasComponentP
 
         // Move canvas
         this._rootContainer.style.cursor = "move";
+        */
+        if (this._mouseStartPointX != null && this._mouseStartPointY != null) {
 
-        if (this._mouseStartPointX === null || this._mouseStartPointY === null) {
-            return;
-        }
-        this.x += evt.clientX - this._mouseStartPointX;
-        this.y += evt.clientY - this._mouseStartPointY;
+        //this.x += evt.clientX - this._mouseStartPointX;
+        //this.y += evt.clientY - this._mouseStartPointY;
+
+        var x = this._mouseStartPointX;
+        var y = this._mouseStartPointY;
+        this._guiNodes.forEach(element => {
+            element._onMove(new BABYLON.Vector2(evt.clientX, evt.clientY), 
+            new BABYLON.Vector2( x, y));
+        });
 
         this._mouseStartPointX = evt.clientX;
         this._mouseStartPointY = evt.clientY;
+
+        //doing the dragging for the gui node.
+
+     }
     }
 
     onDown(evt: React.PointerEvent<HTMLElement>) {
@@ -978,9 +987,9 @@ export class GraphCanvasComponent extends React.Component<IGraphCanvasComponentP
         var button1 = BABYLON.GUI.Button.CreateSimpleButton("but1", "Click Me");
         button1.width = "150px"
         button1.height = "40px";
-        button1.color = "white";
+        button1.color = "#FFFFFF";
         button1.cornerRadius = 20;
-        button1.background = "green";
+        button1.background = "#008000";
         button1.onPointerUpObservable.add(function() {
         });
         this._guis.push(button1);

guiEditor/src/diagram/graphNode.ts

@@ -178,14 +178,13 @@ export class GraphNode {
 
         guiNode?.onPointerUpObservable.add(evt => {
             this.isSelected = true;
-            this._onUp(evt);
+            this.clicked = false;
         });
 
-        guiNode?.onPointerDownObservable.add( evt => {this._onDown(evt);}
+        guiNode?.onPointerDownObservable.add( evt => {this.clicked = true; this._onDown(evt);}
         );
 
-        guiNode?.onPointerMoveObservable.add( evt => {this._onMove(evt);}
-        );
+        //guiNode?.onPointerMoveObservable.add( evt => {this._onMove(evt);} );
 
 
 
@@ -363,14 +362,13 @@ export class GraphNode {
         this._mouseStartPointY = null;
         //this._visual.releasePointerCapture(evt.pointerId);
     }
+    public clicked: boolean;
+    public _onMove(evt: BABYLON.Vector2, startPos: BABYLON.Vector2) {
+       
+        if(!this.clicked) return;
 
-    private _onMove(evt: BABYLON.Vector2) {
-        if (this._mouseStartPointX === null || this._mouseStartPointY === null) {
-            return;
-        }
-
-        let newX = (evt.x - this._mouseStartPointX) / this._ownerCanvas.zoom;
-        let newY = (evt.y - this._mouseStartPointY) / this._ownerCanvas.zoom;
+        let newX = (evt.x - startPos.x) ;// / this._ownerCanvas.zoom;
+        let newY = (evt.y - startPos.y) ;// / this._ownerCanvas.zoom;
 
         //for (var selectedNode of this._ownerCanvas.selectedNodes) {
         this.x += newX;