make it possible to change column size in the web profiler (#8180)

defold · Oct 25, 2023 · 78050aa · 78050aa
1 parent fb2c980
commit 78050aa
Show file tree

Hide file tree

Showing 5 changed files with 116 additions and 2 deletions.
diff --git a/editor/resources/engine-profiler/remotery/vis/Code/GridWindow.js b/editor/resources/engine-profiler/remotery/vis/Code/GridWindow.js
@@ -181,7 +181,7 @@ class GridWindow
         this.columns[0].headerNode.style.marginLeft = "-1px";
 
         // Setup for pan/wheel scrolling
-        this.mouseInteraction = new MouseInteraction(this.window.BodyNode);
+        this.mouseInteraction = new MouseInteraction(this.window.BodyNode, true);
         this.mouseInteraction.onMoveHandler = (mouse_state, mx, my) => this._OnMouseMove(mouse_state, mx, my);
         this.mouseInteraction.onScrollHandler = (mouse_state) => this._OnMouseScroll(mouse_state);
 
@@ -278,6 +278,25 @@ class GridWindow
 
     _OnMouseMove(mouse_state, mouse_offset_x, mouse_offset_y)
     {
+        var skipScroll = false;
+        for (let i in this.columns)
+        {
+            const column = this.columns[i];
+            const width = parseFloat(column.headerNode.style.width, 10);
+            if (column.width != width) {
+                if (width < 50) {
+                    break;
+                }
+                skipScroll = true;
+                column.width = width;
+                this._PositionHeaders();
+                break
+            }
+        }
+        if (skipScroll) {
+            return;
+        }
+
         this.scrollPos[0] = Math.min(0, this.scrollPos[0] + mouse_offset_x);
         this.scrollPos[1] = Math.min(0, this.scrollPos[1] + mouse_offset_y);
 

diff --git a/editor/resources/engine-profiler/remotery/vis/Code/MouseInteraction.js b/editor/resources/engine-profiler/remotery/vis/Code/MouseInteraction.js
@@ -1,6 +1,6 @@
 class MouseInteraction
 {
-	constructor(node)
+	constructor(node, doNotPreventMouseDown)
 	{
 		this.node = node;
 
@@ -15,6 +15,8 @@ class MouseInteraction
 		this.onHoverHandler = null;
         this.onScrollHandler = null;
 
+        this.doNotPreventMouseDown = doNotPreventMouseDown;
+
 		// Setup DOM handlers
 		DOM.Event.AddHandler(this.node, "mousedown", (evt) => this._OnMouseDown(evt));
 		DOM.Event.AddHandler(this.node, "mouseup", (evt) => this._OnMouseUp(evt));
@@ -31,6 +33,11 @@ class MouseInteraction
 		this.mouseDown = true;
 		this.lastMouseState = new Mouse.State(evt);
 		this.mouseMoved = false;
+
+		if (this.doNotPreventMouseDown) {
+			return;
+		}
+
 		DOM.Event.StopDefaultAction(evt);
 	}
 

diff --git a/editor/resources/engine-profiler/remotery/vis/Styles/Remotery.css b/editor/resources/engine-profiler/remotery/vis/Styles/Remotery.css
@@ -85,6 +85,8 @@ body
 	border-left-color:#555;
 	border-bottom-color:#111;
 	border-right-color:#111;
+
+    resize:horizontal;
 }
 
 .TimelineBox

diff --git a/engine/dlib/src/remotery/issue-8146.patch b/engine/dlib/src/remotery/issue-8146.patch
@@ -0,0 +1,85 @@
+diff --git a/editor/resources/engine-profiler/remotery/vis/Code/GridWindow.js b/editor/resources/engine-profiler/remotery/vis/Code/GridWindow.js
+index d989b8d642..0f597443d7 100644
+--- a/editor/resources/engine-profiler/remotery/vis/Code/GridWindow.js
++++ b/editor/resources/engine-profiler/remotery/vis/Code/GridWindow.js
+@@ -181,7 +181,7 @@ class GridWindow
+         this.columns[0].headerNode.style.marginLeft = "-1px";
+
+         // Setup for pan/wheel scrolling
+-        this.mouseInteraction = new MouseInteraction(this.window.BodyNode);
++        this.mouseInteraction = new MouseInteraction(this.window.BodyNode, true);
+         this.mouseInteraction.onMoveHandler = (mouse_state, mx, my) => this._OnMouseMove(mouse_state, mx, my);
+         this.mouseInteraction.onScrollHandler = (mouse_state) => this._OnMouseScroll(mouse_state);
+
+@@ -278,6 +278,25 @@ class GridWindow
+
+     _OnMouseMove(mouse_state, mouse_offset_x, mouse_offset_y)
+     {
++        var skipScroll = false;
++        for (let i in this.columns)
++        {
++            const column = this.columns[i];
++            const width = parseFloat(column.headerNode.style.width, 10);
++            if (column.width != width) {
++                if (width < 50) {
++                    break;
++                }
++                skipScroll = true;
++                column.width = width;
++                this._PositionHeaders();
++                break
++            }
++        }
++        if (skipScroll) {
++            return;
++        }
++        
+         this.scrollPos[0] = Math.min(0, this.scrollPos[0] + mouse_offset_x);
+         this.scrollPos[1] = Math.min(0, this.scrollPos[1] + mouse_offset_y);
+
+diff --git a/editor/resources/engine-profiler/remotery/vis/Code/MouseInteraction.js b/editor/resources/engine-profiler/remotery/vis/Code/MouseInteraction.js
+index 41fd187d5a..7b45e87777 100644
+--- a/editor/resources/engine-profiler/remotery/vis/Code/MouseInteraction.js
++++ b/editor/resources/engine-profiler/remotery/vis/Code/MouseInteraction.js
+@@ -1,6 +1,6 @@
+ class MouseInteraction
+ {
+-	constructor(node)
++	constructor(node, doNotPreventMouseDown)
+ 	{
+ 		this.node = node;
+
+@@ -15,6 +15,8 @@ class MouseInteraction
+ 		this.onHoverHandler = null;
+         this.onScrollHandler = null;
+
++        this.doNotPreventMouseDown = doNotPreventMouseDown;
++
+ 		// Setup DOM handlers
+ 		DOM.Event.AddHandler(this.node, "mousedown", (evt) => this._OnMouseDown(evt));
+ 		DOM.Event.AddHandler(this.node, "mouseup", (evt) => this._OnMouseUp(evt));
+@@ -31,6 +33,11 @@ class MouseInteraction
+ 		this.mouseDown = true;
+ 		this.lastMouseState = new Mouse.State(evt);
+ 		this.mouseMoved = false;
++
++		if (this.doNotPreventMouseDown) {
++			return;
++		}
++		
+ 		DOM.Event.StopDefaultAction(evt);
+ 	}
+
+diff --git a/editor/resources/engine-profiler/remotery/vis/Styles/Remotery.css b/editor/resources/engine-profiler/remotery/vis/Styles/Remotery.css
+index 6a384f9cb5..5c2aeb726a 100644
+--- a/editor/resources/engine-profiler/remotery/vis/Styles/Remotery.css
++++ b/editor/resources/engine-profiler/remotery/vis/Styles/Remotery.css
+@@ -85,6 +85,8 @@ body
+ 	border-left-color:#555;
+ 	border-bottom-color:#111;
+ 	border-right-color:#111;
++
++    resize:horizontal;
+ }
+
+ .TimelineBox
diff --git a/engine/dlib/src/remotery/update_remotery.sh b/engine/dlib/src/remotery/update_remotery.sh
@@ -48,6 +48,7 @@ echo "Applying patch"
 # but we need a patched version to be served from the editor
 cp -v ${DEFOLD_REPO}/editor/resources/engine-profiler/remotery/vis/index.html ${DEFOLD_REPO}/editor/resources/engine-profiler/remotery/vis/orig.index.html
 (cd ${DEFOLD_REPO} && git apply ./engine/dlib/src/remotery/defoldvis.patch)
+(cd ${DEFOLD_REPO} && git apply ./engine/dlib/src/remotery/issue-8146.patch)
 cp -v ${DEFOLD_REPO}/editor/resources/engine-profiler/remotery/vis/index.html ${DEFOLD_REPO}/editor/resources/engine-profiler/remotery/vis/patched.index.html
 mv -v ${DEFOLD_REPO}/editor/resources/engine-profiler/remotery/vis/orig.index.html ${DEFOLD_REPO}/editor/resources/engine-profiler/remotery/vis/index.html