diff --git a/example/gltf.ts b/example/gltf.ts index c9c11c39..bb9212dd 100644 --- a/example/gltf.ts +++ b/example/gltf.ts @@ -12,22 +12,22 @@ import { Timeline } from 'claygl'; -const renderer = new Renderer({ - canvas: document.getElementById('main') as HTMLCanvasElement -}); -renderer.resize(window.innerWidth, window.innerHeight); -const shadowMapPass = new ShadowMapPass(); -const environmentMap = new TextureCube({ - width: 256, - height: 256 -}); -const environmentMapPass = new EnvironmentMapPass({ - texture: environmentMap -}); -const timeline = new Timeline(); -timeline.start(); - loadGLTFAsync('assets/models/basic_scene/scene.gltf').then((res) => { + const renderer = new Renderer({ + canvas: document.getElementById('main') as HTMLCanvasElement + }); + renderer.resize(window.innerWidth, window.innerHeight); + const shadowMapPass = new ShadowMapPass(); + const environmentMap = new TextureCube({ + width: 256, + height: 256 + }); + const environmentMapPass = new EnvironmentMapPass({ + texture: environmentMap + }); + const timeline = new Timeline(); + timeline.start(); + const scene = res.scene!; scene.rotation.rotateX(-Math.PI / 2); const camera = new PerspectiveCamera({ diff --git a/src/FrameBuffer.ts b/src/FrameBuffer.ts index dba28e3e..26b7e41f 100644 --- a/src/FrameBuffer.ts +++ b/src/FrameBuffer.ts @@ -130,7 +130,7 @@ class FrameBuffer { const attachedTextures = cache.get('attached_textures'); if (attachedTextures) { for (const attachment in attachedTextures) { - if (!this._textures[attachment as unknown as GLEnum]) { + if (!textures[attachment as unknown as GLEnum]) { const target = attachedTextures[attachment]; this._doDetach(_gl, attachment as unknown as GLEnum, target); } @@ -252,6 +252,7 @@ class FrameBuffer { const boundRenderer = this._boundRenderer; const _gl = boundRenderer && boundRenderer.gl; + const textures = this._textures; let attachedTextures; if (_gl) { @@ -261,7 +262,7 @@ class FrameBuffer { } // Check if texture attached - const previous = this._textures[attachment]; + const previous = textures[attachment]; if ( previous && previous.target === target && @@ -282,20 +283,21 @@ class FrameBuffer { } if (canAttach) { - this._textures[attachment] = this._textures[attachment] || ({} as any); - this._textures[attachment]!.texture = texture; - this._textures[attachment]!.target = target; + textures[attachment] = textures[attachment] || ({} as any); + textures[attachment]!.texture = texture; + textures[attachment]!.target = target; } } _doAttach(renderer: Renderer, texture: Texture, attachment: GLEnum, target: GLEnum): boolean { const _gl = renderer.gl; + const cache = this._cache; // Make sure texture is always updated // Because texture width or height may be changed and in this we can't be notified // FIXME awkward; const webglTexture = texture.getWebGLTexture(renderer); // Assume cache has been used. - let attachedTextures = this._cache.get('attached_textures'); + let attachedTextures = cache.get('attached_textures'); if (attachedTextures && attachedTextures[attachment]) { const obj = attachedTextures[attachment]; // Check if texture and target not changed @@ -321,15 +323,15 @@ class FrameBuffer { // Dispose render buffer created previous if (canAttach) { - const renderbuffer = this._cache.get(KEY_RENDERBUFFER); + const renderbuffer = cache.get(KEY_RENDERBUFFER); if (renderbuffer) { _gl.framebufferRenderbuffer(GL_FRAMEBUFFER, GL_DEPTH_ATTACHMENT, GL_RENDERBUFFER, null); _gl.deleteRenderbuffer(renderbuffer); - this._cache.put(KEY_RENDERBUFFER, false); + cache.put(KEY_RENDERBUFFER, false); } - this._cache.put(KEY_RENDERBUFFER_ATTACHED, false); - this._cache.put(KEY_DEPTHTEXTURE_ATTACHED, true); + cache.put(KEY_RENDERBUFFER_ATTACHED, false); + cache.put(KEY_DEPTHTEXTURE_ATTACHED, true); } } @@ -338,7 +340,7 @@ class FrameBuffer { if (!attachedTextures) { attachedTextures = {}; - this._cache.put('attached_textures', attachedTextures); + cache.put('attached_textures', attachedTextures); } attachedTextures[attachment] = attachedTextures[attachment] || {}; attachedTextures[attachment].texture = texture; @@ -352,14 +354,15 @@ class FrameBuffer { // https://github.com/KhronosGroup/WebGL/blob/master/conformance-suites/1.0.0/conformance/framebuffer-test.html#L145 _gl.framebufferTexture2D(GL_FRAMEBUFFER, attachment, target, null, 0); + const cache = this._cache; // Assume cache has been used. - const attachedTextures = this._cache.get('attached_textures'); + const attachedTextures = cache.get('attached_textures'); if (attachedTextures && attachedTextures[attachment]) { attachedTextures[attachment] = null; } if (attachment === GL_DEPTH_ATTACHMENT || attachment === glenum.DEPTH_STENCIL_ATTACHMENT) { - this._cache.put(KEY_DEPTHTEXTURE_ATTACHED, false); + cache.put(KEY_DEPTHTEXTURE_ATTACHED, false); } } @@ -371,10 +374,11 @@ class FrameBuffer { detach(attachment: GLEnum, target: GLEnum) { // TODO depth extension check ? this._textures[attachment] = undefined; - if (this._boundRenderer) { + const boundRenderer = this._boundRenderer; + if (boundRenderer) { const cache = this._cache; - cache.use(this._boundRenderer.__uid__); - this._doDetach(this._boundRenderer.gl, attachment, target); + cache.use(boundRenderer.__uid__); + this._doDetach(boundRenderer.gl, attachment, target); } } /** diff --git a/src/Texture2D.ts b/src/Texture2D.ts index b74f41d9..6f0ff257 100644 --- a/src/Texture2D.ts +++ b/src/Texture2D.ts @@ -207,7 +207,7 @@ class Texture2D extends Texture { imgData = this._potCanvas; } gl.texImage2D(glenum.TEXTURE_2D, level, glFormat, glFormat, glType, imgData); - } else if (data.pixels) { + } else { // Can be used as a blank texture when writing render to texture(RTT) if ( // S3TC @@ -235,7 +235,7 @@ class Texture2D extends Texture { 0, glFormat, glType, - data.pixels + data.pixels || null ); } } diff --git a/src/TextureCube.ts b/src/TextureCube.ts index 5f48a13c..8cc6d03f 100644 --- a/src/TextureCube.ts +++ b/src/TextureCube.ts @@ -175,7 +175,7 @@ class TextureCube extends Texture { glType, img ); - } else if (pixels) { + } else { _gl.texImage2D( glenum.TEXTURE_CUBE_MAP_POSITIVE_X + i, level, @@ -185,7 +185,7 @@ class TextureCube extends Texture { 0, glFormat, glType, - pixels + pixels || null ); } } diff --git a/src/gpu/GLProgram.ts b/src/gpu/GLProgram.ts index 3b64d338..80adcc1d 100644 --- a/src/gpu/GLProgram.ts +++ b/src/gpu/GLProgram.ts @@ -71,7 +71,7 @@ class GLProgram { } hasUniform(symbol: string) { - const location = this._attrLocations[symbol]; + const location = this._uniformLocations[symbol]; return location !== null && location !== undefined; } diff --git a/src/prePass/ShadowMap.ts b/src/prePass/ShadowMap.ts index b305fe51..f70be359 100644 --- a/src/prePass/ShadowMap.ts +++ b/src/prePass/ShadowMap.ts @@ -638,7 +638,7 @@ class ShadowMapPass extends Notifier { let shadowMaterial = this._lightMaterials[light.__uid__]; const isPointLight = light.type === 'POINT_LIGHT'; if (!shadowMaterial) { - const shaderPrefix = isPointLight ? 'clay.sm.distance.' : 'clay.sm.depth.'; + const shaderPrefix = 'clay.sm.' + (isPointLight ? 'distance.' : 'depth.'); shadowMaterial = new Material({ precision: this.precision, shader: new Shader(