diff --git a/src/lib/assets/tools/github.svg b/src/lib/assets/tools/github.svg index d5e6491..5113698 100644 --- a/src/lib/assets/tools/github.svg +++ b/src/lib/assets/tools/github.svg @@ -1 +1,8 @@ - \ No newline at end of file + + + + + + diff --git a/src/lib/assets/tools/nvm.svg b/src/lib/assets/tools/nvm.svg index 72ede62..69b2cf7 100644 --- a/src/lib/assets/tools/nvm.svg +++ b/src/lib/assets/tools/nvm.svg @@ -1,12 +1,13 @@ - + @@ -45,4 +46,4 @@ - + \ No newline at end of file diff --git a/src/lib/assets/tools/studio3t.svg b/src/lib/assets/tools/studio3t.svg index cad6e2a..11e7ae4 100644 --- a/src/lib/assets/tools/studio3t.svg +++ b/src/lib/assets/tools/studio3t.svg @@ -1,6 +1,9 @@ - - - - + + + \ No newline at end of file diff --git a/src/routes/theatre/+page.svelte b/src/routes/theatre/+page.svelte index d80ee29..71aa3c4 100644 --- a/src/routes/theatre/+page.svelte +++ b/src/routes/theatre/+page.svelte @@ -1,7 +1,8 @@ @@ -12,6 +13,8 @@ + + diff --git a/src/routes/theatre/Scene.svelte b/src/routes/theatre/Scene.svelte index 8ed3c2e..11175a2 100644 --- a/src/routes/theatre/Scene.svelte +++ b/src/routes/theatre/Scene.svelte @@ -1,18 +1,21 @@ + + + + - - - - - - + diff --git a/src/routes/toolbox/+page.svelte b/src/routes/toolbox/+page.svelte index bbfd41e..1d2ab52 100644 --- a/src/routes/toolbox/+page.svelte +++ b/src/routes/toolbox/+page.svelte @@ -27,9 +27,11 @@

- - - +
+ + + +
diff --git a/src/routes/toolbox/Scene.svelte b/src/routes/toolbox/Scene.svelte index 219732d..085a648 100644 --- a/src/routes/toolbox/Scene.svelte +++ b/src/routes/toolbox/Scene.svelte @@ -5,19 +5,40 @@ import { interactivity } from '@threlte/extras'; import { spring } from 'svelte/motion'; + import GithubFluid from './models/GithubFluid.svelte'; + import Warp from './models/Warp.svelte'; + import TerraformFlat from './models/TerraformFlat.svelte'; interactivity(); - const scale = spring(1); - let rotation = 0; + const githubScale = spring(1); + let githubRotation = 0; useFrame((state, delta) => { - rotation += delta; + githubRotation += 0.5 * delta; + }); + + const kubernetesScale = spring(1); + let kubernetesRotation = 30; + useFrame((state, delta) => { + kubernetesRotation += 0.3 * delta; + }); + + const warpScale = spring(1); + let warpRotation = 10; + useFrame((state, delta) => { + warpRotation += 0.2 * delta; + }); + + const terraformScale = spring(1); + let terraformRotation = 90; + useFrame((state, delta) => { + terraformRotation += 0.6 * delta; }); { ref.lookAt(0, 1, 0); }} @@ -26,12 +47,51 @@ scale.set(1.5)} - on:pointerleave={() => scale.set(1)} + position.x={-4} + scale={$kubernetesScale} + on:pointerenter={() => kubernetesScale.set(1.3)} + on:pointerleave={() => kubernetesScale.set(1)} /> + + + githubScale.set(1.3)} + on:pointerleave={() => githubScale.set(1)} + /> + + + + warpScale.set(1.3)} + on:pointerleave={() => warpScale.set(1)} + /> + + + + terraformScale.set(1.3)} + on:pointerleave={() => terraformScale.set(1)} + /> + + + diff --git a/src/routes/toolbox/models/GithubFluid.svelte b/src/routes/toolbox/models/GithubFluid.svelte new file mode 100644 index 0000000..8fdebb6 --- /dev/null +++ b/src/routes/toolbox/models/GithubFluid.svelte @@ -0,0 +1,46 @@ + + + + + + {#await gltf} + + {:then gltf} + + + {:catch error} + + {/await} + + + + + diff --git a/src/routes/toolbox/models/TerraformFlat.svelte b/src/routes/toolbox/models/TerraformFlat.svelte index 348b845..b2cc863 100644 --- a/src/routes/toolbox/models/TerraformFlat.svelte +++ b/src/routes/toolbox/models/TerraformFlat.svelte @@ -3,12 +3,19 @@ Auto-generated by: https://github.com/threlte/threlte/tree/main/packages/gltf Command: npx @threlte/gltf@1.0.0-next.13 ./static/models/terraform-flat.glb --transform --> -