claygl-next - npm Package Compare versions

Comparing version 2.0.0-alpha.38 to 2.0.0-alpha.39

dist/deferred/GBuffer.d.ts

@@ -7,25 +7,8 @@ import Texture2D from '../Texture2D';
 export interface DeferredGBufferOpts {
-    /**
-     * If enable gbuffer texture 1.
-     */
     enableTargetTexture1: boolean;
-    /**
-     * If enable gbuffer texture 2.
-     */
     enableTargetTexture2: boolean;
-    /**
-     * If enable gbuffer texture 3.
-     */
     enableTargetTexture3: boolean;
-    /**
-     * If enable gbuffer texture 4.
-     */
     enableTargetTexture4: boolean;
-    /**
-     * If render opaque list. Default to be true
-     */
+    enableTargetTexture5: boolean;
     renderOpaque: boolean;
-    /**
-     * If render transparent list. Default to be false
-     */
     renderTransparent: boolean;
@@ -52,2 +35,3 @@ }
     private _gBufferTex4;
+    private _gBufferTex5;
     private _defaultNormalMap;
@@ -57,2 +41,3 @@ private _defaultRoughnessMap;
     private _defaultDiffuseMap;
+    private _defaultEmissiveMap;
     private _frameBuffer;
@@ -90,2 +75,3 @@ private _outputs;
         targetTexture4?: Texture2D;
+        targetTexture5?: Texture2D;
     }): void;
@@ -101,2 +87,3 @@ /**
      * + 'albedo'
+     * + 'emission'
      * + 'velocity'
@@ -108,3 +95,3 @@ *
      */
-    renderDebug(renderer: Renderer, camera: Camera, type?: 'normal' | 'depth' | 'position' | 'glossiness' | 'metalness' | 'albedo' | 'velocity', viewport?: RendererViewport): void;
+    renderDebug(renderer: Renderer, camera: Camera, type?: 'normal' | 'depth' | 'position' | 'glossiness' | 'metalness' | 'albedo' | 'emission' | 'velocity', viewport?: RendererViewport): void;
     /**
@@ -142,2 +129,11 @@ * Get first target texture.
      * Channel storage:
+     * + R: emission.r
+     * + G: emission.g
+     * + B: emission.b
+     * + A: 1.0
+     */
+    getTargetTexture4(): Texture2D;
+    /**
+     * Get fourth target texture.
+     * Channel storage:
      * + R: velocity.r
@@ -147,3 +143,3 @@ * + G: velocity.g
      */
-    getTargetTexture4(): Texture2D;
+    getTargetTexture5(): Texture2D;
     /**
@@ -150,0 +146,0 @@ * @param  {clay.Renderer} renderer

dist/deferred/Renderer.d.ts

@@ -32,2 +32,3 @@ import Material from '../Material';
     private _ambientCubemapMat;
+    private _emissiveOutMat;
     private _spotLightShader;
@@ -71,2 +72,3 @@ private _pointLightShader;
         gBufferTexture3?: Texture2D;
+        gBufferTexture4?: Texture2D;
         ssaoTexture?: Texture2D;
@@ -73,0 +75,0 @@ /**

dist/shader/source/deferred/gbuffer.glsl.d.ts

@@ -194,2 +194,17 @@ import { FragmentShader, VertexShader } from '../../../Shader';
     };
+    emission: {
+        type: "vec3";
+        value: import("../../../glmatrix/common").Vec3Array;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
+    emissionIntensity: {
+        type: "float";
+        value: number;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
+    emissiveMap: {
+        type: "sampler2D";
+        value: import("../../../Texture2D").default;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
     doubleSided: {
@@ -237,3 +252,4 @@ type: "bool";
      * - 5: albedo
-     * - 6: velocity
+     * - 6: emission
+     * - 7: velocity
      */
@@ -250,2 +266,7 @@ debug: {
     };
