From 98974890c8dec1455e33a9f9bae70c6614eb75eb Mon Sep 17 00:00:00 2001 From: ktyl Date: Wed, 29 Oct 2025 08:32:35 +0000 Subject: [PATCH] initial commit --- index.html | 17 +++++++++++++++++ main.js | 52 ++++++++++++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 69 insertions(+) create mode 100644 index.html create mode 100644 main.js diff --git a/index.html b/index.html new file mode 100644 index 0000000..09375a8 --- /dev/null +++ b/index.html @@ -0,0 +1,17 @@ + + + + + + + + + + + + + + + diff --git a/main.js b/main.js new file mode 100644 index 0000000..19c2b54 --- /dev/null +++ b/main.js @@ -0,0 +1,52 @@ +// TODO: orbit camera +// TODO: meshes for puzzle pieces + +// Initialise scene +const scene = new THREE.Scene(); +const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); +const renderer = new THREE.WebGLRenderer(); +renderer.setSize(window.innerWidth, window.innerHeight); +document.body.appendChild(renderer.domElement); + +// Set up lights +const ambientLight = new THREE.AmbientLight(0x404040); +scene.add(ambientLight); + +const directionalLight = new THREE.DirectionalLight(0xffffff, 0.5); +directionalLight.position.set(1, 3, 2); +scene.add(directionalLight); +scene.add(directionalLight.target); + +// Position the camera +camera.position.z = 5; + +function makeCube(xCoord) { + const geometry = new THREE.BoxGeometry(); + const material = new THREE.MeshLambertMaterial({ color: 0x00ff00 }); + const cube = new THREE.Mesh(geometry, material); + cube.position.set(xCoord, 0, 0); + scene.add(cube); + + return cube; +} + +let cubes = []; +for (let i = 0; i < 3; i++) { + const cube = makeCube((i - 1)*2); + cubes.push(cube); +} + +// Animation loop +function animate() { + requestAnimationFrame(animate); + + for (let i = 0; i < cubes.length; i++) { + const cube = cubes[i]; + cube.rotation.x += 0.01; + cube.rotation.y += 0.01; + } + + renderer.render(scene, camera); +} +animate(); +