* Added `PointLight`

* `CanvasRenderer` and `SVGRenderer` basic lighting support (`*ColorStroke`/`*ColorFill` only)
* `Renderer` > `Projector`. `CanvasRenderer`, `SVGRenderer` and `DOMRenderer` do not extend anymore
* Interactivity base code (hdi folder). To be refactored... ([mindlapse](http://github.com/mindlapse))
* Added `computeCentroids` method to `Geometry`
* Included `Stats.js` directly in the `/examples` folder to avoid the need of internet for playing around

README.md

@@ -101,13 +101,14 @@ For creating a customised version of the library, including the source files in
 	<script type="text/javascript" src="js/three/core/UV.js"></script>
 	<script type="text/javascript" src="js/three/core/Geometry.js"></script>
 	<script type="text/javascript" src="js/three/cameras/Camera.js"></script>
-	<script type="text/javascript" src="js/three/objects/Object3D.js"></script>
-	<script type="text/javascript" src="js/three/objects/Line.js"></script>
-	<script type="text/javascript" src="js/three/objects/Mesh.js"></script>
-	<script type="text/javascript" src="js/three/objects/Particle.js"></script>
 	<script type="text/javascript" src="js/three/lights/Light.js"></script>
 	<script type="text/javascript" src="js/three/lights/AmbientLight.js"></script>
 	<script type="text/javascript" src="js/three/lights/DirectionalLight.js"></script>
+	<script type="text/javascript" src="js/three/lights/PointLight.js"></script>
+	<script type="text/javascript" src="js/three/objects/Object3D.js"></script>
+	<script type="text/javascript" src="js/three/objects/Particle.js"></script>
+	<script type="text/javascript" src="js/three/objects/Line.js"></script>
+	<script type="text/javascript" src="js/three/objects/Mesh.js"></script>
 	<script type="text/javascript" src="js/three/materials/LineColorMaterial.js"></script>
 	<script type="text/javascript" src="js/three/materials/MeshBitmapUVMappingMaterial.js"></script>
 	<script type="text/javascript" src="js/three/materials/MeshColorFillMaterial.js"></script>
@@ -117,7 +118,7 @@ For creating a customised version of the library, including the source files in
 	<script type="text/javascript" src="js/three/materials/ParticleBitmapMaterial.js"></script>
 	<script type="text/javascript" src="js/three/materials/ParticleCircleMaterial.js"></script>
 	<script type="text/javascript" src="js/three/scenes/Scene.js"></script>
-	<script type="text/javascript" src="js/three/renderers/Renderer.js"></script>
+	<script type="text/javascript" src="js/three/renderers/Projector.js"></script>
 	<script type="text/javascript" src="js/three/renderers/CanvasRenderer.js"></script>
 	<script type="text/javascript" src="js/three/renderers/SVGRenderer.js"></script>
 	<script type="text/javascript" src="js/three/renderers/WebGLRenderer.js"></script>
@@ -136,6 +137,15 @@ Thanks to the power of the internets (and github <3) these people have kindly he
 
 ### Change Log ###
 
+2010 10 06 - **r18** (44.420 kb)
+
+* Added `PointLight`
+* `CanvasRenderer` and `SVGRenderer` basic lighting support (ColorStroke/ColorFill only)
+* `Renderer` > `Projector`. `CanvasRenderer`, `SVGRenderer` and `DOMRenderer` do not extend anymore
+* Interactivity base code (hdi folder). To be refactored... ([mindlapse](http://github.com/mindlapse))
+* Added `computeCentroids` method to `Geometry`
+
+
 2010 09 17 - **r17** (39.487 kb)
 
 * Added `Light`, `AmbientLight` and `DirectionalLight` ([philogb](http://github.com/philogb))

examples/camera_free.html

@@ -30,6 +30,10 @@
 		<script type="text/javascript" src="../src/core/UV.js"></script>
 		<script type="text/javascript" src="../src/core/Geometry.js"></script>
 		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
 		<script type="text/javascript" src="../src/objects/Object3D.js"></script>
 		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
 		<script type="text/javascript" src="../src/objects/Particle.js"></script>
@@ -43,7 +47,7 @@
 		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/ParticleBitmapMaterial.js"></script>
 		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
-		<script type="text/javascript" src="../src/renderers/Renderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
 		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
@@ -54,10 +58,10 @@
 
 		<script type="text/javascript" src="cameras/FreeCamera.js"></script>
 
-		<script type="text/javascript" src="geometry/primitives/Cube.js"></script>
+		<script type="text/javascript" src="geometry/primitives/Sphere.js"></script>
 		<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
@@ -99,6 +103,7 @@
 			var debugContext;
 
 			init();
+			loop();
 			setInterval(loop, 1000/60);
 
 			function init() {
@@ -113,18 +118,21 @@
 
 				scene = new THREE.Scene();
 
-				// Cube
+				// Plane
 
-				geometry = new Cube(200, 200, 200);
+				plane = new THREE.Mesh( new Plane( 1000, 1000, 10, 10 ), new THREE.MeshColorStrokeMaterial( 0x000000, 0.5, 1 ) );
+				plane.rotation.x = - 90 * ( Math.PI / 180 );
+				plane.doubleSided = true;
+				scene.add( plane );
 
-				for (var i = 0; i < geometry.faces.length; i++) {
+				// Spheres
 
-					geometry.faces[i].color.setRGBA( Math.random() * 0.5, Math.random() * 0.5 + 0.5, Math.random() * 0.5 + 0.5, 1 );
-				}
+				geometry = new Sphere( 100, 16, 8 );
 
 				for (var i = 0; i < 10; i ++ ) {
 
-					cube = new THREE.Mesh(geometry, new THREE.MeshFaceColorFillMaterial() );
+					cube = new THREE.Mesh(geometry, new THREE.MeshColorFillMaterial( 0xffffff ) );
+					cube.overdraw = true;
 
 					cube.position.x = Math.random() * 1000 - 500;
 					cube.position.y = Math.random() * 1000 - 500;
@@ -140,16 +148,26 @@
 
 				}
 
-				// Plane
+				// Lights
 
-				plane = new THREE.Mesh( new Plane( 1000, 1000, 10, 10 ), new THREE.MeshColorStrokeMaterial( 0x000000, 0.5, 1 ) );
-				plane.rotation.x = -90 * (Math.PI / 180);
-				scene.add(plane);
+
+				var ambientLight = new THREE.AmbientLight( Math.random() * 0x202020 );
+				scene.addLight( ambientLight );
+
+				var directionalLight = new THREE.DirectionalLight( Math.random() * 0xffffff );
+				directionalLight.position.x = Math.random() - 0.5;
+				directionalLight.position.y = Math.random() - 0.5;
+				directionalLight.position.z = Math.random() - 0.5;
+				directionalLight.position.normalize();
+				scene.addLight( directionalLight );
+
+				var pointLight = new THREE.PointLight( 0xff0000, 1 );
+				scene.addLight( pointLight );
 
 				renderer = new THREE.CanvasRenderer();
-				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
+				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
-				container.appendChild(renderer.domElement);
+				container.appendChild( renderer.domElement );
 
 				var debugCanvas = document.createElement( 'canvas' );
 				debugCanvas.width = 512;
@@ -169,8 +187,8 @@
 				stats.domElement.style.top = '0px';
 				container.appendChild(stats.domElement);
 
-				document.addEventListener('keydown', onDocumentKeyDown, false);
-				document.addEventListener('keyup', onDocumentKeyUp, false);
+				document.addEventListener( 'keydown', onDocumentKeyDown, false );
+				document.addEventListener( 'keyup', onDocumentKeyUp, false );
 			}
 
 			function onDocumentKeyDown( event ) {
@@ -251,9 +269,12 @@
 				debugContext.rect( camera.target.position.x * 0.1 - 5, camera.target.position.z * 0.1 - 5, 10, 10 );
 				debugContext.rect( - 50, - 50, 100, 100 );
 
-				for ( var i = 0; i < scene.objects.length; i++ ) {
+				for ( var i = 1; i < scene.objects.length; i++ ) {
 
 					var object = scene.objects[i];
+					object.rotation.x += 0.01;
+					object.rotation.y += 0.005;
+					object.position.y = Math.sin( object.rotation.x ) * 200;
 
 					debugContext.rect( object.position.x * 0.1 - 5, object.position.z * 0.1 - 5, 10, 10 );
 

examples/geometry/Qrcode.js

@@ -1431,6 +1431,7 @@ var Qrcode = function () {
 	f4(20,21,363,362,0xffc0c0c0);
 	f4(19,20,362,361,0xffc0c0c0);
 
+	this.computeCentroids();
 	this.computeNormals();
 
 	function v( x, y, z ) {

examples/geometry/primitives/ClickCube.js

@@ -38,6 +38,7 @@ var ClickCube = function (width, height, depth, onSelect) {
 		scope.faces.push(f);
 	}
 
+	this.computeCentroids();
 	this.computeNormals();
 
 };

examples/geometry/primitives/Cube.js

@@ -37,6 +37,7 @@ var Cube = function (width, height, depth) {
 		scope.faces.push( new THREE.Face4( a, b, c, d ) );
 	}
 
+	this.computeCentroids();
 	this.computeNormals();
 
 }

examples/geometry/primitives/Cylinder.js

@@ -65,6 +65,7 @@ var Cylinder = function (numSegs, topRad, botRad, height, topOffset, botOffset)
 		}
 	}
 
+	this.computeCentroids();
 	this.computeNormals();
 
 	function v(x, y, z) {

examples/geometry/primitives/Plane.js

@@ -52,6 +52,7 @@ var Plane = function ( width, height, segments_width, segments_height ) {
 
 	}
 
+	this.computeCentroids();
 	this.computeNormals();
 
 }

examples/geometry/primitives/Sphere.js

@@ -86,6 +86,9 @@ var Sphere = function ( radius, segments_width, segments_height ) {
 			}
 		}
 	}
+
+	this.computeCentroids();
+	this.computeNormals();
 }
 
 Sphere.prototype = new THREE.Geometry();

examples/geometry_birds.html

@@ -26,7 +26,7 @@
 		<div id="container"></div>
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - birds demo</div>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 		<script type="text/javascript" src="geometry/Bird.js"></script>

examples/geometry_cube.html

@@ -20,7 +20,7 @@
 		<script type="text/javascript" src="geometry/primitives/Cube.js"></script>
 		<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
@@ -79,27 +79,27 @@
 
 				cube = new THREE.Mesh(geometry, new THREE.MeshFaceColorFillMaterial() );
 				cube.position.y = 150;
-				scene.addObject(cube);
+				scene.addObject( cube );
 
 				// Plane
 
-				plane = new THREE.Mesh( new Plane( 200, 200, 4, 4 ), new THREE.MeshColorFillMaterial( 0xe0e0e0 ) );
+				plane = new THREE.Mesh( new Plane( 200, 200 ), new THREE.MeshColorFillMaterial( 0xe0e0e0 ) );
 				plane.rotation.x = -90 * ( Math.PI / 180 );
-				scene.addObject(plane);
+				scene.addObject( plane );
 
 				renderer = new THREE.CanvasRenderer();
-				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
+				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
-				container.appendChild(renderer.domElement);
+				container.appendChild( renderer.domElement );
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
+				container.appendChild( stats.domElement );
 
-				document.addEventListener('mousedown', onDocumentMouseDown, false);
-				document.addEventListener('touchstart', onDocumentTouchStart, false);
-				document.addEventListener('touchmove', onDocumentTouchMove, false);
+				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
+				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
+				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
 			}
 
 			//
@@ -108,9 +108,9 @@
 
 				event.preventDefault();
 
-				document.addEventListener('mousemove', onDocumentMouseMove, false);
-				document.addEventListener('mouseup', onDocumentMouseUp, false);
-				document.addEventListener('mouseout', onDocumentMouseOut, false);
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.addEventListener( 'mouseup', onDocumentMouseUp, false );
+				document.addEventListener( 'mouseout', onDocumentMouseOut, false );
 
 				mouseXOnMouseDown = event.clientX - windowHalfX;
 				targetRotationOnMouseDown = targetRotation;
@@ -120,30 +120,30 @@
 
 				mouseX = event.clientX - windowHalfX;
 
-				targetRotation = targetRotationOnMouseDown + (mouseX - mouseXOnMouseDown) * 0.02;
+				targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.02;
 			}
 
 			function onDocumentMouseUp( event ) {
 
-				document.removeEventListener('mousemove', onDocumentMouseMove, false);
-				document.removeEventListener('mouseup', onDocumentMouseUp, false);
-				document.removeEventListener('mouseout', onDocumentMouseOut, false);
+				document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
+				document.removeEventListener( 'mouseout', onDocumentMouseOut, false );
 			}
 
 			function onDocumentMouseOut( event ) {
 
-				document.removeEventListener('mousemove', onDocumentMouseMove, false);
-				document.removeEventListener('mouseup', onDocumentMouseUp, false);
-				document.removeEventListener('mouseout', onDocumentMouseOut, false);
+				document.removeEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.removeEventListener( 'mouseup', onDocumentMouseUp, false );
+				document.removeEventListener( 'mouseout', onDocumentMouseOut, false );
 			}
 
 			function onDocumentTouchStart( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
-					mouseXOnMouseDown = event.touches[0].pageX - windowHalfX;
+					mouseXOnMouseDown = event.touches[ 0 ].pageX - windowHalfX;
 					targetRotationOnMouseDown = targetRotation;
 
 				}
@@ -151,12 +151,12 @@
 
 			function onDocumentTouchMove( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
-					mouseX = event.touches[0].pageX - windowHalfX;
-					targetRotation = targetRotationOnMouseDown + (mouseX - mouseXOnMouseDown) * 0.05;
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					targetRotation = targetRotationOnMouseDown + ( mouseX - mouseXOnMouseDown ) * 0.05;
 
 				}
 			}
@@ -165,7 +165,7 @@
 
 			function loop() {
 
-				plane.rotation.z = cube.rotation.y += (targetRotation - cube.rotation.y) * 0.05;
+				plane.rotation.z = cube.rotation.y += ( targetRotation - cube.rotation.y ) * 0.05;
 
 				renderer.render(scene, camera);
 				stats.update();

examples/geometry_earth.html

@@ -33,7 +33,7 @@
 		<div id="container"></div> 
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - earth demo</div>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 

examples/geometry_terrain.html

@@ -33,7 +33,7 @@
 		<div id="container"><br /><br /><br /><br /><br />Generating...</div> 
 		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - terrain demo. <a href="geometry_terrain.html">generate another</a></div> 
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 

examples/hci_clickcube.html

@@ -16,50 +16,50 @@
 	<body>
 
 
-<script type="text/javascript" src="../src/Three.js"></script>
-<script type="text/javascript" src="../src/core/Color.js"></script>
-<script type="text/javascript" src="../src/core/Vector2.js"></script>
-<script type="text/javascript" src="../src/core/Vector3.js"></script>
-<script type="text/javascript" src="../src/core/Vector4.js"></script>
-<script type="text/javascript" src="../src/core/Rectangle.js"></script>
-<script type="text/javascript" src="../src/core/Matrix4.js"></script>
-<script type="text/javascript" src="../src/core/Vertex.js"></script>
-<script type="text/javascript" src="../src/core/Face3.js"></script>
-<script type="text/javascript" src="../src/core/Face4.js"></script>
-<script type="text/javascript" src="../src/core/UV.js"></script>
-<script type="text/javascript" src="../src/core/Geometry.js"></script>
-<script type="text/javascript" src="../src/cameras/Camera.js"></script>
-<script type="text/javascript" src="../src/objects/Object3D.js"></script>
-<script type="text/javascript" src="../src/objects/Line.js"></script>
-<script type="text/javascript" src="../src/objects/Mesh.js"></script>
-<script type="text/javascript" src="../src/objects/Particle.js"></script>
-<script type="text/javascript" src="../src/lights/Light.js"></script>
-<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
-<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
-<script type="text/javascript" src="../src/materials/LineColorMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/MeshBitmapUVMappingMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/MeshColorFillMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/MeshColorStrokeMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/MeshFaceColorFillMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/MeshFaceColorStrokeMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/ParticleBitmapMaterial.js"></script>
-<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
-<script type="text/javascript" src="../src/scenes/Scene.js"></script>
-<script type="text/javascript" src="../src/renderers/Renderer.js"></script>
-<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
-<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
-<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
-<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
-<script type="text/javascript" src="../src/renderers/renderables/RenderableFace4.js"></script>
-<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
-<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
-<script type="text/javascript" src="../src/hci/ClickResolver.js"></script>
-<script type="text/javascript" src="../src/hci/SelectableFace3.js"></script>
-<script type="text/javascript" src="../src/hci/SelectableFace4.js"></script>
-<script type="text/javascript" src="geometry/primitives/ClickCube.js"></script>
-<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
-
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="../src/Three.js"></script>
+		<script type="text/javascript" src="../src/core/Color.js"></script>
+		<script type="text/javascript" src="../src/core/Vector2.js"></script>
+		<script type="text/javascript" src="../src/core/Vector3.js"></script>
+		<script type="text/javascript" src="../src/core/Vector4.js"></script>
+		<script type="text/javascript" src="../src/core/Rectangle.js"></script>
+		<script type="text/javascript" src="../src/core/Matrix4.js"></script>
+		<script type="text/javascript" src="../src/core/Vertex.js"></script>
+		<script type="text/javascript" src="../src/core/Face3.js"></script>
+		<script type="text/javascript" src="../src/core/Face4.js"></script>
+		<script type="text/javascript" src="../src/core/UV.js"></script>
+		<script type="text/javascript" src="../src/core/Geometry.js"></script>
+		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/objects/Object3D.js"></script>
+		<script type="text/javascript" src="../src/objects/Line.js"></script>
+		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
+		<script type="text/javascript" src="../src/objects/Particle.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/materials/LineColorMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshBitmapUVMappingMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshColorFillMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshColorStrokeMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceColorFillMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/MeshFaceColorStrokeMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleBitmapMaterial.js"></script>
+		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
+		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
+		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace3.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableFace4.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableParticle.js"></script>
+		<script type="text/javascript" src="../src/renderers/renderables/RenderableLine.js"></script>
+		<script type="text/javascript" src="../src/hci/ClickResolver.js"></script>
+		<script type="text/javascript" src="../src/hci/SelectableFace3.js"></script>
+		<script type="text/javascript" src="../src/hci/SelectableFace4.js"></script>
+		<script type="text/javascript" src="geometry/primitives/ClickCube.js"></script>
+		<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
+
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 

examples/materials_video.html

@@ -15,7 +15,7 @@
 	</head>
 	<body>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 		<script type="text/javascript" src="../build/Three.js"></script>
 
 		<script type="text/javascript" src="geometry/primitives/Plane.js"></script>

examples/particles_floor.html

@@ -19,7 +19,7 @@
 	<body>
 
 		<script type="text/javascript" src="../build/Three.js"></script>
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 

examples/particles_random.html

@@ -20,7 +20,7 @@
 
 		<script type="text/javascript" src="../build/Three.js"></script>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
@@ -44,7 +44,7 @@
 
 
 			init();
-			setInterval(loop, 1000 / 60);
+			setInterval( loop, 1000 / 60 );
 
 			function init() {
 
@@ -66,48 +66,48 @@
 					particle.position.y = Math.random() * 2000 - 1000;
 					particle.position.z = Math.random() * 2000 - 1000;
 					particle.scale.x = particle.scale.y = Math.random() * 10 + 5;
-					scene.add(particle);
+					scene.add( particle );
 				}
 
-				container.appendChild(renderer.domElement);
+				container.appendChild( renderer.domElement );
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
+				container.appendChild( stats.domElement );
 
-				document.addEventListener('mousemove', onDocumentMouseMove, false);
-				document.addEventListener('touchstart', onDocumentTouchStart, false);
-				document.addEventListener('touchmove', onDocumentTouchMove, false);
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
+				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
 			}
 
 			//
 
-			function onDocumentMouseMove(event) {
+			function onDocumentMouseMove( event ) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
 			}
 
-			function onDocumentTouchStart(event) {
+			function onDocumentTouchStart( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
-					mouseX = event.touches[0].pageX - windowHalfX;
-					mouseY = event.touches[0].pageY - windowHalfY;
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
 				}
 			}
 
-			function onDocumentTouchMove(event) {
+			function onDocumentTouchMove( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
-					mouseX = event.touches[0].pageX - windowHalfX;
-					mouseY = event.touches[0].pageY - windowHalfY;
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
 				}
 			}
 
@@ -115,10 +115,10 @@
 
 			function loop() {
 
-				camera.position.x += (mouseX - camera.position.x) * .05;
-				camera.position.y += (-mouseY - camera.position.y) * .05;
+				camera.position.x += ( mouseX - camera.position.x ) * 0.05;
+				camera.position.y += ( - mouseY - camera.position.y ) * 0.05;
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
 				stats.update();
 			}

examples/particles_waves.html

@@ -18,7 +18,7 @@
 	</head>
 	<body>
 		<script type="text/javascript" src="../build/Three.js"></script>
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
@@ -50,8 +50,8 @@
 
 			function init() {
 
-				container = document.createElement('div');
-				document.body.appendChild(container);
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
 
 				camera = new THREE.Camera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 10000 );
 				camera.position.z = 1000;
@@ -59,67 +59,67 @@
 				scene = new THREE.Scene();
 
 				renderer = new THREE.CanvasRenderer();
-				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
+				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
 				particles = new Array();
 
 				var i = 0;
-				var material = new THREE.ParticleCircleMaterial(0xffffff, 1);
+				var material = new THREE.ParticleCircleMaterial( 0xffffff, 1 );
 
-				for (var ix = 0; ix < AMOUNTX; ix++) {
+				for ( var ix = 0; ix < AMOUNTX; ix ++ ) {
 
-					for(var iy = 0; iy < AMOUNTY; iy++) {
+					for ( var iy = 0; iy < AMOUNTY; iy ++ ) {
 
-						particle = particles[i++] = new THREE.Particle( material );
-						particle.position.x = ix * SEPARATION - ((AMOUNTX * SEPARATION) / 2);
-						particle.position.z = iy * SEPARATION - ((AMOUNTY * SEPARATION) / 2);
+						particle = particles[ i ++ ] = new THREE.Particle( material );
+						particle.position.x = ix * SEPARATION - ( ( AMOUNTX * SEPARATION ) / 2 );
+						particle.position.z = iy * SEPARATION - ( ( AMOUNTY * SEPARATION ) / 2 );
 						scene.add( particle );
 					}
 				}
 
 				count = 0;
 
-				container.appendChild(renderer.domElement);
+				container.appendChild( renderer.domElement );
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
-				container.appendChild(stats.domElement);
+				container.appendChild( stats.domElement );
 
-				document.addEventListener('mousemove', onDocumentMouseMove, false);
-				document.addEventListener('touchstart', onDocumentTouchStart, false);
-				document.addEventListener('touchmove', onDocumentTouchMove, false);
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
+				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
 			}
 
 			//
 
-			function onDocumentMouseMove(event) {
+			function onDocumentMouseMove( event ) {
 
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
 
 			}
 
-			function onDocumentTouchStart(event) {
+			function onDocumentTouchStart( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
-					mouseX = event.touches[0].pageX - windowHalfX;
-					mouseY = event.touches[0].pageY - windowHalfY;
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
 
 				}
 			}
 
-			function onDocumentTouchMove(event) {
+			function onDocumentTouchMove( event ) {
 
-				if(event.touches.length == 1) {
+				if ( event.touches.length == 1 ) {
 
 					event.preventDefault();
 
-					mouseX = event.touches[0].pageX - windowHalfX;
-					mouseY = event.touches[0].pageY - windowHalfY;
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
 
 				}
 			}
@@ -128,23 +128,23 @@
 
 			function loop() {
 
-				camera.position.x += (mouseX - camera.position.x) * .05;
-				camera.position.y += (-mouseY - camera.position.y) * .05;
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY - camera.position.y ) * .05;
 
 				var i = 0;
 
-				for (var ix = 0; ix < AMOUNTX; ix++) {
+				for ( var ix = 0; ix < AMOUNTX; ix ++ ) {
 
-					for(var iy = 0; iy < AMOUNTY; iy++) {
+					for ( var iy = 0; iy < AMOUNTY; iy ++ ) {
 
-						particle = particles[i++];
-						particle.position.y = (Math.sin((ix + count) * .3) * 50) + (Math.sin((iy + count) * .5) * 50);
-						particle.scale.x = particle.scale.y = (Math.sin((ix + count) * .3) + 1) * 2 + (Math.sin((iy + count) * .5) + 1) * 2;
+						particle = particles[ i++ ];
+						particle.position.y = ( Math.sin( ( ix + count ) * 0.3 ) * 50 ) + ( Math.sin( ( iy + count ) * 0.5 ) * 50 );
+						particle.scale.x = particle.scale.y = ( Math.sin( ( ix + count ) * 0.3 ) + 1 ) * 2 + ( Math.sin( ( iy + count ) * 0.5 ) + 1 ) * 2;
 
 					}
 				}
 
-				renderer.render(scene, camera);
+				renderer.render( scene, camera );
 
 				stats.update();
 

examples/test.html

@@ -28,13 +28,14 @@
 		<script type="text/javascript" src="../src/core/UV.js"></script>
 		<script type="text/javascript" src="../src/core/Geometry.js"></script>
 		<script type="text/javascript" src="../src/cameras/Camera.js"></script>
+		<script type="text/javascript" src="../src/lights/Light.js"></script>
+		<script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
+		<script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
+		<script type="text/javascript" src="../src/lights/PointLight.js"></script>
 		<script type="text/javascript" src="../src/objects/Object3D.js"></script>
 		<script type="text/javascript" src="../src/objects/Mesh.js"></script>
 		<script type="text/javascript" src="../src/objects/Particle.js"></script>
 		<script type="text/javascript" src="../src/objects/Line.js"></script>
-    <script type="text/javascript" src="../src/lights/Light.js"></script>
-    <script type="text/javascript" src="../src/lights/AmbientLight.js"></script>
-    <script type="text/javascript" src="../src/lights/DirectionalLight.js"></script>
 		<script type="text/javascript" src="../src/materials/LineColorMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshBitmapUVMappingMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/MeshColorFillMaterial.js"></script>
@@ -44,7 +45,7 @@
 		<script type="text/javascript" src="../src/materials/ParticleCircleMaterial.js"></script>
 		<script type="text/javascript" src="../src/materials/ParticleBitmapMaterial.js"></script>
 		<script type="text/javascript" src="../src/scenes/Scene.js"></script>
-		<script type="text/javascript" src="../src/renderers/Renderer.js"></script>
+		<script type="text/javascript" src="../src/renderers/Projector.js"></script>
 		<script type="text/javascript" src="../src/renderers/CanvasRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/SVGRenderer.js"></script>
 		<script type="text/javascript" src="../src/renderers/WebGLRenderer.js"></script>
@@ -58,7 +59,7 @@
 		<script type="text/javascript" src="geometry/primitives/Plane.js"></script>
 		<script type="text/javascript" src="geometry/primitives/Cylinder.js"></script>
 
-		<script type="text/javascript" src="http://github.com/mrdoob/stats.js/raw/master/build/Stats.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
 
 		<script type="text/javascript">
 
@@ -73,7 +74,7 @@
 			var scene;
 			var canvasRenderer, svgRenderer, webglRenderer;
 
-			var mesh;
+			var mesh, qrcode;
 
 			var mouseX = 0;
 			var mouseY = 0;
@@ -103,7 +104,7 @@
 
 				// QRCODE
 
-				mesh = new THREE.Mesh(new Qrcode(), new THREE.MeshFaceColorFillMaterial());
+				qrcode = mesh = new THREE.Mesh(new Qrcode(), new THREE.MeshFaceColorFillMaterial());
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 2;
 				mesh.updateMatrix();
 				scene.add(mesh);
@@ -167,6 +168,8 @@
 					geometry.faces.push( face );
 				}
 
+				geometry.computeNormals();
+
 				mesh = new THREE.Mesh( geometry, new THREE.MeshFaceColorFillMaterial() );
 				mesh.doubleSided = true;
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 2;
@@ -186,12 +189,12 @@
 				}
 
 				// LIGHTS
-				
-				var ambient = new THREE.AmbientLight( new THREE.Color( Math.random() * 0xffffff ) );
-        scene.addLight(ambient);
-				var directional = new THREE.DirectionalLight( new THREE.Color( Math.random() * 0xffffff ), 
-						new THREE.Vector3( 600, 0, 0 ) );
-        scene.addLight(directional);
+
+				var ambient = new THREE.AmbientLight( 0x80ffff );
+				scene.addLight( ambient );
+
+				var directional = new THREE.DirectionalLight( 0xffff00 );
+				scene.addLight( directional );
 
 				canvasRenderer = new THREE.CanvasRenderer();
 				canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
@@ -229,6 +232,11 @@
 				mesh.rotation.y += 0.01;
 				mesh.updateMatrix();
 
+				/*
+				qrcode.rotation.x += 0.01;
+				qrcode.rotation.z += 0.02;
+				*/
+
 				canvasRenderer.render( scene, camera );
 				svgRenderer.render( scene, camera );
 				webglRenderer.render( scene, camera );

src/core/Color.js

@@ -4,29 +4,70 @@
 
 THREE.Color = function ( hex ) {
 
+	/*
+	this.r; this.g; this.b; this.a;
+	this.hex;
+	this.__styleString;
+	*/
+
+	this.autoUpdate = true;
 	this.setHex( hex );
 
 }
 
 THREE.Color.prototype = {
 
+	setRGBA: function ( r, g, b, a ) {
+
+		this.r = r;
+		this.g = g;
+		this.b = b;
+		this.a = a;
+
+		if ( this.autoUpdate ) {
+
+			this.updateHex();
+			this.updateStyleString();
+
+		}
+
+	},
+
 	setHex: function ( hex ) {
 
 		this.hex = hex;
-		this.updateRGBA();
-		this.updateStyleString();
+
+		if ( this.autoUpdate ) {
+
+			this.updateRGBA();
+			this.updateStyleString();
+
+		}
 
 	},
 
-	setRGBA: function ( r, g, b, a ) {
+	copyRGB: function ( color ) {
 
-		this.r = r;
-		this.g = g;
-		this.b = b;
-		this.a = a;
+		this.r = color.r;
+		this.g = color.g;
+		this.b = color.b;
+
+	},
+
+	copyRGBA: function ( color ) {
+
+		this.r = color.r;
+		this.g = color.g;
+		this.b = color.b;
+		this.a = color.a;
+
+	},
+
+	multiplySelfRGB: function ( color ) {
 
-		this.updateHex();
-		this.updateStyleString();
+		this.r *= color.r;
+		this.g *= color.g;
+		this.b *= color.b;
 
 	},
 

src/core/Face3.js

@@ -8,15 +8,23 @@ THREE.Face3 = function ( a, b, c, normal, color ) {
 	this.b = b;
 	this.c = c;
 
+	this.centroid = new THREE.Vector3();
 	this.normal = normal || new THREE.Vector3();
-	this.screen = new THREE.Vector3();
 
-	this.color = color || new THREE.Color( 0x000000 );
+	this.color = color || new THREE.Color( 0xff000000 );
 
 };
 
 THREE.Face3.prototype = {
 
+	// TODO: Dupe? (Geometry/computeCentroid)
+
+	getCenter : function(){
+
+		return this.a.clone().addSelf( this.b ).addSelf( this.c ).divideScalar( 3 );
+
+	},
+
 	toString: function () {
 
 		return 'THREE.Face3 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' )';

src/core/Face4.js

@@ -9,26 +9,27 @@ THREE.Face4 = function ( a, b, c, d, normal, color ) {
 	this.c = c;
 	this.d = d;
 
+	this.centroid = new THREE.Vector3();
 	this.normal = normal || new THREE.Vector3();
-	this.screen = new THREE.Vector3();
 
-	this.color = color || new THREE.Color( 0x000000 );
+	this.color = color || new THREE.Color( 0xff000000 );
 
 };
 
 THREE.Face4.prototype = {
 
-	toString: function () {
+	// TODO: Dupe? (Geometry/computeCentroid)
 
-		return 'THREE.Face4 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' ' + this.d + ' )';
+	getCenter : function(){
+
+		return this.a.clone().addSelf( this.b ).addSelf( this.c ).addSelf( this.d ).divideScalar( 4 );
 
 	},
-	
-	getCenter : function(){
 
-	  return this.a.clone().addSelf(this.b).addSelf(this.c).addSelf(this.d).divideScalar(4);
+	toString: function () {
+
+		return 'THREE.Face4 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' ' + this.d + ' )';
 
 	}
 
-  
 }

src/core/Geometry.js

@@ -13,24 +13,54 @@ THREE.Geometry = function () {
 
 THREE.Geometry.prototype = {
 
+	computeCentroids: function () {
+
+		var f, fl, face;
+
+		for ( f = 0, fl = this.faces.length; f < fl; f++ ) {
+
+			face = this.faces[ f ];
+			face.centroid.set( 0, 0, 0 );
+
+			if ( face instanceof THREE.Face3 ) {
+
+				face.centroid.addSelf( this.vertices[ face.a ].position );
+				face.centroid.addSelf( this.vertices[ face.b ].position );
+				face.centroid.addSelf( this.vertices[ face.c ].position );
+				face.centroid.divideScalar( 3 );
+
+			} else if ( face instanceof THREE.Face4 ) {
+
+				face.centroid.addSelf( this.vertices[ face.a ].position );
+				face.centroid.addSelf( this.vertices[ face.b ].position );
+				face.centroid.addSelf( this.vertices[ face.c ].position );
+				face.centroid.addSelf( this.vertices[ face.d ].position );
+				face.centroid.divideScalar( 4 );
+
+			}
+
+		}
+
+	},
+
 	computeNormals: function () {
 
-		var v, f, vA, vB, vC, cb, ab;
+		var v, vl, vertex, f, fl, face, vA, vB, vC, cb = new THREE.Vector3(), ab = new THREE.Vector3();
 
-		for ( v = 0; v < this.vertices.length; v++ ) {
+		for ( v = 0, vl = this.vertices.length; v < vl; v++ ) {
 
-			this.vertices[ v ].normal.set( 0, 0, 0 );
+			vertex = this.vertices[ v ];
+			vertex.normal.set( 0, 0, 0 );
 
 		}
 
-		for ( f = 0; f < this.faces.length; f++ ) {
+		for ( f = 0, fl = this.faces.length; f < fl; f++ ) {
 
-			vA = this.vertices[ this.faces[ f ].a ];
-			vB = this.vertices[ this.faces[ f ].b ];
-			vC = this.vertices[ this.faces[ f ].c ];
+			face = this.faces[ f ];
 
-			cb = new THREE.Vector3();
-			ab = new THREE.Vector3();
+			vA = this.vertices[ face.a ];
+			vB = this.vertices[ face.b ];
+			vC = this.vertices[ face.c ];
 
 			cb.sub( vC.position, vB.position );
 			ab.sub( vA.position, vB.position );
@@ -42,7 +72,7 @@ THREE.Geometry.prototype = {
 
 			}
 
-			this.faces[ f ].normal = cb;
+			face.normal.copy( cb );
 
 		}
 

src/core/Matrix4.js

@@ -30,6 +30,15 @@ THREE.Matrix4.prototype = {
 
 	},
 
+	copy: function ( m ) {
+
+		this.n11 = m.n11; this.n12 = m.n12; this.n13 = m.n13; this.n14 = m.n14;
+		this.n21 = m.n21; this.n22 = m.n22; this.n23 = m.n23; this.n24 = m.n24;
+		this.n31 = m.n31; this.n32 = m.n32; this.n33 = m.n33; this.n34 = m.n34;
+		this.n41 = m.n41; this.n42 = m.n42; this.n43 = m.n43; this.n44 = m.n44;
+
+	},
+
 	lookAt: function ( eye, center, up ) {
 
 		var x = this._x, y = this._y, z = this._z;
@@ -70,7 +79,7 @@ THREE.Matrix4.prototype = {
 			v.z = v.z / vw;
 
 		}
-		
+
 		return v;
 
 	},
@@ -222,19 +231,19 @@ THREE.Matrix4.prototype = {
 
 	flatten: function() {
 
-	  return [this.n11, this.n21, this.n31, this.n41,
-	      this.n12, this.n22, this.n32, this.n42,
-	      this.n13, this.n23, this.n33, this.n43,
-	      this.n14, this.n24, this.n34, this.n44];
+		return [this.n11, this.n21, this.n31, this.n41,
+			this.n12, this.n22, this.n32, this.n42,
+			this.n13, this.n23, this.n33, this.n43,
+			this.n14, this.n24, this.n34, this.n44];
 
 	},
 
 	toString: function() {
 
-		return "| " + this.n11 + " " + this.n12 + " " + this.n13 + " " + this.n14 + " |\n" +
-		"| " + this.n21 + " " + this.n22 + " " + this.n23 + " " + this.n24 + " |\n" +
-		"| " + this.n31 + " " + this.n32 + " " + this.n33 + " " + this.n34 + " |\n" +
-		"| " + this.n41 + " " + this.n42 + " " + this.n43 + " " + this.n44 + " |";
+		return  "| " + this.n11 + " " + this.n12 + " " + this.n13 + " " + this.n14 + " |\n" +
+			"| " + this.n21 + " " + this.n22 + " " + this.n23 + " " + this.n24 + " |\n" +
+			"| " + this.n31 + " " + this.n32 + " " + this.n33 + " " + this.n34 + " |\n" +
+			"| " + this.n41 + " " + this.n42 + " " + this.n43 + " " + this.n44 + " |";
 
 	}
 

src/core/Vector2.js

@@ -16,7 +16,7 @@ THREE.Vector2.prototype = {
 
 		this.x = x;
 		this.y = y;
-		
+
 		return this;
 
 	},
@@ -25,7 +25,7 @@ THREE.Vector2.prototype = {
 
 		this.x = v.x;
 		this.y = v.y;
-		
+
 		return this;
 
 	},
@@ -34,7 +34,7 @@ THREE.Vector2.prototype = {
 
 		this.x += v.x;
 		this.y += v.y;
-		
+
 		return this;
 
 	},
@@ -43,7 +43,7 @@ THREE.Vector2.prototype = {
 
 		this.x = v1.x + v2.x;
 		this.y = v1.y + v2.y;
-		
+
 		return this;
 
 	},
@@ -61,7 +61,7 @@ THREE.Vector2.prototype = {
 
 		this.x = v1.x - v2.x;
 		this.y = v1.y - v2.y;
-		
+
 		return this;
 
 	},
@@ -80,7 +80,7 @@ THREE.Vector2.prototype = {
 		this.multiplyScalar( 1 / this.length() );
 
 		return this;
-		
+
 	},
 
 	length: function () {
@@ -99,7 +99,7 @@ THREE.Vector2.prototype = {
 
 		this.x = - this.x;
 		this.y = - this.y;
-		
+
 		return this;
 
 	},

src/core/Vector3.js

@@ -19,7 +19,7 @@ THREE.Vector3.prototype = {
 		this.x = x;
 		this.y = y;
 		this.z = z;
-		
+
 		return this;
 
 	},
@@ -31,7 +31,7 @@ THREE.Vector3.prototype = {
 		this.z = v.z;
 
 		return this;
-		
+
 	},
 
 	add: function( v1, v2 ) {
@@ -39,7 +39,7 @@ THREE.Vector3.prototype = {
 		this.x = v1.x + v2.x;
 		this.y = v1.y + v2.y;
 		this.z = v1.z + v2.z;
-		
+
 		return this;
 
 	},
@@ -71,7 +71,7 @@ THREE.Vector3.prototype = {
 		this.z = v1.z - v2.z;
 
 		return this;
-		
+
 	},
 
 	subSelf: function ( v ) {
@@ -91,7 +91,7 @@ THREE.Vector3.prototype = {
 		this.z = v1.x * v2.y - v1.y * v2.x;
 
 		return this;
-		
+
 	},
 
 	crossSelf: function ( v ) {
@@ -190,13 +190,13 @@ THREE.Vector3.prototype = {
 		}
 
 		return this;
-		
+
 	},
-	
+
 	setLength: function( len ) {
-		
+
 		return this.normalize().multiplyScalar( len );
-		
+
 	},
 
 	isZero: function () {

src/core/Vertex.js

@@ -5,8 +5,12 @@
 THREE.Vertex = function ( position, normal ) {
 
 	this.position = position || new THREE.Vector3();
+	this.positionWorld = new THREE.Vector3();
+	this.positionScreen = new THREE.Vector3();
+
 	this.normal = normal || new THREE.Vector3();
-	this.screen = new THREE.Vector3();
+	this.normalWorld = new THREE.Vector3();
+	this.normalScreen = new THREE.Vector3();
 
 	this.__visible = true;
 

src/hci/ClickResolver.js

@@ -199,4 +199,4 @@ THREE.ClickResolver.prototype = {
 	}
 
 
-};
+};

src/lights/AmbientLight.js

@@ -1,8 +1,8 @@
-THREE.AmbientLight = function(color) {
-  
-  THREE.Light.call(this, color);
+THREE.AmbientLight = function ( hex ) {
+
+	THREE.Light.call( this, hex );
 
 };
 
 THREE.AmbientLight.prototype = new THREE.Light();
-THREE.AmbientLight.prototype.constructor = THREE.AmbientLight; 
+THREE.AmbientLight.prototype.constructor = THREE.AmbientLight; 

src/lights/DirectionalLight.js

@@ -1,12 +1,11 @@
-THREE.DirectionalLight = function(color, direction) {
-  
-  THREE.Light.call(this, color);
-  
-  this.direction = direction || new Vector3(1, 1, 1);
-  
-  this.direction.normalize();
+THREE.DirectionalLight = function ( hex, intensity ) {
+
+	THREE.Light.call( this, hex );
+
+	this.position = new THREE.Vector3( 0, 1, 0 );
+	this.intensity = intensity || 1;
 
 };
 
 THREE.DirectionalLight.prototype = new THREE.Light();
-THREE.DirectionalLight.prototype.constructor = THREE.DirectionalLight; 
+THREE.DirectionalLight.prototype.constructor = THREE.DirectionalLight; 

src/lights/Light.js

@@ -1,5 +1,5 @@
-THREE.Light = function(color) {
+THREE.Light = function ( hex ) {
 
-  this.color = color;
+	this.color = new THREE.Color( 0xff << 24 | hex );
 
-};
+};

src/lights/PointLight.js

@@ -0,0 +1,11 @@
+THREE.PointLight = function ( hex, intensity ) {
+
+	THREE.Light.call( this, hex );
+
+	this.position = new THREE.Vector3( 0, 0, 0 );
+	this.intensity = intensity || 1;
+
+};
+
+THREE.DirectionalLight.prototype = new THREE.Light();
+THREE.DirectionalLight.prototype.constructor = THREE.PointLight; 

src/objects/Object3D.js

@@ -9,19 +9,27 @@ THREE.Object3D = function ( material ) {
 	this.scale = new THREE.Vector3( 1, 1, 1 );
 
 	this.matrix = new THREE.Matrix4();
+	this.matrixTranslation = new THREE.Matrix4();
+	this.matrixRotation = new THREE.Matrix4();
+	this.matrixScale = new THREE.Matrix4();
+
 	this.screen = new THREE.Vector3();
 
 	this.autoUpdateMatrix = true;
 
 	this.updateMatrix = function () {
 
-		this.matrix.identity();
+		this.matrixPosition = THREE.Matrix4.translationMatrix( this.position.x, this.position.y, this.position.z );
+
+		this.matrixRotation = THREE.Matrix4.rotationXMatrix( this.rotation.x );
+		this.matrixRotation.multiplySelf( THREE.Matrix4.rotationYMatrix( this.rotation.y ) );
+		this.matrixRotation.multiplySelf( THREE.Matrix4.rotationZMatrix( this.rotation.z ) );
+
+		this.matrixScale = THREE.Matrix4.scaleMatrix( this.scale.x, this.scale.y, this.scale.z );
 
-		this.matrix.multiplySelf( THREE.Matrix4.translationMatrix( this.position.x, this.position.y, this.position.z ) );
-		this.matrix.multiplySelf( THREE.Matrix4.rotationXMatrix( this.rotation.x ) );
-		this.matrix.multiplySelf( THREE.Matrix4.rotationYMatrix( this.rotation.y ) );
-		this.matrix.multiplySelf( THREE.Matrix4.rotationZMatrix( this.rotation.z ) );
-		this.matrix.multiplySelf( THREE.Matrix4.scaleMatrix( this.scale.x, this.scale.y, this.scale.z ) );
+		this.matrix.copy( this.matrixPosition );
+		this.matrix.multiplySelf( this.matrixRotation );
+		this.matrix.multiplySelf( this.matrixScale );
 
 	};
 

src/renderers/CanvasRenderer.js

@@ -4,17 +4,23 @@
 
 THREE.CanvasRenderer = function () {
 
-	THREE.Renderer.call( this );
+	var _renderList = null,
+	_projector = new THREE.Projector(),
 
-	var _canvas = document.createElement( 'canvas' ),
+	_canvas = document.createElement( 'canvas' ),
 	_context = _canvas.getContext( '2d' ),
 	_width, _height, _widthHalf, _heightHalf,
 	_clipRect = new THREE.Rectangle(),
 	_clearRect = new THREE.Rectangle(),
 	_bboxRect = new THREE.Rectangle(),
-	_vector2 = new THREE.Vector2(),
 
-	v5 = new THREE.Vector2(), v6 = new THREE.Vector2(),
+	_color = new THREE.Color( 0xffffffff ),
+	_light = new THREE.Color( 0xffffffff ),
+	_ambientLight = new THREE.Color( 0xffffffff ),
+
+	_vector2 = new THREE.Vector2(), // Needed for expand
+	_vector3 = new THREE.Vector3(), // Needed for PointLight
+	v5 = new THREE.Vector2(), v6 = new THREE.Vector2(), // Needed for latter splitting tris to quads
 	uv1 = new THREE.UV(), uv2 = new THREE.UV(), uv3 = new THREE.UV(), uv4 = new THREE.UV();
 
 	this.domElement = _canvas;
@@ -39,14 +45,14 @@ THREE.CanvasRenderer = function () {
 			_clearRect.inflate( 1 );
 			_clearRect.minSelf( _clipRect );
 
-			/*
 			_context.setTransform( 1, 0, 0, - 1, _widthHalf, _heightHalf );
 			_context.clearRect( _clearRect.getX(), _clearRect.getY(), _clearRect.getWidth(), _clearRect.getHeight() );
-			*/
 
+			/*
 			// Opera workaround
 			_context.setTransform( 1, 0, 0, 1, _widthHalf, _heightHalf );
 			_context.clearRect( _clearRect.getX(), - ( _clearRect.getHeight() + _clearRect.getY() ), _clearRect.getWidth(), _clearRect.getHeight() );
+			*/
 
 			_clearRect.empty();
 
@@ -55,19 +61,19 @@ THREE.CanvasRenderer = function () {
 
 	this.render = function ( scene, camera ) {
 
-		var e, el, m, ml, element, material, pi2 = Math.PI * 2,
+		var e, el, element, m, ml, material, pi2 = Math.PI * 2,
 		v1x, v1y, v2x, v2y, v3x, v3y, v4x, v4y, v5x, v5y, v6x, v6y,
 		width, height, scaleX, scaleY, offsetX, offsetY,
 		bitmap, bitmapWidth, bitmapHeight;
 
-		this.project( scene, camera );
-
 		if ( this.autoClear ) {
 
 			this.clear();
 
 		}
 
+		_renderList = _projector.projectScene( scene, camera );
+
 		_context.setTransform( 1, 0, 0, - 1, _widthHalf, _heightHalf );
 
 		/* DEBUG
@@ -75,9 +81,11 @@ THREE.CanvasRenderer = function () {
 		_context.fillRect( _clipRect.getX(), _clipRect.getY(), _clipRect.getWidth(), _clipRect.getHeight() );
 		*/
 
-		for ( e = 0, el = this.renderList.length; e < el; e++ ) {
+		calculateAmbientLight( scene, _ambientLight );
 
-			element = this.renderList[ e ];
+		for ( e = 0, el = _renderList.length; e < el; e++ ) {
+
+			element = _renderList[ e ];
 
 			_bboxRect.empty();
 
@@ -91,6 +99,12 @@ THREE.CanvasRenderer = function () {
 
 					if ( material instanceof THREE.ParticleCircleMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+
+						_color.copyRGBA( material.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						width = element.scale.x * _widthHalf;
 						height = element.scale.y * _heightHalf;
 
@@ -111,7 +125,7 @@ THREE.CanvasRenderer = function () {
 						_context.arc( 0, 0, 1, 0, pi2, true );
 						_context.closePath();
 
-						_context.fillStyle = material.color.__styleString;
+						_context.fillStyle = _color.__styleString;
 						_context.fill();
 
 						_context.restore();
@@ -191,11 +205,17 @@ THREE.CanvasRenderer = function () {
 
 					if ( material instanceof THREE.LineColorMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+
+						_color.copyRGBA( material.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.lineWidth = material.lineWidth;
 						_context.lineJoin = "round";
 						_context.lineCap = "round";
 
-						_context.strokeStyle = material.color.__styleString;
+						_context.strokeStyle = _color.__styleString;
 						_context.stroke();
 
 						_bboxRect.inflate( _context.lineWidth );
@@ -238,6 +258,13 @@ THREE.CanvasRenderer = function () {
 
 					if ( material instanceof THREE.MeshColorFillMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( material.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -245,11 +272,18 @@ THREE.CanvasRenderer = function () {
 						_context.lineTo( v1x, v1y );
 						_context.closePath();
 
-						_context.fillStyle = material.color.__styleString;
+						_context.fillStyle = _color.__styleString;
 						_context.fill();
 
 					} else if ( material instanceof THREE.MeshColorStrokeMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( material.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -261,13 +295,20 @@ THREE.CanvasRenderer = function () {
 						_context.lineJoin = "round";
 						_context.lineCap = "round";
 
-						_context.strokeStyle = material.color.__styleString;
+						_context.strokeStyle = _color.__styleString;
 						_context.stroke();
 
 						_bboxRect.inflate( _context.lineWidth );
 
 					} else if ( material instanceof THREE.MeshFaceColorFillMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( element.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -275,11 +316,18 @@ THREE.CanvasRenderer = function () {
 						_context.lineTo( v1x, v1y );
 						_context.closePath();
 
-						_context.fillStyle = element.color.__styleString;
+						_context.fillStyle = _color.__styleString;
 						_context.fill();
 
 					} else if ( material instanceof THREE.MeshFaceColorStrokeMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( element.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -291,7 +339,7 @@ THREE.CanvasRenderer = function () {
 						_context.lineJoin = "round";
 						_context.lineCap = "round";
 
-						_context.strokeStyle = element.color.__styleString;
+						_context.strokeStyle = _color.__styleString;
 						_context.stroke();
 
 						_bboxRect.inflate( _context.lineWidth );
@@ -385,6 +433,13 @@ THREE.CanvasRenderer = function () {
 
 					if ( material instanceof THREE.MeshColorFillMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( material.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -393,12 +448,19 @@ THREE.CanvasRenderer = function () {
 						_context.lineTo( v1x, v1y );
 						_context.closePath();
 
-						_context.fillStyle = material.color.__styleString;
+						_context.fillStyle = _color.__styleString;
 						_context.fill();
 
 
 					} else if ( material instanceof THREE.MeshColorStrokeMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( material.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -411,13 +473,20 @@ THREE.CanvasRenderer = function () {
 						_context.lineJoin = "round";
 						_context.lineCap = "round";
 
-						_context.strokeStyle = material.color.__styleString;
+						_context.strokeStyle = _color.__styleString;
 						_context.stroke();
 
 						_bboxRect.inflate( _context.lineWidth );
 
 					} else if ( material instanceof THREE.MeshFaceColorFillMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( element.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -426,11 +495,18 @@ THREE.CanvasRenderer = function () {
 						_context.lineTo( v1x, v1y );
 						_context.closePath();
 
-						_context.fillStyle = element.color.__styleString;
+						_context.fillStyle = _color.__styleString;
 						_context.fill();
 
 					} else if ( material instanceof THREE.MeshFaceColorStrokeMaterial ) {
 
+						_light.copyRGB( _ambientLight );
+						addLights( scene, element, _light );
+
+						_color.copyRGBA( element.color );
+						_color.multiplySelfRGB( _light );
+						_color.updateStyleString();
+
 						_context.beginPath();
 						_context.moveTo( v1x, v1y );
 						_context.lineTo( v2x, v2y );
@@ -443,7 +519,7 @@ THREE.CanvasRenderer = function () {
 						_context.lineJoin = "round";
 						_context.lineCap = "round";
 
-						_context.strokeStyle = element.color.__styleString;
+						_context.strokeStyle = _color.__styleString;
 						_context.stroke();
 
 						_bboxRect.inflate( _context.lineWidth );
@@ -513,7 +589,70 @@ THREE.CanvasRenderer = function () {
 
 	};
 
-	function drawTexturedTriangle( bitmap, v1x, v1y, v2x, v2y, v3x, v3y, uv1u, uv1v, uv2u, uv2v, uv3u, uv3v )  {
+	function calculateAmbientLight( scene, color ) {
+
+		var l, ll, light;
+
+		color.setRGBA( 1, 1, 1, 1 );
+
+		for ( l = 0, ll = scene.lights.length; l < ll; l++ ) {
+
+			light = scene.lights[ l ];
+
+			if ( light instanceof THREE.AmbientLight ) {
+
+				color.r *= light.color.r;
+				color.g *= light.color.g;
+				color.b *= light.color.b;
+
+			}
+
+		}
+
+	}
+
+	function addLights( scene, element, color ) {
+
+		var l, ll, light, amount;
+
+		for ( l = 0, ll = scene.lights.length; l < ll; l++ ) {
+
+			light = scene.lights[ l ];
+
+			if ( light instanceof THREE.DirectionalLight ) {
+
+				amount = element.normalWorld.dot( light.position ) * light.intensity;
+
+				if ( amount > 0 ) {
+
+					color.r += light.color.r * amount;
+					color.g += light.color.g * amount;
+					color.b += light.color.b * amount;
+
+				}
+
+			} else if ( light instanceof THREE.PointLight ) {
+
+				_vector3.sub( light.position, element.centroidWorld );
+				_vector3.normalize();
+
+				amount = element.normalWorld.dot( _vector3 ) * light.intensity;
+
+				if ( amount > 0 ) {
+
+					color.r += light.color.r * amount;
+					color.g += light.color.g * amount;
+					color.b += light.color.b * amount;
+
+				}
+
+			}
+
+		}
+
+	}
+
+	function drawTexturedTriangle( bitmap, v1x, v1y, v2x, v2y, v3x, v3y, uv1u, uv1v, uv2u, uv2v, uv3u, uv3v ) {
 
 		// Textured triangle drawing by Thatcher Ulrich.
 		// http://tulrich.com/geekstuff/canvas/jsgl.js
@@ -546,10 +685,13 @@ THREE.CanvasRenderer = function () {
 
 	}
 
+	// Hide anti-alias gaps
+
 	function expand( a, b ) {
 
 		_vector2.sub( b, a );
 		_vector2.unit();
+		_vector2.multiplyScalar( 0.75 );
 
 		b.addSelf( _vector2 );
 		a.subSelf( _vector2 );
@@ -557,6 +699,3 @@ THREE.CanvasRenderer = function () {
 	}
 
 };
-
-THREE.CanvasRenderer.prototype = new THREE.Renderer();
-THREE.CanvasRenderer.prototype.constructor = THREE.CanvasRenderer;

src/renderers/DOMRenderer.js

@@ -6,7 +6,9 @@ THREE.DOMRenderer = function () {
 
 	THREE.Renderer.call( this );
 
-	var _div = document.createElement( 'div' ),
+	var _renderList = null,
+	_projector = new THREE.Projector(),
+	_div = document.createElement( 'div' ),
 	_width, _height, _widthHalf, _heightHalf;
 
 	this.domElement = _div;
@@ -22,11 +24,11 @@ THREE.DOMRenderer = function () {
 
 		var e, el, m, ml, element, material, dom, v1x, v1y;
 
-		this.project( scene, camera );
+		_renderList = _projector.projectScene( scene, camera );
 
-		for ( e = 0, el = this.renderList.length; e < el; e++ ) {
+		for ( e = 0, el = _renderList.length; e < el; e++ ) {
 
-			element = this.renderList[ e ];
+			element = _renderList[ e ];
 
 			if ( element instanceof THREE.RenderableParticle ) {
 
@@ -53,6 +55,3 @@ THREE.DOMRenderer = function () {
 	};
 
 }
-
-THREE.DOMRenderer.prototype = new THREE.Renderer();
-THREE.DOMRenderer.prototype.constructor = THREE.DOMRenderer;

src/renderers/Projector.js

@@ -0,0 +1,236 @@
+/**
+ * @author mr.doob / http://mrdoob.com/
+ * @author supereggbert / http://www.paulbrunt.co.uk/
+ */
+
+THREE.Projector = function() {
+
+	var _renderList = null,
+	_face3, _face3Count, _face3Pool = [],
+	_face4, _face4Count, _face4Pool = [],
+	_line, _lineCount, _linePool = [],
+	_particle, _particleCount, _particlePool = [],
+
+	_vector4 = new THREE.Vector4(),
+	_projScreenMatrix = new THREE.Matrix4(),
+	_projScreenObjectMatrix = new THREE.Matrix4();
+
+	this.projectScene = function ( scene, camera ) {
+
+		var o, ol, v, vl, f, fl, objects, object, objectMatrix,
+		vertices, vertex, vertexPositionScreen, vertex2,
+		faces, face, v1, v2, v3, v4;
+
+		_renderList = [];
+		_face3Count = 0, _face4Count = 0, _lineCount = 0, _particleCount = 0;
+
+		if( camera.autoUpdateMatrix ) {
+
+			camera.updateMatrix();
+
+		}
+
+		_projScreenMatrix.multiply( camera.projectionMatrix, camera.matrix );
+
+		objects = scene.objects;
+
+		for ( o = 0, ol = objects.length; o < ol; o++ ) {
+
+			object = objects[ o ];
+			objectMatrix = object.matrix;
+
+			if( object.autoUpdateMatrix ) {
+
+				object.updateMatrix();
+
+			}
+
+			if ( object instanceof THREE.Mesh ) {
+
+				_projScreenObjectMatrix.multiply( _projScreenMatrix, objectMatrix );
+
+				// vertices
+
+				vertices = object.geometry.vertices;
+
+				for ( v = 0, vl = vertices.length; v < vl; v++ ) {
+
+					vertex = vertices[ v ];
+
+					vertexPositionScreen = vertex.positionScreen;
+					vertexPositionScreen.copy( vertex.position );
+					_projScreenObjectMatrix.transform( vertexPositionScreen );
+
+					vertex.__visible = vertexPositionScreen.z > 0 && vertexPositionScreen.z < 1;
+
+				}
+
+				// faces
+
+				faces = object.geometry.faces;
+
+				for ( f = 0, fl = faces.length; f < fl; f++ ) {
+
+					face = faces[ f ];
+
+					if ( face instanceof THREE.Face3 ) {
+
+						v1 = vertices[ face.a ]; v2 = vertices[ face.b ]; v3 = vertices[ face.c ];
+
+						if ( v1.__visible && v2.__visible && v3.__visible ) {
+
+							if ( ( object.doubleSided || ( object.flipSided !=
+							   ( 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 ) ) ) {
+
+								_face3 = _face3Pool[ _face3Count ] = _face3Pool[ _face3Count ] || new THREE.RenderableFace3();
+								_face3.v1.copy( v1.positionScreen );
+								_face3.v2.copy( v2.positionScreen );
+								_face3.v3.copy( v3.positionScreen );
+
+								_face3.centroidWorld.copy( face.centroid );
+								object.matrix.transform( _face3.centroidWorld );
+
+								_face3.normalWorld.copy( face.normal );
+								object.matrixRotation.transform( _face3.normalWorld );
+
+								_face3.z = Math.max( v1.positionScreen.z, Math.max( v2.positionScreen.z, v3.positionScreen.z ) );
+
+								_face3.material = object.material;
+								_face3.overdraw = object.overdraw;
+								_face3.uvs = object.geometry.uvs[ f ];
+								_face3.color = face.color;
+
+								_renderList.push( _face3 );
+
+								_face3Count ++;
+
+							}
+
+						}
+
+					} else if ( face instanceof THREE.Face4 ) {
+
+						v1 = vertices[ face.a ]; v2 = vertices[ face.b ]; v3 = vertices[ face.c ]; v4 = vertices[ face.d ];
+
+						if ( v1.__visible && v2.__visible && v3.__visible && v4.__visible ) {
+
+							if ( ( object.doubleSided || ( object.flipSided !=
+							   ( ( v4.positionScreen.x - v1.positionScreen.x ) * ( v2.positionScreen.y - v1.positionScreen.y ) -
+							   ( v4.positionScreen.y - v1.positionScreen.y ) * ( v2.positionScreen.x - v1.positionScreen.x ) < 0 ||
+							   ( v2.positionScreen.x - v3.positionScreen.x ) * ( v4.positionScreen.y - v3.positionScreen.y ) -
+							   ( v2.positionScreen.y - v3.positionScreen.y ) * ( v4.positionScreen.x - v3.positionScreen.x ) < 0 ) ) ) ) {
+
+								_face4 = _face4Pool[ _face4Count ] = _face4Pool[ _face4Count ] || new THREE.RenderableFace4();
+								_face4.v1.copy( v1.positionScreen );
+								_face4.v2.copy( v2.positionScreen );
+								_face4.v3.copy( v3.positionScreen );
+								_face4.v4.copy( v4.positionScreen );
+
+								_face4.centroidWorld.copy( face.centroid );
+								object.matrix.transform( _face4.centroidWorld );
+
+								_face4.normalWorld.copy( face.normal );
+								object.matrixRotation.transform( _face4.normalWorld );
+
+								_face4.z = Math.max( v1.positionScreen.z, Math.max( v2.positionScreen.z, Math.max( v3.positionScreen.z, v4.positionScreen.z ) ) );
+
+								_face4.material = object.material;
+								_face4.overdraw = object.overdraw;
+								_face4.uvs = object.geometry.uvs[ f ];
+								_face4.color = face.color;
+
+								_renderList.push( _face4 );
+
+								_face4Count ++;
+
+							}
+
+						}
+
+					}
+
+				}
+
+			} else if ( object instanceof THREE.Line ) {
+
+				_projScreenObjectMatrix.multiply( _projScreenMatrix, objectMatrix );
+
+				vertices = object.geometry.vertices;
+
+				for ( v = 0, vl = vertices.length; v < vl; v++ ) {
+
+					vertex = vertices[ v ];
+
+					vertexPositionScreen = vertex.positionScreen;
+					vertexPositionScreen.copy( vertex.position );
+					_projScreenObjectMatrix.transform( vertexPositionScreen );
+
+					vertex.__visible = vertexPositionScreen.z > 0 && vertexPositionScreen.z < 1;
+
+					if ( v > 0 ) {
+
+						vertex2 = object.geometry.vertices[ v - 1 ];
+
+						if ( vertex.__visible && vertex2.__visible ) {
+
+							_line = _linePool[ _lineCount ] = _linePool[ _lineCount ] || new THREE.RenderableLine();
+							_line.v1.copy( vertex.positionScreen );
+							_line.v2.copy( vertex2.positionScreen );
+							_line.z = Math.max( vertex.positionScreen.z, vertex2.positionScreen.z );
+							_line.material = object.material;
+
+							_renderList.push( _line );
+
+							_lineCount ++;
+
+						}
+					}
+				}
+
+			} else if ( object instanceof THREE.Particle ) {
+
+				_vector4.set( object.position.x, object.position.y, object.position.z, 1 );
+
+				camera.matrix.transform( _vector4 );
+				camera.projectionMatrix.transform( _vector4 );
+
+				object.screen.set( _vector4.x / _vector4.w, _vector4.y / _vector4.w, _vector4.z / _vector4.w );
+
+				if ( object.screen.z > 0 && object.screen.z < 1 ) {
+
+					_particle = _particlePool[ _particleCount ] = _particlePool[ _particleCount ] || new THREE.RenderableParticle();
+					_particle.x = object.screen.x;
+					_particle.y = object.screen.y;
+					_particle.z = object.screen.z;
+
+					_particle.rotation = object.rotation.z;
+
+					_particle.scale.x = object.scale.x * Math.abs( _vector4.x / _vector4.w - ( _vector4.x + camera.projectionMatrix.n11 ) / ( _vector4.w + camera.projectionMatrix.n14 ) );
+					_particle.scale.y = object.scale.y * Math.abs( _vector4.y / _vector4.w - ( _vector4.y + camera.projectionMatrix.n22 ) / ( _vector4.w + camera.projectionMatrix.n24 ) );
+					_particle.material = object.material;
+					_particle.color = object.color;
+
+					_renderList.push( _particle );
+
+					_particleCount ++;
+
+				}
+
+			}
+
+		}
+
+		_renderList.sort( painterSort );
+
+		return _renderList;
+
+	};
+
+	function painterSort( a, b ) {
+
+		return b.z - a.z;
+
+	}
+
+};

src/renderers/Renderer.js

@@ -1,225 +0,0 @@
-/**
- * @author mr.doob / http://mrdoob.com/
- * @author supereggbert / http://www.paulbrunt.co.uk/
- */
-
-THREE.Renderer = function() {
-
-	var face3Pool = [],
-	face4Pool = [],
-	linePool = [],
-	particlePool = [],
-
-	vector4 = new THREE.Vector4(),
-	projViewMatrix = new THREE.Matrix4();
-	projViewObjMatrix = new THREE.Matrix4();
-
-	function painterSort( a, b ) {
-
-		return b.z - a.z;
-
-	}
-
-	this.renderList = null;
-
-	this.project = function (scene, camera) {
-
-		var o, ol, v, vl, f, fl, vertex, vertex2, face, object, v1, v2, v3, v4,
-		face3count = 0, face4count = 0, lineCount = 0, particleCount = 0;
-
-		this.renderList = [];
-
-		if( camera.autoUpdateMatrix ) {
-
-			camera.updateMatrix();
-
-		}
-		
-		projViewMatrix.multiply( camera.projectionMatrix, camera.matrix );
-
-		for ( o = 0, ol = scene.objects.length; o < ol; o++ ) {
-
-			object = scene.objects[ o ];
-
-			if( object.autoUpdateMatrix ) {
-
-				object.updateMatrix();
-
-			}
-
-			if ( object instanceof THREE.Mesh ) {
-
-				projViewObjMatrix.multiply( projViewMatrix, object.matrix );
-
-				// vertices
-
-				for ( v = 0, vl = object.geometry.vertices.length; v < vl; v++ ) {
-
-					vertex = object.geometry.vertices[ v ];
-					vertex.screen.copy( vertex.position );
-
-					projViewObjMatrix.transform( vertex.screen );
-
-					vertex.__visible = vertex.screen.z > 0 && vertex.screen.z < 1;
-
-				}
-
-				// faces
-
-				for ( f = 0, fl = object.geometry.faces.length; f < fl; f++ ) {
-
-					face = object.geometry.faces[ f ];
-
-					if ( face instanceof THREE.Face3 ) {
-
-						v1 = object.geometry.vertices[ face.a ];
-						v2 = object.geometry.vertices[ face.b ];
-						v3 = object.geometry.vertices[ face.c ];
-
-						if ( v1.__visible && v2.__visible && v3.__visible &&
-						   ( object.doubleSided || ( object.flipSided !=
-						   ( v3.screen.x - v1.screen.x ) * ( v2.screen.y - v1.screen.y ) -
-						   ( v3.screen.y - v1.screen.y ) * ( v2.screen.x - v1.screen.x ) < 0 ) ) ) {
-
-							if ( !face3Pool[ face3count ] ) {
-
-								face3Pool[ face3count ] = new THREE.RenderableFace3();
-
-							}
-
-							face3Pool[ face3count ].v1.copy( v1.screen );
-							face3Pool[ face3count ].v2.copy( v2.screen );
-							face3Pool[ face3count ].v3.copy( v3.screen );
-							face3Pool[ face3count ].z = Math.max( v1.screen.z, Math.max( v2.screen.z, v3.screen.z ) );
-
-							face3Pool[ face3count ].material = object.material;
-							face3Pool[ face3count ].overdraw = object.overdraw;
-							face3Pool[ face3count ].uvs = object.geometry.uvs[ f ];
-							face3Pool[ face3count ].color = face.color;
-
-							this.renderList.push(face3Pool[face3count]);
-
-							face3count++;
-						}
-
-					} else if ( face instanceof THREE.Face4 ) {
-
-						v1 = object.geometry.vertices[ face.a ];
-						v2 = object.geometry.vertices[ face.b ];
-						v3 = object.geometry.vertices[ face.c ];
-						v4 = object.geometry.vertices[ face.d ];
-
-						if ( v1.__visible && v2.__visible && v3.__visible && v4.__visible &&
-						   ( object.doubleSided || ( object.flipSided !=
-						   ( ( v4.screen.x - v1.screen.x ) * ( v2.screen.y - v1.screen.y ) -
-						   ( v4.screen.y - v1.screen.y ) * ( v2.screen.x - v1.screen.x ) < 0 ||
-						   ( v2.screen.x - v3.screen.x ) * ( v4.screen.y - v3.screen.y ) -
-						   ( v2.screen.y - v3.screen.y ) * ( v4.screen.x - v3.screen.x ) < 0 ) ) ) ) {
-
-							if ( !face4Pool[ face4count ] ) {
-
-								face4Pool[ face4count ] = new THREE.RenderableFace4();
-
-							}
-
-							face4Pool[ face4count ].v1.copy( v1.screen );
-							face4Pool[ face4count ].v2.copy( v2.screen );
-							face4Pool[ face4count ].v3.copy( v3.screen );
-							face4Pool[ face4count ].v4.copy( v4.screen );
-							face4Pool[ face4count ].z = Math.max( v1.screen.z, Math.max( v2.screen.z, Math.max( v3.screen.z, v4.screen.z ) ) );
-
-							face4Pool[ face4count ].material = object.material;
-							face4Pool[ face4count ].overdraw = object.overdraw;
-							face4Pool[ face4count ].uvs = object.geometry.uvs[ f ];
-							face4Pool[ face4count ].color = face.color;
-
-							this.renderList.push( face4Pool[ face4count ] );
-
-							face4count++;
-						}
-
-					}
-
-				}
-
-			} else if ( object instanceof THREE.Line ) {
-
-				projViewObjMatrix.multiply( projViewMatrix, object.matrix );
-
-				for ( v = 0, vl = object.geometry.vertices.length; v < vl; v++ ) {
-
-					vertex = object.geometry.vertices[ v ];
-					vertex.screen.copy( vertex.position );
-
-					projViewObjMatrix.transform( vertex.screen );
-
-					vertex.__visible = vertex.screen.z > 0 && vertex.screen.z < 1;
-
-					if ( v > 0 ) {
-
-						vertex2 = object.geometry.vertices[ v - 1 ];
-
-						if ( vertex.__visible && vertex2.__visible ) {
-
-							if ( !linePool[ lineCount ] ) {
-
-								linePool[ lineCount ] = new THREE.RenderableLine();
-
-							}
-
-							linePool[ lineCount ].v1.copy( vertex.screen );
-							linePool[ lineCount ].v2.copy( vertex2.screen );
-							linePool[ lineCount ].z = Math.max( vertex.screen.z, vertex2.screen.z );
-							linePool[ lineCount ].material = object.material;
-
-							this.renderList.push( linePool[lineCount] );
-
-							lineCount++;
-
-						}
-					}
-				}
-
-			} else if ( object instanceof THREE.Particle ) {
-
-				vector4.set( object.position.x, object.position.y, object.position.z, 1 );
-
-				camera.matrix.transform( vector4 );
-				camera.projectionMatrix.transform( vector4 );
-
-				object.screen.set( vector4.x / vector4.w, vector4.y / vector4.w, vector4.z / vector4.w );
-
-				if ( object.screen.z > 0 && object.screen.z < 1 ) {
-
-					if ( !particlePool[ particleCount ] ) {
-
-						particlePool[ particleCount ] = new THREE.RenderableParticle();
-
-					}
-
-					particlePool[ particleCount ].x = object.screen.x;
-					particlePool[ particleCount ].y = object.screen.y;
-					particlePool[ particleCount ].z = object.screen.z;
-
-					particlePool[ particleCount ].rotation = object.rotation.z;
-
-					particlePool[ particleCount ].scale.x = object.scale.x * Math.abs( vector4.x / vector4.w - ( vector4.x + camera.projectionMatrix.n11 ) / ( vector4.w + camera.projectionMatrix.n14 ) );
-					particlePool[ particleCount ].scale.y = object.scale.y * Math.abs( vector4.y / vector4.w - ( vector4.y + camera.projectionMatrix.n22 ) / ( vector4.w + camera.projectionMatrix.n24 ) );
-					particlePool[ particleCount ].material = object.material;
-					particlePool[ particleCount ].color = object.color;
-
-					this.renderList.push( particlePool[ particleCount ] );
-
-					particleCount++;
-
-				}
-
-			}
-
-		}
-
-		this.renderList.sort( painterSort );
-
-	};
-
-};

src/renderers/SVGRenderer.js

@@ -4,12 +4,19 @@
 
 THREE.SVGRenderer = function () {
 
-	THREE.Renderer.call( this );
-
-	var _svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'),
+	var _renderList = null,
+	_projector = new THREE.Projector(),
+	_svg = document.createElementNS('http://www.w3.org/2000/svg', 'svg'),
 	_width, _height, _widthHalf, _heightHalf,
 	_clipRect = new THREE.Rectangle(),
 	_bboxRect = new THREE.Rectangle(),
+
+	_color = new THREE.Color( 0xffffffff ),
+	_light = new THREE.Color( 0xffffffff ),
+	_ambientLight = new THREE.Color( 0xffffffff ),
+
+	_vector3 = new THREE.Vector3(), // Needed for PointLight
+
 	_svgPathPool = [], _svgCirclePool = [],
 	_quality = 1;
 
@@ -63,11 +70,13 @@ THREE.SVGRenderer = function () {
 
 		}
 
-		this.project( scene, camera );
+		_renderList = _projector.projectScene( scene, camera );
 
-		for ( e = 0, el = this.renderList.length; e < el; e++ ) {
+		calculateAmbientLight( scene, _ambientLight );
 
-			element = this.renderList[ e ];
+		for ( e = 0, el = _renderList.length; e < el; e++ ) {
+
+			element = _renderList[ e ];
 
 			for ( m = 0, ml = element.material.length; m < ml; m++ ) {
 
@@ -135,23 +144,52 @@ THREE.SVGRenderer = function () {
 
 				}
 
+
 				// TODO: Move out of materials loop
 
 				if ( material instanceof THREE.MeshColorFillMaterial ) {
 
-					svgNode.setAttribute( 'style', 'fill: ' + material.color.__styleString );
+					_light.copyRGB( _ambientLight );
+					addLights( scene, element, _light );
+
+					_color.copyRGBA( material.color );
+					_color.multiplySelfRGB( _light );
+					_color.updateStyleString();
+
+					svgNode.setAttribute( 'style', 'fill: ' + _color.__styleString );
 
 				} else if ( material instanceof THREE.MeshFaceColorFillMaterial ) {
 
-					svgNode.setAttribute( 'style', 'fill: ' + element.color.__styleString );
+					_light.copyRGB( _ambientLight );
+					addLights( scene, element, _light );
+
+					_color.copyRGBA( element.color );
+					_color.multiplySelfRGB( _light );
+					_color.updateStyleString();
+
+					svgNode.setAttribute( 'style', 'fill: ' + _color.__styleString );
 
 				} else if ( material instanceof THREE.MeshColorStrokeMaterial ) {
 
-					svgNode.setAttribute( 'style', 'fill: none; stroke: ' + material.color.__styleString + '; stroke-width: ' + material.lineWidth + '; stroke-linecap: round; stroke-linejoin: round' );
+					_light.copyRGB( _ambientLight );
+					addLights( scene, element, _light );
+
+					_color.copyRGBA( material.color );
+					_color.multiplySelfRGB( _light );
+					_color.updateStyleString();
+
+					svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.lineWidth + '; stroke-linecap: round; stroke-linejoin: round' );
 
 				} else if ( material instanceof THREE.MeshFaceColorStrokeMaterial ) {
 
-					svgNode.setAttribute( 'style', 'fill: none; stroke: ' + element.color.__styleString + '; stroke-width: ' + material.lineWidth + '; stroke-linecap: round; stroke-linejoin: round' );
+					_light.copyRGB( _ambientLight );
+					addLights( scene, element, _light );
+
+					_color.copyRGBA( element.color );
+					_color.multiplySelfRGB( _light );
+					_color.updateStyleString();
+
+					svgNode.setAttribute( 'style', 'fill: none; stroke: ' + _color.__styleString + '; stroke-width: ' + material.lineWidth + '; stroke-linecap: round; stroke-linejoin: round' );
 
 				}
 
@@ -163,6 +201,69 @@ THREE.SVGRenderer = function () {
 
 	};
 
+	function calculateAmbientLight( scene, color ) {
+
+		var l, ll, light;
+
+		color.setRGBA( 1, 1, 1, 1 );
+
+		for ( l = 0, ll = scene.lights.length; l < ll; l++ ) {
+
+			light = scene.lights[ l ];
+
+			if ( light instanceof THREE.AmbientLight ) {
+
+				color.r *= light.color.r;
+				color.g *= light.color.g;
+				color.b *= light.color.b;
+
+			}
+
+		}
+
+	}
+
+	function addLights( scene, element, color ) {
+
+		var l, ll, light, amount;
+
+		for ( l = 0, ll = scene.lights.length; l < ll; l++ ) {
+
+			light = scene.lights[ l ];
+
+			if ( light instanceof THREE.DirectionalLight ) {
+
+				amount = element.normalWorld.dot( light.position ) * light.intensity;
+
+				if ( amount > 0 ) {
+
+					color.r += light.color.r * amount;
+					color.g += light.color.g * amount;
+					color.b += light.color.b * amount;
+
+				}
+
+			} else if ( light instanceof THREE.PointLight ) {
+
+				_vector3.sub( light.position, element.centroidWorld );
+				_vector3.normalize();
+
+				amount = element.normalWorld.dot( _vector3 ) * light.intensity;
+
+				if ( amount > 0 ) {
+
+					color.r += light.color.r * amount;
+					color.g += light.color.g * amount;
+					color.b += light.color.b * amount;
+
+				}
+
+			}
+
+		}
+
+	}
+
 	function getPathNode( id ) {
 
 		if ( _svgPathPool[ id ] == null ) {
@@ -204,6 +305,3 @@ THREE.SVGRenderer = function () {
 	}
 
 };
-
-THREE.SVGRenderer.prototype = new THREE.Renderer();
-THREE.SVGRenderer.prototype.constructor = THREE.CanvasRenderer;

src/renderers/WebGLRenderer.js

@@ -30,7 +30,7 @@ THREE.WebGLRenderer = function () {
 
 	this.render = function ( scene, camera ) {
 
-		var face, faceColor, object, material, normal, lightColor, lightDirection, light,
+		var face, faceColor, object, material, normal, lightColor, lightPosition, light,
 		vertexArray, faceArray, colorArray, normalArray, vertexIndex,
 		o, ol, f, fl, m, ml, i, v1, v2, v3, v4,
 		l, ll;
@@ -56,8 +56,8 @@ THREE.WebGLRenderer = function () {
 			} else if( light instanceof THREE.DirectionalLight ) {
 
 				lightColor = light.color;
-				lightDirection = light.direction;
-				_gl.uniform3f( _program.lightingDirection, lightDirection.x, lightDirection.y, lightDirection.z );
+				lightPosition = light.position;
+				_gl.uniform3f( _program.lightingDirection, lightPosition.x, lightPosition.y, lightPosition.z );
 				_gl.uniform3f( _program.directionalColor, lightColor.r, lightColor.g, lightColor.b );
 
 			}

src/renderers/renderables/RenderableFace3.js

@@ -8,6 +8,9 @@ THREE.RenderableFace3 = function () {
 	this.v2 = new THREE.Vector2();
 	this.v3 = new THREE.Vector2();
 
+	this.centroidWorld = new THREE.Vector3();
+	this.normalWorld = new THREE.Vector3();
+
 	this.z = null;
 
 	this.color = null;

src/renderers/renderables/RenderableFace4.js

@@ -9,6 +9,9 @@ THREE.RenderableFace4 = function () {
 	this.v3 = new THREE.Vector2();
 	this.v4 = new THREE.Vector2();
 
+	this.centroidWorld = new THREE.Vector3();
+	this.normalWorld = new THREE.Vector3();
+
 	this.z = null;
 
 	this.color = null;

utils/Builder.py

@@ -19,13 +19,14 @@ files.append('core/Face4.js')
 files.append('core/UV.js')
 files.append('core/Geometry.js')
 files.append('cameras/Camera.js')
-files.append('objects/Object3D.js')
-files.append('objects/Line.js')
-files.append('objects/Mesh.js')
-files.append('objects/Particle.js')
 files.append('lights/Light.js')
 files.append('lights/AmbientLight.js')
 files.append('lights/DirectionalLight.js')
+files.append('lights/PointLight.js')
+files.append('objects/Object3D.js')
+files.append('objects/Particle.js')
+files.append('objects/Line.js')
+files.append('objects/Mesh.js')
 files.append('materials/LineColorMaterial.js')
 files.append('materials/MeshBitmapUVMappingMaterial.js')
 files.append('materials/MeshColorFillMaterial.js')
@@ -36,7 +37,7 @@ files.append('materials/ParticleBitmapMaterial.js')
 files.append('materials/ParticleCircleMaterial.js')
 files.append('materials/ParticleDOMMaterial.js')
 files.append('scenes/Scene.js')
-files.append('renderers/Renderer.js')
+files.append('renderers/Projector.js')
 files.append('renderers/DOMRenderer.js')
 files.append('renderers/CanvasRenderer.js')
 files.append('renderers/SVGRenderer.js')

utils/BuilderCanvas.py

@@ -19,13 +19,14 @@ files.append('core/Face4.js')
 files.append('core/UV.js')
 files.append('core/Geometry.js')
 files.append('cameras/Camera.js')
-files.append('objects/Object3D.js')
-files.append('objects/Line.js')
-files.append('objects/Mesh.js')
-files.append('objects/Particle.js')
 files.append('lights/Light.js')
 files.append('lights/AmbientLight.js')
 files.append('lights/DirectionalLight.js')
+files.append('lights/PointLight.js')
+files.append('objects/Object3D.js')
+files.append('objects/Particle.js')
+files.append('objects/Line.js')
+files.append('objects/Mesh.js')
 files.append('materials/LineColorMaterial.js')
 files.append('materials/MeshBitmapUVMappingMaterial.js')
 files.append('materials/MeshColorFillMaterial.js')
@@ -35,7 +36,7 @@ files.append('materials/MeshFaceColorStrokeMaterial.js')
 files.append('materials/ParticleBitmapMaterial.js')
 files.append('materials/ParticleCircleMaterial.js')
 files.append('scenes/Scene.js')
-files.append('renderers/Renderer.js')
+files.append('renderers/Projector.js')
 files.append('renderers/CanvasRenderer.js')
 files.append('renderers/renderables/RenderableFace3.js')
 files.append('renderers/renderables/RenderableFace4.js')

utils/BuilderDOM.py

@@ -22,7 +22,7 @@ files.append('objects/Object3D.js')
 files.append('objects/Particle.js')
 files.append('materials/ParticleDOMMaterial.js')
 files.append('scenes/Scene.js')
-files.append('renderers/Renderer.js')
+files.append('renderers/Projector.js')
 files.append('renderers/DOMRenderer.js')
 files.append('renderers/renderables/RenderableParticle.js')
 

utils/BuilderDebug.py

@@ -19,13 +19,14 @@ files.append('core/Face4.js')
 files.append('core/UV.js')
 files.append('core/Geometry.js')
 files.append('cameras/Camera.js')
-files.append('objects/Object3D.js')
-files.append('objects/Line.js')
-files.append('objects/Mesh.js')
-files.append('objects/Particle.js')
 files.append('lights/Light.js')
 files.append('lights/AmbientLight.js')
 files.append('lights/DirectionalLight.js')
+files.append('lights/PointLight.js')
+files.append('objects/Object3D.js')
+files.append('objects/Particle.js')
+files.append('objects/Line.js')
+files.append('objects/Mesh.js')
 files.append('materials/LineColorMaterial.js')
 files.append('materials/MeshBitmapUVMappingMaterial.js')
 files.append('materials/MeshColorFillMaterial.js')
@@ -36,7 +37,7 @@ files.append('materials/ParticleBitmapMaterial.js')
 files.append('materials/ParticleCircleMaterial.js')
 files.append('materials/ParticleDOMMaterial.js')
 files.append('scenes/Scene.js')
-files.append('renderers/Renderer.js')
+files.append('renderers/Projector.js')
 files.append('renderers/DOMRenderer.js')
 files.append('renderers/CanvasRenderer.js')
 files.append('renderers/SVGRenderer.js')

utils/BuilderSVG.py

@@ -19,14 +19,14 @@ files.append('core/Face4.js')
 files.append('core/UV.js')
 files.append('core/Geometry.js')
 files.append('cameras/Camera.js')
-files.append('objects/Object3D.js')
-files.append('objects/Line.js')
-files.append('objects/Mesh.js')
-files.append('objects/Particle.js')
 files.append('lights/Light.js')
 files.append('lights/AmbientLight.js')
 files.append('lights/DirectionalLight.js')
-files.append('materials/LineColorMaterial.js')
+files.append('lights/PointLight.js')
+files.append('objects/Object3D.js')
+files.append('objects/Particle.js')
+files.append('objects/Line.js')
+files.append('objects/Mesh.js')
 files.append('materials/MeshBitmapUVMappingMaterial.js')
 files.append('materials/MeshColorFillMaterial.js')
 files.append('materials/MeshColorStrokeMaterial.js')
@@ -35,7 +35,7 @@ files.append('materials/MeshFaceColorStrokeMaterial.js')
 files.append('materials/ParticleBitmapMaterial.js')
 files.append('materials/ParticleCircleMaterial.js')
 files.append('scenes/Scene.js')
-files.append('renderers/Renderer.js')
+files.append('renderers/Projector.js')
 files.append('renderers/SVGRenderer.js')
 files.append('renderers/renderables/RenderableFace3.js')
 files.append('renderers/renderables/RenderableFace4.js')

utils/BuilderWebGL.py

@@ -19,13 +19,14 @@ files.append('core/Face4.js')
 files.append('core/UV.js')
 files.append('core/Geometry.js')
 files.append('cameras/Camera.js')
-files.append('objects/Object3D.js')
-files.append('objects/Line.js')
-files.append('objects/Mesh.js')
-files.append('objects/Particle.js')
 files.append('lights/Light.js')
 files.append('lights/AmbientLight.js')
 files.append('lights/DirectionalLight.js')
+files.append('lights/PointLight.js')
+files.append('objects/Object3D.js')
+files.append('objects/Particle.js')
+files.append('objects/Line.js')
+files.append('objects/Mesh.js')
 files.append('materials/LineColorMaterial.js')
 files.append('materials/MeshBitmapUVMappingMaterial.js')
 files.append('materials/MeshColorFillMaterial.js')

utils/REVISION

@@ -1 +1 @@
-17
+18