Merge remote branch 'alteredq/master' into experimental

examples/webgl_lines_colors.html

@@ -60,8 +60,8 @@
 
 			camera, scene, renderer, material;
 
-			var cameraOrtho, sceneScreen, rtTexture1, rtTexture2, rtTexture3, materialScreen, materialConvolution, blurx, blury, quadScreen;
-
+			var postprocessing = { enabled: true };
+			
 			init();
 			animate();
 
@@ -77,9 +77,9 @@
 
 				scene = new THREE.Scene();
 
-				renderer = new THREE.WebGLRenderer( { antialias: false } );
+				renderer = new THREE.WebGLRenderer( { clearColor: 0x000000, clearAlpha: 1, antialias: false } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
-				renderer.autoClear = false;
+
 				container.appendChild( renderer.domElement );
 
 				var geometry = new THREE.Geometry(),
@@ -132,59 +132,7 @@
 
 				}
 
-				// postprocessing
-
-				cameraOrtho = new THREE.Camera();
-				cameraOrtho.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2, window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
-				cameraOrtho.position.z = 100;
-
-				sceneScreen = new THREE.Scene();
-
-				var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
-				rtTexture1 = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
-				rtTexture2 = new THREE.WebGLRenderTarget( 512, 512, pars );
-				rtTexture3 = new THREE.WebGLRenderTarget( 512, 512, pars );
-
-				var screen_shader = ShaderUtils.lib["screen"];
-				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
-
-				screen_uniforms["tDiffuse"].texture = rtTexture1;
-				screen_uniforms["opacity"].value = 1.0;
-
-				materialScreen = new THREE.MeshShaderMaterial( {
-
-					uniforms: screen_uniforms,
-					vertexShader: screen_shader.vertexShader,
-					fragmentShader: screen_shader.fragmentShader,
-					blending: THREE.AdditiveBlending,
-					transparent: true
-
-				} );
-
-				var convolution_shader = ShaderUtils.lib["convolution"];
-				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
-
-				blurx = new THREE.Vector2( 0.001953125, 0.0 ),
-				blury = new THREE.Vector2( 0.0, 0.001953125 );
-
-				convolution_uniforms["tDiffuse"].texture = rtTexture1;
-				convolution_uniforms["uImageIncrement"].value = blurx;
-				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
-
-				materialConvolution = new THREE.MeshShaderMaterial( {
-
-					uniforms: convolution_uniforms,
-					vertexShader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertexShader,
-					fragmentShader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragmentShader
-
-				} );
-
-				var plane = new Plane( window.innerWidth, window.innerHeight );
-
-				quadScreen = new THREE.Mesh( plane, materialConvolution );
-				quadScreen.position.z = -100;
-				sceneScreen.addObject( quadScreen );
-
+				
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
@@ -195,6 +143,9 @@
 				document.addEventListener( 'touchstart', onDocumentTouchStart, false );
 				document.addEventListener( 'touchmove', onDocumentTouchMove, false );
 
+				initPostprocessing();
+				renderer.autoClear = false;
+
 			}
 
 			// port of Processing Java code by Thomas Diewald
@@ -240,6 +191,59 @@
 			}
 
 			//
