diff --git a/src/app/page.tsx b/src/app/page.tsx index 6f666b7..68f5f51 100644 --- a/src/app/page.tsx +++ b/src/app/page.tsx @@ -10,9 +10,9 @@ import Image from 'next/image' export default function Home() { const [currentCrt, setCrt] = useState(false) - let scanlines:string = currentCrt ? styles.scanlines : styles.hidden; - let scanner:string = currentCrt ? styles.scanner : styles.hidden; - let bright:string = currentCrt ? styles.bright : styles.main; + const scanlines:string = currentCrt ? styles.scanlines : styles.hidden; + const scanner:string = currentCrt ? styles.scanner : styles.hidden; + const bright:string = currentCrt ? styles.bright : styles.main; return ( diff --git a/src/components/Model.tsx b/src/components/Model.tsx index 1d97526..61fcef3 100644 --- a/src/components/Model.tsx +++ b/src/components/Model.tsx @@ -1,31 +1,27 @@ import React, { useEffect, useRef } from 'react'; -import * as THREE from 'three'; +import { WebGLRenderer, Scene, PerspectiveCamera, SphereGeometry, EdgesGeometry, LineBasicMaterial, LineSegments } from 'three'; const Sphere = () => { const canvasRef = useRef(null!); useEffect(() => { const canvas = canvasRef.current; - const renderer = new THREE.WebGLRenderer({ canvas, alpha: true }); + const renderer = new WebGLRenderer({ canvas, alpha: true }); - const scene = new THREE.Scene(); - const camera = new THREE.PerspectiveCamera(30, 1, 0.1, 1000); + const scene = new Scene(); + const camera = new PerspectiveCamera(30, 1, 0.1, 1000); camera.position.z = 5; camera.rotateZ(-0.2); - const geometry = new THREE.SphereGeometry(1, 22, 22, 0, Math.PI * 2, 0, Math.PI * 2); - const edges = new THREE.EdgesGeometry(geometry); - const material = new THREE.LineBasicMaterial({ color: 0xffffff }); - const sphere = new THREE.LineSegments(edges, material); + const geometry = new SphereGeometry(1, 22, 22, 0, Math.PI * 2, 0, Math.PI * 2); + const edges = new EdgesGeometry(geometry); + const material = new LineBasicMaterial({ color: 0xffffff }); + const sphere = new LineSegments(edges, material); scene.add(sphere); - /* sphere.rotation.z = 10 */ const animate = () => { requestAnimationFrame(animate); - - /* sphere.rotation.x += 0.01; */ sphere.rotation.y += 0.01; - renderer.render(scene, camera); }; diff --git a/src/components/Typewriter.tsx b/src/components/Typewriter.tsx index 917f764..9e7ed8f 100644 --- a/src/components/Typewriter.tsx +++ b/src/components/Typewriter.tsx @@ -6,16 +6,17 @@ const Typewriter = ({ text }: { text:string }) => { const [currentText, setCurrentText] = useState(''); useEffect(() => { - if (index.current < text.length) { - const nextChar: string = text.charAt(index.current); - const timer = setTimeout(() => { - setCurrentText(val => val + nextChar); - index.current++; - }, 80); - - return () => clearTimeout(timer); + if (index.current < text.length) + { + const nextChar: string = text.charAt(index.current); + const timer = setTimeout(() => { + setCurrentText(val => val + nextChar); + index.current++; + }, 80); + + return () => clearTimeout(timer); } - }, [currentText, text]); + }, [currentText, text]); return

>{currentText}

};