@polygonjs/polygonjs/dist/src/engine/nodes/post/DepthOfField.js

node-based WebGL 3D engine https://polygonjs.com

"use strict";
import { TypedPostNode, PostParamOptions } from "./_Base";
import { NodeParamsConfig, ParamConfig } from "../utils/params/ParamsConfig";
import {
  BlendFunction,
  DepthEffect,
  DepthOfFieldEffect,
  EffectPass,
  TextureEffect,
  VignetteEffect,
  VignetteTechnique
} from "postprocessing";
import { isBooleanTrue } from "../../../core/Type";
const VIGNETTE_TECHNIQUES = [VignetteTechnique.DEFAULT, VignetteTechnique.ESKIL];
const VIGNETTE_TECHNIQUE_NAME_BY_TECHNIQUE = {
  [VignetteTechnique.DEFAULT]: "DEFAULT",
  [VignetteTechnique.ESKIL]: "ESKIL"
};
var RenderMode = /* @__PURE__ */ ((RenderMode2) => {
  RenderMode2["DEFAULT"] = "DEFAULT";
  RenderMode2["DEPTH"] = "DEPTH";
  RenderMode2["COC"] = "CIRCLE_OF_CONFUSION";
  return RenderMode2;
})(RenderMode || {});
const RENDER_MODES = ["DEFAULT" /* DEFAULT */, "DEPTH" /* DEPTH */, "CIRCLE_OF_CONFUSION" /* COC */];
class DepthOfFieldPostParamsConfig extends NodeParamsConfig {
  constructor() {
    super(...arguments);
    this.depthOfField = ParamConfig.FOLDER();
    /** @param focalDepth */
    this.focusDistance = ParamConfig.FLOAT(10, {
      range: [0, 1],
      rangeLocked: [true, false],
      ...PostParamOptions
    });
    /** @param focalDepth */
    this.focusRange = ParamConfig.FLOAT(1, {
      range: [0, 1],
      rangeLocked: [true, true],
      ...PostParamOptions
    });
    /** @param bokeh scale */
    this.bokehScale = ParamConfig.FLOAT(2, {
      range: [0, 5],
      rangeLocked: [true, false],
      ...PostParamOptions
    });
    this.vignette = ParamConfig.FOLDER();
    /** @param vignetting */
    this.vignetting = ParamConfig.BOOLEAN(0, {
      ...PostParamOptions
    });
    /** @param vignette technique */
    this.vignettingTechnique = ParamConfig.INTEGER(0, {
      ...PostParamOptions,
      menu: {
        entries: VIGNETTE_TECHNIQUES.map((value) => {
          return {
            name: VIGNETTE_TECHNIQUE_NAME_BY_TECHNIQUE[value],
            value
          };
        })
      }
    });
    /** @param vignette darkness */
    this.vignetteDarkness = ParamConfig.FLOAT(0.5, {
      range: [0, 1],
      rangeLocked: [true, false],
      step: 1e-3,
      ...PostParamOptions
    });
    /** @param vignette offset */
    this.vignetteOffset = ParamConfig.FLOAT(0.35, {
      range: [0, 1],
      rangeLocked: [true, false],
      step: 1e-3,
      ...PostParamOptions
    });
    this.debug = ParamConfig.FOLDER();
    /** @param render mode */
    this.renderMode = ParamConfig.INTEGER(0, {
      ...PostParamOptions,
      menu: {
        entries: RENDER_MODES.map((name, value) => ({ name, value }))
      }
    });
  }
}
const ParamsConfig = new DepthOfFieldPostParamsConfig();
export class DepthOfFieldPostNode extends TypedPostNode {
  constructor() {
    super(...arguments);
    this.paramsConfig = ParamsConfig;
  }
  static type() {
    return "depthOfField";
  }
  createPass(context) {
    const depthOfFieldEffect = new DepthOfFieldEffect(context.camera, {
      blendFunction: BlendFunction.NORMAL,
      focusDistance: 0,
      // focalLength: 0.048,
      focusRange: 1,
      bokehScale: 2,
      height: 480,
      worldFocusDistance: 1,
      worldFocusRange: 1
    });
    const depthEffect = new DepthEffect({
      blendFunction: BlendFunction.SKIP
    });
    const vignetteEffect = new VignetteEffect({
      eskil: false,
      offset: 0.35,
      darkness: 0.5
    });
    const cocTextureEffect = new TextureEffect({
      blendFunction: BlendFunction.SKIP,
      texture: depthOfFieldEffect.cocTexture
    });
    const DOFPass = new EffectPass(
      context.camera,
      depthOfFieldEffect,
      vignetteEffect,
      cocTextureEffect,
      depthEffect
    );
    this.updatePass(DOFPass);
    return DOFPass;
  }
  updatePass(pass) {
    const effects = pass.effects;
    const vignetteEffect = effects.find((effect) => effect instanceof VignetteEffect);
    if (vignetteEffect) {
      this._updateDOFPass(pass);
    } else {
      this._updateSmaaPass(pass);
    }
  }
  _updateSmaaPass(pass) {
    const renderMode = RENDER_MODES[this.pv.renderMode];
    pass.enabled = renderMode === "DEFAULT" /* DEFAULT */;
  }
  _updateDOFPass(pass) {
    const effects = pass.effects;
    const vignetteEffect = effects.find((effect) => effect instanceof VignetteEffect);
    const DOF = effects.find((effect) => effect instanceof DepthOfFieldEffect);
    const depthEffect = effects.find((effect) => effect instanceof DepthEffect);
    const cocTextureEffect = effects.find((effect) => effect instanceof TextureEffect);
    const vignetteEnabled = isBooleanTrue(this.pv.vignetting);
    const renderMode = RENDER_MODES[this.pv.renderMode];
    depthEffect.blendMode.blendFunction = renderMode === "DEPTH" /* DEPTH */ ? BlendFunction.NORMAL : BlendFunction.SKIP;
    cocTextureEffect.blendMode.blendFunction = renderMode === "CIRCLE_OF_CONFUSION" /* COC */ ? BlendFunction.NORMAL : BlendFunction.SKIP;
    vignetteEffect.blendMode.blendFunction = renderMode === "DEFAULT" /* DEFAULT */ && vignetteEnabled ? BlendFunction.NORMAL : BlendFunction.SKIP;
    DOF.circleOfConfusionMaterial.focusDistance = this.pv.focusDistance;
    DOF.circleOfConfusionMaterial.focusRange = this.pv.focusRange;
    DOF.bokehScale = this.pv.bokehScale;
    vignetteEffect.blendMode.opacity.value = vignetteEnabled ? 1 : 0;
    vignetteEffect.darkness = this.pv.vignetteDarkness;
    vignetteEffect.offset = this.pv.vignetteOffset;
  }
}