62 lines
2.1 KiB
JavaScript
62 lines
2.1 KiB
JavaScript
import * as THREE from 'three';
|
|
import { OrbitControls } from 'three/examples/jsm/controls/OrbitControls.js';
|
|
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
|
|
import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js';
|
|
import { UnrealBloomPass } from 'three/examples/jsm/postprocessing/UnrealBloomPass.js';
|
|
|
|
export function setupScene(container) {
|
|
// Scene
|
|
const scene = new THREE.Scene();
|
|
scene.background = new THREE.Color(0x050505);
|
|
scene.fog = new THREE.FogExp2(0x050505, 0.02);
|
|
|
|
// Camera
|
|
const camera = new THREE.PerspectiveCamera(
|
|
60,
|
|
window.innerWidth / window.innerHeight,
|
|
0.1,
|
|
1000
|
|
);
|
|
camera.position.set(0, 0, 30);
|
|
|
|
// Renderer
|
|
const renderer = new THREE.WebGLRenderer({ antialias: true });
|
|
renderer.setSize(window.innerWidth, window.innerHeight);
|
|
renderer.setPixelRatio(window.devicePixelRatio);
|
|
container.appendChild(renderer.domElement);
|
|
|
|
// Controls
|
|
const controls = new OrbitControls(camera, renderer.domElement);
|
|
controls.enableDamping = true;
|
|
controls.dampingFactor = 0.05;
|
|
controls.autoRotate = true;
|
|
controls.autoRotateSpeed = 0.5;
|
|
|
|
// Post-processing (Bloom)
|
|
const renderScene = new RenderPass(scene, camera);
|
|
|
|
const bloomPass = new UnrealBloomPass(
|
|
new THREE.Vector2(window.innerWidth, window.innerHeight),
|
|
1.5, // strength
|
|
0.4, // radius
|
|
0.85 // threshold
|
|
);
|
|
bloomPass.strength = 1.5;
|
|
bloomPass.radius = 0.5;
|
|
bloomPass.threshold = 0; // Make everything glow a bit if it's bright enough
|
|
|
|
const composer = new EffectComposer(renderer);
|
|
composer.addPass(renderScene);
|
|
composer.addPass(bloomPass);
|
|
|
|
// Resize handler
|
|
window.addEventListener('resize', () => {
|
|
camera.aspect = window.innerWidth / window.innerHeight;
|
|
camera.updateProjectionMatrix();
|
|
renderer.setSize(window.innerWidth, window.innerHeight);
|
|
composer.setSize(window.innerWidth, window.innerHeight);
|
|
});
|
|
|
|
return { scene, camera, renderer, composer, controls };
|
|
}
|