From e6a39af87e64fe708ca238b97572d86e65b4eba9 Mon Sep 17 00:00:00 2001
From: Bradley Shellnut <bradleyshellnut@protonmail.com>
Date: Wed, 4 May 2022 12:40:27 -0700
Subject: [PATCH] Adding shadows and spin the star.

---
 src/routes/index.svelte | 17 ++++++++++++-----
 1 file changed, 12 insertions(+), 5 deletions(-)

diff --git a/src/routes/index.svelte b/src/routes/index.svelte
index d4dbdad..9290ea9 100644
--- a/src/routes/index.svelte
+++ b/src/routes/index.svelte
@@ -3,25 +3,32 @@
   import { GLTFLoader } from 'three/examples/jsm/loaders/GLTFLoader';
   import * as SC from 'svelte-cubed';
   let star;
-  let loader = new GLTFLoader();
+  let rotation = 0;
 
+  let loader = new GLTFLoader();
   loader.load('star.gltf', (gltf) => {
     star = gltf.scene.children[0].geometry;
   });
+
+  SC.onFrame(() => {
+    rotation += 0.01
+  })
 </script>
 
-<SC.Canvas antialias alpha>
+<SC.Canvas antialias alpha shadows>
   <SC.Mesh
     geometry={star}
-    rotation={[-90, 0, 0]}
+    rotation={[-90, 0, rotation]}
     material={new THREE.MeshStandardMaterial({
       color: 0xffff00,
       roughness: 0,
       metalness: 0.7,
     })}
+    castShadow
   />
   <SC.Group position={[ 0, -2, 0 ]}>
     <SC.Mesh
+      receiveShadow
       geometry={new THREE.PlaneGeometry(100,100)}
       material={new THREE.MeshStandardMaterial({ color: 'grey' })}
       rotation={[-Math.PI / 2, 0, 0]}
@@ -31,10 +38,10 @@
       object={new THREE.GridHelper(100, 100, 0x444444, 0x555555)}
     />
   </SC.Group>
-  <SC.PerspectiveCamera position={[3, 3, 3]} />
+  <SC.PerspectiveCamera position={[3, 1, 3]} />
   <SC.OrbitControls />
   <SC.AmbientLight intensity={1} />
-  <SC.DirectionalLight intensity={0.7} />
+  <SC.DirectionalLight shadow={{ mapSize: [ 2048, 2048 ] }} intensity={0.7} />
   <SC.PointLight intensity={1} position={[2, 5, 2]} />
 </SC.Canvas>