ohzi-core 5.13.2 → 5.14.2

package/src/render_mode/DeferredRender.js

@@ -0,0 +1,112 @@
+import CameraManager from '../CameraManager';
+import SceneManager from '../SceneManager';
+import Screen from '../Screen';
+import BaseRender from '../render_mode/BaseRender';
+import DeferredRendererComposeMaterial from '../materials/DeferredRendererComposeMaterial';
+import Graphics from '../Graphics';
+import DeferredPointLightMaterial from '../materials/deferred/DeferredPointLightMaterial';
+
+import { WebGLRenderTarget } from 'three';
+import { Scene } from 'three';
+import { Mesh } from 'three';
+import { SphereBufferGeometry } from 'three';
+import { Matrix4 } from 'three';
+
+export default class DeferredRender extends BaseRender
+{
+  constructor()
+  {
+    super();
+
+    this.compose_mat = new DeferredRendererComposeMaterial();
+    this.main_rt = new WebGLRenderTarget(Screen.width, Screen.height, {
+      // magFilter: NearestFilter,
+      // minFilter: NearestFilter
+    });
+
+    this.scene_lights = new Scene();
+
+    let light_intensity = 1;
+    let light_brightest_component = 1;
+    let radius_needed_for_intensity = Math.sqrt(4 * light_intensity * (light_brightest_component * (256.0 / 5.0))) / (2 * light_intensity);
+    let sphere = new Mesh(new SphereBufferGeometry(radius_needed_for_intensity), new DeferredPointLightMaterial(light_intensity));
+    // sphere.position.y = 2;
+    // this.scene_lights.add(sphere);
+
+    // let sphere2 = sphere.clone();
+    // sphere2.position.x = 2;
+    // this.scene_lights.add(sphere2);
+
+    // let sphere3 = sphere.clone();
+    // sphere3.position.x = -2;
+    // this.scene_lights.add(sphere3);
+
+    // let sphere4 = sphere.clone();
+    // sphere4.position.z = -2;
+    // this.scene_lights.add(sphere4);
+
+    // let sphere5 = sphere.clone();
+    // sphere5.position.z = 2;
+    // this.scene_lights.add(sphere5);
+
+    let light_row = 2;
+    let light_col = 2;
+    for (let x = 0; x < light_row; x++)
+    {
+      for (let y = 0; y < light_col; y++)
+      {
+        let clone = sphere.clone();
+        clone.position.set(x * 2 - light_row / 2, 1, y * 2 - light_col / 2);
+        this.scene_lights.add(clone);
+      }
+    }
+
+    this.camera_inverse_proj_mat = new Matrix4();
+  }
+
+  on_enter()
+  {
+    Graphics.generateDepthNormalTexture = true;
+  }
+
+  render()
+  {
+    this.__check_RT_size();
+
+    Graphics.clear(this.main_rt, CameraManager.current, true, false);
+
+    Graphics.render(SceneManager.current, CameraManager.current, this.main_rt);
+
+    // this.compose_mat.set_normal_depth_rt(Graphics.depth_normals_RT);
+    // this.compose_mat.set_proj_matrix(CameraManager.current.projectionMatrix);
+
+    // Graphics.blit(this.main_rt, undefined, this.compose_mat);
+
+    this.camera_inverse_proj_mat.getInverse(CameraManager.current.projectionMatrix);
+
+    let inverse_proj = this.camera_inverse_proj_mat;
+    let albedo_rt = this.main_rt;
+    let depth_normals_rt = Graphics.depth_normals_RT;
+    this.scene_lights.traverse((child) =>
+    {
+      if (child.material)
+      {
+        child.material.set_inverse_proj_matrix(inverse_proj);
+        child.material.set_normal_depth_rt(depth_normals_rt);
+        child.material.set_albedo_rt(albedo_rt);
+      }
+    });
+    // Graphics.clear(undefined, CameraManager.current, true, true);
+    // Graphics.render(SceneManager.current, CameraManager.current);
+    Graphics.clear(undefined, CameraManager.current, true, true);
+    Graphics.render(this.scene_lights, CameraManager.current);
+  }
+
+  __check_RT_size()
+  {
+    if (this.main_rt.width !== Screen.width || this.main_rt.height !== Screen.height)
+    {
+      this.main_rt.setSize(Screen.width, Screen.height);
+    }
+  }
+}

