r65

docs/api/cameras/Camera.html

@@ -19,7 +19,7 @@
 
 		<h3>[name]()</h3>
 		<div>
-			This constructor sets the following properties to the correct type: matrixWorldInverse, projectionMatrix and projectionMatrixInverse.
+			This constructor sets the following properties to the correct type: matrixWorldInverse and projectionMatrix.
 			
 		</div>
 
@@ -30,10 +30,7 @@
 		<div>This is the inverse of matrixWorld. MatrixWorld contains the Matrix which has the world transform of the Camera.</div>
 
 		<h3>.[page:Matrix4 projectionMatrix]</h3>
-		<div>This is the matrix which contains the projection.</div>		
-
-		<h3>.[page:Matrix4 projectionMatrixInverse]</h3>
-		<div>This is the inverse of projectionMatrix.</div>
+		<div>This is the matrix which contains the projection.</div>
 
 
 		<h2>Methods</h2>

docs/api/cameras/PerspectiveCamera.html

@@ -22,7 +22,6 @@ scene.add( camera );</code>
 
 		<h2>Constructor</h2>
 
-
 		<h3>[name]( [page:Float fov], [page:Float aspect], [page:Float near], [page:Float far] )</h3>
 		<div>
 		fov — Camera frustum vertical field of view.<br />

docs/api/core/Geometry.html

@@ -242,7 +242,7 @@
 		<h3>.dispose()</h3>
 		<div>
 		Removes The object from memory. <br />
-		Don't forget to call this method when you remove an geometry because it can cuase meomory leaks. 
+		Don't forget to call this method when you remove a geometry because it can cause memory leaks. 
 		</div>
 
 		<h3>.computeLineDistances()</h3>

docs/api/core/Object3D.html

@@ -48,7 +48,7 @@
 		Object's local position.
 		</div>
 
-		<h3>.[page:Vector3 rotation]</h3>
+		<h3>.[page:Euler rotation]</h3>
 		<div>
 		Object's local rotation (<a href="https://en.wikipedia.org/wiki/Euler_angles" target="_blank">Euler angles</a>), in radians.
 		</div>

docs/api/extras/helpers/ArrowHelper.html

@@ -12,15 +12,28 @@
 		<div class="desc">todo</div>
 
 
+		<h2>Example</h2>
+
+		<code>var dir = new THREE.Vector3( 1, 0, 0 );
+		var origin = new THREE.Vector3( 0, 0, 0 );
+		var length = 1;
+		var hex = 0xffff00;
+
+		var arrowHelper = new THREE.ArrowHelper( dir, origin, length, hex );
+		scene.add( arrowHelper );
+		</code>
+
+
+
 		<h2>Constructor</h2>
 
 
 		<h3>[name]([page:todo dir], [page:todo origin], [page:todo length], [page:todo hex])</h3>
 		<div>
-		dir -- todo <br />
-		origin -- todo <br />
-		length -- todo <br />
-		hex -- todo
+		dir -- Vector3 -- direction from origin <br />
+		origin -- Vector3 <br />
+		length -- scalar <br />
+		hex -- hexadecimal value to define color ex:0xffff00
 		</div>
 		<div>
 		todo

docs/api/extras/helpers/AxisHelper.html

@@ -12,12 +12,18 @@
 		<div class="desc">todo</div>
 
 
+		<h2>Example</h2>
+
+                <code>var axisHelper = new THREE.AxisHelper( 5 );
+		scene.add( axisHelper );
+                </code>
+
 		<h2>Constructor</h2>
 
 
 		<h3>[name]([page:todo size])</h3>
 		<div>
-		size -- todo
+		size -- Define the size of the helper
 		</div>
 		<div>
 		todo

docs/api/extras/helpers/GridHelper.html

@@ -12,9 +12,21 @@
 		<div class="desc">todo</div>
 
 
-		<h2>Constructor</h2>
+		<h2>Example</h2>
+
+		<code>var size = 10;
+		var step = 1;
+		var gridHelper = new THREE.GridHelper( size, step );
+		
+		gridHelper.position = new THREE.Vector3( 10, 10, 0 );
+		gridHelper.rotation = new THREE.Euler( 15, 0, 0 );
+		
+		scene.add( gridHelper );
+		</code>
 
 
+		<h2>Constructor</h2>
+
 		<h3>[name]([page:todo size], [page:todo step])</h3>
 		<div>
 		size -- todo <br />

docs/api/extras/helpers/HemisphereLightHelper.html

@@ -14,7 +14,6 @@
 
 		<h2>Constructor</h2>
 
-
 		<h3>[name]([page:todo light], [page:todo sphereSize], [page:todo arrowLength], [page:todo domeSize])</h3>
 		<div>
 		light -- todo <br />
@@ -29,7 +28,6 @@
 
 		<h2>Properties</h2>
 
-
 		<h3>.[page:Mesh lightSphere]</h3>
 		<div>
 		todo
@@ -43,12 +41,12 @@
 
 		<h2>Methods</h2>
 
-
 		<h3>.update() [page:todo]</h3>
 		<div>
 		todo
 		</div>
 
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/extras/helpers/PointLightHelper.html

@@ -9,12 +9,23 @@
 	<body>
 		<h1>[name]</h1>
 
-		<div class="desc">todo</div>
+		<div class="desc">This display a helper for a pointLight </div>
 
 
-		<h2>Constructor</h2>
+		<h2>Example</h2>
+
+		<code>var pointLight = new THREE.PointLight( 0xff0000, 1, 100 );
+		pointLight.position.set( 10, 10, 10 );
+		scene.add( pointLight );
+		
+		var sphereSize = 1;
+		var pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
+		scene.add( pointLightHelper );
+		</code>
 
 
+		<h2>Constructor</h2>
+
 		<h3>[name]([page:todo light], [page:todo sphereSize])</h3>
 		<div>
 		light -- todo <br />
@@ -27,7 +38,6 @@
 
 		<h2>Properties</h2>
 
-
 		<h3>.[page:Mesh lightSphere]</h3>
 		<div>
 		todo
@@ -38,8 +48,8 @@
 		todo
 		</div> 
 
-		<h2>Methods</h2>
 
+		<h2>Methods</h2>
 
 		<h3>.update() [page:todo]</h3>
 		<div>

docs/api/materials/LineBasicMaterial.html

@@ -25,7 +25,7 @@
 		linewidth — Line thickness. Default is 1.<br />
 		linecap — Define appearance of line ends. Default is 'round'.<br />
 		linejoin — Define appearance of line joints. Default is 'round'.<br />
-		vertexColors — Define whether the material uses vertex colors, or not. Default is false.<br />
+		vertexColors — Define how the vertices gets colored. Default is THREE.NoColors.<br />
 		fog — Define whether the material color is affected by global fog settings. Default is false.
 		</div>
 
@@ -46,9 +46,9 @@
 		<div>Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.</div>
 		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:WebGLRenderer WebGL] renderer, but does work with the [page:CanvasRenderer Canvas] renderer.</div>
 
-		<h3>.[page:Boolean vertexColors]</h3>
-		<div>Define whether the material uses vertex colors, or not. Default is false.</div>
-		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:CanvasRenderer Canvas] renderer, but does work with the [page:WebGLRenderer WebGL] renderer.</div>
+		<h3>.[page:Integer vertexColors]</h3>
+		<div>Define how the vertices gets colored. Possible values are THREE.NoColors, THREE.FaceColors and THREE.VertexColors. Default is THREE.NoColors.</div>
+		<div>This setting might not have any effect when used with certain renderers.</div>
 
 		<h3>.[page:Boolean fog]</h3>
 		<div>Define whether the material color is affected by global fog settings.</div>

docs/api/materials/MeshBasicMaterial.html

@@ -28,7 +28,7 @@
 		wireframeLinecap — Define appearance of line ends. Default is 'round'.<br />
 		wireframeLinejoin — Define appearance of line joints. Default is 'round'.<br />
 		shading — Define shading type. Default is THREE.SmoothShading.<br />
-		vertexColors — Define whether the material uses vertex colors, or not. Default is false.<br />
+		vertexColors — Define how the vertices gets colored. Default is THREE.NoColors.<br />
 		fog — Define whether the material color is affected by global fog settings. Default is true.<br />
 		lightMap — Set light map. Default is null.<br />
 		specularMap — Set specular map. Default is null.<br />
@@ -60,8 +60,8 @@
 		<h3>.[page:String shading]</h3>
 		<div>Define shading type. Default is THREE.SmoothShading.</div>
 
-		<h3>.[page:Boolean vertexColors]</h3>
-		<div>Define whether the material uses vertex colors, or not. Default is false.</div>
+		<h3>.[page:Integer vertexColors]</h3>
+		<div>Define how the vertices gets colored. Possible values are THREE.NoColors, THREE.FaceColors and THREE.VertexColors. Default is THREE.NoColors.</div>
 		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:CanvasRenderer Canvas] renderer, but does work with the [page:WebGLRenderer WebGL] renderer.</div>
 
 		<h3>.[page:Boolean fog]</h3>

docs/api/materials/MeshLambertMaterial.html

@@ -64,8 +64,8 @@
 		<div>Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.</div>
 		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:WebGLRenderer WebGL] renderer, but does work with the [page:CanvasRenderer Canvas] renderer.</div>
 
-		<h3>.[page:Boolean vertexColors]</h3>
-		<div>Define whether the material uses vertex colors, or not. Default is *false*.</div>
+		<h3>.[page:Integer vertexColors]</h3>
+		<div>Define how the vertices gets colored. Possible values are THREE.NoColors, THREE.FaceColors and THREE.VertexColors. Default is THREE.NoColors.</div>
 		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:CanvasRenderer Canvas] renderer, but does work with the [page:WebGLRenderer WebGL] renderer.</div>
 
 		<h3>.[page:Boolean fog]</h3>

docs/api/materials/MeshPhongMaterial.html

@@ -74,8 +74,8 @@
 		<div>Define appearance of line joints. Possible values are "round", "bevel" and "miter". Default is 'round'.</div>
 		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:WebGLRenderer WebGL] renderer, but does work with the [page:CanvasRenderer Canvas] renderer.</div>
 
-		<h3>.[page:Boolean vertexColors]</h3>
-		<div>Define whether the material uses vertex colors, or not. Default is *false*.</div>
+		<h3>.[page:Integer vertexColors]</h3>
+		<div>Define how the vertices gets colored. Possible values are THREE.NoColors, THREE.FaceColors and THREE.VertexColors. Default is THREE.NoColors.</div>
 		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:CanvasRenderer Canvas] renderer, but does work with the [page:WebGLRenderer WebGL] renderer.</div>
 
 		<h3>.[page:Boolean fog]</h3>

docs/api/materials/ParticleSystemMaterial.html

@@ -48,8 +48,6 @@
 		<div>Specify whether particles' size will get smaller with the distance. Default is true.</div>
 
 		<h3>.[page:Boolean vertexColors]</h3>
-		<div>Define whether the material uses vertex colors, or not. Default is false.</div>
-		<div>This setting might not have any effect when used with certain renderers. For example, it is ignored with the [page:CanvasRenderer Canvas] renderer, but does work with the [page:WebGLRenderer WebGL] renderer.</div>
 
 		<h3>.[page:Boolean fog]</h3>
 		<div>Define whether the material color is affected by global fog settings.</div>

docs/api/materials/ShaderMaterial.html

@@ -57,7 +57,7 @@
 
 		<h3>.[page:string vertexShader]</h3>
 		<div>
-		Vertex shader GLSL code.  This is the actual code for the shader.  In the example above the code is retrieved from DOM elements emnbedded directly in the page although other methods can be used including specifying a string directly.  
+		Vertex shader GLSL code.  This is the actual code for the shader.  In the example above the code is retrieved from DOM elements embedded directly in the page although other methods can be used including specifying a string directly.  
 		</div> 
 
 		<h3>.[page:boolean morphTargets]</h3>

docs/api/renderers/WebGLRenderer.html

@@ -87,11 +87,6 @@
 		<div>Default is false. TODO</div>
 
 
-		<h3>.[page:Boolean physicallyBasedShading]</h3>
-
-		<div>Default is false. TODO</div>
-
-
 		<h3>.[page:Boolean shadowMapEnabled]</h3>
 
 		<div>Default is false. TODO</div>

editor/js/Editor.js

