Merge remote branch 'alteredq/master'

d5a21225 · Mr.doob · 5153379a · e43de3dc · d5a21225 · d5a21225
16 changed file
--- a/build/Three.js
+++ b/build/Three.js
--- a/build/ThreeDebug.js
+++ b/build/ThreeDebug.js
--- a/build/ThreeExtras.js
+++ b/build/ThreeExtras.js
--- a/examples/geometry_large_mesh.html
+++ b/examples/geometry_large_mesh.html
@@ -15,7 +15,7 @@
 			}
 			h1 { }
 			a { color:skyblue }
-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100 }
 			#d { text-align:center; margin:1em 0 -18em 0; z-index:0; position:relative; display:block }
 			.button { background:orange; color:#fff; padding:0.2em 0.5em; cursor:pointer }
@@ -153,6 +153,7 @@
 					try {
 						webglRenderer = new THREE.WebGLRenderer();
 						webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+						webglRenderer.domElement.style.position = "relative";
 						container.appendChild( webglRenderer.domElement );
 						has_gl = 1;
 					}

--- a/examples/lights_test.html
+++ b/examples/lights_test.html
@@ -15,7 +15,7 @@
 			}
 			h1 { }
 			a { color:skyblue }
-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100; }
 			#d { text-align:center; margin:1em 0 -15.7em 0; z-index:0; position:relative; display:block }
 			.button { background:#000; color:#fff; padding:0.2em 0.5em; cursor:pointer }
@@ -148,8 +148,9 @@

 					try {

-						webglRenderer = new THREE.WebGLRenderer( { scene: scene } );
+						webglRenderer = new THREE.WebGLRenderer();
 						webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+						webglRenderer.domElement.style.position = "relative";
 						container.appendChild( webglRenderer.domElement );

 						has_gl = 1;

--- a/examples/lines_cubes_gl.html
+++ b/examples/lines_cubes_gl.html
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js - lines - cubes - webgl</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background-color: #000000;
+				margin: 0px;
+				overflow: hidden;
+			}
+
+			a {
+				color:#0078ff;
+			}
+			
+			#info {
+				position: absolute;
+				top: 10px; width: 100%;
+				color: #ffffff;
+				padding: 5px;
+				font-family: Monospace;
+				font-size: 13px;
+				text-align: center;
+				z-index:100;
+			}
+
+			#oldie {
+				font-family:monospace;
+				font-size:13px;
+
+				text-align:center;
+				background:rgb(50,0,0);
+				color:#fff;
+				padding:1em;
+
+				width:475px;
+				margin:5em auto 0;
+
+				display:none;
+			}
+			
+			a {
+				color: orange;
+				text-decoration: none;
+			}
+
+			a:hover {
+				color: #0080ff;
+			}
+			
+		</style>
+	</head>
+	<body>
+	
+		<div id="info">
+			<a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - lines WebGL demo
+		</div>
+
+		<center>
+		<div id="oldie">
+			Sorry, your browser doesn't support <a href="http://khronos.org/webgl/wiki/Getting_a_WebGL_Implementation">WebGL</a>.<br/>
+			<br/>
+			Please try in
+			<a href="http://www.chromium.org/getting-involved/dev-channel">Chrome 9+</a> /
+			<a href="http://www.mozilla.com/en-US/firefox/all-beta.html">Firefox 4+</a> /
+			<a href="http://nightly.webkit.org/">Safari OSX 10.6+</a>
+		</div>
+		</center>
+
+
+		<script type="text/javascript" src="../build/Three.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+		
+			if ( !is_browser_compatible() ) {
+
+				document.getElementById( "oldie" ).style.display = "block";
+
+			}
+
+			var mouseX = 0, mouseY = 0,
+
+			windowHalfX = window.innerWidth / 2,
+			windowHalfY = window.innerHeight / 2,
+
+			camera, scene, renderer,
+
+			stats;
+
+			init();
+			setInterval( loop, 1000 / 60 );
+
+			function init() {
+
+				var i, material, container;
+
+				container = document.createElement('div');
+				document.body.appendChild(container);
+
+				camera = new THREE.Camera( 35, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 700;
+
+				scene = new THREE.Scene();
+
+				renderer = new THREE.WebGLRenderer();
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				container.appendChild( renderer.domElement );
+
+				var vector, geometry_sphere = new THREE.Geometry(), geometry_cube = new THREE.Geometry();
+
+				for ( i = 0; i < 1500; i ++ ) {
+
+					vector = new THREE.Vector3( Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1 );					
+					vector.multiplyScalar( Math.random() * 10 + 250 );
+					geometry_cube.vertices.push( new THREE.Vertex( vector ) );
+
+					/*
+					vector = new THREE.Vector3( Math.random() * 2 - 1, Math.random() * 2 - 1, Math.random() * 2 - 1 );					
+					vector.normalize();
+					vector.multiplyScalar( Math.random() * 10 + 250 );
+					geometry_sphere.vertices.push( new THREE.Vertex( vector ) );
+					*/
+
+				}
+
+				// lines
+
+				var line, p, scale = 0.3, d = 125, c1 = 0x553300, c2 = 0x555555, c3 = 0x552800, g1 = geometry_cube,
+					m1 = new THREE.LineBasicMaterial( { color: c1, opacity: 1, blending: THREE.AdditiveBlending } ),
+					m2 = new THREE.LineBasicMaterial( { color: c2, opacity: 1, blending: THREE.AdditiveBlending } ),
+					m3 = new THREE.LineBasicMaterial( { color: c3, opacity: 1, blending: THREE.AdditiveBlending } ),
+					parameters = [ [ m3, scale*0.5, [0,0,0],  g1 ], [ m2, scale*0.5, [d, 0, 0],  g1 ], [ m2, scale*0.5, [-d, 0, 0],  g1 ], 
+								   [ m2, scale*0.5, [0,d,0],  g1 ], [ m2, scale*0.5, [d, d, 0],  g1 ], [ m2, scale*0.5, [-d, d, 0],  g1 ],
+								   [ m2, scale*0.5, [0,-d,0], g1 ], [ m2, scale*0.5, [d, -d, 0], g1 ], [ m2, scale*0.5, [-d, -d, 0], g1 ],
+								   
+								   [ m1, scale*0.5, [2*d, 0, 0],  g1 ], [ m1, scale*0.5, [-2*d, 0, 0],  g1 ],
+								   [ m1, scale*0.5, [2*d, d, 0],  g1 ], [ m1, scale*0.5, [-2*d, d, 0],  g1 ],
+								   [ m1, scale*0.5, [2*d, -d, 0], g1 ], [ m1, scale*0.5, [-2*d, -d, 0], g1 ],							   
+								   ];
+				
+				for ( i = 0; i < parameters.length; ++i ) {
+				
+					p = parameters[ i ];
+					line = new THREE.Line( p[ 3 ],  p[ 0 ] );
+					line.scale.x = line.scale.y = line.scale.z =  p[ 1 ];
+					line.position.x = p[ 2 ][ 0 ];
+					line.position.y = p[ 2 ][ 1 ];
+					line.position.z = p[ 2 ][ 2 ];
+					scene.addObject( line );
+					
+				}
+
+				/*
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild(stats.domElement);
+				*/
+
+				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
+				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
+			}
+
+			//
+
+			function onDocumentMouseMove(event) {
+
+				mouseX = event.clientX - windowHalfX;
+				mouseY = event.clientY - windowHalfY;
+			}
+
+			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 ) {
+
+					event.preventDefault();
+
+					mouseX = event.touches[ 0 ].pageX - windowHalfX;
+					mouseY = event.touches[ 0 ].pageY - windowHalfY;
+				}
+			}
+
+			//
+
+			function loop() {
+
+				camera.position.x += ( mouseX - camera.position.x ) * .05;
+				camera.position.y += ( - mouseY + 200 - camera.position.y ) * .05;
+				camera.updateMatrix();
+
+				var time = new Date().getTime() * 0.0015;
+				
+				for( var i = 0; i<scene.objects.length; i++ ) {
+				
+					scene.objects[i].rotation.y = time * ( i % 2 ? 1 : -1);
+					
+				}
+
+				renderer.render(scene, camera);
+
+				//stats.update();
+			}
+
+			function is_browser_compatible() {
+
+				// WebGL support
+
+				try { var test = new Float32Array(1); } catch(e) { return false; }
+
+				return true;
+
+			}
+
+		</script>
+	</body>
+</html>
--- a/examples/materials_cubemap.html
+++ b/examples/materials_cubemap.html
@@ -16,7 +16,7 @@
 			a {	color: #ff0080;	text-decoration: none; }
 			a:hover { color: #0080ff; }

-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100; pointer-events:none; }
 			#d { text-align:center; margin:1em 0 -7.5em 0; z-index:1000; position:relative; display:block }
 			.button { background:orange; color:#fff; padding:0.2em 0.5em; cursor:pointer }

--- a/examples/materials_cubemap_refraction.html
+++ b/examples/materials_cubemap_refraction.html
@@ -16,7 +16,7 @@
 			a {	color: #ff0080;	text-decoration: none; }
 			a:hover { color: #0080ff; }

-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100; pointer-events:none; }
 			#d { text-align:center; margin:1em auto -9.5em; z-index:200; position:relative; display:block; 
 				background:rgba(0,0,0,0.5); padding:0.5em; width:400px; border-radius:15px; -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5) }

--- a/examples/materials_multimaterials.html
+++ b/examples/materials_multimaterials.html
@@ -14,7 +14,7 @@
 			}
 			h1 { }
 			a { color:skyblue }
