From 7c9fe8ff82a44be1292a0466ecbb9dd299d64b62 Mon Sep 17 00:00:00 2001 From: alteredq Date: Fri, 14 Jan 2011 12:39:57 +0100 Subject: [PATCH] Another update of render-to-texture example and related bugfix. Rendering proper 3d object into the texture uncovered another issue - framebuffer had to be cleared after switching. Texture is still flipped :( (original scene has small red torus on the top) This is proving to be rather tricky. Yet again I tried to handle image coordinate mess in a proper way (UNPACK_FLIP_Y_WEBGL as texture parameter and non-inverted UVs), fixing hacks across the codebase. This did indeed help with render-to-texture flipping, but instead it created really ugly problems with both normal map and minecraft AO demos. So back to square one :( --- build/Three.js | 16 +++++------ build/ThreeDebug.js | 16 +++++------ build/ThreeExtras.js | 16 +++++------ examples/render_to_texture.html | 51 ++++++++++++++++++++++++++++++--- src/renderers/WebGLRenderer.js | 1 + 5 files changed, 72 insertions(+), 28 deletions(-) diff --git a/build/Three.js b/build/Three.js index b79d0949..cbde136d 100755 --- a/build/Three.js +++ b/build/Three.js @@ -177,14 +177,14 @@ j.wireframe_linewidth!==undefined?j.wireframe_linewidth:j.linewidth!==undefined? j.materials.length;r=0;n--){j=e.__webGLObjects[n].object;h==j&&e.__webGLObjects.splice(n,1)}};this.setupMatrices=function(e,h){e.autoUpdateMatrix&&e.updateMatrix(); -D.multiply(h.matrix,e.matrix);A.set(D.flatten());F=THREE.Matrix4.makeInvert3x3(D).transpose();V.set(F.m);U.set(e.matrix.flatten())};this.loadMatrices=function(e){b.uniformMatrix4fv(e.uniforms.viewMatrix,false,y);b.uniformMatrix4fv(e.uniforms.modelViewMatrix,false,A);b.uniformMatrix4fv(e.uniforms.projectionMatrix,false,S);b.uniformMatrix3fv(e.uniforms.normalMatrix,false,V);b.uniformMatrix4fv(e.uniforms.objectMatrix,false,U)};this.loadCamera=function(e,h){b.uniform3f(e.uniforms.cameraPosition,h.position.x, -h.position.y,h.position.z)};this.setBlending=function(e){switch(e){case THREE.AdditiveBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE);break;case THREE.SubtractiveBlending:b.blendFunc(b.DST_COLOR,b.ZERO);break;default:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA)}};this.setFaceCulling=function(e,h){if(e){!h||h=="ccw"?b.frontFace(b.CCW):b.frontFace(b.CW);if(e=="back")b.cullFace(b.BACK);else e=="front"?b.cullFace(b.FRONT):b.cullFace(b.FRONT_AND_BACK);b.enable(b.CULL_FACE)}else b.disable(b.CULL_FACE)}; -this.supportsVertexTextures=function(){return b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}}; +p=q.width;k=q.height}if(j!=o){b.bindFramebuffer(b.FRAMEBUFFER,j);b.viewport(0,0,p,k);b.clear(b.COLOR_BUFFER_BIT|b.DEPTH_BUFFER_BIT);o=j}this.autoClear&&this.clear();h.autoUpdateMatrix&&h.updateMatrix();y.set(h.matrix.flatten());S.set(h.projectionMatrix.flatten());j=0;for(p=e.__webGLObjects.length;j=0;n--){j=e.__webGLObjects[n].object;h==j&&e.__webGLObjects.splice(n,1)}};this.setupMatrices=function(e, +h){e.autoUpdateMatrix&&e.updateMatrix();D.multiply(h.matrix,e.matrix);A.set(D.flatten());F=THREE.Matrix4.makeInvert3x3(D).transpose();V.set(F.m);U.set(e.matrix.flatten())};this.loadMatrices=function(e){b.uniformMatrix4fv(e.uniforms.viewMatrix,false,y);b.uniformMatrix4fv(e.uniforms.modelViewMatrix,false,A);b.uniformMatrix4fv(e.uniforms.projectionMatrix,false,S);b.uniformMatrix3fv(e.uniforms.normalMatrix,false,V);b.uniformMatrix4fv(e.uniforms.objectMatrix,false,U)};this.loadCamera=function(e,h){b.uniform3f(e.uniforms.cameraPosition, +h.position.x,h.position.y,h.position.z)};this.setBlending=function(e){switch(e){case THREE.AdditiveBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE);break;case THREE.SubtractiveBlending:b.blendFunc(b.DST_COLOR,b.ZERO);break;default:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA)}};this.setFaceCulling=function(e,h){if(e){!h||h=="ccw"?b.frontFace(b.CCW):b.frontFace(b.CW);if(e=="back")b.cullFace(b.BACK);else e=="front"?b.cullFace(b.FRONT):b.cullFace(b.FRONT_AND_BACK); +b.enable(b.CULL_FACE)}else b.disable(b.CULL_FACE)};this.supportsVertexTextures=function(){return b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}}; THREE.Snippets={fog_pars_fragment:"#ifdef USE_FOG\nuniform vec3 fogColor;\n#ifdef FOG_EXP2\nuniform float fogDensity;\n#else\nuniform float fogNear;\nuniform float fogFar;\n#endif\n#endif",fog_fragment:"#ifdef USE_FOG\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\n#ifdef FOG_EXP2\nconst float LOG2 = 1.442695;\nfloat fogFactor = exp2( - fogDensity * fogDensity * depth * depth * LOG2 );\nfogFactor = 1.0 - clamp( fogFactor, 0.0, 1.0 );\n#else\nfloat fogFactor = smoothstep( fogNear, fogFar, depth );\n#endif\ngl_FragColor = mix( gl_FragColor, vec4( fogColor, 1.0 ), fogFactor );\n#endif",envmap_pars_fragment:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float reflectivity;\nuniform samplerCube env_map;\nuniform int combine;\n#endif", envmap_fragment:"#ifdef USE_ENVMAP\ncubeColor = textureCube( env_map, vec3( -vReflect.x, vReflect.yz ) );\nif ( combine == 1 ) {\ngl_FragColor = mix( gl_FragColor, cubeColor, reflectivity );\n} else {\ngl_FragColor = gl_FragColor * cubeColor;\n}\n#endif",envmap_pars_vertex:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float refraction_ratio;\nuniform bool useRefract;\n#endif",envmap_vertex:"#ifdef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\nvec3 nWorld = mat3( objectMatrix[0].xyz, objectMatrix[1].xyz, objectMatrix[2].xyz ) * normal;\nif ( useRefract ) {\nvReflect = refract( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ), refraction_ratio );\n} else {\nvReflect = reflect( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ) );\n}\n#endif", map_pars_fragment:"#ifdef USE_MAP\nvarying vec2 vUv;\nuniform sampler2D map;\n#endif",map_pars_vertex:"#ifdef USE_MAP\nvarying vec2 vUv;\n#endif",map_fragment:"#ifdef USE_MAP\nmapColor = texture2D( map, vUv );\n#endif",map_vertex:"#ifdef USE_MAP\nvUv = uv;\n#endif",lights_pars_vertex:"uniform bool enableLighting;\nuniform vec3 ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nuniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];\nuniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];\n#ifdef PHONG\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\n#endif", diff --git a/build/ThreeDebug.js b/build/ThreeDebug.js index 0f18d5e3..cfc1224d 100644 --- a/build/ThreeDebug.js +++ b/build/ThreeDebug.js @@ -178,14 +178,14 @@ j.wireframe_linewidth!==undefined?j.wireframe_linewidth:j.linewidth!==undefined? j.materials.length;r=0;o--){j=e.__webGLObjects[o].object;h==j&&e.__webGLObjects.splice(o,1)}};this.setupMatrices=function(e,h){e.autoUpdateMatrix&&e.updateMatrix(); -D.multiply(h.matrix,e.matrix);A.set(D.flatten());F=THREE.Matrix4.makeInvert3x3(D).transpose();V.set(F.m);U.set(e.matrix.flatten())};this.loadMatrices=function(e){b.uniformMatrix4fv(e.uniforms.viewMatrix,false,y);b.uniformMatrix4fv(e.uniforms.modelViewMatrix,false,A);b.uniformMatrix4fv(e.uniforms.projectionMatrix,false,T);b.uniformMatrix3fv(e.uniforms.normalMatrix,false,V);b.uniformMatrix4fv(e.uniforms.objectMatrix,false,U)};this.loadCamera=function(e,h){b.uniform3f(e.uniforms.cameraPosition,h.position.x, -h.position.y,h.position.z)};this.setBlending=function(e){switch(e){case THREE.AdditiveBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE);break;case THREE.SubtractiveBlending:b.blendFunc(b.DST_COLOR,b.ZERO);break;default:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA)}};this.setFaceCulling=function(e,h){if(e){!h||h=="ccw"?b.frontFace(b.CCW):b.frontFace(b.CW);if(e=="back")b.cullFace(b.BACK);else e=="front"?b.cullFace(b.FRONT):b.cullFace(b.FRONT_AND_BACK);b.enable(b.CULL_FACE)}else b.disable(b.CULL_FACE)}; -this.supportsVertexTextures=function(){return b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}}; +p=q.width;k=q.height}if(j!=n){b.bindFramebuffer(b.FRAMEBUFFER,j);b.viewport(0,0,p,k);b.clear(b.COLOR_BUFFER_BIT|b.DEPTH_BUFFER_BIT);n=j}this.autoClear&&this.clear();h.autoUpdateMatrix&&h.updateMatrix();y.set(h.matrix.flatten());T.set(h.projectionMatrix.flatten());j=0;for(p=e.__webGLObjects.length;j=0;o--){j=e.__webGLObjects[o].object;h==j&&e.__webGLObjects.splice(o,1)}};this.setupMatrices=function(e, +h){e.autoUpdateMatrix&&e.updateMatrix();D.multiply(h.matrix,e.matrix);A.set(D.flatten());F=THREE.Matrix4.makeInvert3x3(D).transpose();V.set(F.m);U.set(e.matrix.flatten())};this.loadMatrices=function(e){b.uniformMatrix4fv(e.uniforms.viewMatrix,false,y);b.uniformMatrix4fv(e.uniforms.modelViewMatrix,false,A);b.uniformMatrix4fv(e.uniforms.projectionMatrix,false,T);b.uniformMatrix3fv(e.uniforms.normalMatrix,false,V);b.uniformMatrix4fv(e.uniforms.objectMatrix,false,U)};this.loadCamera=function(e,h){b.uniform3f(e.uniforms.cameraPosition, +h.position.x,h.position.y,h.position.z)};this.setBlending=function(e){switch(e){case THREE.AdditiveBlending:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE);break;case THREE.SubtractiveBlending:b.blendFunc(b.DST_COLOR,b.ZERO);break;default:b.blendEquation(b.FUNC_ADD);b.blendFunc(b.ONE,b.ONE_MINUS_SRC_ALPHA)}};this.setFaceCulling=function(e,h){if(e){!h||h=="ccw"?b.frontFace(b.CCW):b.frontFace(b.CW);if(e=="back")b.cullFace(b.BACK);else e=="front"?b.cullFace(b.FRONT):b.cullFace(b.FRONT_AND_BACK); +b.enable(b.CULL_FACE)}else b.disable(b.CULL_FACE)};this.supportsVertexTextures=function(){return b.getParameter(b.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}}; THREE.Snippets={fog_pars_fragment:"#ifdef USE_FOG\nuniform vec3 fogColor;\n#ifdef FOG_EXP2\nuniform float fogDensity;\n#else\nuniform float fogNear;\nuniform float fogFar;\n#endif\n#endif",fog_fragment:"#ifdef USE_FOG\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\n#ifdef FOG_EXP2\nconst float LOG2 = 1.442695;\nfloat fogFactor = exp2( - fogDensity * fogDensity * depth * depth * LOG2 );\nfogFactor = 1.0 - clamp( fogFactor, 0.0, 1.0 );\n#else\nfloat fogFactor = smoothstep( fogNear, fogFar, depth );\n#endif\ngl_FragColor = mix( gl_FragColor, vec4( fogColor, 1.0 ), fogFactor );\n#endif",envmap_pars_fragment:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float reflectivity;\nuniform samplerCube env_map;\nuniform int combine;\n#endif", envmap_fragment:"#ifdef USE_ENVMAP\ncubeColor = textureCube( env_map, vec3( -vReflect.x, vReflect.yz ) );\nif ( combine == 1 ) {\ngl_FragColor = mix( gl_FragColor, cubeColor, reflectivity );\n} else {\ngl_FragColor = gl_FragColor * cubeColor;\n}\n#endif",envmap_pars_vertex:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float refraction_ratio;\nuniform bool useRefract;\n#endif",envmap_vertex:"#ifdef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\nvec3 nWorld = mat3( objectMatrix[0].xyz, objectMatrix[1].xyz, objectMatrix[2].xyz ) * normal;\nif ( useRefract ) {\nvReflect = refract( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ), refraction_ratio );\n} else {\nvReflect = reflect( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ) );\n}\n#endif", map_pars_fragment:"#ifdef USE_MAP\nvarying vec2 vUv;\nuniform sampler2D map;\n#endif",map_pars_vertex:"#ifdef USE_MAP\nvarying vec2 vUv;\n#endif",map_fragment:"#ifdef USE_MAP\nmapColor = texture2D( map, vUv );\n#endif",map_vertex:"#ifdef USE_MAP\nvUv = uv;\n#endif",lights_pars_vertex:"uniform bool enableLighting;\nuniform vec3 ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nuniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];\nuniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];\n#ifdef PHONG\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\n#endif", diff --git a/build/ThreeExtras.js b/build/ThreeExtras.js index e29d37ef..56dfa5ed 100644 --- a/build/ThreeExtras.js +++ b/build/ThreeExtras.js @@ -177,14 +177,14 @@ n.wireframe_linewidth!==undefined?n.wireframe_linewidth:n.linewidth!==undefined? n.materials.length;x=0;u--){n=f.__webGLObjects[u].object;l==n&&f.__webGLObjects.splice(u,1)}};this.setupMatrices=function(f,l){f.autoUpdateMatrix&&f.updateMatrix(); -v.multiply(l.matrix,f.matrix);y.set(v.flatten());D=THREE.Matrix4.makeInvert3x3(v).transpose();C.set(D.m);M.set(f.matrix.flatten())};this.loadMatrices=function(f){c.uniformMatrix4fv(f.uniforms.viewMatrix,false,r);c.uniformMatrix4fv(f.uniforms.modelViewMatrix,false,y);c.uniformMatrix4fv(f.uniforms.projectionMatrix,false,B);c.uniformMatrix3fv(f.uniforms.normalMatrix,false,C);c.uniformMatrix4fv(f.uniforms.objectMatrix,false,M)};this.loadCamera=function(f,l){c.uniform3f(f.uniforms.cameraPosition,l.position.x, -l.position.y,l.position.z)};this.setBlending=function(f){switch(f){case THREE.AdditiveBlending:c.blendEquation(c.FUNC_ADD);c.blendFunc(c.ONE,c.ONE);break;case THREE.SubtractiveBlending:c.blendFunc(c.DST_COLOR,c.ZERO);break;default:c.blendEquation(c.FUNC_ADD);c.blendFunc(c.ONE,c.ONE_MINUS_SRC_ALPHA)}};this.setFaceCulling=function(f,l){if(f){!l||l=="ccw"?c.frontFace(c.CCW):c.frontFace(c.CW);if(f=="back")c.cullFace(c.BACK);else f=="front"?c.cullFace(c.FRONT):c.cullFace(c.FRONT_AND_BACK);c.enable(c.CULL_FACE)}else c.disable(c.CULL_FACE)}; -this.supportsVertexTextures=function(){return c.getParameter(c.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}}; +s=j.width;p=j.height}if(n!=m){c.bindFramebuffer(c.FRAMEBUFFER,n);c.viewport(0,0,s,p);c.clear(c.COLOR_BUFFER_BIT|c.DEPTH_BUFFER_BIT);m=n}this.autoClear&&this.clear();l.autoUpdateMatrix&&l.updateMatrix();r.set(l.matrix.flatten());B.set(l.projectionMatrix.flatten());n=0;for(s=f.__webGLObjects.length;n=0;u--){n=f.__webGLObjects[u].object;l==n&&f.__webGLObjects.splice(u,1)}};this.setupMatrices=function(f, +l){f.autoUpdateMatrix&&f.updateMatrix();v.multiply(l.matrix,f.matrix);y.set(v.flatten());D=THREE.Matrix4.makeInvert3x3(v).transpose();C.set(D.m);M.set(f.matrix.flatten())};this.loadMatrices=function(f){c.uniformMatrix4fv(f.uniforms.viewMatrix,false,r);c.uniformMatrix4fv(f.uniforms.modelViewMatrix,false,y);c.uniformMatrix4fv(f.uniforms.projectionMatrix,false,B);c.uniformMatrix3fv(f.uniforms.normalMatrix,false,C);c.uniformMatrix4fv(f.uniforms.objectMatrix,false,M)};this.loadCamera=function(f,l){c.uniform3f(f.uniforms.cameraPosition, +l.position.x,l.position.y,l.position.z)};this.setBlending=function(f){switch(f){case THREE.AdditiveBlending:c.blendEquation(c.FUNC_ADD);c.blendFunc(c.ONE,c.ONE);break;case THREE.SubtractiveBlending:c.blendFunc(c.DST_COLOR,c.ZERO);break;default:c.blendEquation(c.FUNC_ADD);c.blendFunc(c.ONE,c.ONE_MINUS_SRC_ALPHA)}};this.setFaceCulling=function(f,l){if(f){!l||l=="ccw"?c.frontFace(c.CCW):c.frontFace(c.CW);if(f=="back")c.cullFace(c.BACK);else f=="front"?c.cullFace(c.FRONT):c.cullFace(c.FRONT_AND_BACK); +c.enable(c.CULL_FACE)}else c.disable(c.CULL_FACE)};this.supportsVertexTextures=function(){return c.getParameter(c.MAX_VERTEX_TEXTURE_IMAGE_UNITS)>0}}; THREE.Snippets={fog_pars_fragment:"#ifdef USE_FOG\nuniform vec3 fogColor;\n#ifdef FOG_EXP2\nuniform float fogDensity;\n#else\nuniform float fogNear;\nuniform float fogFar;\n#endif\n#endif",fog_fragment:"#ifdef USE_FOG\nfloat depth = gl_FragCoord.z / gl_FragCoord.w;\n#ifdef FOG_EXP2\nconst float LOG2 = 1.442695;\nfloat fogFactor = exp2( - fogDensity * fogDensity * depth * depth * LOG2 );\nfogFactor = 1.0 - clamp( fogFactor, 0.0, 1.0 );\n#else\nfloat fogFactor = smoothstep( fogNear, fogFar, depth );\n#endif\ngl_FragColor = mix( gl_FragColor, vec4( fogColor, 1.0 ), fogFactor );\n#endif",envmap_pars_fragment:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float reflectivity;\nuniform samplerCube env_map;\nuniform int combine;\n#endif", envmap_fragment:"#ifdef USE_ENVMAP\ncubeColor = textureCube( env_map, vec3( -vReflect.x, vReflect.yz ) );\nif ( combine == 1 ) {\ngl_FragColor = mix( gl_FragColor, cubeColor, reflectivity );\n} else {\ngl_FragColor = gl_FragColor * cubeColor;\n}\n#endif",envmap_pars_vertex:"#ifdef USE_ENVMAP\nvarying vec3 vReflect;\nuniform float refraction_ratio;\nuniform bool useRefract;\n#endif",envmap_vertex:"#ifdef USE_ENVMAP\nvec4 mPosition = objectMatrix * vec4( position, 1.0 );\nvec3 nWorld = mat3( objectMatrix[0].xyz, objectMatrix[1].xyz, objectMatrix[2].xyz ) * normal;\nif ( useRefract ) {\nvReflect = refract( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ), refraction_ratio );\n} else {\nvReflect = reflect( normalize( mPosition.xyz - cameraPosition ), normalize( nWorld.xyz ) );\n}\n#endif", map_pars_fragment:"#ifdef USE_MAP\nvarying vec2 vUv;\nuniform sampler2D map;\n#endif",map_pars_vertex:"#ifdef USE_MAP\nvarying vec2 vUv;\n#endif",map_fragment:"#ifdef USE_MAP\nmapColor = texture2D( map, vUv );\n#endif",map_vertex:"#ifdef USE_MAP\nvUv = uv;\n#endif",lights_pars_vertex:"uniform bool enableLighting;\nuniform vec3 ambientLightColor;\n#if MAX_DIR_LIGHTS > 0\nuniform vec3 directionalLightColor[ MAX_DIR_LIGHTS ];\nuniform vec3 directionalLightDirection[ MAX_DIR_LIGHTS ];\n#endif\n#if MAX_POINT_LIGHTS > 0\nuniform vec3 pointLightColor[ MAX_POINT_LIGHTS ];\nuniform vec3 pointLightPosition[ MAX_POINT_LIGHTS ];\n#ifdef PHONG\nvarying vec3 vPointLightVector[ MAX_POINT_LIGHTS ];\n#endif\n#endif", diff --git a/examples/render_to_texture.html b/examples/render_to_texture.html index 4c5c9ff4..73748698 100644 --- a/examples/render_to_texture.html +++ b/examples/render_to_texture.html @@ -43,6 +43,7 @@ void main(void) { + //gl_FragColor = texture2D( tDiffuse, vec2( vUv.x, 1.0 - vUv.y ) ); gl_FragColor = texture2D( tDiffuse, vUv ); } @@ -79,7 +80,7 @@ var container, stats; - var cameraRTT, camera, sceneRTT, sceneScreen, scene, renderer; + var cameraRTT, camera, sceneRTT, sceneScreen, scene, renderer, zmesh1, zmesh2; var mouseX = 0, mouseY = 0; @@ -113,6 +114,8 @@ light.position.z = 1; light.position.normalize(); scene.addLight( light ); + sceneRTT.addLight( light ); + sceneScreen.addLight( light ); light = new THREE.DirectionalLight( 0xffaaaa, 0.5 ); light.position.x = -1; @@ -139,14 +142,17 @@ } ); - var mt = new THREE.MeshBasicMaterial( { color:0xffffff, map: ImageUtils.loadTexture( "textures/land_ocean_ice_cloud_2048.jpg" ) } ); + //var mt = new THREE.MeshBasicMaterial( { color:0xffffff, map: ImageUtils.loadTexture( "textures/land_ocean_ice_cloud_2048.jpg" ) } ); - var plane = new Plane( 2000, 1000 ); + var plane = new Plane( window.innerWidth, window.innerHeight ); quad = new THREE.Mesh( plane, material ); quad.position.z = -100; sceneRTT.addObject( quad ); + var loader = new THREE.Loader(); + loader.loadBinary( { model: "obj/torus/Torus_bin.js", callback: function( geometry ) { createMesh( geometry, sceneRTT ) } } ); + quad = new THREE.Mesh( plane, materialScreen ); quad.position.z = -100; sceneScreen.addObject( quad ); @@ -183,6 +189,31 @@ } + function createMesh( geometry, xscene ) { + + var mat1 = new THREE.MeshPhongMaterial( { color: 0x555555, specular:0xffaa00, shininess:5 } ), + mat2 = new THREE.MeshPhongMaterial( { color: 0x550000, specular:0xff2200, shininess:5 } ); + + zmesh1 = new THREE.Mesh( geometry, mat1 ); + zmesh1.position.x = 0; + zmesh1.position.y = 0; + zmesh1.position.z = 100; + zmesh1.scale.x = zmesh1.scale.y = zmesh1.scale.z = 150; + zmesh1.overdraw = true; + zmesh1.updateMatrix(); + xscene.addObject( zmesh1 ); + + zmesh2 = new THREE.Mesh( geometry, mat2 ); + zmesh2.position.x = 0; + zmesh2.position.y = 150; + zmesh2.position.z = 100; + zmesh2.scale.x = zmesh2.scale.y = zmesh2.scale.z = 75; + zmesh2.overdraw = true; + zmesh2.updateMatrix(); + xscene.addObject( zmesh2 ); + + } + function onDocumentMouseMove( event ) { mouseX = ( event.clientX - windowHalfX ); @@ -194,10 +225,20 @@ function loop() { + var time = new Date().getTime() * 0.0015; + camera.position.x += ( mouseX - camera.position.x ) * .05; camera.position.y += ( - mouseY - camera.position.y ) * .05; - + if ( zmesh1 && zmesh2 ) { + + zmesh1.rotation.x = 1.57; + zmesh1.rotation.z = time; + + zmesh2.rotation.z = 1.57; + zmesh2.rotation.y = -time; + + } if ( material.uniforms.time.value > 1 || material.uniforms.time.value < 0 ) { @@ -213,11 +254,13 @@ renderer.render( sceneRTT, cameraRTT, rtTexture ); + // Render full screen quad with generated texture // (disable depth writing so that it stays in the background) renderer.context.depthMask( 0 ); renderer.render( sceneScreen, cameraRTT ); + //renderer.render( sceneRTT, cameraRTT ); renderer.context.depthMask( 1 ); // Render second scene to screen diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js index bfba5ae3..75be1272 100644 --- a/src/renderers/WebGLRenderer.js +++ b/src/renderers/WebGLRenderer.js @@ -1505,6 +1505,7 @@ THREE.WebGLRenderer = function ( parameters ) { _gl.bindFramebuffer( _gl.FRAMEBUFFER, framebuffer ); _gl.viewport( 0, 0, width, height ); + _gl.clear( _gl.COLOR_BUFFER_BIT | _gl.DEPTH_BUFFER_BIT ); _oldFramebuffer = framebuffer;