+    gBufferTexture5: {
+        type: "sampler2D";
+        value: import("../../../Texture2D").default;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
 }, {
@@ -252,0 +273,0 @@ defines: {};

lib/App3D.js

@@ -219,3 +219,3 @@ // TODO createCompositor
                 const camera = this._scene.getMainCamera();
-                if (camera.projection.type === 'perspective') {
+                if (camera && camera.projection.type === 'perspective') {
                     camera.projection.aspect = this._renderer.getViewportAspect();
@@ -222,0 +222,0 @@ }

lib/deferred/GBuffer.d.ts

@@ -7,25 +7,8 @@ import Texture2D from '../Texture2D';
 export interface DeferredGBufferOpts {
-    /**
-     * If enable gbuffer texture 1.
-     */
     enableTargetTexture1: boolean;
-    /**
-     * If enable gbuffer texture 2.
-     */
     enableTargetTexture2: boolean;
-    /**
-     * If enable gbuffer texture 3.
-     */
     enableTargetTexture3: boolean;
-    /**
-     * If enable gbuffer texture 4.
-     */
     enableTargetTexture4: boolean;
-    /**
-     * If render opaque list. Default to be true
-     */
+    enableTargetTexture5: boolean;
     renderOpaque: boolean;
-    /**
-     * If render transparent list. Default to be false
-     */
     renderTransparent: boolean;
@@ -52,2 +35,3 @@ }
     private _gBufferTex4;
+    private _gBufferTex5;
     private _defaultNormalMap;
@@ -57,2 +41,3 @@ private _defaultRoughnessMap;
     private _defaultDiffuseMap;
+    private _defaultEmissiveMap;
     private _frameBuffer;
@@ -90,2 +75,3 @@ private _outputs;
         targetTexture4?: Texture2D;
+        targetTexture5?: Texture2D;
     }): void;
@@ -101,2 +87,3 @@ /**
      * + 'albedo'
+     * + 'emission'
      * + 'velocity'
@@ -108,3 +95,3 @@ *
      */
-    renderDebug(renderer: Renderer, camera: Camera, type?: 'normal' | 'depth' | 'position' | 'glossiness' | 'metalness' | 'albedo' | 'velocity', viewport?: RendererViewport): void;
+    renderDebug(renderer: Renderer, camera: Camera, type?: 'normal' | 'depth' | 'position' | 'glossiness' | 'metalness' | 'albedo' | 'emission' | 'velocity', viewport?: RendererViewport): void;
     /**
@@ -142,2 +129,11 @@ * Get first target texture.
      * Channel storage:
+     * + R: emission.r
+     * + G: emission.g
+     * + B: emission.b
+     * + A: 1.0
+     */
+    getTargetTexture4(): Texture2D;
+    /**
+     * Get fourth target texture.
+     * Channel storage:
      * + R: velocity.r
@@ -147,3 +143,3 @@ * + G: velocity.g
      */
