feat: manual cubemap mipmap loading example

src/examples/cubemaps/mipmaps/example.json

@@ -0,0 +1,8 @@
+{
+  "slug": "cubemap_mipmaps",
+  "en": {
+    "name": "Cube Map Manual Mipmap Textures",
+    "description": "Load manually generated mipmaps into the cubemap.",
+    "keywords": ["texture", "cubemap", "mipmaps"]
+  }
+}

src/examples/cubemaps/mipmaps/fragment.glsl

@@ -0,0 +1,17 @@
+precision highp float;
+
+varying vec3 v_viewPosition;
+varying vec3 v_viewNormal;
+varying vec3 v_localNormal;
+
+uniform samplerCube cubeMap;
+uniform float perceptualRoughness;
+uniform int mipCount;
+
+void main() {
+
+  vec3 reflectDir = v_localNormal; //reflect( normalize( v_viewPosition ),normalize(v_viewNormal) );
+  float lod = clamp(perceptualRoughness * float(mipCount), 0., float(mipCount));
+  gl_FragColor = textureCubeLodEXT(cubeMap, reflectDir, lod);
+
+}

src/examples/cubemaps/mipmaps/index.ts

@@ -0,0 +1,67 @@
+import { icosahedronGeometry } from "../../../lib/geometry/primitives/polyhedronGeometry";
+import { ShaderMaterial } from "../../../lib/materials/ShaderMaterial";
+import { Euler } from "../../../lib/math/Euler";
+import { Matrix4 } from "../../../lib/math/Matrix4";
+import {
+  makeMatrix4PerspectiveFov,
+  makeMatrix4RotationFromEuler,
+  makeMatrix4Translation,
+} from "../../../lib/math/Matrix4.Functions";
+import { Vector3 } from "../../../lib/math/Vector3";
+import { makeBufferGeometryFromGeometry } from "../../../lib/renderers/webgl/buffers/BufferGeometry";
+import { DepthTestFunc, DepthTestState } from "../../../lib/renderers/webgl/DepthTestState";
+import { makeProgramFromShaderMaterial } from "../../../lib/renderers/webgl/programs/Program";
+import { RenderingContext } from "../../../lib/renderers/webgl/RenderingContext";
+import { makeTexImage2DFromCubeTexture } from "../../../lib/renderers/webgl/textures/TexImage2D";
+import { CubeMapTexture } from "../../../lib/textures/CubeTexture";
+import { fetchImage } from "../../../lib/textures/loaders/Image";
+import fragmentSourceCode from "./fragment.glsl";
+import vertexSourceCode from "./vertex.glsl";
+
+async function init(): Promise<null> {
+  const geometry = icosahedronGeometry(0.75, 4);
+  const material = new ShaderMaterial(vertexSourceCode, fragmentSourceCode);
+  const images = [];
+  for (let level = 0; level < 9; level++) {
+    for (let face = 0; face < 6; face++) {
+      images.push(fetchImage(`/assets/textures/cube/angusMipmaps/cube_m0${level}_c0${face}.jpg`));
+    }
+  }
+  const cubeTexture = new CubeMapTexture(await Promise.all(images));
+  cubeTexture.generateMipmaps = false;
+
+  const context = new RenderingContext(document.getElementById("framebuffer") as HTMLCanvasElement);
+  const canvasFramebuffer = context.canvasFramebuffer;
+  window.addEventListener("resize", () => canvasFramebuffer.resize());
+
+  const program = makeProgramFromShaderMaterial(context, material);
+  const uniforms = {
+    localToWorld: new Matrix4(),
+    worldToView: makeMatrix4Translation(new Vector3(0, 0, -3.0)),
+    viewToScreen: makeMatrix4PerspectiveFov(25, 0.1, 4.0, 1.0, canvasFramebuffer.aspectRatio),
+    cubeMap: makeTexImage2DFromCubeTexture(context, cubeTexture),
+    perceptualRoughness: 0,
+    mipCount: cubeTexture.mipCount,
+  };
+  const bufferGeometry = makeBufferGeometryFromGeometry(context, geometry);
+  const depthTestState = new DepthTestState(true, DepthTestFunc.Less);
+
+  function animate(): void {
+    requestAnimationFrame(animate);
+    const now = Date.now();
+
+    uniforms.localToWorld = makeMatrix4RotationFromEuler(
+      new Euler(now * 0.0001, now * 0.00033, now * 0.000077),
+      uniforms.localToWorld,
+    );
+    uniforms.perceptualRoughness = Math.sin(now * 0.005) * 0.5 + 0.5;
+
+    canvasFramebuffer.renderBufferGeometry(program, uniforms, bufferGeometry, depthTestState);
+  }
+
+  animate();
+
+  return null;
+}
+
+init();

src/examples/cubemaps/mipmaps/vertex.glsl

@@ -0,0 +1,19 @@
+attribute vec3 position;
+attribute vec3 normal;
+
+uniform mat4 localToWorld;
+uniform mat4 worldToView;
+uniform mat4 viewToScreen;
+
+varying vec3 v_viewPosition;
+varying vec3 v_viewNormal;
+varying vec3 v_localNormal;
+
+void main() {
+
+  v_localNormal = normalize( position );
+  v_viewNormal = normalize( ( worldToView * localToWorld * vec4( normalize( position ), 0. ) ).xyz );
+  v_viewPosition = ( worldToView * localToWorld * vec4( position, 1. ) ).xyz;
+  gl_Position = viewToScreen * vec4( v_viewPosition, 1. );
+
+}