zen-3d - npm Package Compare versions

Comparing version 0.0.3 to 0.0.4

examples/js/Clock.js

@@ -0,0 +0,0 @@ /**

examples/js/controls/FlyControls.js

@@ -0,0 +0,0 @@ /**

examples/js/controls/FreeControls.js

@@ -0,0 +0,0 @@ /**

examples/js/controls/OrbitControls.js

@@ -0,0 +0,0 @@ /**

examples/js/GBuffer.js

@@ -12,3 +12,4 @@ /**
 		metalness: 4,
-		albedo: 5
+		albedo: 5,
+		velocity: 6
 	};
@@ -21,2 +22,3 @@
 		var albedoMetalnessMaterials = new Map();
+		var motionMaterials = new Map();
 		var MRTMaterials = new Map();
@@ -34,2 +36,12 @@
 			result.morphNormals = !!renderable.object.morphTargetInfluences && renderable.object.geometry.morphAttributes.normal;
+
+			var maxBones = 0;
+			if (result.useSkinning) {
+				if (renderable.object.skeleton.boneTexture) {
+					maxBones = 1024;
+				} else {
+					maxBones = renderable.object.skeleton.bones.length;
+				}
+			}
+			result.maxBones = maxBones;
 		}
@@ -120,6 +132,39 @@
 
+		function getMotionMaterial(renderable) {
+			generateMaterialState(renderable, state);
+
+			var material;
+			var code = state.useSkinning +
+				"_" + state.maxBones +
+				"_" + state.morphTargets;
+			if (!motionMaterials.has(code)) {
+				material = new zen3d.ShaderMaterial(GBufferShader.motion);
+				motionMaterials.set(code, material);
+			} else {
+				material = motionMaterials.get(code);
+			}
+
+			if (renderable.object.userData['prevModel'] && renderable.object.userData['prevViewProjection']) {
+				helpMatrix4.fromArray(renderable.object.userData['prevModel']).toArray(material.uniforms['prevModel']);
+				helpMatrix4.fromArray(renderable.object.userData['prevViewProjection']).toArray(material.uniforms['prevViewProjection']);
+				material.uniforms['firstRender'] = false;
+
+				if (renderable.object.userData['prevBoneTexture']) {
+					material.uniforms['prevBoneTexture'] = renderable.object.userData['prevBoneTexture'];
+					material.uniforms['prevBoneTextureSize'] = renderable.object.userData['prevBoneTexture'].image.width;
+				} else if (renderable.object.userData['prevBoneMatrices']) {
+					material.uniforms['prevBoneMatrices'] = renderable.object.userData['prevBoneMatrices'];
+				}
+			} else {
+				material.uniforms['firstRender'] = true;
+			}
+
+			return material;
+		}
+
 		return {
 			getMrtMaterial: getMrtMaterial,
 			getNormalGlossinessMaterial: getNormalGlossinessMaterial,
-			getAlbedoMetalnessMaterial: getAlbedoMetalnessMaterial
+			getAlbedoMetalnessMaterial: getAlbedoMetalnessMaterial,
+			getMotionMaterial: getMotionMaterial
 		}
@@ -162,5 +207,7 @@ }
 
-		this._normalGlossinessMaterials = new Map();
-		this._albedoMetalnessMaterials = new Map();
-		this._MRTMaterials = new Map();
+		this._renderTarget3 = new zen3d.RenderTarget2D(width, height);
+		this._renderTarget3.texture.type = zen3d.WEBGL_PIXEL_TYPE.HALF_FLOAT;
+		this._renderTarget3.texture.minFilter = zen3d.WEBGL_TEXTURE_FILTER.NEAREST;
+		this._renderTarget3.texture.magFilter = zen3d.WEBGL_TEXTURE_FILTER.NEAREST;
+		this._renderTarget3.texture.generateMipmaps = false;
 
@@ -172,2 +219,4 @@ this._debugPass = new zen3d.ShaderPostPass(GBufferShader.debug);
 		this.enableAlbedoMetalness = true;
+
+		this.enableMotion = false;
 	}
@@ -185,2 +234,3 @@
 			this._renderTarget2.resize(width, height);
+			this._renderTarget3.resize(width, height);
 		},
@@ -212,2 +262,4 @@
 						// this._depthTexture.type = zen3d.WEBGL_PIXEL_TYPE.FLOAT_32_UNSIGNED_INT_24_8_REV;
+
+						this._renderTarget3.texture.internalformat = zen3d.WEBGL_PIXEL_FORMAT.RGBA16F; // TODO use MRT to render motion texture
 					}
@@ -235,10 +287,46 @@
 				});
+			} else {
+				// render normalDepthRenderTarget
 
-				return;
+				if (this.enableNormalGlossiness) {
+					glCore.renderTarget.setRenderTarget(this._renderTarget1);
+
+					glCore.state.colorBuffer.setClear(0, 0, 0, 0);
+					glCore.clear(true, true, true);
+
+					glCore.renderPass(renderList.opaque, camera, {
+						scene: scene,
+						getMaterial: function(renderable) {
+							return materialCache.getNormalGlossinessMaterial(renderable);
+						},
+						ifRender: function(renderable) {
+							return !!renderable.geometry.getAttribute("a_Normal");
+						}
+					});
+				}
+
+				// render albedoMetalnessRenderTarget
+
+				if (this.enableAlbedoMetalness) {
+					glCore.renderTarget.setRenderTarget(this._renderTarget2);
+
+					glCore.state.colorBuffer.setClear(0, 0, 0, 0);
+					glCore.clear(true, true, true);
+
+					glCore.renderPass(renderList.opaque, camera, {
+						scene: scene,
+						getMaterial: function(renderable) {
+							return materialCache.getAlbedoMetalnessMaterial(renderable);
+						},
+						ifRender: function(renderable) {
+							return !!renderable.geometry.getAttribute("a_Normal");
+						}
+					});
+				}
 			}
 
-			// render normalDepthRenderTarget
+			// render motionRenderTarget
 
-			if (this.enableNormalGlossiness) {
-				glCore.renderTarget.setRenderTarget(this._renderTarget1);
+			if (this.enableMotion) {
+				glCore.renderTarget.setRenderTarget(this._renderTarget3);
 
@@ -248,30 +336,47 @@ glCore.state.colorBuffer.setClear(0, 0, 0, 0);
 
-				glCore.renderPass(renderList.opaque, camera, {
+				var renderConfig = {
 					scene: scene,
 					getMaterial: function(renderable) {
-						return materialCache.getNormalGlossinessMaterial(renderable);
+						return materialCache.getMotionMaterial(renderable);
 					},
-					ifRender: function(renderable) {
-						return !!renderable.geometry.getAttribute("a_Normal");
-					}
-				});
-			}
+					afterRender: function(glCore, renderable) {
+						if (!renderable.object.userData['prevModel']) {
+							renderable.object.userData['prevModel'] = new Float32Array(16);
+						}
+						renderable.object.worldMatrix.toArray(renderable.object.userData['prevModel']);
 
-			// render albedoMetalnessRenderTarget
+						if (!renderable.object.userData['prevViewProjection']) {
+							renderable.object.userData['prevViewProjection'] = new Float32Array(16);
+						}
+						helpMatrix4.multiplyMatrices(camera.projectionMatrix, camera.viewMatrix).toArray(renderable.object.userData['prevViewProjection']);
 
-			if (this.enableAlbedoMetalness) {
-				glCore.renderTarget.setRenderTarget(this._renderTarget2);
+						if (renderable.object.skeleton) {
+							if (renderable.object.skeleton.boneTexture) {
+								if (!renderable.object.userData['prevBoneTexture']) {
+									var oldTexture = renderable.object.skeleton.boneTexture;
+									var newTexture = oldTexture.clone();
+									newTexture.image = {
+										width: oldTexture.image.width,
+										height: oldTexture.image.height,
+										data: new Float32Array(oldTexture.image.data.length)
+									};
+									renderable.object.userData['prevBoneTexture'] = newTexture;
+								}
 
-				glCore.state.colorBuffer.setClear(0, 0, 0, 0);
-				glCore.clear(true, true, true);
+								renderable.object.userData['prevBoneTexture'].image.data.set(renderable.object.skeleton.boneTexture.image.data);
+								renderable.object.userData['prevBoneTexture'].version++;
+							} else {
+								if (!renderable.object.userData['prevBoneMatrices']) {
+									renderable.object.userData['prevBoneMatrices'] = new Float32Array(skeleton.boneMatrices.length);
+								}
+								renderable.object.userData['prevBoneMatrices'].set(skeleton.boneMatrices);
+							}
+						}
 
-				glCore.renderPass(renderList.opaque, camera, {
-					scene: scene,
-					getMaterial: function(renderable) {
-						return materialCache.getAlbedoMetalnessMaterial(renderable);
-					},
-					ifRender: function(renderable) {
-						return !!renderable.geometry.getAttribute("a_Normal");
+						// TODO support morph targets
 					}
-				});
+				};
+
+				glCore.renderPass(renderList.opaque, camera, renderConfig);
+				glCore.renderPass(renderList.transparent, camera, renderConfig);
 			}
@@ -289,2 +394,3 @@ },
          * + 'albedo'
+		 * + 'velocity'
          *
@@ -299,2 +405,3 @@ * @param {zen3d.GLCore} renderer
 			this._debugPass.uniforms["albedoMetalnessTexture"] = this.getAlbedoMetalnessTexture();
+			this._debugPass.uniforms["motionTexture"] = this.getMotionTexture();
 			this._debugPass.uniforms["debug"] = debugTypes[type] || 0;
@@ -344,5 +451,17 @@ this._debugPass.uniforms["viewWidth"] = glCore.state.currentRenderTarget.width;
 
+		/**
+         * Get motion texture.
+         * Channel storage:
+         * + R: velocity.x
+         * + G: velocity.y
+         * @return {zen3d.Texture2D}
+         */
+		getMotionTexture: function() {
+			return this._renderTarget3.texture;
+		},
+
 		dispose: function() {
 			this._renderTarget1.dispose();
 			this._renderTarget2.dispose();
+			this._renderTarget3.dispose();
 
@@ -355,2 +474,3 @@ this._depthTexture.dispose();
 			materialCache.albedoMetalnessMaterials.forEach(material => material.dispose());
+			materialCache.motionMaterials.forEach(material => material.dispose());
 
@@ -360,2 +480,3 @@ materialCache.MRTMaterials.clear();
 			materialCache.albedoMetalnessMaterials.clear();
+			materialCache.motionMaterials.clear();
 		}
@@ -491,2 +612,111 @@
 
