Merge remote-tracking branch 'upstream/dev' into dev12

docs/api/core/Object3D.html

@@ -45,7 +45,7 @@
 		<h3>[property:Integer id]</h3>
 		<p>readonly – Unique number for this object instance.</p>
 
-		<h3>[property:Boolean isObject]</h3>
+		<h3>[property:Boolean isObject3D]</h3>
 		<p>
 			Used to check whether this or derived classes are Object3Ds. Default is *true*.<br /><br />
 

docs/api/extras/core/Font.html

@@ -46,11 +46,10 @@
 
 		<h2>Methods</h2>
 
-		<h3>[method:null generateShapes]( [param:String text], [param:Float size], [param:Integer divisions] )</h3>
+		<h3>[method:null generateShapes]( [param:String text], [param:Float size] )</h3>
 		<p>
 			[page:String text] -- string of text.<br />
 			[page:Float size] -- (optional) scale for the [page:Shape Shapes]. Default is *100*.<br />
-			[page:Integer divisions] -- (optional) fineness of the [page:Shape Shapes]. Default is *4*.<br />
 
 			Creates an array of [page:Shape Shapes] representing the text in the font.
 		</p>

docs/api/geometries/BoxBufferGeometry.html

@@ -54,9 +54,12 @@
 
 		<h2>Properties</h2>
 
-		<h3>.parameters</h3>
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
  		<p>
-			<p>Using the above example code above as our basis:</p>
+			Using the above example code above as our basis:
 			<code>
 		geometry.parameters; // outputs an object {width: 1, height: 1, depth: 1, widthSegments: undefined, heightSegments: undefined}
 		cube.geometry.parameters; // as above

docs/api/geometries/BoxGeometry.html

@@ -54,9 +54,12 @@
 
 		<h2>Properties</h2>
 
-		<h3>.parameters</h3>
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
  		<p>
-			<p>Using the above example code above as our basis:</p>
+			Using the above example code above as our basis:
 			<code>
 				geometry.parameters; // outputs an object {width: 1, height: 1, depth: 1, widthSegments: undefined, heightSegments: undefined}
 				cube.geometry.parameters; // as above

docs/api/geometries/CircleBufferGeometry.html

@@ -51,6 +51,13 @@
 		thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete circle.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/CircleGeometry.js src/geometries/CircleGeometry.js]

docs/api/geometries/CircleGeometry.html

@@ -52,6 +52,13 @@
 		thetaLength — The central angle, often called theta, of the circular sector. The default is 2*Pi, which makes for a complete circle.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/ConeBufferGeometry.html

@@ -55,8 +55,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>[property:Object parameters]</h3>
 		<p>
-		Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/ConeGeometry.html

@@ -55,8 +55,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>[property:Object parameters]</h3>
 		<p>
-		Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/CylinderBufferGeometry.html

@@ -56,8 +56,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>[property:Object parameters]</h3>
 		<p>
-		Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/CylinderGeometry.html

@@ -56,8 +56,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>[property:Object parameters]</h3>
 		<p>
-		Each of the constructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/DodecahedronBufferGeometry.html

@@ -44,7 +44,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/DodecahedronGeometry.html

@@ -44,7 +44,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/EdgesGeometry.html

@@ -33,6 +33,13 @@ scene.add( line );
 		thresholdAngle — An edge is only rendered if the angle (in degrees) between the face normals of the adjoining faces exceeds this value. default = 1 degree.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/ExtrudeBufferGeometry.html

@@ -92,6 +92,13 @@
 			applied to the face; the second material will be applied to the sides.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/ExtrudeGeometry.js src/geometries/ExtrudeGeometry.js]

docs/api/geometries/ExtrudeGeometry.html

@@ -92,6 +92,13 @@
 			applied to the face; the second material will be applied to the sides.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/IcosahedronBufferGeometry.html

@@ -43,7 +43,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/IcosahedronGeometry.html

@@ -44,7 +44,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/LatheBufferGeometry.html

@@ -58,6 +58,13 @@
 		This creates a LatheBufferGeometry based on the parameters.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/LatheGeometry.js src/geometries/LatheGeometry.js]

docs/api/geometries/LatheGeometry.html

@@ -58,6 +58,13 @@
 		This creates a LatheGeometry based on the parameters.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/OctahedronBufferGeometry.html

@@ -43,7 +43,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/OctahedronGeometry.html

@@ -44,7 +44,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/ParametricBufferGeometry.html

@@ -52,6 +52,13 @@
 		stacks — The count of stacks to use for the parametric function
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 
 		<h2>Source</h2>
 

docs/api/geometries/ParametricGeometry.html

@@ -53,6 +53,14 @@
 		</p>
 
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/PlaneBufferGeometry.html

@@ -52,8 +52,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/PlaneGeometry.html

@@ -52,8 +52,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible in the parameters property of the object. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/PolyhedronBufferGeometry.html

@@ -53,7 +53,7 @@ var geometry = new THREE.PolyhedronBufferGeometry( verticesOfCube, indicesOfFace
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 

docs/api/geometries/PolyhedronGeometry.html

@@ -51,7 +51,7 @@ var geometry = new THREE.PolyhedronGeometry( verticesOfCube, indicesOfFaces, 6,
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 

docs/api/geometries/RingBufferGeometry.html

@@ -52,6 +52,15 @@
 		thetaLength — Central angle.  Default is Math.PI * 2.
 		</p>
 
+
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/RingGeometry.js src/geometries/RingGeometry.js]

docs/api/geometries/RingGeometry.html

@@ -52,6 +52,14 @@
 		thetaLength — Central angle.  Default is Math.PI * 2.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+		
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/ShapeBufferGeometry.html

@@ -64,6 +64,13 @@
 		curveSegments - [page:Integer] - Number of segments per shape. Default is 12.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/ShapeGeometry.js src/geometries/ShapeGeometry.js]

docs/api/geometries/ShapeGeometry.html

@@ -64,6 +64,13 @@
 		curveSegments - [page:Integer] - Number of segments per shape. Default is 12.
 		</p>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 
 		<h2>Source</h2>
 

docs/api/geometries/SphereBufferGeometry.html

@@ -60,8 +60,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/SphereGeometry.html

@@ -60,8 +60,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/TetrahedronBufferGeometry.html

@@ -44,9 +44,11 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
+
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/TetrahedronGeometry.js src/geometries/TetrahedronGeometry.js]

docs/api/geometries/TetrahedronGeometry.html

@@ -44,7 +44,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/TextBufferGeometry.html

@@ -153,6 +153,13 @@
 			</tr>
 		</table>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/geometries/TextGeometry.js src/geometries/TextGeometry.js]

docs/api/geometries/TextGeometry.html

@@ -153,6 +153,13 @@
 			</tr>
 		</table>
 
+		<h2>Properties</h2>
+
+		<h3>[property:Object parameters]</h3>
+		<p>
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/src/[path].js src/[path].js]

docs/api/geometries/TorusBufferGeometry.html

@@ -53,8 +53,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/TorusGeometry.html

@@ -53,8 +53,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/TorusKnotBufferGeometry.html

@@ -56,8 +56,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/TorusKnotGeometry.html

@@ -56,8 +56,9 @@
 
 		<h2>Properties</h2>
 
+		<h3>.parameters</h3>
 		<p>
-		Each of the contructor parameters is accessible as a property of the same name. Any modification of these properties after instantiation does not change the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h2>Source</h2>

docs/api/geometries/TubeBufferGeometry.html

@@ -80,7 +80,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h3>[property:Array tangents]</h3>

docs/api/geometries/TubeGeometry.html

@@ -80,7 +80,7 @@
 
 		<h3>[property:Object parameters]</h3>
 		<p>
-		An object with all of the parameters that were used to generate the geometry.
+		An object with a property for each of the constructor parameters. Any modification after instantiation does not change the geometry.
 		</p>
 
 		<h3>[property:Array tangents]</h3>

docs/api/loaders/CubeTextureLoader.html

@@ -56,7 +56,7 @@ scene.background = new THREE.CubeTextureLoader()
 		<p>
 		If set, assigns the [link:https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_settings_attributes crossOrigin]
 	 attribute of the image to the value of *crossOrigin*,
-		prior to starting the load. Default is *undefined*.
+		prior to starting the load. Default is *"Anonymous"*.
 		</p>
 
 		<h3>[property:LoadingManager manager]</h3>

docs/api/loaders/ImageLoader.html

@@ -69,7 +69,7 @@
 		<h3>[property:String crossOrigin]</h3>
 		<p>
 		If set, assigns the [link:https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_settings_attributes crossOrigin]
-	 attribute of the image to the value of *crossOrigin*, prior to starting the load. Default is *undefined*.
+	 attribute of the image to the value of *crossOrigin*, prior to starting the load. Default is *"Anonymous"*.
 		</p>
 
 		<h3>[property:LoadingManager manager]</h3>

docs/api/loaders/TextureLoader.html

@@ -72,7 +72,7 @@
 		<h3>[property:String crossOrigin]</h3>
 		<p>
 		If set, assigns the [link:https://developer.mozilla.org/en-US/docs/Web/HTML/CORS_settings_attributes crossOrigin]
-	 attribute of the image to the value of *crossOrigin*, prior to starting the load. Default is *undefined*.
+	 attribute of the image to the value of *crossOrigin*, prior to starting the load. Default is *"Anonymous"*.
 		</p>
 
 

docs/api/materials/MeshPhongMaterial.html

@@ -178,6 +178,13 @@
 			the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting.
 		</p>
 
+		<h3>[property:Integer normalMapType]</h3>
+		<p>
+			The type of normal map.<br /><br />
+
+			Options are [page:constant THREE.TangentSpaceNormalMap] (default), and [page:constant THREE.ObjectSpaceNormalMap].
+		</p>
+
 		<h3>[property:Vector2 normalScale]</h3>
 		<p>
 			How much the normal map affects the material. Typical ranges are 0-1.

docs/api/materials/MeshStandardMaterial.html

@@ -220,6 +220,13 @@
 			the way the color is lit. Normal maps do not change the actual shape of the surface, only the lighting.
 		</p>
 
+		<h3>[property:Integer normalMapType]</h3>
+		<p>
+			The type of normal map.<br /><br />
+
+			Options are [page:constant THREE.TangentSpaceNormalMap] (default), and [page:constant THREE.ObjectSpaceNormalMap].
+		</p>
+
 		<h3>[property:Vector2 normalScale]</h3>
 		<p>
 			How much the normal map affects the material. Typical ranges are 0-1.

docs/api/renderers/WebGLRenderer.html

@@ -286,10 +286,6 @@
 		See [page:WebGLRenderer.capabilities capabilities.maxTextures].
 		</p>
 
-		<h3>[method:null animate]( [param:Function callback] )</h3>
-		<p>[page:Function callback] — The function will be called every available frame. If `null` is passed it will stop any already ongoing animation.</p>
-		<p>A build in function that can be used instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame requestAnimationFrame]. For WebVR projects this function must be used.</p>
-
 		<h3>[method:null clear]( [param:Boolean color], [param:Boolean depth], [param:Boolean stencil] )</h3>
 		<p>
 		Tells the renderer to clear its color, depth or stencil drawing buffer(s).
@@ -407,6 +403,10 @@
 		Render an immediate buffer. Gets called by renderImmediateObject.
 		</p>
 
