refactor: replace GSAP with Timer for animation updates

src/script.js

@@ -1,6 +1,7 @@
 import './style.css'
 import * as THREE from 'three'
-import gsap from 'gsap'
+import { Timer } from 'three/addons/misc/Timer.js'
+// import gsap from 'gsap'
 
 // Canvas
 const canvas = document.querySelector('canvas.webgl')
@@ -33,8 +34,10 @@ renderer.setSize(sizes.width, sizes.height)
 
 // Clock
 // const clock = new THREE.Clock()
-gsap.to(mesh.position, { x: 2, duration: 1, delay: 1})
+// gsap.to(mesh.position, { x: 2, duration: 1, delay: 1})
-gsap.to(mesh.position, { x: 0, duration: 1, delay: 2})
+// gsap.to(mesh.position, { x: 0, duration: 1, delay: 2})
+const timer = new Timer()
+timer.connect(document) // Connect the timer to the document to receive updates
 
 
 // Animations
@@ -42,12 +45,14 @@ const tick = () => {
 
     // // Clock
     // const elapsedTime = clock.getElapsedTime()
+    timer.update() // Update the timer to get the latest elapsed time
+    const elapsedTime = timer.getElapsed()
 
-    // // Update objects
+    // Update objects
-    // mesh.rotation.y = elapsedTime * Math.PI * 2
+    mesh.rotation.y = elapsedTime * Math.PI * 2
-    // mesh.position.y = Math.sin(elapsedTime)
+    mesh.position.y = Math.sin(elapsedTime)
-    // mesh.position.x = Math.cos(elapsedTime)
+    mesh.position.x = Math.cos(elapsedTime)
-    // camera.lookAt(mesh.position)
+    camera.lookAt(mesh.position)
     
     // Renderer
     renderer.render(scene, camera)