Updated package versions.

Earthmark · Jun 23, 2022 · 662a781 · 662a781
1 parent ee6cd1b
commit 662a781
Show file tree

Hide file tree

Showing 11 changed files with 5,314 additions and 4,719 deletions.
diff --git a/examples/box/MoreComplicatedBox.tsx b/examples/box/MoreComplicatedBox.tsx
@@ -1,14 +1,57 @@
 import React from "react";
 import n, { useNeosRef } from "react-neos";
 
+interface Vector {
+  x: number,
+  y: number,
+  z: number,
+}
+
+function vecSub(a: Vector, b: Vector): Vector {
+  const x = a.x - b.x;
+  const y = a.y - b.y;
+  const z = a.z - b.z;
+  return { x, y, z };
+}
+
 const MoreComplicatedBox = () => {
-  const [{material}, matRefGetter] = useNeosRef(n.unlitMaterial);
-  const [{mesh}, meshRefGetter] = useNeosRef(n.boxMesh);
+  const v = vecSub({ x: 1, y: 0, z: 0 }, { x: 0, y: 0, z: 0 });
+
+  const [{ material }, matRefGetter] = useNeosRef(n.unlitMaterial);
+  const [{ mesh }, meshRefGetter] = useNeosRef(n.boxMesh);
+
+  const [angle, setAngle] = React.useState(() => 0.0);
+
+  React.useEffect(() => {
+    var timer = setInterval(() => setAngle(s => s + 1.2), 1000);
+    return () => clearInterval(timer);
+  });
+
+  const rotation0 = {
+    x: Math.atan2(v.x, v.y) * (180 / Math.PI) + angle,
+    y: Math.atan2(v.x, v.z) * (180 / Math.PI)
+  }
+  const rotation1 = {
+    x: Math.atan2(v.x, v.y) * (180 / Math.PI) + angle + 60,
+    y: Math.atan2(v.x, v.z) * (180 / Math.PI)
+  }
+  const rotation2 = {
+    x: Math.atan2(v.x, v.y) * (180 / Math.PI) + angle + 120,
+    y: Math.atan2(v.x, v.z) * (180 / Math.PI)
+  }
 
   return <n.transform>
-    <n.unlitMaterial color={{r: 0.25}} ref={matRefGetter} />
-    <n.boxMesh ref={meshRefGetter} size={{x: 0.4, y: 0.15}} />
-    <n.meshRenderer mesh={mesh} material={material} />
+    <n.unlitMaterial color={{ r: 0.25 }} ref={matRefGetter} />
+    <n.boxMesh ref={meshRefGetter} size={{ x: 0.4, y: 0.15 }} />
+    <n.transform rotation={rotation0}>
+      <n.meshRenderer position={{ z: 1 }} mesh={mesh} material={material} />
+    </n.transform>
+    <n.transform rotation={rotation1}>
+      <n.meshRenderer position={{ z: 1 }} mesh={mesh} material={material} />
+    </n.transform>
+    <n.transform rotation={rotation2}>
+      <n.meshRenderer position={{ z: 1 }} mesh={mesh} material={material} />
+    </n.transform>
   </n.transform>;
 }