UNPKG

@babylonjs/core

Version:

Getting started? Play directly with the Babylon.js API using our [playground](https://playground.babylonjs.com/). It also contains a lot of samples to learn how to use it.

906 lines (905 loc) 79.6 kB
/** This file must only contain pure code and pure imports */ import { __esDecorate, __runInitializers } from "../../../tslib.es6.js"; import { serialize, serializeAsTexture } from "../../../Misc/decorators.js"; import { SerializationHelper } from "../../../Misc/decorators.serialization.js"; import { Logger } from "../../../Misc/logger.js"; import { Vector2, Vector3, Matrix, Vector4 } from "../../../Maths/math.vector.pure.js"; import { Clamp } from "../../../Maths/math.scalar.functions.js"; import { Texture } from "../../../Materials/Textures/texture.pure.js"; import { PostProcess } from "../../../PostProcesses/postProcess.pure.js"; import { PostProcessRenderPipeline } from "../../../PostProcesses/RenderPipeline/postProcessRenderPipeline.js"; import { PostProcessRenderEffect } from "../../../PostProcesses/RenderPipeline/postProcessRenderEffect.js"; import { BlurPostProcess } from "../../../PostProcesses/blurPostProcess.pure.js"; import { FxaaPostProcess } from "../../../PostProcesses/fxaaPostProcess.pure.js"; import { MotionBlurPostProcess } from "../../motionBlurPostProcess.pure.js"; import { ScreenSpaceReflectionPostProcess } from "../../screenSpaceReflectionPostProcess.pure.js"; import { RegisterClass } from "../../../Misc/typeStore.js"; import { RegisterDepthRendererSceneComponent } from "../../../Rendering/depthRendererSceneComponent.pure.js"; import { DepthRenderer } from "../../../Rendering/depthRenderer.pure.js"; /* eslint-disable @typescript-eslint/naming-convention */ /** * Standard rendering pipeline * Default pipeline should be used going forward but the standard pipeline will be kept for backwards compatibility. * @see https://doc.babylonjs.com/features/featuresDeepDive/postProcesses/standardRenderingPipeline */ let StandardRenderingPipeline = (() => { var _a; let _classSuper = PostProcessRenderPipeline; let _instanceExtraInitializers = []; let _brightThreshold_decorators; let _brightThreshold_initializers = []; let _brightThreshold_extraInitializers = []; let _blurWidth_decorators; let _blurWidth_initializers = []; let _blurWidth_extraInitializers = []; let _horizontalBlur_decorators; let _horizontalBlur_initializers = []; let _horizontalBlur_extraInitializers = []; let _get_exposure_decorators; let _lensTexture_decorators; let _lensTexture_initializers = []; let _lensTexture_extraInitializers = []; let _volumetricLightCoefficient_decorators; let _volumetricLightCoefficient_initializers = []; let _volumetricLightCoefficient_extraInitializers = []; let _volumetricLightPower_decorators; let _volumetricLightPower_initializers = []; let _volumetricLightPower_extraInitializers = []; let _volumetricLightBlurScale_decorators; let _volumetricLightBlurScale_initializers = []; let _volumetricLightBlurScale_extraInitializers = []; let _hdrMinimumLuminance_decorators; let _hdrMinimumLuminance_initializers = []; let _hdrMinimumLuminance_extraInitializers = []; let _hdrDecreaseRate_decorators; let _hdrDecreaseRate_initializers = []; let _hdrDecreaseRate_extraInitializers = []; let _hdrIncreaseRate_decorators; let _hdrIncreaseRate_initializers = []; let _hdrIncreaseRate_extraInitializers = []; let _get_hdrAutoExposure_decorators; let _lensColorTexture_decorators; let _lensColorTexture_initializers = []; let _lensColorTexture_extraInitializers = []; let _lensFlareStrength_decorators; let _lensFlareStrength_initializers = []; let _lensFlareStrength_extraInitializers = []; let _lensFlareGhostDispersal_decorators; let _lensFlareGhostDispersal_initializers = []; let _lensFlareGhostDispersal_extraInitializers = []; let _lensFlareHaloWidth_decorators; let _lensFlareHaloWidth_initializers = []; let _lensFlareHaloWidth_extraInitializers = []; let _lensFlareDistortionStrength_decorators; let _lensFlareDistortionStrength_initializers = []; let _lensFlareDistortionStrength_extraInitializers = []; let _lensFlareBlurWidth_decorators; let _lensFlareBlurWidth_initializers = []; let _lensFlareBlurWidth_extraInitializers = []; let _lensStarTexture_decorators; let _lensStarTexture_initializers = []; let _lensStarTexture_extraInitializers = []; let _lensFlareDirtTexture_decorators; let _lensFlareDirtTexture_initializers = []; let _lensFlareDirtTexture_extraInitializers = []; let _depthOfFieldDistance_decorators; let _depthOfFieldDistance_initializers = []; let _depthOfFieldDistance_extraInitializers = []; let _depthOfFieldBlurWidth_decorators; let _depthOfFieldBlurWidth_initializers = []; let _depthOfFieldBlurWidth_extraInitializers = []; let _get_motionStrength_decorators; let _get_objectBasedMotionBlur_decorators; let __ratio_decorators; let __ratio_initializers = []; let __ratio_extraInitializers = []; let _get_BloomEnabled_decorators; let _get_DepthOfFieldEnabled_decorators; let _get_LensFlareEnabled_decorators; let _get_HDREnabled_decorators; let _get_VLSEnabled_decorators; let _get_MotionBlurEnabled_decorators; let _get_fxaaEnabled_decorators; let _get_screenSpaceReflectionsEnabled_decorators; let _get_volumetricLightStepsCount_decorators; let _get_motionBlurSamples_decorators; let _get_samples_decorators; return _a = class StandardRenderingPipeline extends _classSuper { /** * Gets the overall exposure used by the pipeline */ get exposure() { return this._fixedExposure; } /** * Sets the overall exposure used by the pipeline */ set exposure(value) { this._fixedExposure = value; this._currentExposure = value; } /** * Gets whether or not the exposure of the overall pipeline should be automatically adjusted by the HDR post-process */ get hdrAutoExposure() { return this._hdrAutoExposure; } /** * Sets whether or not the exposure of the overall pipeline should be automatically adjusted by the HDR post-process */ set hdrAutoExposure(value) { this._hdrAutoExposure = value; if (this.hdrPostProcess) { const defines = ["#define HDR"]; if (value) { defines.push("#define AUTO_EXPOSURE"); } this.hdrPostProcess.updateEffect(defines.join("\n")); } } /** * Gets how much the image is blurred by the movement while using the motion blur post-process */ get motionStrength() { return this._motionStrength; } /** * Sets how much the image is blurred by the movement while using the motion blur post-process */ set motionStrength(strength) { this._motionStrength = strength; if (this._isObjectBasedMotionBlur && this.motionBlurPostProcess) { this.motionBlurPostProcess.motionStrength = strength; } } /** * Gets whether or not the motion blur post-process is object based or screen based. */ get objectBasedMotionBlur() { return this._isObjectBasedMotionBlur; } /** * Sets whether or not the motion blur post-process should be object based or screen based */ set objectBasedMotionBlur(value) { const shouldRebuild = this._isObjectBasedMotionBlur !== value; this._isObjectBasedMotionBlur = value; if (shouldRebuild) { this._buildPipeline(); } } /** * @ignore * Specifies if the bloom pipeline is enabled */ get BloomEnabled() { return this._bloomEnabled; } set BloomEnabled(enabled) { if (this._bloomEnabled === enabled) { return; } this._bloomEnabled = enabled; this._buildPipeline(); } /** * @ignore * Specifies if the depth of field pipeline is enabled */ get DepthOfFieldEnabled() { return this._depthOfFieldEnabled; } set DepthOfFieldEnabled(enabled) { if (this._depthOfFieldEnabled === enabled) { return; } this._depthOfFieldEnabled = enabled; this._buildPipeline(); } /** * @ignore * Specifies if the lens flare pipeline is enabled */ get LensFlareEnabled() { return this._lensFlareEnabled; } set LensFlareEnabled(enabled) { if (this._lensFlareEnabled === enabled) { return; } this._lensFlareEnabled = enabled; this._buildPipeline(); } /** * @ignore * Specifies if the HDR pipeline is enabled */ get HDREnabled() { return this._hdrEnabled; } set HDREnabled(enabled) { if (this._hdrEnabled === enabled) { return; } this._hdrEnabled = enabled; this._buildPipeline(); } /** * @ignore * Specifies if the volumetric lights scattering effect is enabled */ get VLSEnabled() { return this._vlsEnabled; } set VLSEnabled(enabled) { if (this._vlsEnabled === enabled) { return; } if (enabled) { const geometry = this._scene.enableGeometryBufferRenderer(); if (!geometry) { Logger.Warn("Geometry renderer is not supported, cannot create volumetric lights in Standard Rendering Pipeline"); return; } } this._vlsEnabled = enabled; this._buildPipeline(); } /** * @ignore * Specifies if the motion blur effect is enabled */ get MotionBlurEnabled() { return this._motionBlurEnabled; } set MotionBlurEnabled(enabled) { if (this._motionBlurEnabled === enabled) { return; } this._motionBlurEnabled = enabled; this._buildPipeline(); } /** * Specifies if anti-aliasing is enabled */ get fxaaEnabled() { return this._fxaaEnabled; } set fxaaEnabled(enabled) { if (this._fxaaEnabled === enabled) { return; } this._fxaaEnabled = enabled; this._buildPipeline(); } /** * Specifies if screen space reflections are enabled. */ get screenSpaceReflectionsEnabled() { return this._screenSpaceReflectionsEnabled; } set screenSpaceReflectionsEnabled(enabled) { if (this._screenSpaceReflectionsEnabled === enabled) { return; } this._screenSpaceReflectionsEnabled = enabled; this._buildPipeline(); } /** * Specifies the number of steps used to calculate the volumetric lights * Typically in interval [50, 200] */ get volumetricLightStepsCount() { return this._volumetricLightStepsCount; } set volumetricLightStepsCount(count) { if (this.volumetricLightPostProcess) { this.volumetricLightPostProcess.updateEffect("#define VLS\n#define NB_STEPS " + count.toFixed(1)); } this._volumetricLightStepsCount = count; } /** * Specifies the number of samples used for the motion blur effect * Typically in interval [16, 64] */ get motionBlurSamples() { return this._motionBlurSamples; } set motionBlurSamples(samples) { if (this.motionBlurPostProcess) { if (this._isObjectBasedMotionBlur) { this.motionBlurPostProcess.motionBlurSamples = samples; } else { this.motionBlurPostProcess.updateEffect("#define MOTION_BLUR\n#define MAX_MOTION_SAMPLES " + samples.toFixed(1)); } } this._motionBlurSamples = samples; } /** * Specifies MSAA sample count, setting this to 4 will provide 4x anti aliasing. (default: 1) */ get samples() { return this._samples; } set samples(sampleCount) { if (this._samples === sampleCount) { return; } this._samples = sampleCount; this._buildPipeline(); } /** * Default pipeline should be used going forward but the standard pipeline will be kept for backwards compatibility. * @constructor * @param name The rendering pipeline name * @param scene The scene linked to this pipeline * @param ratio The size of the postprocesses (0.5 means that your postprocess will have a width = canvas.width 0.5 and a height = canvas.height 0.5) * @param originalPostProcess the custom original color post-process. Must be "reusable". Can be null. * @param cameras The array of cameras that the rendering pipeline will be attached to */ constructor(name, scene, ratio, originalPostProcess = null, cameras) { RegisterDepthRendererSceneComponent(DepthRenderer); super(scene.getEngine(), name); /** * Public members */ // Post-processes /** * Post-process which contains the original scene color before the pipeline applies all the effects */ this.originalPostProcess = __runInitializers(this, _instanceExtraInitializers); /** * Post-process used to down scale an image x4 */ this.downSampleX4PostProcess = null; /** * Post-process used to calculate the illuminated surfaces controlled by a threshold */ this.brightPassPostProcess = null; /** * Post-process array storing all the horizontal blur post-processes used by the pipeline */ this.blurHPostProcesses = []; /** * Post-process array storing all the vertical blur post-processes used by the pipeline */ this.blurVPostProcesses = []; /** * Post-process used to add colors of 2 textures (typically brightness + real scene color) */ this.textureAdderPostProcess = null; /** * Post-process used to create volumetric lighting effect */ this.volumetricLightPostProcess = null; /** * Post-process used to smooth the previous volumetric light post-process on the X axis */ this.volumetricLightSmoothXPostProcess = null; /** * Post-process used to smooth the previous volumetric light post-process on the Y axis */ this.volumetricLightSmoothYPostProcess = null; /** * Post-process used to merge the volumetric light effect and the real scene color */ this.volumetricLightMergePostProces = null; /** * Post-process used to store the final volumetric light post-process (attach/detach for debug purpose) */ this.volumetricLightFinalPostProcess = null; /** * Base post-process used to calculate the average luminance of the final image for HDR */ this.luminancePostProcess = null; /** * Post-processes used to create down sample post-processes in order to get * the average luminance of the final image for HDR * Array of length "StandardRenderingPipeline.LuminanceSteps" */ this.luminanceDownSamplePostProcesses = []; /** * Post-process used to create a HDR effect (light adaptation) */ this.hdrPostProcess = null; /** * Post-process used to store the final texture adder post-process (attach/detach for debug purpose) */ this.textureAdderFinalPostProcess = null; /** * Post-process used to store the final lens flare post-process (attach/detach for debug purpose) */ this.lensFlareFinalPostProcess = null; /** * Post-process used to merge the final HDR post-process and the real scene color */ this.hdrFinalPostProcess = null; /** * Post-process used to create a lens flare effect */ this.lensFlarePostProcess = null; /** * Post-process that merges the result of the lens flare post-process and the real scene color */ this.lensFlareComposePostProcess = null; /** * Post-process used to create a motion blur effect */ this.motionBlurPostProcess = null; /** * Post-process used to create a depth of field effect */ this.depthOfFieldPostProcess = null; /** * The Fast Approximate Anti-Aliasing post process which attempts to remove aliasing from an image. */ this.fxaaPostProcess = null; /** * Post-process used to simulate realtime reflections using the screen space and geometry renderer. */ this.screenSpaceReflectionPostProcess = null; // Values /** * Represents the brightness threshold in order to configure the illuminated surfaces */ this.brightThreshold = __runInitializers(this, _brightThreshold_initializers, 1.0); /** * Configures the blur intensity used for surexposed surfaces are highlighted surfaces (light halo) */ this.blurWidth = (__runInitializers(this, _brightThreshold_extraInitializers), __runInitializers(this, _blurWidth_initializers, 512.0)); /** * Sets if the blur for highlighted surfaces must be only horizontal */ this.horizontalBlur = (__runInitializers(this, _blurWidth_extraInitializers), __runInitializers(this, _horizontalBlur_initializers, false)); /** * Texture used typically to simulate "dirty" on camera lens */ this.lensTexture = (__runInitializers(this, _horizontalBlur_extraInitializers), __runInitializers(this, _lensTexture_initializers, null)); /** * Represents the offset coefficient based on Rayleigh principle. Typically in interval [-0.2, 0.2] */ this.volumetricLightCoefficient = (__runInitializers(this, _lensTexture_extraInitializers), __runInitializers(this, _volumetricLightCoefficient_initializers, 0.2)); /** * The overall power of volumetric lights, typically in interval [0, 10] maximum */ this.volumetricLightPower = (__runInitializers(this, _volumetricLightCoefficient_extraInitializers), __runInitializers(this, _volumetricLightPower_initializers, 4.0)); /** * Used the set the blur intensity to smooth the volumetric lights */ this.volumetricLightBlurScale = (__runInitializers(this, _volumetricLightPower_extraInitializers), __runInitializers(this, _volumetricLightBlurScale_initializers, 64.0)); /** * Light (spot or directional) used to generate the volumetric lights rays * The source light must have a shadow generate so the pipeline can get its * depth map */ this.sourceLight = (__runInitializers(this, _volumetricLightBlurScale_extraInitializers), null); /** * For eye adaptation, represents the minimum luminance the eye can see */ this.hdrMinimumLuminance = __runInitializers(this, _hdrMinimumLuminance_initializers, 1.0); /** * For eye adaptation, represents the decrease luminance speed */ this.hdrDecreaseRate = (__runInitializers(this, _hdrMinimumLuminance_extraInitializers), __runInitializers(this, _hdrDecreaseRate_initializers, 0.5)); /** * For eye adaptation, represents the increase luminance speed */ this.hdrIncreaseRate = (__runInitializers(this, _hdrDecreaseRate_extraInitializers), __runInitializers(this, _hdrIncreaseRate_initializers, 0.5)); /** * Lens color texture used by the lens flare effect. Mandatory if lens flare effect enabled */ this.lensColorTexture = (__runInitializers(this, _hdrIncreaseRate_extraInitializers), __runInitializers(this, _lensColorTexture_initializers, null)); /** * The overall strength for the lens flare effect */ this.lensFlareStrength = (__runInitializers(this, _lensColorTexture_extraInitializers), __runInitializers(this, _lensFlareStrength_initializers, 20.0)); /** * Dispersion coefficient for lens flare ghosts */ this.lensFlareGhostDispersal = (__runInitializers(this, _lensFlareStrength_extraInitializers), __runInitializers(this, _lensFlareGhostDispersal_initializers, 1.4)); /** * Main lens flare halo width */ this.lensFlareHaloWidth = (__runInitializers(this, _lensFlareGhostDispersal_extraInitializers), __runInitializers(this, _lensFlareHaloWidth_initializers, 0.7)); /** * Based on the lens distortion effect, defines how much the lens flare result * is distorted */ this.lensFlareDistortionStrength = (__runInitializers(this, _lensFlareHaloWidth_extraInitializers), __runInitializers(this, _lensFlareDistortionStrength_initializers, 16.0)); /** * Configures the blur intensity used for for lens flare (halo) */ this.lensFlareBlurWidth = (__runInitializers(this, _lensFlareDistortionStrength_extraInitializers), __runInitializers(this, _lensFlareBlurWidth_initializers, 512.0)); /** * Lens star texture must be used to simulate rays on the flares and is available * in the documentation */ this.lensStarTexture = (__runInitializers(this, _lensFlareBlurWidth_extraInitializers), __runInitializers(this, _lensStarTexture_initializers, null)); /** * As the "lensTexture" (can be the same texture or different), it is used to apply the lens * flare effect by taking account of the dirt texture */ this.lensFlareDirtTexture = (__runInitializers(this, _lensStarTexture_extraInitializers), __runInitializers(this, _lensFlareDirtTexture_initializers, null)); /** * Represents the focal length for the depth of field effect */ this.depthOfFieldDistance = (__runInitializers(this, _lensFlareDirtTexture_extraInitializers), __runInitializers(this, _depthOfFieldDistance_initializers, 10.0)); /** * Represents the blur intensity for the blurred part of the depth of field effect */ this.depthOfFieldBlurWidth = (__runInitializers(this, _depthOfFieldDistance_extraInitializers), __runInitializers(this, _depthOfFieldBlurWidth_initializers, 64.0)); /** * List of animations for the pipeline (IAnimatable implementation) */ this.animations = (__runInitializers(this, _depthOfFieldBlurWidth_extraInitializers), []); this._currentDepthOfFieldSource = null; this._fixedExposure = 1.0; this._currentExposure = 1.0; this._hdrAutoExposure = false; this._hdrCurrentLuminance = 1.0; this._motionStrength = 1.0; this._isObjectBasedMotionBlur = false; this._camerasToBeAttached = []; this._ratio = __runInitializers(this, __ratio_initializers, void 0); // Getters and setters this._bloomEnabled = (__runInitializers(this, __ratio_extraInitializers), false); this._depthOfFieldEnabled = false; this._vlsEnabled = false; this._lensFlareEnabled = false; this._hdrEnabled = false; this._motionBlurEnabled = false; this._fxaaEnabled = false; this._screenSpaceReflectionsEnabled = false; this._motionBlurSamples = 64.0; this._volumetricLightStepsCount = 50.0; this._samples = 1; this._cameras = cameras || scene.cameras; this._cameras = this._cameras.slice(); this._camerasToBeAttached = this._cameras.slice(); // Initialize this._scene = scene; this._basePostProcess = originalPostProcess; this._ratio = ratio; // Misc this._floatTextureType = scene.getEngine().getCaps().textureFloatRender ? 1 : 2; // Finish scene.postProcessRenderPipelineManager.addPipeline(this); this._buildPipeline(); } _buildPipeline() { const ratio = this._ratio; const scene = this._scene; this._disposePostProcesses(); if (this._cameras !== null) { this._scene.postProcessRenderPipelineManager.detachCamerasFromRenderPipeline(this._name, this._cameras); // get back cameras to be used to reattach pipeline this._cameras = this._camerasToBeAttached.slice(); } this._reset(); // Create pass post-process if (this._screenSpaceReflectionsEnabled) { this.screenSpaceReflectionPostProcess = new ScreenSpaceReflectionPostProcess("HDRPass", scene, ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, this._floatTextureType); this.screenSpaceReflectionPostProcess.onApplyObservable.add(() => { this._currentDepthOfFieldSource = this.screenSpaceReflectionPostProcess; }); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRScreenSpaceReflections", () => this.screenSpaceReflectionPostProcess, true)); } if (!this._basePostProcess) { this.originalPostProcess = new PostProcess("HDRPass", "standard", [], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define PASS_POST_PROCESS", this._floatTextureType); } else { this.originalPostProcess = this._basePostProcess; } this.originalPostProcess.autoClear = !this.screenSpaceReflectionPostProcess; this.originalPostProcess.onApplyObservable.add(() => { this._currentDepthOfFieldSource = this.originalPostProcess; }); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRPassPostProcess", () => this.originalPostProcess, true)); if (this._bloomEnabled) { // Create down sample X4 post-process this._createDownSampleX4PostProcess(scene, ratio / 4); // Create bright pass post-process this._createBrightPassPostProcess(scene, ratio / 4); // Create gaussian blur post-processes (down sampling blurs) this._createBlurPostProcesses(scene, ratio / 4, 1); // Create texture adder post-process this._createTextureAdderPostProcess(scene, ratio); // Create depth-of-field source post-process this.textureAdderFinalPostProcess = new PostProcess("HDRDepthOfFieldSource", "standard", [], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define PASS_POST_PROCESS", 0); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRBaseDepthOfFieldSource", () => { return this.textureAdderFinalPostProcess; }, true)); } if (this._vlsEnabled) { // Create volumetric light this._createVolumetricLightPostProcess(scene, ratio); // Create volumetric light final post-process this.volumetricLightFinalPostProcess = new PostProcess("HDRVLSFinal", "standard", [], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define PASS_POST_PROCESS", 0); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRVLSFinal", () => { return this.volumetricLightFinalPostProcess; }, true)); } if (this._lensFlareEnabled) { // Create lens flare post-process this._createLensFlarePostProcess(scene, ratio); // Create depth-of-field source post-process post lens-flare and disable it now this.lensFlareFinalPostProcess = new PostProcess("HDRPostLensFlareDepthOfFieldSource", "standard", [], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define PASS_POST_PROCESS", 0); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRPostLensFlareDepthOfFieldSource", () => { return this.lensFlareFinalPostProcess; }, true)); } if (this._hdrEnabled) { // Create luminance this._createLuminancePostProcesses(scene, this._floatTextureType); // Create HDR this._createHdrPostProcess(scene, ratio); // Create depth-of-field source post-process post hdr and disable it now this.hdrFinalPostProcess = new PostProcess("HDRPostHDReDepthOfFieldSource", "standard", [], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define PASS_POST_PROCESS", 0); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRPostHDReDepthOfFieldSource", () => { return this.hdrFinalPostProcess; }, true)); } if (this._depthOfFieldEnabled) { // Create gaussian blur used by depth-of-field this._createBlurPostProcesses(scene, ratio / 2, 3, "depthOfFieldBlurWidth"); // Create depth-of-field post-process this._createDepthOfFieldPostProcess(scene, ratio); } if (this._motionBlurEnabled) { // Create motion blur post-process this._createMotionBlurPostProcess(scene, ratio); } if (this._fxaaEnabled) { // Create fxaa post-process this.fxaaPostProcess = new FxaaPostProcess("fxaa", 1.0, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, 0); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRFxaa", () => { return this.fxaaPostProcess; }, true)); } if (this._cameras !== null) { this._scene.postProcessRenderPipelineManager.attachCamerasToRenderPipeline(this._name, this._cameras); } if (!this._enableMSAAOnFirstPostProcess(this._samples) && this._samples > 1) { Logger.Warn("MSAA failed to enable, MSAA is only supported in browsers that support webGL >= 2.0"); } } // Down Sample X4 Post-Process _createDownSampleX4PostProcess(scene, ratio) { const downSampleX4Offsets = new Array(32); this.downSampleX4PostProcess = new PostProcess("HDRDownSampleX4", "standard", ["dsOffsets"], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define DOWN_SAMPLE_X4", this._floatTextureType); this.downSampleX4PostProcess.onApply = (effect) => { let id = 0; const width = this.downSampleX4PostProcess.width; const height = this.downSampleX4PostProcess.height; for (let i = -2; i < 2; i++) { for (let j = -2; j < 2; j++) { downSampleX4Offsets[id] = (i + 0.5) * (1.0 / width); downSampleX4Offsets[id + 1] = (j + 0.5) * (1.0 / height); id += 2; } } effect.setArray2("dsOffsets", downSampleX4Offsets); }; // Add to pipeline this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRDownSampleX4", () => { return this.downSampleX4PostProcess; }, true)); } // Brightpass Post-Process _createBrightPassPostProcess(scene, ratio) { const brightOffsets = new Array(8); this.brightPassPostProcess = new PostProcess("HDRBrightPass", "standard", ["dsOffsets", "brightThreshold"], [], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define BRIGHT_PASS", this._floatTextureType); this.brightPassPostProcess.onApply = (effect) => { const sU = 1.0 / this.brightPassPostProcess.width; const sV = 1.0 / this.brightPassPostProcess.height; brightOffsets[0] = -0.5 * sU; brightOffsets[1] = 0.5 * sV; brightOffsets[2] = 0.5 * sU; brightOffsets[3] = 0.5 * sV; brightOffsets[4] = -0.5 * sU; brightOffsets[5] = -0.5 * sV; brightOffsets[6] = 0.5 * sU; brightOffsets[7] = -0.5 * sV; effect.setArray2("dsOffsets", brightOffsets); effect.setFloat("brightThreshold", this.brightThreshold); }; // Add to pipeline this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRBrightPass", () => { return this.brightPassPostProcess; }, true)); } // Create blur H&V post-processes _createBlurPostProcesses(scene, ratio, indice, blurWidthKey = "blurWidth") { const engine = scene.getEngine(); const blurX = new BlurPostProcess("HDRBlurH" + "_" + indice, new Vector2(1, 0), this[blurWidthKey], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, this._floatTextureType); const blurY = new BlurPostProcess("HDRBlurV" + "_" + indice, new Vector2(0, 1), this[blurWidthKey], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, this._floatTextureType); blurX.onActivateObservable.add(() => { const dw = blurX.width / engine.getRenderWidth(); blurX.kernel = this[blurWidthKey] * dw; }); blurY.onActivateObservable.add(() => { const dw = blurY.height / engine.getRenderHeight(); blurY.kernel = this.horizontalBlur ? 64 * dw : this[blurWidthKey] * dw; }); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRBlurH" + indice, () => { return blurX; }, true)); this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRBlurV" + indice, () => { return blurY; }, true)); this.blurHPostProcesses.push(blurX); this.blurVPostProcesses.push(blurY); } // Create texture adder post-process _createTextureAdderPostProcess(scene, ratio) { this.textureAdderPostProcess = new PostProcess("HDRTextureAdder", "standard", ["exposure"], ["otherSampler", "lensSampler"], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define TEXTURE_ADDER", this._floatTextureType); this.textureAdderPostProcess.onApply = (effect) => { effect.setTextureFromPostProcess("otherSampler", this._vlsEnabled ? this._currentDepthOfFieldSource : this.originalPostProcess); effect.setTexture("lensSampler", this.lensTexture); effect.setFloat("exposure", this._currentExposure); this._currentDepthOfFieldSource = this.textureAdderFinalPostProcess; }; // Add to pipeline this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRTextureAdder", () => { return this.textureAdderPostProcess; }, true)); } _createVolumetricLightPostProcess(scene, ratio) { const geometryRenderer = scene.enableGeometryBufferRenderer(); geometryRenderer.enablePosition = true; const geometry = geometryRenderer.getGBuffer(); // Base post-process this.volumetricLightPostProcess = new PostProcess("HDRVLS", "standard", ["shadowViewProjection", "cameraPosition", "sunDirection", "sunColor", "scatteringCoefficient", "scatteringPower", "depthValues"], ["shadowMapSampler", "positionSampler"], ratio / 8, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define VLS\n#define NB_STEPS " + this._volumetricLightStepsCount.toFixed(1)); const depthValues = Vector2.Zero(); this.volumetricLightPostProcess.onApply = (effect) => { if (this.sourceLight && this.sourceLight.getShadowGenerator() && this._scene.activeCamera) { const generator = this.sourceLight.getShadowGenerator(); effect.setTexture("shadowMapSampler", generator.getShadowMap()); effect.setTexture("positionSampler", geometry.textures[2]); effect.setColor3("sunColor", this.sourceLight.diffuse); effect.setVector3("sunDirection", this.sourceLight.getShadowDirection()); effect.setVector3("cameraPosition", this._scene.activeCamera.globalPosition); effect.setMatrix("shadowViewProjection", generator.getTransformMatrix()); effect.setFloat("scatteringCoefficient", this.volumetricLightCoefficient); effect.setFloat("scatteringPower", this.volumetricLightPower); depthValues.x = this.sourceLight.getDepthMinZ(this._scene.activeCamera); depthValues.y = this.sourceLight.getDepthMaxZ(this._scene.activeCamera); effect.setVector2("depthValues", depthValues); } }; this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRVLS", () => { return this.volumetricLightPostProcess; }, true)); // Smooth this._createBlurPostProcesses(scene, ratio / 4, 0, "volumetricLightBlurScale"); // Merge this.volumetricLightMergePostProces = new PostProcess("HDRVLSMerge", "standard", [], ["originalSampler"], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define VLSMERGE"); this.volumetricLightMergePostProces.onApply = (effect) => { effect.setTextureFromPostProcess("originalSampler", this._bloomEnabled ? this.textureAdderFinalPostProcess : this.originalPostProcess); this._currentDepthOfFieldSource = this.volumetricLightFinalPostProcess; }; this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRVLSMerge", () => { return this.volumetricLightMergePostProces; }, true)); } // Create luminance _createLuminancePostProcesses(scene, textureType) { // Create luminance let size = Math.pow(3, _a.LuminanceSteps); this.luminancePostProcess = new PostProcess("HDRLuminance", "standard", ["lumOffsets"], [], { width: size, height: size }, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, "#define LUMINANCE", textureType); const offsets = []; this.luminancePostProcess.onApply = (effect) => { const sU = 1.0 / this.luminancePostProcess.width; const sV = 1.0 / this.luminancePostProcess.height; offsets[0] = -0.5 * sU; offsets[1] = 0.5 * sV; offsets[2] = 0.5 * sU; offsets[3] = 0.5 * sV; offsets[4] = -0.5 * sU; offsets[5] = -0.5 * sV; offsets[6] = 0.5 * sU; offsets[7] = -0.5 * sV; effect.setArray2("lumOffsets", offsets); }; // Add to pipeline this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRLuminance", () => { return this.luminancePostProcess; }, true)); // Create down sample luminance for (let i = _a.LuminanceSteps - 1; i >= 0; i--) { size = Math.pow(3, i); let defines = "#define LUMINANCE_DOWN_SAMPLE\n"; if (i === 0) { defines += "#define FINAL_DOWN_SAMPLER"; } const postProcess = new PostProcess("HDRLuminanceDownSample" + i, "standard", ["dsOffsets", "halfDestPixelSize"], [], { width: size, height: size }, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, defines, textureType); this.luminanceDownSamplePostProcesses.push(postProcess); } // Create callbacks and add effects let lastLuminance = this.luminancePostProcess; for (let index = 0; index < this.luminanceDownSamplePostProcesses.length; index++) { const pp = this.luminanceDownSamplePostProcesses[index]; const downSampleOffsets = new Array(18); pp.onApply = (effect) => { if (!lastLuminance) { return; } let id = 0; for (let x = -1; x < 2; x++) { for (let y = -1; y < 2; y++) { downSampleOffsets[id] = x / lastLuminance.width; downSampleOffsets[id + 1] = y / lastLuminance.height; id += 2; } } effect.setArray2("dsOffsets", downSampleOffsets); effect.setFloat("halfDestPixelSize", 0.5 / lastLuminance.width); if (index === this.luminanceDownSamplePostProcesses.length - 1) { lastLuminance = this.luminancePostProcess; } else { lastLuminance = pp; } }; if (index === this.luminanceDownSamplePostProcesses.length - 1) { pp.onAfterRender = () => { const pixel = scene.getEngine().readPixels(0, 0, 1, 1); const bit_shift = new Vector4(1.0 / (255.0 * 255.0 * 255.0), 1.0 / (255.0 * 255.0), 1.0 / 255.0, 1.0); // eslint-disable-next-line @typescript-eslint/no-floating-promises, github/no-then pixel.then((pixel) => { const data = new Uint8Array(pixel.buffer); this._hdrCurrentLuminance = (data[0] * bit_shift.x + data[1] * bit_shift.y + data[2] * bit_shift.z + data[3] * bit_shift.w) / 100.0; }); }; } this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDRLuminanceDownSample" + index, () => { return pp; }, true)); } } // Create HDR post-process _createHdrPostProcess(scene, ratio) { const defines = ["#define HDR"]; if (this._hdrAutoExposure) { defines.push("#define AUTO_EXPOSURE"); } this.hdrPostProcess = new PostProcess("HDR", "standard", ["averageLuminance"], ["textureAdderSampler"], ratio, null, Texture.BILINEAR_SAMPLINGMODE, scene.getEngine(), false, defines.join("\n"), 0); let outputLiminance = 1; let time = 0; let lastTime = 0; this.hdrPostProcess.onApply = (effect) => { effect.setTextureFromPostProcess("textureAdderSampler", this._currentDepthOfFieldSource); time += scene.getEngine().getDeltaTime(); if (outputLiminance < 0) { outputLiminance = this._hdrCurrentLuminance; } else { const dt = (lastTime - time) / 1000.0; if (this._hdrCurrentLuminance < outputLiminance + this.hdrDecreaseRate * dt) { outputLiminance += this.hdrDecreaseRate * dt; } else if (this._hdrCurrentLuminance > outputLiminance - this.hdrIncreaseRate * dt) { outputLiminance -= this.hdrIncreaseRate * dt; } else { outputLiminance = this._hdrCurrentLuminance; } } if (this.hdrAutoExposure) { this._currentExposure = this._fixedExposure / outputLiminance; } else { outputLiminance = Clamp(outputLiminance, this.hdrMinimumLuminance, 1e20); effect.setFloat("averageLuminance", outputLiminance); } lastTime = time; this._currentDepthOfFieldSource = this.hdrFinalPostProcess; }; this.addEffect(new PostProcessRenderEffect(scene.getEngine(), "HDR", () => { return this.hdrPostProcess; }, true)); } // Create lens flare post-process _createLensFlarePostProcess(scene, ratio) { this.lensFlarePostProcess = new