+			
+			function initPostprocessing() {
+
+				postprocessing.scene = new THREE.Scene();
+
+				postprocessing.camera = new THREE.Camera();
+				postprocessing.camera.projectionMatrix = THREE.Matrix4.makeOrtho( window.innerWidth / - 2, window.innerWidth / 2,  window.innerHeight / 2, window.innerHeight / - 2, -10000, 10000 );
+				postprocessing.camera.position.z = 100;
+
+				var pars = { minFilter: THREE.LinearFilter, magFilter: THREE.LinearFilter };
+				postprocessing.rtTexture1 = new THREE.WebGLRenderTarget( window.innerWidth, window.innerHeight, pars );
+				postprocessing.rtTexture2 = new THREE.WebGLRenderTarget( 512, 512, pars );
+				postprocessing.rtTexture3 = new THREE.WebGLRenderTarget( 512, 512, pars );
+
+				var screen_shader = ShaderUtils.lib["screen"];
+				var screen_uniforms = Uniforms.clone( screen_shader.uniforms );
+
+				screen_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				screen_uniforms["opacity"].value = 1.0;
+
+				postprocessing.materialScreen = new THREE.MeshShaderMaterial( {
+
+					uniforms: screen_uniforms,
+					vertexShader: screen_shader.vertexShader,
+					fragmentShader: screen_shader.fragmentShader,
+					blending: THREE.AdditiveBlending,
+					transparent: true
+
+				} );
+
+				var convolution_shader = ShaderUtils.lib["convolution"];
+				var convolution_uniforms = Uniforms.clone( convolution_shader.uniforms );
+
+				postprocessing.blurx = new THREE.Vector2( 0.001953125, 0.0 ),
+				postprocessing.blury = new THREE.Vector2( 0.0, 0.001953125 );
+
+				convolution_uniforms["tDiffuse"].texture = postprocessing.rtTexture1;
+				convolution_uniforms["uImageIncrement"].value = postprocessing.blurx;
+				convolution_uniforms["cKernel"].value = ShaderUtils.buildKernel( 4.0 );
+
+				postprocessing.materialConvolution = new THREE.MeshShaderMaterial( {
+
+					uniforms: convolution_uniforms,
+					vertexShader:   "#define KERNEL_SIZE 25.0\n" + convolution_shader.vertexShader,
+					fragmentShader: "#define KERNEL_SIZE 25\n"   + convolution_shader.fragmentShader
+
+				} );
+
+				postprocessing.quad = new THREE.Mesh( new Plane( window.innerWidth, window.innerHeight ), postprocessing.materialConvolution );
+				postprocessing.quad.position.z = -500;
+				postprocessing.scene.addObject( postprocessing.quad );
+
+			}			
 
 			function onDocumentMouseMove(event) {
 
@@ -283,7 +287,6 @@
 
 				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.0005;
 
@@ -293,43 +296,50 @@
 
 				}
 
-				//renderer.render( scene, camera );
+				if ( postprocessing.enabled ) {
 
-				renderer.clear();
+					renderer.clear();
 
-				// Render scene into texture
+					// Render scene into texture
 
-				renderer.render( scene, camera, rtTexture1, true );
+					renderer.render( scene, camera, postprocessing.rtTexture1, true );
 
-				// Render quad with blured scene into texture (convolution pass 1)
+					// Render quad with blured scene into texture (convolution pass 1)
 
-				quadScreen.materials = [ materialConvolution ];
+					postprocessing.quad.materials = [ postprocessing.materialConvolution ];
 
-				materialConvolution.uniforms.tDiffuse.texture = rtTexture1;
-				materialConvolution.uniforms.uImageIncrement.value = blurx;
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blurx;
 
-				renderer.render( sceneScreen, cameraOrtho, rtTexture2, true );
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture2, true );
 
-				// Render quad with blured scene into texture (convolution pass 2)
+					// Render quad with blured scene into texture (convolution pass 2)
 
-				materialConvolution.uniforms.tDiffuse.texture = rtTexture2;
-				materialConvolution.uniforms.uImageIncrement.value = blury;
+					postprocessing.materialConvolution.uniforms.tDiffuse.texture = postprocessing.rtTexture2;
+					postprocessing.materialConvolution.uniforms.uImageIncrement.value = postprocessing.blury;
 
-				renderer.render( sceneScreen, cameraOrtho, rtTexture3, true );
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture3, true );
 
-				// Render original scene with superimposed blur to texture
+					// Render original scene with superimposed blur to texture
 
-				quadScreen.materials = [ materialScreen ];
+					postprocessing.quad.materials = [ postprocessing.materialScreen ];
 
-				materialScreen.uniforms.tDiffuse.texture = rtTexture3;
-				materialScreen.uniforms.opacity.value = 1.3;
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture3;
+					postprocessing.materialScreen.uniforms.opacity.value = 1.3;
 
-				renderer.render( sceneScreen, cameraOrtho, rtTexture1, false );
+					renderer.render( postprocessing.scene, postprocessing.camera, postprocessing.rtTexture1, false );
 
-				// Render to screen
+					// Render to screen
 
-				materialScreen.uniforms.tDiffuse.texture = rtTexture1;
-				renderer.render( sceneScreen, cameraOrtho );
+					postprocessing.materialScreen.uniforms.tDiffuse.texture = postprocessing.rtTexture1;
+					renderer.render( postprocessing.scene, postprocessing.camera );
+
+				} else {
+
+					renderer.clear();
+					renderer.render( scene, camera );
+
+				}
 
 			}
 

examples/webgl_sprites.html