package/src/render_mode/NormalAORender.js

@@ -0,0 +1,71 @@
+import CameraManager from '../CameraManager';
+import SceneManager from '../SceneManager';
+import Screen from '../Screen';
+import BaseRender from '../render_mode/BaseRender';
+import Configuration from '../Configuration';
+import SSAOMaterial from '../materials/SSAOMaterial';
+import SSAOComposeMaterial from '../materials/SSAOComposeMaterial';
+import DisplayNormalTextureMaterial from '../materials/DisplayNormalTextureMaterial';
+import Blurrer from '../render_utilities/Blurrer';
+import Graphics from '../Graphics';
+
+import { WebGLRenderTarget } from 'three';
+
+export default class NormalAORender extends BaseRender
+{
+  constructor()
+  {
+    super();
+
+    this.ssao_mat = new SSAOMaterial();
+    this.ssao_compose_mat = new SSAOComposeMaterial();
+    this.debug_normals = new DisplayNormalTextureMaterial();
+
+    this.ssaa = Configuration.use_ssaa ? 2 : 1;
+
+    this.main_RT = new WebGLRenderTarget(Screen.width * this.ssaa, Screen.height * this.ssaa);
+
+    this.SSAO_RT = new WebGLRenderTarget(Screen.width, Screen.height);
+
+    this.blurrer = new Blurrer();
+    Graphics.generateDepthNormalTexture = true;
+  }
+
+  render()
+  {
+    this.__check_RT_size();
+
+    Graphics.clear(this.main_RT, CameraManager.current, true, false);
+    Graphics.render(SceneManager.current, CameraManager.current, this.main_RT);
+
+    this.__update_uniforms();
+
+    Graphics.blit(Graphics.depth_normals_RT, this.SSAO_RT, this.ssao_mat);
+
+    // // BLUR
+    this.blurrer.blur(this.SSAO_RT);
+    Graphics.blit(this.SSAO_RT, undefined);
+
+    // // COMPOSE
+    this.ssao_compose_mat.uniforms._AO.value = this.SSAO_RT.texture;
+    Graphics.blit(this.main_RT, undefined, this.ssao_compose_mat);
+
+    // Graphics.blit(this.SSAO_RT, undefined);
+  }
+
+  __update_uniforms()
+  {
+    this.ssao_mat.uniforms._InverseProjMatrix.value.getInverse(CameraManager.current.projectionMatrix);
+    this.ssao_mat.uniforms._ProjectionMatrix.value.copy(CameraManager.current.projectionMatrix);
+    this.ssao_mat.uniforms._FarPlane.value = CameraManager.current.far;
+  }
+
+  __check_RT_size()
+  {
+    if (this.main_RT.width !== Screen.width * this.ssaa || this.main_RT.height !== Screen.height * this.ssaa)
+    {
+      this.main_RT.setSize(Screen.width * this.ssaa, Screen.height * this.ssaa);
+      this.SSAO_RT.setSize(Screen.width, Screen.height);
+    }
+  }
+}

package/src/render_mode/NormalRender.js

@@ -0,0 +1,36 @@
+import CameraManager from '../CameraManager';
+import SceneManager from '../SceneManager';
+import BaseRender from '../render_mode/BaseRender';
+import Graphics from '../Graphics';
+
+export default class NormalRender extends BaseRender
+{
+  constructor()
+  {
+    super();
+  }
+
+  render()
+  {
+    Graphics.clear(undefined, CameraManager.current, true, true);
+
+    if (SceneManager.current.on_pre_render)
+    {
+      SceneManager.current.on_pre_render();
+    }
+
+    if (SceneManager.current.render)
+    {
+      SceneManager.current.render();
+    }
+    else
+    {
+      Graphics.render(SceneManager.current, CameraManager.current);
+    }
+
+    if (SceneManager.current.on_post_render)
+    {
+      SceneManager.current.on_post_render();
+    }
+  }
+}

