Improve background animation

iaincollins · Sep 12, 2024 · 1f4f452 · 1f4f452
1 parent a3a48ff
commit 1f4f452
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ardent-www",
-  "version": "0.47.0",
+  "version": "0.47.1",
   "description": "Ardent Industry",
   "main": "index.js",
   "scripts": {

diff --git a/pages/_app.js b/pages/_app.js
@@ -1,4 +1,5 @@
 import React, { useRef } from 'react'
+import { Color, BoxGeometry, CylinderGeometry, BufferAttribute, Vector3, Clock, MathUtils } from 'three'
 import App from 'next/app'
 import Head from 'next/head'
 import Header from 'components/header'
@@ -35,13 +36,18 @@ export default class MyApp extends App {
 
 function Sphere (props) {
   const ref = useRef()
-  useFrame((state, delta) => (ref.current.rotation.y += (delta / 32)))
+  useFrame((state, delta) => {
+    ;(ref.current.rotation.y -= (delta / 32 * 1))
+    ;(ref.current.rotation.z -= (delta / 32 / 2))
+  })
+
   return (
     <group
       {...props}
       ref={ref}
       position={[3, 0, 0]}
       scale={2}
+      rotation={[-10,0,0]}
     >
       <mesh>
         <sphereGeometry args={[2, 64, 64]} />
@@ -51,6 +57,14 @@ function Sphere (props) {
         <sphereGeometry args={[2, 64, 64]} />
         <meshStandardMaterial color='#666' vertexColors flatShading />
       </mesh>
+      <mesh>
+        <sphereGeometry args={[2.8, 64, 64]} />
+        <meshStandardMaterial color='#999' wireframe />
+      </mesh>
+      <mesh>
+        <sphereGeometry args={[3, 16, 16]} />
+        <meshStandardMaterial color='#ccc' wireframe />
+      </mesh>
     </group>
   )
 }