+		motion: {
+
+			uniforms: {
+
+				prevModel: new Float32Array(16),
+				prevViewProjection: new Float32Array(16),
+
+				prevBoneTexture: null,
+				prevBoneTextureSize: 256,
+				prevBoneMatrices: new Float32Array(),
+
+				firstRender: false
+
+			},
+
+			vertexShader: [
+				"#include <common_vert>",
+				"#include <morphtarget_pars_vert>",
+				"#include <skinning_pars_vert>",
+
+				"uniform mat4 prevModel;",
+				"uniform mat4 prevViewProjection;",
+
+				"varying vec4 v_ScreenPosition;",
+				"varying vec4 v_PrevScreenPosition;",
+
+				"#ifdef USE_SKINNING",
+				"	#ifdef BONE_TEXTURE",
+				"		uniform sampler2D prevBoneTexture;",
+				"		uniform int prevBoneTextureSize;",
+				"		mat4 getPrevBoneMatrix(const in float i) {",
+				"			float j = i * 4.0;",
+				"			float x = mod( j, float( prevBoneTextureSize ) );",
+				"			float y = floor( j / float( prevBoneTextureSize ) );",
+
+				"			float dx = 1.0 / float( prevBoneTextureSize );",
+				"			float dy = 1.0 / float( prevBoneTextureSize );",
+
+				"			y = dy * ( y + 0.5 );",
+
+				"			vec4 v1 = texture2D( prevBoneTexture, vec2( dx * ( x + 0.5 ), y ) );",
+				"			vec4 v2 = texture2D( prevBoneTexture, vec2( dx * ( x + 1.5 ), y ) );",
+				"			vec4 v3 = texture2D( prevBoneTexture, vec2( dx * ( x + 2.5 ), y ) );",
+				"			vec4 v4 = texture2D( prevBoneTexture, vec2( dx * ( x + 3.5 ), y ) );",
+
+				"			mat4 bone = mat4( v1, v2, v3, v4 );",
+
+				"			return bone;",
+				"		}",
+				"	#else",
+				"		uniform mat4 prevBoneMatrices[MAX_BONES];",
+				"		mat4 getPrevBoneMatrix(const in float i) {",
+				"			mat4 bone = prevBoneMatrices[int(i)];",
+				"			return bone;",
+				"		}",
+				"	#endif",
+				"#endif",
+
+				"void main() {",
+				"	#include <begin_vert>",
+
+				"	vec3 prevTransformed = transformed;",
+
+				"	#include <morphtarget_vert>",
+				"	#include <skinning_vert>",
+				"	#include <pvm_vert>",
+
+				"	#ifdef USE_SKINNING",
+				"		mat4 prevBoneMatX = getPrevBoneMatrix( skinIndex.x );",
+				"		mat4 prevBoneMatY = getPrevBoneMatrix( skinIndex.y );",
+				"		mat4 prevBoneMatZ = getPrevBoneMatrix( skinIndex.z );",
+				"		mat4 prevBoneMatW = getPrevBoneMatrix( skinIndex.w );",
+
+				"		vec4 prevSkinVertex = bindMatrix * vec4(prevTransformed, 1.0);",
+
+				"		vec4 prevSkinned = vec4( 0.0 );",
+				"		prevSkinned += prevBoneMatX * prevSkinVertex * skinWeight.x;",
+				"		prevSkinned += prevBoneMatY * prevSkinVertex * skinWeight.y;",
+				"		prevSkinned += prevBoneMatZ * prevSkinVertex * skinWeight.z;",
+				"		prevSkinned += prevBoneMatW * prevSkinVertex * skinWeight.w;",
+				"		prevSkinned = bindMatrixInverse * prevSkinned;",
+
+				"		prevTransformed = prevSkinned.xyz / prevSkinned.w;",
+				"	#endif",
+
+				"	v_ScreenPosition = u_Projection * u_View * u_Model * vec4(transformed, 1.0);",
+				"	v_PrevScreenPosition = prevViewProjection * prevModel * vec4(prevTransformed, 1.0);",
+				"}"
+			].join("\n"),
+
+			fragmentShader: [
+				"uniform bool firstRender;",
+
+				"varying vec4 v_ScreenPosition;",
+				"varying vec4 v_PrevScreenPosition;",
+
+				"void main() {",
+				"	vec2 a = v_ScreenPosition.xy / v_ScreenPosition.w;",
+				"	vec2 b = v_PrevScreenPosition.xy / v_PrevScreenPosition.w;",
+
+				"	if (firstRender) {",
+				"		gl_FragColor = vec4(0.0);",
+				"	} else {",
+				"		gl_FragColor = vec4((a - b) * 0.5 + 0.5, 0.0, 1.0);",
+				"	}",
+				"}"
+			].join("\n"),
+		},
+
 		MRT: {
@@ -587,2 +817,3 @@
 				albedoMetalnessTexture: null,
+				motionTexture: null,
 
@@ -619,2 +850,3 @@ debug: 0,
 				"uniform sampler2D albedoMetalnessTexture;",
+				"uniform sampler2D motionTexture;",
 
@@ -678,4 +910,9 @@ // DEBUG
 				"		gl_FragColor = vec4(vec3(metalness), 1.0);",
+				"	} else if (debug == 5) {",
+				"		gl_FragColor = vec4(albedo, 1.0);",
 				"	} else {",
-				"		gl_FragColor = vec4(albedo, 1.0);",
+				"		vec4 texel4 = texture2D(motionTexture, texCoord);",
+				"		texel4.rg -= 0.5;",
+				"		texel4.rg *= 2.0;",
+				"		gl_FragColor = texel4;",
 				"	}",
@@ -682,0 +919,0 @@

examples/js/GeometryUtils.js

@@ -0,0 +0,0 @@ /**

examples/js/loaders/AssimpJsonLoader.js

@@ -0,0 +0,0 @@ /**

examples/js/loaders/DRACOLoader.js

@@ -0,0 +0,0 @@ /**

examples/js/loaders/GLTFLoader.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/DirectionalLightHelper.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/GridHelper.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/ParticleContainer.js

@@ -0,0 +0,0 @@ /*

examples/js/objects/PointLightHelper.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/SkeletonHelper.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/Sky.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/SkyBox.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/SpotLightHelper.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/Sprite.js

@@ -0,0 +0,0 @@ /**

examples/js/objects/Water.js

@@ -0,0 +0,0 @@ /**

examples/js/pass/BlurPass.js

@@ -0,0 +0,0 @@ /**

examples/js/pass/SSAOPass.js

@@ -62,8 +62,7 @@ /**
 	// offset 为偏移值，传入不同的偏移可以生成不同的分布数
-	// hemisphere 代表phi的范围是否在0~180内，否则生成在0-360内
-	function generateKernel(size, offset, hemisphere) {
+	function generateKernel(size, offset) {
 		var kernel = new Float32Array(size * 3);
 		offset = offset || 0;
 		for (var i = 0; i < size; i++) {
-			var phi = halton(i + offset, 2) * (hemisphere ? 1 : 2) * Math.PI; // phi是方位面（水平面）内的角度
+			var phi = halton(i + offset, 2) * Math.PI; // phi是方位面（水平面）内的角度
 			var theta = halton(i + offset, 3) * Math.PI; // theta是俯仰面（竖直面）内的角度
@@ -99,3 +98,3 @@ var r = Math.random();
 		if (!this._kernels[code]) {
-			this._kernels[code] = generateKernel(size, offset * size, true);
+			this._kernels[code] = generateKernel(size, offset * size);
 		}
@@ -102,0 +101,0 @@

examples/js/PMREM.js

@@ -0,0 +0,0 @@ /**

examples/js/renderers/DeferredRenderer.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/BlendShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/BlurShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/ColorAdjustShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/CopyShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/DeferredShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/DepthLinearShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/FastGaussianBlurShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/FilmShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/FXAAShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/LineDashedShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/LuminosityHighPassShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/MotionBlurShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/ShadowShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/SketchShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/SSAOShader.js

@@ -0,0 +0,0 @@ /**

examples/js/shaders/SSRShader.js

@@ -34,2 +34,3 @@ /**
 		'zThicknessThreshold': 0.1,
+		'jitterOffset': 0,
 
@@ -90,2 +91,3 @@ 'nearZ': 0,
 		'uniform float zThicknessThreshold;',
+		'uniform float jitterOffset;',
 
@@ -92,0 +94,0 @@ 'uniform float nearZ;',

examples/js/shaders/VolumeShader.js

@@ -0,0 +0,0 @@ /**

examples/js/stereo/StereoCamera.js

@@ -0,0 +0,0 @@ /**

examples/js/stereo/StereoRenderer.js

@@ -0,0 +0,0 @@ /**

examples/js/stereo/WebVRControls.js

@@ -0,0 +0,0 @@ /**

examples/js/stereo/WebXRControls.js

@@ -0,0 +0,0 @@ /**

examples/js/SuperSampling.js

@@ -45,5 +45,5 @@ /**
 
-	this._blendPass = new zen3d.ShaderPostPass(zen3d.BlendShader);
-	this._blendPass.material.depthWrite = false;
-	this._blendPass.material.depthTest = false;
+	this._taaPass = new zen3d.ShaderPostPass(zen3d.TAAShader);
+	this._taaPass.material.depthWrite = false;
+	this._taaPass.material.depthTest = false;
 
@@ -75,7 +75,7 @@ this._frame = 0;
 	/**
-         * Jitter camera projectionMatrix
-         * @param {zen3d.Camera} camera
-         * @param {number} width screen width
-         * @param {number} height screen height
-         */
+	 * Jitter camera projectionMatrix
+	 * @param {zen3d.Camera} camera
+	 * @param {number} width screen width
+	 * @param {number} height screen height
+	 */
 	jitterProjection: function(camera, width, height) {
@@ -96,13 +96,24 @@ var offset = this._haltonSequence[this._frame];
 	/**
-         * @param {zen3d.GLCore} glCore
-         * @param {zen3d.TextureBase} texture input texture
-         * @return {zen3d.TextureBase} output texture
-         */
-	sample: function(glCore, texture) {
+	 * @param {zen3d.GLCore} glCore
+	 * @param {zen3d.TextureBase} texture input texture
+	 * @param {zen3d.TextureBase} velocityTexture velocity texture
+	 * @param {zen3d.TextureBase} depthTexture depth texture
+	 * @param {boolean} [still=true]
+	 * @return {zen3d.TextureBase} output texture
+	 */
+	sample: function(glCore, texture, velocityTexture, depthTexture, still) {
+		velocityTexture = (velocityTexture !== undefined) ? velocityTexture : null;
+		still = (still !== undefined) ? still : true;
+
 		var first = this._frame === 0;
 
-		this._blendPass.uniforms["tDiffuse1"] = texture;
-		this._blendPass.uniforms["tDiffuse2"] = this._prevFrame.texture;
-		this._blendPass.uniforms["opacity1"] = first ? 1 : 0.1;
-		this._blendPass.uniforms["opacity2"] = first ? 0 : 0.9;
+		this._taaPass.uniforms["currTex"] = texture;
+		this._taaPass.uniforms["prevTex"] = this._prevFrame.texture;
+		this._taaPass.uniforms["velocityTex"] = velocityTexture;
+		this._taaPass.uniforms["depthTex"] = depthTexture;
+		this._taaPass.uniforms["texelSize"][0] = 1 / this._prevFrame.width;
+		this._taaPass.uniforms["texelSize"][1] = 1 / this._prevFrame.height;
+		this._taaPass.uniforms["still"] = !!still;
+		this._taaPass.uniforms["stillBlending"] = first ? 0 : 0.9;
+		this._taaPass.uniforms["motionBlending"] = first ? 0 : 0.2;
 
@@ -114,3 +125,3 @@ glCore.renderTarget.setRenderTarget(this._output);
 
-		this._blendPass.render(glCore);
+		this._taaPass.render(glCore);
 
@@ -117,0 +128,0 @@ var temp = this._prevFrame;

examples/js/VoxMeshBuilder.js

@@ -277,2 +277,5 @@ /**
 
+		geometry.computeBoundingBox();
+		geometry.computeBoundingSphere();
+
 		return geometry;
@@ -279,0 +282,0 @@ }

examples/jsm/Clock.js

@@ -0,0 +0,0 @@ /**

examples/jsm/controls/FlyControls.js

@@ -0,0 +0,0 @@ /**

examples/jsm/controls/FreeControls.js

@@ -0,0 +0,0 @@ /**

examples/jsm/controls/OrbitControls.js

@@ -0,0 +0,0 @@ /**

examples/jsm/GBuffer.js

@@ -26,3 +26,4 @@ /**
 		metalness: 4,
-		albedo: 5
+		albedo: 5,
+		velocity: 6
 	};
@@ -35,2 +36,3 @@
 		var albedoMetalnessMaterials = new Map();
+		var motionMaterials = new Map();
 		var MRTMaterials = new Map();
@@ -48,2 +50,12 @@
 			result.morphNormals = !!renderable.object.morphTargetInfluences && renderable.object.geometry.morphAttributes.normal;
+
+			var maxBones = 0;
+			if (result.useSkinning) {
+				if (renderable.object.skeleton.boneTexture) {
+					maxBones = 1024;
+				} else {
+					maxBones = renderable.object.skeleton.bones.length;
+				}
+			}
+			result.maxBones = maxBones;
 		}
@@ -134,6 +146,39 @@
 
+		function getMotionMaterial(renderable) {
+			generateMaterialState(renderable, state);
+
+			var material;
+			var code = state.useSkinning +
+				"_" + state.maxBones +
+				"_" + state.morphTargets;
+			if (!motionMaterials.has(code)) {
+				material = new ShaderMaterial(GBufferShader.motion);
+				motionMaterials.set(code, material);
+			} else {
+				material = motionMaterials.get(code);
+			}
+
+			if (renderable.object.userData['prevModel'] && renderable.object.userData['prevViewProjection']) {
+				helpMatrix4.fromArray(renderable.object.userData['prevModel']).toArray(material.uniforms['prevModel']);
+				helpMatrix4.fromArray(renderable.object.userData['prevViewProjection']).toArray(material.uniforms['prevViewProjection']);
+				material.uniforms['firstRender'] = false;
+
+				if (renderable.object.userData['prevBoneTexture']) {
+					material.uniforms['prevBoneTexture'] = renderable.object.userData['prevBoneTexture'];
+					material.uniforms['prevBoneTextureSize'] = renderable.object.userData['prevBoneTexture'].image.width;
+				} else if (renderable.object.userData['prevBoneMatrices']) {
+					material.uniforms['prevBoneMatrices'] = renderable.object.userData['prevBoneMatrices'];
+				}
+			} else {
+				material.uniforms['firstRender'] = true;
+			}
+
+			return material;
+		}
+
 		return {
 			getMrtMaterial: getMrtMaterial,
 			getNormalGlossinessMaterial: getNormalGlossinessMaterial,
-			getAlbedoMetalnessMaterial: getAlbedoMetalnessMaterial
+			getAlbedoMetalnessMaterial: getAlbedoMetalnessMaterial,
+			getMotionMaterial: getMotionMaterial
 		}
@@ -176,5 +221,7 @@ }
 
-		this._normalGlossinessMaterials = new Map();
-		this._albedoMetalnessMaterials = new Map();
-		this._MRTMaterials = new Map();
+		this._renderTarget3 = new RenderTarget2D(width, height);
+		this._renderTarget3.texture.type = WEBGL_PIXEL_TYPE.HALF_FLOAT;
+		this._renderTarget3.texture.minFilter = WEBGL_TEXTURE_FILTER.NEAREST;
+		this._renderTarget3.texture.magFilter = WEBGL_TEXTURE_FILTER.NEAREST;
+		this._renderTarget3.texture.generateMipmaps = false;
 
@@ -186,2 +233,4 @@ this._debugPass = new ShaderPostPass(GBufferShader.debug);
 		this.enableAlbedoMetalness = true;
+
+		this.enableMotion = false;
 	}
@@ -199,2 +248,3 @@
 			this._renderTarget2.resize(width, height);
+			this._renderTarget3.resize(width, height);
 		},
@@ -226,2 +276,4 @@
 						// this._depthTexture.type = WEBGL_PIXEL_TYPE.FLOAT_32_UNSIGNED_INT_24_8_REV;
+
+						this._renderTarget3.texture.internalformat = WEBGL_PIXEL_FORMAT.RGBA16F; // TODO use MRT to render motion texture
 					}
@@ -249,10 +301,46 @@
 				});
+			} else {
+				// render normalDepthRenderTarget
 
-				return;
+				if (this.enableNormalGlossiness) {
+					glCore.renderTarget.setRenderTarget(this._renderTarget1);
+
+					glCore.state.colorBuffer.setClear(0, 0, 0, 0);
+					glCore.clear(true, true, true);
+
+					glCore.renderPass(renderList.opaque, camera, {
+						scene: scene,
+						getMaterial: function(renderable) {
+							return materialCache.getNormalGlossinessMaterial(renderable);
+						},
+						ifRender: function(renderable) {
+							return !!renderable.geometry.getAttribute("a_Normal");
+						}
+					});
+				}
+
+				// render albedoMetalnessRenderTarget
+
+				if (this.enableAlbedoMetalness) {
+					glCore.renderTarget.setRenderTarget(this._renderTarget2);
+
+					glCore.state.colorBuffer.setClear(0, 0, 0, 0);
+					glCore.clear(true, true, true);
+
+					glCore.renderPass(renderList.opaque, camera, {
+						scene: scene,
+						getMaterial: function(renderable) {
+							return materialCache.getAlbedoMetalnessMaterial(renderable);
+						},
+						ifRender: function(renderable) {
+							return !!renderable.geometry.getAttribute("a_Normal");
+						}
+					});
+				}
 			}
 
-			// render normalDepthRenderTarget
+			// render motionRenderTarget
 
-			if (this.enableNormalGlossiness) {
-				glCore.renderTarget.setRenderTarget(this._renderTarget1);
+			if (this.enableMotion) {
+				glCore.renderTarget.setRenderTarget(this._renderTarget3);
 
@@ -262,30 +350,47 @@ glCore.state.colorBuffer.setClear(0, 0, 0, 0);
 
-				glCore.renderPass(renderList.opaque, camera, {
+				var renderConfig = {
 					scene: scene,
 					getMaterial: function(renderable) {
-						return materialCache.getNormalGlossinessMaterial(renderable);
+						return materialCache.getMotionMaterial(renderable);
 					},
-					ifRender: function(renderable) {
-						return !!renderable.geometry.getAttribute("a_Normal");
-					}
-				});
-			}
+					afterRender: function(glCore, renderable) {
+						if (!renderable.object.userData['prevModel']) {
+							renderable.object.userData['prevModel'] = new Float32Array(16);
+						}
+						renderable.object.worldMatrix.toArray(renderable.object.userData['prevModel']);
 
-			// render albedoMetalnessRenderTarget
+						if (!renderable.object.userData['prevViewProjection']) {
+							renderable.object.userData['prevViewProjection'] = new Float32Array(16);
+						}
+						helpMatrix4.multiplyMatrices(camera.projectionMatrix, camera.viewMatrix).toArray(renderable.object.userData['prevViewProjection']);
 
-			if (this.enableAlbedoMetalness) {
-				glCore.renderTarget.setRenderTarget(this._renderTarget2);
+						if (renderable.object.skeleton) {
+							if (renderable.object.skeleton.boneTexture) {
+								if (!renderable.object.userData['prevBoneTexture']) {
+									var oldTexture = renderable.object.skeleton.boneTexture;
+									var newTexture = oldTexture.clone();
+									newTexture.image = {
+										width: oldTexture.image.width,
+										height: oldTexture.image.height,
+										data: new Float32Array(oldTexture.image.data.length)
+									};
+									renderable.object.userData['prevBoneTexture'] = newTexture;
+								}
 
-				glCore.state.colorBuffer.setClear(0, 0, 0, 0);
-				glCore.clear(true, true, true);
+								renderable.object.userData['prevBoneTexture'].image.data.set(renderable.object.skeleton.boneTexture.image.data);
+								renderable.object.userData['prevBoneTexture'].version++;
+							} else {
+								if (!renderable.object.userData['prevBoneMatrices']) {
+									renderable.object.userData['prevBoneMatrices'] = new Float32Array(skeleton.boneMatrices.length);
+								}
+								renderable.object.userData['prevBoneMatrices'].set(skeleton.boneMatrices);
+							}
+						}
 
-				glCore.renderPass(renderList.opaque, camera, {
-					scene: scene,
-					getMaterial: function(renderable) {
-						return materialCache.getAlbedoMetalnessMaterial(renderable);
-					},
-					ifRender: function(renderable) {
-						return !!renderable.geometry.getAttribute("a_Normal");
+						// TODO support morph targets
 					}
-				});
+				};
+
+				glCore.renderPass(renderList.opaque, camera, renderConfig);
+				glCore.renderPass(renderList.transparent, camera, renderConfig);
 			}
@@ -303,2 +408,3 @@ },
          * + 'albedo'
+		 * + 'velocity'
          *
@@ -313,2 +419,3 @@ * @param {GLCore} renderer
 			this._debugPass.uniforms["albedoMetalnessTexture"] = this.getAlbedoMetalnessTexture();
+			this._debugPass.uniforms["motionTexture"] = this.getMotionTexture();
 			this._debugPass.uniforms["debug"] = debugTypes[type] || 0;
@@ -358,5 +465,17 @@ this._debugPass.uniforms["viewWidth"] = glCore.state.currentRenderTarget.width;
 
+		/**
+         * Get motion texture.
+         * Channel storage:
+         * + R: velocity.x
+         * + G: velocity.y
+         * @return {Texture2D}
+         */
+		getMotionTexture: function() {
+			return this._renderTarget3.texture;
+		},
+
 		dispose: function() {
 			this._renderTarget1.dispose();
 			this._renderTarget2.dispose();
+			this._renderTarget3.dispose();
 
@@ -369,2 +488,3 @@ this._depthTexture.dispose();
 			materialCache.albedoMetalnessMaterials.forEach(material => material.dispose());
+			materialCache.motionMaterials.forEach(material => material.dispose());
 
@@ -374,2 +494,3 @@ materialCache.MRTMaterials.clear();
 			materialCache.albedoMetalnessMaterials.clear();
+			materialCache.motionMaterials.clear();
 		}
@@ -505,2 +626,111 @@
 
+		motion: {
+
+			uniforms: {
+
+				prevModel: new Float32Array(16),
+				prevViewProjection: new Float32Array(16),
+
+				prevBoneTexture: null,
+				prevBoneTextureSize: 256,
+				prevBoneMatrices: new Float32Array(),
+
+				firstRender: false
+
+			},
+
+			vertexShader: [
+				"#include <common_vert>",
+				"#include <morphtarget_pars_vert>",
+				"#include <skinning_pars_vert>",
+
+				"uniform mat4 prevModel;",
+				"uniform mat4 prevViewProjection;",
+
+				"varying vec4 v_ScreenPosition;",
+				"varying vec4 v_PrevScreenPosition;",
+
+				"#ifdef USE_SKINNING",
+				"	#ifdef BONE_TEXTURE",
+				"		uniform sampler2D prevBoneTexture;",
+				"		uniform int prevBoneTextureSize;",
+				"		mat4 getPrevBoneMatrix(const in float i) {",
+				"			float j = i * 4.0;",
+				"			float x = mod( j, float( prevBoneTextureSize ) );",
+				"			float y = floor( j / float( prevBoneTextureSize ) );",
+
+				"			float dx = 1.0 / float( prevBoneTextureSize );",
+				"			float dy = 1.0 / float( prevBoneTextureSize );",
+
+				"			y = dy * ( y + 0.5 );",
+
+				"			vec4 v1 = texture2D( prevBoneTexture, vec2( dx * ( x + 0.5 ), y ) );",
+				"			vec4 v2 = texture2D( prevBoneTexture, vec2( dx * ( x + 1.5 ), y ) );",
+				"			vec4 v3 = texture2D( prevBoneTexture, vec2( dx * ( x + 2.5 ), y ) );",
+				"			vec4 v4 = texture2D( prevBoneTexture, vec2( dx * ( x + 3.5 ), y ) );",
+
+				"			mat4 bone = mat4( v1, v2, v3, v4 );",
+
+				"			return bone;",
+				"		}",
+				"	#else",
+				"		uniform mat4 prevBoneMatrices[MAX_BONES];",
+				"		mat4 getPrevBoneMatrix(const in float i) {",
+				"			mat4 bone = prevBoneMatrices[int(i)];",
+				"			return bone;",
+				"		}",
+				"	#endif",
+				"#endif",
+
+				"void main() {",
+				"	#include <begin_vert>",
+
+				"	vec3 prevTransformed = transformed;",
+
+				"	#include <morphtarget_vert>",
+				"	#include <skinning_vert>",
+				"	#include <pvm_vert>",
+
+				"	#ifdef USE_SKINNING",
+				"		mat4 prevBoneMatX = getPrevBoneMatrix( skinIndex.x );",
+				"		mat4 prevBoneMatY = getPrevBoneMatrix( skinIndex.y );",
+				"		mat4 prevBoneMatZ = getPrevBoneMatrix( skinIndex.z );",
+				"		mat4 prevBoneMatW = getPrevBoneMatrix( skinIndex.w );",
+
+				"		vec4 prevSkinVertex = bindMatrix * vec4(prevTransformed, 1.0);",
+
+				"		vec4 prevSkinned = vec4( 0.0 );",
+				"		prevSkinned += prevBoneMatX * prevSkinVertex * skinWeight.x;",
+				"		prevSkinned += prevBoneMatY * prevSkinVertex * skinWeight.y;",
+				"		prevSkinned += prevBoneMatZ * prevSkinVertex * skinWeight.z;",
+				"		prevSkinned += prevBoneMatW * prevSkinVertex * skinWeight.w;",
+				"		prevSkinned = bindMatrixInverse * prevSkinned;",
+
+				"		prevTransformed = prevSkinned.xyz / prevSkinned.w;",
+				"	#endif",
+
+				"	v_ScreenPosition = u_Projection * u_View * u_Model * vec4(transformed, 1.0);",
+				"	v_PrevScreenPosition = prevViewProjection * prevModel * vec4(prevTransformed, 1.0);",
+				"}"
+			].join("\n"),
+
+			fragmentShader: [
+				"uniform bool firstRender;",
+
+				"varying vec4 v_ScreenPosition;",
+				"varying vec4 v_PrevScreenPosition;",
+
+				"void main() {",
+				"	vec2 a = v_ScreenPosition.xy / v_ScreenPosition.w;",
+				"	vec2 b = v_PrevScreenPosition.xy / v_PrevScreenPosition.w;",
+
+				"	if (firstRender) {",
+				"		gl_FragColor = vec4(0.0);",
+				"	} else {",
+				"		gl_FragColor = vec4((a - b) * 0.5 + 0.5, 0.0, 1.0);",
+				"	}",
+				"}"
+			].join("\n"),
+		},
+
 		MRT: {
@@ -601,2 +831,3 @@
 				albedoMetalnessTexture: null,
+				motionTexture: null,
 
@@ -633,2 +864,3 @@ debug: 0,
 				"uniform sampler2D albedoMetalnessTexture;",
+				"uniform sampler2D motionTexture;",
 
@@ -692,4 +924,9 @@ // DEBUG
 				"		gl_FragColor = vec4(vec3(metalness), 1.0);",
+				"	} else if (debug == 5) {",
+				"		gl_FragColor = vec4(albedo, 1.0);",
 				"	} else {",
-				"		gl_FragColor = vec4(albedo, 1.0);",
+				"		vec4 texel4 = texture2D(motionTexture, texCoord);",
+				"		texel4.rg -= 0.5;",
+				"		texel4.rg *= 2.0;",
+				"		gl_FragColor = texel4;",
 				"	}",
@@ -696,0 +933,0 @@

examples/jsm/GeometryUtils.js

@@ -0,0 +0,0 @@ /**

examples/jsm/loaders/AssimpJsonLoader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/loaders/DRACOLoader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/loaders/GLTFLoader.js

@@ -48,3 +48,2 @@ /**
 	VERTEX_COLOR,
-	Vector2,
 	VectorKeyframeTrack,
@@ -1287,3 +1286,3 @@ WEBGL_PIXEL_FORMAT,
 			// TODO normalScale support
-			// materialParams.normalScale = new Vector2( 1, 1 );
+			// materialParams.normalScale = new zen3d.Vector2( 1, 1 );
 			//
@@ -1290,0 +1289,0 @@ // if ( materialDef.normalTexture.scale !== undefined ) {

examples/jsm/objects/DirectionalLightHelper.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/GridHelper.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/ParticleContainer.js

@@ -0,0 +0,0 @@ /*

examples/jsm/objects/PointLightHelper.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/SkeletonHelper.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/Sky.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/SkyBox.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/SpotLightHelper.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/Sprite.js

@@ -0,0 +0,0 @@ /**

examples/jsm/objects/Water.js

@@ -0,0 +0,0 @@ /**

examples/jsm/pass/BlurPass.js

@@ -0,0 +0,0 @@ /**

examples/jsm/pass/SSAOPass.js

@@ -72,8 +72,7 @@ /**
 	// offset 为偏移值，传入不同的偏移可以生成不同的分布数
-	// hemisphere 代表phi的范围是否在0~180内，否则生成在0-360内
-	function generateKernel(size, offset, hemisphere) {
+	function generateKernel(size, offset) {
 		var kernel = new Float32Array(size * 3);
 		offset = offset || 0;
 		for (var i = 0; i < size; i++) {
-			var phi = halton(i + offset, 2) * (hemisphere ? 1 : 2) * Math.PI; // phi是方位面（水平面）内的角度
+			var phi = halton(i + offset, 2) * Math.PI; // phi是方位面（水平面）内的角度
 			var theta = halton(i + offset, 3) * Math.PI; // theta是俯仰面（竖直面）内的角度
@@ -109,3 +108,3 @@ var r = Math.random();
 		if (!this._kernels[code]) {
-			this._kernels[code] = generateKernel(size, offset * size, true);
+			this._kernels[code] = generateKernel(size, offset * size);
 		}
@@ -112,0 +111,0 @@

examples/jsm/PMREM.js

@@ -0,0 +0,0 @@ /**

examples/jsm/renderers/DeferredRenderer.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/BlendShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/BlurShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/ColorAdjustShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/CopyShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/DeferredShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/DepthLinearShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/FastGaussianBlurShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/FilmShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/FXAAShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/LineDashedShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/LuminosityHighPassShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/MotionBlurShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/ShadowShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/SketchShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/SSAOShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/shaders/SSRShader.js

@@ -36,2 +36,3 @@ /**
 		'zThicknessThreshold': 0.1,
+		'jitterOffset': 0,
 
@@ -92,2 +93,3 @@ 'nearZ': 0,
 		'uniform float zThicknessThreshold;',
+		'uniform float jitterOffset;',
 
@@ -94,0 +96,0 @@ 'uniform float nearZ;',

examples/jsm/shaders/VolumeShader.js

@@ -0,0 +0,0 @@ /**

examples/jsm/stereo/StereoCamera.js

@@ -0,0 +0,0 @@ /**

examples/jsm/stereo/StereoRenderer.js

@@ -0,0 +0,0 @@ /**

examples/jsm/stereo/WebVRControls.js

@@ -0,0 +0,0 @@ /**

examples/jsm/stereo/WebXRControls.js

@@ -0,0 +0,0 @@ /**

examples/jsm/SuperSampling.js

@@ -11,3 +11,2 @@ /**
 } from "../../build/zen3d.module.js";
-import { BlendShader } from "./shaders/BlendShader.js";
 
@@ -54,5 +53,5 @@ var SuperSampling = function(width, height, samplingSize) {
 
-	this._blendPass = new ShaderPostPass(BlendShader);
-	this._blendPass.material.depthWrite = false;
-	this._blendPass.material.depthTest = false;
+	this._taaPass = new ShaderPostPass(TAAShader);
+	this._taaPass.material.depthWrite = false;
+	this._taaPass.material.depthTest = false;
 
@@ -84,7 +83,7 @@ this._frame = 0;
 	/**
-         * Jitter camera projectionMatrix
-         * @param {zen3d.Camera} camera
-         * @param {number} width screen width
-         * @param {number} height screen height
-         */
+	 * Jitter camera projectionMatrix
+	 * @param {zen3d.Camera} camera
+	 * @param {number} width screen width
+	 * @param {number} height screen height
+	 */
 	jitterProjection: function(camera, width, height) {
@@ -105,13 +104,24 @@ var offset = this._haltonSequence[this._frame];
 	/**
-         * @param {GLCore} glCore
-         * @param {zen3d.TextureBase} texture input texture
-         * @return {zen3d.TextureBase} output texture
-         */
-	sample: function(glCore, texture) {
+	 * @param {GLCore} glCore
+	 * @param {zen3d.TextureBase} texture input texture
+	 * @param {zen3d.TextureBase} velocityTexture velocity texture
+	 * @param {zen3d.TextureBase} depthTexture depth texture
+	 * @param {boolean} [still=true]
+	 * @return {zen3d.TextureBase} output texture
+	 */
+	sample: function(glCore, texture, velocityTexture, depthTexture, still) {
+		velocityTexture = (velocityTexture !== undefined) ? velocityTexture : null;
+		still = (still !== undefined) ? still : true;
+
 		var first = this._frame === 0;
 
-		this._blendPass.uniforms["tDiffuse1"] = texture;
-		this._blendPass.uniforms["tDiffuse2"] = this._prevFrame.texture;
-		this._blendPass.uniforms["opacity1"] = first ? 1 : 0.1;
-		this._blendPass.uniforms["opacity2"] = first ? 0 : 0.9;
+		this._taaPass.uniforms["currTex"] = texture;
+		this._taaPass.uniforms["prevTex"] = this._prevFrame.texture;
+		this._taaPass.uniforms["velocityTex"] = velocityTexture;
+		this._taaPass.uniforms["depthTex"] = depthTexture;
+		this._taaPass.uniforms["texelSize"][0] = 1 / this._prevFrame.width;
+		this._taaPass.uniforms["texelSize"][1] = 1 / this._prevFrame.height;
+		this._taaPass.uniforms["still"] = !!still;
+		this._taaPass.uniforms["stillBlending"] = first ? 0 : 0.9;
+		this._taaPass.uniforms["motionBlending"] = first ? 0 : 0.2;
 
@@ -123,3 +133,3 @@ glCore.renderTarget.setRenderTarget(this._output);
 
-		this._blendPass.render(glCore);
+		this._taaPass.render(glCore);
 
@@ -126,0 +136,0 @@ var temp = this._prevFrame;

examples/jsm/VoxMeshBuilder.js

@@ -291,2 +291,5 @@ /**
 
+		geometry.computeBoundingBox();
+		geometry.computeBoundingSphere();
+
 		return geometry;
@@ -293,0 +296,0 @@ }

package.json

 {
   "name": "zen-3d",
-  "version": "0.0.3",
+  "version": "0.0.4",
   "description": "JavaScript 3D library",
@@ -49,9 +49,11 @@ "main": "build/zen3d.js",
   "devDependencies": {
-    "acorn": "^7.3.1",
-    "eslint": "^7.5.0",
-    "jsdoc": "^3.6.5",
+    "@babel/core": "^7.12.13",
+    "@babel/preset-env": "^7.12.13",
+    "@rollup/plugin-babel": "^5.2.3",
+    "acorn": "^8.0.5",
+    "eslint": "^7.19.0",
+    "jsdoc": "^3.6.6",
     "live-server": "^1.2.1",
-    "rollup": "^2.23.0",
-    "rollup-plugin-buble": "^0.19.8",
-    "uglify-js": "^3.10.0"
+    "rollup": "^2.38.5",
+    "rollup-plugin-terser": "^7.0.2"
   },
@@ -62,11 +64,5 @@ "scripts": {
     "build": "rollup -c",
-    "uglify": "uglifyjs build/zen3d.js -c -m -b beautify=false,preamble=\"'// github.com/shawn0326/zen-3d'\" -o build/zen3d.min.js",
-    "build-uglify": "rollup -c && uglifyjs build/zen3d.js -c -m -b beautify=false,preamble=\"'// github.com/shawn0326/zen-3d'\" -o build/zen3d.min.js",
-    "build-canvas2d": "rollup -c rollup.extension.config.js",
-    "extension": "npm run build-canvas2d",
     "doc": "jsdoc ./src/core -r -d ./docs -c ./tools/doc.config.json",
     "eslint": "eslint src/core",
     "eslint-fix": "eslint src/core --fix",
-    "eslint-extensions": "eslint src/extension",
-    "eslint-extensions-fix": "eslint src/extension --fix",
     "eslint-examples": "eslint examples/js",
@@ -73,0 +69,0 @@ "eslint-examples-fix": "eslint examples/js --fix",

README.md

@@ -9,5 +9,7 @@ zen-3d
 [![Issues][issues-badge]][issues-badge-url]
-[![Dev Dependencies][dev-dependencies]][dev-dependencies-url]
-[![Language Grade][lgtm]][lgtm-url]
 
+[![devDependencies Status](https://status.david-dm.org/gh/shawn0326/zen-3d.svg?type=dev)](https://david-dm.org/shawn0326/zen-3d?type=dev)
+[![Language grade: JavaScript](https://img.shields.io/lgtm/grade/javascript/g/shawn0326/zen-3d.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/shawn0326/zen-3d/context:javascript)
+[![Total alerts](https://img.shields.io/lgtm/alerts/g/shawn0326/zen-3d.svg?logo=lgtm&logoWidth=18)](https://lgtm.com/projects/g/shawn0326/zen-3d/alerts/)
+
 ### JavaScript 3D library ###
@@ -22,15 +24,5 @@
 
-[![image](./examples/resources/screenshot/screenshot1.png)](https://shawn0326.github.io/zen-3d/examples/#material_cubetexture_realtimeenvmap)
-[![image](./examples/resources/screenshot/screenshot0.png)](https://shawn0326.github.io/zen-3d/examples/#geometry_loader_gltf)
-[![image](./examples/resources/screenshot/screenshot3.png)](https://shawn0326.github.io/zen-3d/examples/#canvas2d_canvas2d)
-[![image](./examples/resources/screenshot/screenshot4.png)](https://shawn0326.github.io/zen-3d/examples/#stereo_webvr_car)
-<br />
-[![image](./examples/resources/screenshot/screenshot5.png)](https://shawn0326.github.io/zen-3d/examples/#animation_monster)
-[![image](./examples/resources/screenshot/screenshot6.png)](https://shawn0326.github.io/zen-3d/examples/#sprite_sprites)
-[![image](./examples/resources/screenshot/screenshot7.png)](https://shawn0326.github.io/zen-3d/examples/#material_shadermaterial)
-[![image](./examples/resources/screenshot/screenshot8.png)](https://shawn0326.github.io/zen-3d/examples/#particle_particle)
-
 ### Usage ###
 
-you can use `zen3d.js` or `zen3d.min.js` in your page simply by this:
+Use `zen3d.js` or `zen3d.min.js` in your page:
 
@@ -103,19 +95,4 @@ ````html
 requestAnimationFrame(loop);
-
-function onWindowResize() {
-    width = window.innerWidth || 2;
-    height = window.innerHeight || 2;
-
-	camera.setPerspective(45 / 180 * Math.PI, width / height, 1, 1000);
-
-    backRenderTarget.resize(width, height);
-}
-window.addEventListener("resize", onWindowResize, false);
 ````
 
-### 3D Format Support ###
-
-[GLTF](https://github.com/KhronosGroup/glTF) /
-[assimp2json](https://github.com/acgessler/assimp2json)
-
 ### WebGL2 Support ###
@@ -152,6 +129,2 @@
 [issues-badge]: https://img.shields.io/github/issues/shawn0326/zen-3d.svg
-[issues-badge-url]: https://github.com/shawn0326/zen-3d/issues
-[dev-dependencies]: https://img.shields.io/david/dev/shawn0326/zen-3d
-[dev-dependencies-url]: https://david-dm.org/shawn0326/zen-3d#info=devDependencies
-[lgtm]: https://img.shields.io/lgtm/alerts/github/shawn0326/zen-3d
-[lgtm-url]: https://lgtm.com/projects/g/shawn0326/zen-3d/
+[issues-badge-url]: https://github.com/shawn0326/zen-3d/issues

src/core/animation/armature/Bone.js

@@ -0,0 +0,0 @@ import { Object3D } from '../../objects/Object3D.js';

src/core/animation/armature/Skeleton.js

@@ -0,0 +0,0 @@ import { Matrix4 } from '../../math/Matrix4.js';

src/core/animation/keyframe/AnimationMixer.js

@@ -0,0 +0,0 @@ import { PropertyBindingMixer } from './PropertyBindingMixer.js';

src/core/animation/keyframe/BooleanKeyframeTrack.js

@@ -0,0 +0,0 @@ import { KeyframeTrack } from './KeyframeTrack.js';

src/core/animation/keyframe/ColorKeyframeTrack.js

@@ -0,0 +0,0 @@ import { KeyframeTrack } from './KeyframeTrack.js';

src/core/animation/keyframe/KeyframeClip.js

@@ -0,0 +0,0 @@ /**

src/core/animation/keyframe/KeyframeTrack.js

@@ -0,0 +0,0 @@ /**

src/core/animation/keyframe/NumberKeyframeTrack.js

@@ -0,0 +0,0 @@ import { KeyframeTrack } from './KeyframeTrack.js';

src/core/animation/keyframe/PropertyBindingMixer.js

@@ -0,0 +0,0 @@ import { Quaternion } from '../../math/Quaternion.js';

src/core/animation/keyframe/QuaternionKeyframeTrack.js

@@ -0,0 +0,0 @@ import { Quaternion } from '../../math/Quaternion.js';

src/core/animation/keyframe/StringKeyframeTrack.js

@@ -0,0 +0,0 @@ import { KeyframeTrack } from './KeyframeTrack.js';

src/core/animation/keyframe/VectorKeyframeTrack.js

@@ -0,0 +0,0 @@ import { KeyframeTrack } from './KeyframeTrack.js';

src/core/base.js

@@ -0,0 +0,0 @@ var _lut = [];

src/core/const.js

@@ -13,4 +13,3 @@ /**
 	SCENE: "scene",
-	GROUP: "group",
-	CANVAS2D: "canvas2d"
+	GROUP: "group"
 };
@@ -46,3 +45,2 @@
 	LINE: "line",
-	CANVAS2D: "canvas2d",
 	SHADER: "shader",
@@ -49,0 +47,0 @@ DEPTH: "depth",

src/core/EventDispatcher.js

@@ -0,0 +0,0 @@ /**

src/core/geometry/BufferAttribute.js

@@ -0,0 +0,0 @@ /**

src/core/geometry/CubeGeometry.js

@@ -0,0 +0,0 @@ import { Geometry } from './Geometry.js';

src/core/geometry/CylinderGeometry.js

@@ -0,0 +0,0 @@ import { Geometry } from './Geometry.js';

src/core/geometry/Geometry.js

@@ -0,0 +0,0 @@ import { EventDispatcher } from '../EventDispatcher.js';

src/core/geometry/InstancedBufferAttribute.js

@@ -0,0 +0,0 @@ import { BufferAttribute }  from './BufferAttribute.js';

src/core/geometry/InstancedGeometry.js

@@ -0,0 +0,0 @@ import { Geometry } from './Geometry.js';

src/core/geometry/InstancedInterleavedBuffer.js

@@ -0,0 +0,0 @@ import { InterleavedBuffer } from './InterleavedBuffer.js';

src/core/geometry/InterleavedBuffer.js

@@ -0,0 +0,0 @@ /**

src/core/geometry/InterleavedBufferAttribute.js

@@ -0,0 +0,0 @@ /**

src/core/geometry/PlaneGeometry.js

@@ -0,0 +0,0 @@ import { Geometry } from './Geometry.js';

src/core/geometry/SphereGeometry.js

@@ -0,0 +0,0 @@ import { Geometry } from './Geometry.js';

src/core/geometry/TorusKnotGeometry.js

@@ -0,0 +0,0 @@ import { Geometry } from './Geometry.js';

src/core/loader/FileLoader.js

@@ -0,0 +0,0 @@ import { DefaultLoadingManager } from './LoadingManager.js';

src/core/loader/ImageLoader.js

@@ -0,0 +0,0 @@ import { DefaultLoadingManager } from './LoadingManager.js';

src/core/loader/LoadingManager.js

@@ -0,0 +0,0 @@ /**

src/core/loader/RGBELoader.js

@@ -0,0 +0,0 @@ import { FileLoader } from './FileLoader.js';

src/core/loader/TGALoader.js

@@ -0,0 +0,0 @@ import { FileLoader } from './FileLoader.js';

src/core/main.js

@@ -27,3 +27,2 @@ /**
 export { Triangle } from './math/Triangle.js';
-export { Curve } from './math/Curve.js';
 export { Spherical } from './math/Spherical.js';
@@ -30,0 +29,0 @@

src/core/material/BasicMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/DepthMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/DistanceMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/LambertMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/LineMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE, DRAW_MODE } from '../const.js';

src/core/material/MatcapMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/Material.js

@@ -0,0 +0,0 @@ import { EventDispatcher } from '../EventDispatcher.js';

src/core/material/PBR2Material.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/PBRMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/PhongMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE } from '../const.js';

src/core/material/PointsMaterial.js

@@ -0,0 +0,0 @@ import { MATERIAL_TYPE, DRAW_MODE } from '../const.js';

src/core/material/ShaderMaterial.js

@@ -27,3 +27,3 @@ import { MATERIAL_TYPE } from '../const.js';
      */
-	this.vertexShader = shader.vertexShader || "";
+	this.vertexShader = "";
 
@@ -35,3 +35,3 @@ /**
      */
-	this.fragmentShader = shader.fragmentShader || "";
+	this.fragmentShader = "";
 
@@ -45,5 +45,2 @@ /**
 
-	// copy defines
-	Object.assign(this.defines, shader.defines);
-
 	/**
@@ -55,3 +52,11 @@ * Uniforms of the shader.
      */
-	this.uniforms = cloneUniforms(shader.uniforms);
+	this.uniforms = {};
+
+	// Set values
+	if (shader) {
+		this.vertexShader = shader.vertexShader;
+		this.fragmentShader = shader.fragmentShader;
+		Object.assign(this.defines, shader.defines);
+		this.uniforms = cloneUniforms(shader.uniforms);
+	}
 }
@@ -68,3 +73,3 @@
 		this.fragmentShader = source.fragmentShader;
-		// this.defines = Object.assign({}, source.defines);
+
 		this.uniforms = cloneUniforms(source.uniforms);
@@ -71,0 +76,0 @@

src/core/math/Box2.js

@@ -0,0 +0,0 @@ import { Vector2 } from './Vector2.js';

src/core/math/Box3.js

@@ -0,0 +0,0 @@ import { Vector3 } from './Vector3.js';

src/core/math/Color3.js

@@ -0,0 +0,0 @@ /**

src/core/math/Euler.js

@@ -0,0 +0,0 @@ import { Matrix4 } from './Matrix4.js';

src/core/math/Frustum.js

@@ -0,0 +0,0 @@ import { Plane } from './Plane.js';

src/core/math/Matrix3.js

@@ -0,0 +0,0 @@ /**

src/core/math/Matrix4.js

@@ -0,0 +0,0 @@ import { Vector3 } from './Vector3.js';

src/core/math/Plane.js

@@ -0,0 +0,0 @@ import { Vector3 } from './Vector3.js';

src/core/math/Quaternion.js

@@ -0,0 +0,0 @@ import { Matrix4 } from './Matrix4.js';

src/core/math/Ray.js

@@ -0,0 +0,0 @@ import { Vector3 } from './Vector3.js';

src/core/math/Sphere.js

@@ -0,0 +0,0 @@ import { Vector3 } from './Vector3.js';

src/core/math/Spherical.js

@@ -0,0 +0,0 @@ /**

src/core/math/Triangle.js

@@ -0,0 +0,0 @@ import { Vector3 } from './Vector3.js';

src/core/math/Vector2.js

@@ -0,0 +0,0 @@ /**

src/core/math/Vector3.js

@@ -0,0 +0,0 @@ var _vector = new Vector3();

src/core/math/Vector4.js

@@ -0,0 +0,0 @@ /**

src/core/objects/camera/Camera.js

@@ -0,0 +0,0 @@ import { OBJECT_TYPE, TEXEL_ENCODING_TYPE } from '../../const.js';

src/core/objects/fog/Fog.js

@@ -0,0 +0,0 @@ import { FOG_TYPE } from '../../const.js';

src/core/objects/fog/FogExp2.js

@@ -0,0 +0,0 @@ import { FOG_TYPE } from '../../const.js';

src/core/objects/Group.js

@@ -0,0 +0,0 @@ import { OBJECT_TYPE } from '../const.js';

src/core/objects/lights/AmbientLight.js

@@ -0,0 +0,0 @@ import { LIGHT_TYPE } from '../../const.js';

src/core/objects/lights/DirectionalLight.js

@@ -0,0 +0,0 @@ import { LIGHT_TYPE } from '../../const.js';

src/core/objects/lights/DirectionalLightShadow.js

@@ -0,0 +0,0 @@ import { WEBGL_TEXTURE_FILTER, WEBGL_PIXEL_FORMAT, WEBGL_PIXEL_TYPE, ATTACHMENT, WEBGL_COMPARE_FUNC } from '../../const.js';

src/core/objects/lights/Light.js

@@ -0,0 +0,0 @@ import { OBJECT_TYPE } from '../../const.js';

src/core/objects/lights/LightShadow.js

@@ -14,55 +14,71 @@ import { Camera } from '../camera/Camera.js';
 	/**
-     * The light's view of the world.
-     * This is used to generate a depth map of the scene; objects behind other objects from the light's perspective will be in shadow.
-     * @type {zen3d.Camera}
-     */
+      * The light's view of the world.
+      * This is used to generate a depth map of the scene; objects behind other objects from the light's perspective will be in shadow.
+      * @type {zen3d.Camera}
+      */
 	this.camera = new Camera();
 
 	/**
-     * Model to shadow camera space, to compute location and depth in shadow map. Stored in a {@link zen3d.Matrix4}.
-     * This is computed internally during rendering.
-     * @type {zen3d.Matrix4}
-     */
+      * Model to shadow camera space, to compute location and depth in shadow map. Stored in a {@link zen3d.Matrix4}.
+      * This is computed internally during rendering.
+      * @type {zen3d.Matrix4}
+      */
 	this.matrix = new Matrix4();
 
 	/**
-     * Shadow map bias, how much to add or subtract from the normalized depth when deciding whether a surface is in shadow.
-     * Very tiny adjustments here (in the order of 0.0001) may help reduce artefacts in shadows.
-     * @type {number}
-     * @default 0.0003
-     */
-	this.bias = 0.0003;
+      * Shadow map bias, how much to add or subtract from the normalized depth when deciding whether a surface is in shadow.
+      * Very tiny adjustments here (in the order of 0.0001) may help reduce artefacts in shadows.
+      * @type {number}
+      * @default 0
+      */
+	this.bias = 0;
 
 	/**
-     * Setting this to values greater than 1 will blur the edges of the shadow.
-     * High values will cause unwanted banding effects in the shadows - a greater mapSize will allow for a higher value to be used here before these effects become visible.
-     * Note that this has no effect if the {@link @zen3d.Object3D#shadowType} is set to PCF or PCSS.
-     * @type {number}
-     * @default 2
-     */
+      * Setting this to values greater than 1 will blur the edges of the shadow.
+      * High values will cause unwanted banding effects in the shadows - a greater mapSize will allow for a higher value to be used here before these effects become visible.
+      * Note that this has no effect if the {@link @zen3d.Object3D#shadowType} is set to PCF or PCSS.
+      * @type {number}
+      * @default 2
+      */
 	this.radius = 2;
 
 	/**
-     * Shadow camera near.
-     * @type {number}
-     * @default 1
-     */
+      * Shadow camera near.
+      * @type {number}
+      * @default 1
+      */
 	this.cameraNear = 1;
 
 	/**
-     * Shadow camera far.
-     * @type {number}
-     * @default 500
-     */
+      * Shadow camera far.
+      * @type {number}
+      * @default 500
+      */
 	this.cameraFar = 500;
 
 	/**
-     * A {@link zen3d.Vector2} defining the width and height of the shadow map.
-     * Higher values give better quality shadows at the cost of computation time.
-     * Values must be powers of 2,
-     * @type {zen3d.Vector2}
-     * @default zen3d.Vector2(512, 512)
-     */
+      * A {@link zen3d.Vector2} defining the width and height of the shadow map.
+      * Higher values give better quality shadows at the cost of computation time.
+      * Values must be powers of 2.
+      * @type {zen3d.Vector2}
+      * @default zen3d.Vector2(512, 512)
+      */
 	this.mapSize = new Vector2(512, 512);
 
+	/**
+      * Enables automatic updates of the light's shadow.
+      * If you do not require dynamic lighting / shadows, you may set this to false.
+      * @type {boolean}
+      * @default true
+      */
+	this.autoUpdate = true;
+
+	/**
+      * When set to true, shadow maps will be updated in the next ShadowMapPass.render call.
+      * If you have set .autoUpdate to false, you will need to set this property to true and then make a ShadowMapPass.render call to update the light's shadow.
+      * @type {boolean}
+      * @default false
+      */
+	this.needsUpdate = false;
+
 	this.renderTarget = null;
@@ -69,0 +85,0 @@ this.map = null;

src/core/objects/lights/PointLight.js

@@ -0,0 +0,0 @@ import { LIGHT_TYPE } from '../../const.js';

src/core/objects/lights/PointLightShadow.js

@@ -0,0 +0,0 @@ import { WEBGL_TEXTURE_FILTER } from '../../const.js';

src/core/objects/lights/SpotLight.js

@@ -0,0 +0,0 @@ import { LIGHT_TYPE } from '../../const.js';

src/core/objects/lights/SpotLightShadow.js

@@ -0,0 +0,0 @@ import { WEBGL_TEXTURE_FILTER, WEBGL_PIXEL_FORMAT, WEBGL_PIXEL_TYPE, ATTACHMENT, WEBGL_COMPARE_FUNC } from '../../const.js';

src/core/objects/Mesh.js

@@ -0,0 +0,0 @@ import { OBJECT_TYPE, DRAW_SIDE } from '../const.js';

src/core/objects/Object3D.js

@@ -0,0 +0,0 @@ import { generateUUID } from '../base.js';

src/core/objects/Scene.js

@@ -42,2 +42,10 @@ import { OBJECT_TYPE } from '../const.js';
 	/**
+     * Defines whether disable shadow sampler feature.
+	 * Shader with sampler2DShadow uniforms may cause unknown error on some android phones, set disableShadowSampler to true to avoid these bugs.
+     * @type {boolean}
+     * @default false
+     */
+	this.disableShadowSampler = false;
+
+	/**
      * A {@link zen3d.LightCache} instance that collected all lights info after the calling of {@link zen3d.Scene#updateLights}.
@@ -114,7 +122,2 @@ * @type {zen3d.LightCache}
 
-		// skip ui children
-		if (OBJECT_TYPE.CANVAS2D === object.type) {
-			return;
-		}
-
 		// handle children by recursion
@@ -136,7 +139,2 @@ var children = object.children;
 
-		// skip ui children
-		if (OBJECT_TYPE.CANVAS2D === object.type) {
-			return;
-		}
-
 		// handle children by recursion
@@ -143,0 +141,0 @@ var children = object.children;

src/core/objects/SkinnedMesh.js

@@ -0,0 +0,0 @@ import { OBJECT_TYPE } from '../const.js';

src/core/Raycaster.js

@@ -0,0 +0,0 @@ import { Ray } from './math/Ray.js';

src/core/render/LightCache.js

@@ -0,0 +0,0 @@ import { LIGHT_TYPE } from '../const.js';

src/core/render/postPass/ShaderPostPass.js

@@ -0,0 +0,0 @@ import { Scene } from '../../objects/Scene.js';

src/core/render/prePass/EnvironmentMapPass.js

@@ -0,0 +0,0 @@ import { Camera } from '../../objects/camera/Camera.js';

src/core/render/prePass/ShadowMapPass.js

 import { DepthMaterial } from '../../material/DepthMaterial.js';
 import { DistanceMaterial } from '../../material/DistanceMaterial.js';
-import { LIGHT_TYPE } from '../../const.js';
+import { LIGHT_TYPE, DRAW_SIDE } from '../../const.js';
 import { Vector4 } from '../../math/Vector4.js';
 
+var shadowSide = { "front": DRAW_SIDE.BACK, "back": DRAW_SIDE.FRONT, "double": DRAW_SIDE.DOUBLE };
+
+var defaultDepthMaterial = new DepthMaterial();
+defaultDepthMaterial.packToRGBA = true;
+
+var defaultDistanceMaterial = new DistanceMaterial();
+defaultDistanceMaterial.uniforms = {};
+
+function _getDepthMaterial(renderable, light) {
+	defaultDepthMaterial.side = shadowSide[renderable.material.side];
+	return defaultDepthMaterial;
+}
+
+function _getDistanceMaterial(renderable, light) {
+	defaultDistanceMaterial.side = shadowSide[renderable.material.side];
+	defaultDistanceMaterial.uniforms["nearDistance"] = light.shadow.cameraNear;
+	defaultDistanceMaterial.uniforms["farDistance"] = light.shadow.cameraFar;
+	return defaultDistanceMaterial;
+}
+
+var oldClearColor = new Vector4();
+
 /**
@@ -12,8 +34,15 @@ * Shadow map pre pass.
 function ShadowMapPass() {
-	this.depthMaterial = new DepthMaterial();
-	this.depthMaterial.packToRGBA = true;
+	/**
+	 * Get depth material function.
+	 * Override this to use custom depth material.
+	 * @type {Function}
+	 */
+	this.getDepthMaterial = _getDepthMaterial;
 
-	this.distanceMaterial = new DistanceMaterial();
-
-	this.oldClearColor = new Vector4();
+	/**
+	 * Get distance material function.
+	 * Override this to use custom distance material.
+	 * @type {Function}
+	 */
+	this.getDistanceMaterial = _getDistanceMaterial;
 }
@@ -30,2 +59,5 @@
 
+	var getDepthMaterial = this.getDepthMaterial;
+	var getDistanceMaterial = this.getDistanceMaterial;
+
 	// force disable stencil
@@ -37,3 +69,3 @@ var useStencil = state.states[gl.STENCIL_TEST];
 
-	this.oldClearColor.copy(state.colorBuffer.getClear());
+	oldClearColor.copy(state.colorBuffer.getClear());
 	state.colorBuffer.setClear(1, 1, 1, 1);
@@ -46,2 +78,5 @@
 		var shadow = light.shadow;
+
+		if (shadow.autoUpdate === false && shadow.needsUpdate === false) continue;
+
 		var camera = shadow.camera;
@@ -53,3 +88,3 @@ var shadowTarget = shadow.renderTarget;
 		if (glCore.capabilities.version >= 2) {
-			if (!isPointLight && !shadow.depthMap) {
+			if (!isPointLight && !shadow.depthMap && !glCore.disableShadowSampler) {
 				shadow._initDepthMap();
@@ -73,12 +108,5 @@ }
 
-			var material = isPointLight ? this.distanceMaterial : this.depthMaterial;
-			material.uniforms = material.uniforms || {};
-			material.uniforms["nearDistance"] = shadow.cameraNear;
-			material.uniforms["farDistance"] = shadow.cameraFar;
-
 			glCore.renderPass(renderList.opaque, camera, {
 				getMaterial: function(renderable) {
-					// copy draw side
-					material.side = renderable.material.side;
-					return material;
+					return isPointLight ? getDistanceMaterial(renderable, light) : getDepthMaterial(renderable, light);
 				},
@@ -95,2 +123,4 @@ ifRender: function(renderable) {
 		// glCore.renderTarget.updateRenderTargetMipmap(shadowTarget);
+
+		shadow.needsUpdate = false;
 	}
@@ -102,5 +132,5 @@
 
-	state.colorBuffer.setClear(this.oldClearColor.x, this.oldClearColor.y, this.oldClearColor.z, this.oldClearColor.w);
+	state.colorBuffer.setClear(oldClearColor.x, oldClearColor.y, oldClearColor.z, oldClearColor.w);
 }
 
 export { ShadowMapPass };

src/core/render/RenderBuffer.js

@@ -0,0 +0,0 @@ import { WEBGL_PIXEL_FORMAT } from '../const.js';

src/core/render/Renderer.js

@@ -0,0 +0,0 @@ import { RenderTargetBack } from './RenderTargetBack.js';

src/core/render/RenderList.js

@@ -0,0 +0,0 @@ import { Vector3 } from '../math/Vector3.js';

src/core/render/RenderTarget2D.js

@@ -0,0 +0,0 @@ import { RenderTargetBase } from './RenderTargetBase.js';

src/core/render/RenderTargetBack.js

@@ -0,0 +0,0 @@ import { RenderTargetBase } from './RenderTargetBase.js';

src/core/render/RenderTargetBase.js

@@ -0,0 +0,0 @@ import { EventDispatcher } from '../EventDispatcher.js';

src/core/render/RenderTargetCube.js

@@ -0,0 +0,0 @@ import { RenderTargetBase } from './RenderTargetBase.js';

src/core/render/shader/ShaderChunk.js

@@ -0,0 +0,0 @@ import alphaTest_frag from './shaderChunk/alphaTest_frag.glsl';

src/core/render/shader/ShaderLib.js

 import basic_frag from './shaderLib/basic_frag.glsl';
 import basic_vert from './shaderLib/basic_vert.glsl';
-import canvas2d_frag from './shaderLib/canvas2d_frag.glsl';
-import canvas2d_vert from './shaderLib/canvas2d_vert.glsl';
 import depth_frag from './shaderLib/depth_frag.glsl';
@@ -26,4 +24,2 @@ import depth_vert from './shaderLib/depth_vert.glsl';
 	basic_vert: basic_vert,
-	canvas2d_frag: canvas2d_frag,
-	canvas2d_vert: canvas2d_vert,
 	depth_frag: depth_frag,
@@ -30,0 +26,0 @@ depth_vert: depth_vert,

src/core/render/WebGL/WebGLAttribute.js

@@ -0,0 +0,0 @@ import { WEBGL_ATTRIBUTE_TYPE } from '../../const.js';

src/core/render/WebGL/WebGLCapabilities.js

@@ -0,0 +0,0 @@ /**

src/core/render/WebGL/WebGLCore.js

@@ -155,4 +155,4 @@ import { CULL_FACE_TYPE, BLEND_TYPE, DRAW_SIDE, OBJECT_TYPE, WEBGL_PIXEL_TYPE, WEBGL_PIXEL_FORMAT, WEBGL_TEXTURE_FILTER } from '../../const.js';
 
-		var gl = this.gl;
 		var state = this.state;
+		var capabilities = this.capabilities;
 
@@ -193,2 +193,4 @@ var getMaterial = config.getMaterial || defaultGetMaterial;
 					material.needsUpdate = true;
+				} else if (capabilities.version > 1 && scene.disableShadowSampler !== materialProperties.disableShadowSampler) {
+					material.needsUpdate = true;
 				} else {
@@ -230,2 +232,3 @@ var acceptLight = material.acceptLight && !!scene.lights && scene.lights.totalNum > 0;
 				materialProperties.gammaFactor = camera.gammaFactor;
+				materialProperties.disableShadowSampler = scene.disableShadowSampler;
 
@@ -248,2 +251,16 @@ material.needsUpdate = false;
 			var uniforms = program.uniforms;
+
+			// upload light uniforms
+			// shadow map need upload first ?
+			// or it will cause bug
+			if (material.acceptLight && scene.lights) {
+				this.uploadLights(uniforms, scene.lights, scene.disableShadowSampler);
+			}
+
+			// upload bone matrices
+			if (object.type === OBJECT_TYPE.SKINNED_MESH) {
+				this.uploadSkeleton(uniforms, object, program.program);
+			}
+
+			// upload other uniforms
 			for (var n = 0, ll = uniforms.seq.length; n < ll; n++) {
@@ -262,18 +279,6 @@ var uniform = uniforms.seq[n];
 				case "u_Projection":
-					if (object.type === OBJECT_TYPE.CANVAS2D && object.isScreenCanvas) {
-						var projectionMat = object.orthoCamera.projectionMatrix.elements;
-					} else {
-						var projectionMat = camera.projectionMatrix.elements;
-					}
-
-					uniform.set(projectionMat);
+					uniform.set(camera.projectionMatrix.elements);
 					break;
 				case "u_View":
-					if (object.type === OBJECT_TYPE.CANVAS2D && object.isScreenCanvas) {
-						var viewMatrix = object.orthoCamera.viewMatrix.elements;
-					} else {
-						var viewMatrix = camera.viewMatrix.elements;
-					}
-
-					uniform.set(viewMatrix);
+					uniform.set(camera.viewMatrix.elements);
 					break;
@@ -423,11 +428,2 @@ case "u_Model":
 
-			// boneMatrices
-			if (object.type === OBJECT_TYPE.SKINNED_MESH) {
-				this.uploadSkeleton(uniforms, object, program.program);
-			}
-
-			if (material.acceptLight && scene.lights) {
-				this.uploadLights(uniforms, scene.lights, object.receiveShadow, camera);
-			}
-
 			var frontFaceCW = object.worldMatrix.determinant() < 0;
@@ -451,24 +447,6 @@ this.setStates(material, frontFaceCW);
 
-			if (object.type === OBJECT_TYPE.CANVAS2D) {
-				if (object.isScreenCanvas) {
-					object.setRenderViewport(viewport.x, viewport.y, viewport.z, viewport.w);
-					state.viewport(object.viewport.x, object.viewport.y, object.viewport.z, object.viewport.w);
-				}
+			state.viewport(viewport.x, viewport.y, viewport.z, viewport.w);
 
-				var _offset = 0;
-				for (var j = 0; j < object.drawArray.length; j++) {
-					var drawData = object.drawArray[j];
+			this.draw(geometry, material, group);
 
-					uniforms.set("spriteTexture", drawData.texture, this);
-
-					gl.drawElements(gl.TRIANGLES, drawData.count * 6, gl.UNSIGNED_SHORT, _offset * 2);
-					_offset += drawData.count * 6;
-					this._usedTextureUnits = 0;
-				}
-			} else {
-				state.viewport(viewport.x, viewport.y, viewport.z, viewport.w);
-
-				this.draw(geometry, material, group);
-			}
-
 			this.vertexArrayBindings.resetBinding();
@@ -634,3 +612,3 @@
 	// Upload lights uniforms.
-	uploadLights: function(uniforms, lights, receiveShadow, camera) {
+	uploadLights: function(uniforms, lights, disableShadowSampler) {
 		if (lights.ambientsNum > 0) {
@@ -644,3 +622,3 @@ uniforms.set("u_AmbientLightColor", lights.ambient);
 			if (uniforms.has("directionalShadowMap")) {
-				if (this.capabilities.version >= 2) {
+				if (this.capabilities.version >= 2 && !disableShadowSampler) {
 					uniforms.set("directionalShadowMap", lights.directionalShadowDepthMap, this);
@@ -670,3 +648,3 @@ } else {
 			if (uniforms.has("spotShadowMap")) {
-				if (this.capabilities.version >= 2) {
+				if (this.capabilities.version >= 2 && !disableShadowSampler) {
 					uniforms.set("spotShadowMap", lights.spotShadowDepthMap, this);
@@ -673,0 +651,0 @@ } else {

src/core/render/WebGL/WebGLGeometry.js

@@ -0,0 +0,0 @@ function createBuffer(gl, data, attribute, bufferType) {

src/core/render/WebGL/WebGLProgram.js

@@ -0,0 +0,0 @@ import { WebGLUniforms } from './WebGLUniforms.js';

src/core/render/WebGL/WebGLPrograms.js

@@ -161,3 +161,3 @@ import { MATERIAL_TYPE, TEXEL_ENCODING_TYPE, SHADOW_TYPE, SHADING_TYPE, VERTEX_COLOR, FOG_TYPE, DRAW_SIDE, OBJECT_TYPE } from '../../const.js';
 		(props.version >= 2) ? '#define WEBGL2' : '',
-		(props.version < 2) ? '#define sampler2DShadow sampler2D' : '',
+		props.useShadowSampler ? '#define USE_SHADOW_SAMPLER' : '#define sampler2DShadow sampler2D',
 
@@ -340,3 +340,8 @@ props.useRoughnessMap ? '#define USE_ROUGHNESSMAP' : '',
 
-function generateProps(state, capabilities, camera, material, object, lights, fog, clippingPlanes) {
+function generateProps(state, capabilities, camera, material, object, renderContext) {
+	var lights = (renderContext && material.acceptLight) ? renderContext.lights : null;
+	var fog = renderContext ? renderContext.fog : null;
+	var clippingPlanes = renderContext ? renderContext.clippingPlanes : null;
+	var disableShadowSampler = renderContext ? renderContext.disableShadowSampler : null;
+
 	var props = {}; // cache this props?
@@ -376,8 +381,14 @@
 	props.useShadow = object.receiveShadow && !!lights && lights.shadowsNum > 0;
-	if (object.shadowType.indexOf("pcss") > -1 && capabilities.version < 2) {
-		console.warn("WebGL 1.0 not support PCSS soft shadow, fallback to POISSON_SOFT");
-		props.shadowType = SHADOW_TYPE.POISSON_SOFT;
+	if (object.shadowType.indexOf("pcss") > -1) {
+		if (capabilities.version < 2) {
+			console.warn("WebGL 1.0 not support PCSS soft shadow, fallback to POISSON_SOFT");
+			props.shadowType = SHADOW_TYPE.POISSON_SOFT;
+		} else if (disableShadowSampler) {
+			console.warn("Set scene.disableShadowSampler to true can not use pcss, fallback to POISSON_SOFT");
+			props.shadowType = SHADOW_TYPE.POISSON_SOFT;
+		}
 	} else {
 		props.shadowType = object.shadowType;
 	}
+	props.useShadowSampler = capabilities.version >= 2 && !disableShadowSampler;
 	props.dithering = material.dithering;
@@ -447,8 +458,3 @@ // encoding
 
-		// get render context from cache
-		var lights = (cache && material.acceptLight) ? cache.lights : null;
-		var fog = cache ? cache.fog : null;
-		var clippingPlanes = cache ? cache.clippingPlanes : null;
-
-		var props = generateProps(state, capabilities, camera, material, object, lights, fog, clippingPlanes);
+		var props = generateProps(state, capabilities, camera, material, object, cache);
 		var code = generateProgramCode(props, material);
@@ -455,0 +461,0 @@ var program;

src/core/render/WebGL/WebGLProperties.js

@@ -0,0 +0,0 @@ function WebGLProperties() {

src/core/render/WebGL/WebGLRenderBuffer.js

@@ -0,0 +0,0 @@ function WebGLRenderBuffer(gl, properties, capabilities) {

src/core/render/WebGL/WebGLRenderTarget.js

@@ -0,0 +0,0 @@ import { ATTACHMENT } from '../../const.js';

src/core/render/WebGL/WebGLState.js

@@ -0,0 +0,0 @@ import { BLEND_TYPE, CULL_FACE_TYPE, WEBGL_COMPARE_FUNC } from '../../const.js';

src/core/render/WebGL/WebGLTexture.js

@@ -0,0 +0,0 @@ import { WEBGL_TEXTURE_FILTER, WEBGL_TEXTURE_WRAP, WEBGL_PIXEL_TYPE, WEBGL_PIXEL_FORMAT } from '../../const.js';

src/core/render/WebGL/WebGLUniforms.js

@@ -0,0 +0,0 @@ import { WEBGL_UNIFORM_TYPE, WEBGL_PIXEL_TYPE, WEBGL_PIXEL_FORMAT, WEBGL_TEXTURE_FILTER, WEBGL_COMPARE_FUNC } from '../../const.js';

src/core/render/WebGL/WebGLVertexArrayBindings.js

@@ -0,0 +0,0 @@ export class WebGLVertexArrayBindings {

src/core/texture/Texture2D.js

@@ -0,0 +0,0 @@ import { TextureBase } from './TextureBase.js';

src/core/texture/Texture3D.js

@@ -0,0 +0,0 @@ import { TextureBase } from './TextureBase.js';

src/core/texture/TextureBase.js

@@ -161,2 +161,3 @@ import { generateUUID } from '../base.js';
 		this.format = source.format;
+		this.internalformat = source.internalformat;
 		this.type = source.type;
@@ -163,0 +164,0 @@ this.magFilter = source.magFilter;

src/core/texture/TextureCube.js

@@ -0,0 +0,0 @@ import { TextureBase } from './TextureBase.js';

No alert changes

Improved metrics

Number of package files

307

increased by1.99%

Lines of code

61054

increased by3.09%

Worsened metrics

Total package byte prevSize

2497402

decreased by-2.32%

Dev dependency count

9

increased by28.57%

Number of lines in readme file

126

decreased by-17.65%

No dependency changes