+<!DOCTYPE HTML>
+<html lang="en">
+	<head>
+		<title>three.js webgl - sprites</title>
+		<meta charset="utf-8">
+		<style type="text/css">
+			body {
+				background:#fff;
+				padding:0;
+				margin:0;
+				font-weight: bold;
+				overflow:hidden;
+			}
+		</style>
+	</head>
+
+	<body>
+		<script type="text/javascript" src="../build/Three.js"></script>
+		<script type="text/javascript" src="js/Stats.js"></script>
+
+		<script type="text/javascript">
+			var statsEnabled = true;
+
+			var container, stats;
+
+			var camera, scene, renderer;
+
+			var nodeA, nodeA;
+			var time = 0;
+
+			var mouseX = 0, mouseY = 0;
+
+			var windowHalfX = window.innerWidth / 2;
+			var windowHalfY = window.innerHeight / 2;
+			
+
+			init();
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				camera = new THREE.Camera( 60, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.z = 1500;
+
+				scene = new THREE.Scene();
+	
+
+				// create sprites
+
+				var amount = 200;
+				var radius = 500;
+				var mapA =  ImageUtils.loadTexture( "textures/sprite0.png" );
+				var mapB =  ImageUtils.loadTexture( "textures/sprite1.png" );
+				
+				nodeA = new THREE.Mesh( new Cube( 10, 10, 10 ), new THREE.MeshLambertMaterial( { color: 0xff0000 } ));
+				
+				for( var a = 0; a < amount; a++ ) {
+					
+					var sprite = new THREE.Sprite( { map: mapA, useScreenCoordinates: false } );
+					sprite.position.set( Math.random() - 0.5, 
+					                     Math.random() - 0.5,
+					                     Math.random() - 0.5 );
+					
+					if( sprite.position.z < 0 ) {
+						
+						sprite.map = mapB;
+						
+					}
+					
+					sprite.position.normalize();
+					sprite.position.multiplyScalar( radius );
+					
+					nodeA.addChild( sprite );
+				}
+				
+				scene.addChild( nodeA );
+						
+
+				// renderer
+
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
+				renderer.setClearColorHex( 0x000000, 1 );
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				renderer.sortObjects = true;
+				
+				container.appendChild( renderer.domElement );
+
+				if ( statsEnabled ) {
+
+					stats = new Stats();
+					stats.domElement.style.position = 'absolute';
+					stats.domElement.style.top = '0px';
+					stats.domElement.style.zIndex = 100;
+					container.appendChild( stats.domElement );
+
+				}
+
+				setInterval( loop, 1000 / 60 );
+			}
+
+
+			function loop() {
+
+				for( var c = 0; c < nodeA.children.length; c++ ) {
+					
+					var sprite = nodeA.children[ c ];
+					var scale = Math.sin( time + sprite.position.x * 0.01 ) * 0.3 + 1.0;
+					
+					sprite.rotation += 0.1 * ( c / nodeA.children.length );
+					sprite.scale.set( scale, scale, 1.0 );
+					sprite.opacity = Math.sin( time + sprite.position.x * 0.01 ) * 0.4 + 0.6;
+				}
+
+				nodeA.rotation.x = time * 0.5;
+				nodeA.rotation.y = time * 0.75;
+				nodeA.rotation.z = time * 1.0;
+
+				time += 0.02;
+
+				renderer.render( scene, camera );
+
+				if ( statsEnabled ) stats.update();
+
+			}
+
+			function log( text ) {
+
+				var e = document.getElementById("log");
+				e.innerHTML = text + "<br/>" + e.innerHTML;
+
+			}
+		</script>
+	</body>
+</html>

src/extras/io/SceneLoader.js

@@ -136,7 +136,15 @@ THREE.SceneLoader.prototype = {
 
 							result.objects[ dd ] = object;
 
+							if ( o.meshCollider ) {
+
+								var meshCollider = THREE.CollisionUtils.MeshColliderWBox( object );
+								THREE.Collisions.colliders.push( meshCollider );
+
+							}
+
 						}
+						
 
 					}
 

src/objects/ShadowVolume.js

-/*
- * Shadow Volume
+/**
+ * @author mikael emtinger / http://gomo.se/
  */
 
 THREE.ShadowVolume = function( mesh, isStatic ) {
@@ -9,7 +9,7 @@ THREE.ShadowVolume = function( mesh, isStatic ) {
 
 	this.calculateShadowVolumeGeometry( mesh.geometry );
 
-}
+};
 
 THREE.ShadowVolume.prototype             = new THREE.Mesh();
 THREE.ShadowVolume.prototype.constructor = THREE.ShadowVolume;
@@ -100,7 +100,7 @@ THREE.ShadowVolume.prototype.calculateShadowVolumeGeometry = function( originalG
 
 	}
 
-}
+};
 
 
 
@@ -198,5 +198,5 @@ THREE.ShadowVolume.prototype.facesShareEdge = function( vertices, faceA, faceB )
 
 	return undefined;
 
-}
+};
 

src/objects/Sprite.js