package/src/render_mode/OutlineRender.js

@@ -0,0 +1,154 @@
+import Screen from '../Screen';
+import RenderLayers from '../RenderLayers';
+import compose_frag from '../shaders/box_blur/compose.frag';
+import box_blur_frag from '../shaders/box_blur/box_blur.frag';
+import copy_frag from '../shaders/copy/copy.frag';
+import copy_vert from '../shaders/copy/copy.vert';
+import background_frag from '../shaders/basic_color/basic_color.frag';
+
+import { WebGLRenderTarget } from 'three';
+import { Mesh } from 'three';
+import { PlaneGeometry } from 'three';
+import { Scene } from 'three';
+import { ShaderMaterial } from 'three';
+import { Vector2 } from 'three';
+import { Vector4 } from 'three';
+
+export default class OutlineRender
+{
+  constructor(webgl)
+  {
+    this.main_rt = new WebGLRenderTarget(Screen.width, Screen.height);
+    this.rt1     = new WebGLRenderTarget(Screen.width, Screen.height);
+    this.rt2     = new WebGLRenderTarget(Screen.width, Screen.height);
+
+    this.compose_material    = this.__get_compose_material();
+    this.copy_material       = this.__get_copy_material();
+    this.box_blur_material   = this.__get_box_blur_material();
+    this.background_material = this.__get_background_material();
+
+    this.copy_plane = new Mesh(new PlaneGeometry(1, 1), this.copy_material);
+    this.copy_plane.frustumCulled = false;
+    this.copy_scene = new Scene();
+    this.copy_scene.add(this.copy_plane);
+  }
+
+  resize(w, h)
+  {
+    this.main_rt.setSize(w, h);
+    this.rt1.setSize(w, h);
+    this.rt2.setSize(w, h);
+    this.box_blur_material.uniforms._Screen.value.set(w, h);
+    this.compose_material.uniforms._Screen.value.set(w, h);
+  }
+
+  render(webgl)
+  {
+    webgl.camera.updateMatrix();
+    webgl.camera.updateMatrixWorld();
+
+    webgl.camera.layers.enable(RenderLayers.opaque);
+    webgl.camera.layers.enable(RenderLayers.transparent);
+    webgl.camera.layers.disable(RenderLayers.outline);
+
+    // render scene
+    webgl._renderer.setClearColor(webgl.clear_color, 0);
+    webgl._renderer.clearTarget(this.main_rt, true, true, true);
+
+    this.copy_scene.overrideMaterial = this.background_material;
+    this.background_material.uniforms._Color.value.set(webgl.clear_color.r, webgl.clear_color.g, webgl.clear_color.b, 0);
+    webgl._renderer.render(this.copy_scene, webgl.camera, this.main_rt, false);
+
+    webgl._renderer.render(webgl.scene, webgl.camera, this.main_rt, false);
+
+    // horizontal blur
+    this.box_blur_material.uniforms._MainTex.value = this.main_rt.texture;
+    this.box_blur_material.uniforms._SampleDir.value.set(1, 0);
+
+    this.copy_scene.overrideMaterial = this.box_blur_material;
+    webgl._renderer.render(this.copy_scene, webgl.camera, this.rt1, false);
+
+    // vertical blur
+    this.box_blur_material.uniforms._SampleDir.value.set(0, 1);
+    this.box_blur_material.uniforms._MainTex.value = this.rt1.texture;
+
+    webgl._renderer.render(this.copy_scene, webgl.camera, this.rt2, false);
+
+    // compose
+    this.copy_scene.overrideMaterial = this.compose_material;
+    this.compose_material.uniforms._MainTex.value = this.main_rt.texture;
+    this.compose_material.uniforms._Blur.value = this.rt2.texture;
+    webgl._renderer.render(this.copy_scene, webgl.camera, undefined, false);
+    this.copy_scene.overrideMaterial = undefined;
+  }
+
+  __get_copy_material()
+  {
+    return new ShaderMaterial({
+      uniforms: {
+        _MainTex: { value: undefined }
+      },
+      vertexShader: copy_vert,
+      fragmentShader: copy_frag,
+      depthTest: false,
+      depthWrite: false
+    });
+  }
+
+  __get_box_blur_material()
+  {
+    return new ShaderMaterial({
+      uniforms: {
+        _MainTex: { value: undefined },
+        _SampleDir: { value: new Vector2() },
+        _Screen: { value: new Vector2(Screen.width, Screen.height) }
+      },
+      vertexShader: copy_vert,
+      fragmentShader: box_blur_frag,
+      depthTest: false,
+      depthWrite: false
+    });
+  }
+
+  __get_compose_material()
+  {
+    return new ShaderMaterial({
+      uniforms: {
+        _MainTex: { value: undefined },
+        _Blur: { value: undefined },
+        _Screen: { value: new Vector2(Screen.width, Screen.height) }
+      },
+      vertexShader: copy_vert,
+      fragmentShader: compose_frag,
+      depthTest: false,
+      depthWrite: false,
+      extensions: {
+        derivatives: true
+      }
+    });
+  }
+
+  __get_background_material()
+  {
+    return new ShaderMaterial({
+      uniforms: {
+        _Color: { value: new Vector4(0, 0, 0, 0) }
+      },
+      vertexShader: copy_vert,
+      fragmentShader: background_frag,
+      depthTest: true,
+      depthWrite: false
+
+    });
+  }
+
+  on_enter(webgl)
+  {
+    webgl._renderer.autoClear = false;
+  }
+
+  on_exit(webgl)
+  {
+    webgl._renderer.autoClear = true;
+  }
+}

