Removed Class.js dependency

Added THREE namespace
Camera.x -> Camera.position.x
Camera.target.x -> Camera.target.position.x
ColorMaterial -> ColorFillMaterial
FaceColorMaterial -> FaceColorFillMaterial
Materials are now multipass (use array)
Added ColorStrokeMaterial and FaceColorStrokeMaterial
geometry.faces.a are now indexes instead of links

README.md

@@ -37,62 +37,83 @@ This code creates a camera, then creates a scene object, adds a bunch of random
 		init();
 		setInterval(loop, 1000 / 60);
 
-		function init()
-		{
-			camera = new Camera(0, 0, 1000);
+		function init() {
+		
+			camera = new THREE.Camera(0, 0, 1000);
 
-			scene = new Scene();
+			scene = new THREE.Scene();
 	
-			renderer = new CanvasRenderer();
+			renderer = new THREE.CanvasRenderer();
 			renderer.setSize(window.innerWidth, window.innerHeight);
 
-			for (var i = 0; i < 1000; i++)
-			{
-				var particle = new Particle( new ColorMaterial(Math.random() * 0x808008 + 0x808080, 1) );
+			for (var i = 0; i < 1000; i++) {
+			
+				var particle = new THREE.Particle( new THREE.ColorMaterial(Math.random() * 0x808008 + 0x808080, 1) );
 				particle.size = Math.random() * 10 + 5;
 				particle.position.x = Math.random() * 2000 - 1000;
 				particle.position.y = Math.random() * 2000 - 1000;
 				particle.position.z = Math.random() * 2000 - 1000;
 				particle.updateMatrix();
 				scene.add( particle );
+				
 			}
 
 			document.body.appendChild(renderer.viewport);
+			
 		}
 
-		function loop()
-		{
+		function loop() {
+		
 			renderer.render(scene, camera);
+			
 		}
 
 	</script>
 
 If you are interested on messing with the actual library, instead of importing the three.js compressed file, you can include the original files in this order:
 
-	<script type="text/javascript" src="src/Class.js"></script>
-	<script type="text/javascript" src="src/core/Color.js"></script>
-	<script type="text/javascript" src="src/core/Vector3.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/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/Mesh.js"></script>
-	<script type="text/javascript" src="src/objects/primitives/Plane.js"></script>
-	<script type="text/javascript" src="src/objects/primitives/Cube.js"></script>
-	<script type="text/javascript" src="src/objects/Particle.js"></script>
-	<script type="text/javascript" src="src/materials/ColorMaterial.js"></script>
-	<script type="text/javascript" src="src/materials/FaceColorMaterial.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="js/three/Three.js"></script>
+	<script type="text/javascript" src="js/three/core/Color.js"></script>
+	<script type="text/javascript" src="js/three/core/Vector2.js"></script>
+	<script type="text/javascript" src="js/three/core/Vector3.js"></script>
+	<script type="text/javascript" src="js/three/core/Vector4.js"></script>		
+	<script type="text/javascript" src="js/three/core/Matrix4.js"></script>
+	<script type="text/javascript" src="js/three/core/Vertex.js"></script>
+	<script type="text/javascript" src="js/three/core/Face3.js"></script>
+	<script type="text/javascript" src="js/three/core/Face4.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/Mesh.js"></script>
+	<script type="text/javascript" src="js/three/objects/Particle.js"></script>
+	<script type="text/javascript" src="js/three/materials/ColorFillMaterial.js"></script>
+	<script type="text/javascript" src="js/three/materials/ColorStrokeMaterial.js"></script>
+	<script type="text/javascript" src="js/three/materials/FaceColorFillMaterial.js"></script>
+	<script type="text/javascript" src="js/three/materials/FaceColorStrokeMaterial.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/CanvasRenderer.js"></script>
+	<script type="text/javascript" src="js/three/renderers/SVGRenderer.js"></script>
+	<script type="text/javascript" src="js/three/renderers/renderables/RenderableFace3.js"></script>
+	<script type="text/javascript" src="js/three/renderers/renderables/RenderableFace4.js"></script>
+	<script type="text/javascript" src="js/three/renderers/renderables/RenderableParticle.js"></script>
 
 	
 ### Change Log ###
 
+2010 05 16 - **r5** (17.979 kb)
+
+* Removed Class.js dependency
+* Added THREE namespace
+* Camera.x -> Camera.position.x
+* Camera.target.x -> Camera.target.position.x
+* ColorMaterial -> ColorFillMaterial
+* FaceColorMaterial -> FaceColorFillMaterial
+* Materials are now multipass (use array)
+* Added ColorStrokeMaterial and FaceColorStrokeMaterial
+* geometry.faces.a are now indexes instead of links 
+
+
 2010 04 26 - **r4** (16.274 kb)
 
 * SVGRenderer Particle rendering

examples/geometry/cube.html

@@ -17,6 +17,10 @@
 	<body>
 
 		<script type="text/javascript" src="../../build/three.js"></script>
+		
+		<script type="text/javascript" src="primitives/Cube.js"></script>
+		<script type="text/javascript" src="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">
@@ -45,8 +49,8 @@
 			init();
 			setInterval(loop, 1000/60);
 
-			function init()
-			{
+			function init() {
+			
 				container = document.createElement('div');
 				document.body.appendChild(container);
 				
@@ -58,36 +62,38 @@
 				info.innerHTML = 'Drag to spin the cube';
 				container.appendChild(info);
 			
-				camera = new Camera(0, 150, 400);
+				camera = new THREE.Camera(0, 150, 400);
 				camera.focus = 300;
-				camera.target.y = 150;
+				camera.target.position.y = 150;
 				camera.updateMatrix();
 
-				scene = new Scene();
+				scene = new THREE.Scene();
 
 				// Cube
 
 				geometry = new Cube(200, 200, 200);
 
-				for (var i = 0; i < geometry.faces.length; i++)
+				for (var i = 0; i < geometry.faces.length; i++) {
+				
 					geometry.faces[i].color.setRGBA( Math.floor( Math.random() * 128), Math.floor( Math.random() * 128 + 128), Math.floor( Math.random() * 128 + 128), 255 );
+				}
 								
-				cube = new Mesh(geometry, new FaceColorMaterial());
+				cube = new THREE.Mesh(geometry, new THREE.FaceColorFillMaterial());
 				cube.position.y = 150;
 				cube.updateMatrix();
 				scene.add(cube);
 				
 				// Plane
 				
-				plane = new Mesh(new Plane(200, 200), new ColorMaterial(0xe0e0e0));
+				plane = new THREE.Mesh(new Plane(200, 200), new THREE.ColorFillMaterial(0xe0e0e0));
 				plane.rotation.x = 90 * (Math.PI / 180);
 				plane.updateMatrix();
 				scene.add(plane);
 				
-				renderer = new CanvasRenderer();
+				renderer = new THREE.CanvasRenderer();
 				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
 
-				container.appendChild(renderer.viewport);
+				container.appendChild(renderer.domElement);
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
@@ -101,8 +107,8 @@
 
 			//
 
-			function onDocumentMouseDown( event )
-			{
+			function onDocumentMouseDown( event ) {
+			
 				event.preventDefault();
 				
 				document.addEventListener('mousemove', onDocumentMouseMove, false);
@@ -113,31 +119,31 @@
 				targetRotationOnMouseDown = targetRotation;
 			}
 
-			function onDocumentMouseMove( event )
-			{
+			function onDocumentMouseMove( event ) {
+			
 				mouseX = event.clientX - windowHalfX;
 				
 				targetRotation = targetRotationOnMouseDown + (mouseX - mouseXOnMouseDown) * 0.02;
 			}
 			
-			function onDocumentMouseUp( event )
-			{
+			function onDocumentMouseUp( event ) {
+			
 				document.removeEventListener('mousemove', onDocumentMouseMove, false);
 				document.removeEventListener('mouseup', onDocumentMouseUp, false);
 				document.removeEventListener('mouseout', onDocumentMouseOut, false);
 			}
 			
-			function onDocumentMouseOut( event )
-			{
+			function onDocumentMouseOut( event ) {
+			
 				document.removeEventListener('mousemove', onDocumentMouseMove, false);
 				document.removeEventListener('mouseup', onDocumentMouseUp, false);
 				document.removeEventListener('mouseout', onDocumentMouseOut, false);
 			}
 			
-			function onDocumentTouchStart( event )
-			{
-				if(event.touches.length == 1)
-				{
+			function onDocumentTouchStart( event ) {
+			
+				if(event.touches.length == 1) {
+				
 					event.preventDefault();
 
 					mouseXOnMouseDown = event.touches[0].pageX - windowHalfX;
@@ -145,10 +151,10 @@
 				}
 			}
 
-			function onDocumentTouchMove( event )
-			{
-				if(event.touches.length == 1)
-				{
+			function onDocumentTouchMove( event ) {
+			
+				if(event.touches.length == 1) {
+				
 					event.preventDefault();
 					
 					mouseX = event.touches[0].pageX - windowHalfX;
@@ -158,8 +164,8 @@
 
 			//
 
-			function loop()
-			{
+			function loop() {
+			
 				cube.rotation.y += (targetRotation - cube.rotation.y) * 0.05;
 				cube.updateMatrix();
 				

examples/geometry/primitives/Cube.js

@@ -0,0 +1,38 @@
+var Cube = function (width, height, depth) {
+
+	THREE.Geometry.call(this);
+	
+	var scope = this,	
+	width_half = width / 2,
+	height_half = height / 2,
+	depth_half = depth / 2;
+	
+	v(  width_half,  height_half, -depth_half );
+	v(  width_half, -height_half, -depth_half );
+	v( -width_half, -height_half, -depth_half );
+	v( -width_half,  height_half, -depth_half );
+	v(  width_half,  height_half,  depth_half );
+	v(  width_half, -height_half,  depth_half );
+	v( -width_half, -height_half,  depth_half );
+	v( -width_half,  height_half,  depth_half );
+	
+	f4( 0, 1, 2, 3 );
+	f4( 4, 7, 6, 5 );
+	f4( 0, 4, 5, 1 );
+	f4( 1, 5, 6, 2 );
+	f4( 2, 6, 7, 3 );
+	f4( 4, 0, 3, 7 );
+	
+	function v(x, y, z) {
+	
+		scope.vertices.push( new THREE.Vertex( new THREE.Vector3( x, y, z ) ) );
+	}
+
+	function f4(a, b, c, d) {
+	
+		scope.faces.push( new THREE.Face4( a, b, c, d ) );
+	}	
+}
+
+Cube.prototype = new THREE.Geometry();
+Cube.prototype.constructor = Cube;

examples/geometry/primitives/Cylinder.js

@@ -0,0 +1,76 @@
+var Cylinder = function (numSegs, topRad, botRad, height, topOffset, botOffset) {
+
+	THREE.Geometry.call(this);
+	
+	var scope = this, i;
+
+	// VERTICES
+
+	// Top circle vertices
+	for (i = 0; i < numSegs; i++) {
+	
+		v( 
+			Math.sin(2 * 3.1415 * i / numSegs)*topRad,
+			Math.cos(2 * 3.1415 * i / numSegs)*topRad,
+			0);
+	}
+
+	// Bottom circle vertices
+	for (i = 0; i < numSegs; i++) {
+	
+		v(  
+			Math.sin(2 * 3.1415 * i / numSegs)*botRad,
+			Math.cos(2 * 3.1415 * i / numSegs)*botRad,
+			height);
+	}
+			
+			
+	// FACES
+	
+	// Body	
+	for (i = 0; i < numSegs; i++) {
+	
+		f4(i, i + numSegs, numSegs + (i + 1) % numSegs, (i + 1) % numSegs, '#ff0000');
+	}
+	
+	// Bottom circle
+	if (botRad != 0) {
+	
+		v(0, 0, -topOffset);
+		
+		for (i = numSegs; i < numSegs + (numSegs / 2); i++) {
+		
+			f4(2 * numSegs,
+			(2 * i - 2 * numSegs) % numSegs,
+			(2 * i - 2 * numSegs + 1) % numSegs,
+			(2 * i - 2 * numSegs + 2) % numSegs);
+		}
+	}
+
+	// Top circle
+	if (topRad != 0) {
+	
+		v(0, 0, height + topOffset);
+		
+		for (i = numSegs + (numSegs / 2); i < 2 * numSegs; i++) {
+		
+			f4(	(2 * i - 2 * numSegs + 2) % numSegs + numSegs,
+				(2 * i - 2 * numSegs + 1) % numSegs + numSegs,
+				(2 * i - 2 * numSegs) % numSegs+numSegs, 
+				2 * numSegs + 1);
+		}
+	}
+	
+	function v(x, y, z) {
+	
+		scope.vertices.push( new THREE.Vertex( new THREE.Vector3( x, y, z ) ) );
+	}
+
+	function f4(a, b, c, d) {
+	
+		scope.faces.push( new THREE.Face4(a, b, c, d) );
+	}	
+}
+
+Cylinder.prototype = new THREE.Geometry();
+Cylinder.prototype.constructor = Cylinder;

examples/geometry/primitives/Plane.js

@@ -0,0 +1,28 @@
+var Plane = function (width, height) {
+
+	THREE.Geometry.call(this);
+
+	var scope = this,
+	width_half = width / 2,
+	height_half = height / 2;
+		
+	v( -width_half,  height_half, 0 );
+	v(  width_half,  height_half, 0 );
+	v(  width_half, -height_half, 0 );
+	v( -width_half, -height_half, 0 );
+		
+	f4( 0, 1, 2, 3 );
+	
+	function v(x, y, z) {
+	
+		scope.vertices.push( new THREE.Vertex( new THREE.Vector3( x, y, z ) ) );
+	}
+
+	function f4(a, b, c, d) {
+	
+		scope.faces.push( new THREE.Face4(a, b, c, d) );
+	}	
+}
+
+Plane.prototype = new THREE.Geometry();
+Plane.prototype.constructor = Plane;

examples/particles/floor.html

@@ -5,14 +5,13 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
-			body
-			{
+			body {
 				background-color: #000000;
 				margin: 0px;
 				overflow: hidden;
 			}
-			a
-			{
+			
+			a {
 				color:#0078ff;
 			}
 		</style>
@@ -20,6 +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">
@@ -54,23 +54,23 @@
 				container = document.createElement('div');
 				document.body.appendChild(container);
 			
-				camera = new Camera(0, 0, 1000);
+				camera = new THREE.Camera(0, 0, 1000);
 				camera.focus = 200;
 
-				scene = new Scene();
+				scene = new THREE.Scene();
 				
-				renderer = new CanvasRenderer();
+				renderer = new THREE.CanvasRenderer();
 				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
 
 				particles = new Array();
 
-				var material = new ColorMaterial(0xffffff, 1);
+				var material = new THREE.ColorFillMaterial(0xffffff, 1);
 
 				for (var ix = 0; ix < AMOUNTX; ix++)
 				{
 					for(var iy = 0; iy < AMOUNTY; iy++)
 					{
-						particle = new Particle( material );
+						particle = new THREE.Particle( material );
 						particle.position.x = ix * SEPARATION - ((AMOUNTX * SEPARATION) / 2);
 						particle.position.z = iy * SEPARATION - ((AMOUNTY * SEPARATION) / 2);
 						particle.updateMatrix();
@@ -78,7 +78,7 @@
 					}
 				}
 
-				container.appendChild(renderer.viewport);
+				container.appendChild(renderer.domElement);
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
@@ -124,8 +124,8 @@
 
 			function loop()
 			{
-				camera.x += (mouseX - camera.x) * .05;
-				camera.y += (-mouseY - camera.y) * .05;
+				camera.position.x += (mouseX - camera.position.x) * .05;
+				camera.position.y += (-mouseY - camera.position.y) * .05;
 				camera.updateMatrix();
 
 				renderer.render(scene, camera);

examples/particles/random.html

@@ -5,20 +5,21 @@
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;"/>
 		<style type="text/css">
-			body
-			{
+			body {
 				background-color: #000000;
 				margin: 0px;
 				overflow: hidden;
 			}
-			a
-			{
+			
+			a {
 				color:#0078ff;
 			}
 		</style>
 	</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">
@@ -41,34 +42,35 @@
 			var windowHalfX = window.innerWidth / 2;
 			var windowHalfY = window.innerHeight / 2;
 
+
 			init();
 			setInterval(loop, 1000 / 60);
 
-			function init()
-			{
+			function init() {
+			
 				container = document.createElement('div');
 				document.body.appendChild(container);				
 			
-				camera = new Camera(0, 0, 1000);
+				camera = new THREE.Camera(0, 0, 1000);
 				camera.focus = 200;
 
-				scene = new Scene();
+				scene = new THREE.Scene();
 				
-				renderer = new CanvasRenderer();
+				renderer = new THREE.CanvasRenderer();
 				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
 
-				for (var i = 0; i < 1000; i++)
-				{
-					particle = new Particle( new ColorMaterial(Math.random() * 0x808008 + 0x808080, 1) );
+				for (var i = 0; i < 1000; i++) {
+				
+					particle = new THREE.Particle(new THREE.ColorFillMaterial(Math.random() * 0x808008 + 0x808080, 1));
 					particle.size = Math.random() * 10 + 5;
 					particle.position.x = Math.random() * 2000 - 1000;
 					particle.position.y = Math.random() * 2000 - 1000;
 					particle.position.z = Math.random() * 2000 - 1000;
 					particle.updateMatrix();
-					scene.add( particle );
+					scene.add(particle);
 				}
 
-				container.appendChild(renderer.viewport);
+				container.appendChild(renderer.domElement);
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
@@ -82,16 +84,16 @@
 
 			//
 
-			function onDocumentMouseMove(event)
-			{
+			function onDocumentMouseMove(event) {
+			
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
 			}
 			
-			function onDocumentTouchStart( event )
-			{
-				if(event.touches.length == 1)
-				{
+			function onDocumentTouchStart(event) {
+			
+				if(event.touches.length == 1) {
+				
 					event.preventDefault();
 
 					mouseX = event.touches[0].pageX - windowHalfX;
@@ -99,10 +101,10 @@
 				}
 			}
 
-			function onDocumentTouchMove( event )
-			{
-				if(event.touches.length == 1)
-				{
+			function onDocumentTouchMove(event) {
+			
+				if(event.touches.length == 1) {
+				
 					event.preventDefault();
 					
 					mouseX = event.touches[0].pageX - windowHalfX;
@@ -112,10 +114,10 @@
 			
 			//
 
-			function loop()
-			{
-				camera.x += (mouseX - camera.x) * .05;
-				camera.y += (-mouseY - camera.y) * .05;
+			function loop() {
+			
+				camera.position.x += (mouseX - camera.position.x) * .05;
+				camera.position.y += (-mouseY - camera.position.y) * .05;
 				camera.updateMatrix();
 
 				renderer.render(scene, camera);

examples/particles/waves.html

@@ -19,6 +19,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">
@@ -49,29 +50,29 @@
 			init();
 			setInterval(loop, 1000 / 60);
 
-			function init()
-			{
+			function init() {
+			
 				container = document.createElement('div');
 				document.body.appendChild(container);				
 			
-				camera = new Camera(0, 0, 1000);
+				camera = new THREE.Camera(0, 0, 1000);
 				camera.focus = 200;
 
-				scene = new Scene();
+				scene = new THREE.Scene();
 				
-				renderer = new CanvasRenderer();
+				renderer = new THREE.CanvasRenderer();
 				renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
 
 				particles = new Array();
 
 				var i = 0;
-				var material = new ColorMaterial(0xffffff, 1);
+				var material = new THREE.ColorFillMaterial(0xffffff, 1);
 
-				for (var ix = 0; ix < AMOUNTX; ix++)
-				{
-					for(var iy = 0; iy < AMOUNTY; iy++)
-					{
-						particle = particles[i++] = new Particle( material );
+				for (var ix = 0; ix < AMOUNTX; ix++) {
+				
+					for(var iy = 0; iy < AMOUNTY; iy++) {
+					
+						particle = particles[i++] = new THREE.Particle( material );
 						particle.size = 1;
 						particle.position.x = ix * SEPARATION - ((AMOUNTX * SEPARATION) / 2);
 						particle.position.z = iy * SEPARATION - ((AMOUNTY * SEPARATION) / 2);
@@ -82,7 +83,7 @@
 
 				count = 0;
 
-				container.appendChild(renderer.viewport);
+				container.appendChild(renderer.domElement);
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
@@ -96,51 +97,55 @@
 
 			//
 
-			function onDocumentMouseMove(event)
-			{
+			function onDocumentMouseMove(event) {
+			
 				mouseX = event.clientX - windowHalfX;
 				mouseY = event.clientY - windowHalfY;
+				
 			}
 			
-			function onDocumentTouchStart( event )
-			{
-				if(event.touches.length == 1)
-				{
+			function onDocumentTouchStart(event) {
+			
+				if(event.touches.length == 1) {
+				
 					event.preventDefault();
 
 					mouseX = event.touches[0].pageX - windowHalfX;
 					mouseY = event.touches[0].pageY - windowHalfY;
+					
 				}
 			}
 
-			function onDocumentTouchMove( event )
-			{
-				if(event.touches.length == 1)
-				{
+			function onDocumentTouchMove(event) {
+			
+				if(event.touches.length == 1) {
+				
 					event.preventDefault();
 					
 					mouseX = event.touches[0].pageX - windowHalfX;
 					mouseY = event.touches[0].pageY - windowHalfY;
+					
 				}
 			}
 			
 			//
 
-			function loop()
-			{
-				camera.x += (mouseX - camera.x) * .05;
-				camera.y += (-mouseY - camera.y) * .05;
+			function loop() {
+			
+				camera.position.x += (mouseX - camera.position.x) * .05;
+				camera.position.y += (-mouseY - camera.position.y) * .05;
 				camera.updateMatrix();
 
 				var i = 0;
 
-				for (var ix = 0; ix < AMOUNTX; ix++)
-				{
-					for(var iy = 0; iy < AMOUNTY; iy++)
-					{
+				for (var ix = 0; ix < AMOUNTX; ix++) {
+				
+					for(var iy = 0; iy < AMOUNTY; iy++) {
+					
 						particle = particles[i++];
 						particle.size = (Math.sin((ix + count) * .3) + 1) * 2 + (Math.sin((iy + count) * .5) + 1) * 2;
 						particle.position.y = (Math.sin((ix + count) * .3) * 50) + (Math.sin((iy + count) * .5) * 50);
+						
 					}
 				}
 

src/Class.js

@@ -1,61 +0,0 @@
-// http://ejohn.org/blog/simple-javascript-inheritance/
-
-// Inspired by base2 and Prototype
-(function(){
-  var initializing = false, fnTest = /xyz/.test(function(){xyz;}) ? /\b_super\b/ : /.*/;
-  // The base Class implementation (does nothing)
-  this.Class = function(){};
-  
-  // Create a new Class that inherits from this class
-  Class.extend = function(prop) {
-    var _super = this.prototype;
-    
-    // Instantiate a base class (but only create the instance,
-    // don't run the init constructor)
-    initializing = true;
-    var prototype = new this();
-    initializing = false;
-    
-    // Copy the properties over onto the new prototype
-    for (var name in prop) {
-      // Check if we're overwriting an existing function
-      prototype[name] = typeof prop[name] == "function" && 
-        typeof _super[name] == "function" && fnTest.test(prop[name]) ?
-        (function(name, fn){
-          return function() {
-            var tmp = this._super;
-            
-            // Add a new ._super() method that is the same method
-            // but on the super-class
-            this._super = _super[name];
-            
-            // The method only need to be bound temporarily, so we
-            // remove it when we're done executing
-            var ret = fn.apply(this, arguments);        
-            this._super = tmp;
-            
-            return ret;
-          };
-        })(name, prop[name]) :
-        prop[name];
-    }
-    
-    // The dummy class constructor
-    function Class() {
-      // All construction is actually done in the init method
-      if ( !initializing && this.init )
-        this.init.apply(this, arguments);
-    }
-    
-    // Populate our constructed prototype object
-    Class.prototype = prototype;
-    
-    // Enforce the constructor to be what we expect
-    Class.constructor = Class;
-
-    // And make this class extendable
-    Class.extend = arguments.callee;
-    
-    return Class;
-  };
-})();

src/Three.js

@@ -0,0 +1 @@
+var THREE = THREE || {}

src/cameras/Camera.js

@@ -1,33 +1,29 @@
-var Camera = Vector3.extend
-({
-	up: null,
-	target: null,
-	zoom: null,
-	focus: null,
-	roll: null,
+THREE.Camera = function (x, y, z) {
+
+	this.position = new THREE.Vector3(x, y, z);
+	this.target = {
+		position: new THREE.Vector3(0, 0, 0)
+	}
+
+	this.matrix = new THREE.Matrix4();
+	this.projectionMatrix = THREE.Matrix4.makePerspective(45, 1 /*SCREEN_WIDTH/SCREEN_HEIGHT*/, 0.001, 1000);
+	
+	this.up = new THREE.Vector3(0, 1, 0);
+	this.roll = 0;
 	
-	matrix: null,
+	// TODO: Need to remove this	
+	this.zoom = 3;
+	this.focus = 500;
 	
-	init: function(x, y, z)
-	{
-		this._super(x, y, z);
-		this.up = new Vector3( 0, 1, 0 );
-		this.target = new Vector3( 0, 0, 0 );
-		this.zoom = 3;
-		this.focus = 500;
-		this.roll = 0;
-		
-		this.matrix = new Matrix4();
-		this.updateMatrix();
-	},
+	this.updateMatrix = function () {
 	
-	updateMatrix: function()
-	{
-		this.matrix.lookAt( this, this.target, this.up );
-	},
+		this.matrix.lookAt(this.position, this.target.position, this.up);
+	}
 
-	toString: function()
-	{
-		return 'Camera ( ' + this.x + ', ' + this.y + ', ' + this.z + ' )';
+	this.toString = function () {
+	
+		return 'THREE.Camera ( ' + this.position + ', ' + this.target.position + ' )';
 	}
-});
+	
+	this.updateMatrix();
+}

src/core/Color.js

@@ -1,55 +1,49 @@
-var Color = Class.extend
-({
-	r: null, g: null, b: null, a: null,
-	hex: null,
+THREE.Color = function (hex) {
+
+	var _r, _g, _b, _a, _hex;
 	
-	styleString: null,
+	this.styleString;
 	
+	this.setHex = function (hex) {
 	
-	init: function( hex )
-	{
-		this.setHex( hex ? hex : 0xff000000 );
-	},
-	
-	setHex: function( hex )
-	{
-		this.hex = hex;
+		_hex = hex;
 		this.updateRGBA();
 		this.updateStyleString();
-	},
-	
-	setRGBA: function( r, g, b, a )
-	{
-		this.r = r;
-		this.g = g;
-		this.b = b;
-		this.a = a;
+	}
+	
+	this.setRGBA = function (r, g, b, a) {
+	
+		_r = r;
+		_g = g;
+		_b = b;
+		_a = a;
 		
 		this.updateHex();
 		this.updateStyleString();
-	},
-	
-	updateHex: function()
-	{
-		this.hex = this.a << 24 | this.r << 16 | this.g << 8 | this.b;
-	},
-	
-	updateRGBA: function()
-	{
-		this.r = this.hex >> 16 & 0xff;
-		this.g = this.hex >> 8 & 0xff;
-		this.b = this.hex & 0xff;
-		this.a = this.hex >> 24 & 0xff;		
-	},
-	
-	updateStyleString: function()
-	{
-		this.styleString = 'rgba(' + this.r + ',' + this.g + ',' + this.b + ',' + (this.a / 255) + ')';		
-	},
-	
-	toString: function()
-	{
-		return 'Color ( r: ' + this.r + ', g: ' + this.g + ', b: ' + this.b + ', a: ' + this.a + ', hex: ' + this.hex + ', style: ' + this.styleString + ' )';	
 	}
 	
-});
+	this.updateHex = function () {
+	
+		_hex = _a << 24 | _r << 16 | _g << 8 | _b;
+	}
+	
+	this.updateRGBA = function () {
+	
+		_r = _hex >> 16 & 0xff;
+		_g = _hex >> 8 & 0xff;
+		_b = _hex & 0xff;
+		_a = _hex >> 24 & 0xff;		
+	}
+	
+	this.updateStyleString = function () {
+	
+		this.styleString = 'rgba(' + _r + ',' + _g + ',' + _b + ',' + (_a / 255) + ')';	
+	}
+	
+	this.toString = function () {
+	
+		return 'THREE.Color ( r: ' + _r + ', g: ' + _g + ', b: ' + _b + ', a: ' + _a + ', hex: ' + _hex + ', style: ' + this.styleString + ' )';	
+	}
+	
+	this.setHex(hex);
+}

src/core/Face3.js

@@ -1,29 +1,17 @@
-var Face3 = Vector3.extend
-({
-	a: null, b: null, c: null,
-	screen: null,
-	uv: null,
-	normal: null,
-	color: null,
+THREE.Face3 = function (a, b, c, uv, normal, color) {
 
-	init: function(a, b, c, uv, normal, color)
-	{
-		this._super((a.x + b.x + c.x) / 3, (a.y + b.y + c.y) / 3, (a.z + b.z + c.z) / 3);	
+	this.a = a;
+	this.b = b;
+	this.c = c;
 	
-		this.a = a;
-		this.b = b;
-		this.c = c;
-
-		this.screen = new Vector3();
-		
-		this.uv = uv ? uv : [ [0, 0], [0, 0], [0, 0] ];
-		this.normal = normal ? normal : new Vector3();
-
-		this.color = color ? color : new Color();
-	},
+	this.normal = normal || new THREE.Vector3();
+	this.screen = new THREE.Vector3();
+	
+	this.uv = uv || [ [0,0], [0,0], [0,0] ];
+	this.color = color || new THREE.Color();
 
-	toString: function()
-	{
-		return 'Face3 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' )';
+	this.toString = function () {
+	
+		return 'THREE.Face3 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' )';
 	}
-});
+}

src/core/Face4.js

@@ -1,26 +1,18 @@
-var Face4 = Vector3.extend
-({
-	a: null, b: null, c: null, d: null,
-	normal: null,
-	screen: null,
-	color: null,
+THREE.Face4 = function (a, b, c, d, uv, normal, color) {
 
-	init: function(a, b, c, d, uv, normal, color)
-	{
-		this._super((a.x + b.x + c.x + d.x) / 4, (a.y + b.y + c.y + d.y) / 4, (a.z + b.z + c.z + d.z) / 4);
+	this.a = a;
+	this.b = b;
+	this.c = c;
+	this.d = d;
 	
-		this.a = a;
-		this.b = b;
-		this.c = c;
-		this.d = d;
-		
-		this.screen = new Vector3();
-
-		this.color = color ? color : new Color();
-	},
+	this.normal = normal || new THREE.Vector3();
+	this.screen = new THREE.Vector3();
+	
+	this.uv = uv || [ [0,0], [0,0], [0,0], [0, 0] ];
+	this.color = color || new THREE.Color();
 
-	toString: function()
-	{
-		return 'Face4 ( ' + this.a + ', ' + this.b + ', ' + this.c + ', ' + this.d + ' )';
+	this.toString = function () {
+	
+		return 'THREE.Face4 ( ' + this.a + ', ' + this.b + ', ' + this.c + ' ' + this.d + ' )';
 	}
-});
+}

src/core/Geometry.js

@@ -1,11 +1,6 @@
-var Geometry = Class.extend
-({
-	vertices: null,
-	faces: null,
+THREE.Geometry = function () {
 
-	init: function()
-	{
-		this.vertices = new Array();
-		this.faces = new Array();
-	}
-});
+	this.vertices = [];
+	this.faces = [];
+
+}

src/core/Matrix3.js

@@ -1,30 +1,25 @@
-var Matrix3 = Class.extend
-({
-	n11: null, n12: null, n13: null,
-	n21: null, n22: null, n23: null,
-	n31: null, n32: null, n33: null,
+THREE.Matrix3 = function () {
 
-	init: function()
-	{
-		this.identity();
-	},
-
-	identity: function()
-	{
+	this.n11 = 1; this.n12 = 0; this.n13 = 0;
+	this.n21 = 0; this.n22 = 1; this.n23 = 0;
+	this.n31 = 0; this.n32 = 0; this.n33 = 1;
+	
+	this.identity = function () {
+	
 		this.n11 = 1; this.n12 = 0; this.n13 = 0;
 		this.n21 = 0; this.n22 = 1; this.n23 = 0;
 		this.n31 = 0; this.n32 = 0; this.n33 = 1;
-	},
+	}
 
-	assign: function(m)
-	{
+	this.assign = function (m) {
+	
 		this.n11 = m.n11; this.n12 = m.n12; this.n13 = m.n13;
 		this.n21 = m.n21; this.n22 = m.n22; this.n23 = m.n23;
 		this.n31 = m.n31; this.n32 = m.n32; this.n33 = m.n33;
-	},
+	}
 
-	multiplySelf: function(m)
-	{
+	this.multiplySelf = function (m) {
+	
 		var n11 = this.n11, n12 = this.n12, n13 = this.n13, n14 = this.n14;
 		var n21 = this.n21, n22 = this.n22, n23 = this.n23, n24 = this.n24;
 		var n31 = this.n31, n32 = this.n32, n33 = this.n33, n34 = this.n34;
@@ -40,10 +35,10 @@ var Matrix3 = Class.extend
 		this.n31 = n31 * m.n11 + n32 * m.n21 + n33 * m.n31;
 		this.n32 = n31 * m.n12 + n32 * m.n22 + n33 * m.n32;
 		this.n33 = n31 * m.n13 + n32 * m.n23 + n33 * m.n33;
-	},
+	}
 
-	inverse: function()
-	{
+	this.inverse = function () {
+	
 		var n11 = this.n11, n12 = this.n12, n13 = this.n13, n14 = this.n14;
 		var n21 = this.n21, n22 = this.n22, n23 = this.n23, n24 = this.n24;
 		var n31 = this.n31, n32 = this.n32, n33 = this.n33, n34 = this.n34;
@@ -51,21 +46,23 @@ var Matrix3 = Class.extend
 		this.n11 = n11; this.n12 = n21; this.n13 = n31;
 		this.n21 = n12; this.n22 = n22; this.n23 = n32;
 		this.n31 = n13; this.n32 = n23; this.n33 = n33;
-	},
+	}
 
-	clone: function()
-	{
-		var m = new Matrix3();
+	this.clone = function () {
+	
+		var m = new THREE.Matrix3();
+		
 		m.n11 = this.n11; m.n12 = this.n12; m.n13 = this.n13;
 		m.n21 = this.n21; m.n22 = this.n22; m.n23 = this.n23;
 		m.n31 = this.n31; m.n32 = this.n32; m.n33 = this.n33;
+		
 		return m;
-	},
+	}
     
-	toString: function()
-	{
+	this.toString = function () {
+	
         	return "| " + this.n11 + " " + this.n12 + " " + this.n13 + " |\n" +
                         "| " + this.n21 + " " + this.n22 + " " + this.n23 + " |\n" +
                         "| " + this.n31 + " " + this.n32 + " " + this.n33 + " |";
-	}
-});
+ 	}
+}

src/core/Matrix4.js

@@ -1,125 +1,160 @@
-var Matrix4 = Class.extend
-({
-	n11: null, n12: null, n13: null, n14: null,
-	n21: null, n22: null, n23: null, n24: null,
-	n31: null, n32: null, n33: null, n34: null,
+THREE.Matrix4 = function () {
 
-	x: null, y: null, z: null,
+	var x, y, z;
 
-	init: function()
-	{
-		this.identity();
-	},
+	x = new THREE.Vector3();
+	y = new THREE.Vector3();
+	z = new THREE.Vector3();
 
-	identity: function()
-	{
+	this.n11 = 1; this.n12 = 0; this.n13 = 0; this.n14 = 0;
+	this.n21 = 0; this.n22 = 1; this.n23 = 0; this.n24 = 0;
+	this.n31 = 0; this.n32 = 0; this.n33 = 1; this.n34 = 0;
+	this.n41 = 0; this.n42 = 0; this.n43 = 0; this.n44 = 1;
+	
+	this.identity = function () {
+	
 		this.n11 = 1; this.n12 = 0; this.n13 = 0; this.n14 = 0;
 		this.n21 = 0; this.n22 = 1; this.n23 = 0; this.n24 = 0;
 		this.n31 = 0; this.n32 = 0; this.n33 = 1; this.n34 = 0;
-		
-		this.x = new Vector3(0,0,0);
-		this.y = new Vector3(0,0,0);
-		this.z = new Vector3(0,0,0);
-	},
+		this.n41 = 0; this.n42 = 0; this.n43 = 0; this.n44 = 1;
+	}
     
-	lookAt: function(eye, center, up)
-	{
-		this.z.sub(center, eye);
-		this.z.normalize();
-
-		this.x.copy(this.z);
-		this.x.cross(up);
-		this.x.normalize();
-
-		this.y.copy(this.x);
-		this.y.cross(this.z);
-		this.y.normalize();
-		this.y.negate(); //
-
-		this.n11 = this.x.x;
-		this.n12 = this.x.y;
-		this.n13 = this.x.z;
-		this.n14 = -this.x.dot(eye);
-		this.n21 = this.y.x;
-		this.n22 = this.y.y;
-		this.n23 = this.y.z;
-		this.n24 = -this.y.dot(eye);
-		this.n31 = this.z.x;
-		this.n32 = this.z.y;
-		this.n33 = this.z.z;
-		this.n34 = -this.z.dot(eye);
-	},
-
-	transform: function(v)
-	{
-        	var vx = v.x, vy = v.y, vz = v.z;
+	this.lookAt = function (eye, center, up) {
+	
+		z.sub(center, eye);
+		z.normalize();
+
+		x.copy(z);
+		x.cross(up);
+		x.normalize();
+
+		y.copy(x);
+		y.cross(z);
+		y.normalize();
+		y.negate(); //
+
+		this.n11 = x.x;
+		this.n12 = x.y;
+		this.n13 = x.z;
+		this.n14 = -x.dot(eye);
+		this.n21 = y.x;
+		this.n22 = y.y;
+		this.n23 = y.z;
+		this.n24 = -y.dot(eye);
+		this.n31 = z.x;
+		this.n32 = z.y;
+		this.n33 = z.z;
+		this.n34 = -z.dot(eye);
+	}
+
+	this.transform = function (v) {
+	
+        	var vx = v.x, vy = v.y, vz = v.z, vw = (v.w ? v.w : 1.0);
         
-		v.x = this.n11 * vx + this.n12 * vy + this.n13 * vz + this.n14;
-		v.y = this.n21 * vx + this.n22 * vy + this.n23 * vz + this.n24;
-		v.z = this.n31 * vx + this.n32 * vy + this.n33 * vz + this.n34;
-	},
-    
+		v.x = this.n11 * vx + this.n12 * vy + this.n13 * vz + this.n14 * vw;
+		v.y = this.n21 * vx + this.n22 * vy + this.n23 * vz + this.n24 * vw;
+		v.z = this.n31 * vx + this.n32 * vy + this.n33 * vz + this.n34 * vw;
+
+		vw = this.n41 * vx + this.n42 * vy + this.n43 * vz + this.n44 * vw;
+
+		if(v.w) {
+		
+			v.w = vw;
+			
+		} else {
+		
+			v.x = v.x / vw;
+			v.y = v.y / vw;
+			v.z = v.z / vw;
+		}
+	}
+	
+	this.crossVector = function (a) {
+	
+		var v = new THREE.Vector4();
+		
+		v.x = this.n11 * a.x + this.n12 * a.y + this.n13 * a.z + this.n14 * a.w;
+		v.y = this.n21 * a.x + this.n22 * a.y + this.n23 * a.z + this.n24 * a.w;
+		v.z = this.n31 * a.x + this.n32 * a.y + this.n33 * a.z + this.n34 * a.w;
+		
+		v.w = (a.w) ? this.n41 * a.x + this.n42 * a.y + this.n43 * a.z + this.n44 * a.w : 1;
+		
+		return v;
+	}
+
+	this.multiply = function (a, b) {
+	
+		this.n11 = a.n11 * b.n11 + a.n12 * b.n21 + a.n13 * b.n31 + a.n14 * b.n41;
+		this.n12 = a.n11 * b.n12 + a.n12 * b.n22 + a.n13 * b.n32 + a.n14 * b.n42;
+		this.n13 = a.n11 * b.n13 + a.n12 * b.n23 + a.n13 * b.n33 + a.n14 * b.n43;
+		this.n14 = a.n11 * b.n14 + a.n12 * b.n24 + a.n13 * b.n34 + a.n14 * b.n44;
+
+		this.n21 = a.n21 * b.n11 + a.n22 * b.n21 + a.n23 * b.n31 + a.n24 * b.n41;
+		this.n22 = a.n21 * b.n12 + a.n22 * b.n22 + a.n23 * b.n32 + a.n24 * b.n42;
+		this.n23 = a.n21 * b.n13 + a.n22 * b.n23 + a.n23 * b.n33 + a.n24 * b.n34;
+		this.n24 = a.n21 * b.n14 + a.n22 * b.n24 + a.n23 * b.n34 + a.n24 * b.n44;
+
+		this.n31 = a.n31 * b.n11 + a.n32 * b.n21 + a.n33 * b.n31 + a.n34 * b.n41;
+		this.n32 = a.n31 * b.n12 + a.n32 * b.n22 + a.n33 * b.n32 + a.n34 * b.n42;
+		this.n33 = a.n31 * b.n13 + a.n32 * b.n23 + a.n33 * b.n33 + a.n34 * b.n43;
+		this.n34 = a.n31 * b.n14 + a.n32 * b.n24 + a.n33 * b.n34 + a.n34 * b.n44;
+
+		this.n41 = a.n41 * b.n11 + a.n42 * b.n21 + a.n43 * b.n31 + a.n44 * b.n41;
+		this.n42 = a.n41 * b.n12 + a.n42 * b.n22 + a.n43 * b.n32 + a.n44 * b.n42;
+		this.n43 = a.n41 * b.n13 + a.n42 * b.n23 + a.n43 * b.n33 + a.n44 * b.n43;
+		this.n44 = a.n41 * b.n14 + a.n42 * b.n24 + a.n43 * b.n34 + a.n44 * b.n44;
+	}
+
+	this.multiplySelf = function (m) {
+	
+		var n11 = this.n11, n12 = this.n12, n13 = this.n13, n14 = this.n14,
+		n21 = this.n21, n22 = this.n22, n23 = this.n23, n24 = this.n24,
+		n31 = this.n31, n32 = this.n32, n33 = this.n33, n34 = this.n34,
+		n41 = this.n41, n42 = this.n42, n43 = this.n43, n44 = this.n44;
+
+		this.n11 = n11 * m.n11 + n12 * m.n21 + n13 * m.n31 + n14 * m.n41;
+		this.n12 = n11 * m.n12 + n12 * m.n22 + n13 * m.n32 + n14 * m.n42;
+		this.n13 = n11 * m.n13 + n12 * m.n23 + n13 * m.n33 + n14 * m.n43;
+		this.n14 = n11 * m.n14 + n12 * m.n24 + n13 * m.n34 + n14 * m.n44;
+
+		this.n21 = n21 * m.n11 + n22 * m.n21 + n23 * m.n31 + n24 * m.n41;
+		this.n22 = n21 * m.n12 + n22 * m.n22 + n23 * m.n32 + n24 * m.n42;
+		this.n23 = n21 * m.n13 + n22 * m.n23 + n23 * m.n33 + n24 * m.n43;
+		this.n24 = n21 * m.n14 + n22 * m.n24 + n23 * m.n34 + n24 * m.n44;
+
+		this.n31 = n31 * m.n11 + n32 * m.n21 + n33 * m.n31 + n34 * m.n41;
+		this.n32 = n31 * m.n12 + n32 * m.n22 + n33 * m.n32 + n34 * m.n42;
+		this.n33 = n31 * m.n13 + n32 * m.n23 + n33 * m.n33 + n34 * m.n43;
+		this.n34 = n31 * m.n14 + n32 * m.n24 + n33 * m.n34 + n34 * m.n44;
+
+		this.n41 = n41 * m.n11 + n42 * m.n21 + n43 * m.n31 + n44 * m.n41;
+		this.n42 = n41 * m.n12 + n42 * m.n22 + n43 * m.n32 + n44 * m.n42;
+		this.n43 = n41 * m.n13 + n42 * m.n23 + n43 * m.n33 + n44 * m.n43;
+		this.n44 = n41 * m.n14 + n42 * m.n24 + n43 * m.n34 + n44 * m.n44;
+	}
 
-	multiply: function(a, b)
-	{
-		this.n11 = a.n11 * b.n11 + a.n12 * b.n21 + a.n13 * b.n31;
-		this.n12 = a.n11 * b.n12 + a.n12 * b.n22 + a.n13 * b.n32;
-		this.n13 = a.n11 * b.n13 + a.n12 * b.n23 + a.n13 * b.n33;
-		this.n14 = a.n11 * b.n14 + a.n12 * b.n24 + a.n13 * b.n34 + a.n14;
-
-		this.n21 = a.n21 * b.n11 + a.n22 * b.n21 + a.n23 * b.n31;
-		this.n22 = a.n21 * b.n12 + a.n22 * b.n22 + a.n23 * b.n32;
-		this.n23 = a.n21 * b.n13 + a.n22 * b.n23 + a.n23 * b.n33;
-		this.n24 = a.n21 * b.n14 + a.n22 * b.n24 + a.n23 * b.n34 + a.n24;
-
-		this.n31 = a.n31 * b.n11 + a.n32 * b.n21 + a.n33 * b.n31;
-		this.n32 = a.n31 * b.n12 + a.n32 * b.n22 + a.n33 * b.n32;
-		this.n33 = a.n31 * b.n13 + a.n32 * b.n23 + a.n33 * b.n33;
-		this.n34 = a.n31 * b.n14 + a.n32 * b.n24 + a.n33 * b.n34 + a.n34;
-	},
-
-	multiplySelf: function(m)
-	{
-		var n11 = this.n11, n12 = this.n12, n13 = this.n13, n14 = this.n14;
-		var n21 = this.n21, n22 = this.n22, n23 = this.n23, n24 = this.n24;
-		var n31 = this.n31, n32 = this.n32, n33 = this.n33, n34 = this.n34;
-
-		this.n11 = n11 * m.n11 + n12 * m.n21 + n13 * m.n31;
-		this.n12 = n11 * m.n12 + n12 * m.n22 + n13 * m.n32;
-		this.n13 = n11 * m.n13 + n12 * m.n23 + n13 * m.n33;
-		this.n14 = n11 * m.n14 + n12 * m.n24 + n13 * m.n34 + n14;
-
-		this.n21 = n21 * m.n11 + n22 * m.n21 + n23 * m.n31;
-		this.n22 = n21 * m.n12 + n22 * m.n22 + n23 * m.n32;
-		this.n23 = n21 * m.n13 + n22 * m.n23 + n23 * m.n33;
-		this.n24 = n21 * m.n14 + n22 * m.n24 + n23 * m.n34 + n24;
-
-		this.n31 = n31 * m.n11 + n32 * m.n21 + n33 * m.n31;
-		this.n32 = n31 * m.n12 + n32 * m.n22 + n33 * m.n32;
-		this.n33 = n31 * m.n13 + n32 * m.n23 + n33 * m.n33;
-		this.n34 = n31 * m.n14 + n32 * m.n24 + n33 * m.n34 + n34;
-	},
-
-	clone: function()
-	{
-		var m = new Matrix4();
+	this.clone = function () {
+	
+		var m = new THREE.Matrix4();
 		m.n11 = this.n11; m.n12 = this.n12; m.n13 = this.n13; m.n14 = this.n14;
 		m.n21 = this.n21; m.n22 = this.n22; m.n23 = this.n23; m.n24 = this.n24;
 		m.n31 = this.n31; m.n32 = this.n32; m.n33 = this.n33; m.n34 = this.n34;
+		m.n41 = this.n41; m.n42 = this.n42; m.n43 = this.n43; m.n44 = this.n44;
 		return m;
-	},
+	}
     
-	toString: function()
-	{
+	this.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 + " |";
+                        "| " + this.n31 + " " + this.n32 + " " + this.n33 + " " + this.n34 + " |\n" +
+                        "| " + this.n41 + " " + this.n42 + " " + this.n43 + " " + this.n44 + " |";
 	}
-});
+}
+
+THREE.Matrix4.translationMatrix = function (x, y, z) {
 
-Matrix4.translationMatrix = function(x, y, z)
-{
-	var m = new Matrix4();
+	var m = new THREE.Matrix4();
 
 	m.n14 = x;
 	m.n24 = y;
@@ -128,9 +163,9 @@ Matrix4.translationMatrix = function(x, y, z)
 	return m;
 }
 
-Matrix4.scaleMatrix = function(x, y, z)
-{
-	var m = new Matrix4();
+THREE.Matrix4.scaleMatrix = function (x, y, z) {
+
+	var m = new THREE.Matrix4();
 
 	m.n11 = x;
 	m.n22 = y;
@@ -139,9 +174,9 @@ Matrix4.scaleMatrix = function(x, y, z)
 	return m;
 }
 
-Matrix4.rotationXMatrix = function(theta)
-{
-	var rot = new Matrix4();
+THREE.Matrix4.rotationXMatrix = function (theta) {
+
+	var rot = new THREE.Matrix4();
 
 	rot.n22 = rot.n33 = Math.cos(theta);
 	rot.n32 = Math.sin(theta);
@@ -150,9 +185,9 @@ Matrix4.rotationXMatrix = function(theta)
 	return rot;
 }
 
-Matrix4.rotationYMatrix = function(theta)
-{
-	var rot = new Matrix4();
+THREE.Matrix4.rotationYMatrix = function (theta) {
+
+	var rot = new THREE.Matrix4();
 
 	rot.n11 = rot.n33 = Math.cos(theta);
 	rot.n13 = Math.sin(theta);
@@ -161,9 +196,9 @@ Matrix4.rotationYMatrix = function(theta)
 	return rot;
 }
 
-Matrix4.rotationZMatrix = function(theta)
-{
-	var rot = new Matrix4();
+THREE.Matrix4.rotationZMatrix = function(theta) {
+
+	var rot = new THREE.Matrix4();
 
 	rot.n11 = rot.n22 = Math.cos(theta);
 	rot.n21 = Math.sin(theta);
@@ -171,3 +206,32 @@ Matrix4.rotationZMatrix = function(theta)
 
 	return rot;
 }
+
+THREE.Matrix4.makeFrustum = function(left,right,bottom,top,near,far) {
+
+	var m = new THREE.Matrix4(),
+
+	x = 2 * near / (right - left),
+	y = 2 * near / (top - bottom),
+	a = (right + left) / (right - left),
+	b = (top + bottom) / (top - bottom),
+	c = -(far + near) / (far - near),
+	d = -2 * far * near / (far - near);
+
+	m.n11 = x; m.n13 = a;
+	m.n22 = y; m.n23 = b;
+	m.n33 = c; m.n34 = d;
+	m.n43 = -1; m.n44 = 0;
+
+	return m;
+}
+
+THREE.Matrix4.makePerspective = function(fovy, aspect, near, far) {
+
+	var ymax = near * Math.tan(fovy * 0.00872664625972),
+	ymin = -ymax,
+	xmin = ymin * aspect,
+	xmax = ymax * aspect;
+	
+	return THREE.Matrix4.makeFrustum(xmin, xmax, ymin, ymax, near, far);
+}

src/core/Vector2.js

@@ -1,100 +1,79 @@
-var Vector2 = Class.extend
-({
-	x: null, y: null,
-	
-	init: function(x, y)
-	{
-		this.x = x ? x : 0;
-		this.y = y ? y : 0;
-	},
-
-	copy: function(v)
-	{
+THREE.Vector2 = function (x, y) {
+	
+	this.x = x || 0;
+	this.y = y || 0;
+	
+	this.copy = function (v) {
+	
 		this.x = v.x;
 		this.y = v.y;
-	},
+	}
+	
+	this.addSelf = function (v) {
 	
-	addSelf: function(v)
-	{
 		this.x += v.x;
 		this.y += v.y;
-	},
+	}
 
-	add: function(v1, v2)
-	{
+	this.add = function (v1, v2) {
+	
 		this.x = v1.x + v2.x;
 		this.y = v1.y + v2.y;
-	},
+	}
+	
+	this.subSelf = function (v) {
 	
-	subSelf: function(v)
-	{
 		this.x -= v.x;
 		this.y -= v.y;
-	},
+	}
 
-	sub: function(v1, v2)
-	{
+	this.sub = function (v1, v2) {
+	
 		this.x = v1.x - v2.x;
 		this.y = v1.y - v2.y;
-	},
+	}
+	
+	this.multiply = function (s) {
 	
-	multiply: function(s)
-	{
 		this.x *= s;
 		this.y *= s;
-	},
+	}
+	
+	this.unit = function () {
 	
-	unit: function()
-	{
 		this.multiply(1 / this.length());
-	},
+	}
+	
+	this.expand = function(v1, v2) {
 	
-	expand: function(v1, v2)
-	{
 		this.unit( this.sub(v2, v1) );
 		v2.addSelf(this);
 		// v1.subSelf(this);
-	},
+	}
 
-	length: function()
-	{
+	this.length = function () {
+	
 		return Math.sqrt(this.x * this.x + this.y * this.y);
-	},
+	}
+	
+	this.lengthSq = function () {
 	
-	lengthSq: function()
-	{
 		return this.x * this.x + this.y * this.y;
-	},
+	}
+	
+	this.negate = function() {
 	
-	negate: function()
-	{
 		this.x = -this.x;
 		this.y = -this.y;
-	},
+	}
 	
-	clone: function()
-	{
-		return new Vector2(this.x, this.y);
-	},	
+	this.clone = function () {
 	
-	toString: function()
-	{
-		return 'Vector2 (' + this.x + ', ' + this.y + ')';
+		return new THREE.Vector2(this.x, this.y);
 	}
 	
-});
-
-Vector2.add = function(a, b)
-{
-	return new Vector2( a.x + b.x, a.y + b.y );
-}
-
-Vector2.sub = function(a, b)
-{
-	return new Vector2( a.x - b.x, a.y - b.y );
-}		
-
-Vector2.multiply = function(a, s)
-{
-	return new Vector2( a.x * s, a.y * s );
+	this.toString = function () {
+	
+		return 'THREE.Vector2 (' + this.x + ', ' + this.y + ')';
+	}
 }

src/core/Vector3.js

@@ -1,159 +1,113 @@
-var Vector3 = Class.extend
-({
-	x: null, y: null, z: null,
-	// sx: null, sy: null, sz: null,
-	// userData: null,
-	
-	dx: null, dy: null, dz: null,
-	tx: null, ty: null, tz: null,
-	// oll: null,
-	
-	init: function(x, y, z)
-	{
-		this.x = x ? x : 0;
-		this.y = y ? y : 0;
-		this.z = z ? z : 0;
-	},
+THREE.Vector3 = function (x, y, z) {
 
-	copy: function(v)
-	{
+	this.x = x || 0;
+	this.y = y || 0;
+	this.z = z || 0;
+
+	this.copy = function (v) {
+	
 		this.x = v.x;
 		this.y = v.y;
 		this.z = v.z;
-	},
+	}
+
+	this.add = function(v1, v2) {
+	
+		this.x = v1.x + v2.x;
+		this.y = v1.y + v2.y;
+		this.z = v1.z + v2.z;	
+	}
+
+	this.addSelf = function (v) {
 	
-	addSelf: function(v)
-	{
 		this.x += v.x;
 		this.y += v.y;
 		this.z += v.z;
-	},
+	}
 
-	add: function(v1, v2)
-	{
-		this.x = v1.x + v2.x;
-		this.y = v1.y + v2.y;
-		this.z = v1.z + v2.z;
-	},
+	this.sub = function(v1, v2) {
+	
+		this.x = v1.x - v2.x;
+		this.y = v1.y - v2.y;
+		this.z = v1.z - v2.z;	
+	}
+	
+	this.subSelf = function (v) {
 	
-	subSelf: function(v)
-	{
 		this.x -= v.x;
 		this.y -= v.y;
 		this.z -= v.z;
-	},
-
-	sub: function(v1, v2)
-	{
-		this.x = v1.x - v2.x;
-		this.y = v1.y - v2.y;
-		this.z = v1.z - v2.z;
-	},
-	
-	cross: function(v)
-	{
-		this.tx = this.x;
-		this.ty = this.y;
-		this.tz = this.z;
+	}
+	
+	this.cross = function (v) {
+	
+		var tx = this.x, ty = this.y, tz = this.z;
 		
-		this.x = this.ty * v.z - this.tz * v.y;
-		this.y = this.tz * v.x - this.tx * v.z;
-		this.z = this.tx * v.y - this.ty * v.x;
-	},
+		this.x = ty * v.z - tz * v.y;
+		this.y = tz * v.x - tx * v.z;
+		this.z = tx * v.y - ty * v.x;
+	}
+	
+	this.multiply = function (s) {
 	
-	multiply: function(s)
-	{
 		this.x *= s;
 		this.y *= s;
 		this.z *= s;
-	},
+	}
 	
-	distanceTo: function(v)
-	{
-		this.dx = this.x - v.x;
-		this.dy = this.y - v.y;
-		this.dz = this.z - v.z;
-		
-		return Math.sqrt(this.dx * this.dx + this.dy * this.dy + this.dz * this.dz);
-	},
-	
-	distanceToSquared: function(v)
-	{
-		this.dx = this.x - v.x;
-		this.dy = this.y - v.y;
-		this.dz = this.z - v.z;
-		
-		return this.dx * this.dx + this.dy * this.dy + this.dz * this.dz;
-	},
+	this.distanceTo = function (v) {
+	
+		var dx = this.x - v.x, dy = this.y - v.y, dz = this.z - v.z;
+		return Math.sqrt(dx * dx + dy * dy + dz * dz);
+	}
+	
+	this.distanceToSquared = function (v) {
+	
+		var dx = this.x - v.x, dy = this.y - v.y, dz = this.z - v.z;
+		return dx * dx + dy * dy + dz * dz;
+	}
+	
+	this.length = function () {
 	
-	length: function()
-	{
 		return Math.sqrt(this.x * this.x + this.y * this.y + this.z * this.z);
-	},
+	}
+	
+	this.lengthSq = function () {
 	
-	lengthSq: function()
-	{
 		return this.x * this.x + this.y * this.y + this.z * this.z;
-	},
+	}
+	
+	this.negate = function () {
 	
-	negate: function()
-	{
 		this.x = -this.x;
 		this.y = -this.y;
 		this.z = -this.z;
-	},
-	
-	normalize: function()
-	{
-		if (this.length() > 0)
-			this.ool = 1.0 / this.length();
-		else
-			this.ool = 0;
+	}
+	
+	this.normalize = function () {
+	
+		if (this.length() > 0) {
+		
+			this.multiply(1 / this.length());
 			
-		this.x *= this.ool;
-		this.y *= this.ool;
-		this.z *= this.ool;
-		return this;
-	},
-	
-	dot: function(v)
-	{
+		} else {
+		
+			this.multiply(0);
+		}
+	}
+	
+	this.dot = function (v) {
+	
 		return this.x * v.x + this.y * v.y + this.z * v.z;
-	},
+	}
 	
-	clone: function()
-	{
-		return new Vector3(this.x, this.y, this.z);
-	},	
+	this.clone = function () {
 	
-	toString: function()
-	{
-		return 'Vector3 (' + this.x + ', ' + this.y + ', ' + this.z + ')';
+		return new Vector3(this.x, this.y, this.z);
 	}
 	
-});
-
-Vector3.add = function(a, b)
-{
-	return new Vector3( a.x + b.x, a.y + b.y, a.z + b.z );
-}
-
-Vector3.sub = function(a, b)
-{
-	return new Vector3( a.x - b.x, a.y - b.y, a.z - b.z );
-}		
-
-Vector3.multiply = function(a, s)
-{
-	return new Vector3( a.x * s, a.y * s, a.z * s );
-}
-
-Vector3.cross = function(a, b)
-{
-	return new Vector3( a.y * b.z - a.z * b.y, a.z * b.x - a.x * b.z, a.x * b.y - a.y * b.x );
-}
-
-Vector3.dot = function(a, b)
-{
-	return a.x * b.x + a.y * b.y + a.z * b.z;
+	this.toString = function () {
+	
+		return 'THREE.Vector3 (' + this.x + ', ' + this.y + ', ' + this.z + ')';
+	}
 }

src/core/Vector4.js

@@ -1,85 +1,62 @@
-var Vector4 = Class.extend
-({
-	x: null, y: null, z: null, w: null,
-	// sx: null, sy: null, sz: null,
-	// userData: null,
+THREE.Vector4 = function (x, y, z, w) {
 
-	dx: null, dy: null, dz: null,
-	tx: null, ty: null, tz: null,
-	// oll: null,
+	this.x = x || 0;
+	this.y = y || 0;
+	this.z = z || 0;
+	this.w = w || 1;
 
-	init: function(x, y, z, w)
-	{
-		this.x = x ? x : 0;
-		this.y = y ? y : 0;
-		this.z = z ? z : 0;
-		this.w = w ? w : 1;
-	},
-
-	copy: function(v)
-	{
+	this.copy = function (v) {
+	
 		this.x = v.x;
 		this.y = v.y;
 		this.z = v.z;
 		this.w = v.w;
-	},
+	}
+
+	this.add = function (v1, v2) {
+	
+		this.x = v1.x + v2.x;
+		this.y = v1.y + v2.y;
+		this.z = v1.z + v2.z;	
+		this.w = v1.w + v2.w;
+	}
 
-	addSelf: function(v)
-	{
+	this.addSelf = function (v) {
+	
 		this.x += v.x;
 		this.y += v.y;
 		this.z += v.z;
 		this.w += v.w;
-	},
-
-	add: function(v1, v2)
-	{
-		this.x = v1.x + v2.x;
-		this.y = v1.y + v2.y;
-		this.z = v1.z + v2.z;
-		this.w = v1.w + v2.w;
-	},
+	}
 
-	subSelf: function(v)
-	{
+	this.sub = function (v1, v2) {
+	
+		this.x = v1.x - v2.x;
+		this.y = v1.y - v2.y;
+		this.z = v1.z - v2.z;	
+		this.w = v1.w - v2.w;
+	}
+	
+	this.subSelf = function (v) {
+	
 		this.x -= v.x;
 		this.y -= v.y;
 		this.z -= v.z;
 		this.w -= v.w;
-	},
-
-	sub: function(v1, v2)
-	{
-		this.x = v1.x - v2.x;
-		this.y = v1.y - v2.y;
-		this.z = v1.z - v2.z;
-		this.w = v1.w - v2.w;
-	},
-
-
-	clone: function()
-	{
-		return new Vector4(this.x, this.y, this.z, this.w);
-	},	
+	}
 
-	toString: function()
-	{
-		return 'Vector4 (' + this.x + ', ' + this.y + ', ' + this.z + ', ' + this.w + ')';
-	},
+	this.clone = function () {
 	
-	toVector3: function()
-	{
-		return new Vector3(this.x/this.w,this.y/this.w,this.z/this.w);
+		return new THREE.Vector4(this.x, this.y, this.z, this.w);
 	}
+	
+	this.toVector3 = function () {
 
-});
+		return new THREE.Vector3(this.x / this.w, this.y / this.w, this.z / this.w);
+	}
 
-Vector4.add = function(a, b)
-{
-	return new Vector3( a.x + b.x, a.y + b.y, a.z + b.z , a.w + b.w );
+	this.toString = function () {
+	
+		return 'THREE.Vector4 (' + this.x + ', ' + this.y + ', ' + this.z + ', ' + this.w + ')';
+	}
 }
-
-Vector4.sub = function(a, b)
-{
-	return new Vector3( a.x - b.x, a.y - b.y, a.z - b.z , a.w - b.w );
-}		

src/core/Vertex.js

@@ -1,18 +1,13 @@
-var Vertex = Vector3.extend
-({
-	u: null, v: null,
-	screen: null,
-	normal : null,
-	visible: null,
+THREE.Vertex = function (position, normal) {
 
-	init: function(x, y, z)
-	{
-		this._super(x, y, z);
-		this.screen = new Vector3();
-	},
+	this.position = position || new THREE.Vector3();
+	this.normal = normal || new THREE.Vector3();
+	this.screen = new THREE.Vector3();
+	
+	this.visible = true; // internal
 
-	toString: function()
-	{
-		return 'Vertex ( ' + this.x + ', ' + this.y + ', ' + this.z + ' )';
+	this.toString = function () {
+	
+		return 'THREE.Vertex ( ' + this.position + ', ' + this.normal + ' )';
 	}
-});
+}

src/materials/ColorFillMaterial.js

@@ -0,0 +1,9 @@
+THREE.ColorFillMaterial = function (hex, opacity) {
+
+	this.color = new THREE.Color( (opacity ? (opacity * 0xff) << 24 : 0xff000000) | hex );
+	
+	this.toString = function () {
+	
+		return 'THREE.ColorFillMaterial ( color: ' + this.color + ' )';	
+	}
+}

src/materials/ColorMaterial.js

@@ -1,9 +0,0 @@
-var ColorMaterial = Class.extend
-({
-	color: null,
-
-	init: function( hex, opacity )
-	{
-		this.color = new Color( (opacity ? (opacity * 0xff) << 24 : 0xff000000) | hex );
-	}
-});

src/materials/ColorStrokeMaterial.js

@@ -0,0 +1,10 @@
+THREE.ColorStrokeMaterial = function (hex, opacity, lineWidth) {
+
+	this.lineWidth = lineWidth || 1;
+	this.color = new THREE.Color( (opacity ? (opacity * 0xff) << 24 : 0xff000000) | hex );
+	
+	this.toString = function () {
+	
+		return 'THREE.ColorStrokeMaterial ( lineWidth: ' + this.lineWidth + ', color: ' + this.color + ' )';
+	}	
+}

src/materials/FaceColorFillMaterial.js

@@ -0,0 +1,8 @@
+THREE.FaceColorFillMaterial = function () {
+
+	this.toString = function () {
+
+		return 'THREE.FaceColorFillMaterial ( )';
+		
+	}
+}

src/materials/FaceColorMaterial.js

@@ -1,3 +0,0 @@
-var FaceColorMaterial = Class.extend
-({
-});

src/materials/FaceColorStrokeMaterial.js

@@ -0,0 +1,10 @@
+THREE.FaceColorStrokeMaterial = function (lineWidth) {
+
+	this.lineWidth = lineWidth || 1;
+	
+	this.toString = function () {
+
+		return 'THREE.FaceColorStrokeMaterial ( lineWidth: ' + this.lineWidth + ' )';
+		
+	}	
+}

src/objects/Line.js

@@ -0,0 +1,10 @@
+THREE.Line = function (geometry, material) {
+
+	THREE.Object3D.call(this, material);
+	
+	this.geometry = geometry;
+
+}
+
+THREE.Line.prototype = new THREE.Object3D();
+THREE.Line.prototype.constructor = THREE.Line;

src/objects/Mesh.js

@@ -1,14 +1,12 @@
-var Mesh = Object3D.extend
-({
-	geometry: null,
-	material: null,
+THREE.Mesh = function (geometry, material) {
+
+	THREE.Object3D.call(this, material);
+	
+	this.geometry = geometry;
 	
-	doubleSide: null,
+	this.doubleSided = false;
+
+}
 
-	init: function( geometry, material )
-	{
-		this._super();
-		this.geometry = geometry;
-		this.material = material;
-	}
-});
+THREE.Mesh.prototype = new THREE.Object3D();
+THREE.Mesh.prototype.constructor = THREE.Mesh;

src/objects/Object3D.js

@@ -1,29 +1,23 @@
-var Object3D = Class.extend
-({
-	position: null,
-	rotation: null,
-	scale: null,
+THREE.Object3D = function (material) {
 
-	matrix: null,
-	screen: null,
+	this.position = new THREE.Vector3(0, 0, 0);
+	this.rotation = new THREE.Vector3(0, 0, 0);
+	this.scale = new THREE.Vector3(1, 1, 1);
 
-	init: function()
-	{
-		this.position = new Vector3(0, 0, 0);
-		this.rotation = new Vector3(0, 0, 0);
-		this.scale = new Vector3(1, 1, 1);
+	this.matrix = new THREE.Matrix4();
+	this.screen = new THREE.Vector3(0, 0, 0);
+	
+	this.material = material instanceof Array ? material : [material];
 
-		this.matrix = new Matrix4();
-		this.screen = new Vector3(0, 0, 0);		
-	},
+	this.updateMatrix = function () {
 
-	updateMatrix: function()
-	{
 		this.matrix.identity();
-
		this.matrix.multiplySelf( Matrix4.translationMatrix( this.position.x, this.position.y, this.position.z) );
-		this.matrix.multiplySelf( Matrix4.rotationXMatrix( this.rotation.x ) );
-		this.matrix.multiplySelf( Matrix4.rotationYMatrix( this.rotation.y ) );
-		this.matrix.multiplySelf( Matrix4.rotationZMatrix( this.rotation.z ) );
-		this.matrix.multiplySelf( 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));
+		
 	}
-});
+}

src/objects/Particle.js

@@ -1,11 +1,9 @@
-var Particle = Object3D.extend
-({
-	size: 1,
-	material: null,
+THREE.Particle = function (material) {
 
-	init: function( material )
-	{
-		this._super();
-		this.material = material;
-	}
-});
+	THREE.Object3D.call(this, material);
+
+	this.size = 1;
+}
+
+THREE.Particle.prototype = new THREE.Object3D();
+THREE.Particle.prototype.constructor = THREE.Particle;

src/objects/primitives/Cube.js

@@ -1,37 +0,0 @@
-var Cube = Geometry.extend
-({
-	init: function( width, height, depth )
-	{
-		this._super();
-		
-		var width_half = width / 2;
-		var height_half = height / 2;
-		var depth_half = depth / 2;
-		
-		this.v(  width_half,  height_half, -depth_half );
-		this.v(  width_half, -height_half, -depth_half );
-		this.v( -width_half, -height_half, -depth_half );
-		this.v( -width_half,  height_half, -depth_half );
-		this.v(  width_half,  height_half,  depth_half );
-		this.v(  width_half, -height_half,  depth_half );
-		this.v( -width_half, -height_half,  depth_half );
-		this.v( -width_half,  height_half,  depth_half );
-		
-		this.f4( 0, 1, 2, 3 );
-		this.f4( 4, 7, 6, 5 );
-		this.f4( 0, 4, 5, 1 );
-		this.f4( 1, 5, 6, 2 );
-		this.f4( 2, 6, 7, 3 );
-		this.f4( 4, 0, 3, 7 );
-	},
-
-	v: function( x, y, z )
-	{
-		this.vertices.push( new Vertex( x, y, z ) );
-	},
-
-	f4: function( a, b, c, d )
-	{
-		this.faces.push( new Face4( this.vertices[a], this.vertices[b], this.vertices[c], this.vertices[d] ) );
-	}	
-});

src/objects/primitives/Plane.js

@@ -1,27 +0,0 @@
-var Plane = Geometry.extend
-({
-	init: function( width, height )
-	{
-		this._super();
-		
-		var width_half = width / 2;
-		var height_half = height / 2;
-		
-		this.v( -width_half,  height_half, 0 );
-		this.v(  width_half,  height_half, 0 );
-		this.v(  width_half, -height_half, 0 );
-		this.v( -width_half, -height_half, 0 );
-		
-		this.f4( 0, 1, 2, 3 );
-	},
-	
-	v: function( x, y, z )
-	{
-		this.vertices.push( new Vertex( x, y, z ) );
-	},
-
-	f4: function( a, b, c, d )
-	{
-		this.faces.push( new Face4( this.vertices[a], this.vertices[b], this.vertices[c], this.vertices[d] ) );
-	}	
-});

src/renderers/CanvasRenderer.js

@@ -1,75 +1,97 @@
-var CanvasRenderer = Renderer.extend
-({
-	context: null,
+THREE.CanvasRenderer = function () {
 
-	init: function()
-	{
-		this._super();
+	THREE.Renderer.call(this);
 
-		this.viewport = document.createElement("canvas");
-		this.viewport.style.position = "absolute";
+	var viewport = document.createElement("canvas"),
+	context = viewport.getContext("2d");
+	
+	this.setSize = function (width, height) {
+	
+		viewport.width = width;
+		viewport.height = height;
+		
+		context.setTransform(1, 0, 0, 1, width / 2, height / 2);
+	}
+	
+	this.domElement = viewport;
 
-		this.context = this.viewport.getContext("2d");
-	},
+	this.render = function (scene, camera) {
+	
+		var i, j, element, pi2 = Math.PI * 2,
+		elementsLength, material, materialLength;
 
-	setSize: function( width, height )
-	{
-		this._super( width, height );
+		context.clearRect (-viewport.width / 2, -viewport.height / 2, viewport.width, viewport.height);
 
-		this.viewport.width = this.width;
-		this.viewport.height = this.height;
-		
-		this.context.setTransform(1, 0, 0, 1, this.widthHalf, this.heightHalf);
-	},
+		this.project(scene, camera);
 
-	render: function( scene, camera )
-	{
-		this._super( scene, camera );
+		elementsLength = this.renderList.length;
+		
+		for (i = 0; i < elementsLength; i++) {
+		
+			element = this.renderList[i];
+			materialLength = element.material.length;
+		
+			for (j = 0; j < materialLength; j++) {
+		
+				material = element.material[j];
+			
+				context.beginPath();
 
-		var element , pi2 = Math.PI * 2;
+				if (element instanceof THREE.RenderableFace3) {
+			
+					context.moveTo(element.v1.x, element.v1.y);
+					context.lineTo(element.v2.x, element.v2.y);
+					context.lineTo(element.v3.x, element.v3.y);
+					context.lineTo(element.v1.x, element.v1.y);
+				
+				} else if (element instanceof THREE.RenderableFace4) {
 
-		this.context.clearRect (-this.widthHalf, -this.heightHalf, this.width, this.height);
-		
-		for (j = 0; j < this.renderList.length; j++)
-		{
-			element = this.renderList[j];
+					context.moveTo(element.v1.x, element.v1.y);
+					context.lineTo(element.v2.x, element.v2.y);
+					context.lineTo(element.v3.x, element.v3.y);
+					context.lineTo(element.v4.x, element.v4.y);
+					context.lineTo(element.v1.x, element.v1.y);
+				
+				} else if (element instanceof THREE.RenderableParticle) {
 			
-			if (element.material instanceof ColorMaterial)
-			{
-				this.context.fillStyle = element.material.color.styleString;
-			}
-			else if (element.material instanceof FaceColorMaterial)
-			{
-				this.context.fillStyle = element.color.styleString;
-			}
+					context.arc(element.x, element.y, element.size * element.screenZ, 0, pi2, true);
+				}
+				
+				
+				if (material instanceof THREE.ColorFillMaterial) {
 			
-			if (element instanceof Face3)
-			{
-				this.context.beginPath();
-				this.context.moveTo(element.a.screen.x, element.a.screen.y);
-				this.context.lineTo(element.b.screen.x, element.b.screen.y);
-				this.context.lineTo(element.c.screen.x, element.c.screen.y);
-				this.context.fill();
-				this.context.closePath();
-			}
-			else if (element instanceof Face4)
-			{
-				this.context.beginPath();
-				this.context.moveTo(element.a.screen.x, element.a.screen.y);
-				this.context.lineTo(element.b.screen.x, element.b.screen.y);
-				this.context.lineTo(element.c.screen.x, element.c.screen.y);
-				this.context.lineTo(element.d.screen.x, element.d.screen.y);
-				this.context.fill();
-				this.context.closePath();
-			}
-			else if (element instanceof Particle)
-			{
-				this.context.beginPath();
-				this.context.arc(element.screen.x, element.screen.y, element.size * element.screen.z, 0, pi2, true);
-				this.context.fill();
-				this.context.closePath();				
-			}
+					context.fillStyle = material.color.styleString;
+					context.fill();
 			
+				} else if (material instanceof THREE.FaceColorFillMaterial) {
+			
+					context.fillStyle = element.color.styleString;
+					context.fill();
+
+				} else if (material instanceof THREE.ColorStrokeMaterial) {
+				
+					context.lineWidth = material.lineWidth;
+					context.lineJoin = "round";
+					context.lineCap = "round";
+
+					context.strokeStyle = material.color.styleString;
+					context.stroke();
+				
+				} else if (material instanceof THREE.FaceColorStrokeMaterial) {
+				
+					context.lineWidth = material.lineWidth;
+					context.lineJoin = "round";
+					context.lineCap = "round";
+					
+					context.strokeStyle = element.color.styleString;					
+					context.stroke();
+				}
+				
+				context.closePath();			
+			}
 		}
 	}
-});
+}
+
+THREE.CanvasRenderer.prototype = new THREE.Renderer();
+THREE.CanvasRenderer.prototype.constructor = THREE.CanvasRenderer;

src/renderers/GLRenderer.js

@@ -1,6 +1,7 @@
+/* TODO: Refactoring */
+
 var GLRenderer = Renderer.extend
 ({
-	
 	init: function()
 	{
 		this._super();

src/renderers/Renderer.js

@@ -1,68 +1,48 @@
-var Renderer = Class.extend
-({
-	matrix: null,
+THREE.Renderer = function() {
 
-	viewport: null,
-	renderList: null,
+	var face3Pool = [],
+	face4Pool = [],
+	particlePool = [],
 
-	face3Pool: null,
-	face4Pool: null,
+	matrix = new THREE.Matrix4();
 
-	width: null,
-	height: null,
-	widthHalf: null,
-	heightHalf: null,
+	this.renderList;
 
-	init: function()
-	{
-		this.matrix = new Matrix4();
-
-		this.face3Pool = new Array();
-		this.face4Pool = new Array();
-	},
-
-	setSize: function( width, height )
-	{
-		this.width = width;
-		this.height = height;
-
-		this.widthHalf = this.width / 2;
-		this.heightHalf = this.height / 2;
-	},
-
-	sort: function(a, b)
-	{
-		return a.screen.z - b.screen.z;
-	},
-
-	render: function( scene, camera )
-	{
-		var vertex, face, object;
-		var face3count = 0, face4count = 0;
+	function sort(a, b) {
+	
+		return a.screenZ - b.screenZ;
+	}
 
-		var focuszoom = camera.focus * camera.zoom;
+	this.project = function (scene, camera) {
+	
+		var i, j, vertex, face, object, v1, v2, v3, v4,
+		face3count = 0, face4count = 0, particleCount = 0,
+		camerafocus = camera.focus, focuszoom = camera.focus * camera.zoom,
+		verticesLength = 0, facesLength = 0;
 
-		this.renderList = new Array();
+		this.renderList = [];
 
-		for (var i = 0; i < scene.objects.length; i++)
-		{
+		for (i = 0; i < scene.objects.length; i++) {
+		
 			object = scene.objects[i];
 
-			if (object instanceof Mesh)
-			{
-				this.matrix.multiply( camera.matrix, object.matrix );
+			if (object instanceof THREE.Mesh) {
+			
+				matrix.multiply(camera.matrix, object.matrix);
 
 				// vertices
 
-				for (var j = 0; j < object.geometry.vertices.length; j++)
-				{
+				verticesLength = object.geometry.vertices.length;
+
+				for (j = 0; j < verticesLength; j++) {
+				
 					vertex = object.geometry.vertices[j];
 
-					vertex.screen.copy( vertex );
+					vertex.screen.copy(vertex.position);
 
-					this.matrix.transform( vertex.screen );
+					matrix.transform(vertex.screen);
 
-					vertex.screen.z = focuszoom / (camera.focus + vertex.screen.z);
+					vertex.screen.z = focuszoom / (camerafocus + vertex.screen.z);
 
 					vertex.visible = vertex.screen.z > 0;					
 
@@ -72,81 +52,116 @@ var Renderer = Class.extend
 
 				// faces
 
-				for (j = 0; j < object.geometry.faces.length; j++)
-				{
+				facesLength = object.geometry.faces.length;
+
+				for (j = 0; j < facesLength; j++) {
+				
 					face = object.geometry.faces[j];
 					
 					// TODO: Use normals for culling
 
-					if (face instanceof Face3)
-					{
-						if (face.a.visible && face.b.visible && face.c.visible && (object.doubleSided ||
-						   (face.c.screen.x - face.a.screen.x) * (face.b.screen.y - face.a.screen.y) -
-						   (face.c.screen.y - face.a.screen.y) * (face.b.screen.x - face.a.screen.x) > 0) )
-						{
-							face.screen.z = (face.a.screen.z + face.b.screen.z + face.c.screen.z) * 0.3;
+					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 ||
+						   (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) ) {
+						   
+							face.screen.z = (v1.screen.z + v2.screen.z + v3.screen.z) * 0.3;
 							
-							if (this.face3Pool[face3count] == null)
-								this.face3Pool[face3count] = new Face3(new Vertex(), new Vertex(), new Vertex());
-
-							this.face3Pool[face3count].a.screen.copy(face.a.screen);
-							this.face3Pool[face3count].b.screen.copy(face.b.screen);
-							this.face3Pool[face3count].c.screen.copy(face.c.screen);
-							this.face3Pool[face3count].screen.z = face.screen.z;
-							this.face3Pool[face3count].color = face.color;
-							this.face3Pool[face3count].material = object.material;
+							if (face3Pool[face3count] == null)
+								face3Pool[face3count] = new THREE.RenderableFace3();
+
+							face3Pool[face3count].v1.x = v1.screen.x;
+							face3Pool[face3count].v1.y = v1.screen.y;
+							face3Pool[face3count].v2.x = v2.screen.x;
+							face3Pool[face3count].v2.y = v2.screen.y;
+							face3Pool[face3count].v3.x = v3.screen.x;
+							face3Pool[face3count].v3.y = v3.screen.y;
+							face3Pool[face3count].screenZ = face.screen.z;
+							
+							face3Pool[face3count].color = face.color;
+							face3Pool[face3count].material = object.material;
 
-							this.renderList.push( this.face3Pool[face3count] );
+							this.renderList.push(face3Pool[face3count]);
 
 							face3count++;
 						}
-					}
-					else if (face instanceof Face4)
-					{
-						if (face.a.visible && face.b.visible && face.c.visible && (object.doubleSided ||
-						   ((face.d.screen.x - face.a.screen.x) * (face.b.screen.y - face.a.screen.y) -
-						   (face.d.screen.y - face.a.screen.y) * (face.b.screen.x - face.a.screen.x) > 0 ||
-						   (face.b.screen.x - face.c.screen.x) * (face.d.screen.y - face.c.screen.y) -
-						   (face.b.screen.y - face.c.screen.y) * (face.d.screen.x - face.c.screen.x) > 0)) )
-						{
-							face.screen.z = (face.a.screen.z + face.b.screen.z + face.c.screen.z + face.d.screen.z) * 0.25;
-
-							if (this.face4Pool[face4count] == null)
-								this.face4Pool[face4count] = new Face4(new Vertex(), new Vertex(), new Vertex(), new Vertex());
-
-							this.face4Pool[face4count].a.screen.copy(face.a.screen);
-							this.face4Pool[face4count].b.screen.copy(face.b.screen);
-							this.face4Pool[face4count].c.screen.copy(face.c.screen);
-							this.face4Pool[face4count].d.screen.copy(face.d.screen);
-							this.face4Pool[face4count].screen.z = face.screen.z;
-							this.face4Pool[face4count].color = face.color;
-							this.face4Pool[face4count].material = object.material;
-
-							this.renderList.push( this.face4Pool[face4count] );
+						
+					} 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 ||
+						   ((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)) ) {
+						   
+							face.screen.z = (v1.screen.z + v2.screen.z + v3.screen.z + v4.screen.z) * 0.25;
+
+							if (face4Pool[face4count] == null)
+								face4Pool[face4count] = new THREE.RenderableFace4();
+
+							face4Pool[face4count].v1.x = v1.screen.x;
+							face4Pool[face4count].v1.y = v1.screen.y;
+							face4Pool[face4count].v2.x = v2.screen.x;
+							face4Pool[face4count].v2.y = v2.screen.y;
+							face4Pool[face4count].v3.x = v3.screen.x;
+							face4Pool[face4count].v3.y = v3.screen.y;
+							face4Pool[face4count].v4.x = v4.screen.x;
+							face4Pool[face4count].v4.y = v4.screen.y;
+							face4Pool[face4count].screenZ = face.screen.z;
+							
+							face4Pool[face4count].color = face.color;
+							face4Pool[face4count].material = object.material;
+
+							this.renderList.push(face4Pool[face4count]);
 
 							face4count++;
-						}						
+						}
 					}
 				}
-			}
-			else if (object instanceof Particle)
-			{
+				
+			} else if (object instanceof THREE.Particle) {
+			
 				object.screen.copy(object.position);
-
-				camera.matrix.transform( object.screen );
-
-				object.screen.z = focuszoom / (camera.focus + object.screen.z);
-
-				if (object.screen.z < 0)
-					continue;					
+				
+				camera.matrix.transform(object.screen);
+				
+				object.screen.z = focuszoom / (camerafocus + object.screen.z);
+
+				if (object.screen.z < 0) {
+				
+					continue;
+				}
 
 				object.screen.x *= object.screen.z;
 				object.screen.y *= object.screen.z;
 
-				this.renderList.push( object );
+				if (particlePool[particleCount] == null)
+					particlePool[particleCount] = new THREE.RenderableParticle();
+
+				particlePool[particleCount].x = object.screen.x;
+				particlePool[particleCount].y = object.screen.y;
+				particlePool[particleCount].screenZ = object.screen.z;
+				
+				particlePool[particleCount].size = object.size;				
+				particlePool[particleCount].material = object.material;
+				particlePool[particleCount].color = object.color;
+
+				this.renderList.push( particlePool[particleCount] );
+				
+				particleCount++;
 			}
 		}
 
-		this.renderList.sort(this.sort);
+		this.renderList.sort(sort);
 	}
-});
+}

src/renderers/SVGRenderer.js

@@ -1,94 +1,108 @@
-var SVGRenderer = Renderer.extend
-({
-	svgPathPool: null,
-	svgCirclePool: null,
+THREE.SVGRenderer = function () {
 
-	init: function()
-	{
-		this._super();
-
-		this.viewport = document.createElementNS('http://www.w3.org/2000/svg', 'svg');
-		this.viewport.style.position = "absolute";
-
-		this.svgPathPool = new Array();
-		this.svgCirclePool = new Array();
-	},
+	THREE.Renderer.call(this);
+	
+	var viewport = document.createElementNS('http://www.w3.org/2000/svg', 'svg'),
+	svgPathPool = [], svgCirclePool = [];
 
-	setSize: function( width, height )
-	{
-		this.viewport.setAttribute('viewBox', (-width / 2) + ' ' + (-height / 2) + ' ' + width + ' ' + height );
-		this.viewport.setAttribute('width', width);
-		this.viewport.setAttribute('height', height);
-	},
+	this.setSize = function (width, height) {
 	
-	render: function( scene, camera )
-	{
-		this._super( scene, camera );
+		viewport.setAttribute('viewBox', (-width / 2) + ' ' + (-height / 2) + ' ' + width + ' ' + height );
+		viewport.setAttribute('width', width);
+		viewport.setAttribute('height', height);
+	}
+	
+	this.domElement = viewport;
 
-		while (this.viewport.childNodes.length > 0)
-		{
-			this.viewport.removeChild(this.viewport.childNodes[0]);
+	this.render = function (scene, camera) {
+	
+		var i, j, element, elementsLength, material, materialLength,
+		pathCount = 0, circleCount = 0, svgNode;
+	
+		this.project(scene, camera);
+	
+		while (viewport.childNodes.length > 0) {
+		
+			viewport.removeChild(viewport.childNodes[0]);
 		}
 		
-		var pathCount = 0, circleCount = 0, svgNode;
+		elementsLength = this.renderList.length;
 		
-		for (j = 0; j < this.renderList.length; j++)
-		{
-			element = this.renderList[j];
+		for (i = 0; i < elementsLength; i++) {
+			
+			element = this.renderList[i];
+			materialLength = element.material.length;
+			
+			for (j = 0; j < materialLength; j++) {
+			
+				material = element.material[j];
 
-			if (element instanceof Face3)
-			{
-				svgNode = this.getPathNode(pathCount++);
-				svgNode.setAttribute('d', 'M ' + element.a.screen.x + ' ' + element.a.screen.y + ' L ' + element.b.screen.x + ' ' + element.b.screen.y + ' L ' + element.c.screen.x + ',' + element.c.screen.y + 'z');					
-			}
-			else if (element instanceof Face4)
-			{
-				svgNode = this.getPathNode(pathCount++);
-				svgNode.setAttribute('d', 'M ' + element.a.screen.x + ' ' + element.a.screen.y + ' L ' + element.b.screen.x + ' ' + element.b.screen.y + ' L ' + element.c.screen.x + ',' + element.c.screen.y + ' L ' + element.d.screen.x + ',' + element.d.screen.y + 'z');
-			}
-			else if (element instanceof Particle)
-			{
-				svgNode = this.getCircleNode(circleCount++);
-				svgNode.setAttribute('cx', element.screen.x);
-				svgNode.setAttribute('cy', element.screen.y);
-				svgNode.setAttribute('r', element.size * element.screen.z);
-			}
+				if (element instanceof THREE.RenderableFace3) {
+					
+					svgNode = getPathNode(pathCount++);
+					svgNode.setAttribute('d', 'M ' + element.v1.x + ' ' + element.v1.y + ' L ' + element.v2.x + ' ' + element.v2.y + ' L ' + element.v3.x + ',' + element.v3.y + 'z');
+					
+				} else if (element instanceof THREE.RenderableFace4) {
+				
+					svgNode = getPathNode(pathCount++);
+					svgNode.setAttribute('d', 'M ' + element.v1.x + ' ' + element.v1.y + ' L ' + element.v2.x + ' ' + element.v2.y + ' L ' + element.v3.x + ',' + element.v3.y + ' L ' + element.v4.x + ',' + element.v4.y + 'z');
+					
+				} else if (element instanceof THREE.RenderableParticle) {
+				
+					svgNode = getCircleNode(circleCount++);
+					svgNode.setAttribute('cx', element.x);
+					svgNode.setAttribute('cy', element.y);
+					svgNode.setAttribute('r', element.size * element.screenZ);
+				}
 
-			if (element.material instanceof ColorMaterial)
-			{
-				svgNode.setAttribute('style', 'fill: rgb(' + element.material.color.r + ',' + element.material.color.g + ',' + element.material.color.b + ')');
-			}
-			else if (element.material instanceof FaceColorMaterial)
-			{
-				svgNode.setAttribute('style', 'fill: rgb(' + element.color.r + ',' + element.color.g + ',' + element.color.b + ')');
-			}
+				if (material instanceof THREE.ColorFillMaterial) {
+				
+					svgNode.setAttribute('style', 'fill: ' + material.color.styleString + '; stroke-width:10');
+					
+				} else if (material instanceof THREE.FaceColorFillMaterial) {
+				
+					svgNode.setAttribute('style', 'fill: ' + element.color.styleString + '; stroke-width:10');
+					
+				} else if (material instanceof THREE.ColorStrokeMaterial) {
+				
+					svgNode.setAttribute('style', 'fill: none; stroke: ' + material.color.styleString + '; stroke-width: ' + material.lineWidth + '; stroke-linecap: round; stroke-linejoin: round');
+				
+				} else if (material instanceof THREE.FaceColorStrokeMaterial) {
+				
+					svgNode.setAttribute('style', 'fill: none; stroke: ' + element.color.styleString + '; stroke-width: ' + material.lineWidth + '; stroke-linecap: round; stroke-linejoin: round');
+				}
+				
 
-			this.viewport.appendChild(svgNode);
-		}
-	},
+				viewport.appendChild(svgNode);
+			}
+		}	
+	}
+	
+	function getPathNode(id) {
 	
-	getPathNode: function( id )
-	{
-		if (this.svgPathPool[id] == null)
-		{
-			this.svgPathPool[id] = document.createElementNS('http://www.w3.org/2000/svg', 'path');
-			// this.svgPathPool[id].setAttribute('shape-rendering', 'crispEdges'); //optimizeSpeed
-			return this.svgPathPool[id];
+		if (svgPathPool[id] == null) {
+		
+			svgPathPool[id] = document.createElementNS('http://www.w3.org/2000/svg', 'path');
+			// svgPathPool[id].setAttribute('shape-rendering', 'crispEdges'); //optimizeSpeed
+			return svgPathPool[id];
 		}
 		
-		return this.svgPathPool[id];
-	},
+		return svgPathPool[id];
+	}
+	
+	function getCircleNode(id) {
 	
-	getCircleNode: function( id )
-	{
-		if (this.svgCirclePool[id] == null)
-		{
-			this.svgCirclePool[id] = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
-			// this.svgCirclePool[id].setAttribute('shape-rendering', 'crispEdges'); //optimizeSpeed
-			this.svgCirclePool[id].setAttribute('fill', 'red');
-			return this.svgCirclePool[id];
+		if (svgCirclePool[id] == null) {
+		
+			svgCirclePool[id] = document.createElementNS('http://www.w3.org/2000/svg', 'circle');
+			// svgCirclePool[id].setAttribute('shape-rendering', 'crispEdges'); //optimizeSpeed
+			// svgCirclePool[id].setAttribute('fill', 'red');
+			return svgCirclePool[id];
 		}
 		
-		return this.svgCirclePool[id];
-	}
-});
+		return svgCirclePool[id];
+	}	
+}
+
+THREE.SVGRenderer.prototype = new THREE.Renderer();
+THREE.SVGRenderer.prototype.constructor = THREE.CanvasRenderer;

src/renderers/renderables/RenderableFace3.js

@@ -0,0 +1,11 @@
+THREE.RenderableFace3 = function () {
+
+	this.v1 = new THREE.Vector2();
+	this.v2 = new THREE.Vector2();
+	this.v3 = new THREE.Vector2();
+	
+	this.screenZ;
+	
+	this.color;
+	this.material;
+}

src/renderers/renderables/RenderableFace4.js

@@ -0,0 +1,12 @@
+THREE.RenderableFace4 = function () {
+
+	this.v1 = new THREE.Vector2();
+	this.v2 = new THREE.Vector2();
+	this.v3 = new THREE.Vector2();
+	this.v4 = new THREE.Vector2();	
+	
+	this.screenZ;
+	
+	this.color;
+	this.material;
+}

src/renderers/renderables/RenderableParticle.js

@@ -0,0 +1,9 @@
+THREE.RenderableParticle = function () {
+
+	this.x;
+	this.y;
+	this.screenZ;
+	
+	this.color;
+	this.material;
+}

src/scenes/Scene.js

@@ -1,26 +1,29 @@
-var Scene = Class.extend
-({
-	objects: null,
+THREE.Scene = function () {
 
-	init: function()
-	{
-		this.objects = new Array();
-	},
+	this.objects = [];
 
-	add: function( object )
-	{
-		this.objects.push( object );
-	},
-
-	remove: function( object )
-	{
-		for(var i = 0; i < this.objects.length; i++)
-			if(object == this.objects[i])
+	this.add = function (object) {
+	
+		this.objects.push(object);
+	}
+	
+	/*
+	this.remove = function (object) {
+		
+		var nrObjects = this.objects.length;
+	
+		for(var i = 0; i < nrObjects; i++) {
+		
+			if(object == this.objects[i]) {
+			
 				alert("yay");
-	},
-
-	toString: function()
-	{
-		return 'Scene ( ' + this.objects + ' )';
+			}
+		}
+	}
+	*/
+	
+	this.toString = function () {
+	
+		return 'THREE.Scene ( ' + this.objects + ' )';
 	}
-});
+}

utils/deployer.py

@@ -1,14 +1,16 @@
 import sys
 import os
 
-# MERGER
-
-rev = 4;
-
+# MERGER
+
+rev = 5;
+
 files = [];
-files.append('Class.js');
+files.append('Three.js');
 files.append('core/Color.js');
+files.append('core/Vector2.js');
 files.append('core/Vector3.js');
+files.append('core/Vector4.js');
 files.append('core/Matrix4.js');
 files.append('core/Vertex.js');
 files.append('core/Face3.js');
@@ -16,24 +18,28 @@ files.append('core/Face4.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('objects/primitives/Plane.js');
-files.append('objects/primitives/Cube.js');
-files.append('materials/ColorMaterial.js');
-files.append('materials/FaceColorMaterial.js');
+files.append('materials/ColorFillMaterial.js');
+files.append('materials/ColorStrokeMaterial.js');
+files.append('materials/FaceColorFillMaterial.js');
+files.append('materials/FaceColorStrokeMaterial.js');
 files.append('scenes/Scene.js');
 files.append('renderers/Renderer.js');
 files.append('renderers/CanvasRenderer.js');
 files.append('renderers/SVGRenderer.js');
-
-string = '';
-
-for item in files:
-	src_file = open('../src/' + item,'r');
-	string += src_file.read() + "\n";
-
-dep_file = open('temp.js','w');
+files.append('renderers/renderables/RenderableFace3.js');
+files.append('renderers/renderables/RenderableFace4.js');
+files.append('renderers/renderables/RenderableParticle.js');
+
+string = '';
+
+for item in files:
+	src_file = open('../src/' + item,'r');
+	string += src_file.read() + "\n";
+
+dep_file = open('temp.js','w');
 dep_file.write(string);
 dep_file.close();
 
@@ -48,9 +54,9 @@ os.system("java -jar yuicompressor-2.4.2.jar temp.js -o ../build/three.js --char
 output = '../build/three.js';
 string = "// three.js r" + str(rev) + " - http://github.com/mrdoob/three.js\n";
 
-src_file = open(output,'r');
-string += src_file.read();
+src_file = open(output,'r');
+string += src_file.read();
 
-dep_file = open(output,'w');
+dep_file = open(output,'w');
 dep_file.write(string);
 dep_file.close();