-    getTargetTexture4(): Texture2D;
+    getTargetTexture5(): Texture2D;
     /**
@@ -150,0 +146,0 @@ * @param  {clay.Renderer} renderer

lib/deferred/GBuffer.js

@@ -25,3 +25,3 @@ import Texture2D from '../Texture2D';
 // TODO Performance improvement
-function getGetUniformHook(defaultDiffuseMap, defaultNormalMap, defaultRoughnessMap, defaultMetalnessMap) {
+function getGetUniformHook(defaultDiffuseMap, defaultNormalMap, defaultRoughnessMap, defaultMetalnessMap, defaultEmissiveMap) {
     return function (renderable, gBufferMat, symbol) {
@@ -48,2 +48,8 @@ var _a, _b, _c, _d;
                 return !!standardMaterial.get('metalnessMap');
+            case 'emission':
+                return standardMaterial.get('emission');
+            case 'emissionIntensity':
+                return standardMaterial.get('emissionIntensity') || 0;
+            case 'emissiveMap':
+                return standardMaterial.get(symbol) || defaultEmissiveMap;
             case 'linear':
@@ -130,5 +136,12 @@ return standardMaterial.isDefined('fragment', 'SRGB_DECODE');
         this._gBufferTex3 = new Texture2D(commonTextureOpts);
+        // - R: emission.r
+        // - G: emission.g
+        // - B: emission.b
+        // - A
         this._gBufferTex4 = new Texture2D(Object.assign({ 
             // FLOAT Texture has bug on iOS. is HALF_FLOAT enough?
             type: constants.HALF_FLOAT }, commonTextureOpts));
+        this._gBufferTex5 = new Texture2D(Object.assign({ 
+            // FLOAT Texture has bug on iOS. is HALF_FLOAT enough?
+            type: constants.HALF_FLOAT }, commonTextureOpts));
         this._defaultNormalMap = new Texture2D({
@@ -146,2 +159,5 @@ source: createFillCanvas('#000')
         });
+        this._defaultEmissiveMap = new Texture2D({
+            source: createFillCanvas('#fff')
+        });
         this._frameBuffer = new FrameBuffer();
@@ -155,3 +171,4 @@ this._outputs = [];
         this.enableTargetTexture3 = optional(opts.enableTargetTexture3, true);
-        this.enableTargetTexture4 = optional(opts.enableTargetTexture4, false);
+        this.enableTargetTexture4 = optional(opts.enableTargetTexture4, true);
+        this.enableTargetTexture5 = optional(opts.enableTargetTexture5, false);
         this.renderOpaque = optional(opts.renderOpaque, true);
@@ -174,2 +191,3 @@ this.renderTransparent = optional(opts.renderTransparent, false);
         this._gBufferTex4.resize(width, height);
+        this._gBufferTex5.resize(width, height);
     }
@@ -242,2 +260,3 @@ setViewport(x, y, width, height, dpr) {
         const enableTargetTexture4 = this.enableTargetTexture4;
+        const enableTargetTexture5 = this.enableTargetTexture5;
         if (!enableTargetTexture1 && !enableTargetTexture3 && !enableTargetTexture4) {
@@ -284,2 +303,6 @@ console.warn("Can't disable targetTexture1, targetTexture3, targetTexture4 both");
         }
+        if (enableTargetTexture5) {
+            frameBuffer.attach(opts.targetTexture5 || this._gBufferTex5, gl.COLOR_ATTACHMENT3);
+            outputs.push('color3');
+        }
         // Render list will be updated in gbuffer.
@@ -302,2 +325,5 @@ camera.updateOffset && camera.updateOffset(frameBuffer.getWidth(), frameBuffer.getHeight(), 1);
             }
+            if (enableTargetTexture5) {
+                gBufferMaterial.define('USE_TARGET_TEXTURE5');
+            }
         }
@@ -326,3 +352,3 @@ // Render nothing and do the clear.
             },
-            getMaterialUniform: getGetUniformHook(this._defaultDiffuseMap, this._defaultNormalMap, this._defaultRoughnessMap, this._defaultMetalnessMap),
+            getMaterialUniform: getGetUniformHook(this._defaultDiffuseMap, this._defaultNormalMap, this._defaultRoughnessMap, this._defaultMetalnessMap, this._defaultEmissiveMap),
             isMaterialChanged,
@@ -404,2 +430,3 @@ sortCompare: Renderer.opaqueSortCompare,
      * + 'albedo'
+     * + 'emission'
      * + 'velocity'
@@ -419,3 +446,4 @@ *
             albedo: 5,
-            velocity: 6
+            emission: 6,
+            velocity: 7
         };
@@ -441,2 +469,3 @@ if (debugTypes[type] == null) {
         debugPassMat.set('gBufferTexture4', this._gBufferTex4);
+        debugPassMat.set('gBufferTexture5', this._gBufferTex5);
         debugPassMat.set('debug', debugTypes[type]);
@@ -486,2 +515,13 @@ debugPassMat.set('viewProjectionInv', viewProjectionInv.array);
      * Channel storage:
+     * + R: emission.r
+     * + G: emission.g
+     * + B: emission.b
+     * + A: 1.0
+     */
+    getTargetTexture4() {
+        return this._gBufferTex4;
+    }
+    /**
+     * Get fourth target texture.
+     * Channel storage:
      * + R: velocity.r
@@ -491,3 +531,3 @@ * + G: velocity.g
      */