package/src/render_mode/PlanarReflectionsRender.js

@@ -0,0 +1,118 @@
+import basic_color_frag from '../shaders/basic_color/basic_color.frag';
+import basic_color_vert from '../shaders/basic_color/basic_color.vert';
+import SceneManager from '../SceneManager';
+import CameraManager from '../CameraManager';
+import ReflectionPlaneContext from '../ReflectionPlaneContext';
+import Screen from '../Screen';
+import BaseRender from '../render_mode/BaseRender';
+
+import { ShaderMaterial } from 'three';
+import { Matrix4 } from 'three';
+import { Vector4 } from 'three';
+import { Scene } from 'three';
+import { MeshBasicMaterial } from 'three';
+import { Mesh } from 'three';
+
+export default class PlanarReflectionsRender extends BaseRender
+{
+  constructor()
+  {
+    super();
+    let color = 0.946;
+    this.plane_material_solid = new ShaderMaterial({
+      uniforms: {
+        _Color: { value: new Vector4(color, color, color, 0.5) }
+      },
+      vertexShader: basic_color_vert,
+      fragmentShader: basic_color_frag,
+      transparent: true,
+      depthWrite: false
+    });
+
+    this.stencil_mask_scene = new Scene();
+
+    this.original_view_matrix = new Matrix4();
+    this.inverted_view_matrix = new Matrix4();
+    this.reflection_matrix    = new Matrix4().set(1, 0, 0, 0,
+      0, -1, 0, 0,
+      0, 0, 1, 0,
+      0, 0, 0, 1);
+
+    this.gl = undefined;
+  }
+
+  on_enter(context, renderer)
+  {
+    this.gl = renderer.domElement.getContext('webgl');
+    CameraManager.current.parent = SceneManager.current;
+
+    let plane_material_mask = new MeshBasicMaterial({ color: CameraManager.current.clear_color, depthWrite: false });
+    this.plane_mask = new Mesh(ReflectionPlaneContext.target_geometry, plane_material_mask);
+    this.plane_solid = new Mesh(ReflectionPlaneContext.target_geometry, this.plane_material_solid);
+
+    let clear_color = CameraManager.current.clear_color;
+    this.plane_material_solid.uniforms._Color.value.set(clear_color.r, clear_color.g, clear_color.b, 0.5);
+
+    this.stencil_mask_scene.add(this.plane_mask);
+    SceneManager.current.add(this.plane_solid);
+    this.plane_solid.visible = false;
+
+    CameraManager.current.matrixAutoUpdate = false;
+    renderer.autoClear = false;
+  }
+
+  render(context, renderer)
+  {
+    if (CameraManager.current)
+    {
+      CameraManager.current.aspect = Screen.aspect_ratio;
+      CameraManager.current.updateProjectionMatrix();
+      CameraManager.current.updateMatrix();
+      CameraManager.current.updateMatrixWorld(true);
+
+      renderer.setClearColor(CameraManager.current.clear_color, CameraManager.current.clear_alpha);
+
+      this.__render_stencil_mask(renderer, this.gl);
+
+      this.plane_solid.visible = true;
+      this.__render_reflected_scene(renderer, this.gl);
+      this.plane_solid.visible = true;
+
+      // render scene
+
+      renderer.clear(false, true, false);
+      this.plane_solid.visible = true;
+      renderer.render(SceneManager.current, CameraManager.current);
+    }
+  }
+
+  __render_stencil_mask(renderer, gl)
+  {
+    // RENDER MASK
+    gl.enable(gl.STENCIL_TEST);
+    gl.stencilFunc(gl.ALWAYS, 1, 1);
+    gl.stencilOp(gl.KEEP, gl.REPLACE, gl.REPLACE);
+    renderer.clear(true, true, true);
+    renderer.render(this.stencil_mask_scene, CameraManager.current);
+  }
+
+  __render_reflected_scene(renderer, gl)
+  {
+    // // RENDER REFLECTION
+    gl.stencilFunc(gl.EQUAL, 1, 1);
+    gl.stencilOp(gl.KEEP, gl.REPLACE, gl.REPLACE);
+    this.reflection_matrix.set(1, 0, 0, 0,
+      0, -1, 0, ReflectionPlaneContext.target_position.y * 2,
+      0, 0, 1, 0,
+      0, 0, 0, 1);
+    this.original_view_matrix.copy(CameraManager.current.matrixWorldInverse);
+    this.inverted_view_matrix.copy(CameraManager.current.matrixWorldInverse).multiply(this.reflection_matrix);
+    CameraManager.current.matrixWorldInverse.copy(this.inverted_view_matrix.clone());
+
+    renderer.render(SceneManager.current, CameraManager.current);
+
+    gl.disable(gl.STENCIL_TEST);
+
+    CameraManager.current.matrixWorldInverse.copy(this.original_view_matrix);
+  }
+}

