@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.
127 lines • 4.6 kB
JavaScript
import { EffectWrapper } from "../Materials/effectRenderer.js";
import { Matrix, TmpVectors } from "../Maths/math.vector.js";
/**
* Post process used to apply a motion blur post process
*/
export class ThinMotionBlurPostProcess extends EffectWrapper {
_gatherImports(useWebGPU, list) {
if (useWebGPU) {
this._webGPUReady = true;
list.push(import("../ShadersWGSL/motionBlur.fragment.js"));
}
else {
list.push(import("../Shaders/motionBlur.fragment.js"));
}
}
/**
* Constructs a new motion blur post process
* @param name Name of the effect
* @param scene The scene the effect belongs to
* @param options Options to configure the effect
*/
constructor(name, scene, options) {
super({
...options,
name,
engine: scene.getEngine(),
useShaderStore: true,
useAsPostProcess: true,
fragmentShader: ThinMotionBlurPostProcess.FragmentUrl,
uniforms: ThinMotionBlurPostProcess.Uniforms,
samplers: ThinMotionBlurPostProcess.Samplers,
defines: ThinMotionBlurPostProcess.Defines,
});
this._invViewProjection = Matrix.Identity();
this._previousViewProjection = Matrix.Identity();
/**
* Defines how much the image is blurred by the movement. Default value is equal to 1
*/
this.motionStrength = 1;
this._motionBlurSamples = 32;
this._isObjectBased = true;
/**
* The width of the source texture
*/
this.textureWidth = 0;
/**
* The height of the source texture
*/
this.textureHeight = 0;
this._scene = scene;
this._applyMode();
}
/**
* Gets the number of iterations that are used for motion blur quality. Default value is equal to 32
*/
get motionBlurSamples() {
return this._motionBlurSamples;
}
/**
* Sets the number of iterations to be used for motion blur quality
*/
set motionBlurSamples(samples) {
this._motionBlurSamples = samples;
this._updateEffect();
}
/**
* Gets whether or not the motion blur post-process is in object based mode.
*/
get isObjectBased() {
return this._isObjectBased;
}
/**
* Sets whether or not the motion blur post-process is in object based mode.
*/
set isObjectBased(value) {
if (this._isObjectBased === value) {
return;
}
this._isObjectBased = value;
this._applyMode();
}
bind(noDefaultBindings = false) {
super.bind(noDefaultBindings);
const effect = this._drawWrapper.effect;
effect.setFloat2("screenSize", this.textureWidth, this.textureHeight);
effect.setFloat("motionScale", this._scene.getAnimationRatio());
effect.setFloat("motionStrength", this.motionStrength);
if (!this.isObjectBased) {
const viewProjection = TmpVectors.Matrix[0];
viewProjection.copyFrom(this._scene.getTransformMatrix());
viewProjection.invertToRef(this._invViewProjection);
effect.setMatrix("inverseViewProjection", this._invViewProjection);
effect.setMatrix("prevViewProjection", this._previousViewProjection);
this._previousViewProjection.copyFrom(viewProjection);
effect.setMatrix("projection", this._scene.getProjectionMatrix());
}
}
_updateEffect() {
const defines = [
"#define GEOMETRY_SUPPORTED",
"#define SAMPLES " + this._motionBlurSamples.toFixed(1),
this._isObjectBased ? "#define OBJECT_BASED" : "#define SCREEN_BASED",
];
this.updateEffect(defines.join("\n"));
}
_applyMode() {
this._updateEffect();
this._previousViewProjection.copyFrom(this._scene.getTransformMatrix());
}
}
/**
* The fragment shader url
*/
ThinMotionBlurPostProcess.FragmentUrl = "motionBlur";
/**
* The list of uniforms used by the effect
*/
ThinMotionBlurPostProcess.Uniforms = ["motionStrength", "motionScale", "screenSize", "inverseViewProjection", "prevViewProjection", "projection"];
/**
* The list of samplers used by the effect
*/
ThinMotionBlurPostProcess.Samplers = ["velocitySampler", "depthSampler"];
/**
* The default defines used by the effect
*/
ThinMotionBlurPostProcess.Defines = "#define GEOMETRY_SUPPORTED\n#define SAMPLES 64.0\n#define OBJECT_BASED";
//# sourceMappingURL=thinMotionBlurPostProcess.js.map