34 lines
1.3 KiB
JavaScript
34 lines
1.3 KiB
JavaScript
import * as THREE from 'three';
|
|
import { state } from '../state.js';
|
|
import { EffectComposer } from 'three/examples/jsm/postprocessing/EffectComposer.js';
|
|
import { RenderPass } from 'three/examples/jsm/postprocessing/RenderPass.js';
|
|
import { OutputPass } from 'three/examples/jsm/postprocessing/OutputPass.js';
|
|
import { UnrealBloomPass } from 'three/addons/postprocessing/UnrealBloomPass.js';
|
|
|
|
export function initPostprocessing() {
|
|
const composer = new EffectComposer(state.renderer);
|
|
|
|
// 1. The first pass is always to render the scene itself.
|
|
const renderPass = new RenderPass(state.scene, state.camera);
|
|
composer.addPass(renderPass);
|
|
|
|
const resolution = new THREE.Vector2( window.innerWidth, window.innerHeight );
|
|
const bloomPass = new UnrealBloomPass( resolution, 0.9, 0.1, 0.6 );
|
|
composer.addPass( bloomPass );
|
|
|
|
// 3. Add an output pass to render the final result to the screen.
|
|
const outputPass = new OutputPass();
|
|
composer.addPass(outputPass);
|
|
|
|
// Store the composer and passes in the global state
|
|
state.composer = composer;
|
|
}
|
|
|
|
export function onResizePostprocessing() {
|
|
if (state.composer) {
|
|
state.composer.setSize(window.innerWidth, window.innerHeight);
|
|
}
|
|
if (state.ssaoPass) {
|
|
state.ssaoPass.setSize(window.innerWidth, window.innerHeight);
|
|
}
|
|
} |