diff --git a/index.html b/index.html
index 09375a8..fa453bd 100644
--- a/index.html
+++ b/index.html
@@ -8,10 +8,18 @@
body { margin: 0; overflow: hidden; }
+
+
-
-
+
diff --git a/main.js b/main.js
index 19c2b54..e2c093c 100644
--- a/main.js
+++ b/main.js
@@ -1,6 +1,8 @@
-// TODO: orbit camera
// TODO: meshes for puzzle pieces
+import * as THREE from 'three';
+import { OrbitControls } from 'three/addons/controls/OrbitControls.js';
+
// Initialise scene
const scene = new THREE.Scene();
const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000);
@@ -19,6 +21,9 @@ scene.add(directionalLight.target);
// Position the camera
camera.position.z = 5;
+const controls = new OrbitControls(camera, renderer.domElement);
+controls.enableDamping = true;
+controls.update();
function makeCube(xCoord) {
const geometry = new THREE.BoxGeometry();
@@ -46,6 +51,7 @@ function animate() {
cube.rotation.y += 0.01;
}
+ controls.update();
renderer.render(scene, camera);
}
animate();