+/**
+ * @author mikael emtinger / http://gomo.se/
+ */
+
+THREE.Sprite = function( parameters ) {
+	
+	THREE.Object3D.call( this );
+
+	if( parameters.material !== undefined ) {
+
+		this.material = parameters.material;
+		this.map      = undefined;
+		this.blending = material.blending;
+		
+	} else if( parameters.map !== undefined ) {
+		
+		this.map      = parameters.map instanceof THREE.Texture ? parameters.map : ImageUtils.loadTexture( parameters.map );
+		this.material = undefined;
+		this.blending = parameters.blending !== undefined ? parameters.blending : THREE.NormalBlending;
+
+	}
+	
+	this.useScreenCoordinates = parameters.useScreenCoordinates !== undefined ? parameters.useScreenCoordinates : true;
+	this.mergeWith3D = parameters.mergeWith3D !== undefined ? parameters.mergeWith3D : !parameters.useScreenCoordinates;
+	this.affectedByDistance = parameters.affectedByDistance !== undefined ? parameters.affectedByDistance : !parameters.useScreenCoordinates;
+	this.alignment = parameters.alignment instanceof THREE.Vector2 ? parameters.alignment : THREE.SpriteAlignment.center;
+	
+	this.rotation3d = this.rotation;
+	this.rotation = 0;
+	this.opacity = 1;
+	
+	this.uvOffset = new THREE.Vector2( 0, 0 );
+	this.uvScale  = new THREE.Vector2( 1, 1 );
+	
+};
+
+THREE.Sprite.prototype             = new THREE.Object3D();
+THREE.Sprite.prototype.constructor = THREE.Sprite;
+THREE.Sprite.prototype.supr        = THREE.Object3D.prototype;
+
+
+/*
+ * Custom update matrix
+ */
+
+THREE.Sprite.prototype.updateMatrix = function () {
+
+	this.matrix.setPosition( this.position );
+
+	this.rotation3d.set( 0, 0, this.rotation );
+	this.matrix.setRotationFromEuler( this.rotation3d );
+
+	if ( this.scale.x !== 1 || this.scale.y !== 1 ) {
+
+		this.matrix.scale( this.scale );
+		this.boundRadiusScale = Math.max( this.scale.x, this.scale.y );
+
+	}
+
+	this.matrixWorldNeedsUpdate = true;
+
+};
+
+/*
+ * Alignment
+ */
+
+THREE.SpriteAlignment = {};
+THREE.SpriteAlignment.topLeft = new THREE.Vector2( 1, -1 );
+THREE.SpriteAlignment.topCenter = new THREE.Vector2( 0, -1 );
+THREE.SpriteAlignment.topRight = new THREE.Vector2( -1, -1 );
+THREE.SpriteAlignment.centerLeft = new THREE.Vector2( 1, 0 );
+THREE.SpriteAlignment.center = new THREE.Vector2( 0, 0 );
+THREE.SpriteAlignment.centerRight = new THREE.Vector2( -1, 0 );
+THREE.SpriteAlignment.bottomLeft = new THREE.Vector2( 1, 1 );
+THREE.SpriteAlignment.bottomCenter = new THREE.Vector2( 0, 1 );
+THREE.SpriteAlignment.bottomRight = new THREE.Vector2( -1, 1 );
+
+

src/physics/CollisionUtils.js

