Fixed incorrect setSize in AnaglyphEffect and ParallaxBarrierEffect. More examples resize handling.

examples/js/effects/AnaglyphEffect.js

@@ -80,11 +80,11 @@ THREE.AnaglyphEffect = function ( renderer ) {
 
 	this.setSize = function ( width, height ) {
 
-		_renderTargetL.width = width;
-		_renderTargetL.height = height;
+		_renderTargetL = new THREE.WebGLRenderTarget( width, height, _params );
+		_renderTargetR = new THREE.WebGLRenderTarget( width, height, _params );
 
-		_renderTargetR.width = width;
-		_renderTargetR.height = height;
+		_material.uniforms[ "mapLeft" ].texture = _renderTargetL;
+		_material.uniforms[ "mapRight" ].texture = _renderTargetR;
 
 		renderer.setSize( width, height );
 

examples/js/effects/ParallaxBarrierEffect.js

@@ -82,11 +82,11 @@ THREE.ParallaxBarrierEffect = function ( renderer ) {
 
 	this.setSize = function ( width, height ) {
 
-		_renderTargetL.width = width;
-		_renderTargetL.height = height;
+		_renderTargetL = new THREE.WebGLRenderTarget( width, height, _params );
+		_renderTargetR = new THREE.WebGLRenderTarget( width, height, _params );
 
-		_renderTargetR.width = width;
-		_renderTargetR.height = height;
+		_material.uniforms[ "mapLeft" ].texture = _renderTargetL;
+		_material.uniforms[ "mapRight" ].texture = _renderTargetR;
 
 		renderer.setSize( width, height );
 

examples/webgl_lod.html

@@ -118,7 +118,6 @@
 				}
 
 
-
 				renderer = new THREE.WebGLRenderer( { clearColor: 0x000000, clearAlpha: 1 } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
@@ -127,6 +126,22 @@
 
 				container.appendChild( renderer.domElement );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				windowHalfX = window.innerWidth / 2,
+				windowHalfY = window.innerHeight / 2,
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function onDocumentMouseMove(event) {

examples/webgl_materials.html

@@ -176,6 +176,19 @@
 
 				container.appendChild( stats.domElement );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function generateTexture() {

examples/webgl_materials_cars.html

@@ -467,6 +467,25 @@
 
 				for( var c in CARS ) initCarButton( c );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				windowHalfX = window.innerWidth / 2,
+				windowHalfY = window.innerHeight / 2,
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				cameraCube.aspect = window.innerWidth / window.innerHeight;
+				cameraCube.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function initCarButton( car ) {

examples/webgl_materials_cars_anaglyph.html

@@ -205,8 +205,11 @@
 				renderer = new THREE.WebGLRenderer();
 				renderer.setFaceCulling( 0 );
 
+				var width = window.innerWidth || 2;
+				var height = window.innerHeight || 2;
+
 				effect = new THREE.AnaglyphEffect( renderer );
-				effect.setSize( window.innerWidth, window.innerHeight );
+				effect.setSize( width, height );
 
 				container.appendChild( renderer.domElement );
 
@@ -459,6 +462,22 @@
 
 				for( var c in CARS ) initCarButton( c );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				windowHalfX = window.innerWidth / 2,
+				windowHalfY = window.innerHeight / 2,
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				effect.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function initCarButton( car ) {

examples/webgl_materials_cars_camaro.html

@@ -140,6 +140,22 @@
 				var loader = new THREE.BinaryLoader();
 				loader.load( "obj/camaro/CamaroNoUv_bin.js", function( geometry ) { createScene( geometry, camaroMaterials ) } );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				windowHalfX = window.innerWidth / 2,
+				windowHalfY = window.innerHeight / 2,
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function $( id ) { return document.getElementById( id ) }

examples/webgl_materials_cars_camaro_crosseyed.html

@@ -150,6 +150,22 @@
 				var loader = new THREE.BinaryLoader();
 				loader.load( "obj/camaro/CamaroNoUv_bin.js", function( geometry ) { createScene( geometry, camaroMaterials ) } );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				windowHalfX = window.innerWidth / 2,
+				windowHalfY = window.innerHeight / 2,
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				effect.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function $( id ) { return document.getElementById( id ) }

examples/webgl_materials_cars_parallaxbarrier.html

@@ -207,8 +207,11 @@
 				renderer.setFaceCulling( 0 );
 				container.appendChild( renderer.domElement );
 
+				var width = window.innerWidth || 2;
+				var height = window.innerHeight || 2;
+
 				effect = new THREE.ParallaxBarrierEffect( renderer );
-				effect.setSize( window.innerWidth, window.innerHeight );				
+				effect.setSize( width, height );
 
 				if ( STATS_ENABLED ) {
 
@@ -459,6 +462,22 @@
 
 				for( var c in CARS ) initCarButton( c );
 
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				windowHalfX = window.innerWidth / 2,
+				windowHalfY = window.innerHeight / 2,
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				effect.setSize( window.innerWidth, window.innerHeight );
+
 			}
 
 			function initCarButton( car ) {
@@ -476,7 +495,7 @@
 
 					}
 
-				}, false);
+				}, false );
 
 			}