Projector now looks on the material for flipSided and doubleSided. Updated rest of examples.

examples/canvas_geometry_birds.html

@@ -357,11 +357,9 @@
 					boid.setAvoidWalls( true );
 					boid.setWorldSize( 500, 500, 400 );
 
-					bird = birds[ i ] = new THREE.Mesh( new Bird(), new THREE.MeshBasicMaterial( { color:Math.random() * 0xffffff } ) );
+					bird = birds[ i ] = new THREE.Mesh( new Bird(), new THREE.MeshBasicMaterial( { color:Math.random() * 0xffffff, doubleSided: true } ) );
 					bird.phase = Math.floor( Math.random() * 62.83 );
 					bird.position = boids[ i ].position;
-					bird.doubleSided = true;
-					// bird.scale.x = bird.scale.y = bird.scale.z = 10;
 					scene.add( bird );
 
 

examples/canvas_geometry_text.html

@@ -90,8 +90,6 @@
 				var textMaterial = new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff, overdraw: true } );
 				text = new THREE.Mesh( text3d, textMaterial );
 
-				text.doubleSided = false;
-
 				text.position.x = centerOffset;
 				text.position.y = 100;
 				text.position.z = 0;

examples/canvas_materials.html

@@ -68,14 +68,14 @@
 
 				var materials = [
 
-					{ material: new THREE.MeshBasicMaterial( { color: 0x00ffff, wireframe: true } ), doubleSided: true },
-					{ material: new THREE.MeshBasicMaterial( { color: 0xff0000, blending: THREE.AdditiveBlending } ), doubleSided: true },
-					{ material: new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, overdraw: true } ), doubleSided: false },
-					{ material: new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.SmoothShading, overdraw: true } ), doubleSided: false },
-					{ material: new THREE.MeshDepthMaterial( { overdraw: true } ), doubleSided: false },
-					{ material: new THREE.MeshNormalMaterial( { overdraw: true } ), doubleSided: false },
-					{ material: new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'textures/land_ocean_ice_cloud_2048.jpg' ) } ), doubleSided: false },
-					{ material: new THREE.MeshBasicMaterial( { envMap: THREE.ImageUtils.loadTexture( 'textures/envmap.png', new THREE.SphericalReflectionMapping() ) } ), doubleSided: false }
+					{ material: new THREE.MeshBasicMaterial( { color: 0x00ffff, wireframe: true, oubleSided: true } ) },
+					{ material: new THREE.MeshBasicMaterial( { color: 0xff0000, blending: THREE.AdditiveBlending, doubleSided: true } ) },
+					{ material: new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.FlatShading, doubleSided: false, overdraw: true } ) },
+					{ material: new THREE.MeshLambertMaterial( { color: 0xffffff, shading: THREE.SmoothShading, doubleSided: false, overdraw: true } ) },
+					{ material: new THREE.MeshDepthMaterial( { doubleSided: false, overdraw: true } ) },
+					{ material: new THREE.MeshNormalMaterial( { doubleSided: false, overdraw: true } ) },
+					{ material: new THREE.MeshBasicMaterial( { map: THREE.ImageUtils.loadTexture( 'textures/land_ocean_ice_cloud_2048.jpg' ), doubleSided: false } ) },
+					{ material: new THREE.MeshBasicMaterial( { envMap: THREE.ImageUtils.loadTexture( 'textures/envmap.png', new THREE.SphericalReflectionMapping() ), doubleSided: false } ) }
 
 				];
 
