From 7759197b030bdadce618e413bc7212819721d3d2 Mon Sep 17 00:00:00 2001
From: Bradley Shellnut <bradleyshellnut@protonmail.com>
Date: Thu, 5 May 2022 11:30:38 -0700
Subject: [PATCH] Add collision to the cubes and rotation to cubes.

---
 src/lib/Box.svelte      | 16 ++++++++++++----
 src/routes/index.svelte | 11 ++++++++++-
 2 files changed, 22 insertions(+), 5 deletions(-)

diff --git a/src/lib/Box.svelte b/src/lib/Box.svelte
index 7fd05bd..5b8b549 100644
--- a/src/lib/Box.svelte
+++ b/src/lib/Box.svelte
@@ -2,12 +2,20 @@
   import * as SC from 'svelte-cubed';
   import * as THREE from 'three';
   import * as PE from 'svelte-cannon';
+  import * as CANNON from 'cannon-es';
 
-  const position = PE.writableVec3(0,5,0);
+  const position = PE.writableVec3(0, 5, 0);
+  let rotation = PE.writableVec3(0, 0, 0);
+  let velocity = new CANNON.Vec3(1, 1, 1);
 </script>
 
-<PE.Body mass={1} bind:position={$position}>
-  <PE.Box size={[1,1,1]} />
+<PE.Body on:collide={(e) => console.log(e)} mass={1} bind:position={$position} bind:rotation={$rotation} {velocity}>
+  <PE.Box size={[0.5,0.5,0.5]} />
 </PE.Body>
 
-<SC.Mesh geometry={new THREE.BoxGeometry()} position={$position.toArray()} />
\ No newline at end of file
+<SC.Mesh
+  castShadow
+  rotation={$rotation.toArray()}
+  geometry={new THREE.BoxGeometry()}
+  position={$position.toArray()}
+/>
\ No newline at end of file
diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index caea7a4..08e59bb 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -3,20 +3,29 @@
   import * as THREE from 'three';
   import * as PE from 'svelte-cannon';
   import Box from '$lib/Box.svelte';
+
+  let count = 1;
 </script>
 
+<svelte:window on:click={() => count += 1} />
+
 <PE.World gravity={[0, -9.8 ,0]}>
   <SC.Canvas antialias shadows>
     <PE.Body mass={0} rotation={[-Math.PI / 2, 0, 0]}>
       <PE.Plane />
     </PE.Body>
     <SC.Mesh
+      receiveShadow
       geometry={new THREE.PlaneGeometry(50, 50)}
       rotation={[-Math.PI / 2, 0, 0]}
       material={new THREE.MeshStandardMaterial({ color: "grey"})}
     />
-    <Box />
+    {#each {length: count } as _}
+      <Box />
+    {/each}
+    <SC.DirectionalLight intensity={1} position={[15,15,15]} shadow={{ mapSize: [2048, 2048]}} />
     <SC.AmbientLight intensity={1} />
     <SC.PerspectiveCamera position={[ 2, 2, 15 ]} target={[0,0,0]} />
+    <SC.OrbitControls />
   </SC.Canvas>
 </PE.World>
\ No newline at end of file