Jelajahi Sumber

Reverting RTT hack.

Mr.doob 13 tahun lalu
induk
melakukan
ba74b7dd97
1 mengubah file dengan 19 tambahan dan 37 penghapusan
  1. 19 37
      examples/webgl_rtt.html

+ 19 - 37
examples/webgl_rtt.html

@@ -82,18 +82,6 @@
 
 		</script>
 
-		<script id="vertexShaderFlip" type="x-shader/x-vertex">
-
-			varying vec2 vUv;
-
-			void main() {
-
-				vUv = vec2( uv.x, 1.0 - uv.y );
-				gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );
-
-			}
-
-		</script>
 
 		<script>
 
@@ -144,9 +132,7 @@
 				light.position.set( 0, 0, -1 ).normalize();
 				sceneRTT.add( light );
 
-				rtTexture = new THREE.WebGLRenderTarget( 1024, 1024, { minFilter: THREE.LinearMipMapLinearFilter, magFilter: THREE.LinearFilter, format: THREE.RGBFormat } );
-				rtTexture.wrapS = rtTexture.wrapT = THREE.RepeatWrapping;
-				rtTexture.repeat.set( 1, -1 );
+				rtTexture = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, { minFilter: THREE.LinearFilter, magFilter: THREE.NearestFilter, format: THREE.RGBFormat } );
 
 				material = new THREE.ShaderMaterial( {
 
@@ -159,7 +145,7 @@
 				var materialScreen = new THREE.ShaderMaterial( {
 
 					uniforms: { tDiffuse: { type: "t", value: 0, texture: rtTexture } },
-					vertexShader: document.getElementById( 'vertexShaderFlip' ).textContent,
+					vertexShader: document.getElementById( 'vertexShader' ).textContent,
 					fragmentShader: document.getElementById( 'fragment_shader_screen' ).textContent,
 
 					depthWrite: false
@@ -173,7 +159,20 @@
 				quad.rotation.x = Math.PI / 2;
 				sceneRTT.add( quad );
 
-				createMesh( new THREE.TorusGeometry( 100, 25, 15, 30 ), sceneRTT );
+				var geometry = new THREE.TorusGeometry( 100, 25, 15, 30 );
+
+				var mat1 = new THREE.MeshPhongMaterial( { color: 0x555555, specular: 0xffaa00, shininess: 5 } );
+				var mat2 = new THREE.MeshPhongMaterial( { color: 0x550000, specular: 0xff2200, shininess: 5 } );
+
+				zmesh1 = new THREE.Mesh( geometry, mat1 );
+				zmesh1.position.set( 0, 0, 100 );
+				zmesh1.scale.set( 1.5, 1.5, 1.5 );
+				sceneRTT.add( zmesh1 );
+
+				zmesh2 = new THREE.Mesh( geometry, mat2 );
+				zmesh2.position.set( 0, 150, 100 );
+				zmesh2.scale.set( 0.75, 0.75, 0.75 );
+				sceneRTT.add( zmesh2 );
 
 				quad = new THREE.Mesh( plane, materialScreen );
 				quad.position.z = -100;
@@ -190,11 +189,11 @@
 
 						mesh = new THREE.Mesh( geometry, material2 );
 
-						mesh.position.x = ( i - (n-1)/2 ) * 20;
-						mesh.position.y = ( j - (n-1)/2 ) * 20;
+						mesh.position.x = ( i - ( n - 1 ) / 2 ) * 20;
+						mesh.position.y = ( j - ( n - 1 ) / 2 ) * 20;
 						mesh.position.z = 0;
 
-						mesh.rotation.y = -Math.PI/2;
+						mesh.rotation.y = - Math.PI / 2;
 
 						scene.add( mesh );
 
@@ -217,23 +216,6 @@
 
 			}
 
-			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.set( 0, 0, 100 );
-				zmesh1.scale.set( 1.5, 1.5, 1.5 );
-				xscene.add( zmesh1 );
-
-				zmesh2 = new THREE.Mesh( geometry, mat2 );
-				zmesh2.position.set( 0, 150, 100 );
-				zmesh2.scale.set( 0.75, 0.75, 0.75 );
-				xscene.add( zmesh2 );
-
-			}
-
 			function onDocumentMouseMove( event ) {
 
 				mouseX = ( event.clientX - windowHalfX );