@@ -51,14 +51,14 @@ THREE.CollisionUtils.MeshColliderWBox = function( m ) {
 	
 	for( var i = 0; i < mvl; i++ ) {
 
-		vertices.push( new THREE.Vector3( mv[i].position.x, mv[i].position.y, mv[i].position.z) );
+		vertices.push( new THREE.Vector3( mv[ i ].position.x, mv[ i ].position.y, mv[ i ].position.z ) );
 
 	}
 	
 	for( var i = 0; i < mfl; i++ ) {
 
-		faces.push( mf[i].a, mf[i].b, mf[i].c );
-		normals.push( new THREE.Vector3( mf[i].normal.x, mf[i].normal.y, mf[i].normal.z) );
+		faces.push( mf[ i ].a, mf[ i ].b, mf[ i ].c );
+		normals.push( new THREE.Vector3( mf[ i ].normal.x, mf[ i ].normal.y, mf[ i ].normal.z ) );
 
 	}
 	

src/physics/Collisions.js

@@ -152,6 +152,10 @@ THREE.CollisionSystem.prototype.rayTriangle = function( ray, p0, p1, p2, n, mind
 	var e1 = THREE.CollisionSystem.__v1, 
 		e2 = THREE.CollisionSystem.__v2;
 	
+	// do not crash on quads, fail instead
+
+	//if ( !n ) n = THREE.CollisionSystem.__v3;
+	
 	e1.sub( p1, p0 );
 	e2.sub( p2, p1 );
 	n.cross( e1, e2 )

src/renderers/WebGLRenderTarget.js

@@ -15,7 +15,7 @@ THREE.WebGLRenderTarget = function ( width, height, options ) {
 	this.magFilter = options.magFilter !== undefined ? options.magFilter : THREE.LinearFilter;
 	this.minFilter = options.minFilter !== undefined ? options.minFilter : THREE.LinearMipMapLinearFilter;
 
-	this.format = options.format !== undefined ? options.format : THREE.RGBFormat;
+	this.format = options.format !== undefined ? options.format : THREE.RGBAFormat;
 	this.type = options.type !== undefined ? options.type : THREE.UnsignedByteType;
 	
 	this.depthBuffer = options.depthBuffer !== undefined ? options.depthBuffer : true;

src/renderers/WebGLRenderer.js

@@ -254,16 +254,20 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 	_sprite.attributes = {};
 	_sprite.uniforms = {};
-	_sprite.attributes.vertex       = _gl.getAttribLocation ( _sprite.program, "position" );
-	_sprite.attributes.uv           = _gl.getAttribLocation ( _sprite.program, "UV" );
-	_sprite.uniforms.map            = _gl.getUniformLocation( _sprite.program, "map" );
-	_sprite.uniforms.opacity        = _gl.getUniformLocation( _sprite.program, "opacity" );
-	_sprite.uniforms.scale          = _gl.getUniformLocation( _sprite.program, "scale" );
-	_sprite.uniforms.rotation       = _gl.getUniformLocation( _sprite.program, "rotation" );
-	_sprite.uniforms.screenPosition = _gl.getUniformLocation( _sprite.program, "screenPosition" );
-
-
-
+	_sprite.attributes.position           = _gl.getAttribLocation ( _sprite.program, "position" );
+	_sprite.attributes.uv                 = _gl.getAttribLocation ( _sprite.program, "uv" );
+	_sprite.uniforms.uvOffset             = _gl.getUniformLocation( _sprite.program, "uvOffset" );
+	_sprite.uniforms.uvScale              = _gl.getUniformLocation( _sprite.program, "uvScale" );
+	_sprite.uniforms.rotation             = _gl.getUniformLocation( _sprite.program, "rotation" );
+	_sprite.uniforms.scale                = _gl.getUniformLocation( _sprite.program, "scale" );
+	_sprite.uniforms.alignment            = _gl.getUniformLocation( _sprite.program, "alignment" );
+	_sprite.uniforms.map                  = _gl.getUniformLocation( _sprite.program, "map" );
+	_sprite.uniforms.opacity              = _gl.getUniformLocation( _sprite.program, "opacity" );
+	_sprite.uniforms.useScreenCoordinates = _gl.getUniformLocation( _sprite.program, "useScreenCoordinates" );
+	_sprite.uniforms.affectedByDistance   = _gl.getUniformLocation( _sprite.program, "affectedByDistance" );
+	_sprite.uniforms.screenPosition    	  = _gl.getUniformLocation( _sprite.program, "screenPosition" );
+	_sprite.uniforms.modelViewMatrix      = _gl.getUniformLocation( _sprite.program, "modelViewMatrix" );
+	_sprite.uniforms.projectionMatrix     = _gl.getUniformLocation( _sprite.program, "projectionMatrix" );
 
 
 
@@ -3130,7 +3134,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 		
 		if ( scene.__webglSprites.length ) {
 			
-			renderSprites( scene );
+			renderSprites( scene, camera );
 			
 		}
 
@@ -3142,6 +3146,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 		}
 
+
 		// render lens flares
 
 		if ( scene.__webglLensFlares.length ) {
@@ -3300,6 +3305,154 @@ THREE.WebGLRenderer = function ( parameters ) {
 	}
 
 
+	/*
+	 * Render sprites
+	 * 
+	 */
+
+	function renderSprites( scene, camera ) {
+
+		var o, ol, object;
+		var attributes = _sprite.attributes;
+		var uniforms = _sprite.uniforms;
+		var anyCustom = false;
+		var invAspect = _viewportHeight / _viewportWidth;
+		var size, scale = [];
+		var screenPosition;
+		var halfViewportWidth = _viewportWidth * 0.5;
+		var halfViewportHeight = _viewportHeight * 0.5;
+		var mergeWith3D = true;
+		
+
+		// setup gl
+		
+		_gl.useProgram( _sprite.program );
+		_currentProgram = _sprite.program;
+		_oldBlending = "";
+
+		_gl.disable( _gl.CULL_FACE );
+		_gl.enable( _gl.BLEND );
+
+		_gl.bindBuffer( _gl.ARRAY_BUFFER, _sprite.vertexBuffer );
+		_gl.vertexAttribPointer( attributes.position, 2, _gl.FLOAT, false, 2 * 8, 0 );
+		_gl.vertexAttribPointer( attributes.uv, 2, _gl.FLOAT, false, 2 * 8, 8 );
+
+		_gl.bindBuffer( _gl.ELEMENT_ARRAY_BUFFER, _sprite.elementBuffer );
+		
+		_gl.uniformMatrix4fv( uniforms.projectionMatrix, false, _projectionMatrixArray );
+
+		_gl.activeTexture( _gl.TEXTURE0 );
+		_gl.uniform1i( uniforms.map, 0 );
+		
+		// update positions and sort
+		
+		for( o = 0, ol = scene.__webglSprites.length; o < ol; o++ ) {
+			
+			object = scene.__webglSprites[ o ];
+			
+			if( !object.useScreenCoordinates ) {
+			
+				object._modelViewMatrix.multiplyToArray( camera.matrixWorldInverse, object.matrixWorld, object._modelViewMatrixArray );
+				object.z = -object._modelViewMatrix.n34;
+			
+			} else {
+				
+				object.z = -object.position.z;
+				
+			}
+		
+		}
+
+		scene.__webglSprites.sort( painterSort );
+		
+
+		// render all non-custom shader sprites
+				
+		for( o = 0, ol = scene.__webglSprites.length; o < ol; o++ ) {
+
+			object = scene.__webglSprites[ o ];
+
+			if( object.material === undefined ) {
+
+				if( object.map && object.map.image && object.map.image.width ) {
+	
+					if( object.useScreenCoordinates ) {
+						
+						_gl.uniform1i( uniforms.useScreenCoordinates, 1 );
+						_gl.uniform3f( uniforms.screenPosition, ( object.position.x - halfViewportWidth  ) / halfViewportWidth, 
+														        ( halfViewportHeight - object.position.y ) / halfViewportHeight,
+														          object.position.z );
+						
+					} else {
+
+						
+
+						_gl.uniform1i( uniforms.useScreenCoordinates, 0 );
+						_gl.uniform1i( uniforms.affectedByDistance, object.affectedByDistance ? 1 : 0 );
+						_gl.uniformMatrix4fv( uniforms.modelViewMatrix, false, object._modelViewMatrixArray );
+						
+					}
+				
+					size = object.map.image.width / ( object.affectedByDistance ? 1 : _viewportHeight );
+					scale[ 0 ] = size * invAspect * object.scale.x;
+					scale[ 1 ] = size * object.scale.y;
+				
+					_gl.uniform2f( uniforms.uvScale, object.uvScale.x, object.uvScale.y );
+					_gl.uniform2f( uniforms.uvOffset, object.uvOffset.x, object.uvOffset.y );
+					_gl.uniform2f( uniforms.alignment, object.alignment.x, object.alignment.y );
+					_gl.uniform1f( uniforms.opacity, object.opacity );
+					_gl.uniform1f( uniforms.rotation, object.rotation );
+					_gl.uniform2fv( uniforms.scale, scale );
+
+					if( object.mergeWith3D && !mergeWith3D ) {
+						
+						_gl.enable( _gl.DEPTH_TEST );
+						_gl.depthMask( true );
+						
+						mergeWith3D = true;
+						
+					} else if( !object.mergeWith3D && mergeWith3D ) {
+						
+						_gl.disable( _gl.DEPTH_TEST );
+						_gl.depthMask( object.blending === THREE.NormalBlending ? true : false );
+
+						mergeWith3D = false;
+						
+					}
+	
+						_gl.depthMask( true );
+					setBlending( object.blending );
+					setTexture( object.map, 0 );
+			
+					_gl.drawElements( _gl.TRIANGLES, 6, _gl.UNSIGNED_SHORT, 0 );
+				}
+				
+			} else {
+				
+				anyCustom = true;
+				
+			}
+			
+		}
+
+
+		// loop through all custom
+
+/*		if( anyCustom ) {
+			
+		}
+*/
+
+		// restore gl
+
+		_gl.enable( _gl.CULL_FACE );
+		_gl.enable( _gl.DEPTH_TEST );
+		_gl.depthMask( _currentDepthMask );
+
+	}
+
+
+
 	/*
 	 * Render lens flares
 	 * Method: renders 16x16 0xff00ff-colored points scattered over the light source area, 
@@ -3383,16 +3536,17 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 			// screen cull 
 			
-			if(	screenPositionPixels[ 0 ] > 0 &&
+			if(	_lensFlare.hasVertexTexture ||
+			  ( screenPositionPixels[ 0 ] > 0 &&
 				screenPositionPixels[ 0 ] < _viewportWidth &&
 				screenPositionPixels[ 1 ] > 0 &&
-				screenPositionPixels[ 1 ] < _viewportHeight ) {
+				screenPositionPixels[ 1 ] < _viewportHeight )) {
 
 
 				// save current RGB to temp texture
 	
 				_gl.bindTexture( _gl.TEXTURE_2D, _lensFlare.tempTexture );
-				_gl.copyTexSubImage2D( _gl.TEXTURE_2D, 0, 0, 0, screenPositionPixels[ 0 ] - 8, screenPositionPixels[ 1 ] - 8, 16, 16 );
+				_gl.copyTexImage2D( _gl.TEXTURE_2D, 0, _gl.RGB, screenPositionPixels[ 0 ] - 8, screenPositionPixels[ 1 ] - 8, 16, 16, 0 );
 
 	
 				// render pink quad
@@ -3410,7 +3564,7 @@ THREE.WebGLRenderer = function ( parameters ) {
 				// copy result to occlusionMap
 	
 				_gl.bindTexture( _gl.TEXTURE_2D, _lensFlare.occlusionTexture );
-				_gl.copyTexSubImage2D( _gl.TEXTURE_2D, 0, 0, 0, screenPositionPixels[ 0 ] - 8, screenPositionPixels[ 1 ] - 8, 16, 16 );
+				_gl.copyTexImage2D( _gl.TEXTURE_2D, 0, _gl.RGBA, screenPositionPixels[ 0 ] - 8, screenPositionPixels[ 1 ] - 8, 16, 16, 0 );
 	
 	
 				// restore graphics
@@ -3538,11 +3692,11 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 		}
 
-		for ( var o = 0, ol = scene.__webglSprites.length; o < ol; o ++ ) {
+/*		for ( var o = 0, ol = scene.__webglSprites.length; o < ol; o ++ ) {
 
 			updateObject( scene.__webglSprites[ o ].object, scene );
 
-		}
+		}*/
 
 	};
 
@@ -3665,7 +3819,13 @@ THREE.WebGLRenderer = function ( parameters ) {
 
 			addBufferImmediate( scene.__webglObjectsImmediate, object );
 
-		}/*else if ( object instanceof THREE.Particle ) {
+		} else if ( object instanceof THREE.Sprite ) {
+			
+			scene.__webglSprites.push( object );
+		}
+		
+		
+		/*else if ( object instanceof THREE.Particle ) {
 
 		}*/
 
@@ -3775,10 +3935,13 @@ THREE.WebGLRenderer = function ( parameters ) {
 			if ( object == zobject ) {
 
 				scene.__webglObjects.splice( o, 1 );
+				return;
 
 			}
 
 		}
+		
+		// add shadwos/sprites etc.
 
 	};
 

src/renderers/WebGLShaders.js

@@ -602,13 +602,11 @@ THREE.ShaderLib = {
 									  "texture2D( occlusionMap, vec2( 0.1, 0.9 )) +",
 									  "texture2D( occlusionMap, vec2( 0.1, 0.5 )) +",
 									  "texture2D( occlusionMap, vec2( 0.5, 0.5 ));",
-/*
+
 					"vVisibility = (       visibility.r / 9.0 ) *",
 					              "( 1.0 - visibility.g / 9.0 ) *",
 					              "(       visibility.b / 9.0 ) *", 
 					              "( 1.0 - visibility.a / 9.0 );",
-*/
-					"vVisibility = ( 1.0 - visibility.a / 9.0 );",
 
 					"pos.x = cos( rotation ) * position.x - sin( rotation ) * position.y;",
 					"pos.y = sin( rotation ) * position.x + cos( rotation ) * position.y;",
@@ -638,7 +636,7 @@ THREE.ShaderLib = {
 			
 				"if( renderType == 0 ) {",
 							
-					"gl_FragColor = vec4( texture2D( map, vUV ).rgb, 0.0 );",
+					"gl_FragColor = vec4( 1.0, 0.0, 1.0, 0.0 );",
 				
 				// restore
 				
@@ -741,25 +739,46 @@ THREE.ShaderLib = {
 	'sprite': {
 		
 		vertexShader: [
-
-			"uniform 	vec3 	screenPosition;",
-			"uniform	vec2	scale;",
-			"uniform	float	rotation;",
+			"uniform	int		useScreenCoordinates;",
+			"uniform    int     affectedByDistance;",
+			"uniform	vec3	screenPosition;",
+			"uniform 	mat4 	modelViewMatrix;",
+			"uniform 	mat4 	projectionMatrix;",
+			"uniform    float   rotation;",
+			"uniform    vec2    scale;",
+			"uniform    vec2    alignment;",
+			"uniform    vec2    uvOffset;",
+			"uniform	vec2    uvScale;",
 
 			"attribute 	vec2 	position;",
-			"attribute  vec2	UV;",
+			"attribute  vec2	uv;",
 
 			"varying	vec2	vUV;",
 	
 			"void main(void)",
 			"{",
-				"vUV = UV;",
+				"vUV = uvOffset + uv * uvScale;",
 
-				"vec2 pos;",
-				"pos.x = cos( rotation ) * position.x - sin( rotation ) * position.y;",
-				"pos.y = sin( rotation ) * position.x + cos( rotation ) * position.y;",
+				"vec2 alignedPosition = position + alignment;",
+			
+				"vec2 rotatedPosition;",
+				"rotatedPosition.x = ( cos( rotation ) * alignedPosition.x - sin( rotation ) * alignedPosition.y ) * scale.x;",
+				"rotatedPosition.y = ( sin( rotation ) * alignedPosition.x + cos( rotation ) * alignedPosition.y ) * scale.y;",
+
+				"vec4 finalPosition;",
 				
-				"gl_Position = vec4(( pos * scale + screenPosition.xy ).xy, screenPosition.z, 1.0 );",
+				"if( useScreenCoordinates != 0 ) {",
+				
+					"finalPosition = vec4( screenPosition.xy + rotatedPosition, screenPosition.z, 1.0 );",
+				
+				"} else {",
+				
+					"finalPosition = projectionMatrix * modelViewMatrix * vec4( 0.0, 0.0, 0.0, 1.0 );",
+					"finalPosition.xy += rotatedPosition * ( affectedByDistance == 1 ? 1.0 : finalPosition.z );",
+
+				"}",
+
+				"gl_Position = finalPosition;",
 			"}"
 
 		].join( "\n" ),
@@ -780,6 +799,7 @@ THREE.ShaderLib = {
 				"vec4 color = texture2D( map, vUV );",
 				"color.a *= opacity;",
 				"gl_FragColor = color;",
+//				"gl_FragColor = vec4( 1.0, 0.0, 1.0, 1.0 );",
 			"}"
 		].join( "\n" )
 

utils/build.py

@@ -64,6 +64,7 @@ COMMON_FILES = [
 'objects/Sound.js',
 'objects/LOD.js',
 'objects/ShadowVolume.js',
+'objects/Sprite.js',
 'scenes/Scene.js',
 'scenes/Fog.js',
 'scenes/FogExp2.js',

utils/exporters/blender/2.56/scripts/op/io_mesh_threejs/export_threejs.py

@@ -135,7 +135,7 @@ TEMPLATE_OBJECT = """\
         "rotation"  : %(rotation)s,
         "quaternion": %(quaternion)s,
         "scale"     : %(scale)s,
-        "visible"       : true,
+        "visible"       : %(visible)s,
         "castsShadow"   : %(castsShadow)s,
         "meshCollider"  : %(meshCollider)s
     }"""
@@ -994,9 +994,13 @@ def generate_objects(data):
             if len(group_ids) > 0:
                 group_string = generate_string_list(group_ids)
 
-            castsShadow = generate_bool_property(obj.THREE_castsShadow)
-            meshCollider = generate_bool_property(obj.THREE_meshCollider)
+            castsShadow = obj.THREE_castsShadow
+            meshCollider = obj.THREE_meshCollider
                 
+            visible = True
+            if obj.draw_type in ["BOUNDS", "WIRE"] and meshCollider:
+                visible = False
+            
             object_string = TEMPLATE_OBJECT % {
             "object_id"   : generate_string(object_id),
             "geometry_id" : generate_string(geometry_id),
@@ -1008,8 +1012,9 @@ def generate_objects(data):
             "quaternion"  : generate_vec4(quaternion),
             "scale"       : generate_vec3(scale),
 
-            "castsShadow"  : castsShadow,
-            "meshCollider" : meshCollider
+            "castsShadow"  : generate_bool_property(castsShadow),
+            "meshCollider" : generate_bool_property(meshCollider),
+            "visible"      : generate_bool_property(visible)
             }
             chunks.append(object_string)