-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:1; pointer-events:none; }
 			#d { text-align:center; margin:1em 0 -15.7em 0; z-index:0; position:relative; display:block }
 			.button { background:#000; color:#fff; padding:0.2em 0.5em; cursor:pointer }
@@ -148,6 +148,7 @@
 					try {
 						webglRenderer = new THREE.WebGLRenderer();
 						webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+						webglRenderer.domElement.style.position = "relative";
 						container.appendChild( webglRenderer.domElement );
 						has_gl = 1;
 					}

--- a/examples/materials_shaders.html
+++ b/examples/materials_shaders.html
@@ -15,7 +15,7 @@
 			}
 			h1 { }
 			a { color:skyblue }
-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:50px; text-align:left; display:block; z-index:100 }
 			#d { text-align:center; margin:1em 0 -19.7em 0; z-index:0; position:relative; display:block }
 			.button { background:orange; color:#fff; padding:0.2em 0.5em; cursor:pointer }
@@ -121,7 +121,7 @@
 				var ambient = new THREE.AmbientLight( 0x101010 );
 				scene.addLight( ambient );

-				directionalLight = new THREE.DirectionalLight( 0xffffff, 1.0 );
+				directionalLight = new THREE.DirectionalLight( 0xffffff );
 				directionalLight.position.x = 1;
 				directionalLight.position.y = 1;
 				directionalLight.position.z = 2;
@@ -135,7 +135,7 @@
 				scene.addLight( pointLight );

 				// light representation
-				sphere = new Sphere( 100, 16, 8, 1 );
+				sphere = new Sphere( 100, 16, 8 );
 				lightMesh = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( { color: 0xffaa00 } ) );
 				lightMesh.scale.x = lightMesh.scale.y = lightMesh.scale.z = 0.05;
 				lightMesh.position = pointLight.position;