@@ -292,7 +292,17 @@ Editor.prototype = {
 	select: function ( object ) {
 
 		this.selected = object;
-		this.config.setKey( 'selected', object.uuid );
+
+		if ( object !== null ) {
+
+			this.config.setKey( 'selected', object.uuid );
+
+		} else {
+
+			this.config.setKey( 'selected', null );
+
+		}
+
 		this.signals.objectSelected.dispatch( object );
 
 	},

editor/js/Menubar.File.js

@@ -69,37 +69,37 @@ Menubar.File = function ( editor ) {
 	option.setTextContent( 'Export Geometry' );
 	option.onClick( function () {
 
-		var geometry = editor.selected.geometry;
+		var object = editor.selected;
 
-		if ( geometry instanceof THREE.BufferGeometry ) {
+		if ( object === null ) {
 
-			exportGeometry( THREE.BufferGeometryExporter );
+			alert( 'No object selected.' );
+			return;
 
-		} else if ( geometry instanceof THREE.Geometry ) {
+		}
 
-			exportGeometry( THREE.GeometryExporter );
+		var geometry = object.geometry;
+
+		if ( geometry === undefined ) {
+
+			alert( 'The selected object doesn\'t have geometry.' );
+			return;
 
 		}
 
-	} );
-	options.add( option );
+		if ( geometry instanceof THREE.BufferGeometry ) {
 
-	/*
+			exportGeometry( THREE.BufferGeometryExporter );
 
-	// export scene
+		} else if ( geometry instanceof THREE.Geometry ) {
 
-	var option = new UI.Panel();
-	option.setClass( 'option' );
-	option.setTextContent( 'Export Scene' );
-	option.onClick( function () {
+			exportGeometry( THREE.GeometryExporter );
 
-		exportScene( THREE.SceneExporter );
+		}
 
 	} );
 	options.add( option );
 
-	*/
-
 	// export object
 
 	var option = new UI.Panel();
@@ -107,6 +107,13 @@ Menubar.File = function ( editor ) {
 	option.setTextContent( 'Export Object' );
 	option.onClick( function () {
 
+		if ( editor.selected === null ) {
+
+			alert( 'No object selected' );
+			return;
+
+		}
+
 		exportObject( THREE.ObjectExporter );
 
 	} );
@@ -139,19 +146,12 @@ Menubar.File = function ( editor ) {
 	var exportGeometry = function ( exporterClass ) {
 
 		var object = editor.selected;
-
-		if ( object.geometry === undefined ) {
-
-			alert( "Selected object doesn't have any geometry" );
-			return;
-
-		}
-
 		var exporter = new exporterClass();
 
 		var output;
 
-		if ( exporter instanceof THREE.BufferGeometryExporter || exporter instanceof THREE.GeometryExporter ) {
+		if ( exporter instanceof THREE.BufferGeometryExporter ||
+		     exporter instanceof THREE.GeometryExporter ) {
 
 			output = JSON.stringify( exporter.parse( object.geometry ), null, '\t' );
 			output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );
@@ -172,9 +172,8 @@ Menubar.File = function ( editor ) {
 
 	var exportObject = function ( exporterClass ) {
 
-		var exporter = new exporterClass();
-
 		var object = editor.selected;
+		var exporter = new exporterClass();
 
 		var output = JSON.stringify( exporter.parse( object ), null, '\t' );
 		output = output.replace( /[\n\t]+([\d\.e\-\[\]]+)/g, '$1' );

editor/js/Viewport.js

@@ -139,7 +139,7 @@ var Viewport = function ( editor ) {
 
 			} else {
 
-				editor.select( camera );
+				editor.select( null );
 
 			}
 

examples/canvas_geometry_panorama.html

@@ -47,6 +47,7 @@
 			target = new THREE.Vector3();
 
 			init();
+			animate();
 
 			function init() {
 
@@ -107,8 +108,6 @@
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				render();
-
 			}
 
 			function loadTexture( path ) {
@@ -119,10 +118,8 @@
 				var image = new Image();
 				image.onload = function () {
 
+					texture.image = this;
 					texture.needsUpdate = true;
-					material.map.image = this;
-
-					render();
 
 				};
 				image.src = path;
@@ -147,11 +144,10 @@
 
 			function onDocumentMouseMove( event ) {
 
-				if ( isUserInteracting ) {
+				if ( isUserInteracting === true ) {
 
 					lon = ( onPointerDownPointerX - event.clientX ) * 0.1 + onPointerDownLon;
 					lat = ( event.clientY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;
-					render();
 
 				}
 
@@ -160,7 +156,6 @@
 			function onDocumentMouseUp( event ) {
 
 				isUserInteracting = false;
-				render();
 
 			}
 
@@ -169,8 +164,6 @@
 				camera.fov -= event.wheelDeltaY * 0.05;
 				camera.updateProjectionMatrix();
 
-				render();
-
 			}
 
 
@@ -199,13 +192,24 @@
 					lon = ( onPointerDownPointerX - event.touches[0].pageX ) * 0.1 + onPointerDownLon;
 					lat = ( event.touches[0].pageY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;
 
-					render();
-
 				}
 
 			}
 
-			function render() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+				update();
+
+			}
+
+			function update() {
+
+				if ( isUserInteracting === false ) {
+
+					lon += 0.1;
+
+				}
 
 				lat = Math.max( - 85, Math.min( 85, lat ) );
 				phi = THREE.Math.degToRad( 90 - lat );

examples/canvas_geometry_panorama_fisheye.html

@@ -47,6 +47,7 @@
 			target = new THREE.Vector3();
 
 			init();
+			animate();
 
 			function init() {
 
@@ -117,8 +118,6 @@
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				render();
-
 			}
 
 			function loadTexture( path ) {
@@ -129,10 +128,8 @@
 				var image = new Image();
 				image.onload = function () {
 
+					texture.image = this;
 					texture.needsUpdate = true;
-					material.map.image = this;
-
-					render();
 
 				};
 				image.src = path;
@@ -157,11 +154,10 @@
 
 			function onDocumentMouseMove( event ) {
 
-				if ( isUserInteracting ) {
+				if ( isUserInteracting === true ) {
 
 					lon = ( onPointerDownPointerX - event.clientX ) * 0.1 + onPointerDownLon;
 					lat = ( event.clientY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;
-					render();
 
 				}
 			}
@@ -169,7 +165,6 @@
 			function onDocumentMouseUp( event ) {
 
 				isUserInteracting = false;
-				render();
 
 			}
 
@@ -197,11 +192,8 @@
 
 				camera.updateProjectionMatrix();
 
-				render();
-
 			}
 
-
 			function onDocumentTouchStart( event ) {
 
 				if ( event.touches.length == 1 ) {
@@ -227,13 +219,24 @@
 					lon = ( onPointerDownPointerX - event.touches[0].pageX ) * 0.1 + onPointerDownLon;
 					lat = ( event.touches[0].pageY - onPointerDownPointerY ) * 0.1 + onPointerDownLat;
 
-					render();
-
 				}
 
 			}
 
-			function render() {
+			function animate() {
+
+				requestAnimationFrame( animate );
+				update();
+
+			}
+
+			function update() {
+
+				if ( isUserInteracting === false ) {
+
+					lon += 0.1;
+
+				}
 
 				lat = Math.max( - 85, Math.min( 85, lat ) );
 				phi = THREE.Math.degToRad( 90 - lat );
@@ -243,9 +246,7 @@
 				target.y = 500 * Math.cos( phi );
 				target.z = 500 * Math.sin( phi ) * Math.sin( theta );
 
-				camera.position.x = - target.x;
-				camera.position.y = - target.y;
-				camera.position.z = - target.z;
+				camera.position.copy( target ).negate();
 				camera.lookAt( target );
 
 				renderer.render( scene, camera );

examples/canvas_interactive_voxelpainter.html

@@ -24,11 +24,14 @@
 			var container, stats;
 			var camera, scene, renderer;
 			var projector, plane;
+
 			var mouse2D, mouse3D, raycaster, theta = 45,
 			isShiftDown = false, isCtrlDown = false,
 			target = new THREE.Vector3( 0, 200, 0 );
 			var normalMatrix = new THREE.Matrix3();
-			var ROLLOVERED;
+
+			var cubeGeometry = new THREE.CubeGeometry( 50, 50, 50 );
+			var cubeMaterial = new THREE.MeshLambertMaterial( { color: 0x00ff80, overdraw: 0.5 } );
 
 			init();
 			animate();
@@ -82,6 +85,8 @@
 				plane.visible = false;
 				scene.add( plane );
 
+				var material = new THREE.MeshBasicMaterial( { color: 0xff0000, wireframe: true } );
+
 				mouse2D = new THREE.Vector3( 0, 10000, 0.5 );
 
 				// Lights
@@ -144,10 +149,7 @@
 
 				if ( intersects.length > 0 ) {
 
-					if ( ROLLOVERED ) ROLLOVERED.color.setHex( 0x00ff80 );
-
-					ROLLOVERED = intersects[ 0 ].face;
-					ROLLOVERED.color.setHex( 0xff8000 )
+					// TODO
 
 				}
 
@@ -180,17 +182,7 @@
 
 						var position = new THREE.Vector3().addVectors( intersect.point, normal );
 
-						var geometry = new THREE.CubeGeometry( 50, 50, 50 );
-
-						for ( var i = 0; i < geometry.faces.length; i ++ ) {
-
-							geometry.faces[ i ].color.setHex( 0x00ff80 );
-
-						}
-
-						var material = new THREE.MeshLambertMaterial( { vertexColors: THREE.FaceColors } );
-
-						var voxel = new THREE.Mesh( geometry, material );
+						var voxel = new THREE.Mesh( cubeGeometry, cubeMaterial );
 						voxel.position.x = Math.floor( position.x / 50 ) * 50 + 25;
 						voxel.position.y = Math.floor( position.y / 50 ) * 50 + 25;
 						voxel.position.z = Math.floor( position.z / 50 ) * 50 + 25;

examples/canvas_morphtargets_horse.html

@@ -0,0 +1,161 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<title>three.js canvas - morph targets - horse</title>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+		<style>
+			body {
+				font-family: Monospace;
+				background-color: #f0f0f0;
+				margin: 0px;
+				overflow: hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<script src="../build/three.min.js"></script>
+
+		<script src="js/libs/stats.min.js"></script>
+
+		<script>
+
+			var container, stats;
+			var camera, scene, projector, renderer;
+			var mesh;
+
+			init();
+			animate();
+
+			function init() {
+
+				container = document.createElement( 'div' );
+				document.body.appendChild( container );
+
+				var info = document.createElement( 'div' );
+				info.style.position = 'absolute';
+				info.style.top = '10px';
+				info.style.width = '100%';
+				info.style.textAlign = 'center';
+				info.innerHTML = '<a href="http://threejs.org" target="_blank">three.js</a> canvas - morph targets - horse. model by <a href="http://mirada.com/">mirada</a> from <a href="http://ro.me">rome</a>';
+				container.appendChild( info );
+
+				//
+
+				camera = new THREE.PerspectiveCamera( 50, window.innerWidth / window.innerHeight, 1, 10000 );
+				camera.position.y = 300;
+				camera.target = new THREE.Vector3( 0, 150, 0 );
+
+				scene = new THREE.Scene();
+
+				//
+
+				var light = new THREE.DirectionalLight( 0xefefff, 2 );
+				light.position.set( 1, 1, 1 ).normalize();
+				scene.add( light );
+
+				var light = new THREE.DirectionalLight( 0xffefef, 2 );
+				light.position.set( -1, -1, -1 ).normalize();
+				scene.add( light );
+
+				var loader = new THREE.JSONLoader( true );
+				loader.load( "models/animated/horse.js", function( geometry ) {
+
+					mesh = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: 0x606060, morphTargets: true, overdraw: 0.5 } ) );
+					mesh.scale.set( 1.5, 1.5, 1.5 );
+					scene.add( mesh );
+
+				} );
+
+				//
+
+				renderer = new THREE.CanvasRenderer();
+				renderer.setClearColor( 0xf0f0f0 );
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+				container.appendChild(renderer.domElement);
+
+				//
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				container.appendChild( stats.domElement );
+
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			var radius = 600;
+			var theta = 0;
+
+			var duration = 1000;
+			var keyframes = 15, interpolation = duration / keyframes;
+			var lastKeyframe = 0, currentKeyframe = 0;
+
+			function render() {
+
+				theta += 0.1;
+
+				camera.position.x = radius * Math.sin( THREE.Math.degToRad( theta ) );
+				camera.position.z = radius * Math.cos( THREE.Math.degToRad( theta ) );
+
+				camera.lookAt( camera.target );
+
+				if ( mesh ) {
+
+					// Alternate morph targets
+
+					var time = Date.now() % duration;
+
+					var keyframe = Math.floor( time / interpolation );
+
+					if ( keyframe != currentKeyframe ) {
+
+						mesh.morphTargetInfluences[ lastKeyframe ] = 0;
+						mesh.morphTargetInfluences[ currentKeyframe ] = 1;
+						mesh.morphTargetInfluences[ keyframe ] = 0;
+
+						lastKeyframe = currentKeyframe;
+						currentKeyframe = keyframe;
+
+						// console.log( mesh.morphTargetInfluences );
+
+					}
+
+					mesh.morphTargetInfluences[ keyframe ] = ( time % interpolation ) / interpolation;
+					mesh.morphTargetInfluences[ lastKeyframe ] = 1 - mesh.morphTargetInfluences[ keyframe ];
+
+				}
+
+				renderer.render( scene, camera );
+
+			}
+
+		</script>
+
+	</body>
+</html>

examples/index.html

@@ -199,7 +199,6 @@
 				"webgl_materials_lightmap",
 				"webgl_materials_normalmap",
 				"webgl_materials_normalmap2",
-				"webgl_materials_shaders",
 				"webgl_materials_shaders_fresnel",
 				"webgl_materials_skin",
 				"webgl_materials_texture_anisotropy",
@@ -243,6 +242,7 @@
 				"webgl_sandbox",
 				"webgl_shader",
 				"webgl_shader2",
+				"webgl_shaders_ocean",
 				"webgl_shader_lava",
 				"webgl_shading_physical",
 				"webgl_shadowmap",
@@ -281,6 +281,7 @@
 				"misc_lookat",
 				"misc_sound",
 				"misc_ubiquity_test",
+				"misc_ubiquity_test2",
 				"misc_uv_tests"
 			],
 			"canvas": [
@@ -312,6 +313,7 @@
 				"canvas_materials_normal",
 				"canvas_materials_reflection",
 				"canvas_materials_video",
+				"canvas_morphtargets_horse",
 				"canvas_particles_floor",
 				"canvas_particles_random",
 				"canvas_particles_shapes",

examples/js/BufferGeometryUtils.js

@@ -20,6 +20,7 @@ THREE.BufferGeometryUtils = {
 		var faceVertexUvs = geometry.faceVertexUvs;
 		var vertexColors = settings.vertexColors;
 		var hasFaceVertexUv = faceVertexUvs[ 0 ].length > 0;
+		var hasFaceVertexNormals = faces[ 0 ].vertexNormals.length == 3;
 
 		var bufferGeometry = new THREE.BufferGeometry();
 
@@ -83,21 +84,41 @@ THREE.BufferGeometryUtils = {
 			positions[ i3 + 7 ] = c.y;
 			positions[ i3 + 8 ] = c.z;
 
-			var na = face.vertexNormals[ 0 ];
-			var nb = face.vertexNormals[ 1 ];
-			var nc = face.vertexNormals[ 2 ];
+			if ( hasFaceVertexNormals === true ) {
 
-			normals[ i3     ] = na.x;
-			normals[ i3 + 1 ] = na.y;
-			normals[ i3 + 2 ] = na.z;
+				var na = face.vertexNormals[ 0 ];
+				var nb = face.vertexNormals[ 1 ];
+				var nc = face.vertexNormals[ 2 ];
 
-			normals[ i3 + 3 ] = nb.x;
-			normals[ i3 + 4 ] = nb.y;
-			normals[ i3 + 5 ] = nb.z;
+				normals[ i3     ] = na.x;
+				normals[ i3 + 1 ] = na.y;
+				normals[ i3 + 2 ] = na.z;
 
-			normals[ i3 + 6 ] = nc.x;
-			normals[ i3 + 7 ] = nc.y;
-			normals[ i3 + 8 ] = nc.z;
+				normals[ i3 + 3 ] = nb.x;
+				normals[ i3 + 4 ] = nb.y;
+				normals[ i3 + 5 ] = nb.z;
+
+				normals[ i3 + 6 ] = nc.x;
+				normals[ i3 + 7 ] = nc.y;
+				normals[ i3 + 8 ] = nc.z;
+
+			} else {
+
+				var n = face.normal;
+
+				normals[ i3     ] = n.x;
+				normals[ i3 + 1 ] = n.y;
+				normals[ i3 + 2 ] = n.z;
+
+				normals[ i3 + 3 ] = n.x;
+				normals[ i3 + 4 ] = n.y;
+				normals[ i3 + 5 ] = n.z;
+
+				normals[ i3 + 6 ] = n.x;
+				normals[ i3 + 7 ] = n.y;
+				normals[ i3 + 8 ] = n.z;
+
+			}
 
 			if ( vertexColors === THREE.FaceColors ) {
 

examples/js/ShaderSkin.js

@@ -36,10 +36,10 @@ THREE.ShaderSkin = {
 			"tDiffuse"	: { type: "t", value: null },
 			"tBeckmann"	: { type: "t", value: null },
 
-			"uDiffuseColor":  { type: "c", value: new THREE.Color( 0xeeeeee ) },
-			"uSpecularColor": { type: "c", value: new THREE.Color( 0x111111 ) },
-			"uAmbientColor":  { type: "c", value: new THREE.Color( 0x050505 ) },
-			"uOpacity": 	  { type: "f", value: 1 },
+			"diffuse":  { type: "c", value: new THREE.Color( 0xeeeeee ) },
+			"specular": { type: "c", value: new THREE.Color( 0x111111 ) },
+			"ambient":  { type: "c", value: new THREE.Color( 0x050505 ) },
+			"opacity": 	  { type: "f", value: 1 },
 
 			"uRoughness": 	  		{ type: "f", value: 0.15 },
 			"uSpecularBrightness": 	{ type: "f", value: 0.75 },
@@ -65,10 +65,10 @@ THREE.ShaderSkin = {
 			"uniform bool enableBump;",
 			"uniform bool enableSpecular;",
 
-			"uniform vec3 uAmbientColor;",
-			"uniform vec3 uDiffuseColor;",
-			"uniform vec3 uSpecularColor;",
-			"uniform float uOpacity;",
+			"uniform vec3 ambient;",
+			"uniform vec3 diffuse;",
+			"uniform vec3 specular;",
+			"uniform float opacity;",
 
 			"uniform float uRoughness;",
 			"uniform float uSpecularBrightness;",
@@ -159,7 +159,7 @@ THREE.ShaderSkin = {
 
 			"void main() {",
 
-				"gl_FragColor = vec4( vec3( 1.0 ), uOpacity );",
+				"gl_FragColor = vec4( vec3( 1.0 ), opacity );",
 
 				"vec4 colDiffuse = texture2D( tDiffuse, vUv );",
 				"colDiffuse.rgb *= colDiffuse.rgb;",
@@ -215,8 +215,8 @@ THREE.ShaderSkin = {
 
 						"float pointSpecularWeight = KS_Skin_Specular( normal, lVector, viewPosition, uRoughness, uSpecularBrightness );",
 
-						"pointTotal    += lDistance * uDiffuseColor * pointLightColor[ i ] * pointDiffuseWeight;",
-						"specularTotal += lDistance * uSpecularColor * pointLightColor[ i ] * pointSpecularWeight * specularStrength;",
+						"pointTotal    += lDistance * diffuse * pointLightColor[ i ] * pointDiffuseWeight;",
+						"specularTotal += lDistance * specular * pointLightColor[ i ] * pointSpecularWeight * specularStrength;",
 
 					"}",
 
@@ -240,8 +240,8 @@ THREE.ShaderSkin = {
 
 						"float dirSpecularWeight =  KS_Skin_Specular( normal, dirVector, viewPosition, uRoughness, uSpecularBrightness );",
 
-						"dirTotal 	   += uDiffuseColor * directionalLightColor[ i ] * dirDiffuseWeight;",
-						"specularTotal += uSpecularColor * directionalLightColor[ i ] * dirSpecularWeight * specularStrength;",
+						"dirTotal 	   += diffuse * directionalLightColor[ i ] * dirDiffuseWeight;",
+						"specularTotal += specular * directionalLightColor[ i ] * dirSpecularWeight * specularStrength;",
 
 					"}",
 
@@ -261,7 +261,7 @@ THREE.ShaderSkin = {
 						"float dotProduct = dot( normal, lVector );",
 						"float hemiDiffuseWeight = 0.5 * dotProduct + 0.5;",
 
-						"hemiTotal += uDiffuseColor * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight );",
+						"hemiTotal += diffuse * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight );",
 
 						// specular (sky light)
 
@@ -273,7 +273,7 @@ THREE.ShaderSkin = {
 						"vec3 lVectorGround = -lVector;",
 						"hemiSpecularWeight += KS_Skin_Specular( normal, lVectorGround, viewPosition, uRoughness, uSpecularBrightness );",
 
-						"specularTotal += uSpecularColor * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight ) * hemiSpecularWeight * specularStrength;",
+						"specularTotal += specular * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight ) * hemiSpecularWeight * specularStrength;",
 
 					"}",
 
@@ -295,7 +295,7 @@ THREE.ShaderSkin = {
 					"totalLight += hemiTotal;",
 				"#endif",
 
-				"gl_FragColor.xyz = gl_FragColor.xyz * ( totalLight + ambientLightColor * uAmbientColor ) + specularTotal;",
+				"gl_FragColor.xyz = gl_FragColor.xyz * ( totalLight + ambientLightColor * ambient ) + specularTotal;",
 
 				THREE.ShaderChunk[ "shadowmap_fragment" ],
 				THREE.ShaderChunk[ "linear_to_gamma_fragment" ],
@@ -375,10 +375,10 @@ THREE.ShaderSkin = {
 
 			"uNormalScale": { type: "f", value: 1.0 },
 
-			"uDiffuseColor":  { type: "c", value: new THREE.Color( 0xeeeeee ) },
-			"uSpecularColor": { type: "c", value: new THREE.Color( 0x111111 ) },
-			"uAmbientColor":  { type: "c", value: new THREE.Color( 0x050505 ) },
-			"uOpacity": 	  { type: "f", value: 1 },
+			"diffuse":  { type: "c", value: new THREE.Color( 0xeeeeee ) },
+			"specular": { type: "c", value: new THREE.Color( 0x111111 ) },
+			"ambient":  { type: "c", value: new THREE.Color( 0x050505 ) },
+			"opacity": 	  { type: "f", value: 1 },
 
 			"uRoughness": 	  		{ type: "f", value: 0.15 },
 			"uSpecularBrightness": 	{ type: "f", value: 0.75 }
@@ -389,10 +389,10 @@ THREE.ShaderSkin = {
 
 		fragmentShader: [
 
-			"uniform vec3 uAmbientColor;",
-			"uniform vec3 uDiffuseColor;",
-			"uniform vec3 uSpecularColor;",
-			"uniform float uOpacity;",
+			"uniform vec3 ambient;",
+			"uniform vec3 diffuse;",
+			"uniform vec3 specular;",
+			"uniform float opacity;",
 
 			"uniform float uRoughness;",
 			"uniform float uSpecularBrightness;",
@@ -476,8 +476,8 @@ THREE.ShaderSkin = {
 
 				"gl_FragColor = vec4( 1.0 );",
 
-				"vec4 mColor = vec4( uDiffuseColor, uOpacity );",
-				"vec4 mSpecular = vec4( uSpecularColor, uOpacity );",
+				"vec4 mColor = vec4( diffuse, opacity );",
+				"vec4 mSpecular = vec4( specular, opacity );",
 
 				"vec3 normalTex = texture2D( tNormal, vUv ).xyz * 2.0 - 1.0;",
 				"normalTex.xy *= uNormalScale;",
@@ -543,7 +543,7 @@ THREE.ShaderSkin = {
 
 				// all lights contribution summation
 
-				"vec4 totalLight = vec4( vec3( 0.0 ), uOpacity );",
+				"vec4 totalLight = vec4( vec3( 0.0 ), opacity );",
 
 				"#if MAX_DIR_LIGHTS > 0",
 					"totalLight += dirTotal;",
@@ -595,7 +595,7 @@ THREE.ShaderSkin = {
 
 					"gl_FragColor.xyz *= pow( colDiffuse.xyz, vec3( 0.5 ) );",
 
-					"gl_FragColor.xyz += ambientLightColor * uAmbientColor * colDiffuse.xyz + specularTotal;",
+					"gl_FragColor.xyz += ambientLightColor * ambient * colDiffuse.xyz + specularTotal;",
 
 					"#ifndef VERSION1",
 

examples/js/ShaderTerrain.js

@@ -40,11 +40,11 @@ THREE.ShaderTerrain = {
 			"uDisplacementBias": { type: "f", value: 0.0 },
 			"uDisplacementScale": { type: "f", value: 1.0 },
 
-			"uDiffuseColor": { type: "c", value: new THREE.Color( 0xeeeeee ) },
-			"uSpecularColor": { type: "c", value: new THREE.Color( 0x111111 ) },
-			"uAmbientColor": { type: "c", value: new THREE.Color( 0x050505 ) },
-			"uShininess": { type: "f", value: 30 },
-			"uOpacity": { type: "f", value: 1 },
+			"diffuse": { type: "c", value: new THREE.Color( 0xeeeeee ) },
+			"specular": { type: "c", value: new THREE.Color( 0x111111 ) },
+			"ambient": { type: "c", value: new THREE.Color( 0x050505 ) },
+			"shininess": { type: "f", value: 30 },
+			"opacity": { type: "f", value: 1 },
 
 			"uRepeatBase"    : { type: "v2", value: new THREE.Vector2( 1, 1 ) },
 			"uRepeatOverlay" : { type: "v2", value: new THREE.Vector2( 1, 1 ) },
@@ -57,11 +57,11 @@ THREE.ShaderTerrain = {
 
 		fragmentShader: [
 
-			"uniform vec3 uAmbientColor;",
-			"uniform vec3 uDiffuseColor;",
-			"uniform vec3 uSpecularColor;",
-			"uniform float uShininess;",
-			"uniform float uOpacity;",
+			"uniform vec3 ambient;",
+			"uniform vec3 diffuse;",
+			"uniform vec3 specular;",
+			"uniform float shininess;",
+			"uniform float opacity;",
 
 			"uniform bool enableDiffuse1;",
 			"uniform bool enableDiffuse2;",
@@ -118,7 +118,7 @@ THREE.ShaderTerrain = {
 
 			"void main() {",
 
-				"gl_FragColor = vec4( vec3( 1.0 ), uOpacity );",
+				"gl_FragColor = vec4( vec3( 1.0 ), opacity );",
 
 				"vec3 specularTex = vec3( 1.0 );",
 
@@ -186,10 +186,10 @@ THREE.ShaderTerrain = {
 						"float pointDotNormalHalf = max( dot( normal, pointHalfVector ), 0.0 );",
 						"float pointDiffuseWeight = max( dot( normal, lVector ), 0.0 );",
 
-						"float pointSpecularWeight = specularTex.r * max( pow( pointDotNormalHalf, uShininess ), 0.0 );",
+						"float pointSpecularWeight = specularTex.r * max( pow( pointDotNormalHalf, shininess ), 0.0 );",
 
-						"pointDiffuse += pointDistance * pointLightColor[ i ] * uDiffuseColor * pointDiffuseWeight;",
-						"pointSpecular += pointDistance * pointLightColor[ i ] * uSpecularColor * pointSpecularWeight * pointDiffuseWeight;",
+						"pointDiffuse += pointDistance * pointLightColor[ i ] * diffuse * pointDiffuseWeight;",
+						"pointSpecular += pointDistance * pointLightColor[ i ] * specular * pointSpecularWeight * pointDiffuseWeight;",
 
 					"}",
 
@@ -212,10 +212,10 @@ THREE.ShaderTerrain = {
 						"float dirDotNormalHalf = max( dot( normal, dirHalfVector ), 0.0 );",
 						"float dirDiffuseWeight = max( dot( normal, dirVector ), 0.0 );",
 
-						"float dirSpecularWeight = specularTex.r * max( pow( dirDotNormalHalf, uShininess ), 0.0 );",
+						"float dirSpecularWeight = specularTex.r * max( pow( dirDotNormalHalf, shininess ), 0.0 );",
 
-						"dirDiffuse += directionalLightColor[ i ] * uDiffuseColor * dirDiffuseWeight;",
-						"dirSpecular += directionalLightColor[ i ] * uSpecularColor * dirSpecularWeight * dirDiffuseWeight;",
+						"dirDiffuse += directionalLightColor[ i ] * diffuse * dirDiffuseWeight;",
+						"dirSpecular += directionalLightColor[ i ] * specular * dirSpecularWeight * dirDiffuseWeight;",
 
 					"}",
 
@@ -238,7 +238,7 @@ THREE.ShaderTerrain = {
 						"float dotProduct = dot( normal, lVector );",
 						"float hemiDiffuseWeight = 0.5 * dotProduct + 0.5;",
 
-						"hemiDiffuse += uDiffuseColor * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight );",
+						"hemiDiffuse += diffuse * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight );",
 
 						// specular (sky light)
 
@@ -246,7 +246,7 @@ THREE.ShaderTerrain = {
 
 						"vec3 hemiHalfVectorSky = normalize( lVector + viewPosition );",
 						"float hemiDotNormalHalfSky = 0.5 * dot( normal, hemiHalfVectorSky ) + 0.5;",
-						"hemiSpecularWeight += specularTex.r * max( pow( hemiDotNormalHalfSky, uShininess ), 0.0 );",
+						"hemiSpecularWeight += specularTex.r * max( pow( hemiDotNormalHalfSky, shininess ), 0.0 );",
 
 						// specular (ground light)
 
@@ -254,9 +254,9 @@ THREE.ShaderTerrain = {
 
 						"vec3 hemiHalfVectorGround = normalize( lVectorGround + viewPosition );",
 						"float hemiDotNormalHalfGround = 0.5 * dot( normal, hemiHalfVectorGround ) + 0.5;",
-						"hemiSpecularWeight += specularTex.r * max( pow( hemiDotNormalHalfGround, uShininess ), 0.0 );",
+						"hemiSpecularWeight += specularTex.r * max( pow( hemiDotNormalHalfGround, shininess ), 0.0 );",
 
-						"hemiSpecular += uSpecularColor * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight ) * hemiSpecularWeight * hemiDiffuseWeight;",
+						"hemiSpecular += specular * mix( hemisphereLightGroundColor[ i ], hemisphereLightSkyColor[ i ], hemiDiffuseWeight ) * hemiSpecularWeight * hemiDiffuseWeight;",
 
 					"}",
 
@@ -288,8 +288,8 @@ THREE.ShaderTerrain = {
 
 				"#endif",
 
-				//"gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * uAmbientColor) + totalSpecular;",
-				"gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * uAmbientColor + totalSpecular );",
+				//"gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * ambient) + totalSpecular;",
+				"gl_FragColor.xyz = gl_FragColor.xyz * ( totalDiffuse + ambientLightColor * ambient + totalSpecular );",
 
 				THREE.ShaderChunk[ "shadowmap_fragment" ],
 				THREE.ShaderChunk[ "linear_to_gamma_fragment" ],

examples/js/SimulatorRenderer.js

@@ -92,13 +92,13 @@ function SimulatorRenderer(WIDTH, renderer) {
 	var rtPosition1, rtPosition2, rtVelocity1, rtVelocity2;
 
 	function init() {
-		var dtPosition = generateDataTexture();
+		var dtPosition = generatePositionTexture();
 		var dtVelocity = generateVelocityTexture();
 
-		rtPosition1 = getRenderTarget();
+		rtPosition1 = getRenderTarget( THREE.RGBAFormat );
 		rtPosition2 = rtPosition1.clone();
-		rtVelocity1 = rtPosition1.clone();
-		rtVelocity2 = rtPosition1.clone();
+		rtVelocity1 = getRenderTarget( THREE.RGBFormat );
+		rtVelocity2 = rtVelocity1.clone();
 
 		simulator.renderTexture(dtPosition, rtPosition1);
 		simulator.renderTexture(rtPosition1, rtPosition2);
@@ -111,13 +111,13 @@ function SimulatorRenderer(WIDTH, renderer) {
 
 	this.init = init;
 
-	function getRenderTarget() {
+	function getRenderTarget( type ) {
 		var renderTarget = new THREE.WebGLRenderTarget(WIDTH, WIDTH, {
 			wrapS: THREE.RepeatWrapping,
 			wrapT: THREE.RepeatWrapping,
 			minFilter: THREE.NearestFilter,
 			magFilter: THREE.NearestFilter,
-			format: THREE.RGBAFormat,
+			format: type,
 			type: THREE.FloatType,
 			stencilBuffer: false
 		});
@@ -171,24 +171,20 @@ function SimulatorRenderer(WIDTH, renderer) {
 
 	}
 
-	function generateDataTexture() {
+	function generatePositionTexture() {
 
-		var x, y, z;
+		var a = new Float32Array( PARTICLES * 4 );
 
-		var w = WIDTH, h = WIDTH;
+		for ( var k = 0; k < PARTICLES; k += 4 ) {
 
-		var a = new Float32Array(PARTICLES * 4);
+			var x = Math.random() * BOUNDS - BOUNDS_HALF;
+			var y = Math.random() * BOUNDS - BOUNDS_HALF;
+			var z = Math.random() * BOUNDS - BOUNDS_HALF;
 
-		for (var k = 0; k < PARTICLES; k++) {
-
-			x = Math.random() * BOUNDS - BOUNDS_HALF;
-			y = Math.random() * BOUNDS - BOUNDS_HALF;
-			z = Math.random() * BOUNDS - BOUNDS_HALF;
-
-			a[ k*4 + 0 ] = x;
-			a[ k*4 + 1 ] = y;
-			a[ k*4 + 2 ] = z;
-			a[ k*4 + 3 ] = 1;
+			a[ k + 0 ] = x;
+			a[ k + 1 ] = y;
+			a[ k + 2 ] = z;
+			a[ k + 3 ] = 1;
 
 		}
 
@@ -204,26 +200,21 @@ function SimulatorRenderer(WIDTH, renderer) {
 
 	function generateVelocityTexture() {
 
-		var x, y, z;
-
-		var w = WIDTH, h = WIDTH;
+		var a = new Float32Array( PARTICLES * 3 );
 
-		var a = new Float32Array(PARTICLES * 4);
+		for ( var k = 0; k < PARTICLES; k += 3 ) {
 
-		for (var k = 0; k < PARTICLES; k++) {
+			var x = Math.random() - 0.5;
+			var y = Math.random() - 0.5;
+			var z = Math.random() - 0.5;
 
-			x = Math.random() - 0.5;
-			y = Math.random() - 0.5;
-			z = Math.random() - 0.5;
-
-			a[ k*4 + 0 ] = x * 10;
-			a[ k*4 + 1 ] = y * 10;
-			a[ k*4 + 2 ] = z * 10;
-			a[ k*4 + 3 ] = 1;
+			a[ k + 0 ] = x * 10;
+			a[ k + 1 ] = y * 10;
+			a[ k + 2 ] = z * 10;
 
 		}
 
-		var texture = new THREE.DataTexture( a, WIDTH, WIDTH, THREE.RGBAFormat, THREE.FloatType );
+		var texture = new THREE.DataTexture( a, WIDTH, WIDTH, THREE.RGBFormat, THREE.FloatType );
 		texture.minFilter = THREE.NearestFilter;
 		texture.magFilter = THREE.NearestFilter;
 		texture.needsUpdate = true;

examples/js/WaterShader.js

@@ -0,0 +1,272 @@
+/**
+ * @author jbouny / https://github.com/jbouny
+ *
+ * Work based on :
+ * @author Slayvin / http://slayvin.net : Flat mirror for three.js
+ * @author Stemkoski / http://www.adelphi.edu/~stemkoski : An implementation of water shader based on the flat mirror
+ * @author Jonas Wagner / http://29a.ch/ && http://29a.ch/slides/2012/webglwater/ : Water shader explanations in WebGL
+ */
+
+THREE.ShaderLib['water'] = {
+
+	uniforms: { "normalSampler":	{ type: "t", value: null },
+				"mirrorSampler":	{ type: "t", value: null },
+				"alpha":			{ type: "f", value: 1.0 },
+				"time":				{ type: "f", value: 0.0 },
+				"distortionScale":	{ type: "f", value: 20.0 },
+				"textureMatrix" :	{ type: "m4", value: new THREE.Matrix4() },
+				"sunColor":			{ type: "c", value: new THREE.Color( 0x7F7F7F ) },
+				"sunDirection":		{ type: "v3", value: new THREE.Vector3( 0.70707, 0.70707, 0 ) },
+				"eye":				{ type: "v3", value: new THREE.Vector3( 0, 0, 0 ) },
+				"waterColor":		{ type: "c", value: new THREE.Color( 0x555555 ) }
+	},
+
+	vertexShader: [
+		'uniform mat4 textureMatrix;',
+		'uniform float time;',
+
+		'varying vec4 mirrorCoord;',
+		'varying vec3 worldPosition;',
+		
+		'void main()',
+		'{',
+		'	mirrorCoord = modelMatrix * vec4( position, 1.0 );',
+		'	worldPosition = mirrorCoord.xyz;',
+		'	mirrorCoord = textureMatrix * mirrorCoord;',
+		'	gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );',
+		'}'
+	].join('\n'),
+
+	fragmentShader: [
+		'precision highp float;',
+		
+		'uniform sampler2D mirrorSampler;',
+		'uniform float alpha;',
+		'uniform float time;',
+		'uniform float distortionScale;',
+		'uniform sampler2D normalSampler;',
+		'uniform vec3 sunColor;',
+		'uniform vec3 sunDirection;',
+		'uniform vec3 eye;',
+		'uniform vec3 waterColor;',
+
+		'varying vec4 mirrorCoord;',
+		'varying vec3 worldPosition;',
+		
+		'vec4 getNoise( vec2 uv )',
+		'{',
+		'	vec2 uv0 = ( uv / 103.0 ) + vec2(time / 17.0, time / 29.0);',
+		'	vec2 uv1 = uv / 107.0-vec2( time / -19.0, time / 31.0 );',
+		'	vec2 uv2 = uv / vec2( 8907.0, 9803.0 ) + vec2( time / 101.0, time / 97.0 );',
+		'	vec2 uv3 = uv / vec2( 1091.0, 1027.0 ) - vec2( time / 109.0, time / -113.0 );',
+		'	vec4 noise = ( texture2D( normalSampler, uv0 ) ) +',
+        '		( texture2D( normalSampler, uv1 ) ) +',
+        '		( texture2D( normalSampler, uv2 ) ) +',
+		'		( texture2D( normalSampler, uv3 ) );',
+		'	return noise * 0.5 - 1.0;',
+		'}',
+		
+		'void sunLight( const vec3 surfaceNormal, const vec3 eyeDirection, float shiny, float spec, float diffuse, inout vec3 diffuseColor, inout vec3 specularColor )',
+		'{',
+		'	vec3 reflection = normalize( reflect( -sunDirection, surfaceNormal ) );',
+		'	float direction = max( 0.0, dot( eyeDirection, reflection ) );',
+		'	specularColor += pow( direction, shiny ) * sunColor * spec;',
+		'	diffuseColor += max( dot( sunDirection, surfaceNormal ), 0.0 ) * sunColor * diffuse;',
+		'}',
+		
+		'void main()',
+		'{',
+		'	vec4 noise = getNoise( worldPosition.xz );',
+		'	vec3 surfaceNormal = normalize( noise.xzy * vec3( 1.5, 1.0, 1.5 ) );',
+
+		'	vec3 diffuseLight = vec3(0.0);',
+		'	vec3 specularLight = vec3(0.0);',
+
+		'	vec3 worldToEye = eye-worldPosition;',
+		'	vec3 eyeDirection = normalize( worldToEye );',
+		'	sunLight( surfaceNormal, eyeDirection, 100.0, 2.0, 0.5, diffuseLight, specularLight );',
+		
+		'	float distance = length(worldToEye);',
+
+		'	vec2 distortion = surfaceNormal.xz * ( 0.001 + 1.0 / distance ) * distortionScale;',
+		'	vec3 reflectionSample = vec3( texture2D( mirrorSampler, mirrorCoord.xy / mirrorCoord.z + distortion ) );',
+
+		'	float theta = max( dot( eyeDirection, surfaceNormal ), 0.0 );',
+		'	float rf0 = 0.3;',
+		'	float reflectance = rf0 + ( 1.0 - rf0 ) * pow( ( 1.0 - theta ), 5.0 );',
+		'	vec3 scatter = max( 0.0, dot( surfaceNormal, eyeDirection ) ) * waterColor;',
+		'	vec3 albedo = mix( sunColor * diffuseLight * 0.3 + scatter, ( vec3( 0.1 ) + reflectionSample * 0.9 + reflectionSample * specularLight ), reflectance );',
+		'	gl_FragColor = vec4( albedo, alpha );',
+		'}'
+	].join('\n')
+
+};
+
+THREE.Water = function ( renderer, camera, scene, options ) {
+
+	THREE.Object3D.call( this );
+	this.name = 'water_' + this.id;
+
+	function isPowerOfTwo ( value ) {
+		return ( value & ( value - 1 ) ) === 0;
+	};
+	function optionalParameter ( value, defaultValue ) {
+		return value !== undefined ? value : defaultValue;
+	};
+
+	options = options || {};
+	
+	this.matrixNeedsUpdate = true;
+	
+	var width = optionalParameter( options.textureWidth, 512 );
+	var height = optionalParameter( options.textureHeight, 512 );
+	this.clipBias = optionalParameter( options.clipBias, 0.0 );
+	this.alpha = optionalParameter( options.alpha, 1.0 );
+	this.time = optionalParameter( options.time, 0.0 );
+	this.normalSampler = optionalParameter( options.waterNormals, null );
+	this.sunDirection = optionalParameter( options.sunDirection, new THREE.Vector3( 0.70707, 0.70707, 0.0 ) );
+	this.sunColor = new THREE.Color( optionalParameter( options.sunColor, 0xffffff ) );
+	this.waterColor = new THREE.Color( optionalParameter( options.waterColor, 0x7F7F7F ) );
+	this.eye = optionalParameter( options.eye, new THREE.Vector3( 0, 0, 0 ) );
+	this.distortionScale = optionalParameter( options.distortionScale, 20.0 );
+	
+	this.renderer = renderer;
+	this.scene = scene;
+	this.mirrorPlane = new THREE.Plane();
+	this.normal = new THREE.Vector3( 0, 0, 1 );
+	this.mirrorWorldPosition = new THREE.Vector3();
+	this.cameraWorldPosition = new THREE.Vector3();
+	this.rotationMatrix = new THREE.Matrix4();
+	this.lookAtPosition = new THREE.Vector3( 0, 0, -1 );
+	this.clipPlane = new THREE.Vector4();
+	
+	if ( camera instanceof THREE.PerspectiveCamera )
+		this.camera = camera;
+	else 
+	{
+		this.camera = new THREE.PerspectiveCamera();
+		console.log(this.name + ': camera is not a Perspective Camera!')
+	}
+
+	this.textureMatrix = new THREE.Matrix4();
+
+	this.mirrorCamera = this.camera.clone();
+	
+	this.texture = new THREE.WebGLRenderTarget( width, height );
+	this.tempTexture = new THREE.WebGLRenderTarget( width, height );
+	
+	var mirrorShader = THREE.ShaderLib[ "water" ];
+	var mirrorUniforms = THREE.UniformsUtils.clone( mirrorShader.uniforms );
+
+	this.material = new THREE.ShaderMaterial( { 
+		fragmentShader: mirrorShader.fragmentShader, 
+		vertexShader: mirrorShader.vertexShader, 
+		uniforms: mirrorUniforms,
+		transparent: true
+	} );
+
+	this.material.uniforms.mirrorSampler.value = this.texture;
+	this.material.uniforms.textureMatrix.value = this.textureMatrix;
+	this.material.uniforms.alpha.value = this.alpha;
+	this.material.uniforms.time.value = this.time;
+	this.material.uniforms.normalSampler.value = this.normalSampler;
+	this.material.uniforms.sunColor.value = this.sunColor;
+	this.material.uniforms.waterColor.value = this.waterColor;
+	this.material.uniforms.sunDirection.value = this.sunDirection;
+	this.material.uniforms.distortionScale.value = this.distortionScale;
+	
+	this.material.uniforms.eye.value = this.eye;
+	
+	if ( !isPowerOfTwo(width) || !isPowerOfTwo(height) ) 
+	{
+		this.texture.generateMipmaps = false;
+		this.tempTexture.generateMipmaps = false;
+	}
+
+	this.updateTextureMatrix();
+	this.render();
+};
+
+THREE.Water.prototype = Object.create( THREE.Mirror.prototype );
+
+
+THREE.Water.prototype.updateTextureMatrix = function () {
+
+	function sign(x) { return x ? x < 0 ? -1 : 1 : 0; }
+
+	this.updateMatrixWorld();
+	this.camera.updateMatrixWorld();
+
+	this.mirrorWorldPosition.setFromMatrixPosition( this.matrixWorld );
+	this.cameraWorldPosition.setFromMatrixPosition( this.camera.matrixWorld );
+
+	this.rotationMatrix.extractRotation( this.matrixWorld );
+
+	this.normal.set( 0, 0, 1 );
+	this.normal.applyMatrix4( this.rotationMatrix );
+
+	var view = this.mirrorWorldPosition.clone().sub( this.cameraWorldPosition );
+	var reflectView = view.reflect( this.normal );
+	reflectView.add( this.mirrorWorldPosition );
+
+	this.rotationMatrix.extractRotation( this.camera.matrixWorld );
+
+	this.lookAtPosition.set(0, 0, -1);
+	this.lookAtPosition.applyMatrix4( this.rotationMatrix );
+	this.lookAtPosition.add( this.cameraWorldPosition );
+
+	var target = this.mirrorWorldPosition.clone().sub( this.lookAtPosition );
+	var reflectTarget = target.reflect( this.normal );
+	reflectTarget.add( this.mirrorWorldPosition );
+
+	this.up.set(0, -1, 0);
+	this.up.applyMatrix4( this.rotationMatrix );
+	var reflectUp = this.up.reflect( this.normal );
+
+	this.mirrorCamera.position.copy(reflectView);
+	this.mirrorCamera.up = reflectUp;
+	this.mirrorCamera.lookAt(reflectTarget);
+	this.mirrorCamera.aspect = this.camera.aspect;
+
+	this.mirrorCamera.updateProjectionMatrix();
+	this.mirrorCamera.updateMatrixWorld();
+	this.mirrorCamera.matrixWorldInverse.getInverse(this.mirrorCamera.matrixWorld);
+
+	// Update the texture matrix
+	this.textureMatrix.set( 0.5, 0.0, 0.0, 0.5,
+							0.0, 0.5, 0.0, 0.5,
+							0.0, 0.0, 0.5, 0.5,
+							0.0, 0.0, 0.0, 1.0 );
+	this.textureMatrix.multiply(this.mirrorCamera.projectionMatrix);
+	this.textureMatrix.multiply(this.mirrorCamera.matrixWorldInverse);
+
+	// Now update projection matrix with new clip plane, implementing code from: http://www.terathon.com/code/oblique.html
+	// Paper explaining this technique: http://www.terathon.com/lengyel/Lengyel-Oblique.pdf
+	this.mirrorPlane.setFromNormalAndCoplanarPoint( this.normal, this.mirrorWorldPosition );
+	this.mirrorPlane.applyMatrix4(this.mirrorCamera.matrixWorldInverse);
+
+	this.clipPlane.set(this.mirrorPlane.normal.x, this.mirrorPlane.normal.y, this.mirrorPlane.normal.z, this.mirrorPlane.constant );
+
+	var q = new THREE.Vector4();
+	var projectionMatrix = this.mirrorCamera.projectionMatrix;
+
+	q.x = (sign(this.clipPlane.x) + projectionMatrix.elements[8]) / projectionMatrix.elements[0];
+	q.y = (sign(this.clipPlane.y) + projectionMatrix.elements[9]) / projectionMatrix.elements[5];
+	q.z = -1.0;
+	q.w = (1.0 + projectionMatrix.elements[10]) / projectionMatrix.elements[14];
+
+	// Calculate the scaled plane vector
+	var c = new THREE.Vector4();
+	c = this.clipPlane.multiplyScalar( 2.0 / this.clipPlane.dot(q) );
+
+	// Replacing the third row of the projection matrix
+	projectionMatrix.elements[2] = c.x;
+	projectionMatrix.elements[6] = c.y;
+	projectionMatrix.elements[10] = c.z + 1.0 - this.clipBias;
+	projectionMatrix.elements[14] = c.w;
+	
+	var worldCoordinates = new THREE.Vector3();
+	worldCoordinates.setFromMatrixPosition( this.camera.matrixWorld );
+	this.eye = worldCoordinates;
+	this.material.uniforms.eye.value = this.eye;
+};

examples/js/controls/TrackballControls.js

@@ -1,6 +1,6 @@
 /**
  * @author Eberhard Graether / http://egraether.com/
- * @author Mark Lundin 		 / http://mark-lundin.com
+ * @author Mark Lundin 	/ http://mark-lundin.com
  */
 
 THREE.TrackballControls = function ( object, domElement ) {
@@ -103,9 +103,9 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 	};
 
-	this.getMouseOnScreen = function ( pageX, pageY, optionalTarget ) {
+	this.getMouseOnScreen = function ( pageX, pageY, vector ) {
 
-		return ( optionalTarget || new THREE.Vector2() ).set(
+		return vector.set(
 			( pageX - _this.screen.left ) / _this.screen.width,
 			( pageY - _this.screen.top ) / _this.screen.height
 		);
@@ -114,12 +114,13 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 	this.getMouseProjectionOnBall = (function(){
 
-		var objectUp = new THREE.Vector3();
+		var objectUp = new THREE.Vector3(),
+		    mouseOnBall = new THREE.Vector3();
 
 
 		return function ( pageX, pageY, projection ) {
 
-			var mouseOnBall = new THREE.Vector3(
+			mouseOnBall.set(
 				( pageX - _this.screen.width * 0.5 - _this.screen.left ) / (_this.screen.width*.5),
 				( _this.screen.height * 0.5 + _this.screen.top - pageY ) / (_this.screen.height*.5),
 				0.0
@@ -398,17 +399,17 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 		if ( _state === STATE.ROTATE && !_this.noRotate ) {
 
-			_rotateStart = _this.getMouseProjectionOnBall( event.pageX, event.pageY, _rotateStart );
+			_this.getMouseProjectionOnBall( event.pageX, event.pageY, _rotateStart );
 			_rotateEnd.copy(_rotateStart)
 
 		} else if ( _state === STATE.ZOOM && !_this.noZoom ) {
 
-			_zoomStart = _this.getMouseOnScreen( event.pageX, event.pageY, _zoomStart );
+			_this.getMouseOnScreen( event.pageX, event.pageY, _zoomStart );
 			_zoomEnd.copy(_zoomStart);
 
 		} else if ( _state === STATE.PAN && !_this.noPan ) {
 
-			_panStart = _this.getMouseOnScreen( event.pageX, event.pageY, _panStart);
+			_this.getMouseOnScreen( event.pageX, event.pageY, _panStart );
 			_panEnd.copy(_panStart)
 
 		}
@@ -429,15 +430,15 @@ THREE.TrackballControls = function ( object, domElement ) {
 
 		if ( _state === STATE.ROTATE && !_this.noRotate ) {
 
-			_rotateEnd = _this.getMouseProjectionOnBall( event.pageX, event.pageY, _rotateEnd );
+			_this.getMouseProjectionOnBall( event.pageX, event.pageY, _rotateEnd );
 
 		} else if ( _state === STATE.ZOOM && !_this.noZoom ) {
 
-			_zoomEnd = _this.getMouseOnScreen( event.pageX, event.pageY, _zoomEnd );
+			_this.getMouseOnScreen( event.pageX, event.pageY, _zoomEnd );
 
 		} else if ( _state === STATE.PAN && !_this.noPan ) {
 
-			_panEnd = _this.getMouseOnScreen( event.pageX, event.pageY, _panEnd );
+			_this.getMouseOnScreen( event.pageX, event.pageY, _panEnd );
 
 		}
 
@@ -525,7 +526,7 @@ THREE.TrackballControls = function ( object, domElement ) {
 		switch ( event.touches.length ) {
 
 			case 1:
-				_rotateEnd = _this.getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY, _rotateEnd );
+				_this.getMouseProjectionOnBall( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY, _rotateEnd );
 				break;
 
 			case 2:
@@ -535,7 +536,7 @@ THREE.TrackballControls = function ( object, domElement ) {
 				break;
 
 			case 3:
-				_panEnd = _this.getMouseOnScreen( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY, _panEnd );
+				_this.getMouseOnScreen( event.touches[ 0 ].pageX, event.touches[ 0 ].pageY, _panEnd );
 				break;
 
 			default:

examples/js/loaders/ColladaLoader.js

@@ -3358,6 +3358,7 @@ THREE.ColladaLoader = function () {
 				case 'diffuse':
 				case 'specular':
 				case 'transparent':
+				case 'bump':
 
 					this[ child.nodeName ] = ( new ColorOrTexture() ).parse( child );
 					break;
@@ -3409,6 +3410,14 @@ THREE.ColladaLoader = function () {
 
 		}
 		
+		var keys = {
+			'diffuse':'map', 
+			'ambient':"lightMap" ,
+			'specular':'specularMap',
+			'emission':'emissionMap',
+			'bump':'normalMap'
+			};
+		
 		for ( var prop in this ) {
 
 			switch ( prop ) {
@@ -3417,6 +3426,7 @@ THREE.ColladaLoader = function () {
 				case 'emission':
 				case 'diffuse':
 				case 'specular':
+				case 'bump':
 
 					var cot = this[ prop ];
 
@@ -3441,7 +3451,7 @@ THREE.ColladaLoader = function () {
 									texture.offset.y = cot.texOpts.offsetV;
 									texture.repeat.x = cot.texOpts.repeatU;
 									texture.repeat.y = cot.texOpts.repeatV;
-									props['map'] = texture;
+									props[keys[prop]] = texture;
 
 									// Texture with baked lighting?
 									if (prop === 'emission') props['emissive'] = 0xffffff;
@@ -3785,7 +3795,51 @@ THREE.ColladaLoader = function () {
 
 					this.shader = ( new Shader( child.nodeName, this ) ).parse( child );
 					break;
+				case 'extra':
+					this.parseExtra(child);	
+					break;
+				default:
+					break;
+
+			}
+
+		}
+
+	};
+	
+	Effect.prototype.parseExtra = function ( element ) {
+
+		for ( var i = 0; i < element.childNodes.length; i ++ ) {
+
+			var child = element.childNodes[i];
+			if ( child.nodeType != 1 ) continue;
+
+			switch ( child.nodeName ) {
+
+				case 'technique':
+					this.parseExtraTechnique( child );
+					break;
+				default:
+					break;
+
+			}
+
+		}
+
+	};
+	
+	Effect.prototype.parseExtraTechnique= function ( element ) {
+
+		for ( var i = 0; i < element.childNodes.length; i ++ ) {
+
+			var child = element.childNodes[i];
+			if ( child.nodeType != 1 ) continue;
 
+			switch ( child.nodeName ) {
+
+				case 'bump':
+					this.shader.parse( element );
+					break;
 				default:
 					break;
 

examples/js/renderers/WebGLDeferredRenderer.js

@@ -22,7 +22,7 @@ THREE.WebGLDeferredRenderer = function ( parameters ) {
 
 	if ( this.renderer === undefined ) {
 
-		this.renderer = new THREE.WebGLRenderer( { alpha: false, antialias: false } );
+		this.renderer = new THREE.WebGLRenderer( { antialias: false } );
 		this.renderer.setSize( fullWidth, fullHeight );
 		this.renderer.setClearColorHex( 0x000000, 0 );
 
@@ -39,6 +39,7 @@ THREE.WebGLDeferredRenderer = function ( parameters ) {
 	//
 
 	var currentCamera = null;
+	var projectionMatrixInverse = new THREE.Matrix4();
 
 	var positionVS = new THREE.Vector3();
 	var directionVS = new THREE.Vector3();
@@ -932,7 +933,7 @@ THREE.WebGLDeferredRenderer = function ( parameters ) {
 
 		var uniforms = proxy.material.uniforms;
 
-		if ( uniforms[ "matProjInverse" ] ) uniforms[ "matProjInverse" ].value = currentCamera.projectionMatrixInverse;
+		if ( uniforms[ "matProjInverse" ] ) uniforms[ "matProjInverse" ].value = projectionMatrixInverse;
 		if ( uniforms[ "matView" ] ) uniforms[ "matView" ].value = currentCamera.matrixWorldInverse;
 
 		var originalLight = proxy.userData.originalLight;
@@ -1055,7 +1056,7 @@ THREE.WebGLDeferredRenderer = function ( parameters ) {
 
 		gl.depthFunc( gl.GEQUAL );
 
-		currentCamera.projectionMatrixInverse.getInverse( currentCamera.projectionMatrix );
+		projectionMatrixInverse.getInverse( currentCamera.projectionMatrix );
 
 		for ( var i = 0, il = lightSceneProxy.children.length; i < il; i ++ ) {
 

examples/js/renderers/WebGLRenderer3.js

@@ -4,7 +4,7 @@
  * parameters = {
  *   canvas: canvas,
  *   contextAttributes: {
- *     alpha: true,
+ *     alpha: false,
  *     depth: true,
  *     stencil: false,
  *     antialias: true,
@@ -36,6 +36,8 @@ THREE.WebGLRenderer3 = function ( parameters ) {
 	try {
 
 		var attributes = parameters.contextAttributes || {};
+		
+		if ( attributes.alpha === undefined ) attributes.alpha = false;
 
 		gl = canvas.getContext( 'webgl', attributes ) || canvas.getContext( 'experimental-webgl', attributes );
 

examples/misc_controls_fly.html

@@ -130,11 +130,11 @@
 				uniforms[ "enableDiffuse" ].value = true;
 				uniforms[ "enableSpecular" ].value = true;
 
-				uniforms[ "uDiffuseColor" ].value.setHex( 0xffffff );
-				uniforms[ "uSpecularColor" ].value.setHex( 0x333333 );
-				uniforms[ "uAmbientColor" ].value.setHex( 0x000000 );
+				uniforms[ "diffuse" ].value.setHex( 0xffffff );
+				uniforms[ "specular" ].value.setHex( 0x333333 );
+				uniforms[ "ambient" ].value.setHex( 0x000000 );
 
-				uniforms[ "uShininess" ].value = 15;
+				uniforms[ "shininess" ].value = 15;
 
 				var parameters = {
 
@@ -232,7 +232,7 @@
 
 				}
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 				renderer.sortObjects = false;
 

examples/misc_sound.html

@@ -167,7 +167,7 @@
 
 				//
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				container.innerHTML = "";

examples/misc_ubiquity_test.html

@@ -1,7 +1,7 @@
 <!DOCTYPE html>
 <html lang="en">
 	<head>
-		<title>three.js misc - geometry - polyfield</title>
+		<title>three.js misc - ubiquity - test</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
 		<style>
@@ -24,31 +24,24 @@
 
 		<script>
 
-			var SCREEN_WIDTH = window.innerWidth / 2;
-			var SCREEN_HEIGHT = window.innerHeight / 2;
 			var AMOUNT = 100;
 
-			var container, stats;
+			var stats;
 
 			var camera, scene;
 			var canvasRenderer, svgRenderer, softwareRenderer, webglRenderer;
 
 			var mesh, group;
 
-			var mouseX = 0, mouseY = 0;
-
-			var windowHalfX = window.innerWidth / 2;
-			var windowHalfY = window.innerHeight / 2;
-
 			init();
 			animate();
 
 			function init() {
 
-				container = document.createElement( 'div' );
-				document.body.appendChild( container );
+				var width = window.innerWidth / 2;
+				var height = window.innerHeight / 2;
 
-				camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 100000 );
+				camera = new THREE.PerspectiveCamera( 75, width / height, 1, 10000 );
 				camera.position.z = 500;
 
 				scene = new THREE.Scene();
@@ -187,31 +180,29 @@
 
 				canvasRenderer = new THREE.CanvasRenderer();
 				canvasRenderer.setClearColor( 0xf0f0f0 );
-				canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-				container.appendChild( canvasRenderer.domElement );
+				canvasRenderer.setSize( width, height );
+				document.body.appendChild( canvasRenderer.domElement );
 
 				svgRenderer = new THREE.SVGRenderer();
 				svgRenderer.setClearColor( 0xf0f0f0 );
-				svgRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
+				svgRenderer.setSize( width, height );
 				svgRenderer.setQuality( 'low' );
-				container.appendChild( svgRenderer.domElement );
+				document.body.appendChild( svgRenderer.domElement );
 
 				softwareRenderer = new THREE.SoftwareRenderer();
 				softwareRenderer.setClearColor( 0xf0f0f0 );
-				softwareRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-				container.appendChild( softwareRenderer.domElement );
+				softwareRenderer.setSize( width, height );
+				document.body.appendChild( softwareRenderer.domElement );
 
 				webglRenderer = new THREE.WebGLRenderer( { antialias: true } );
 				webglRenderer.setClearColor( 0xf0f0f0 );
-				webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-				container.appendChild( webglRenderer.domElement );
+				webglRenderer.setSize( width, height );
+				document.body.appendChild( webglRenderer.domElement );
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';
 				stats.domElement.style.top = '0px';
-				container.appendChild( stats.domElement );
-
-				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
+				document.body.appendChild( stats.domElement );
 
 				//
 
@@ -221,26 +212,16 @@
 
 			function onWindowResize() {
 
-				windowHalfX = window.innerWidth / 2;
-				windowHalfY = window.innerHeight / 2;
+				var width = window.innerWidth / 2;
+				var height = window.innerHeight / 2;
 
-				SCREEN_WIDTH = window.innerWidth / 2;
-				SCREEN_HEIGHT = window.innerHeight / 2;
-
-				camera.aspect = SCREEN_WIDTH / window.SCREEN_HEIGHT;
+				camera.aspect = width / height;
 				camera.updateProjectionMatrix();
 
-				canvasRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-				svgRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-				softwareRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-				webglRenderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
-
-			}
-
-			function onDocumentMouseMove( event ) {
-
-				mouseX = ( event.clientX - windowHalfX );
-				mouseY = ( event.clientY - windowHalfY );
+				canvasRenderer.setSize( width, height );
+				svgRenderer.setSize( width, height );
+				softwareRenderer.setSize( width, height );
+				webglRenderer.setSize( width, height );
 
 			}
 
@@ -257,11 +238,13 @@
 
 			function render() {
 
-				camera.position.x += ( mouseX - camera.position.x ) * .05;
-				camera.position.y += ( - mouseY - camera.position.y ) * .05;
+				var time = Date.now() * 0.0002;
+
+				camera.position.x = Math.sin( time ) * 500;
+				camera.position.z = Math.cos( time ) * 500;
 				camera.lookAt( scene.position );
 
-				group.rotation.y += 0.01;
+				group.rotation.x += 0.01;
 
 				scene.updateMatrixWorld();
 

examples/misc_ubiquity_test2.html

@@ -0,0 +1,230 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<title>three.js misc - ubiquity - test2</title>
+		<meta charset="utf-8">
+		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
+		<style>
+			body {
+				background-color: #000;
+				margin: 0px;
+				overflow: hidden;
+			}
+		</style>
+	</head>
+	<body>
+
+		<script src="../build/three.min.js"></script>
+		<script src="js/libs/stats.min.js"></script>
+
+		<div id='container1' style='float: left '></div>
+		<div id='container2' style='float: right'></div>
+
+		<script>
+
+			var stats;
+
+			var camera, scene;
+			var canvasRenderer, webglRenderer;
+
+			var mesh;
+			var texture, texture1, texture2, texture3;
+
+			init();
+			animate();
+
+			function init() {
+
+				var width = window.innerWidth / 2 - 2;
+				var height = window.innerHeight;
+
+				camera = new THREE.PerspectiveCamera( 70, width / height, 1, 4000 );
+				camera.position.z = 2000;
+
+				scene = new THREE.Scene();
+
+
+				// MESH - Repeat Pattern
+
+				texture = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
+				texture.wrapS = THREE.RepeatWrapping;
+				texture.wrapT = THREE.RepeatWrapping;
+
+				var geometry = new THREE.CubeGeometry( 150, 150, 150, 4, 4, 4 );
+				var material = new THREE.MeshBasicMaterial( { map: texture, overdraw: 0.5 } );
+
+				mesh = new THREE.Mesh( geometry, material );
+				scene.add( mesh );
+
+
+				// SPRITES - from Sprite Sheet
+
+				texture1 = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg', undefined, function() {
+
+					texture1.wrapS = THREE.ClampToEdgeWrapping;
+					texture1.wrapT = THREE.ClampToEdgeWrapping;
+
+					for ( var i = 0; i < 20; i ++ ) {
+
+						var tex = texture1.clone();
+
+						tex.needsUpdate = true; // cloning does not set this
+
+						tex.offset.x = 0.1 * THREE.Math.randInt( 0, 7 );
+						tex.offset.y = 0.1 * THREE.Math.randInt( 0, 7 );
+						tex.repeat.x = 0.1 * THREE.Math.randInt( 1, 3 );
+						tex.repeat.y = 0.1 * THREE.Math.randInt( 1, 3 );
+
+						var material = new THREE.SpriteMaterial( { map: tex } );
+						var sprite = new THREE.Sprite( material );
+
+						sprite.material.rotation = 0.5 * Math.PI * ( Math.random() - 0.5 );
+
+						sprite.position.x = Math.random() * 1000 - 500;
+						sprite.position.y = Math.random() * 1000 - 500;
+						sprite.position.z = Math.random() * 1000 - 500;
+
+						sprite.scale.set( 96, 96, 1 );
+
+						scene.add( sprite );
+
+					}
+
+				} );
+
+
+				// SPRITES - Repeat Pattern
+
+				texture2 = THREE.ImageUtils.loadTexture( 'textures/sprite0.jpg' );
+				texture2.wrapS = THREE.RepeatWrapping;
+				texture2.wrapT = THREE.RepeatWrapping;
+
+				for ( var i = 0; i < 20; i ++ ) {
+
+					var material = new THREE.SpriteMaterial( { map: texture2, opacity: 0.7 } );
+					var sprite = new THREE.Sprite( material );
+
+					sprite.material.rotation = 0.5 * Math.PI * ( Math.random() - 0.5 );
+
+					sprite.position.x = Math.random() * 1000 - 500;
+					sprite.position.y = Math.random() * 1000 - 500;
+					sprite.position.z = Math.random() * 1000 - 500;
+
+					sprite.scale.set( 64, 64, 1 );
+
+					scene.add( sprite );
+
+				}
+
+
+				// SPRITES - PNG
+
+				for ( var i = 0; i < 20; i ++ ) {
+
+					texture3 = THREE.ImageUtils.loadTexture( 'textures/sprite1.png' );
+					texture3.wrapS = THREE.ClampToEdgeWrapping;
+					texture3.wrapT = THREE.ClampToEdgeWrapping;
+
+					var material = new THREE.SpriteMaterial( { map: texture3 } );
+					var sprite = new THREE.Sprite( material );
+
+					sprite.material.rotation = 2 * Math.PI * ( Math.random() - 0.5 );
+
+					sprite.position.x = Math.random() * 1000 - 500;
+					sprite.position.y = Math.random() * 1000 - 500;
+					sprite.position.z = Math.random() * 1000 - 500;
+
+					sprite.scale.set( 64, 64, 1 );
+
+					scene.add( sprite );
+
+				}
+
+				//
+
+				canvasRenderer = new THREE.CanvasRenderer();
+				canvasRenderer.setClearColor( 0xf0f0f0 );
+				canvasRenderer.setSize( width, height );
+				var container1 = document.getElementById( 'container1' );
+				container1.appendChild( canvasRenderer.domElement );
+
+				webglRenderer = new THREE.WebGLRenderer( { antialias: true } );
+				webglRenderer.setClearColor( 0xf0f0f0 );
+				webglRenderer.setSize( width, height );
+				var container2 = document.getElementById( 'container2' );
+				container2.appendChild( webglRenderer.domElement );
+
+				stats = new Stats();
+				stats.domElement.style.position = 'absolute';
+				stats.domElement.style.top = '0px';
+				document.body.appendChild( stats.domElement );
+
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+
+			}
+
+			function onWindowResize() {
+
+				var width = window.innerWidth / 2 - 2;
+				var height = window.innerHeight;
+
+				camera.aspect = width / height;
+				camera.updateProjectionMatrix();
+
+				canvasRenderer.setSize( width, height );
+				webglRenderer.setSize( width, height );
+
+			}
+
+			//
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				render();
+				stats.update();
+
+			}
+
+			function render() {
+
+				var time = performance.now() * 0.0001;
+
+				camera.position.x = Math.sin( time ) * 500;
+				camera.position.z = Math.cos( time ) * 500;
+				camera.lookAt( scene.position );
+
+				//
+
+				texture.repeat.x = Math.sin( time ) * 0.5 + 1.0;
+				texture.repeat.y = Math.cos( time ) * 0.5 + 1.0;
+
+				texture.offset.x = Math.sin( time ) * 0.5 + 0.5;
+				texture.offset.y = Math.cos( time ) * 0.5 + 0.5;
+
+				mesh.rotation.x = time * 2;
+				mesh.rotation.y = time * 4;
+
+				//
+
+				texture2.repeat.x = Math.sin( time ) + 1.25;
+				texture2.repeat.y = Math.sin( time ) + 1.25;
+
+				texture2.offset.x = Math.sin( time );
+				texture2.offset.y = Math.cos( time );
+
+				//
+
+				canvasRenderer.render( scene, camera );
+				webglRenderer.render( scene, camera );
+
+			}
+
+		</script>
+
+	</body>
+
+</html>

examples/textures/UV_Grid_Sm.txt

@@ -0,0 +1 @@
+http://www.helloluxx.com/tutorials/cinema4d-2/cinema4d-materials/uv-grids/

examples/textures/ash_uvgrid01.nfo

@@ -1 +0,0 @@
-http://www.pixelcg.com/blog/?p=146

examples/textures/skyboxsun25degtest.txt

@@ -0,0 +1 @@
+http://reije081.home.xs4all.nl/skyboxes/

examples/webgl3_performance.html

@@ -77,7 +77,7 @@
 
 				} );
 
-				renderer = new THREE.WebGLRenderer3( { contextAttributes: { antialias: false, alpha: false } } );
+				renderer = new THREE.WebGLRenderer3( { contextAttributes: { antialias: false } } );
 				renderer.setClearColor( 0xffffff, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );

examples/webgl_animation_cloth.html

@@ -298,7 +298,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 

examples/webgl_animation_skinning.html

@@ -99,7 +99,7 @@
 				floor.scale.set( 25, 25, 25 );
 				scene.add( floor );
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.sortObjects = false;

examples/webgl_animation_skinning_morph.html

@@ -141,7 +141,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 
@@ -211,7 +210,7 @@
 
 				//var envMap = THREE.ImageUtils.loadTextureCube( urls );
 
-				//var map = THREE.ImageUtils.loadTexture( "textures/ash_uvgrid01.jpg" );
+				//var map = THREE.ImageUtils.loadTexture( "textures/UV_Grid_Sm.jpg" );
 
 				//var bumpMap = THREE.ImageUtils.generateDataTexture( 1, 1, new THREE.Color() );
 				//var bumpMap = THREE.ImageUtils.loadTexture( "textures/water.jpg" );

examples/webgl_buffergeometry.html

@@ -228,13 +228,12 @@
 
 				//
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				container.appendChild( renderer.domElement );
 

examples/webgl_buffergeometry_custom_attributes_particles.html

@@ -173,7 +173,7 @@
 
 			scene.add( sphere );
 
-			renderer = new THREE.WebGLRenderer( { alpha: false } );
+			renderer = new THREE.WebGLRenderer();
 			renderer.setSize( WIDTH, HEIGHT );
 
 			var container = document.getElementById( 'container' );

examples/webgl_buffergeometry_lines.html

@@ -104,12 +104,11 @@
 
 				//
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				container.appendChild( renderer.domElement );
 

examples/webgl_buffergeometry_particles.html

@@ -116,7 +116,7 @@
 
 				//
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_camera.html

@@ -136,7 +136,7 @@
 				//
 
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 				renderer.domElement.style.position = "relative";
 				container.appendChild( renderer.domElement );

examples/webgl_custom_attributes.html

@@ -149,7 +149,7 @@
 
 			scene.add( sphere );
 
-			renderer = new THREE.WebGLRenderer( { alpha: false } );
+			renderer = new THREE.WebGLRenderer();
 			renderer.setClearColor( 0x050505, 1 );
 			renderer.setSize( WIDTH, HEIGHT );
 

examples/webgl_custom_attributes_lines.html

@@ -185,7 +185,7 @@
 
 			scene.add( object );
 
-			renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+			renderer = new THREE.WebGLRenderer( { antialias: true } );
 			renderer.setClearColor( 0x050505, 1 );
 			renderer.setSize( WIDTH, HEIGHT );
 

examples/webgl_custom_attributes_particles.html

@@ -170,7 +170,7 @@
 
 			scene.add( sphere );
 
-			renderer = new THREE.WebGLRenderer( { alpha: false } );
+			renderer = new THREE.WebGLRenderer();
 			renderer.setSize( WIDTH, HEIGHT );
 
 			var container = document.getElementById( 'container' );

examples/webgl_custom_attributes_particles2.html

@@ -164,7 +164,7 @@
 
 			scene.add( sphere );
 
-			renderer = new THREE.WebGLRenderer( { alpha: false } );
+			renderer = new THREE.WebGLRenderer();
 			renderer.setSize( WIDTH, HEIGHT );
 
 			var container = document.getElementById( 'container' );

examples/webgl_custom_attributes_particles3.html

@@ -226,7 +226,7 @@
 
 			scene.add( object );
 
-			renderer = new THREE.WebGLRenderer( { alpha: false } );
+			renderer = new THREE.WebGLRenderer();
 			renderer.setSize( WIDTH, HEIGHT );
 
 			var container = document.getElementById( 'container' );

examples/webgl_effects_oculusrift.html

@@ -196,7 +196,7 @@
 				directionalLight.position.set( 1, 1, 0.5 ).normalize();
 				scene.add( directionalLight );
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setClearColor( 0xbfd1e5, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_geometries.html

@@ -41,7 +41,7 @@
 
 				scene = new THREE.Scene();
 
-				var light, object, object2;
+				var light, object;
 
 				scene.add( new THREE.AmbientLight( 0x404040 ) );
 
@@ -49,7 +49,7 @@
 				light.position.set( 0, 1, 0 );
 				scene.add( light );
 
-				var map = THREE.ImageUtils.loadTexture( 'textures/ash_uvgrid01.jpg' );
+				var map = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
 				map.wrapS = map.wrapT = THREE.RepeatWrapping;
 				map.anisotropy = 16;
 

examples/webgl_geometries2.html

@@ -60,7 +60,7 @@
 				light.position.set( 0, 0, 1 );
 				scene.add( light );
 
-				var map = THREE.ImageUtils.loadTexture( 'textures/ash_uvgrid01.jpg' );
+				var map = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
 				map.wrapS = map.wrapT = THREE.RepeatWrapping;
 				map.anisotropy = 16;
 

examples/webgl_geometry_convex.html

@@ -49,7 +49,7 @@
 				light.position.set( 0, 1, 0 );
 				scene.add( light );
 
-				var map = THREE.ImageUtils.loadTexture( 'textures/ash_uvgrid01.jpg' );
+				var map = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
 				map.wrapS = map.wrapT = THREE.RepeatWrapping;
 				map.anisotropy = 16;
 

examples/webgl_geometry_dynamic.html

@@ -112,7 +112,7 @@
 				mesh = new THREE.Mesh( geometry, material );
 				scene.add( mesh );
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setClearColor( 0xaaccff, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_geometry_minecraft.html

@@ -195,7 +195,7 @@
 				directionalLight.position.set( 1, 1, 0.5 ).normalize();
 				scene.add( directionalLight );
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setClearColor( 0xbfd1e5, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_geometry_minecraft_ao.html

@@ -296,7 +296,7 @@
 				directionalLight.position.set( 1, 1, 0.5 ).normalize();
 				scene.add( directionalLight );
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setClearColor( 0xffffff );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_geometry_nurbs.html

@@ -152,7 +152,7 @@
 				var knots2 = [0, 0, 0, 0, 1, 1, 1, 1];
 				var nurbsSurface = new THREE.NURBSSurface(degree1, degree2, knots1, knots2, nsControlPoints);
 
-				var map = THREE.ImageUtils.loadTexture( 'textures/ash_uvgrid01.jpg' );
+				var map = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
 				map.wrapS = map.wrapT = THREE.RepeatWrapping;
 				map.anisotropy = 16;
 

examples/webgl_geometry_terrain_fog.html

@@ -98,7 +98,7 @@
 				mesh = new THREE.Mesh( geometry, new THREE.MeshBasicMaterial( { map: texture } ) );
 				scene.add( mesh );
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setClearColor( 0xefd1b5 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 

examples/webgl_geometry_tessellation.html

@@ -228,7 +228,7 @@
 
 			scene.add( mesh );
 
-			renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+			renderer = new THREE.WebGLRenderer( { antialias: true } );
 			renderer.setClearColor( 0x050505, 1 );
 			renderer.setSize( WIDTH, HEIGHT );
 

examples/webgl_interactive_cubes_gpu.html

@@ -170,7 +170,7 @@
 
 				projector = new THREE.Projector();
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setClearColor( 0xffffff, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.sortObjects = false;

examples/webgl_interactive_voxelpainter.html

@@ -273,6 +273,7 @@
 				if ( intersects.length > 0 ) {
 
 					intersector = getRealIntersector( intersects );
+
 					if ( intersector ) {
 
 						setVoxelPosition( intersector );

examples/webgl_lensflares.html

@@ -179,7 +179,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				// stats
 

examples/webgl_lights_hemisphere.html

@@ -232,7 +232,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 				renderer.shadowMapCullFace = THREE.CullFaceBack;

examples/webgl_lights_pointlights2.html

@@ -220,7 +220,7 @@
 
 				// RENDERER
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
@@ -228,7 +228,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				// STATS
 

examples/webgl_lines_colors.html

@@ -87,7 +87,7 @@
 
 				scene = new THREE.Scene();
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.autoClear = false;
 

examples/webgl_lines_dashed.html

@@ -94,7 +94,7 @@
 				objects.push( object );
 				scene.add( object );
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setClearColor( 0x111111, 1 );
 				renderer.setSize( WIDTH, HEIGHT );
 

examples/webgl_loader_collada_skinning.html

@@ -71,7 +71,7 @@
 				light.position.set( 0, -4, -4 ).normalize();
 				scene.add( light );
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.sortObjects = false;

examples/webgl_loader_ctm.html

@@ -125,7 +125,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 
@@ -159,7 +158,7 @@
 
 				loader.load( "models/ctm/ben.ctm",   function( geometry ) {
 
-					var material = new THREE.MeshLambertMaterial( { color: 0xffaa00, map: THREE.ImageUtils.loadTexture( "textures/ash_uvgrid01.jpg" ), envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
+					var material = new THREE.MeshLambertMaterial( { color: 0xffaa00, map: THREE.ImageUtils.loadTexture( "textures/UV_Grid_Sm.jpg" ), envMap: reflectionCube, combine: THREE.MixOperation, reflectivity: 0.3 } );
 					callbackModel( geometry, 450, material, 0, -200, 0, 0, 0 );
 					checkTime();
 
@@ -201,11 +200,11 @@
 					uniforms[ "enableDiffuse" ].value = true;
 					uniforms[ "enableSpecular" ].value = true;
 
-					uniforms[ "uDiffuseColor" ].value.setHex( diffuse );
-					uniforms[ "uSpecularColor" ].value.setHex( specular );
-					uniforms[ "uAmbientColor" ].value.setHex( ambient );
+					uniforms[ "diffuse" ].value.setHex( diffuse );
+					uniforms[ "specular" ].value.setHex( specular );
+					uniforms[ "ambient" ].value.setHex( ambient );
 
-					uniforms[ "uShininess" ].value = shininess;
+					uniforms[ "shininess" ].value = shininess;
 
 					uniforms[ "wrapRGB" ].value.set( 0.75, 0.5, 0.5 );
 

examples/webgl_loader_ctm_materials.html

@@ -146,7 +146,7 @@
 
 				// RENDERER
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 				renderer.domElement.style.position = "relative";
 
@@ -158,7 +158,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				// STATS
 

examples/webgl_loader_json_objconverter.html

@@ -15,16 +15,16 @@
 			}
 			h1 { }
 			a { color:skyblue }
-			canvas { pointer-events:none; z-index:10; }
 
-			#d { text-align:center; margin:1em 0 -9.2em 0; z-index:0; position:relative; display:block }
+			#info { position:absolute; top:0px; width: 100%; text-align:center; }
 			.button { background:#000; color:#fff; padding:0.2em 0.5em; cursor:pointer }
 			.inactive { background:#999; color:#eee }
 		</style>
 	</head>
 
 	<body>
-		<div id="d">
+		<div id="container"></div>
+		<div id="info">
 			<h1>OBJ to Three.js converter test</h1>
 
 			<span id="rcanvas" class="button inactive">2d canvas renderer</span>
@@ -46,7 +46,7 @@
 			var SCREEN_HEIGHT = window.innerHeight;
 			var FLOOR = -250;
 
-			var container,stats;
+			var container, stats;
 
 			var camera, scene;
 			var canvasRenderer, webglRenderer;
@@ -75,8 +75,7 @@
 
 			function init() {
 
-				container = document.createElement( 'div' );
-				document.body.appendChild( container );
+				container = document.getElementById( 'container' );
 
 				camera = new THREE.PerspectiveCamera( 75, SCREEN_WIDTH / SCREEN_HEIGHT, 1, 100000 );
 				camera.position.z = 500;
@@ -136,7 +135,7 @@
 				var ambient = new THREE.AmbientLight( 0x221100 );
 				scene.add( ambient );
 
-				var directionalLight = new THREE.DirectionalLight( 0xffeedd );
+				var directionalLight = new THREE.DirectionalLight( 0xffeedd, 1.5 );
 				directionalLight.position.set( 0, -70, 100 ).normalize();
 				scene.add( directionalLight );
 

examples/webgl_loader_obj.html

@@ -83,7 +83,7 @@
 				var texture = new THREE.Texture();
 
 				var loader = new THREE.ImageLoader( manager );
-				loader.load( 'textures/ash_uvgrid01.jpg', function ( image ) {
+				loader.load( 'textures/UV_Grid_Sm.jpg', function ( image ) {
 
 					texture.image = image;
 					texture.needsUpdate = true;

examples/webgl_loader_ply.html

@@ -114,14 +114,13 @@
 
 				// renderer
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.setClearColor( scene.fog.color, 1 );
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 				renderer.shadowMapCullFace = THREE.CullFaceBack;

examples/webgl_loader_scene.html

@@ -253,7 +253,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				stats = new Stats();
 				stats.domElement.style.position = 'absolute';

examples/webgl_loader_stl.html

@@ -156,14 +156,13 @@
 
 				// renderer
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				renderer.setClearColor( scene.fog.color, 1 );
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 				renderer.shadowMapCullFace = THREE.CullFaceBack;

examples/webgl_loader_utf8.html

@@ -125,7 +125,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				renderer.shadowMapEnabled = true;
 				renderer.shadowMapType = THREE.PCFShadowMap;

examples/webgl_loader_vrml.html

@@ -94,7 +94,6 @@
 				// renderer
 
 				renderer = new THREE.WebGLRenderer( { antialias: false } );
-				renderer.setClearColor( 0x000000, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				container = document.createElement( 'div' );
@@ -137,4 +136,4 @@
 		</script>
 
 	</body>
-</html>
+</html>

examples/webgl_loader_vtk.html

@@ -100,7 +100,6 @@
 				// renderer
 
 				renderer = new THREE.WebGLRenderer( { antialias: false } );
-				renderer.setClearColor( 0x000000, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
 				container = document.createElement( 'div' );

examples/webgl_lod.html

@@ -120,7 +120,7 @@
 				}
 
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.sortObjects = false;
 				container.appendChild( renderer.domElement );

examples/webgl_marchingcubes.html

@@ -157,7 +157,7 @@
 
 			// RENDERER
 
-			renderer = new THREE.WebGLRenderer( { alpha: false } );
+			renderer = new THREE.WebGLRenderer();
 			renderer.setClearColor( 0x050505, 1 );
 			renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
@@ -171,7 +171,6 @@
 
 			renderer.gammaInput = true;
 			renderer.gammaOutput = true;
-			renderer.physicallyBasedShading = true;
 
 			// CONTROLS
 
@@ -285,7 +284,7 @@
 			dottedMaterial2.uniforms.uBaseColor.value.setRGB( 0, 0, 0 );
 			dottedMaterial2.uniforms.uLineColor1.value.setHSL( 0.05, 1.0, 0.5 );
 
-			var texture = THREE.ImageUtils.loadTexture( "textures/ash_uvgrid01.jpg" );
+			var texture = THREE.ImageUtils.loadTexture( "textures/UV_Grid_Sm.jpg" );
 			texture.wrapS = texture.wrapT = THREE.RepeatWrapping;
 
 			var materials = {

examples/webgl_materials2.html

@@ -119,7 +119,7 @@
 
 				//
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setClearColor( 0x0a0a0a, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.sortObjects = true;
@@ -128,7 +128,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				//
 

examples/webgl_materials_blending.html

@@ -74,7 +74,7 @@
 
 				var blendings = [ "NoBlending", "NormalBlending", "AdditiveBlending", "SubtractiveBlending", "MultiplyBlending", "AdditiveAlphaBlending" ];
 
-				var map0 = THREE.ImageUtils.loadTexture( 'textures/ash_uvgrid01.jpg' );
+				var map0 = THREE.ImageUtils.loadTexture( 'textures/UV_Grid_Sm.jpg' );
 				var map1 = THREE.ImageUtils.loadTexture( 'textures/sprite0.jpg' );
 				var map2 = THREE.ImageUtils.loadTexture( 'textures/sprite0.png' );
 				var map3 = THREE.ImageUtils.loadTexture( 'textures/lensflare/lensflare0.png' );
@@ -117,7 +117,7 @@
 
 				// RENDERER
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				document.body.appendChild( renderer.domElement );
 

examples/webgl_materials_blending_custom.html

@@ -281,7 +281,7 @@
 
 				// RENDERER
 
-				renderer = new THREE.WebGLRenderer( { alpha: false } );
+				renderer = new THREE.WebGLRenderer();
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 
 				renderer.domElement.style.position = "absolute";

examples/webgl_materials_bumpmap.html

@@ -176,7 +176,7 @@
 
 				loader.load( "obj/leeperrysmith/LeePerrySmith.js", function( geometry ) { createScene( geometry, 100, material ) } );
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( 0x060708, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );
@@ -188,7 +188,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				//
 

examples/webgl_materials_bumpmap_skin.html

@@ -179,7 +179,7 @@
 
 				//
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( 0x060708, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );
@@ -197,7 +197,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				//
 
@@ -276,9 +275,9 @@
 				uniforms[ "bumpMap" ].value = mapHeight;
 				uniforms[ "specularMap" ].value = mapSpecular;
 
-				uniforms[ "uAmbientColor" ].value.setHex( 0xa0a0a0 );
-				uniforms[ "uDiffuseColor" ].value.setHex( 0xa0a0a0 );
-				uniforms[ "uSpecularColor" ].value.setHex( 0xa0a0a0 );
+				uniforms[ "ambient" ].value.setHex( 0xa0a0a0 );
+				uniforms[ "diffuse" ].value.setHex( 0xa0a0a0 );
+				uniforms[ "specular" ].value.setHex( 0xa0a0a0 );
 
 				uniforms[ "uRoughness" ].value = 0.145;
 				uniforms[ "uSpecularBrightness" ].value = 0.75;

examples/webgl_materials_cubemap_dynamic.html

@@ -193,7 +193,7 @@
 
 				// RENDERER
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 

examples/webgl_materials_lightmap.html

@@ -134,7 +134,7 @@
 
 				// RENDERER
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setClearColor( scene.fog.color, 1 );
 				renderer.setSize( SCREEN_WIDTH, SCREEN_HEIGHT );
 				renderer.domElement.style.position = "relative";
@@ -142,7 +142,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				// STATS
 

examples/webgl_materials_normalmap.html

@@ -173,18 +173,18 @@
 
 				uniforms[ "uNormalScale" ].value.y = -1;
 
-				uniforms[ "uDiffuseColor" ].value.setHex( diffuse );
-				uniforms[ "uSpecularColor" ].value.setHex( specular );
-				uniforms[ "uAmbientColor" ].value.setHex( ambient );
+				uniforms[ "diffuse" ].value.setHex( diffuse );
+				uniforms[ "specular" ].value.setHex( specular );
+				uniforms[ "ambient" ].value.setHex( ambient );
 
-				uniforms[ "uShininess" ].value = shininess;
+				uniforms[ "shininess" ].value = shininess;
 
 				uniforms[ "tCube" ].value = reflectionCube;
-				uniforms[ "uReflectivity" ].value = 0.1;
+				uniforms[ "reflectivity" ].value = 0.1;
 
-				uniforms[ "uDiffuseColor" ].value.convertGammaToLinear();
-				uniforms[ "uSpecularColor" ].value.convertGammaToLinear();
-				uniforms[ "uAmbientColor" ].value.convertGammaToLinear();
+				uniforms[ "diffuse" ].value.convertGammaToLinear();
+				uniforms[ "specular" ].value.convertGammaToLinear();
+				uniforms[ "ambient" ].value.convertGammaToLinear();
 
 
 				var parameters = { fragmentShader: shader.fragmentShader, vertexShader: shader.vertexShader, uniforms: uniforms, lights: true, fog: false };
@@ -219,7 +219,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				//
 

examples/webgl_materials_normalmap2.html

@@ -135,11 +135,11 @@
 				uniforms[ "enableDiffuse" ].value = true;
 				uniforms[ "enableSpecular" ].value = true;
 
-				uniforms[ "uDiffuseColor" ].value.setHex( diffuse );
-				uniforms[ "uSpecularColor" ].value.setHex( specular );
-				uniforms[ "uAmbientColor" ].value.setHex( ambient );
+				uniforms[ "diffuse" ].value.setHex( diffuse );
+				uniforms[ "specular" ].value.setHex( specular );
+				uniforms[ "ambient" ].value.setHex( ambient );
 
-				uniforms[ "uShininess" ].value = shininess;
+				uniforms[ "shininess" ].value = shininess;
 
 				uniforms[ "wrapRGB" ].value.set( 0.575, 0.5, 0.5 );
 
@@ -153,7 +153,7 @@
 
 				loader.load( "obj/leeperrysmith/LeePerrySmith.js", function( geometry ) { createScene( geometry, 100, material ) } );
 
-				renderer = new THREE.WebGLRenderer( { antialias: false, alpha: false } );
+				renderer = new THREE.WebGLRenderer( { antialias: false } );
 				renderer.setClearColor( 0x111111, 1 );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );
@@ -162,7 +162,6 @@
 
 				renderer.gammaInput = true;
 				renderer.gammaOutput = true;
-				renderer.physicallyBasedShading = true;
 
 				//