-    getTargetTexture4() {
+    getTargetTexture5() {
         return this._gBufferTex4;
@@ -494,0 +534,0 @@ }

lib/deferred/Renderer.d.ts

@@ -32,2 +32,3 @@ import Material from '../Material';
     private _ambientCubemapMat;
+    private _emissiveOutMat;
     private _spotLightShader;
@@ -71,2 +72,3 @@ private _pointLightShader;
         gBufferTexture3?: Texture2D;
+        gBufferTexture4?: Texture2D;
         ssaoTexture?: Texture2D;
@@ -73,0 +75,0 @@ /**

lib/deferred/Renderer.js

@@ -84,6 +84,7 @@ // Light-pre pass deferred rendering
         cylinderGeo.applyTransform(mat);
-        this._directionalLightMat = this._createLightPassMat(directionalLightShader);
-        this._ambientMat = this._createLightPassMat(new Shader(fullscreenQuadPassVertex, deferredAmbientLightFragment));
-        this._ambientSHMat = this._createLightPassMat(new Shader(fullscreenQuadPassVertex, deferredAmbientSHLightFragment));
-        this._ambientCubemapMat = this._createLightPassMat(new Shader(fullscreenQuadPassVertex, deferredAmbientCubemapLightFragment));
+        this._directionalLightMat = createLightPassMat(directionalLightShader);
+        this._ambientMat = createLightPassMat(new Shader(fullscreenQuadPassVertex, deferredAmbientLightFragment));
+        this._ambientSHMat = createLightPassMat(new Shader(fullscreenQuadPassVertex, deferredAmbientSHLightFragment));
+        this._ambientCubemapMat = createLightPassMat(new Shader(fullscreenQuadPassVertex, deferredAmbientCubemapLightFragment));
+        this._emissiveOutMat = createLightPassMat(new Shader(fullscreenQuadPassVertex, outputFragment));
         this._spotLightShader = new Shader(lightVolumeVertex, deferredSpotLightFragment);
@@ -120,3 +121,3 @@ this._pointLightShader = new Shader(lightVolumeVertex, deferredPointLightFragment);
         const pixelRatio = renderer.getPixelRatio();
-        const isInputGBuffer = opts.gBufferTexture1 && opts.gBufferTexture2 && opts.gBufferTexture3;
+        const isInputGBuffer = opts.gBufferTexture1 && opts.gBufferTexture2 && opts.gBufferTexture3 && opts.gBufferTexture4;
         if (this.autoResize &&
@@ -136,3 +137,4 @@ (renderer.getWidth() * pixelRatio !== lightAccumTex.width ||
                 gBufferTexture2: opts.gBufferTexture2,
-                gBufferTexture3: opts.gBufferTexture3
+                gBufferTexture3: opts.gBufferTexture3,
+                gBufferTexture4: opts.gBufferTexture4
             }
@@ -215,2 +217,3 @@ : undefined);
         let gBufferTexture3;
+        let gBufferTexture4;
         if (gBufferTextures) {
@@ -220,2 +223,3 @@ gBufferTexture1 = gBufferTextures.gBufferTexture1;
             gBufferTexture3 = gBufferTextures.gBufferTexture3;
+            gBufferTexture4 = gBufferTextures.gBufferTexture4;
         }
@@ -226,2 +230,3 @@ else {
             gBufferTexture3 = gBuffer.getTargetTexture3();
+            gBufferTexture4 = gBuffer.getTargetTexture4();
         }
@@ -389,2 +394,9 @@ // Render nothing and do the clear.
         }
+        // Add emissive
+        const emissiveOutMat = (fullQuadPass.material = this._emissiveOutMat);
+        emissiveOutMat.set('colorTex', gBufferTexture4);
+        emissiveOutMat.depthMask = false;
+        emissiveOutMat.transparent = true;
+        emissiveOutMat.blend = lightAccumulateBlendFunc;
+        fullQuadPass.renderQuad(renderer, lightAccumFrameBuffer);
     }
@@ -391,0 +403,0 @@ _updatePCFKernel(material) {

lib/shader/source/deferred/gbuffer.glsl.d.ts

@@ -194,2 +194,17 @@ import { FragmentShader, VertexShader } from '../../../Shader';
     };
+    emission: {
+        type: "vec3";
+        value: import("../../../glmatrix/common").Vec3Array;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
+    emissionIntensity: {
+        type: "float";
+        value: number;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
+    emissiveMap: {
+        type: "sampler2D";
+        value: import("../../../Texture2D").default;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
     doubleSided: {
@@ -237,3 +252,4 @@ type: "bool";
      * - 5: albedo
-     * - 6: velocity
+     * - 6: emission
+     * - 7: velocity
      */
@@ -250,2 +266,7 @@ debug: {
     };
+    gBufferTexture5: {
+        type: "sampler2D";
+        value: import("../../../Texture2D").default;
+        semantic: import("../../../Shader").UniformSemantic | import("../../../Shader").MatrixSemantic | undefined;
+    };
 }, {
@@ -252,0 +273,0 @@ defines: {};

lib/shader/source/deferred/gbuffer.glsl.js

@@ -73,3 +73,3 @@ import { createArrayUniform, createAttribute as attribute, createUniform as uniform, createVarying as varying, FragmentShader, glsl, VertexShader } from '../../../Shader';
 
-  #ifdef USE_TARGET_TEXTURE4
+  #ifdef USE_TARGET_TEXTURE5
   // Weighted Sum Skinning Matrix
@@ -112,3 +112,3 @@ // PENDING Must be assigned.
 
-#ifdef USE_TARGET_TEXTURE4
+#ifdef USE_TARGET_TEXTURE5
   v_ViewPosition = worldViewProjection * vec4(skinnedPosition, 1.0);
@@ -156,2 +156,5 @@ v_PrevViewPosition = prevWorldViewProjection * vec4(prevSkinnedPosition, 1.0);
         useRoughness: uniform('bool'),
+        emission: uniform('vec3'),
+        emissionIntensity: uniform('float'),
+        emissiveMap: uniform('sampler2D'),
         doubleSided: uniform('bool'),
@@ -217,3 +220,2 @@ alphaCutoff: uniform('float', 0.0),
 
-  // Texture 2
 #ifdef USE_TARGET_TEXTURE3
@@ -239,2 +241,13 @@ float m = metalness;
 #ifdef USE_TARGET_TEXTURE4
+  // Emission
+  vec3 emissionRgb = emission;
+  vec3 emissionTexel = texture(emissiveMap, v_Texcoord).rgb;
+  if (linear) {
+    emissionRgb = sRGBToLinear(vec4(emissionRgb, 1.0)).rgb;
+    emissionTexel = sRGBToLinear(vec4(emissionTexel, 1.0)).rgb;
+  }
+  out_color2 = vec4(emissionRgb * emissionTexel * emissionIntensity, 1.0);
+#endif
+
+#ifdef USE_TARGET_TEXTURE5
   // Velocity
@@ -245,6 +258,6 @@ vec2 cur = v_ViewPosition.xy / v_ViewPosition.w;
   if (firstRender) {
-    out_color2 = vec4(0.0, 0.0, 0.0, a);
+    out_color3 = vec4(0.0, 0.0, 0.0, a);
   }
   else {
-    out_color2 = vec4((cur - prev) * 0.5 + 0.5, 0.0, a);
+    out_color3 = vec4((cur - prev) * 0.5 + 0.5, 0.0, a);
   }
@@ -265,7 +278,9 @@ #endif
          * - 5: albedo
-         * - 6: velocity
+         * - 6: emission
+         * - 7: velocity
          */
         debug: uniform('int', 0),
+        gBufferTexture4: uniform('sampler2D'),
         // gbuffer1, 2, 3 already been in the gBufferReadMixin
-        gBufferTexture4: uniform('sampler2D')
+        gBufferTexture5: uniform('sampler2D')
     },
@@ -289,4 +304,6 @@ includes: [gBufferReadMixin],
     out_color = vec4(albedo, 1.0);
+  } else if (debug == 6){
+    out_color = vec4(texture(gBufferTexture4, uv).rgb, 1.0);
   } else {
-    vec4 color = texture(gBufferTexture4, uv);
+    vec4 color = texture(gBufferTexture5, uv);
     color.rg -= 0.5;
@@ -293,0 +310,0 @@ color.rg *= 2.0;

package.json

 {
   "name": "claygl-next",
-  "version": "2.0.0-alpha.38",
+  "version": "2.0.0-alpha.39",
   "description": "A 3D graphic library",
@@ -5,0 +5,0 @@ "keywords": [

No alert changes

Improved metrics

Total package byte prevSize

7153448

increased by0.21%

Lines of code

122181

increased by0.19%

No dependency changes