Fix transform controls

nerfstudio-project · Jun 30, 2023 · 92fbfa7 · 92fbfa7
1 parent 5e81baf
commit 92fbfa7
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 13 deletions.
diff --git a/viser/client/build/asset-manifest.json b/viser/client/build/asset-manifest.json
@@ -1,13 +1,13 @@
 {
   "files": {
     "main.css": "/static/css/main.82973013.css",
-    "main.js": "/static/js/main.9be61952.js",
+    "main.js": "/static/js/main.7623e1a3.js",
     "index.html": "/index.html",
     "main.82973013.css.map": "/static/css/main.82973013.css.map",
-    "main.9be61952.js.map": "/static/js/main.9be61952.js.map"
+    "main.7623e1a3.js.map": "/static/js/main.7623e1a3.js.map"
   },
   "entrypoints": [
     "static/css/main.82973013.css",
-    "static/js/main.9be61952.js"
+    "static/js/main.7623e1a3.js"
   ]
 }
diff --git a/viser/client/build/index.html b/viser/client/build/index.html
@@ -1 +1 @@
-<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.svg"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>Viser</title><script defer="defer" src="/static/js/main.9be61952.js"></script><link href="/static/css/main.82973013.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
+<!doctype html><html lang="en"><head><meta charset="utf-8"/><link rel="icon" href="/favicon.svg"/><meta name="viewport" content="width=device-width,initial-scale=1"/><meta name="theme-color" content="#000000"/><meta name="description" content="Web site created using create-react-app"/><link rel="apple-touch-icon" href="/logo192.png"/><link rel="manifest" href="/manifest.json"/><title>Viser</title><script defer="defer" src="/static/js/main.7623e1a3.js"></script><link href="/static/css/main.82973013.css" rel="stylesheet"></head><body><noscript>You need to enable JavaScript to run this app.</noscript><div id="root"></div></body></html>
diff --git a/viser/client/src/SceneTree.tsx b/viser/client/src/SceneTree.tsx
@@ -262,24 +262,30 @@ export function SceneNodeThreeObject(props: { name: string }) {
     if (obj === null) return;
 
     const nodeAttributes = viewer.nodeAttributesFromName.current[props.name];
-    const wxyz = nodeAttributes?.wxyz;
-    const position = nodeAttributes?.position;
-    const visibility = nodeAttributes?.visibility;
+    if (nodeAttributes === undefined) return;
+
+    const visibility = nodeAttributes.visibility;
+    if (visibility !== undefined) {
+      obj.visible = visibility;
+    }
 
     let changed = false;
-    if (visibility !== undefined) obj.visible = visibility;
+    const wxyz = nodeAttributes.wxyz;
     if (wxyz !== undefined) {
       changed = true;
       obj.quaternion.set(wxyz[1], wxyz[2], wxyz[3], wxyz[0]);
     }
+    const position = nodeAttributes.position;
     if (position !== undefined) {
       changed = true;
       obj.position.set(position[0], position[1], position[2]);
     }
 
     // Update matrices if necessary. This is necessary for PivotControls.
-    if (changed && !obj.matrixAutoUpdate) obj.updateMatrix();
-    if (changed && !obj.matrixWorldAutoUpdate) obj.updateMatrixWorld();
+    if (changed) {
+      if (!obj.matrixAutoUpdate) obj.updateMatrix();
+      if (!obj.matrixWorldAutoUpdate) obj.updateMatrixWorld();
+    }
   });
 
   // Clean up when done.

diff --git a/viser/client/src/WebsocketInterface.tsx b/viser/client/src/WebsocketInterface.tsx
@@ -301,7 +301,7 @@ function useMessageHandler() {
         const name = message.name;
         const sendDragMessage = makeThrottledMessageSender(
           viewer.websocketRef,
-          25
+          50
         );
         addSceneNodeMakeParents(
           new SceneNode<THREE.Group>(message.name, (ref) => (
@@ -320,14 +320,23 @@ function useMessageHandler() {
               depthTest={message.depth_test}
               opacity={message.opacity}
               onDrag={(l) => {
+                const attrs = viewer.nodeAttributesFromName.current;
+                if (attrs[message.name] === undefined) {
+                  attrs[message.name] = {};
+                }
+
                 const wxyz = new THREE.Quaternion();
                 wxyz.setFromRotationMatrix(l);
                 const position = new THREE.Vector3().setFromMatrixPosition(l);
+
+                const nodeAttributes = attrs[message.name]!;
+                nodeAttributes.wxyz = [wxyz.w, wxyz.x, wxyz.y, wxyz.z];
+                nodeAttributes.position = position.toArray();
                 sendDragMessage({
                   type: "TransformControlsUpdateMessage",
                   name: name,
-                  wxyz: [wxyz.w, wxyz.x, wxyz.y, wxyz.z],
-                  position: position.toArray(),
+                  wxyz: nodeAttributes.wxyz,
+                  position: nodeAttributes.position,
                 });
               }}
             />