package/src/render_mode/TransparencyMixRender.js

@@ -0,0 +1,143 @@
+import Screen from '../Screen';
+import RenderLayers from '../RenderLayers';
+import transparent_mix_vert from '../shaders/transparent_mix/transparent_mix.vert';
+import transparent_mix_frag from '../shaders/transparent_mix/transparent_mix.frag';
+import copy_frag from '../shaders/transparent_mix/copy.frag';
+import fxaa from '../shaders/anti_aliasing/fxaa.frag';
+import Configuration from '../Configuration';
+
+import { Mesh } from 'three';
+import { WebGLRenderTarget } from 'three';
+import { ShaderMaterial } from 'three';
+import { Vector2 } from 'three';
+import { PlaneGeometry } from 'three';
+import { Scene } from 'three';
+
+export default class TransparencyMixRender
+{
+  constructor(webgl)
+  {
+    this.SSAA = Configuration.use_ssaa ? 2 : 1;
+    this.main_rt   = new WebGLRenderTarget(Screen.width * this.SSAA, Screen.height * this.SSAA);
+    this.opaque_rt = new WebGLRenderTarget(Screen.width * this.SSAA, Screen.height * this.SSAA);
+    this.fxaa_rt   = new WebGLRenderTarget(Screen.width * this.SSAA, Screen.height * this.SSAA);
+
+    this.mix_material = new ShaderMaterial({
+      uniforms: {
+        _OpaqueTex: { value: this.opaque_rt.texture },
+        _TransparentTex: { value: this.main_rt.texture },
+        _Resolution: { value: new Vector2(Screen.width, Screen.height) },
+        _Opacity: { value: Configuration.transparency_amount }
+      },
+      vertexShader: transparent_mix_vert,
+      fragmentShader: transparent_mix_frag,
+      depthTest: false,
+      depthWrite: false
+    });
+
+    this.copy_material = new ShaderMaterial({
+      uniforms: {
+        _MainTex: { value: this.main_rt.texture }
+      },
+      vertexShader: transparent_mix_vert,
+      fragmentShader: copy_frag,
+      depthTest: false,
+      depthWrite: false
+    });
+
+    this.fxaa_material = this.__get_fxaa_material();
+
+    let geometry = new PlaneGeometry(1, 1);
+    this.render_plane = new Mesh(geometry, this.mix_material);
+    this.render_plane.frustumCulled = false;
+
+    this.copy_plane = new Mesh(geometry, this.copy_material);
+    this.copy_plane.frustumCulled = false;
+
+    this.mix_scene = new Scene();
+    this.mix_scene.add(this.render_plane);
+    this.copy_scene = new Scene();
+    this.copy_scene.add(this.copy_plane);
+  }
+
+  resize()
+  {
+    this.main_rt.setSize(Screen.width * this.SSAA, Screen.height * this.SSAA);
+    this.opaque_rt.setSize(Screen.width * this.SSAA, Screen.height * this.SSAA);
+    this.fxaa_rt.setSize(Screen.width * this.SSAA, Screen.height * this.SSAA);
+    this.fxaa_material.uniforms._Resolution.value.set(Screen.width * this.SSAA, Screen.height * this.SSAA);
+    this.mix_material.uniforms._Resolution.value.set(Screen.width * this.SSAA, Screen.height * this.SSAA);
+  }
+
+  __get_fxaa_material()
+  {
+    return new ShaderMaterial({
+      uniforms: {
+        _MainTex: { value: this.fxaa_rt.texture },
+        _Resolution: { value: new Vector2(Screen.width * this.SSAA, Screen.height * this.SSAA) }
+      },
+      vertexShader: transparent_mix_vert,
+      fragmentShader: fxaa,
+      depthTest: false,
+      depthWrite: false
+    });
+  }
+
+  render(webgl)
+  {
+    webgl.camera.updateMatrix();
+    webgl.camera.updateMatrixWorld();
+
+    this.__render_opaque(webgl);
+    this.__render_transparent(webgl);
+
+    webgl.camera.layers.disable(RenderLayers.transparent);
+    webgl.camera.layers.enable(RenderLayers.opaque);
+
+    if (Configuration.use_fxaa)
+    {
+      webgl._renderer.render(this.mix_scene, webgl.camera, this.fxaa_rt, false);
+      this.mix_scene.overrideMaterial = this.fxaa_material;
+      webgl._renderer.render(this.mix_scene, webgl.camera, undefined, false);
+      this.mix_scene.overrideMaterial = undefined;
+    }
+    else
+    {
+      webgl._renderer.render(this.mix_scene, webgl.camera, undefined, false);
+    }
+  }
+
+  __render_opaque(webgl)
+  {
+    webgl._renderer.setClearColor(webgl.clear_color);
+    webgl._renderer.setClearAlpha(1);
+
+    webgl.camera.layers.disable(RenderLayers.transparent);
+    webgl.camera.layers.enable(RenderLayers.opaque);
+    webgl._renderer.clearTarget(this.main_rt, true, true, false);
+    webgl._renderer.render(webgl.scene, webgl.camera, this.main_rt, false);
+    webgl._renderer.render(this.copy_scene, webgl.camera, this.opaque_rt, false);
+  }
+
+  __render_transparent(webgl)
+  {
+    webgl._renderer.setClearColor(0x000000);
+    webgl._renderer.setClearAlpha(0);
+
+    webgl.camera.layers.disable(RenderLayers.opaque);
+    webgl.camera.layers.enable(RenderLayers.transparent);
+
+    webgl._renderer.clearTarget(this.main_rt, true, false, false);
+    webgl._renderer.render(webgl.scene, webgl.camera, this.main_rt, false);
+  }
+
+  on_enter(webgl)
+  {
+    webgl._renderer.autoClear = false;
+  }
+
+  on_exit(webgl)
+  {
+    webgl._renderer.autoClear = true;
+  }
+}