@@ -144,7 +144,7 @@
 				scene.addObject(lightMesh);

 				// material samples
-				sphere = new Sphere( 100, 32, 32, 1 );
+				sphere = new Sphere( 100, 32, 32 );

 				var y1 = 0, y2 = -200;
 				
@@ -173,6 +173,7 @@
 					try {
 						webglRenderer = new THREE.WebGLRenderer();
 						webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+						webglRenderer.domElement.style.position = "relative";
 						container.appendChild( webglRenderer.domElement );
 						has_gl = 1;
 					}

--- a/examples/obj_convert_test.html
+++ b/examples/obj_convert_test.html
@@ -14,7 +14,7 @@
 			}
 			h1 { }
 			a { color:skyblue }
-			canvas { pointer-events:none; z-index:10; position:relative; }
+			canvas { pointer-events:none; z-index:10; }
 			#log { position:absolute; top:0; display:block; text-align:left; z-index:1000; pointer-events:none; }
 			#d { text-align:center; margin:1em 0 -15.7em 0; z-index:0; position:relative; display:block }
 			.button { background:#000; color:#fff; padding:0.2em 0.5em; cursor:pointer }
@@ -137,9 +137,10 @@

 				// SPHERES

-				sphere = new Sphere( 100, 16, 8, 1 );
+				var material_spheres = new THREE.MeshLambertMaterial( { color: 0xdddddd } ),
+					sphere = new Sphere( 100, 16, 8 );
 				for (var i=0; i<10; i++) {
-					mesh = new THREE.Mesh( sphere, new THREE.MeshLambertMaterial( { color: 0xdddddd } ) );
+					mesh = new THREE.Mesh( sphere, material_spheres );
 					mesh.position.x = 500 * (Math.random() - 0.5);
 					mesh.position.y = 300 * (Math.random() - 0) + FLOOR;
 					mesh.position.z = 100 * (Math.random() - 1);
@@ -170,6 +171,7 @@
 						webglRenderer = new THREE.WebGLRenderer();
 						webglRenderer.setFaceCulling(0);
 						webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+						webglRenderer.domElement.style.position = "relative";
 						container.appendChild( webglRenderer.domElement );
 						has_gl = 1;
 					}
@@ -206,7 +208,7 @@

 			function createScene( geometry, x, y, z, b ) {

-				zmesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial(), 1 );
+				zmesh = new THREE.Mesh( geometry, new THREE.MeshFaceMaterial() );
 				zmesh.position.x = x;
 				zmesh.position.z = y;
 				zmesh.position.y = z;
@@ -221,7 +223,7 @@

 			function createMaterialsPalette( materials, size, bottom ) {

-				for ( var i=0; i<materials.length; ++i ) {
+				for ( var i = 0; i < materials.length; ++i ) {

 					// material
 					mesh = new THREE.Mesh( new Plane( size, size ), materials[i] );

--- a/examples/shader2.html
+++ b/examples/shader2.html
+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js - shader materials</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				color: #ffffff;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+				font-weight: bold;
+
+				background-color: #000000;
+				margin: 0px;
+				overflow: hidden;
+			}
+
+			#info {
+				position: absolute;
+				top: 0px; width: 100%;
+				padding: 5px;
+			}
+
+			a {
+
+				color: #ffffff;
+			}
+
+		</style>
+	</head>
+	<body>
+
+		<div id="container"></div> 
+		<div id="info"><a href="http://github.com/mrdoob/three.js" target="_blank">three.js</a> - shader material demo. featuring <a href="http://www.pouet.net/prod.php?which=52761" target="_blank">Monjori by Mic</a></div> 
+
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript" src="../build/ThreeExtras.js"></script>
+
+
+		<script id="fragment_shader4" type="x-shader/x-fragment">
+
+			uniform float time;
+			uniform vec2 resolution;
+
+			varying vec2 vUv;
+			
+			void main( void ) {
+
+				vec2 position = -1.0 + 2.0 * vUv;
+				
+				float red = abs( sin( position.x * position.y + time / 5.0 ) );
+				float green = abs( sin( position.x * position.y + time / 4.0 ) );
+				float blue = abs( sin( position.x * position.y + time / 3.0 ) );
+				gl_FragColor = vec4( red, green, blue, 1.0 );
+
+			}
+
+		</script>
+		
+		<script id="fragment_shader3" type="x-shader/x-fragment">
+
+			uniform float time;
+			uniform vec2 resolution;
+			
+			varying vec2 vUv;
+			
+			void main( void ) {
+
+				vec2 position = vUv;
+				
+				float color = 0.0;
+				color += sin( position.x * cos( time / 15.0 ) * 80.0 ) + cos( position.y * cos( time / 15.0 ) * 10.0 );
+				color += sin( position.y * sin( time / 10.0 ) * 40.0 ) + cos( position.x * sin( time / 25.0 ) * 40.0 );
+				color += sin( position.x * sin( time / 5.0 ) * 10.0 ) + sin( position.y * sin( time / 35.0 ) * 80.0 );
+				color *= sin( time / 10.0 ) * 0.5;
+
+				gl_FragColor = vec4( vec3( color, color * 0.5, sin( color + time / 3.0 ) * 0.75 ), 1.0 );
+
+			}
+
+		</script>
+
+		<script id="fragment_shader2" type="x-shader/x-fragment">
+		
+			uniform float time;
+			uniform vec2 resolution;
+
+			uniform sampler2D texture;
+			
+			varying vec2 vUv;
+			
+			void main( void ) {
+
+				vec2 position = -1.0 + 2.0 * vUv;
+				
+				float a = atan( position.y, position.x );
+				float r = sqrt( dot( position, position ) );
+
+				vec2 uv;
+				uv.x = cos( a ) / r;
+				uv.y = sin( a ) / r;
+				uv /= 10.0;
+				uv += time * 0.05;
+
+				vec3 color = texture2D( texture, uv ).rgb;
+
+				gl_FragColor = vec4( color * r * 1.5, 1.0 );
+
+			}
+		</script>
+
+		<script id="fragment_shader1" type="x-shader/x-fragment">
+			#ifdef GL_ES
+			precision highp float;
+			#endif
+
+			uniform vec2 resolution;
+			uniform float time;
+
+			varying vec2 vUv;
+			
+			void main(void)
+			{
+			    
+				vec2 p = -1.0 + 2.0 * vUv;
+			    float a = time*40.0;
+			    float d,e,f,g=1.0/40.0,h,i,r,q;
+				
+			    e=400.0*(p.x*0.5+0.5);
+			    f=400.0*(p.y*0.5+0.5);
+			    i=200.0+sin(e*g+a/150.0)*20.0;
+			    d=200.0+cos(f*g/2.0)*18.0+cos(e*g)*7.0;
+			    r=sqrt(pow(i-e,2.0)+pow(d-f,2.0));
+			    q=f/r;
+			    e=(r*cos(q))-a/2.0;f=(r*sin(q))-a/2.0;
+			    d=sin(e*g)*176.0+sin(e*g)*164.0+r;
+			    h=((f+d)+a/2.0)*g;
+			    i=cos(h+r*p.x/1.3)*(e+e+a)+cos(q*g*6.0)*(r+h/3.0);
+			    h=sin(f*g)*144.0-sin(e*g)*212.0*p.x;
+			    h=(h+(f-e)*q+sin(r-(a+h)/7.0)*10.0+i/4.0)*g;
+			    i+=cos(h*2.3*sin(a/350.0-q))*184.0*sin(q-(r*4.3+a/12.0)*g)+tan(r*g+h)*184.0*cos(r*g+h);
+			    i=mod(i/5.6,256.0)/64.0;
+			    if(i<0.0) i+=4.0;
+			    if(i>=2.0) i=4.0-i;
+			    d=r/350.0;
+			    d+=sin(d*d*8.0)*0.52;
+			    f=(sin(a*g)+1.0)/2.0;
+			    gl_FragColor=vec4(vec3(f*i/1.6,i/2.0+d/13.0,i)*d*p.x+vec3(i/1.3+d/8.0,i/2.0+d/18.0,i)*d*(1.0-p.x),1.0);
+				
+			}
+			
+		</script>
+
+		<script id="vertex_shader" type="x-shader/x-vertex">
+		
+			varying vec2 vUv;
+			
+			void main()
+			{
+				vUv = uv;
+				vec4 mvPosition = modelViewMatrix * vec4( position, 1.0 );
+				gl_Position = projectionMatrix * mvPosition;
+			}
+			
+		</script>
+
+		<script type="text/javascript">
+
+			var container, stats;
+
+			var start_time;
+			
+			var camera, scene, renderer;
+
+			var uniforms1, uniforms2, material1, material2, mesh, meshes = [];
+
+			var mouseX = 0, mouseY = 0,
+			lat = 0, lon = 0, phy = 0, theta = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+
+			init();
+			setInterval( loop, 1000 / 60 );
+
+			function init() {
+
+				container = document.getElementById( 'container' );
+
+				camera = new THREE.Camera( 40, windowHalfX / windowHalfY, 1, 3000 );
+				camera.position.z = 4;
+
+				scene = new THREE.Scene();
+
+				start_time = new Date().getTime();
+				
+				uniforms1 = {
+					time: { type: "f", value: 1.0 },
+					resolution: { type: "v2", value: new THREE.Vector2() }
+				};
+
+				uniforms2 = {
+					time: { type: "f", value: 1.0 },
+					resolution: { type: "v2", value: new THREE.Vector2() },
+					texture: { type: "t", value: 0, texture: ImageUtils.loadTexture( "textures/disturb.jpg" ) }
+				};
+				
+				uniforms2.texture.texture.wrap_s = uniforms2.texture.texture.wrap_t = THREE.Repeat;
+
+				var size = 0.75, mlib = [], 
+					params = [ [ 'fragment_shader1', uniforms1 ],  [ 'fragment_shader2', uniforms2 ], [ 'fragment_shader3', uniforms1 ], [ 'fragment_shader4', uniforms1 ] ];
+				
+				for( var i = 0; i < params.length; i++ ) {
+				
+					material = new THREE.MeshShaderMaterial( {
+
+						uniforms: params[ i ][ 1 ],
+						vertex_shader: document.getElementById( 'vertex_shader' ).textContent,
+						fragment_shader: document.getElementById( params[ i ][ 0 ] ).textContent
+
+						} );
+						
+					mlib[ i ] = material;
+
+					mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, [ mlib[ i ], mlib[ i ], mlib[ i ], mlib[ i ], mlib[ i ], mlib[ i ] ], false ), new THREE.MeshFaceMaterial() );
+					mesh.position.x = i - (params.length - 1)/2;
+					mesh.position.y = i % 2 - 0.5;
+					scene.addObject( mesh );
+					
+					meshes[ i ] = mesh;
+
+				}
+				
+				renderer = new THREE.WebGLRenderer();
+				container.appendChild( renderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild( stats.domElement );
+
+				onWindowResize();
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize( event ) {
+
+				uniforms1.resolution.value.x = window.innerWidth;
+				uniforms1.resolution.value.y = window.innerHeight;
+				
+				uniforms2.resolution.value.x = window.innerWidth;
+				uniforms2.resolution.value.y = window.innerHeight;
+				
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+			}
+
+			function loop() {
+
+				uniforms1.time.value += 0.05;
+				uniforms2.time.value = ( new Date().getTime() - start_time ) / 1000;
+				
+				for( var i = 0; i < meshes.length; ++i ) {
+					
+					meshes[ i ].rotation.y += 0.01 * ( i % 2 ? 1 : -1 );
+					meshes[ i ].rotation.x += 0.01 * ( i % 2 ? -1 : 1 );
+					
+				}
+
+				renderer.render( scene, camera );
+				stats.update();
+
+			}
+
+		</script>
+
+	</body>
+</html>
--- a/src/objects/Line.js
+++ b/src/objects/Line.js
@@ -13,7 +13,7 @@ THREE.Line = function ( geometry, materials, type ) {

 };

-THREE.LineContinuous = 0;
+THREE.LineStrip = 0;
 THREE.LinePieces = 1;

 THREE.Line.prototype = new THREE.Object3D();

--- a/src/objects/ParticleSystem.js
+++ b/src/objects/ParticleSystem.js
+/**
+ * @author alteredq / http://alteredqualia.com/
+ */
+
+THREE.ParticleSystem = function ( geometry, materials ) {
+
+	THREE.Object3D.call( this );
+
+	this.geometry = geometry;
+	this.materials = materials instanceof Array ? materials : [ materials ];
+
+	this.autoUpdateMatrix = false;
+
+};
+
+THREE.ParticleSystem.prototype = new THREE.Object3D();
+THREE.ParticleSystem.prototype.constructor = THREE.ParticleSystem;
--- a/src/renderers/WebGLRenderer.js
+++ b/src/renderers/WebGLRenderer.js
@@ -127,19 +127,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 			vertex = vertices[ v ].position;
 			vertexArray.push( vertex.x, vertex.y, vertex.z );
 			
-			if ( object.type == THREE.LineContinuous ) {
-				
-				if ( v < ( vl - 1 ) ) {
-					
-					lineArray.push( v, v + 1 );
-					
-				}
-				
-			} else {
-				
-				lineArray.push( v );
-				
-			}
+			lineArray.push( v );
 			
 		}
 			
@@ -455,7 +443,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 	
 	this.renderBuffer = function ( camera, lights, fog, material, geometryChunk ) {

-		var program, u, identifiers, attributes, parameters, vector_lights, maxLightCount, linewidth;
+		var program, u, identifiers, attributes, parameters, vector_lights, maxLightCount, linewidth, primitives;

 		if ( !material.program ) {

@@ -611,9 +599,11 @@ THREE.WebGLRenderer = function ( parameters ) {
 			linewidth = material.wireframe_linewidth !== undefined ? material.wireframe_linewidth : 
 					    material.linewidth !== undefined ? material.linewidth : 1;
 			
+			primitives = material instanceof THREE.LineBasicMaterial && geometryChunk.type == THREE.LineStrip ? _gl.LINE_STRIP : _gl.LINES;
+			
 			_gl.lineWidth( linewidth );
 			_gl.bindBuffer( _gl.ELEMENT_ARRAY_BUFFER, geometryChunk.__webGLLineBuffer );
-			_gl.drawElements( _gl.LINES, geometryChunk.__webGLLineCount, _gl.UNSIGNED_SHORT, 0 );
+			_gl.drawElements( primitives, geometryChunk.__webGLLineCount, _gl.UNSIGNED_SHORT, 0 );

 		// render triangles

@@ -664,20 +654,6 @@ THREE.WebGLRenderer = function ( parameters ) {
 		}

 	};
-	
-	this.renderPassLines = function( camera, lights, fog, object ) {
-		
-		var m, ml, material;
-		
-		for ( m = 0, ml = object.materials.length; m < ml; m++ ) {
-			
-			material = object.materials[ m ];
-			this.setBlending( material.blending );
-			this.renderBuffer( camera, lights, fog, material, object );
-			
-		}
-		
-	};

 	this.render = function( scene, camera ) {

@@ -697,23 +673,6 @@ THREE.WebGLRenderer = function ( parameters ) {

 		_viewMatrixArray.set( camera.matrix.flatten() );
 		_projectionMatrixArray.set( camera.projectionMatrix.flatten() );
-
-		// lines
-		
-		for ( o = 0, ol = scene.__webGLLines.length; o < ol; o++ ) {
-			
-			webGLObject = scene.__webGLLines[ o ];
-
-			object = webGLObject.object;
-
-			if ( object.visible ) {
-
-				this.setupMatrices( object, camera );
-				this.renderPassLines( camera, lights, fog, object );
-
-			}
-			
-		}
 		
 		// opaque pass

@@ -777,26 +736,19 @@ THREE.WebGLRenderer = function ( parameters ) {

 		}
 		
-		if ( !scene.__webGLLines ) {
-			
-			scene.__webGLLines = [];
-			scene.__webGLLinesMap = {};
-			
-		}
-
 		for ( o = 0, ol = scene.objects.length; o < ol; o++ ) {

 			object = scene.objects[ o ];

-			if ( object instanceof THREE.Mesh ) {
-				
-				if ( scene.__webGLObjectsMap[ object.id ] == undefined ) {
+			if ( scene.__webGLObjectsMap[ object.id ] == undefined ) {

-					scene.__webGLObjectsMap[ object.id ] = {};
+				scene.__webGLObjectsMap[ object.id ] = {};

-				}
+			}

-				objmap = scene.__webGLObjectsMap[ object.id ];
+			objmap = scene.__webGLObjectsMap[ object.id ];
+			
+			if ( object instanceof THREE.Mesh ) {
 				
 				// create separate VBOs per geometry chunk

@@ -827,13 +779,6 @@ THREE.WebGLRenderer = function ( parameters ) {

 			} else if ( object instanceof THREE.Line ) {
 				
-				if ( scene.__webGLLinesMap[ object.id ] == undefined ) {
-
-					scene.__webGLLinesMap[ object.id ] = {};
-
-				}
-
-				lmap = scene.__webGLLinesMap[ object.id ];
 				
 				if( ! object.__webGLVertexBuffer ) {
 				
@@ -843,16 +788,18 @@ THREE.WebGLRenderer = function ( parameters ) {
 				
 				g = 0;
 				
-				if ( lmap[ g ] == undefined ) {
+				if ( objmap[ g ] == undefined ) {

-					globject = { object: object };
-					scene.__webGLLines.push( globject );
+					globject = { buffer: object, object: object };
+					scene.__webGLObjects.push( globject );

-					lmap[ g ] = 1;
+					objmap[ g ] = 1;

 				}

-			}/* else if ( object instanceof THREE.Particle ) {
+			}/*  else if ( object instanceof THREE.ParticleSystem ) {
+
+			}else if ( object instanceof THREE.Particle ) {

 			}*/

@@ -1089,10 +1036,12 @@ THREE.WebGLRenderer = function ( parameters ) {

 		for( u in uniforms ) {

+			location = program.uniforms[u];
+			if ( !location ) continue;
+			
 			type = uniforms[u].type;
 			value = uniforms[u].value;
-			location = program.uniforms[u];
-
+			
 			if( type == "i" ) {

 				_gl.uniform1i( location, value );

--- a/utils/build.py
+++ b/utils/build.py
@@ -33,6 +33,7 @@ COMMON_FILES = [
 'lights/PointLight.js',
 'objects/Object3D.js',
 'objects/Particle.js',
+'objects/ParticleSystem.js',
 'objects/Line.js',
 'objects/Mesh.js',
 'materials/Material.js',
@@ -222,6 +223,7 @@ WEBGL_FILES = [
 'lights/PointLight.js',
 'objects/Object3D.js',
 'objects/Particle.js',
+'objects/ParticleSystem.js',
 'objects/Line.js',
 'objects/Mesh.js',
 'materials/Material.js',