/* Author: Daniel Jones IDE: VSCodium Browsers tested: Firefox 124 Last change: 04/08/24 purpose: portfolio website to show to potential freelance customers/web developer positions */ import { PointLight } from 'three'; import './style.css'; import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls'; import * as THREE from 'three'; const scene = new THREE.Scene(); const camera = new THREE.PerspectiveCamera(75, window.innerWidth / window.innerHeight, 0.1, 1000); const renderer = new THREE.WebGLRenderer({ canvas: document.querySelector('#bg'), }); renderer.setPixelRatio(window.devicePixelRatio); renderer.setSize(window.innerWidth, window.innerHeight); camera.position.setZ(30); renderer.render(scene, camera); const pointLight = new PointLight(0xffffff, 150); const ambientLight = new THREE.AmbientLight(0xffffff); scene.add(ambientLight, pointLight); pointLight.position.set(10, 10, 10); const lightHelper = new THREE.PointLightHelper(pointLight); const gridHelper = new THREE.GridHelper(200, 50); scene.add(gridHelper, lightHelper); const controls = new OrbitControls(camera, renderer.domElement); const geometry = new THREE.PlaneGeometry(100, 100, 100, 100); const mirrorMaterial = new THREE.MeshBasicMaterial( { color: 0x111111, envMap: camera.renderTarget } ); const material = new THREE.MeshBasicMaterial( {color: 0xffffff, side: THREE.DoubleSide} ); const plane = new THREE.Mesh( geometry, mirrorMaterial ); plane.rotateX(200); scene.add( plane ); const circleGeometry = new THREE.SphereGeometry(10, 10, 10, 10); const sphere = new THREE.Mesh(circleGeometry, material); sphere.position.y += 15 scene.add(sphere); function getRandomInt(max) { return Math.floor(Math.random() * max); } scene.background = "black"; function animate(){ requestAnimationFrame(animate); renderer.render(scene, camera) } animate();