+		<h3>[method:null setAnimationLoop]( [param:Function callback] )</h3>
+		<p>[page:Function callback] — The function will be called every available frame. If `null` is passed it will stop any already ongoing animation.</p>
+		<p>A build in function that can be used instead of [link:https://developer.mozilla.org/en-US/docs/Web/API/window/requestAnimationFrame requestAnimationFrame]. For WebVR projects this function must be used.</p>
+
 		<h3>[method:null setClearAlpha]( [param:Float alpha] )</h3>
 		<p>Sets the clear alpha. Valid input is a float between *0.0* and *1.0*.</p>
 

docs/examples/controls/OrbitControls.html

@@ -57,7 +57,7 @@ function animate() {
 			[page:Camera object]: (required) The camera to be controlled.<br><br>
 
 			[page:HTMLDOMElement domElement]: (optional) The HTML element used for event listeners. By default this is the whole document,
-			however if you only want to the controls to work over a specific element (e.g. the canvas) you can specify that here.
+			however if you only want the controls to work over a specific element (e.g. the canvas) you can specify that here.
 		</p>
 
 

docs/examples/loaders/OBJLoader.html

@@ -89,6 +89,19 @@
 		If an <em>obj</em> object or group uses multiple materials while declaring faces, geometry groups and an array of materials are used.
 		</p>
 
+		<h3>[method:OBJLoader setMaterials]( [param:Array materials] )</h3>
+		<p>
+		[page:Array materials] - Array of [page:Material Materials].
+		</p>
+		<p>
+		Sets materials loaded by MTLLoader or any other supplier of an Array of [page:Material Materials].
+		</p>
+
+		<h3>[method:OBJLoader setPath]( [param:String path] )</h3>
+		<p>
+		Sets the base path or URL from which to load files. This can be useful to avoid repetition if you are calling [page:OBJLoader.load .load] multiple times on the same directory.
+		</p>
+
 		<h2>Source</h2>
 
 		[link:https://github.com/mrdoob/three.js/blob/master/examples/js/loaders/OBJLoader.js examples/js/loaders/OBJLoader.js]

docs/manual/introduction/Animation-system.html

@@ -35,7 +35,7 @@
 		<p class="desc">
 
 			If you have successfully imported an animated 3D object (it doesn't matter if it has
-			bones or morph targets or both) — for example exporting, it from Blender with the
+			bones or morph targets or both) — for example exporting it from Blender with the
 			[link:https://github.com/KhronosGroup/glTF-Blender-Exporter glTF Blender exporter] and
 			loading it into a three.js scene using [page:GLTFLoader] — one of the response fields
 			should be an array named "animations", containing the [page:AnimationClip AnimationClips]

docs/manual/introduction/Loading-3D-models.html

@@ -16,7 +16,7 @@
   <p>
     3D models are available in hundreds of file formats, each with different
     purposes, assorted features, and varying complexity. Although
-    <a href="https://github.com/mrdoob/three.js/tree/dev/examples/js/loaders">
+    <a href="https://github.com/mrdoob/three.js/tree/dev/examples/js/loaders" target="_blank" rel="noopener">
     three.js provides many loaders</a>, choosing the right format and
     workflow will save time and frustration later on. Some formats are
     difficult to work with, inefficient for realtime experiences, or simply not
@@ -50,25 +50,25 @@
 
   <p>
     Public-domain glTF files are available on sites like
-    <a href="https://sketchfab.com/models?features=downloadable&sort_by=-likeCount&type=models">
+    <a href="https://sketchfab.com/models?features=downloadable&sort_by=-likeCount&type=models" target="_blank" rel="noopener">
     Sketchfab</a>, or various tools include glTF export:
   </p>
 
   <ul>
-    <li><a href="https://github.com/KhronosGroup/glTF-Blender-Exporter">glTF-Blender-Exporter</a> by the Khronos Group</li>
-    <li><a href="https://github.com/KhronosGroup/COLLADA2GLTF">COLLADA2GLTF</a> by the Khronos Group</li>
-    <li><a href="https://github.com/facebookincubator/FBX2glTF">FBX2GLTF</a> by Facebook</li>
-    <li><a href="https://github.com/AnalyticalGraphicsInc/obj2gltf">OBJ2GLTF</a> by Analytical Graphics Inc</li>
-    <li><a href="https://www.allegorithmic.com/products/substance-painter">Substance Painter</a> by Allegorithmic</li>
-    <li><a href="https://www.foundry.com/products/modo">Modo</a> by Foundry</li>
-    <li><a href="https://www.marmoset.co/toolbag/">Toolbag</a> by Marmoset</li>
-    <li>&hellip;and <a href="https://github.com/khronosgroup/gltf#gltf-tools">many more</a></li>
+    <li><a href="https://github.com/KhronosGroup/glTF-Blender-Exporter" target="_blank" rel="noopener">glTF-Blender-Exporter</a> by the Khronos Group</li>
+    <li><a href="https://github.com/KhronosGroup/COLLADA2GLTF" target="_blank" rel="noopener">COLLADA2GLTF</a> by the Khronos Group</li>
+    <li><a href="https://github.com/facebookincubator/FBX2glTF" target="_blank" rel="noopener">FBX2GLTF</a> by Facebook</li>
+    <li><a href="https://github.com/AnalyticalGraphicsInc/obj2gltf" target="_blank" rel="noopener">OBJ2GLTF</a> by Analytical Graphics Inc</li>
+    <li><a href="https://www.allegorithmic.com/products/substance-painter" target="_blank" rel="noopener">Substance Painter</a> by Allegorithmic</li>
+    <li><a href="https://www.foundry.com/products/modo" target="_blank" rel="noopener">Modo</a> by Foundry</li>
+    <li><a href="https://www.marmoset.co/toolbag/" target="_blank" rel="noopener">Toolbag</a> by Marmoset</li>
+    <li>&hellip;and <a href="https://github.com/khronosgroup/gltf#gltf-tools" target="_blank" rel="noopener">many more</a></li>
   </ul>
 
   <p>
     If your preferred tools do not support glTF, consider requesting glTF
     export from the authors, or posting on
-    <a href="https://github.com/KhronosGroup/glTF/issues/1051">the glTF roadmap thread</a>.
+    <a href="https://github.com/KhronosGroup/glTF/issues/1051" target="_blank" rel="noopener">the glTF roadmap thread</a>.
   </p>
 
   <p>
@@ -92,10 +92,10 @@
     <li>
       View the model in another application. For glTF, drag-and-drop viewers
       are available for
-      <a href="https://gltf-viewer.donmccurdy.com/">three.js</a> and
-      <a href="http://sandbox.babylonjs.com/">babylon.js</a>. If the model
+      <a href="https://gltf-viewer.donmccurdy.com/" target="_blank" rel="noopener">three.js</a> and
+      <a href="http://sandbox.babylonjs.com/" target="_blank" rel="noopener">babylon.js</a>. If the model
       appears correctly in one or more applications,
-      <a href="https://github.com/mrdoob/three.js/issues/new">file a bug against three.js</a>.
+      <a href="https://github.com/mrdoob/three.js/issues/new" target="_blank" rel="noopener">file a bug against three.js</a>.
       If the model cannot be shown in any application, we strongly encourage
       filing a bug with the application used to create the model.
     </li>
@@ -118,7 +118,7 @@
     If you've gone through the troubleshooting process above and your model
     still isn't working, the right approach to asking for help will get you to
     a solution faster. Post a question on the
-    <a href="https://discourse.threejs.org/">three.js forum</a> and, whenever possible,
+    <a href="https://discourse.threejs.org/" target="_blank" rel="noopener">three.js forum</a> and, whenever possible,
     include your model (or a simpler model with the same problem) in any formats
     you have available. Include enough information for someone else to reproduce
     the issue quickly — ideally, a live demo.

docs/scenes/geometry-browser.html

@@ -72,36 +72,20 @@
 			scene.add( lights[ 1 ] );
 			scene.add( lights[ 2 ] );
 
-			var mesh = new THREE.Object3D();
+			var group = new THREE.Group();
 
-			mesh.add( new THREE.LineSegments(
+			var geometry = new THREE.BufferGeometry();
+			geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( [], 3 ) );
 
-				new THREE.Geometry(),
+			var lineMaterial = new THREE.LineBasicMaterial( { color: 0xffffff, transparent: true, opacity: 0.5 } );
+			var meshMaterial = new THREE.MeshPhongMaterial( { color: 0x156289, emissive: 0x072534, side: THREE.DoubleSide, flatShading: true } );
 
-				new THREE.LineBasicMaterial( {
-					color: 0xffffff,
-					transparent: true,
-					opacity: 0.5
-				} )
+			group.add( new THREE.LineSegments( geometry, lineMaterial ) );
+			group.add( new THREE.Mesh( geometry, meshMaterial ) );
 
-			) );
+			var options = chooseFromHash( group );
 
-			mesh.add( new THREE.Mesh(
-
-				new THREE.Geometry(),
-
-				new THREE.MeshPhongMaterial( {
-					color: 0x156289,
-					emissive: 0x072534,
-					side: THREE.DoubleSide,
-					flatShading: true
-				} )
-
-			) );
-
-			var options = chooseFromHash( mesh );
-
-			scene.add( mesh );
+			scene.add( group );
 
 			var prevFog = false;
 
@@ -111,8 +95,8 @@
 
 				if ( ! options.fixed ) {
 
-					mesh.rotation.x += 0.005;
-					mesh.rotation.y += 0.005;
+					group.rotation.x += 0.005;
+					group.rotation.y += 0.005;
 
 				}
 

editor/index.html

@@ -4,12 +4,12 @@
 		<title>three.js / editor</title>
 		<meta charset="utf-8">
 		<meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
-		<!-- Origin Trial Token, feature = WebVR (For Chrome M62+), origin = https://threejs.org, expires = 2018-06-19 -->
-		<meta http-equiv="origin-trial" data-feature="WebVR (For Chrome M62+)" data-expires="2018-06-19" content="Alxt96tYGgIr9l6EXU0eeI360zcmzOY6Kuo3kcTfBGIRDOQbgFIZKRQ1joExQ74WZr1einsE+cUMHgSclNHCQQ4AAABQeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJWUjEuMU02MiIsImV4cGlyeSI6MTUyOTM5NzgyOH0=">
-		<!-- Origin Trial Token, feature = WebXR Device API, origin = https://threejs.org, expires = 2018-06-15 -->
-		<meta http-equiv="origin-trial" data-feature="WebXR Device API" data-expires="2018-06-15" content="AtJH9g6nn0B87bnjJt+9m1joZXEYDmLSlRvtMr5qJD52hMcm3S86S7jg5I7y2I5cgQglE0rzsXzti5DECQLb8QkAAABQeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJYUkRldmljZSIsImV4cGlyeSI6MTUyOTA4NDY2OH0=">
-		<!-- Origin Trial Token, feature = WebXR Gamepad Support, origin = https://threejs.org, expires = 2018-06-15 -->
-		<meta http-equiv="origin-trial" data-feature="WebXR Gamepad Support" data-expires="2018-06-15" content="Aihhr0yXkVlCKF0DIpTbH8WX7ZmEexUhI/95+t8aoLfvBkePMiZ/iOoDPU3xefyfuczkDahH1L6eiPvRsuzITAAAAABYeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJYUkdhbWVwYWRTdXBwb3J0IiwiZXhwaXJ5IjoxNTI5MDg0NjY4fQ==">
+		<!-- Origin Trial Token, feature = WebVR (For Chrome M62+), origin = https://threejs.org, expires = 2018-07-25 -->
+		<meta http-equiv="origin-trial" data-feature="WebVR (For Chrome M62+)" data-expires="2018-07-25" content="AtW06hJFoVWUJTZf5gqymMIlrR60JJi5MsSe44qsHjrCmzDUNmvaTtAVg+K9O9jFpjJtn/W9jvG//hHHaq5HcQoAAABQeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJWUjEuMU02MiIsImV4cGlyeSI6MTUzMjUyNjI5OH0=">
+		<!-- Origin Trial Token, feature = WebXR Device API, origin = https://threejs.org, expires = 2018-07-21 -->
+		<meta http-equiv="origin-trial" data-feature="WebXR Device API" data-expires="2018-07-21" content="Anlf1R/bCOUxOEgGI/9TWuzHHNxBMfZSTUMDCN7cLwDj2gpLwgA1K0DPwOzO/O0Jwaur5bsHo7k9KXx+6g+82wIAAABQeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJYUkRldmljZSIsImV4cGlyeSI6MTUzMjE2NjIyNX0=">
+		<!-- Origin Trial Token, feature = WebXR Gamepad Support, origin = https://threejs.org, expires = 2018-07-21 -->
+		<meta http-equiv="origin-trial" data-feature="WebXR Gamepad Support" data-expires="2018-07-21" content="ArDsXbwATKHPmvQiPlEIWNCt4DlEjB7bLj9vOgoNmL8r38U+wQNYZyUvjQIqqzgACciUUuAnxluTIL7nNkI89gcAAABYeyJvcmlnaW4iOiJodHRwczovL3RocmVlanMub3JnOjQ0MyIsImZlYXR1cmUiOiJXZWJYUkdhbWVwYWRTdXBwb3J0IiwiZXhwaXJ5IjoxNTMyMTY2MjI1fQ==">
 	</head>
 	<body ontouchstart="">
 		<link href="css/main.css" rel="stylesheet" />

editor/js/libs/app.js

@@ -190,7 +190,7 @@ var APP = {
 
 			dispatch( events.start, arguments );
 
-			renderer.animate( animate );
+			renderer.setAnimationLoop( animate );
 
 		};
 
@@ -207,7 +207,7 @@ var APP = {
 
 			dispatch( events.stop, arguments );
 
-			renderer.animate( null );
+			renderer.setAnimationLoop( null );
 
 		};
 

examples/canvas_lines_colors.html

@@ -85,7 +85,7 @@
 					points = hilbert2D( new THREE.Vector3( 0, 0, 0 ), 400, 4 ),
 					colors2 = [];
 
-				for ( i = 0; i < points.length; i ++ ) {
+				for ( var i = 0; i < points.length; i ++ ) {
 
 					geometry2.vertices.push( points[ i ] );
 
@@ -102,7 +102,7 @@
 					points = hilbert3D( new THREE.Vector3( 0, 0, 0 ), 200, 2, 0, 1, 2, 3, 4, 5, 6, 7 ),
 					colors3 = [];
 
-				for ( i = 0; i < points.length; i ++ ) {
+				for ( var i = 0; i < points.length; i ++ ) {
 
 					geometry3.vertices.push( points[ i ] );
 

examples/css2d_label.html

@@ -70,7 +70,7 @@
 
 				scene2 = new THREE.Scene();
 
-				dirLight = new THREE.DirectionalLight( 0xffffff );
+				var dirLight = new THREE.DirectionalLight( 0xffffff );
 				dirLight.position.set( 0, 0, 1 );
 				scene.add( dirLight );
 

examples/files.js

@@ -72,6 +72,7 @@ var files = {
 		"webgl_lines_colors",
 		"webgl_lines_dashed",
 		"webgl_lines_fat",
+		"webgl_lines_fat_wireframe",
 		"webgl_lines_sphere",
 		"webgl_loader_3ds",
 		"webgl_loader_3mf",

examples/js/RollerCoaster.js

@@ -19,7 +19,7 @@ function RollerCoasterGeometry( curve, divisions ) {
 
 	var quaternion = new THREE.Quaternion();
 	var prevQuaternion = new THREE.Quaternion();
-	prevQuaternion.setFromAxisAngle( up , Math.PI / 2 );
+	prevQuaternion.setFromAxisAngle( up, Math.PI / 2 );
 
 	var point = new THREE.Vector3();
 	var prevPoint = new THREE.Vector3();
@@ -28,13 +28,13 @@ function RollerCoasterGeometry( curve, divisions ) {
 	// shapes
 
 	var step = [
-		new THREE.Vector3( -0.225,  0, 0 ),
-		new THREE.Vector3(  0, -0.050, 0 ),
-		new THREE.Vector3(  0, -0.175, 0 ),
+		new THREE.Vector3( - 0.225, 0, 0 ),
+		new THREE.Vector3( 0, - 0.050, 0 ),
+		new THREE.Vector3( 0, - 0.175, 0 ),
 
-		new THREE.Vector3(  0, -0.050, 0 ),
-		new THREE.Vector3(  0.225,  0, 0 ),
-		new THREE.Vector3(  0, -0.175, 0 )
+		new THREE.Vector3( 0, - 0.050, 0 ),
+		new THREE.Vector3( 0.225, 0, 0 ),
+		new THREE.Vector3( 0, - 0.175, 0 )
 	];
 
 	var PI2 = Math.PI * 2;
@@ -64,7 +64,7 @@ function RollerCoasterGeometry( curve, divisions ) {
 
 	function drawShape( shape, color ) {
 
-		normal.set( 0, 0, -1 ).applyQuaternion( quaternion );
+		normal.set( 0, 0, - 1 ).applyQuaternion( quaternion );
 
 		for ( var j = 0; j < shape.length; j ++ ) {
 
@@ -92,7 +92,7 @@ function RollerCoasterGeometry( curve, divisions ) {
 
 		}
 
-	};
+	}
 
 	var vector1 = new THREE.Vector3();
 	var vector2 = new THREE.Vector3();
@@ -171,7 +171,7 @@ function RollerCoasterGeometry( curve, divisions ) {
 
 		}
 
-	};
+	}
 
 	var offset = new THREE.Vector3();
 
@@ -195,9 +195,9 @@ function RollerCoasterGeometry( curve, divisions ) {
 
 		}
 
-		extrudeShape( tube1, offset.set(  0,  -0.125, 0 ), color2 );
-		extrudeShape( tube2, offset.set(  0.2, 0,     0 ), color1 );
-		extrudeShape( tube2, offset.set( -0.2, 0,     0 ), color1 );
+		extrudeShape( tube1, offset.set( 0, - 0.125, 0 ), color2 );
+		extrudeShape( tube2, offset.set( 0.2, 0, 0 ), color1 );
+		extrudeShape( tube2, offset.set( - 0.2, 0, 0 ), color1 );
 
 		prevPoint.copy( point );
 		prevQuaternion.copy( quaternion );
@@ -210,7 +210,7 @@ function RollerCoasterGeometry( curve, divisions ) {
 	this.addAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( normals ), 3 ) );
 	this.addAttribute( 'color', new THREE.BufferAttribute( new Float32Array( colors ), 3 ) );
 
-};
+}
 
 RollerCoasterGeometry.prototype = Object.create( THREE.BufferGeometry.prototype );
 
@@ -231,21 +231,21 @@ function RollerCoasterLiftersGeometry( curve, divisions ) {
 	// shapes
 
 	var tube1 = [
-		new THREE.Vector3(  0,  0.05, -0.05 ),
-		new THREE.Vector3(  0,  0.05,  0.05 ),
-		new THREE.Vector3(  0, -0.05,  0 )
+		new THREE.Vector3( 0, 0.05, - 0.05 ),
+		new THREE.Vector3( 0, 0.05, 0.05 ),
+		new THREE.Vector3( 0, - 0.05, 0 )
 	];
 
 	var tube2 = [
-		new THREE.Vector3( -0.05, 0,  0.05 ),
-		new THREE.Vector3( -0.05, 0, -0.05 ),
-		new THREE.Vector3(  0.05, 0,  0 )
+		new THREE.Vector3( - 0.05, 0, 0.05 ),
+		new THREE.Vector3( - 0.05, 0, - 0.05 ),
+		new THREE.Vector3( 0.05, 0, 0 )
 	];
 
 	var tube3 = [
-		new THREE.Vector3(  0.05, 0, -0.05 ),
-		new THREE.Vector3(  0.05, 0,  0.05 ),
-		new THREE.Vector3( -0.05, 0,  0 )
+		new THREE.Vector3( 0.05, 0, - 0.05 ),
+		new THREE.Vector3( 0.05, 0, 0.05 ),
+		new THREE.Vector3( - 0.05, 0, 0 )
 	];
 
 	var vector1 = new THREE.Vector3();
@@ -317,7 +317,7 @@ function RollerCoasterLiftersGeometry( curve, divisions ) {
 
 		}
 
-	};
+	}
 
 	var fromPoint = new THREE.Vector3();
 	var toPoint = new THREE.Vector3();
@@ -335,31 +335,31 @@ function RollerCoasterLiftersGeometry( curve, divisions ) {
 
 		if ( point.y > 10 ) {
 
-			fromPoint.set( -0.75, -0.35, 0 );
+			fromPoint.set( - 0.75, - 0.35, 0 );
 			fromPoint.applyQuaternion( quaternion );
 			fromPoint.add( point );
 
-			toPoint.set( 0.75, -0.35, 0 );
+			toPoint.set( 0.75, - 0.35, 0 );
 			toPoint.applyQuaternion( quaternion );
 			toPoint.add( point );
 
 			extrudeShape( tube1, fromPoint, toPoint );
 
-			fromPoint.set( -0.7, -0.3, 0 );
+			fromPoint.set( - 0.7, - 0.3, 0 );
 			fromPoint.applyQuaternion( quaternion );
 			fromPoint.add( point );
 
-			toPoint.set( -0.7, -point.y, 0 );
+			toPoint.set( - 0.7, - point.y, 0 );
 			toPoint.applyQuaternion( quaternion );
 			toPoint.add( point );
 
 			extrudeShape( tube2, fromPoint, toPoint );
 
-			fromPoint.set( 0.7, -0.3, 0 );
+			fromPoint.set( 0.7, - 0.3, 0 );
 			fromPoint.applyQuaternion( quaternion );
 			fromPoint.add( point );
 
-			toPoint.set( 0.7, -point.y, 0 );
+			toPoint.set( 0.7, - point.y, 0 );
 			toPoint.applyQuaternion( quaternion );
 			toPoint.add( point );
 
@@ -367,11 +367,11 @@ function RollerCoasterLiftersGeometry( curve, divisions ) {
 
 		} else {
 
-			fromPoint.set( 0, -0.2, 0 );
+			fromPoint.set( 0, - 0.2, 0 );
 			fromPoint.applyQuaternion( quaternion );
 			fromPoint.add( point );
 
-			toPoint.set( 0, -point.y, 0 );
+			toPoint.set( 0, - point.y, 0 );
 			toPoint.applyQuaternion( quaternion );
 			toPoint.add( point );
 
@@ -384,7 +384,7 @@ function RollerCoasterLiftersGeometry( curve, divisions ) {
 	this.addAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
 	this.addAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( normals ), 3 ) );
 
-};
+}
 
 RollerCoasterLiftersGeometry.prototype = Object.create( THREE.BufferGeometry.prototype );
 
@@ -399,7 +399,7 @@ function RollerCoasterShadowGeometry( curve, divisions ) {
 
 	var quaternion = new THREE.Quaternion();
 	var prevQuaternion = new THREE.Quaternion();
-	prevQuaternion.setFromAxisAngle( up , Math.PI / 2 );
+	prevQuaternion.setFromAxisAngle( up, Math.PI / 2 );
 
 	var point = new THREE.Vector3();
 
@@ -423,19 +423,19 @@ function RollerCoasterShadowGeometry( curve, divisions ) {
 
 		quaternion.setFromAxisAngle( up, angle );
 
-		vector1.set( -0.3, 0, 0 );
+		vector1.set( - 0.3, 0, 0 );
 		vector1.applyQuaternion( quaternion );
 		vector1.add( point );
 
-		vector2.set(  0.3, 0, 0 );
+		vector2.set( 0.3, 0, 0 );
 		vector2.applyQuaternion( quaternion );
 		vector2.add( point );
 
-		vector3.set(  0.3, 0, 0 );
+		vector3.set( 0.3, 0, 0 );
 		vector3.applyQuaternion( prevQuaternion );
 		vector3.add( prevPoint );
 
-		vector4.set( -0.3, 0, 0 );
+		vector4.set( - 0.3, 0, 0 );
 		vector4.applyQuaternion( prevQuaternion );
 		vector4.add( prevPoint );
 
@@ -454,7 +454,7 @@ function RollerCoasterShadowGeometry( curve, divisions ) {
 
 	this.addAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
 
-};
+}
 
 RollerCoasterShadowGeometry.prototype = Object.create( THREE.BufferGeometry.prototype );
 
@@ -485,7 +485,7 @@ function SkyGeometry() {
 
 	this.addAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
 
-};
+}
 
 SkyGeometry.prototype = Object.create( THREE.BufferGeometry.prototype );
 
@@ -497,7 +497,7 @@ function TreesGeometry( landscape ) {
 	var colors = [];
 
 	var raycaster = new THREE.Raycaster();
-	raycaster.ray.direction.set( 0, -1, 0 );
+	raycaster.ray.direction.set( 0, - 1, 0 );
 
 	for ( var i = 0; i < 2000; i ++ ) {
 
@@ -539,6 +539,6 @@ function TreesGeometry( landscape ) {
 	this.addAttribute( 'position', new THREE.BufferAttribute( new Float32Array( vertices ), 3 ) );
 	this.addAttribute( 'color', new THREE.BufferAttribute( new Float32Array( colors ), 3 ) );
 
-};
+}
 
 TreesGeometry.prototype = Object.create( THREE.BufferGeometry.prototype );

examples/js/controls/VRControls.js

@@ -1,149 +0,0 @@
-/**
- * @author dmarcos / https://github.com/dmarcos
- * @author mrdoob / http://mrdoob.com
- */
-
-THREE.VRControls = function ( object, onError ) {
-
-	var scope = this;
-
-	var vrDisplay, vrDisplays;
-
-	var standingMatrix = new THREE.Matrix4();
-
-	var frameData = null;
-
-	if ( 'VRFrameData' in window ) {
-
-		frameData = new VRFrameData();
-
-	}
-
-	function gotVRDisplays( displays ) {
-
-		vrDisplays = displays;
-
-		if ( displays.length > 0 ) {
-
-			vrDisplay = displays[ 0 ];
-
-		} else {
-
-			if ( onError ) onError( 'VR input not available.' );
-
-		}
-
-	}
-
-	if ( navigator.getVRDisplays ) {
-
-		navigator.getVRDisplays().then( gotVRDisplays ).catch( function () {
-
-			console.warn( 'THREE.VRControls: Unable to get VR Displays' );
-
-		} );
-
-	}
-
-	// the Rift SDK returns the position in meters
-	// this scale factor allows the user to define how meters
-	// are converted to scene units.
-
-	this.scale = 1;
-
-	// If true will use "standing space" coordinate system where y=0 is the
-	// floor and x=0, z=0 is the center of the room.
-	this.standing = false;
-
-	// Distance from the users eyes to the floor in meters. Used when
-	// standing=true but the VRDisplay doesn't provide stageParameters.
-	this.userHeight = 1.6;
-
-	this.getVRDisplay = function () {
-
-		return vrDisplay;
-
-	};
-
-	this.setVRDisplay = function ( value ) {
-
-		vrDisplay = value;
-
-	};
-
-	this.getVRDisplays = function () {
-
-		console.warn( 'THREE.VRControls: getVRDisplays() is being deprecated.' );
-		return vrDisplays;
-
-	};
-
-	this.getStandingMatrix = function () {
-
-		return standingMatrix;
-
-	};
-
-	this.update = function () {
-
-		if ( vrDisplay ) {
-
-			var pose;
-
-			if ( vrDisplay.getFrameData ) {
-
-				vrDisplay.getFrameData( frameData );
-				pose = frameData.pose;
-
-			} else if ( vrDisplay.getPose ) {
-
-				pose = vrDisplay.getPose();
-
-			}
-
-			if ( pose.orientation !== null ) {
-
-				object.quaternion.fromArray( pose.orientation );
-
-			}
-
-			if ( pose.position !== null ) {
-
-				object.position.fromArray( pose.position );
-
-			} else {
-
-				object.position.set( 0, 0, 0 );
-
-			}
-
-			if ( this.standing ) {
-
-				if ( vrDisplay.stageParameters ) {
-
-					object.updateMatrix();
-
-					standingMatrix.fromArray( vrDisplay.stageParameters.sittingToStandingTransform );
-					object.applyMatrix( standingMatrix );
-
-				} else {
-
-					object.position.setY( object.position.y + this.userHeight );
-
-				}
-
-			}
-
-			object.position.multiplyScalar( scope.scale );
-
-		}
-
-	};
-
-	this.dispose = function () {
-
-		vrDisplay = null;
-
-	};
-
-};

examples/js/effects/OutlineEffect.js

@@ -448,7 +448,7 @@ THREE.OutlineEffect = function ( renderer, parameters ) {
 	 * The following property copies and wrapper methods enable
 	 * THREE.OutlineEffect to be called from other *Effect, like
 	 *
-	 * effect = new THREE.VREffect( new THREE.OutlineEffect( renderer ) );
+	 * effect = new THREE.StereoEffect( new THREE.OutlineEffect( renderer ) );
 	 *
 	 * function render () {
 	 *

examples/js/effects/VREffect.js

@@ -1,533 +0,0 @@
-/**
- * @author dmarcos / https://github.com/dmarcos
- * @author mrdoob / http://mrdoob.com
- *
- * WebVR Spec: http://mozvr.github.io/webvr-spec/webvr.html
- *
- * Firefox: http://mozvr.com/downloads/
- * Chromium: https://webvr.info/get-chrome
- */
-
-THREE.VREffect = function ( renderer, onError ) {
-
-	var vrDisplay, vrDisplays;
-	var eyeTranslationL = new THREE.Vector3();
-	var eyeTranslationR = new THREE.Vector3();
-	var renderRectL, renderRectR;
-	var headMatrix = new THREE.Matrix4();
-	var eyeMatrixL = new THREE.Matrix4();
-	var eyeMatrixR = new THREE.Matrix4();
-
-	var frameData = null;
-
-	if ( 'VRFrameData' in window ) {
-
-		frameData = new window.VRFrameData();
-
-	}
-
-	function gotVRDisplays( displays ) {
-
-		vrDisplays = displays;
-
-		if ( displays.length > 0 ) {
-
-			vrDisplay = displays[ 0 ];
-
-		} else {
-
-			if ( onError ) onError( 'HMD not available' );
-
-		}
-
-	}
-
-	if ( navigator.getVRDisplays ) {
-
-		navigator.getVRDisplays().then( gotVRDisplays ).catch( function () {
-
-			console.warn( 'THREE.VREffect: Unable to get VR Displays' );
-
-		} );
-
-	}
-
-	//
-
-	this.isPresenting = false;
-
-	var scope = this;
-
-	var rendererSize = renderer.getSize();
-	var rendererUpdateStyle = false;
-	var rendererPixelRatio = renderer.getPixelRatio();
-
-	this.getVRDisplay = function () {
-
-		return vrDisplay;
-
-	};
-
-	this.setVRDisplay = function ( value ) {
-
-		vrDisplay = value;
-
-	};
-
-	this.getVRDisplays = function () {
-
-		console.warn( 'THREE.VREffect: getVRDisplays() is being deprecated.' );
-		return vrDisplays;
-
-	};
-
-	this.setSize = function ( width, height, updateStyle ) {
-
-		rendererSize = { width: width, height: height };
-		rendererUpdateStyle = updateStyle;
-
-		if ( scope.isPresenting ) {
-
-			var eyeParamsL = vrDisplay.getEyeParameters( 'left' );
-			renderer.setPixelRatio( 1 );
-			renderer.setSize( eyeParamsL.renderWidth * 2, eyeParamsL.renderHeight, false );
-
-		} else {
-
-			renderer.setPixelRatio( rendererPixelRatio );
-			renderer.setSize( width, height, updateStyle );
-
-		}
-
-	};
-
-	// VR presentation
-
-	var canvas = renderer.domElement;
-	var defaultLeftBounds = [ 0.0, 0.0, 0.5, 1.0 ];
-	var defaultRightBounds = [ 0.5, 0.0, 0.5, 1.0 ];
-
-	function onVRDisplayPresentChange() {
-
-		var wasPresenting = scope.isPresenting;
-		scope.isPresenting = vrDisplay !== undefined && vrDisplay.isPresenting;
-
-		if ( scope.isPresenting ) {
-
-			var eyeParamsL = vrDisplay.getEyeParameters( 'left' );
-			var eyeWidth = eyeParamsL.renderWidth;
-			var eyeHeight = eyeParamsL.renderHeight;
-
-			if ( ! wasPresenting ) {
-
-				rendererPixelRatio = renderer.getPixelRatio();
-				rendererSize = renderer.getSize();
-
-				renderer.setPixelRatio( 1 );
-				renderer.setSize( eyeWidth * 2, eyeHeight, false );
-
-			}
-
-		} else if ( wasPresenting ) {
-
-			renderer.setPixelRatio( rendererPixelRatio );
-			renderer.setSize( rendererSize.width, rendererSize.height, rendererUpdateStyle );
-
-		}
-
-	}
-
-	window.addEventListener( 'vrdisplaypresentchange', onVRDisplayPresentChange, false );
-
-	this.setFullScreen = function ( boolean ) {
-
-		return new Promise( function ( resolve, reject ) {
-
-			if ( vrDisplay === undefined ) {
-
-				reject( new Error( 'No VR hardware found.' ) );
-				return;
-
-			}
-
-			if ( scope.isPresenting === boolean ) {
-
-				resolve();
-				return;
-
-			}
-
-			if ( boolean ) {
-
-				resolve( vrDisplay.requestPresent( [ { source: canvas } ] ) );
-
-			} else {
-
-				resolve( vrDisplay.exitPresent() );
-
-			}
-
-		} );
-
-	};
-
-	this.requestPresent = function () {
-
-		return this.setFullScreen( true );
-
-	};
-
-	this.exitPresent = function () {
-
-		return this.setFullScreen( false );
-
-	};
-
-	this.requestAnimationFrame = function ( f ) {
-
-		if ( vrDisplay !== undefined ) {
-
-			return vrDisplay.requestAnimationFrame( f );
-
-		} else {
-
-			return window.requestAnimationFrame( f );
-
-		}
-
-	};
-
-	this.cancelAnimationFrame = function ( h ) {
-
-		if ( vrDisplay !== undefined ) {
-
-			vrDisplay.cancelAnimationFrame( h );
-
-		} else {
-
-			window.cancelAnimationFrame( h );
-
-		}
-
-	};
-
-	this.submitFrame = function () {
-
-		if ( vrDisplay !== undefined && scope.isPresenting ) {
-
-			vrDisplay.submitFrame();
-
-		}
-
-	};
-
-	this.autoSubmitFrame = true;
-
-	// render
-
-	var cameraL = new THREE.PerspectiveCamera();
-	cameraL.layers.enable( 1 );
-
-	var cameraR = new THREE.PerspectiveCamera();
-	cameraR.layers.enable( 2 );
-
-	this.render = function ( scene, camera, renderTarget, forceClear ) {
-
-		if ( vrDisplay && scope.isPresenting ) {
-
-			var autoUpdate = scene.autoUpdate;
-
-			if ( autoUpdate ) {
-
-				scene.updateMatrixWorld();
-				scene.autoUpdate = false;
-
-			}
-
-			if ( Array.isArray( scene ) ) {
-
-				console.warn( 'THREE.VREffect.render() no longer supports arrays. Use object.layers instead.' );
-				scene = scene[ 0 ];
-
-			}
-
-			// When rendering we don't care what the recommended size is, only what the actual size
-			// of the backbuffer is.
-			var size = renderer.getSize();
-			var layers = vrDisplay.getLayers();
-			var leftBounds;
-			var rightBounds;
-
-			if ( layers.length ) {
-
-				var layer = layers[ 0 ];
-
-				leftBounds = layer.leftBounds !== null && layer.leftBounds.length === 4 ? layer.leftBounds : defaultLeftBounds;
-				rightBounds = layer.rightBounds !== null && layer.rightBounds.length === 4 ? layer.rightBounds : defaultRightBounds;
-
-			} else {
-
-				leftBounds = defaultLeftBounds;
-				rightBounds = defaultRightBounds;
-
-			}
-
-			renderRectL = {
-				x: Math.round( size.width * leftBounds[ 0 ] ),
-				y: Math.round( size.height * leftBounds[ 1 ] ),
-				width: Math.round( size.width * leftBounds[ 2 ] ),
-				height: Math.round( size.height * leftBounds[ 3 ] )
-			};
-			renderRectR = {
-				x: Math.round( size.width * rightBounds[ 0 ] ),
-				y: Math.round( size.height * rightBounds[ 1 ] ),
-				width: Math.round( size.width * rightBounds[ 2 ] ),
-				height: Math.round( size.height * rightBounds[ 3 ] )
-			};
-
-			if ( renderTarget ) {
-
-				renderer.setRenderTarget( renderTarget );
-				renderTarget.scissorTest = true;
-
-			} else {
-
-				renderer.setRenderTarget( null );
-				renderer.setScissorTest( true );
-
-			}
-
-			if ( renderer.autoClear || forceClear ) renderer.clear();
-
-			if ( camera.parent === null ) camera.updateMatrixWorld();
-
-			camera.matrixWorld.decompose( cameraL.position, cameraL.quaternion, cameraL.scale );
-
-			cameraR.position.copy( cameraL.position );
-			cameraR.quaternion.copy( cameraL.quaternion );
-			cameraR.scale.copy( cameraL.scale );
-
-			if ( vrDisplay.getFrameData ) {
-
-				vrDisplay.depthNear = camera.near;
-				vrDisplay.depthFar = camera.far;
-
-				vrDisplay.getFrameData( frameData );
-
-				cameraL.projectionMatrix.elements = frameData.leftProjectionMatrix;
-				cameraR.projectionMatrix.elements = frameData.rightProjectionMatrix;
-
-				getEyeMatrices( frameData );
-
-				cameraL.updateMatrix();
-				cameraL.matrix.multiply( eyeMatrixL );
-				cameraL.matrix.decompose( cameraL.position, cameraL.quaternion, cameraL.scale );
-
-				cameraR.updateMatrix();
-				cameraR.matrix.multiply( eyeMatrixR );
-				cameraR.matrix.decompose( cameraR.position, cameraR.quaternion, cameraR.scale );
-
-			} else {
-
-				var eyeParamsL = vrDisplay.getEyeParameters( 'left' );
-				var eyeParamsR = vrDisplay.getEyeParameters( 'right' );
-
-				cameraL.projectionMatrix = fovToProjection( eyeParamsL.fieldOfView, true, camera.near, camera.far );
-				cameraR.projectionMatrix = fovToProjection( eyeParamsR.fieldOfView, true, camera.near, camera.far );
-
-				eyeTranslationL.fromArray( eyeParamsL.offset );
-				eyeTranslationR.fromArray( eyeParamsR.offset );
-
-				cameraL.translateOnAxis( eyeTranslationL, cameraL.scale.x );
-				cameraR.translateOnAxis( eyeTranslationR, cameraR.scale.x );
-
-			}
-
-			// render left eye
-			if ( renderTarget ) {
-
-				renderTarget.viewport.set( renderRectL.x, renderRectL.y, renderRectL.width, renderRectL.height );
-				renderTarget.scissor.set( renderRectL.x, renderRectL.y, renderRectL.width, renderRectL.height );
-
-			} else {
-
-				renderer.setViewport( renderRectL.x, renderRectL.y, renderRectL.width, renderRectL.height );
-				renderer.setScissor( renderRectL.x, renderRectL.y, renderRectL.width, renderRectL.height );
-
-			}
-			renderer.render( scene, cameraL, renderTarget, forceClear );
-
-			// render right eye
-			if ( renderTarget ) {
-
-				renderTarget.viewport.set( renderRectR.x, renderRectR.y, renderRectR.width, renderRectR.height );
-				renderTarget.scissor.set( renderRectR.x, renderRectR.y, renderRectR.width, renderRectR.height );
-
-			} else {
-
-				renderer.setViewport( renderRectR.x, renderRectR.y, renderRectR.width, renderRectR.height );
-				renderer.setScissor( renderRectR.x, renderRectR.y, renderRectR.width, renderRectR.height );
-
-			}
-			renderer.render( scene, cameraR, renderTarget, forceClear );
-
-			if ( renderTarget ) {
-
-				renderTarget.viewport.set( 0, 0, size.width, size.height );
-				renderTarget.scissor.set( 0, 0, size.width, size.height );
-				renderTarget.scissorTest = false;
-				renderer.setRenderTarget( null );
-
-			} else {
-
-				renderer.setViewport( 0, 0, size.width, size.height );
-				renderer.setScissorTest( false );
-
-			}
-
-			if ( autoUpdate ) {
-
-				scene.autoUpdate = true;
-
-			}
-
-			if ( scope.autoSubmitFrame ) {
-
-				scope.submitFrame();
-
-			}
-
-			return;
-
-		}
-
-		// Regular render mode if not HMD
-
-		renderer.render( scene, camera, renderTarget, forceClear );
-
-	};
-
-	this.dispose = function () {
-
-		window.removeEventListener( 'vrdisplaypresentchange', onVRDisplayPresentChange, false );
-
-	};
-
-	//
-
-	var poseOrientation = new THREE.Quaternion();
-	var posePosition = new THREE.Vector3();
-
-	// Compute model matrices of the eyes with respect to the head.
-	function getEyeMatrices( frameData ) {
-
-		// Compute the matrix for the position of the head based on the pose
-		if ( frameData.pose.orientation ) {
-
-			poseOrientation.fromArray( frameData.pose.orientation );
-			headMatrix.makeRotationFromQuaternion( poseOrientation );
-
-		}	else {
-
-			headMatrix.identity();
-
-		}
-
-		if ( frameData.pose.position ) {
-
-			posePosition.fromArray( frameData.pose.position );
-			headMatrix.setPosition( posePosition );
-
-		}
-
-		// The view matrix transforms vertices from sitting space to eye space. As such, the view matrix can be thought of as a product of two matrices:
-		// headToEyeMatrix * sittingToHeadMatrix
-
-		// The headMatrix that we've calculated above is the model matrix of the head in sitting space, which is the inverse of sittingToHeadMatrix.
-		// So when we multiply the view matrix with headMatrix, we're left with headToEyeMatrix:
-		// viewMatrix * headMatrix = headToEyeMatrix * sittingToHeadMatrix * headMatrix = headToEyeMatrix
-
-		eyeMatrixL.fromArray( frameData.leftViewMatrix );
-		eyeMatrixL.multiply( headMatrix );
-		eyeMatrixR.fromArray( frameData.rightViewMatrix );
-		eyeMatrixR.multiply( headMatrix );
-
-		// The eye's model matrix in head space is the inverse of headToEyeMatrix we calculated above.
-
-		eyeMatrixL.getInverse( eyeMatrixL );
-		eyeMatrixR.getInverse( eyeMatrixR );
-
-	}
-
-	function fovToNDCScaleOffset( fov ) {
-
-		var pxscale = 2.0 / ( fov.leftTan + fov.rightTan );
-		var pxoffset = ( fov.leftTan - fov.rightTan ) * pxscale * 0.5;
-		var pyscale = 2.0 / ( fov.upTan + fov.downTan );
-		var pyoffset = ( fov.upTan - fov.downTan ) * pyscale * 0.5;
-		return { scale: [ pxscale, pyscale ], offset: [ pxoffset, pyoffset ] };
-
-	}
-
-	function fovPortToProjection( fov, rightHanded, zNear, zFar ) {
-
-		rightHanded = rightHanded === undefined ? true : rightHanded;
-		zNear = zNear === undefined ? 0.01 : zNear;
-		zFar = zFar === undefined ? 10000.0 : zFar;
-
-		var handednessScale = rightHanded ? - 1.0 : 1.0;
-
-		// start with an identity matrix
-		var mobj = new THREE.Matrix4();
-		var m = mobj.elements;
-
-		// and with scale/offset info for normalized device coords
-		var scaleAndOffset = fovToNDCScaleOffset( fov );
-
-		// X result, map clip edges to [-w,+w]
-		m[ 0 * 4 + 0 ] = scaleAndOffset.scale[ 0 ];
-		m[ 0 * 4 + 1 ] = 0.0;
-		m[ 0 * 4 + 2 ] = scaleAndOffset.offset[ 0 ] * handednessScale;
-		m[ 0 * 4 + 3 ] = 0.0;
-
-		// Y result, map clip edges to [-w,+w]
-		// Y offset is negated because this proj matrix transforms from world coords with Y=up,
-		// but the NDC scaling has Y=down (thanks D3D?)
-		m[ 1 * 4 + 0 ] = 0.0;
-		m[ 1 * 4 + 1 ] = scaleAndOffset.scale[ 1 ];
-		m[ 1 * 4 + 2 ] = - scaleAndOffset.offset[ 1 ] * handednessScale;
-		m[ 1 * 4 + 3 ] = 0.0;
-
-		// Z result (up to the app)
-		m[ 2 * 4 + 0 ] = 0.0;
-		m[ 2 * 4 + 1 ] = 0.0;
-		m[ 2 * 4 + 2 ] = zFar / ( zNear - zFar ) * - handednessScale;
-		m[ 2 * 4 + 3 ] = ( zFar * zNear ) / ( zNear - zFar );
-
-		// W result (= Z in)
-		m[ 3 * 4 + 0 ] = 0.0;
-		m[ 3 * 4 + 1 ] = 0.0;
-		m[ 3 * 4 + 2 ] = handednessScale;
-		m[ 3 * 4 + 3 ] = 0.0;
-
-		mobj.transpose();
-		return mobj;
-
-	}
-
-	function fovToProjection( fov, rightHanded, zNear, zFar ) {
-
-		var DEG2RAD = Math.PI / 180.0;
-
-		var fovPort = {
-			upTan: Math.tan( fov.upDegrees * DEG2RAD ),
-			downTan: Math.tan( fov.downDegrees * DEG2RAD ),
-			leftTan: Math.tan( fov.leftDegrees * DEG2RAD ),
-			rightTan: Math.tan( fov.rightDegrees * DEG2RAD )
-		};
-
-		return fovPortToProjection( fovPort, rightHanded, zNear, zFar );
-
-	}
-
-};

examples/js/exporters/GLTFExporter.js

@@ -106,7 +106,8 @@ THREE.GLTFExporter.prototype = {
 
 			attributes: new Map(),
 			materials: new Map(),
-			textures: new Map()
+			textures: new Map(),
+			images: new Map()
 
 		};
 
@@ -565,8 +566,8 @@ THREE.GLTFExporter.prototype = {
 
 				var end = start + count;
 				var end2 = geometry.drawRange.count === Infinity
-						? attribute.count
-						: geometry.drawRange.start + geometry.drawRange.count;
+					? attribute.count
+					: geometry.drawRange.start + geometry.drawRange.count;
 
 				start = Math.max( start, geometry.drawRange.start );
 				count = Math.min( end, end2 ) - start;
@@ -622,12 +623,28 @@ THREE.GLTFExporter.prototype = {
 
 		/**
 		 * Process image
-		 * @param  {Texture} map Texture to process
+		 * @param  {Image} image to process
+		 * @param  {Integer} format of the image (e.g. THREE.RGBFormat, THREE.RGBAFormat etc)
+		 * @param  {Boolean} flipY before writing out the image
 		 * @return {Integer}     Index of the processed texture in the "images" array
 		 */
-		function processImage( map ) {
+		function processImage( image, format, flipY ) {
+
+			if ( ! cachedData.images.has( image ) ) {
+
+				cachedData.images.set( image, {} );
+
+			}
+
+			var cachedImages = cachedData.images.get( image );
+			var mimeType = format === THREE.RGBAFormat ? 'image/png' : 'image/jpeg';
+			var key = mimeType + ":flipY/" + flipY.toString();
 
-			// @TODO Cache
+			if ( cachedImages[ key ] !== undefined ) {
+
+				return cachedImages[ key ];
+
+			}
 
 			if ( ! outputJSON.images ) {
 
@@ -635,19 +652,18 @@ THREE.GLTFExporter.prototype = {
 
 			}
 
-			var mimeType = map.format === THREE.RGBAFormat ? 'image/png' : 'image/jpeg';
 			var gltfImage = { mimeType: mimeType };
 
 			if ( options.embedImages ) {
 
 				var canvas = cachedCanvas = cachedCanvas || document.createElement( 'canvas' );
 
-				canvas.width = map.image.width;
-				canvas.height = map.image.height;
+				canvas.width = image.width;
+				canvas.height = image.height;
 
-				if ( options.forcePowerOfTwoTextures && ! isPowerOfTwo( map.image ) ) {
+				if ( options.forcePowerOfTwoTextures && ! isPowerOfTwo( image ) ) {
 
-					console.warn( 'GLTFExporter: Resized non-power-of-two image.', map.image );
+					console.warn( 'GLTFExporter: Resized non-power-of-two image.', image );
 
 					canvas.width = THREE.Math.floorPowerOfTwo( canvas.width );
 					canvas.height = THREE.Math.floorPowerOfTwo( canvas.height );
@@ -656,14 +672,14 @@ THREE.GLTFExporter.prototype = {
 
 				var ctx = canvas.getContext( '2d' );
 
-				if ( map.flipY === true ) {
+				if ( flipY === true ) {
 
 					ctx.translate( 0, canvas.height );
 					ctx.scale( 1, - 1 );
 
 				}
 
-				ctx.drawImage( map.image, 0, 0, canvas.width, canvas.height );
+				ctx.drawImage( image, 0, 0, canvas.width, canvas.height );
 
 				if ( options.binary === true ) {
 
@@ -691,13 +707,16 @@ THREE.GLTFExporter.prototype = {
 
 			} else {
 
-				gltfImage.uri = map.image.src;
+				gltfImage.uri = image.src;
 
 			}
 
 			outputJSON.images.push( gltfImage );
 
-			return outputJSON.images.length - 1;
+			var index = outputJSON.images.length - 1;
+			cachedImages[ key ] = index;
+
+			return index;
 
 		}
 
@@ -751,7 +770,7 @@ THREE.GLTFExporter.prototype = {
 			var gltfTexture = {
 
 				sampler: processSampler( map ),
-				source: processImage( map )
+				source: processImage( map.image, map.format, map.flipY )
 
 			};
 
@@ -1187,7 +1206,7 @@ THREE.GLTFExporter.prototype = {
 			var forceIndices = options.forceIndices;
 			var isMultiMaterial = Array.isArray( mesh.material );
 
-			if ( isMultiMaterial && mesh.geometry.groups.length === 0 ) return null;
+			if ( isMultiMaterial && geometry.groups.length === 0 ) return null;
 
 			if ( ! forceIndices && geometry.index === null && isMultiMaterial ) {
 
@@ -1216,7 +1235,7 @@ THREE.GLTFExporter.prototype = {
 			}
 
 			var materials = isMultiMaterial ? mesh.material : [ mesh.material ];
-			var groups = isMultiMaterial ? mesh.geometry.groups : [ { materialIndex: 0, start: undefined, count: undefined } ];
+			var groups = isMultiMaterial ? geometry.groups : [ { materialIndex: 0, start: undefined, count: undefined } ];
 
 			for ( var i = 0, il = groups.length; i < il; i ++ ) {
 

examples/js/lines/LineMaterial.js

@@ -205,19 +205,19 @@ THREE.ShaderLib[ 'line' ] = {
 
 			#ifdef USE_DASH
 
-				if ( vUv.y < 0.5 || vUv.y > 0.5 ) discard; // discard endcaps
+				if ( vUv.y < - 1.0 || vUv.y > 1.0 ) discard; // discard endcaps
 
 				if ( mod( vLineDistance, dashSize + gapSize ) > dashSize ) discard; // todo - FIX
 
 			#endif
 
-			if ( vUv.y < 0.5 || vUv.y > 0.5 ) {
+			if ( abs( vUv.y ) > 1.0 ) {
 
-				float a = vUv.x - 0.5;
-				float b = vUv.y - 0.5;
+				float a = vUv.x;
+				float b = ( vUv.y > 0.0 ) ? vUv.y - 1.0 : vUv.y + 1.0;
 				float len2 = a * a + b * b;
 
-				if ( len2 > 0.25 ) discard;
+				if ( len2 > 1.0 ) discard;
 
 			}
 

examples/js/lines/LineSegmentsGeometry.js

@@ -12,7 +12,7 @@ THREE.LineSegmentsGeometry = function () {
 	var plane = new THREE.BufferGeometry();
 
 	var positions = [ - 1, 2, 0, 1, 2, 0, - 1, 1, 0, 1, 1, 0, - 1, 0, 0, 1, 0, 0, - 1, - 1, 0, 1, - 1, 0 ];
-	var uvs = [ 0, 1, 1, 1, 0, .5, 1, .5, 0, .5, 1, .5, 0, 0, 1, 0 ];
+	var uvs = [ - 1, 2, 1, 2, - 1, 1, 1, 1, - 1, - 1, 1, - 1, - 1, - 2, 1, - 2 ];
 	var index = [ 0, 2, 1, 2, 3, 1, 2, 4, 3, 4, 5, 3, 4, 6, 5, 6, 7, 5 ];
 
 	this.setIndex( index );

examples/js/loaders/DDSLoader.js

@@ -2,7 +2,9 @@
  * @author mrdoob / http://mrdoob.com/
  */
 
-THREE.DDSLoader = function () {
+THREE.DDSLoader = function ( manager ) {
+
+	THREE.CompressedTextureLoader.call( this, manager );
 
 	this._parser = THREE.DDSLoader.parse;
 

examples/js/loaders/FBXLoader.js

@@ -622,7 +622,7 @@
 						id: nodeID,
 					};
 
-					morphTarget.rawTargets = parseMorphTargets( relationships, deformerNode, DeformerNodes, connections, FBXTree );
+					morphTarget.rawTargets = parseMorphTargets( relationships, deformerNode, DeformerNodes, connections );
 					morphTarget.id = nodeID;
 
 					if ( relationships.parents.length > 1 ) console.warn( 'THREE.FBXLoader: morph target attached to more than one geometry is not supported.' );

examples/js/loaders/GLTFLoader.js

@@ -246,9 +246,9 @@ THREE.GLTFLoader = ( function () {
 	/**
 	 * DDS Texture Extension
 	 *
-	 * Specification: 
+	 * Specification:
 	 * https://github.com/KhronosGroup/glTF/tree/master/extensions/2.0/Vendor/MSFT_texture_dds
-	 * 
+	 *
 	 */
 	function GLTFTextureDDSExtension() {
 
@@ -455,7 +455,7 @@ THREE.GLTFLoader = ( function () {
 	 *
 	 * Specification: https://github.com/KhronosGroup/glTF/pull/874
 	 */
-	function GLTFDracoMeshCompressionExtension ( json, dracoLoader ) {
+	function GLTFDracoMeshCompressionExtension( json, dracoLoader ) {
 
 		if ( ! dracoLoader ) {
 
@@ -481,7 +481,7 @@ THREE.GLTFLoader = ( function () {
 
 		for ( var attributeName in gltfAttributeMap ) {
 
-			if ( !( attributeName in ATTRIBUTES ) ) continue;
+			if ( ! ( attributeName in ATTRIBUTES ) ) continue;
 
 			threeAttributeMap[ ATTRIBUTES[ attributeName ] ] = gltfAttributeMap[ attributeName ];
 
@@ -494,7 +494,7 @@ THREE.GLTFLoader = ( function () {
 				var accessorDef = json.accessors[ primitive.attributes[ attributeName ] ];
 				var componentType = WEBGL_COMPONENT_TYPES[ accessorDef.componentType ];
 
-				attributeTypeMap[ ATTRIBUTES[ attributeName ] ]  = componentType;
+				attributeTypeMap[ ATTRIBUTES[ attributeName ] ] = componentType;
 				attributeNormalizedMap[ ATTRIBUTES[ attributeName ] ] = accessorDef.normalized === true;
 
 			}
@@ -851,37 +851,14 @@ THREE.GLTFLoader = ( function () {
 
 					}
 
-					var offset;
-					var repeat;
-
-					if ( uvScaleMap.matrix !== undefined ) {
-
-						// > r88.
-
-						if ( uvScaleMap.matrixAutoUpdate === true ) {
-
-							offset = uvScaleMap.offset;
-							repeat = uvScaleMap.repeat;
-							var rotation = uvScaleMap.rotation;
-							var center = uvScaleMap.center;
-
-							uvScaleMap.matrix.setUvTransform( offset.x, offset.y, repeat.x, repeat.y, rotation, center.x, center.y );
-
-						}
-
-						uniforms.uvTransform.value.copy( uvScaleMap.matrix );
+					if ( uvScaleMap.matrixAutoUpdate === true ) {
 
-					} else {
-
-						// <= r87. Remove when reasonable.
-
-						offset = uvScaleMap.offset;
-						repeat = uvScaleMap.repeat;
-
-						uniforms.offsetRepeat.value.set( offset.x, offset.y, repeat.x, repeat.y );
+						uvScaleMap.updateMatrix();
 
 					}
 
+					uniforms.uvTransform.value.copy( uvScaleMap.matrix );
+
 				}
 
 				uniforms.envMap.value = material.envMap;
@@ -934,7 +911,7 @@ THREE.GLTFLoader = ( function () {
 
 		THREE.Interpolant.call( this, parameterPositions, sampleValues, sampleSize, resultBuffer );
 
-	};
+	}
 
 	GLTFCubicSplineInterpolant.prototype = Object.create( THREE.Interpolant.prototype );
 	GLTFCubicSplineInterpolant.prototype.constructor = GLTFCubicSplineInterpolant;
@@ -966,10 +943,10 @@ THREE.GLTFLoader = ( function () {
 		//   [ inTangent_1, splineVertex_1, outTangent_1, inTangent_2, splineVertex_2, ... ]
 		for ( var i = 0; i !== stride; i ++ ) {
 
-			var p0 = values[ offset0 + i + stride ];        // splineVertex_k
-			var m0 = values[ offset0 + i + stride2 ] * td;  // outTangent_k * (t_k+1 - t_k)
-			var p1 = values[ offset1 + i + stride ];        // splineVertex_k+1
-			var m1 = values[ offset1 + i ] * td;            // inTangent_k+1 * (t_k+1 - t_k)
+			var p0 = values[ offset0 + i + stride ]; // splineVertex_k
+			var m0 = values[ offset0 + i + stride2 ] * td; // outTangent_k * (t_k+1 - t_k)
+			var p1 = values[ offset1 + i + stride ]; // splineVertex_k+1
+			var m1 = values[ offset1 + i ] * td; // inTangent_k+1 * (t_k+1 - t_k)
 
 			result[ i ] = s0 * p0 + s1 * m0 + s2 * p1 + s3 * m1;
 
@@ -1123,7 +1100,7 @@ THREE.GLTFLoader = ( function () {
 		WEIGHT: 'skinWeight', // deprecated
 		JOINTS_0: 'skinIndex',
 		JOINT: 'skinIndex' // deprecated
-	}
+	};
 
 	var PATH_PROPERTIES = {
 		scale: 'scale',
@@ -1214,7 +1191,7 @@ THREE.GLTFLoader = ( function () {
 	/**
 	 * Specification: https://github.com/KhronosGroup/glTF/blob/master/specification/2.0/README.md#morph-targets
 	 *
-	 * @param {THREE.Geometry} geometry
+	 * @param {THREE.BufferGeometry} geometry
 	 * @param {Array<GLTF.Target>} targets
 	 * @param {Array<THREE.BufferAttribute>} accessors
 	 */
@@ -1533,7 +1510,7 @@ THREE.GLTFLoader = ( function () {
 		// BufferGeometry caching
 		this.primitiveCache = [];
 		this.multiplePrimitivesCache = [];
-		this.multiPassGeometryCache = []
+		this.multiPassGeometryCache = [];
 
 		this.textureLoader = new THREE.TextureLoader( this.options.manager );
 		this.textureLoader.setCrossOrigin( this.options.crossOrigin );
@@ -2178,7 +2155,7 @@ THREE.GLTFLoader = ( function () {
 
 		}
 
-		if ( materialDef.normalTexture !== undefined && materialType !== THREE.MeshBasicMaterial) {
+		if ( materialDef.normalTexture !== undefined && materialType !== THREE.MeshBasicMaterial ) {
 
 			pending.push( parser.assignTexture( materialParams, 'normalMap', materialDef.normalTexture.index ) );
 
@@ -2192,7 +2169,7 @@ THREE.GLTFLoader = ( function () {
 
 		}
 
-		if ( materialDef.occlusionTexture !== undefined && materialType !== THREE.MeshBasicMaterial) {
+		if ( materialDef.occlusionTexture !== undefined && materialType !== THREE.MeshBasicMaterial ) {
 
 			pending.push( parser.assignTexture( materialParams, 'aoMap', materialDef.occlusionTexture.index ) );
 
@@ -2204,13 +2181,13 @@ THREE.GLTFLoader = ( function () {
 
 		}
 
-		if ( materialDef.emissiveFactor !== undefined && materialType !== THREE.MeshBasicMaterial) {
+		if ( materialDef.emissiveFactor !== undefined && materialType !== THREE.MeshBasicMaterial ) {
 
 			materialParams.emissive = new THREE.Color().fromArray( materialDef.emissiveFactor );
 
 		}
 
-		if ( materialDef.emissiveTexture !== undefined && materialType !== THREE.MeshBasicMaterial) {
+		if ( materialDef.emissiveTexture !== undefined && materialType !== THREE.MeshBasicMaterial ) {
 
 			pending.push( parser.assignTexture( materialParams, 'emissiveMap', materialDef.emissiveTexture.index ) );
 
@@ -2270,7 +2247,7 @@ THREE.GLTFLoader = ( function () {
 			var bufferAttribute = accessors[ attributes[ gltfAttributeName ] ];
 
 			// Skip attributes already provided by e.g. Draco extension.
-			if ( !threeAttributeName ) continue;
+			if ( ! threeAttributeName ) continue;
 			if ( threeAttributeName in geometry.attributes ) continue;
 
 			geometry.addAttribute( threeAttributeName, bufferAttribute );
@@ -2508,7 +2485,7 @@ THREE.GLTFLoader = ( function () {
 
 					var mesh;
 
-					var material = isMultiMaterial ? originalMaterials : originalMaterials[ i ]
+					var material = isMultiMaterial ? originalMaterials : originalMaterials[ i ];
 
 					if ( primitive.mode === WEBGL_CONSTANTS.TRIANGLES ||
 						primitive.mode === WEBGL_CONSTANTS.TRIANGLE_STRIP ||
@@ -2592,7 +2569,7 @@ THREE.GLTFLoader = ( function () {
 								THREE.Material.prototype.copy.call( pointsMaterial, material );
 								pointsMaterial.color.copy( material.color );
 								pointsMaterial.map = material.map;
-								pointsMaterial.lights = false;  // PointsMaterial doesn't support lights yet
+								pointsMaterial.lights = false; // PointsMaterial doesn't support lights yet
 
 								scope.cache.add( cacheKey, pointsMaterial );
 
@@ -2611,7 +2588,7 @@ THREE.GLTFLoader = ( function () {
 								lineMaterial = new THREE.LineBasicMaterial();
 								THREE.Material.prototype.copy.call( lineMaterial, material );
 								lineMaterial.color.copy( material.color );
-								lineMaterial.lights = false;  // LineBasicMaterial doesn't support lights yet
+								lineMaterial.lights = false; // LineBasicMaterial doesn't support lights yet
 
 								scope.cache.add( cacheKey, lineMaterial );
 
@@ -2638,8 +2615,8 @@ THREE.GLTFLoader = ( function () {
 							if ( ! cachedMaterial ) {
 
 								cachedMaterial = material.isGLTFSpecularGlossinessMaterial
-										? extensions[ EXTENSIONS.KHR_MATERIALS_PBR_SPECULAR_GLOSSINESS ].cloneMaterial( material )
-										: material.clone();
+									? extensions[ EXTENSIONS.KHR_MATERIALS_PBR_SPECULAR_GLOSSINESS ].cloneMaterial( material )
+									: material.clone();
 
 								if ( useSkinning ) cachedMaterial.skinning = true;
 								if ( useVertexColors ) cachedMaterial.vertexColors = THREE.VertexColors;

examples/js/loaders/KTXLoader.js

@@ -8,7 +8,9 @@
  */
 
 
-THREE.KTXLoader = function () {
+THREE.KTXLoader = function ( manager ) {
+
+	THREE.CompressedTextureLoader.call( this, manager );
 
 	this._parser = THREE.KTXLoader.parse;
 

examples/js/loaders/NodeMaterialLoader.js

@@ -565,8 +565,6 @@ Object.assign( THREE.NodeMaterialLoader.prototype, {
 
 			}
 
-			object.build();
-
 			if ( node.fog !== undefined ) object.fog = node.fog;
 			if ( node.lights !== undefined ) object.lights = node.lights;
 
@@ -581,8 +579,6 @@ Object.assign( THREE.NodeMaterialLoader.prototype, {
 
 			object.value = this.getNode( node.value );
 
-			object.build();
-
 		}
 
 		return this.material || this.pass || this;

examples/js/loaders/PVRLoader.js

@@ -10,7 +10,7 @@
 
 THREE.PVRLoader = function ( manager ) {
 
-	this.manager = ( manager !== undefined ) ? manager : THREE.DefaultLoadingManager;
+	THREE.CompressedTextureLoader.call( this, manager );
 
 	this._parser = THREE.PVRLoader.parse;
 

examples/js/loaders/SVGLoader.js

@@ -176,48 +176,54 @@ THREE.SVGLoader.prototype = {
 
 					case 'S':
 						var numbers = parseFloats( data );
-						path.bezierCurveTo(
-							getReflection( point.x, control.x ),
-							getReflection( point.y, control.y ),
-							numbers[ 0 ],
-							numbers[ 1 ],
-							numbers[ 2 ],
-							numbers[ 3 ]
-						);
-						control.x = numbers[ 0 ];
-						control.y = numbers[ 1 ];
-						point.x = numbers[ 2 ];
-						point.y = numbers[ 3 ];
+						for ( var j = 0, jl = numbers.length; j < jl; j += 4 ) {
+							path.bezierCurveTo(
+								getReflection( point.x, control.x ),
+								getReflection( point.y, control.y ),
+								numbers[ j + 0 ],
+								numbers[ j + 1 ],
+								numbers[ j + 2 ],
+								numbers[ j + 3 ]
+							);
+							control.x = numbers[ j + 0 ];
+							control.y = numbers[ j + 1 ];
+							point.x = numbers[ j + 2 ];
+							point.y = numbers[ j + 3 ];
+						}
 						break;
 
 					case 'Q':
 						var numbers = parseFloats( data );
-						path.quadraticCurveTo(
-							numbers[ 0 ],
-							numbers[ 1 ],
-							numbers[ 2 ],
-							numbers[ 3 ]
-						);
-						control.x = numbers[ 0 ];
-						control.y = numbers[ 1 ];
-						point.x = numbers[ 2 ];
-						point.y = numbers[ 3 ];
+						for ( var j = 0, jl = numbers.length; j < jl; j += 4 ) {
+							path.quadraticCurveTo(
+								numbers[ j + 0 ],
+								numbers[ j + 1 ],
+								numbers[ j + 2 ],
+								numbers[ j + 3 ]
+							);
+							control.x = numbers[ j + 0 ];
+							control.y = numbers[ j + 1 ];
+							point.x = numbers[ j + 2 ];
+							point.y = numbers[ j + 3 ];
+						}
 						break;
 
 					case 'T':
 						var numbers = parseFloats( data );
-						var rx = getReflection( point.x, control.x );
-						var ry = getReflection( point.y, control.y );
-						path.quadraticCurveTo(
-							rx,
-							ry,
-							numbers[ 0 ],
-							numbers[ 1 ]
-						);
-						control.x = rx;
-						control.y = ry;
-						point.x = numbers[ 0 ];
-						point.y = numbers[ 1 ];
+						for ( var j = 0, jl = numbers.length; j < jl; j += 2 ) {
+							var rx = getReflection( point.x, control.x );
+							var ry = getReflection( point.y, control.y );
+							path.quadraticCurveTo(
+								rx,
+								ry,
+								numbers[ j + 0 ],
+								numbers[ j + 1 ]
+							);
+							control.x = rx;
+							control.y = ry;
+							point.x = numbers[ j + 0 ];
+							point.y = numbers[ j + 1 ];
+						}
 						break;
 
 					case 'A':
@@ -298,48 +304,54 @@ THREE.SVGLoader.prototype = {
 
 					case 's':
 						var numbers = parseFloats( data );
-						path.bezierCurveTo(
-							getReflection( point.x, control.x ),
-							getReflection( point.y, control.y ),
-							point.x + numbers[ 0 ],
-							point.y + numbers[ 1 ],
-							point.x + numbers[ 2 ],
-							point.y + numbers[ 3 ]
-						);
-						control.x = point.x + numbers[ 0 ];
-						control.y = point.y + numbers[ 1 ];
-						point.x += numbers[ 2 ];
-						point.y += numbers[ 3 ];
+						for ( var j = 0, jl = numbers.length; j < jl; j += 4 ) {
+							path.bezierCurveTo(
+								getReflection( point.x, control.x ),
+								getReflection( point.y, control.y ),
+								point.x + numbers[ j + 0 ],
+								point.y + numbers[ j + 1 ],
+								point.x + numbers[ j + 2 ],
+								point.y + numbers[ j + 3 ]
+							);
+							control.x = point.x + numbers[ j + 0 ];
+							control.y = point.y + numbers[ j + 1 ];
+							point.x += numbers[ j + 2 ];
+							point.y += numbers[ j + 3 ];
+						}
 						break;
 
 					case 'q':
 						var numbers = parseFloats( data );
-						path.quadraticCurveTo(
-							point.x + numbers[ 0 ],
-							point.y + numbers[ 1 ],
-							point.x + numbers[ 2 ],
-							point.y + numbers[ 3 ]
-						);
-						control.x = point.x + numbers[ 0 ];
-						control.y = point.y + numbers[ 1 ];
-						point.x += numbers[ 2 ];
-						point.y += numbers[ 3 ];
+						for ( var j = 0, jl = numbers.length; j < jl; j += 4 ) {
+							path.quadraticCurveTo(
+								point.x + numbers[ j + 0 ],
+								point.y + numbers[ j + 1 ],
+								point.x + numbers[ j + 2 ],
+								point.y + numbers[ j + 3 ]
+							);
+							control.x = point.x + numbers[ j + 0 ];
+							control.y = point.y + numbers[ j + 1 ];
+							point.x += numbers[ j + 2 ];
+							point.y += numbers[ j + 3 ];
+						}
 						break;
 
 					case 't':
 						var numbers = parseFloats( data );
-						var rx = getReflection( point.x, control.x );
-						var ry = getReflection( point.y, control.y );
-						path.quadraticCurveTo(
-							rx,
-							ry,
-							point.x + numbers[ 0 ],
-							point.y + numbers[ 1 ]
-						);
-						control.x = rx;
-						control.y = ry;
-						point.x = point.x + numbers[ 0 ];
-						point.y = point.y + numbers[ 1 ];
+						for ( var j = 0, jl = numbers.length; j < jl; j += 2 ) {
+							var rx = getReflection( point.x, control.x );
+							var ry = getReflection( point.y, control.y );
+							path.quadraticCurveTo(
+								rx,
+								ry,
+								point.x + numbers[ j + 0 ],
+								point.y + numbers[ j + 1 ]
+							);
+							control.x = rx;
+							control.y = ry;
+							point.x = point.x + numbers[ j + 0 ];
+							point.y = point.y + numbers[ j + 1 ];
+						}
 						break;
 
 					case 'a':
@@ -361,6 +373,22 @@ THREE.SVGLoader.prototype = {
 					case 'Z':
 					case 'z':
 						path.currentPath.autoClose = true;
+						// Reset point to beginning of Path
+						var curve = path.currentPath.curves[ 0 ];
+						if ( curve.isLineCurve ) {
+							point.x = curve.v1.x;
+							point.y = curve.v1.y;
+						} else if ( curve.isEllipseCurve || curve.isArcCurve ) {
+							point.x = curve.aX;
+							point.y = curve.aY;
+						} else if ( curve.isCubicBezierCurve || curve.isQuadraticBezierCurve ) {
+							point.x = curve.v0.x;
+							point.y = curve.v0.y;
+						} else if ( curve.isSplineCurve ) {
+							point.x = curve.points[ 0 ].x;
+							point.y = curve.points[ 0 ].y;
+						}
+						path.currentPath.currentPoint.copy( point );
 						break;
 
 					default:
@@ -632,12 +660,18 @@ THREE.SVGLoader.prototype = {
 
 				var number = array[ i ];
 
-				// Handle values like 48.6037.7
+				// Handle values like 48.6037.7.8
 				// TODO Find a regex for this
 
 				if ( number.indexOf( '.' ) !== number.lastIndexOf( '.' ) ) {
 
-					array.splice( i + 1, 0, '0.' + number.split( '.' )[ 2 ] );
+					var split = number.split( '.' );
+
+					for ( var s = 2; s < split.length; s ++ ) {
+
+						array.splice( i + s - 1, 0, '0.' + split[ s ] );
+
+					}
 
 				}
 

examples/js/loaders/VTKLoader.js

@@ -250,77 +250,51 @@ Object.assign( THREE.VTKLoader.prototype, THREE.EventDispatcher.prototype, {
 
 			}
 
-			var geometry;
-			var stagger = 'point';
+			var geometry = new THREE.BufferGeometry();
+			geometry.setIndex( indices );
+			geometry.addAttribute( 'position', new THREE.Float32BufferAttribute( positions, 3 ) );
 
-			if ( colors.length === indices.length ) {
+			if ( normals.length === positions.length ) {
 
-				stagger = 'cell';
+				geometry.addAttribute( 'normal', new THREE.Float32BufferAttribute( normals, 3 ) );
 
 			}
 
-			if ( stagger === 'point' ) {
+			if ( colors.length !== indices.length ) {
 
-				// Nodal. Use BufferGeometry
-				geometry = new THREE.BufferGeometry();
-				geometry.setIndex( new THREE.BufferAttribute( new Uint32Array( indices ), 1 ) );
-				geometry.addAttribute( 'position', new THREE.BufferAttribute( new Float32Array( positions ), 3 ) );
+				// stagger
 
 				if ( colors.length === positions.length ) {
 
-					geometry.addAttribute( 'color', new THREE.BufferAttribute( new Float32Array( colors ), 3 ) );
-
-				}
-
-				if ( normals.length === positions.length ) {
-
-					geometry.addAttribute( 'normal', new THREE.BufferAttribute( new Float32Array( normals ), 3 ) );
+					geometry.addAttribute( 'color', new THREE.Float32BufferAttribute( colors, 3 ) );
 
 				}
 
 			} else {
 
-				// Cell centered colors. The only way to attach a solid color to each triangle
-				// is to use Geometry, which is less efficient than BufferGeometry
-				geometry = new THREE.Geometry();
-
-				var numTriangles = indices.length / 3;
-				var numPoints = positions.length / 3;
-				var face;
-				var ia, ib, ic;
-				var x, y, z;
-				var r, g, b;
+				// cell
 
-				for ( var j = 0; j < numPoints; ++ j ) {
+				geometry = geometry.toNonIndexed();
+				var numTriangles = geometry.attributes.position.count / 3;
 
-					x = positions[ 3 * j + 0 ];
-					y = positions[ 3 * j + 1 ];
-					z = positions[ 3 * j + 2 ];
-					geometry.vertices.push( new THREE.Vector3( x, y, z ) );
+				if ( colors.length === ( numTriangles * 3 ) ) {
 
-				}
-
-				for ( var i = 0; i < numTriangles; ++ i ) {
-
-					ia = indices[ 3 * i + 0 ];
-					ib = indices[ 3 * i + 1 ];
-					ic = indices[ 3 * i + 2 ];
-					geometry.faces.push( new THREE.Face3( ia, ib, ic ) );
+					var newColors = [];
 
-				}
-
-				if ( colors.length === numTriangles * 3 ) {
+					for ( var i = 0; i < numTriangles; i ++ ) {
 
-					for ( var i = 0; i < numTriangles; ++ i ) {
+						var r = colors[ 3 * i + 0 ];
+						var g = colors[ 3 * i + 1 ];
+						var b = colors[ 3 * i + 2 ];
 
-						face = geometry.faces[ i ];
-						r = colors[ 3 * i + 0 ];
-						g = colors[ 3 * i + 1 ];
-						b = colors[ 3 * i + 2 ];
-						face.color = new THREE.Color().setRGB( r, g, b );
+						newColors.push( r, g, b );
+						newColors.push( r, g, b );
+						newColors.push( r, g, b );
 
 					}
 
+					geometry.addAttribute( 'color', new THREE.Float32BufferAttribute( newColors, 3 ) );
+
 				}
 
 			}

examples/js/loaders/XLoader.js

@@ -1,3 +1,8 @@
+/**
+ * @author adrs2002 / https://github.com/adrs2002
+ */
+
+
 ( function ( global, factory ) {
 
 	typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
@@ -203,19 +208,17 @@
 
 	var XLoader = function () {
 
-		function XLoader( manager, texloader ) {
+		function XLoader( manager ) {
 
 			classCallCheck( this, XLoader );
 
 			this.debug = false;
 			this.manager = manager !== undefined ? manager : new THREE.DefaultLoadingManager();
-			this.texloader = texloader !== undefined ? texloader : new THREE.TextureLoader();
+			this.texloader = new THREE.TextureLoader( this.manager );
 			this.url = "";
 			this.baseDir = "";
 			this._putMatLength = 0;
 			this._nowMat = null;
-			this._tmpUvArray = [];
-			this._facesNormal = [];
 			this._nowFrameName = "";
 			this.frameHierarchie = [];
 			this.Hierarchies = {};
@@ -618,7 +621,15 @@
 								this._currentGeo.name = this._currentObject.name.trim();
 								this._currentGeo.parentName = this._getParentName( this._currentObject ).trim();
 								this._currentGeo.VertexSetedBoneCount = [];
-								this._currentGeo.Geometry = new THREE.Geometry();
+								this._currentGeo.GeometryData = {
+									vertices: [],
+									normals: [],
+									uvs: [],
+									skinIndices: [],
+									skinWeights: [],
+									indices: [],
+									materialIndices: []
+								};
 								this._currentGeo.Materials = [];
 								this._currentGeo.normalVectors = [];
 								this._currentGeo.BoneInfs = [];
@@ -818,7 +829,6 @@
 				var mode = 0;
 				var mode_local = 0;
 				var maxLength = 0;
-				var nowReadedLine = 0;
 				while ( true ) {
 
 					var changeMode = false;
@@ -827,7 +837,6 @@
 						var refO = this._readInt1( endRead );
 						endRead = refO.endRead;
 						mode_local = 1;
-						nowReadedLine = 0;
 						maxLength = this._currentObject.data.indexOf( ';;', endRead ) + 1;
 						if ( maxLength <= 0 ) {
 
@@ -875,16 +884,12 @@
 									case 0:
 										this._readNormalVector1( this._currentObject.data.substr( endRead, find - endRead ) );
 										break;
-									case 1:
-										this._readNormalFace1( this._currentObject.data.substr( endRead, find - endRead ), nowReadedLine );
-										break;
 
 								}
 								break;
 
 						}
 						endRead = find + 1;
-						nowReadedLine ++;
 						if ( changeMode ) {
 
 							mode ++;
@@ -917,9 +922,9 @@
 			value: function _readVertex1( line ) {
 
 				var data = this._readLine( line.trim() ).substr( 0, line.length - 2 ).split( ";" );
-				this._currentGeo.Geometry.vertices.push( new THREE.Vector3( parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ), parseFloat( data[ 2 ] ) ) );
-				this._currentGeo.Geometry.skinIndices.push( new THREE.Vector4( 0, 0, 0, 0 ) );
-				this._currentGeo.Geometry.skinWeights.push( new THREE.Vector4( 1, 0, 0, 0 ) );
+				this._currentGeo.GeometryData.vertices.push( parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ), parseFloat( data[ 2 ] ) );
+				this._currentGeo.GeometryData.skinIndices.push( 0, 0, 0, 0 );
+				this._currentGeo.GeometryData.skinWeights.push( 1, 0, 0, 0 );
 				this._currentGeo.VertexSetedBoneCount.push( 0 );
 
 			}
@@ -928,7 +933,7 @@
 			value: function _readFace1( line ) {
 
 				var data = this._readLine( line.trim() ).substr( 2, line.length - 4 ).split( "," );
-				this._currentGeo.Geometry.faces.push( new THREE.Face3( parseInt( data[ 0 ], 10 ), parseInt( data[ 1 ], 10 ), parseInt( data[ 2 ], 10 ), new THREE.Vector3( 1, 1, 1 ).normalize() ) );
+				this._currentGeo.GeometryData.indices.push( parseInt( data[ 0 ], 10 ), parseInt( data[ 1 ], 10 ), parseInt( data[ 2 ], 10 ) );
 
 			}
 		}, {
@@ -936,76 +941,97 @@
 			value: function _readNormalVector1( line ) {
 
 				var data = this._readLine( line.trim() ).substr( 0, line.length - 2 ).split( ";" );
-				this._currentGeo.normalVectors.push( new THREE.Vector3( parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ), parseFloat( data[ 2 ] ) ) );
+				this._currentGeo.GeometryData.normals.push( parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ), parseFloat( data[ 2 ] ) );
 
 			}
 		}, {
-			key: '_readNormalFace1',
-			value: function _readNormalFace1( line, nowReaded ) {
+			key: '_buildGeometry',
+			value: function _buildGeometry() {
 
-				var data = this._readLine( line.trim() ).substr( 2, line.length - 4 ).split( "," );
-				var nowID = parseInt( data[ 0 ], 10 );
-				var v1 = this._currentGeo.normalVectors[ nowID ];
-				nowID = parseInt( data[ 1 ], 10 );
-				var v2 = this._currentGeo.normalVectors[ nowID ];
-				nowID = parseInt( data[ 2 ], 10 );
-				var v3 = this._currentGeo.normalVectors[ nowID ];
-				this._currentGeo.Geometry.faces[ nowReaded ].vertexNormals = [ v1, v2, v3 ];
+				var bufferGeometry = new THREE.BufferGeometry();
+				var position = [];
+				var normals = [];
+				var uvs = [];
+				var skinIndices = [];
+				var skinWeights = [];
+
+				//
+
+				var data = this._currentGeo.GeometryData;
+
+				for ( var i = 0, l = data.indices.length; i < l; i ++ ) {
+
+					var stride2 = data.indices[ i ] * 2;
+					var stride3 = data.indices[ i ] * 3;
+					var stride4 = data.indices[ i ] * 4;
+
+					position.push( data.vertices[ stride3 ], data.vertices[ stride3 + 1 ], data.vertices[ stride3 + 2 ] );
+					normals.push( data.normals[ stride3 ], data.normals[ stride3 + 1 ], data.normals[ stride3 + 2 ] );
+					skinIndices.push( data.skinIndices[ stride4 ], data.skinIndices[ stride4 + 1 ], data.skinIndices[ stride4 + 2 ], data.skinIndices[ stride4 + 3 ] );
+					skinWeights.push( data.skinWeights[ stride4 ], data.skinWeights[ stride4 + 1 ], data.skinWeights[ stride4 + 2 ], data.skinWeights[ stride4 + 3 ] );
+					uvs.push( data.uvs[ stride2 ], data.uvs[ stride2 + 1 ] );
+
+				}
+
+				//
+
+				bufferGeometry.addAttribute( 'position', new THREE.Float32BufferAttribute( position, 3 ) );
+				bufferGeometry.addAttribute( 'normal', new THREE.Float32BufferAttribute( normals, 3 ) );
+				bufferGeometry.addAttribute( 'uv', new THREE.Float32BufferAttribute( uvs, 2 ) );
+				bufferGeometry.addAttribute( 'skinIndex', new THREE.Uint16BufferAttribute( skinIndices, 4 ) );
+				bufferGeometry.addAttribute( 'skinWeight', new THREE.Float32BufferAttribute( skinWeights, 4 ) );
+
+				this._computeGroups( bufferGeometry, data.materialIndices );
+
+				return bufferGeometry;
 
 			}
 		}, {
-			key: '_setMeshNormals',
-			value: function _setMeshNormals() {
+			key: '_computeGroups',
+			value: function _computeGroups( bufferGeometry, materialIndices ) {
 
-				var endRead = 0;
-				var mode = 0;
-				var mode_local = 0;
-				while ( true ) {
+				var group;
+				var groups = [];
+				var materialIndex = undefined;
 
-					switch ( mode ) {
+				for ( var i = 0; i < materialIndices.length; i ++ ) {
 
-						case 0:
-							if ( mode_local === 0 ) {
+					var currentMaterialIndex = materialIndices[ i ];
 
-								var refO = this._readInt1( 0 );
-								endRead = refO.endRead;
-								mode_local = 1;
+					if ( currentMaterialIndex !== materialIndex ) {
 
-							} else {
+						materialIndex = currentMaterialIndex;
 
-								var find = this._currentObject.data.indexOf( ',', endRead ) + 1;
-								if ( find === - 1 ) {
+						if ( group !== undefined ) {
 
-									find = this._currentObject.data.indexOf( ';;', endRead ) + 1;
-									mode = 2;
-									mode_local = 0;
+							group.count = ( i * 3 ) - group.start;
+							groups.push( group );
 
-								}
-								var line = this._currentObject.data.substr( endRead, find - endRead );
-								var data = this._readLine( line.trim() ).split( ";" );
-								this._currentGeo.normalVectors.push( [ parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ), parseFloat( data[ 2 ] ) ] );
-								endRead = find + 1;
+						}
 
-							}
-							break;
+						group = {
+							start: i * 3,
+							materialIndex: materialIndex
+						};
 
 					}
-					if ( endRead >= this._currentObject.data.length ) {
 
-						break;
+				}
 
-					}
+				if ( group !== undefined ) {
+
+					group.count = ( i * 3 ) - group.start;
+					groups.push( group );
 
 				}
 
+				bufferGeometry.groups = groups;
+
 			}
 		}, {
 			key: '_setMeshTextureCoords',
 			value: function _setMeshTextureCoords() {
 
-				this._tmpUvArray = [];
-				this._currentGeo.Geometry.faceVertexUvs = [];
-				this._currentGeo.Geometry.faceVertexUvs.push( [] );
 				var endRead = 0;
 				var mode = 0;
 				var mode_local = 0;
@@ -1034,11 +1060,11 @@
 								var data = this._readLine( line.trim() ).split( ";" );
 								if ( this.IsUvYReverse ) {
 
-									this._tmpUvArray.push( new THREE.Vector2( parseFloat( data[ 0 ] ), 1 - parseFloat( data[ 1 ] ) ) );
+									this._currentGeo.GeometryData.uvs.push( parseFloat( data[ 0 ] ), 1 - parseFloat( data[ 1 ] ) );
 
 								} else {
 
-									this._tmpUvArray.push( new THREE.Vector2( parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ) ) );
+									this._currentGeo.GeometryData.uvs.push( parseFloat( data[ 0 ] ), parseFloat( data[ 1 ] ) );
 
 								}
 								endRead = find + 1;
@@ -1054,16 +1080,6 @@
 					}
 
 				}
-				this._currentGeo.Geometry.faceVertexUvs[ 0 ] = [];
-				for ( var m = 0; m < this._currentGeo.Geometry.faces.length; m ++ ) {
-
-					this._currentGeo.Geometry.faceVertexUvs[ 0 ][ m ] = [];
-					this._currentGeo.Geometry.faceVertexUvs[ 0 ][ m ].push( this._tmpUvArray[ this._currentGeo.Geometry.faces[ m ].a ] );
-					this._currentGeo.Geometry.faceVertexUvs[ 0 ][ m ].push( this._tmpUvArray[ this._currentGeo.Geometry.faces[ m ].b ] );
-					this._currentGeo.Geometry.faceVertexUvs[ 0 ][ m ].push( this._tmpUvArray[ this._currentGeo.Geometry.faces[ m ].c ] );
-
-				}
-				this._currentGeo.Geometry.uvsNeedUpdate = true;
 
 			}
 		}, {
@@ -1095,7 +1111,7 @@
 						var data = this._readLine( line.trim() ).split( "," );
 						for ( var i = 0; i < data.length; i ++ ) {
 
-							this._currentGeo.Geometry.faces[ i ].materialIndex = parseInt( data[ i ] );
+							this._currentGeo.GeometryData.materialIndices[ i ] = parseInt( data[ i ] );
 
 						}
 						endRead = this._currentObject.data.length;
@@ -1281,13 +1297,6 @@
 			key: '_makeOutputGeometry',
 			value: function _makeOutputGeometry() {
 
-				this._currentGeo.Geometry.computeBoundingBox();
-				this._currentGeo.Geometry.computeBoundingSphere();
-				this._currentGeo.Geometry.verticesNeedUpdate = true;
-				this._currentGeo.Geometry.normalsNeedUpdate = true;
-				this._currentGeo.Geometry.colorsNeedUpdate = true;
-				this._currentGeo.Geometry.uvsNeedUpdate = true;
-				this._currentGeo.Geometry.groupsNeedUpdate = true;
 				var mesh = null;
 				if ( this._currentGeo.BoneInfs.length > 0 ) {
 
@@ -1312,23 +1321,26 @@
 
 							var nowVertexID = this._currentGeo.BoneInfs[ bi ].Indeces[ vi ];
 							var nowVal = this._currentGeo.BoneInfs[ bi ].Weights[ vi ];
+
+							var stride = nowVertexID * 4;
+
 							switch ( this._currentGeo.VertexSetedBoneCount[ nowVertexID ] ) {
 
 								case 0:
-									this._currentGeo.Geometry.skinIndices[ nowVertexID ].x = boneIndex;
-									this._currentGeo.Geometry.skinWeights[ nowVertexID ].x = nowVal;
+									this._currentGeo.GeometryData.skinIndices[ stride ] = boneIndex;
+									this._currentGeo.GeometryData.skinWeights[ stride ] = nowVal;
 									break;
 								case 1:
-									this._currentGeo.Geometry.skinIndices[ nowVertexID ].y = boneIndex;
-									this._currentGeo.Geometry.skinWeights[ nowVertexID ].y = nowVal;
+									this._currentGeo.GeometryData.skinIndices[ stride + 1 ] = boneIndex;
+									this._currentGeo.GeometryData.skinWeights[ stride + 1 ] = nowVal;
 									break;
 								case 2:
-									this._currentGeo.Geometry.skinIndices[ nowVertexID ].z = boneIndex;
-									this._currentGeo.Geometry.skinWeights[ nowVertexID ].z = nowVal;
+									this._currentGeo.GeometryData.skinIndices[ stride + 2 ] = boneIndex;
+									this._currentGeo.GeometryData.skinWeights[ stride + 2 ] = nowVal;
 									break;
 								case 3:
-									this._currentGeo.Geometry.skinIndices[ nowVertexID ].w = boneIndex;
-									this._currentGeo.Geometry.skinWeights[ nowVertexID ].w = nowVal;
+									this._currentGeo.GeometryData.skinIndices[ stride + 3 ] = boneIndex;
+									this._currentGeo.GeometryData.skinWeights[ stride + 3 ] = nowVal;
 									break;
 
 							}
@@ -1361,14 +1373,15 @@
 						}
 
 					}
-					var bufferGeometry = new THREE.BufferGeometry().fromGeometry( this._currentGeo.Geometry );
+
+					var bufferGeometry = this._buildGeometry();
 					bufferGeometry.bones = putBones;
 					mesh = new THREE.SkinnedMesh( bufferGeometry, this._currentGeo.Materials.length === 1 ? this._currentGeo.Materials[ 0 ] : this._currentGeo.Materials );
 					mesh.skeleton.boneInverses = offsetList;
 
 				} else {
 
-					var _bufferGeometry = new THREE.BufferGeometry().fromGeometry( this._currentGeo.Geometry );
+					var _bufferGeometry = this._buildGeometry();
 					mesh = new THREE.Mesh( _bufferGeometry, this._currentGeo.Materials.length === 1 ? this._currentGeo.Materials[ 0 ] : this._currentGeo.Materials );
 
 				}

examples/js/nodes/NodeBuilder.js

@@ -2,9 +2,10 @@
  * @author sunag / http://www.sunag.com.br/
  */
 
-THREE.NodeBuilder = function ( material ) {
+THREE.NodeBuilder = function ( material, renderer ) {
 
 	this.material = material;
+	this.renderer = renderer;
 
 	this.caches = [];
 	this.slots = [];

examples/js/nodes/NodeLib.js

@@ -141,8 +141,10 @@ THREE.NodeLib.add( new THREE.FunctionNode( [
 	"	vec3 q1 = dFdy( eye_pos );",
 	"	vec2 st0 = dFdx( mUv.st );",
 	"	vec2 st1 = dFdy( mUv.st );",
-	"	vec3 S = normalize( q0 * st1.t - q1 * st0.t );",
-	"	vec3 T = normalize( -q0 * st1.s + q1 * st0.s );",
+	"	float factor = sign( st1.t * st0.s - st0.t * st1.s );",
+	"	factor *= float( gl_FrontFacing ) * 2.0 - 1.0;",
+	"	vec3 S = normalize( ( q0 * st1.t - q1 * st0.t ) * factor );",
+	"	vec3 T = normalize( ( -q0 * st1.s + q1 * st0.s ) * factor );",
 	"	vec3 N = normalize( surf_norm );",
 	"	vec3 mapN = map * 2.0 - 1.0;",
 	"	mapN.xy = scale * mapN.xy;",

examples/js/nodes/NodeMaterial.js

@@ -6,6 +6,8 @@ THREE.NodeMaterial = function ( vertex, fragment ) {
 
 	THREE.ShaderMaterial.call( this );
 
+	this.defines.UUID = this.uuid;
+
 	this.vertex = vertex || new THREE.RawNode( new THREE.PositionNode( THREE.PositionNode.PROJECTION ) );
 	this.fragment = fragment || new THREE.RawNode( new THREE.ColorNode( 0xFF0000 ) );
 
@@ -78,13 +80,30 @@ THREE.NodeMaterial.prototype.updateFrame = function ( frame ) {
 
 };
 
-THREE.NodeMaterial.prototype.build = function () {
+THREE.NodeMaterial.prototype.onBeforeCompile = function ( shader, renderer ) {
+
+	if ( this.needsUpdate ) {
+
+		this.build( { dispose: false, renderer: renderer } );
+
+		shader.uniforms = this.uniforms;
+		shader.vertexShader = this.vertexShader;
+		shader.fragmentShader = this.fragmentShader;
+
+	}
+
+};
+
+THREE.NodeMaterial.prototype.build = function ( params ) {
+
+	params = params || {};
+	params.dispose = params.dispose !== undefined ? params.dispose : true;
 
 	var vertex, fragment;
 
 	this.nodes = [];
 
-	this.defines = {};
+	this.defines = { UUID: this.uuid };
 	this.uniforms = {};
 	this.attributes = {};
 
@@ -145,7 +164,7 @@ THREE.NodeMaterial.prototype.build = function () {
 
 	].join( "\n" );
 
-	var builder = new THREE.NodeBuilder( this );
+	var builder = new THREE.NodeBuilder( this, params.renderer );
 
 	vertex = this.vertex.build( builder.setShader( 'vertex' ), 'v4' );
 	fragment = this.fragment.build( builder.setShader( 'fragment' ), 'v4' );
@@ -253,8 +272,13 @@ THREE.NodeMaterial.prototype.build = function () {
 		'}'
 	].join( "\n" );
 
-	this.needsUpdate = true;
-	this.dispose(); // force update
+	if ( params.dispose ) {
+
+		// force update
+
+		this.dispose();
+
+	}
 
 	return this;
 
@@ -288,7 +312,7 @@ THREE.NodeMaterial.prototype.createUniform = function ( type, node, ns, needsUpd
 
 	var uniform = new THREE.NodeUniform( {
 		type: type,
-		name: ns ? ns : 'nVu' + index,
+		name: ns ? ns : 'nVu' + index + '_' + THREE.Math.generateUUID().substr(0, 8),
 		node: node,
 		needsUpdate: needsUpdate
 	} );

examples/js/nodes/postprocessing/NodePass.js

@@ -18,7 +18,7 @@ THREE.NodePass = function () {
 	this.node = new THREE.NodeMaterial();
 	this.node.fragment = this.fragment;
 
-	this.build();
+	this.needsUpdate = true;
 
 };
 
@@ -27,13 +27,21 @@ THREE.NodePass.prototype.constructor = THREE.NodePass;
 
 THREE.NodeMaterial.addShortcuts( THREE.NodePass.prototype, 'fragment', [ 'value' ] );
 
-THREE.NodePass.prototype.build = function () {
+THREE.NodePass.prototype.render = function () {
 
-	this.node.build();
+	if ( this.needsUpdate ) {
+
+		this.node.dispose();
+
+		this.needsUpdate = false;
+
+	}
 
 	this.uniforms = this.node.uniforms;
 	this.material = this.node;
 
+	THREE.ShaderPass.prototype.render.apply( this, arguments );
+
 };
 
 THREE.NodePass.prototype.toJSON = function ( meta ) {

examples/js/utils/UVsDebug.js

@@ -1,35 +1,33 @@
-/* 
+/*
  * @author zz85 / http://github.com/zz85
  * @author WestLangley / http://github.com/WestLangley
+ * @author Mugen87 / https://github.com/Mugen87
  *
- * tool for "unwrapping" and debugging three.js 
- * geometries UV mapping
+ * tool for "unwrapping" and debugging three.js geometries UV mapping
  *
  * Sample usage:
- *	document.body.appendChild( THREE.UVsDebug( new THREE.SphereGeometry( 10, 10, 10, 10 ) );
+ *	document.body.appendChild( THREE.UVsDebug( new THREE.SphereBufferGeometry( 10, 10, 10, 10 ) );
  *
  */
- 
-THREE.UVsDebug = function( geometry, size ) {
 
-	// handles wrapping of uv.x > 1 only
-    
-	var abc = 'abc';
+THREE.UVsDebug = function ( geometry, size ) {
 
-	var uv, u, ax, ay;
-	var i, il, j, jl;
-	var vnum;
+	// handles wrapping of uv.x > 1 only
 
+	var abc = 'abc';
 	var a = new THREE.Vector2();
 	var b = new THREE.Vector2();
 
-	var geo = ( geometry instanceof THREE.BufferGeometry ) ? new THREE.Geometry().fromBufferGeometry( geometry ) : geometry;
+	var uvs = [
+		new THREE.Vector2(),
+		new THREE.Vector2(),
+		new THREE.Vector2()
+	];
 
-	var faces = geo.faces;
-	var uvs = geo.faceVertexUvs[ 0 ];
+	var face = [];
 
 	var canvas = document.createElement( 'canvas' );
-	var width = size || 1024;   // power of 2 required for wrapping
+	var width = size || 1024; // power of 2 required for wrapping
 	var height = size || 1024;
 	canvas.width = width;
 	canvas.height = height;
@@ -44,30 +42,97 @@ THREE.UVsDebug = function( geometry, size ) {
 	ctx.fillStyle = 'rgba( 255, 255, 255, 1.0 )';
 	ctx.fillRect( 0, 0, width, height );
 
-	for ( i = 0, il = uvs.length; i < il; i ++ ) {
+	if ( geometry.isGeometry ) {
+
+		var faces = geometry.faces;
+		var uvSet = geometry.faceVertexUvs[ 0 ];
+
+		for ( var i = 0, il = uvSet.length; i < il; i ++ ) {
 
-		uv = uvs[ i ];
+			var face = faces[ i ];
+			var uv = uvSet[ i ];
+
+			face[ 0 ] = face.a;
+			face[ 1 ] = face.b;
+			face[ 2 ] = face.c;
+
+			uvs[ 0 ].copy( uv[ 0 ] );
+			uvs[ 1 ].copy( uv[ 1 ] );
+			uvs[ 2 ].copy( uv[ 2 ] );
+
+			processFace( face, uvs, i );
+
+		}
+
+	} else {
+
+		var index = geometry.index;
+		var uvAttribute = geometry.attributes.uv;
+
+		if ( index ) {
+
+			// indexed geometry
+
+			for ( var i = 0, il = index.count; i < il; i += 3 ) {
+
+				face[ 0 ] = index.getX( i );
+				face[ 1 ] = index.getX( i + 1 );
+				face[ 2 ] = index.getX( i + 2 );
+
+				uvs[ 0 ].fromBufferAttribute( uvAttribute, face[ 0 ] );
+				uvs[ 1 ].fromBufferAttribute( uvAttribute, face[ 1 ] );
+				uvs[ 2 ].fromBufferAttribute( uvAttribute, face[ 2 ] );
+
+				processFace( face, uvs, i );
+
+			}
 
-		// draw lines
+		} else {
+
+			// non-indexed geometry
+
+			for ( var i = 0, il = uvAttribute.count; i < il; i += 3 ) {
+
+				face[ 0 ] = i;
+				face[ 1 ] = i + 1;
+				face[ 2 ] = i + 2;
+
+				uvs[ 0 ].fromBufferAttribute( uvAttribute, face[ 0 ] );
+				uvs[ 1 ].fromBufferAttribute( uvAttribute, face[ 1 ] );
+				uvs[ 2 ].fromBufferAttribute( uvAttribute, face[ 2 ] );
+
+				processFace( face, uvs, i );
+
+			}
+
+		}
+
+	}
+
+	return canvas;
+
+	function processFace( face, uvs, index ) {
+
+		// draw contour of face
 
 		ctx.beginPath();
 
 		a.set( 0, 0 );
 
-		for ( j = 0, jl = uv.length; j < jl; j ++ ) {
+		for ( var j = 0, jl = uvs.length; j < jl; j ++ ) {
 
-			u = uv[ j ];
+			var uv = uvs[ j ];
 
-			a.x += u.x;
-			a.y += u.y;
+			a.x += uv.x;
+			a.y += uv.y;
 
-			if ( j == 0 ) {
+			if ( j === 0 ) {
 
-				ctx.moveTo( u.x * width, ( 1 - u.y ) * height );
+				ctx.moveTo( uv.x * width, ( 1 - uv.y ) * height );
 
 			} else {
 
-				ctx.lineTo( u.x * width, ( 1 - u.y ) * height );
+				ctx.lineTo( uv.x * width, ( 1 - uv.y ) * height );
 
 			}
 
@@ -76,33 +141,37 @@ THREE.UVsDebug = function( geometry, size ) {
 		ctx.closePath();
 		ctx.stroke();
 
-		a.divideScalar( jl );
+		// calculate center of face
+
+		a.divideScalar( uvs.length );
 
 		// label the face number
 
-		ctx.font = "12pt Arial bold";
+		ctx.font = '12pt Arial bold';
 		ctx.fillStyle = 'rgba( 0, 0, 0, 1.0 )';
-		ctx.fillText( i, a.x * width, ( 1 - a.y ) * height );
+		ctx.fillText( index, a.x * width, ( 1 - a.y ) * height );
 
 		if ( a.x > 0.95 ) {
 
 			// wrap x // 0.95 is arbitrary
 
-			ctx.fillText( i, ( a.x % 1 ) * width, ( 1 - a.y ) * height );
+			ctx.fillText( index, ( a.x % 1 ) * width, ( 1 - a.y ) * height );
 
 		}
 
-		ctx.font = "8pt Arial bold";
+		//
+
+		ctx.font = '8pt Arial bold';
 		ctx.fillStyle = 'rgba( 0, 0, 0, 1.0 )';
 
 		// label uv edge orders
 
-		for ( j = 0, jl = uv.length; j < jl; j ++ ) {
+		for ( j = 0, jl = uvs.length; j < jl; j ++ ) {
 
-			u = uv[ j ];
-			b.addVectors( a, u ).divideScalar( 2 );
+			var uv = uvs[ j ];
+			b.addVectors( a, uv ).divideScalar( 2 );
 
-			vnum = faces[ i ][ abc[ j ] ];
+			var vnum = face[ j ];
 			ctx.fillText( abc[ j ] + vnum, b.x * width, ( 1 - b.y ) * height );
 
 			if ( b.x > 0.95 ) {
@@ -117,7 +186,4 @@ THREE.UVsDebug = function( geometry, size ) {
 
 	}
 
-	return canvas;
-
 };
-

examples/js/vr/WebVR.js

@@ -78,7 +78,7 @@ var WEBVR = {
 
 				if ( currentSession === null ) {
 
-					device.requestSession( { exclusive: true } ).then( onSessionStarted );
+					device.requestSession( { immersive: true } ).then( onSessionStarted );
 
 				} else {
 
@@ -128,12 +128,8 @@ var WEBVR = {
 
 		}
 
-		var isWebXR = false;
-
 		if ( 'xr' in navigator ) {
 
-			isWebXR = true;
-
 			var button = document.createElement( 'button' );
 			button.style.display = 'none';
 
@@ -141,7 +137,7 @@ var WEBVR = {
 
 			navigator.xr.requestDevice().then( function ( device ) {
 
-				device.supportsSession( { exclusive: true } ).then( function () {
+				device.supportsSession( { immersive: true } ).then( function () {
 
 					showEnterXR( device );
 

examples/misc_controls_pointerlock.html

@@ -249,7 +249,7 @@
 
 				var position = floorGeometry.attributes.position;
 
-				for ( var i = 0; i < position.count; i ++ ) {
+				for ( var i = 0, l = position.count; i < l; i ++ ) {
 
 					vertex.fromBufferAttribute( position, i );
 
@@ -263,10 +263,10 @@
 
 				floorGeometry = floorGeometry.toNonIndexed(); // ensure each face has unique vertices
 
-				count = floorGeometry.attributes.position.count;
+				position = floorGeometry.attributes.position;
 				var colors = [];
 
-				for ( var i = 0; i < count; i ++ ) {
+				for ( var i = 0, l = position.count; i < l; i ++ ) {
 
 					color.setHSL( Math.random() * 0.3 + 0.5, 0.75, Math.random() * 0.25 + 0.75 );
 					colors.push( color.r, color.g, color.b );
@@ -285,10 +285,10 @@
 				var boxGeometry = new THREE.BoxBufferGeometry( 20, 20, 20 );
 				boxGeometry = boxGeometry.toNonIndexed(); // ensure each face has unique vertices
 
-				count = boxGeometry.attributes.position.count;
+				position = boxGeometry.attributes.position;
 				colors = [];
 
-				for ( var i = 0; i < count; i ++ ) {
+				for ( var i = 0, l = position.count; i < l; i ++ ) {
 
 					color.setHSL( Math.random() * 0.3 + 0.5, 0.75, Math.random() * 0.25 + 0.75 );
 					colors.push( color.r, color.g, color.b );

examples/misc_exporter_stl.html

@@ -42,7 +42,7 @@
 
 			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
-			var scene, camera, renderer, exporter;
+			var scene, camera, renderer, exporter, mesh;
 
 			init();
 			animate();

examples/misc_uv_tests.html

@@ -30,33 +30,33 @@
 
 			}
 
-			test('new THREE.PlaneGeometry( 100, 100, 4, 4 )', new THREE.PlaneGeometry( 100, 100, 4, 4 ));
+			var points = [];
 
-			test('new THREE.PlaneBufferGeometry( 100, 100, 4, 4 )', new THREE.PlaneBufferGeometry( 100, 100, 4, 4 ));
+			for ( var i = 0; i < 10; i ++ ) {
 
-			test('new THREE.SphereGeometry( 75, 12, 6 )', new THREE.SphereGeometry( 75, 12, 6 ));
+					points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 15 + 50, ( i - 5 ) * 2 ) );
 
-			test('new THREE.IcosahedronGeometry( 30, 1 )', new THREE.IcosahedronGeometry( 30, 1 ));
+			}
 
-			test('new THREE.OctahedronGeometry( 30, 2 )', new THREE.OctahedronGeometry( 30, 2 ));
+			//
 
-			test('new THREE.CylinderGeometry( 25, 75, 100, 10, 5 )', new THREE.CylinderGeometry( 25, 75, 100, 10, 5 ));
+			test('new THREE.PlaneBufferGeometry( 100, 100, 4, 4 )', new THREE.PlaneBufferGeometry( 100, 100, 4, 4 ));
 
-			test('new THREE.BoxGeometry( 100, 100, 100, 4, 4, 4 )', new THREE.BoxGeometry( 100, 100, 100, 4, 4, 4 ));
+			test('new THREE.SphereBufferGeometry( 75, 12, 6 )', new THREE.SphereBufferGeometry( 75, 12, 6 ));
 
-			var points = [];
+			test('new THREE.IcosahedronBufferGeometry( 30, 1 )', new THREE.IcosahedronBufferGeometry( 30, 1 ));
 
-			for ( var i = 0; i < 10; i ++ ) {
+			test('new THREE.OctahedronBufferGeometry( 30, 2 )', new THREE.OctahedronBufferGeometry( 30, 2 ));
 
-			    points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 15 + 50, ( i - 5 ) * 2 ) );
+			test('new THREE.CylinderBufferGeometry( 25, 75, 100, 10, 5 )', new THREE.CylinderBufferGeometry( 25, 75, 100, 10, 5 ));
 
-			}
+			test('new THREE.BoxBufferGeometry( 100, 100, 100, 4, 4, 4 )', new THREE.BoxBufferGeometry( 100, 100, 100, 4, 4, 4 ));
 
-			test('new THREE.LatheGeometry( points, 8 )', new THREE.LatheGeometry( points, 8 ));
+			test('new THREE.LatheBufferGeometry( points, 8 )', new THREE.LatheBufferGeometry( points, 8 ));
 
-			test('new THREE.TorusGeometry( 50, 20, 8, 8 )', new THREE.TorusGeometry( 50, 20, 8, 8 ));
+			test('new THREE.TorusBufferGeometry( 50, 20, 8, 8 )', new THREE.TorusBufferGeometry( 50, 20, 8, 8 ));
 
-			test('new THREE.TorusKnotGeometry( 50, 10, 12, 6 )', new THREE.TorusKnotGeometry( 50, 10, 12, 6 ));
+			test('new THREE.TorusKnotBufferGeometry( 50, 10, 12, 6 )', new THREE.TorusKnotBufferGeometry( 50, 10, 12, 6 ));
 
 		</script>
 

examples/webgl_buffergeometry_instancing_lambert.html

@@ -144,7 +144,6 @@
 				#include <envmap_pars_vertex>
 				#include <bsdfs>
 				#include <lights_pars_begin>
-				#include <lights_pars_maps>
 				#include <color_pars_vertex>
 				#include <fog_pars_vertex>
 				#include <morphtarget_pars_vertex>

examples/webgl_geometry_text_shapes.html

@@ -69,7 +69,7 @@
 
 					var message = "   Three.js\nSimple text.";
 
-					var shapes = font.generateShapes( message, 100, 2 );
+					var shapes = font.generateShapes( message, 100 );
 
 					var geometry = new THREE.ShapeGeometry( shapes );
 
@@ -118,7 +118,7 @@
 
 						var points = shape.getPoints();
 						var geometry = new THREE.BufferGeometry().setFromPoints( points );
-						
+
 						geometry.translate( xMid, 0, 0 );
 
 						var lineMesh = new THREE.Line( geometry, matDark );

examples/webgl_interactive_voxelpainter.html

@@ -6,17 +6,35 @@
 		<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;
+				background:#777;
+				padding:0;
+				margin:0;
+				font-weight: bold;
+				overflow:hidden;
 			}
 
-			#oldie { background-color: #ddd !important }
+			#info {
+				position: absolute;
+				top: 0px;
+				width: 100%;
+				padding: 5px;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+			}
+
+			a {
+				color: #ff0000;
+			}
 		</style>
 	</head>
 	<body>
 
+		<div id="info">
+			<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> - voxel painter - webgl<br>
+			<strong>click</strong>: add voxel, <strong>shift + click</strong>: remove voxel
+		</div>
+
 		<script src="../build/three.js"></script>
 
 		<script src="js/Detector.js"></script>
@@ -25,7 +43,6 @@
 
 			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
 
-			var container;
 			var camera, scene, renderer;
 			var plane, cube;
 			var mouse, raycaster, isShiftDown = false;
@@ -40,17 +57,6 @@
 
 			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" rel="noopener">three.js</a> - voxel painter - webgl<br><strong>click</strong>: add voxel, <strong>shift + click</strong>: remove voxel';
-				container.appendChild( info );
-
 				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 1, 10000 );
 				camera.position.set( 500, 800, 1300 );
 				camera.lookAt( new THREE.Vector3() );
@@ -60,15 +66,15 @@
 
 				// roll-over helpers
 
-				var rollOverGeo = new THREE.BoxGeometry( 50, 50, 50 );
+				var rollOverGeo = new THREE.BoxBufferGeometry( 50, 50, 50 );
 				rollOverMaterial = new THREE.MeshBasicMaterial( { color: 0xff0000, opacity: 0.5, transparent: true } );
 				rollOverMesh = new THREE.Mesh( rollOverGeo, rollOverMaterial );
 				scene.add( rollOverMesh );
 
 				// cubes
 
-				cubeGeo = new THREE.BoxGeometry( 50, 50, 50 );
-				cubeMaterial = new THREE.MeshLambertMaterial( { color: 0xfeb74c, map: new THREE.TextureLoader().load( "textures/square-outline-textured.png" ) } );
+				cubeGeo = new THREE.BoxBufferGeometry( 50, 50, 50 );
+				cubeMaterial = new THREE.MeshLambertMaterial( { color: 0xfeb74c, map: new THREE.TextureLoader().load( 'textures/square-outline-textured.png' ) } );
 
 				// grid
 
@@ -88,7 +94,7 @@
 
 				objects.push( plane );
 
-				// Lights
+				// lights
 
 				var ambientLight = new THREE.AmbientLight( 0x606060 );
 				scene.add( ambientLight );
@@ -100,7 +106,7 @@
 				renderer = new THREE.WebGLRenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
-				container.appendChild( renderer.domElement );
+				document.body.appendChild( renderer.domElement );
 
 				document.addEventListener( 'mousemove', onDocumentMouseMove, false );
 				document.addEventListener( 'mousedown', onDocumentMouseDown, false );
@@ -163,7 +169,7 @@
 
 					if ( isShiftDown ) {
 
-						if ( intersect.object != plane ) {
+						if ( intersect.object !== plane ) {
 
 							scene.remove( intersect.object );
 

examples/webgl_lines_fat_wireframe.html

@@ -0,0 +1,298 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<title>three.js webgl - lines - fat - wireframe</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;
+			}
+
+			#info {
+				position: absolute;
+				color: #ffffff;
+				top: 0px;
+				width: 100%;
+				padding: 5px;
+				font-family:Monospace;
+				font-size:13px;
+				text-align:center;
+			}
+			a {
+				color: #fff;
+			}
+		</style>
+	</head>
+
+	<body>
+
+		<div id="container"></div>
+
+		<div id="info"><a href="https://threejs.org" target="_blank">three.js</a> - fat lines</div>
+
+		<script src="../build/three.js"></script>
+		<script src="js/controls/OrbitControls.js"></script>
+
+		<script src="js/Detector.js"></script>
+
+		<script src="js/libs/stats.min.js"></script>
+		<script src='js/libs/dat.gui.min.js'></script>
+
+		<script src='js/lines/LineSegmentsGeometry.js'></script>
+		<script src='js/lines/LineGeometry.js'></script>
+		<script src='js/lines/WireframeGeometry2.js'></script>
+
+		<script src='js/lines/LineMaterial.js'></script>
+
+		<script src='js/lines/LineSegments2.js'></script>
+		<script src='js/lines/Line2.js'></script>
+		<script src='js/lines/Wireframe.js'></script>
+
+		<script>
+
+			if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
+
+			var wireframe, renderer, scene, camera, camera2, controls;
+			var wireframe1;
+			var matLine, matLineBasic, matLineDashed;
+			var stats;
+			var gui;
+
+			// viewport
+			var insetWidth;
+			var insetHeight;
+
+			init();
+			animate();
+
+			function init() {
+
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
+				renderer.setPixelRatio( window.devicePixelRatio );
+				renderer.setClearColor( 0x000000, 0.0 );
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				document.body.appendChild( renderer.domElement );
+
+				scene = new THREE.Scene();
+
+				camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 1000 );
+				camera.position.set( - 50, 0, 50 );
+
+				camera2 = new THREE.PerspectiveCamera( 40, 1, 1, 1000 );
+				camera2.position.copy( camera.position );
+
+				controls = new THREE.OrbitControls( camera, renderer.domElement );
+				controls.minDistance = 10;
+				controls.maxDistance = 500;
+
+
+				// THREE.Wireframe ( WireframeGeometry2, LineMaterial )
+
+				var geo = new THREE.IcosahedronBufferGeometry( 20, 1 );
+
+				var geometry = new THREE.WireframeGeometry2( geo );
+
+				matLine = new THREE.LineMaterial( {
+
+					color: 0x4080ff,
+					linewidth: 5, // in pixels
+					//resolution:  // to be set by renderer, eventually
+					dashed: false
+
+				} );
+
+				wireframe = new THREE.Wireframe( geometry, matLine );
+				wireframe.computeLineDistances();
+				wireframe.scale.set( 1, 1, 1 );
+				scene.add( wireframe );
+
+
+				// THREE.Line ( WireframeGeometry, LineBasicMaterial ) - rendered with gl.LINE
+
+				geo = new THREE.WireframeGeometry( geo );
+
+				matLineBasic = new THREE.LineBasicMaterial( { color: 0x4080ff } );
+				matLineDashed = new THREE.LineDashedMaterial( { scale: 2, dashSize: 1, gapSize: 1 } );
+
+				wireframe1 = new THREE.LineSegments( geo, matLineBasic );
+				wireframe1.computeLineDistances();
+				wireframe1.visible = false;
+				scene.add( wireframe1 );
+
+				//
+
+				window.addEventListener( 'resize', onWindowResize, false );
+				onWindowResize();
+
+				stats = new Stats();
+				document.body.appendChild( stats.dom );
+
+				initGui();
+
+			}
+
+			function onWindowResize() {
+
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
+
+				insetWidth = window.innerHeight / 4; // square
+				insetHeight = window.innerHeight / 4;
+
+				camera2.aspect = insetWidth / insetHeight;
+				camera2.updateProjectionMatrix();
+
+			}
+
+			function animate() {
+
+				requestAnimationFrame( animate );
+
+				stats.update();
+
+				// main scene
+
+				renderer.setClearColor( 0x000000, 0 );
+
+				renderer.setViewport( 0, 0, window.innerWidth, window.innerHeight );
+
+				// renderer will set this eventually
+				matLine.resolution.set( window.innerWidth, window.innerHeight ); // resolution of the viewport
+
+				renderer.render( scene, camera );
+
+				// inset scene
+
+				renderer.setClearColor( 0x222222, 1 );
+
+				renderer.clearDepth(); // important!
+
+				renderer.setScissorTest( true );
+
+				renderer.setScissor( 20, window.innerHeight - insetHeight - 20, insetWidth, insetHeight );
+
+				renderer.setViewport( 20, window.innerHeight - insetHeight - 20, insetWidth, insetHeight );
+
+				camera2.position.copy( camera.position );
+				camera2.quaternion.copy( camera.quaternion );
+
+				// renderer will set this eventually
+				matLine.resolution.set( insetWidth, insetHeight ); // resolution of the inset viewport
+
+				renderer.render( scene, camera2 );
+
+				renderer.setScissorTest( false );
+
+			}
+
+			//
+
+			function initGui() {
+
+				gui = new dat.GUI();
+
+				var param = {
+					'line type': 0,
+					'width (px)': 5,
+					'dashed': false,
+					'dash scale': 1,
+					'dash / gap': 1
+				};
+
+
+				gui.add( param, 'line type', { 'LineGeometry': 0, 'gl.LINE': 1 } ).onChange( function ( val ) {
+
+					switch ( val ) {
+
+						case '0':
+							wireframe.visible = true;
+
+							wireframe1.visible = false;
+
+							break;
+
+						case '1':
+							wireframe.visible = false;
+
+							wireframe1.visible = true;
+
+							break;
+
+					}
+
+				} );
+
+				gui.add( param, 'width (px)', 1, 10 ).onChange( function ( val ) {
+
+					matLine.linewidth = val;
+
+				} );
+
+				gui.add( param, 'dashed' ).onChange( function ( val ) {
+
+					matLine.dashed = val;
+
+					// dashed is implemented as a defines -- not as a uniform. this could be changed.
+					// ... or LineDashedMaterial could be implemented as a separate material
+					// temporary hack - renderer should do this eventually
+					if ( val ) matLine.defines.USE_DASH = ""; else delete matLine.defines.USE_DASH;
+					matLine.needsUpdate = true;
+
+					wireframe1.material = val ? matLineDashed : matLineBasic;
+
+				} );
+
+				gui.add( param, 'dash scale', 1, 8, 0.1 ).onChange( function ( val ) {
+
+					matLine.dashScale = val;
+					matLineDashed.scale = val;
+
+				} );
+
+				gui.add( param, 'dash / gap', { '2 : 1': 0, '1 : 1': 1, '1 : 2': 2 } ).onChange( function ( val ) {
+
+					switch ( val ) {
+
+						case '0':
+							matLine.dashSize = 2;
+							matLine.gapSize = 1;
+
+							matLineDashed.dashSize = 2;
+							matLineDashed.gapSize = 1;
+
+							break;
+
+						case '1':
+							matLine.dashSize = 1;
+							matLine.gapSize = 1;
+
+							matLineDashed.dashSize = 1;
+							matLineDashed.gapSize = 1;
+
+							break;
+
+						case '2':
+							matLine.dashSize = 1;
+							matLine.gapSize = 2;
+
+							matLineDashed.dashSize = 1;
+							matLineDashed.gapSize = 2;
+
+							break;
+
+					}
+
+				} );
+
+			}
+
+		</script>
+
+	</body>
+
+</html>

examples/webgl_loader_msgpack.html

@@ -39,7 +39,6 @@ https://github.com/creationix/msgpack-js-browser
 		<script src='js/controls/OrbitControls.js'></script>
 		<script src='js/Detector.js'></script>
 		<script src='js/libs/msgpack-js.js'></script>
-		<script src='js/libs/stats.min.js'></script>
 	</head>
 	<body>
 		<div id='info'>
@@ -98,7 +97,7 @@ https://github.com/creationix/msgpack-js-browser
 
 				new THREE.FileLoader()
 					.setResponseType( 'arraybuffer' )
-					.load( 'scenes/robo_pigeon.pack', function ( data ) {
+					.load( 'models/msgpack/robo_pigeon.pack', function ( data ) {
 
 						var decoded = msgpack.decode( data );
 
@@ -112,7 +111,7 @@ https://github.com/creationix/msgpack-js-browser
 
 			function onWindowResize() {
 
-				camera.aspect = container.offsetWidth / container.offsetHeight;
+				camera.aspect = window.innerWidth / window.innerHeight;
 				camera.updateProjectionMatrix();
 
 				renderer.setSize( window.innerWidth, window.innerHeight );
@@ -124,15 +123,13 @@ https://github.com/creationix/msgpack-js-browser
 
 				container = document.getElementById( 'viewport' );
 
-				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: true	} );
+				renderer = new THREE.WebGLRenderer( { antialias: true, alpha: true } );
 				renderer.setClearColor( 0x000000, 0 );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				container.appendChild( renderer.domElement );
 
-				var aspect = container.offsetWidth / container.offsetHeight;
-
-				camera = new THREE.PerspectiveCamera( 60, aspect, 0.01, 50 );
+				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 0.01, 50 );
 				camera.position.set( 5, 5, 5 );
 				camera.updateProjectionMatrix();
 

examples/webgl_loader_nodes.html

@@ -248,8 +248,6 @@
 
 					time.timeScale = true;
 
-					loader.material.build();
-
 					// gui
 
 					addGui( 'timeScale', time.scale, function ( val ) {

examples/webgl_loader_x.html

@@ -23,22 +23,22 @@
         a {
             color: #ff0000
         }
-        
-        #info2 { 
-            color: #fff; 
-            background-color: #000; 
-            position: absolute; 
-            top: 3em; 
-            right : 0px; 
-            width: 10em; 
-            z-index: 200; 
-            display: block;  
+
+        #info2 {
+            color: #fff;
+            background-color: #000;
+            position: absolute;
+            top: 3em;
+            right : 0px;
+            width: 10em;
+            z-index: 200;
+            display: block;
         }
-    
-        td { 
+
+        td {
             padding: 0.5em;
         }
-        
+
     </style>
 </head>
 <body>
@@ -71,7 +71,7 @@
 	<script src='js/Detector.js'></script>
 	<script src='js/libs/stats.min.js'></script>
 	<script src='js/libs/dat.gui.min.js'></script>
-    
+
     <script>
 
         if ( ! Detector.webgl ) Detector.addGetWebGLMessage();
@@ -81,7 +81,6 @@
         var clock = new THREE.Clock();
         var mixers = [];
         var manager = null;
-        var Texloader = null;
 
         var skeletonHelper = null;
         var animates = [];
@@ -156,8 +155,7 @@
 
             };
 
-            Texloader = new THREE.TextureLoader();
-            var loader = new THREE.XLoader( manager, Texloader );
+            var loader = new THREE.XLoader( manager );
 
             actions[ 0 ] = {};
 
@@ -244,7 +242,7 @@
 
             } else {
 
-                var loader2 = new THREE.XLoader( manager, Texloader );
+                var loader2 = new THREE.XLoader( manager );
                 loader2.load( [ 'models/xfile/' + animeName + '.x', { putPos: false, putScl: false } ], function () {
 
                     // !! important!

examples/webgl_materials_compile.html

@@ -69,6 +69,7 @@
 		<script src="js/nodes/FunctionNode.js"></script>
 		<script src="js/nodes/FunctionCallNode.js"></script>
 		<script src="js/nodes/AttributeNode.js"></script>
+		<script src="js/nodes/NodeUniform.js"></script>
 		<script src="js/nodes/NodeBuilder.js"></script>
 		<script src="js/nodes/NodeLib.js"></script>
 		<script src="js/nodes/NodeFrame.js"></script>
@@ -267,6 +268,7 @@
 			
 			var transformer = new THREE.FunctionNode( "position + 0.0 * " + Math.random(), "vec3", [ ]);
 			mtl.transform = transformer;
+
 			// build shader
 			mtl.build();
 

examples/webgl_materials_nodes.html

@@ -285,6 +285,8 @@
 
 			} else if ( typeof value == 'object' ) {
 
+				param.blend = value[ Object.keys( value )[ 0 ] ];
+
 				node = gui.add( param, name, value ).onChange( function () {
 
 					callback( param[ name ] );
@@ -698,7 +700,7 @@
 
 						blend.b = val ? displace : displaceY;
 
-						mtl.build();
+						mtl.needsUpdate = true;
 
 					} );
 
@@ -783,7 +785,7 @@
 
 						}
 
-						mtl.build();
+						mtl.needsUpdate = true;
 
 					} );
 
@@ -943,7 +945,7 @@
 
 						mtl.color = val ? diffuse : new THREE.ColorNode( 0xEEEEEE );
 
-						mtl.build();
+						mtl.needsUpdate = true;
 
 					} );
 
@@ -1900,7 +1902,7 @@
 
 						mtl.ao = val ? new THREE.FloatNode() : undefined;
 
-						mtl.build();
+						mtl.needsUpdate = true;
 
 					} );
 
@@ -2194,7 +2196,6 @@
 					var distanceMtl = new THREE.PhongNodeMaterial();
 					distanceMtl.environment = objectDepth;
 					distanceMtl.side = THREE.BackSide;
-					distanceMtl.build();
 
 					rtMaterial = distanceMtl;
 
@@ -2303,9 +2304,6 @@
 
 			}
 
-			// build shader
-			mtl.build();
-
 			// set material
 			mesh.material = mtl;
 

examples/webgl_mirror_nodes.html

@@ -211,7 +211,6 @@
 			groundMirrorMaterial.environmentAlpha = mask;
 			groundMirrorMaterial.normal = normal;
 			//groundMirrorMaterial.normalScale = new THREE.FloatNode( 1 );
-			groundMirrorMaterial.build();
 
 			// test serialization
 /*

examples/webgl_modifier_simplifier.html

@@ -7,10 +7,13 @@
 		<style>
 			body {
 				font-family: Monospace;
-				background-color: #f0f0f0;
+				color: #fff;
 				margin: 0px;
 				overflow: hidden;
 			}
+			a {
+				color: #ffffff;
+			}
 		</style>
 	</head>
 	<body>
@@ -18,129 +21,80 @@
 		<script src="../build/three.js"></script>
 		<script src="js/controls/OrbitControls.js"></script>
 		<script src="js/modifiers/SimplifyModifier.js"></script>
-		<script src="js/libs/stats.min.js"></script>
 
 		<script>
 
-			var container, stats;
-
-			var camera, controls, scene, renderer;
-
-			var boxGeometry = new THREE.BoxBufferGeometry( 80, 80, 80, 4, 4, 4 );
-			var torusGeometry = new THREE.TorusBufferGeometry( 50, 25, 8, 8, Math.PI * 2 );
-			var sphereGeometry = new THREE.SphereBufferGeometry( 50, 15, 15 );
-			var planeGeometry = new THREE.PlaneBufferGeometry( 100, 100, 6, 6 );
-
-			var modifer = new THREE.SimplifyModifier();
-			var meshes = [];
-			var count = 0;
-
-			var wireframeMaterial = new THREE.MeshBasicMaterial( { color: 0x000000, wireframe: true, transparent: true } );
+			var renderer, scene, camera;
 
 			init();
-			animate();
-
-
-			function addStuff( geometry ) {
-
-				count ++;
-
-				var mesh, wireframe;
-
-				var material = new THREE.MeshBasicMaterial( { color: Math.random() * 0xffffff } );
-
-				var vertexCount = geometry.attributes.position.count;
-
-				var simplified = modifer.modify( geometry, Math.floor( vertexCount * 0.5 ) );
-
-				mesh = new THREE.Mesh( simplified, material );
-				wireframe = new THREE.Mesh( simplified, wireframeMaterial );
-				mesh.add( wireframe );
-				mesh.position.x = - 200;
-				mesh.position.y = count * 150 - 300;
-
-				scene.add( mesh );
-				meshes.push( mesh );
-
-				mesh = new THREE.Mesh( geometry, material );
-				wireframe = new THREE.Mesh( geometry, wireframeMaterial );
-				mesh.add( wireframe );
-				mesh.position.x = 200;
-				mesh.position.y = count * 150 - 300;
-
-				scene.add( mesh );
-				meshes.push ( mesh );
-
-			}
 
 			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 = '50% Vertex Reduction using SimplifyModifier';
-				container.appendChild( info );
+				info.innerHTML = '<a href="https://threejs.org" target="_blank" rel="noopener">three.js</a> - Vertex Reduction using SimplifyModifier';
+				document.body.appendChild( info );
 
-				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 1, 1000 );
-				camera.position.z = 500;
+				renderer = new THREE.WebGLRenderer( { antialias: true } );
+				renderer.setPixelRatio( window.devicePixelRatio );
+				renderer.setSize( window.innerWidth, window.innerHeight );
+				document.body.appendChild( renderer.domElement );
 
 				scene = new THREE.Scene();
-				scene.background = new THREE.Color( 0xf0f0f0 );
 
-				var light = new THREE.PointLight( 0xffffff, 1.5 );
-				light.position.set( 1000, 1000, 2000 );
-				scene.add( light );
+				camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 1000 );
+				camera.position.z = 15;
 
-				addStuff( planeGeometry );
-				addStuff( boxGeometry );
-				addStuff( sphereGeometry );
-				addStuff( torusGeometry );
+				var controls = new THREE.OrbitControls( camera, renderer.domElement );
+				controls.addEventListener( 'change', render ); // use if there is no animation loop
+				controls.enablePan = false;
+				controls.enableZoom = false;
 
-				renderer = new THREE.WebGLRenderer( { antialias: true } );
-				renderer.setPixelRatio( window.devicePixelRatio );
-				renderer.setSize( window.innerWidth, window.innerHeight );
-				container.appendChild( renderer.domElement );
+				scene.add( new THREE.AmbientLight( 0xffffff, 0.2 ) );
 
-				stats = new Stats();
-				container.appendChild( stats.dom );
+				var light = new THREE.PointLight( 0xffffff, 0.7 );
+				camera.add( light );
+				scene.add( camera );
 
-				//
+				new THREE.JSONLoader().load( "models/json/leeperrysmith/LeePerrySmith.json", function ( geometry ) {
 
-				controls = new THREE.OrbitControls( camera, renderer.domElement );
+					var material = new THREE.MeshPhongMaterial( { color: 0xAEAED5, shininess: 1 } );
 
-				window.addEventListener( 'resize', onWindowResize, false );
+					var mesh = new THREE.Mesh( geometry, material );
+					mesh.position.x = - 3;
+					mesh.rotation.y = Math.PI / 2;
+					scene.add( mesh );
 
-			}
+					var modifer = new THREE.SimplifyModifier();
 
-			function onWindowResize() {
+					var simplified = modifer.modify( geometry, Math.floor( geometry.vertices.length * 0.9375 ) ); // number of vertices to remove
 
-				camera.aspect = window.innerWidth / window.innerHeight;
-				camera.updateProjectionMatrix();
+					var material = new THREE.MeshPhongMaterial( { color: 0xAEAED5, shininess: 1, flatShading: true } );
 
-				renderer.setSize( window.innerWidth, window.innerHeight );
+					var mesh = new THREE.Mesh( simplified, material );
+					mesh.position.x = 3;
+					mesh.rotation.y = - Math.PI / 2;
+					scene.add( mesh );
 
-			}
+					render();
 
-			//
+				} );
 
-			function animate() {
+				window.addEventListener( 'resize', onWindowResize, false );
 
-				meshes.forEach( function( m ) {
-					m.rotation.x += 0.01;
-					m.rotation.y += 0.01;
-					m.rotation.z += 0.01;
-				} );
+			}
+
+			function onWindowResize() {
+
+				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				requestAnimationFrame( animate );
+				camera.aspect = window.innerWidth / window.innerHeight;
+				camera.updateProjectionMatrix();
 
-				stats.begin();
 				render();
-				stats.end();
 
 			}