@@ -93,7 +93,6 @@
 				for ( var i = 0, l = materials.length; i < l; i ++ ) {
 
 					var sphere = new THREE.Mesh( geometry, materials[ i ].material );
-					sphere.doubleSided = materials[ i ].doubleSided;
 
 					sphere.position.x = ( i % 5 ) * 200 - 400;
 					sphere.position.z = Math.floor( i / 5 ) * 200 - 200;

examples/canvas_materials_depth.html

@@ -61,12 +61,11 @@
 
 				// Plane
 
-				var material = new THREE.MeshDepthMaterial( { overdraw: true } );
+				var material = new THREE.MeshDepthMaterial( { doubleSided: true, overdraw: true } );
 
 				plane = new THREE.Mesh( new THREE.PlaneGeometry( 1000, 1000, 10, 10 ), material );
 				plane.position.y = - 100;
 				plane.rotation.x = - Math.PI / 2;
-				plane.doubleSided = true;
 				scene.add( plane );
 
 				// Cubes

examples/canvas_materials_video.html

@@ -99,7 +99,7 @@
 				textureReflection.minFilter = THREE.LinearFilter;
 				textureReflection.magFilter = THREE.LinearFilter;
 
-				var materialReflection = new THREE.MeshBasicMaterial( { map: textureReflection, overdraw: true } );
+				var materialReflection = new THREE.MeshBasicMaterial( { map: textureReflection, flipSided: true, overdraw: true } );
 
 				//
 
@@ -113,7 +113,6 @@
 				mesh.position.y = -306;
 				mesh.rotation.x = - Math.PI;
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 1.5;
-				mesh.doubleSided = true;
 				scene.add( mesh );
 
 				//

examples/canvas_particles_shapes.html

@@ -99,8 +99,6 @@
 				// Potentially, we can extract the vertices or faces of the text to generate particles too.
 				// Geo > Vertices > Position
 
-				text.doubleSided = false;
-
 				text.position.x = centerOffset;
 				text.position.y = 100;
 				text.position.z = 0;

src/core/Projector.js

@@ -128,10 +128,10 @@ THREE.Projector = function() {
 
 		var near = camera.near, far = camera.far, visible = false,
 		o, ol, v, vl, f, fl, n, nl, c, cl, u, ul, object,
-		modelMatrix, normalMatrix,
+		modelMatrix, rotationMatrix,
 		geometry, geometryMaterials, vertices, vertex, vertexPositionScreen,
 		faces, face, faceVertexNormals, normal, faceVertexUvs, uvs,
-		v1, v2, v3, v4;
+		v1, v2, v3, v4, flipSided, doubleSided;
 
 		_face3Count = 0;
 		_face4Count = 0;
@@ -168,7 +168,10 @@ THREE.Projector = function() {
 				faces = geometry.faces;
 				faceVertexUvs = geometry.faceVertexUvs;
 
-				normalMatrix = object.matrixRotationWorld.extractRotation( modelMatrix );
+				rotationMatrix = object.matrixRotationWorld.extractRotation( modelMatrix );
+
+				flipSided = object.material.flipSided;
+				doubleSided = object.material.doubleSided;
 
 				for ( v = 0, vl = vertices.length; v < vl; v ++ ) {
 
@@ -187,6 +190,7 @@ THREE.Projector = function() {
 
 				}
 
+
 				for ( f = 0, fl = faces.length; f < fl; f ++ ) {
 
 					face = faces[ f ];
@@ -202,7 +206,7 @@ THREE.Projector = function() {
 							visible = ( ( v3.positionScreen.x - v1.positionScreen.x ) * ( v2.positionScreen.y - v1.positionScreen.y ) -
 								( v3.positionScreen.y - v1.positionScreen.y ) * ( v2.positionScreen.x - v1.positionScreen.x ) ) < 0;
 
-							if ( object.doubleSided === true || visible !== object.flipSided ) {
+							if ( doubleSided === true || visible !== flipSided ) {
 
 								_face = getNextFace3InPool();
 
@@ -237,7 +241,7 @@ THREE.Projector = function() {
 								( v2.positionScreen.y - v3.positionScreen.y ) * ( v4.positionScreen.x - v3.positionScreen.x ) < 0;
 
 
-							if ( object.doubleSided === true || visible !== object.flipSided ) {
+							if ( doubleSided === true || visible !== flipSided ) {
 
 								_face = getNextFace4InPool();
 
@@ -261,8 +265,9 @@ THREE.Projector = function() {
 					}
 
 					_face.normalWorld.copy( face.normal );
-					if ( visible === false && ( object.flipSided === true || object.doubleSided === true ) ) _face.normalWorld.negate();
-					normalMatrix.multiplyVector3( _face.normalWorld );
+
+					if ( visible === false && ( flipSided === true || doubleSided === true ) ) _face.normalWorld.negate();
+					rotationMatrix.multiplyVector3( _face.normalWorld );
 
 					_face.centroidWorld.copy( face.centroid );
 					modelMatrix.multiplyVector3( _face.centroidWorld );
@@ -277,9 +282,9 @@ THREE.Projector = function() {
 						normal = _face.vertexNormalsWorld[ n ];
 						normal.copy( faceVertexNormals[ n ] );
 
-						if ( visible === false && ( object.flipSided === true || object.doubleSided === true ) ) normal.negate();
+						if ( visible === false && ( flipSided === true || doubleSided === true ) ) normal.negate();
 
-						normalMatrix.multiplyVector3( normal );
+						rotationMatrix.multiplyVector3( normal );
 
 					}
 

src/materials/MeshFaceMaterial.js

@@ -2,4 +2,8 @@
  * @author mr.doob / http://mrdoob.com/
  */
 
-THREE.MeshFaceMaterial = function () {};
+THREE.MeshFaceMaterial = function ( parameters ) {
+
+	THREE.Material.call( this, parameters );
+
+};