2024-04-09 02:40:12 +00:00
|
|
|
/*
|
|
|
|
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
|
|
|
|
*/
|
|
|
|
|
|
|
|
|
2024-04-08 20:07:24 +00:00
|
|
|
import { PointLight } from 'three';
|
|
|
|
import './style.css';
|
|
|
|
import {OrbitControls} from 'three/examples/jsm/controls/OrbitControls';
|
2024-02-15 20:59:21 +00:00
|
|
|
import * as THREE from 'three';
|
|
|
|
|
|
|
|
|
2024-04-08 21:50:33 +00:00
|
|
|
|
2024-02-15 20:59:21 +00:00
|
|
|
const scene = new THREE.Scene();
|
|
|
|
|
2024-04-08 21:50:33 +00:00
|
|
|
|
|
|
|
|
|
|
|
|
2024-02-15 20:59:21 +00:00
|
|
|
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);
|
|
|
|
|
|
|
|
|
|
|
|
|
2024-04-08 20:07:24 +00:00
|
|
|
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);
|
|
|
|
|
|
|
|
|
2024-04-08 20:10:16 +00:00
|
|
|
const gridHelper = new THREE.GridHelper(200, 50);
|
|
|
|
scene.add(gridHelper, lightHelper);
|
|
|
|
|
2024-04-08 21:50:33 +00:00
|
|
|
const controls = new OrbitControls(camera, renderer.domElement);
|
|
|
|
|
2024-04-09 02:40:12 +00:00
|
|
|
|
2024-04-10 03:51:27 +00:00
|
|
|
//beggining of creating floor
|
|
|
|
const floorTexture = new THREE.TextureLoader().load("marble.jpg");
|
|
|
|
floorTexture.wrapT = THREE.RepeatWrapping;
|
|
|
|
floorTexture.wrapS = THREE.RepeatWrapping;
|
|
|
|
floorTexture.repeat.set(1, 10);
|
|
|
|
const floorGeometry = new THREE.PlaneGeometry(100, 1000, 1000, 1000);
|
|
|
|
const floorMaterial = new THREE.MeshStandardMaterial({
|
|
|
|
map: floorTexture,
|
|
|
|
})
|
|
|
|
const floor = new THREE.Mesh(floorGeometry, floorMaterial);
|
|
|
|
floor.rotateX(200);
|
|
|
|
scene.add(floor);
|
2024-04-09 02:40:12 +00:00
|
|
|
|
2024-04-08 20:10:16 +00:00
|
|
|
|
2024-04-08 20:07:24 +00:00
|
|
|
|
2024-02-15 20:59:21 +00:00
|
|
|
function animate(){
|
|
|
|
requestAnimationFrame(animate);
|
|
|
|
|
|
|
|
renderer.render(scene, camera)
|
|
|
|
}
|
2024-04-10 03:51:27 +00:00
|
|
|
animate();
|