diff --git a/pkgs/clan-app/ui/src/scene/cubes.css b/pkgs/clan-app/ui/src/scene/cubes.css
index 063fe6ad8..f5cdc2d2e 100644
--- a/pkgs/clan-app/ui/src/scene/cubes.css
+++ b/pkgs/clan-app/ui/src/scene/cubes.css
@@ -1,7 +1,6 @@
.cubes-scene-container {
width: 100%;
height: 100vh;
- cursor: pointer;
}
/*
diff --git a/pkgs/clan-app/ui/src/scene/cubes.tsx b/pkgs/clan-app/ui/src/scene/cubes.tsx
index 611e1ed3d..15b130c73 100644
--- a/pkgs/clan-app/ui/src/scene/cubes.tsx
+++ b/pkgs/clan-app/ui/src/scene/cubes.tsx
@@ -21,6 +21,7 @@ import { Accessor } from "solid-js";
import { renderLoop } from "./RenderLoop";
import { ObjectRegistry } from "./ObjectRegistry";
import { MachineManager } from "./MachineManager";
+import cx from "classnames";
function garbageCollectGroup(group: THREE.Group) {
for (const child of group.children) {
@@ -101,6 +102,8 @@ export function CubeScene(props: {
const [positionMode, setPositionMode] = createSignal<"grid" | "circle">(
"grid",
);
+ // Managed by controls
+ const [isDragging, setIsDragging] = createSignal(false);
const [cursorPosition, setCursorPosition] = createSignal<[number, number]>();
@@ -273,6 +276,13 @@ export function CubeScene(props: {
bgCamera,
);
+ controls.addEventListener("start", (e) => {
+ setIsDragging(true);
+ });
+ controls.addEventListener("end", (e) => {
+ setIsDragging(false);
+ });
+
// Lighting
const ambientLight = new THREE.AmbientLight(0xd9f2f7, 0.72);
scene.add(ambientLight);
@@ -582,7 +592,17 @@ export function CubeScene(props: {
return (
<>
-