Docs: Move to let/const.

docs/api/en/audio/Audio.html

@@ -22,14 +22,14 @@
 
 		<code>
 		// create an AudioListener and add it to the camera
-		var listener = new THREE.AudioListener();
+		const listener = new THREE.AudioListener();
 		camera.add( listener );
 
 		// create a global audio source
-		var sound = new THREE.Audio( listener );
+		const sound = new THREE.Audio( listener );
 
 		// load a sound and set it as the Audio object's buffer
-		var audioLoader = new THREE.AudioLoader();
+		const audioLoader = new THREE.AudioLoader();
 		audioLoader.load( 'sounds/ambient.ogg', function( buffer ) {
 			sound.setBuffer( buffer );
 			sound.setLoop( true );

docs/api/en/audio/AudioAnalyser.html

@@ -22,14 +22,14 @@
 
 		<code>
 		// create an AudioListener and add it to the camera
-		var listener = new THREE.AudioListener();
+		const listener = new THREE.AudioListener();
 		camera.add( listener );
 
 		// create an Audio source
-		var sound = new THREE.Audio( listener );
+		const sound = new THREE.Audio( listener );
 
 		// load a sound and set it as the Audio object's buffer
-		var audioLoader = new THREE.AudioLoader();
+		const audioLoader = new THREE.AudioLoader();
 		audioLoader.load( 'sounds/ambient.ogg', function( buffer ) {
 			sound.setBuffer( buffer );
 			sound.setLoop(true);
@@ -38,10 +38,10 @@
 		});
 
 		// create an AudioAnalyser, passing in the sound and desired fftSize
-		var analyser = new THREE.AudioAnalyser( sound, 32 );
+		const analyser = new THREE.AudioAnalyser( sound, 32 );
 
 		// get the average frequency of the sound
-		var data = analyser.getAverageFrequency();
+		const data = analyser.getAverageFrequency();
 		</code>
 
 		<h2>Examples</h2>

docs/api/en/audio/AudioListener.html

@@ -22,14 +22,14 @@
 
 		<code>
 		// create an AudioListener and add it to the camera
-		var listener = new THREE.AudioListener();
+		const listener = new THREE.AudioListener();
 		camera.add( listener );
 
 		// create a global audio source
-		var sound = new THREE.Audio( listener );
+		const sound = new THREE.Audio( listener );
 
 		// load a sound and set it as the Audio object's buffer
-		var audioLoader = new THREE.AudioLoader();
+		const audioLoader = new THREE.AudioLoader();
 		audioLoader.load( 'sounds/ambient.ogg', function( buffer ) {
 			sound.setBuffer( buffer );
 			sound.setLoop(true);

docs/api/en/audio/PositionalAudio.html

@@ -22,14 +22,14 @@
 
 		<code>
 		// create an AudioListener and add it to the camera
-		var listener = new THREE.AudioListener();
+		const listener = new THREE.AudioListener();
 		camera.add( listener );
 
 		// create the PositionalAudio object (passing in the listener)
-		var sound = new THREE.PositionalAudio( listener );
+		const sound = new THREE.PositionalAudio( listener );
 
 		// load a sound and set it as the PositionalAudio object's buffer
-		var audioLoader = new THREE.AudioLoader();
+		const audioLoader = new THREE.AudioLoader();
 		audioLoader.load( 'sounds/song.ogg', function( buffer ) {
 			sound.setBuffer( buffer );
 			sound.setRefDistance( 20 );
@@ -37,9 +37,9 @@
 		});
 
 		// create an object for the sound to play from
-		var sphere = new THREE.SphereBufferGeometry( 20, 32, 16 );
-		var material = new THREE.MeshPhongMaterial( { color: 0xff2200 } );
-		var mesh = new THREE.Mesh( sphere, material );
+		const sphere = new THREE.SphereBufferGeometry( 20, 32, 16 );
+		const material = new THREE.MeshPhongMaterial( { color: 0xff2200 } );
+		const mesh = new THREE.Mesh( sphere, material );
 		scene.add( mesh );
 
 		// finally add the sound to the mesh

docs/api/en/cameras/CubeCamera.html

@@ -18,15 +18,15 @@
 
 		<code>
 		// Create cube render target
-		var cubeRenderTarget = new THREE.WebGLCubeRenderTarget( 128, { format: THREE.RGBFormat, generateMipmaps: true, minFilter: THREE.LinearMipmapLinearFilter } );
+		const cubeRenderTarget = new THREE.WebGLCubeRenderTarget( 128, { format: THREE.RGBFormat, generateMipmaps: true, minFilter: THREE.LinearMipmapLinearFilter } );
 
 		// Create cube camera
-		var cubeCamera = new THREE.CubeCamera( 1, 100000, cubeRenderTarget );
+		const cubeCamera = new THREE.CubeCamera( 1, 100000, cubeRenderTarget );
 		scene.add( cubeCamera );
 
 		// Create car
-		var chromeMaterial = new THREE.MeshLambertMaterial( { color: 0xffffff, envMap: cubeRenderTarget.texture } );
-		var car = new Mesh( carGeometry, chromeMaterial );
+		const chromeMaterial = new THREE.MeshLambertMaterial( { color: 0xffffff, envMap: cubeRenderTarget.texture } );
+		const car = new Mesh( carGeometry, chromeMaterial );
 		scene.add( car );
 
 		// Update the render target cube

docs/api/en/cameras/OrthographicCamera.html

@@ -24,7 +24,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var camera = new THREE.OrthographicCamera( width / - 2, width / 2, height / 2, height / - 2, 1, 1000 );
+		const camera = new THREE.OrthographicCamera( width / - 2, width / 2, height / 2, height / - 2, 1, 1000 );
 		scene.add( camera );
 		</code>
 

docs/api/en/cameras/PerspectiveCamera.html

@@ -22,7 +22,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var camera = new THREE.PerspectiveCamera( 45, width / height, 1, 1000 );
+		const camera = new THREE.PerspectiveCamera( 45, width / height, 1, 1000 );
 		scene.add( camera );
 		</code>
 
@@ -160,10 +160,10 @@
 
 		then for each monitor you would call it like this:<br />
 
-		<code>var w = 1920;
-var h = 1080;
-var fullWidth = w * 3;
-var fullHeight = h * 2;
+		<code>const w = 1920;
+const h = 1080;
+const fullWidth = w * 3;
+const fullHeight = h * 2;
 
 // A
 camera.setViewOffset( fullWidth, fullHeight, w * 0, h * 0, w, h );

docs/api/en/constants/CustomBlendingEquations.html

@@ -17,7 +17,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
+		const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
 		material.blending = THREE.CustomBlending;
 		material.blendEquation = THREE.AddEquation; //default
 		material.blendSrc = THREE.SrcAlphaFactor; //default

docs/api/en/core/BufferGeometry.html

@@ -24,10 +24,10 @@
 
 		<h2>Code Example</h2>
 		<code>
-		var geometry = new THREE.BufferGeometry();
+		const geometry = new THREE.BufferGeometry();
 		// create a simple square shape. We duplicate the top left and bottom right
 		// vertices because each vertex needs to appear once per triangle.
-		var vertices = new Float32Array( [
+		const vertices = new Float32Array( [
 			-1.0, -1.0,  1.0,
 			 1.0, -1.0,  1.0,
 			 1.0,  1.0,  1.0,
@@ -39,8 +39,8 @@
 
 		// itemSize = 3 because there are 3 values (components) per vertex
 		geometry.setAttribute( 'position', new THREE.BufferAttribute( vertices, 3 ) );
-		var material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
-		var mesh = new THREE.Mesh( geometry, material );
+		const material = new THREE.MeshBasicMaterial( { color: 0xff0000 } );
+		const mesh = new THREE.Mesh( geometry, material );
 		</code>
 
 		<h2>Examples</h2>

docs/api/en/core/EventDispatcher.html

@@ -20,27 +20,23 @@
 		<code>
 		// Adding events to a custom object
 
-		var Car = function () {
+		class Car extends EventDispatcher {
 
-		    this.start = function () {
+			start() {
 
-		        this.dispatchEvent( { type: 'start', message: 'vroom vroom!' } );
+				this.dispatchEvent( { type: 'start', message: 'vroom vroom!' } );
 
-		    };
+			}
 
 		};
 
-		// Mixing the EventDispatcher.prototype with the custom object prototype
-
-		Object.assign( Car.prototype, EventDispatcher.prototype );
-
 		// Using events with the custom object
 
-		var car = new Car();
+		const car = new Car();
 
 		car.addEventListener( 'start', function ( event ) {
 
-		    alert( event.message );
+			alert( event.message );
 
 		} );
 

docs/api/en/core/Face3.html

@@ -19,19 +19,19 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var material = new THREE.MeshStandardMaterial( { color : 0x00cc00 } );
+		const material = new THREE.MeshStandardMaterial( { color : 0x00cc00 } );
 
 		//create a triangular geometry
-		var geometry = new THREE.Geometry();
+		const geometry = new THREE.Geometry();
 		geometry.vertices.push( new THREE.Vector3( -50, -50, 0 ) );
 		geometry.vertices.push( new THREE.Vector3(  50, -50, 0 ) );
 		geometry.vertices.push( new THREE.Vector3(  50,  50, 0 ) );
 
 		//create a new face using vertices 0, 1, 2
-		var normal = new THREE.Vector3( 0, 0, 1 ); //optional
-		var color = new THREE.Color( 0xffaa00 ); //optional
-		var materialIndex = 0; //optional
-		var face = new THREE.Face3( 0, 1, 2, normal, color, materialIndex );
+		const normal = new THREE.Vector3( 0, 0, 1 ); //optional
+		const color = new THREE.Color( 0xffaa00 ); //optional
+		const materialIndex = 0; //optional
+		const face = new THREE.Face3( 0, 1, 2, normal, color, materialIndex );
 
 		//add the face to the geometry's faces array
 		geometry.faces.push( face );

docs/api/en/core/Geometry.html

@@ -24,7 +24,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var geometry = new THREE.Geometry();
+		const geometry = new THREE.Geometry();
 
 		geometry.vertices.push(
 			new THREE.Vector3( -10,  10, 0 ),

docs/api/en/core/Raycaster.html

@@ -18,8 +18,8 @@
 
 		<h2>Code Example</h2>
 		<code>
-		var raycaster = new THREE.Raycaster();
-		var mouse = new THREE.Vector2();
+		const raycaster = new THREE.Raycaster();
+		const mouse = new THREE.Vector2();
 
 		function onMouseMove( event ) {
 
@@ -37,9 +37,9 @@
 			raycaster.setFromCamera( mouse, camera );
 
 			// calculate objects intersecting the picking ray
-			var intersects = raycaster.intersectObjects( scene.children );
+			const intersects = raycaster.intersectObjects( scene.children );
 
-			for ( var i = 0; i < intersects.length; i++ ) {
+			for ( let i = 0; i < intersects.length; i ++ ) {
 
 				intersects[ i ].object.material.color.set( 0xff0000 );
 

docs/api/en/core/Uniform.html

@@ -218,11 +218,11 @@
 			It's also possible to manage *structs* in arrays. The syntax for this use case looks like so:
 		</p>
 		<code>
-		var entry1 = {
+		const entry1 = {
 			position: new Vector3(),
 			direction: new Vector3( 0, 0, 1 )
 		};
-		var entry2 = {
+		const entry2 = {
 			position: new Vector3( 1, 1, 1 ),
 			direction: new Vector3( 0, 1, 0 )
 		};

docs/api/en/extras/core/Path.html

@@ -19,18 +19,18 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var path = new THREE.Path();
+		const path = new THREE.Path();
 
 		path.lineTo( 0, 0.8 );
 		path.quadraticCurveTo( 0, 1, 0.2, 1 );
 		path.lineTo( 1, 1 );
 
-		var points = path.getPoints();
+		const points = path.getPoints();
 
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
-		var material = new THREE.LineBasicMaterial( { color: 0xffffff } );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const material = new THREE.LineBasicMaterial( { color: 0xffffff } );
 
-		var line = new THREE.Line( geometry, material );
+		const line = new THREE.Line( geometry, material );
 		scene.add( line );
 		</code>
 

docs/api/en/extras/core/Shape.html

@@ -20,7 +20,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var heartShape = new THREE.Shape();
+		const heartShape = new THREE.Shape();
 
 		heartShape.moveTo( 25, 25 );
 		heartShape.bezierCurveTo( 25, 25, 20, 0, 0, 0 );
@@ -30,11 +30,11 @@
 		heartShape.bezierCurveTo( 80, 35, 80, 0, 50, 0 );
 		heartShape.bezierCurveTo( 35, 0, 25, 25, 25, 25 );
 
-		var extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 };
+		const extrudeSettings = { amount: 8, bevelEnabled: true, bevelSegments: 2, steps: 2, bevelSize: 1, bevelThickness: 1 };
 
-		var geometry = new THREE.ExtrudeBufferGeometry( heartShape, extrudeSettings );
+		const geometry = new THREE.ExtrudeBufferGeometry( heartShape, extrudeSettings );
 
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshPhongMaterial() );
 		</code>
 
 		<h2>Examples</h2>

docs/api/en/extras/curves/CatmullRomCurve3.html

@@ -19,7 +19,7 @@
 
 		<code>
 		//Create a closed wavey loop
-		var curve = new THREE.CatmullRomCurve3( [
+		const curve = new THREE.CatmullRomCurve3( [
 			new THREE.Vector3( -10, 0, 10 ),
 			new THREE.Vector3( -5, 5, 5 ),
 			new THREE.Vector3( 0, 0, 0 ),
@@ -27,13 +27,13 @@
 			new THREE.Vector3( 10, 0, 10 )
 		] );
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 		// Create the final object to add to the scene
-		var curveObject = new THREE.Line( geometry, material );
+		const curveObject = new THREE.Line( geometry, material );
 		</code>
 
 		<h2>Examples</h2>

docs/api/en/extras/curves/CubicBezierCurve.html

@@ -21,20 +21,20 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var curve = new THREE.CubicBezierCurve(
+		const curve = new THREE.CubicBezierCurve(
 			new THREE.Vector2( -10, 0 ),
 			new THREE.Vector2( -5, 15 ),
 			new THREE.Vector2( 20, 15 ),
 			new THREE.Vector2( 10, 0 )
 		);
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 		// Create the final object to add to the scene
-		var curveObject = new THREE.Line( geometry, material );
+		const curveObject = new THREE.Line( geometry, material );
 		</code>
 
 		<h2>Constructor</h2>

docs/api/en/extras/curves/CubicBezierCurve3.html

@@ -21,20 +21,20 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var curve = new THREE.CubicBezierCurve3(
+		const curve = new THREE.CubicBezierCurve3(
 			new THREE.Vector3( -10, 0, 0 ),
 			new THREE.Vector3( -5, 15, 0 ),
 			new THREE.Vector3( 20, 15, 0 ),
 			new THREE.Vector3( 10, 0, 0 )
 		);
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 		// Create the final object to add to the scene
-		var curveObject = new THREE.Line( geometry, material );
+		const curveObject = new THREE.Line( geometry, material );
 
 		</code>
 

docs/api/en/extras/curves/EllipseCurve.html

@@ -20,7 +20,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var curve = new THREE.EllipseCurve(
+		const curve = new THREE.EllipseCurve(
 			0,  0,            // ax, aY
 			10, 10,           // xRadius, yRadius
 			0,  2 * Math.PI,  // aStartAngle, aEndAngle
@@ -28,13 +28,13 @@
 			0                 // aRotation
 		);
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 		// Create the final object to add to the scene
-		var ellipse = new THREE.Line( geometry, material );
+		const ellipse = new THREE.Line( geometry, material );
 		</code>
 
 		<h2>Constructor</h2>

docs/api/en/extras/curves/QuadraticBezierCurve.html

@@ -21,19 +21,19 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var curve = new THREE.QuadraticBezierCurve(
+		const curve = new THREE.QuadraticBezierCurve(
 			new THREE.Vector2( -10, 0 ),
 			new THREE.Vector2( 20, 15 ),
 			new THREE.Vector2( 10, 0 )
 		);
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
-		//Create the final object to add to the scene
-		var curveObject = new THREE.Line( geometry, material );
+		// Create the final object to add to the scene
+		const curveObject = new THREE.Line( geometry, material );
 		</code>
 
 		<h2>Constructor</h2>

docs/api/en/extras/curves/QuadraticBezierCurve3.html

@@ -21,19 +21,19 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var curve = new THREE.QuadraticBezierCurve3(
+		const curve = new THREE.QuadraticBezierCurve3(
 			new THREE.Vector3( -10, 0, 0 ),
 			new THREE.Vector3( 20, 15, 0 ),
 			new THREE.Vector3( 10, 0, 0 )
 		);
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 		// Create the final object to add to the scene
-		var curveObject = new THREE.Line( geometry, material );
+		const curveObject = new THREE.Line( geometry, material );
 		</code>
 
 		<h2>Constructor</h2>

docs/api/en/extras/curves/SplineCurve.html

@@ -21,7 +21,7 @@
 
 		<code>
 		// Create a sine-like wave
-		var curve = new THREE.SplineCurve( [
+		const curve = new THREE.SplineCurve( [
 			new THREE.Vector2( -10, 0 ),
 			new THREE.Vector2( -5, 5 ),
 			new THREE.Vector2( 0, 0 ),
@@ -29,13 +29,13 @@
 			new THREE.Vector2( 10, 0 )
 		] );
 
-		var points = curve.getPoints( 50 );
-		var geometry = new THREE.BufferGeometry().setFromPoints( points );
+		const points = curve.getPoints( 50 );
+		const geometry = new THREE.BufferGeometry().setFromPoints( points );
 
-		var material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
+		const material = new THREE.LineBasicMaterial( { color : 0xff0000 } );
 
 		// Create the final object to add to the scene
-		var splineObject = new THREE.Line( geometry, material );
+		const splineObject = new THREE.Line( geometry, material );
 		</code>
 
 		<h2>Constructor</h2>

docs/api/en/geometries/BoxBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );
-		var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
-		var cube = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.BoxBufferGeometry( 1, 1, 1 );
+		const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
+		const cube = new THREE.Mesh( geometry, material );
 		scene.add( cube );
 		</code>
 

docs/api/en/geometries/BoxGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.BoxGeometry( 1, 1, 1 );
-		var material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
-		var cube = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.BoxGeometry( 1, 1, 1 );
+		const material = new THREE.MeshBasicMaterial( {color: 0x00ff00} );
+		const cube = new THREE.Mesh( geometry, material );
 		scene.add( cube );
 		</code>
 

docs/api/en/geometries/CircleBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,9 +35,9 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var geometry = new THREE.CircleBufferGeometry( 5, 32 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var circle = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.CircleBufferGeometry( 5, 32 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const circle = new THREE.Mesh( geometry, material );
 		scene.add( circle );
 		</code>
 

docs/api/en/geometries/CircleGeometry.html

@@ -23,7 +23,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -36,9 +36,9 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var geometry = new THREE.CircleGeometry( 5, 32 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var circle = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.CircleGeometry( 5, 32 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const circle = new THREE.Mesh( geometry, material );
 		scene.add( circle );
 		</code>
 

docs/api/en/geometries/ConeBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.ConeBufferGeometry( 5, 20, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
-		var cone = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.ConeBufferGeometry( 5, 20, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+		const cone = new THREE.Mesh( geometry, material );
 		scene.add( cone );
 		</code>
 

docs/api/en/geometries/ConeGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.ConeGeometry( 5, 20, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
-		var cone = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.ConeGeometry( 5, 20, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+		const cone = new THREE.Mesh( geometry, material );
 		scene.add( cone );
 		</code>
 

docs/api/en/geometries/CylinderBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.CylinderBufferGeometry( 5, 5, 20, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
-		var cylinder = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.CylinderBufferGeometry( 5, 5, 20, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+		const cylinder = new THREE.Mesh( geometry, material );
 		scene.add( cylinder );
 		</code>
 

docs/api/en/geometries/CylinderGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.CylinderGeometry( 5, 5, 20, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
-		var cylinder = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.CylinderGeometry( 5, 5, 20, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+		const cylinder = new THREE.Mesh( geometry, material );
 		scene.add( cylinder );
 		</code>
 

docs/api/en/geometries/DodecahedronBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/DodecahedronGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/EdgesGeometry.html

@@ -17,9 +17,9 @@
 		<h2>Code Example</h2>
 
 		<code>
-var geometry = new THREE.BoxBufferGeometry( 100, 100, 100 );
-var edges = new THREE.EdgesGeometry( geometry );
-var line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { color: 0xffffff } ) );
+const geometry = new THREE.BoxBufferGeometry( 100, 100, 100 );
+const edges = new THREE.EdgesGeometry( geometry );
+const line = new THREE.LineSegments( edges, new THREE.LineBasicMaterial( { color: 0xffffff } ) );
 scene.add( line );
 		</code>
 

docs/api/en/geometries/ExtrudeBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -36,16 +36,16 @@
 
 
 		<code>
-		var length = 12, width = 8;
+		const length = 12, width = 8;
 
-		var shape = new THREE.Shape();
+		const shape = new THREE.Shape();
 		shape.moveTo( 0,0 );
 		shape.lineTo( 0, width );
 		shape.lineTo( length, width );
 		shape.lineTo( length, 0 );
 		shape.lineTo( 0, 0 );
 
-		var extrudeSettings = {
+		const extrudeSettings = {
 			steps: 2,
 			depth: 16,
 			bevelEnabled: true,
@@ -55,9 +55,9 @@
 			bevelSegments: 1
 		};
 
-		var geometry = new THREE.ExtrudeBufferGeometry( shape, extrudeSettings );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var mesh = new THREE.Mesh( geometry, material ) ;
+		const geometry = new THREE.ExtrudeBufferGeometry( shape, extrudeSettings );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const mesh = new THREE.Mesh( geometry, material ) ;
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/ExtrudeGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -36,16 +36,16 @@
 
 
 		<code>
-		var length = 12, width = 8;
+		const length = 12, width = 8;
 
-		var shape = new THREE.Shape();
+		const shape = new THREE.Shape();
 		shape.moveTo( 0,0 );
 		shape.lineTo( 0, width );
 		shape.lineTo( length, width );
 		shape.lineTo( length, 0 );
 		shape.lineTo( 0, 0 );
 
-		var extrudeSettings = {
+		const extrudeSettings = {
 			steps: 2,
 			depth: 16,
 			bevelEnabled: true,
@@ -55,9 +55,9 @@
 			bevelSegments: 1
 		};
 
-		var geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var mesh = new THREE.Mesh( geometry, material ) ;
+		const geometry = new THREE.ExtrudeGeometry( shape, extrudeSettings );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const mesh = new THREE.Mesh( geometry, material ) ;
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/IcosahedronBufferGeometry.html

@@ -21,7 +21,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/IcosahedronGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/LatheBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,13 +35,13 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var points = [];
-		for ( var i = 0; i < 10; i ++ ) {
+		const points = [];
+		for ( let i = 0; i < 10; i ++ ) {
 			points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 10 + 5, ( i - 5 ) * 2 ) );
 		}
-		var geometry = new THREE.LatheBufferGeometry( points );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var lathe = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.LatheBufferGeometry( points );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const lathe = new THREE.Mesh( geometry, material );
 		scene.add( lathe );
 		</code>
 

docs/api/en/geometries/LatheGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,13 +35,13 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var points = [];
-		for ( var i = 0; i < 10; i ++ ) {
+		const points = [];
+		for ( let i = 0; i < 10; i ++ ) {
 			points.push( new THREE.Vector2( Math.sin( i * 0.2 ) * 10 + 5, ( i - 5 ) * 2 ) );
 		}
-		var geometry = new THREE.LatheGeometry( points );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var lathe = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.LatheGeometry( points );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const lathe = new THREE.Mesh( geometry, material );
 		scene.add( lathe );
 		</code>
 

docs/api/en/geometries/OctahedronBufferGeometry.html

@@ -21,7 +21,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/OctahedronGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/ParametricBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,9 +35,9 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var geometry = new THREE.ParametricBufferGeometry( THREE.ParametricGeometries.klein, 25, 25 );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var klein = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.ParametricBufferGeometry( THREE.ParametricGeometries.klein, 25, 25 );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const klein = new THREE.Mesh( geometry, material );
 		scene.add( klein );
 		</code>
 

docs/api/en/geometries/ParametricGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,9 +35,9 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var geometry = new THREE.ParametricGeometry( THREE.ParametricGeometries.klein, 25, 25 );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var klein = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.ParametricGeometry( THREE.ParametricGeometries.klein, 25, 25 );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const klein = new THREE.Mesh( geometry, material );
 		scene.add( klein );
 		</code>
 

docs/api/en/geometries/PlaneBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.PlaneBufferGeometry( 5, 20, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
-		var plane = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.PlaneBufferGeometry( 5, 20, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
+		const plane = new THREE.Mesh( geometry, material );
 		scene.add( plane );
 		</code>
 

docs/api/en/geometries/PlaneGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.PlaneGeometry( 5, 20, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
-		var plane = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.PlaneGeometry( 5, 20, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00, side: THREE.DoubleSide} );
+		const plane = new THREE.Mesh( geometry, material );
 		scene.add( plane );
 		</code>
 

docs/api/en/geometries/PolyhedronBufferGeometry.html

@@ -21,12 +21,12 @@
 
 		<h2>Code Example</h2>
 <code>
-var verticesOfCube = [
+const verticesOfCube = [
     -1,-1,-1,    1,-1,-1,    1, 1,-1,    -1, 1,-1,
     -1,-1, 1,    1,-1, 1,    1, 1, 1,    -1, 1, 1,
 ];
 
-var indicesOfFaces = [
+const indicesOfFaces = [
     2,1,0,    0,3,2,
     0,4,7,    7,3,0,
     0,1,5,    5,4,0,
@@ -35,7 +35,7 @@ var indicesOfFaces = [
     4,5,6,    6,7,4
 ];
 
-var geometry = new THREE.PolyhedronBufferGeometry( verticesOfCube, indicesOfFaces, 6, 2 );
+const geometry = new THREE.PolyhedronBufferGeometry( verticesOfCube, indicesOfFaces, 6, 2 );
 </code>
 
 		<h2>Constructor</h2>

docs/api/en/geometries/PolyhedronGeometry.html

@@ -19,12 +19,12 @@
 
 		<h2>Code Example</h2>
 <code>
-var verticesOfCube = [
+const verticesOfCube = [
     -1,-1,-1,    1,-1,-1,    1, 1,-1,    -1, 1,-1,
     -1,-1, 1,    1,-1, 1,    1, 1, 1,    -1, 1, 1,
 ];
 
-var indicesOfFaces = [
+const indicesOfFaces = [
     2,1,0,    0,3,2,
     0,4,7,    7,3,0,
     0,1,5,    5,4,0,
@@ -33,7 +33,7 @@ var indicesOfFaces = [
     4,5,6,    6,7,4
 ];
 
-var geometry = new THREE.PolyhedronGeometry( verticesOfCube, indicesOfFaces, 6, 2 );
+const geometry = new THREE.PolyhedronGeometry( verticesOfCube, indicesOfFaces, 6, 2 );
 </code>
 
 		<h2>Constructor</h2>

docs/api/en/geometries/RingBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.RingBufferGeometry( 1, 5, 32 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
-		var mesh = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.RingBufferGeometry( 1, 5, 32 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
+		const mesh = new THREE.Mesh( geometry, material );
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/RingGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.RingGeometry( 1, 5, 32 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
-		var mesh = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.RingGeometry( 1, 5, 32 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00, side: THREE.DoubleSide } );
+		const mesh = new THREE.Mesh( geometry, material );
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/ShapeBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -37,9 +37,9 @@
 
 
 		<code>
-		var x = 0, y = 0;
+		const x = 0, y = 0;
 
-		var heartShape = new THREE.Shape();
+		const heartShape = new THREE.Shape();
 
 		heartShape.moveTo( x + 5, y + 5 );
 		heartShape.bezierCurveTo( x + 5, y + 5, x + 4, y, x, y );
@@ -49,9 +49,9 @@
 		heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y );
 		heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 );
 
-		var geometry = new THREE.ShapeBufferGeometry( heartShape );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var mesh = new THREE.Mesh( geometry, material ) ;
+		const geometry = new THREE.ShapeBufferGeometry( heartShape );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const mesh = new THREE.Mesh( geometry, material ) ;
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/ShapeGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -37,9 +37,9 @@
 
 
 		<code>
-		var x = 0, y = 0;
+		const x = 0, y = 0;
 
-		var heartShape = new THREE.Shape();
+		const heartShape = new THREE.Shape();
 
 		heartShape.moveTo( x + 5, y + 5 );
 		heartShape.bezierCurveTo( x + 5, y + 5, x + 4, y, x, y );
@@ -49,9 +49,9 @@
 		heartShape.bezierCurveTo( x + 16, y + 7, x + 16, y, x + 10, y );
 		heartShape.bezierCurveTo( x + 7, y, x + 5, y + 5, x + 5, y + 5 );
 
-		var geometry = new THREE.ShapeGeometry( heartShape );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var mesh = new THREE.Mesh( geometry, material ) ;
+		const geometry = new THREE.ShapeGeometry( heartShape );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const mesh = new THREE.Mesh( geometry, material ) ;
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/SphereBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
-		var sphere = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+		const sphere = new THREE.Mesh( geometry, material );
 		scene.add( sphere );
 		</code>
 

docs/api/en/geometries/SphereGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.SphereGeometry( 5, 32, 32 );
-		var material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
-		var sphere = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.SphereGeometry( 5, 32, 32 );
+		const material = new THREE.MeshBasicMaterial( {color: 0xffff00} );
+		const sphere = new THREE.Mesh( geometry, material );
 		scene.add( sphere );
 		</code>
 

docs/api/en/geometries/TetrahedronBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/TetrahedronGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;

docs/api/en/geometries/TextBufferGeometry.html

@@ -26,7 +26,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -39,11 +39,11 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var loader = new THREE.FontLoader();
+		const loader = new THREE.FontLoader();
 
 		loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
 
-			var geometry = new THREE.TextBufferGeometry( 'Hello three.js!', {
+			const geometry = new THREE.TextBufferGeometry( 'Hello three.js!', {
 				font: font,
 				size: 80,
 				height: 5,

docs/api/en/geometries/TextGeometry.html

@@ -26,7 +26,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -39,11 +39,11 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var loader = new THREE.FontLoader();
+		const loader = new THREE.FontLoader();
 
 		loader.load( 'fonts/helvetiker_regular.typeface.json', function ( font ) {
 
-			var geometry = new THREE.TextGeometry( 'Hello three.js!', {
+			const geometry = new THREE.TextGeometry( 'Hello three.js!', {
 				font: font,
 				size: 80,
 				height: 5,

docs/api/en/geometries/TorusBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.TorusBufferGeometry( 10, 3, 16, 100 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var torus = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.TorusBufferGeometry( 10, 3, 16, 100 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const torus = new THREE.Mesh( geometry, material );
 		scene.add( torus );
 		</code>
 

docs/api/en/geometries/TorusGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.TorusGeometry( 10, 3, 16, 100 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var torus = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.TorusGeometry( 10, 3, 16, 100 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const torus = new THREE.Mesh( geometry, material );
 		scene.add( torus );
 		</code>
 

docs/api/en/geometries/TorusKnotBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.TorusKnotBufferGeometry( 10, 3, 100, 16 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var torusKnot = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.TorusKnotBufferGeometry( 10, 3, 100, 16 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const torusKnot = new THREE.Mesh( geometry, material );
 		scene.add( torusKnot );
 		</code>
 

docs/api/en/geometries/TorusKnotGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -34,9 +34,9 @@
 
 		<h2>Code Example</h2>
 
-		<code>var geometry = new THREE.TorusKnotGeometry( 10, 3, 100, 16 );
-		var material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
-		var torusKnot = new THREE.Mesh( geometry, material );
+		<code>const geometry = new THREE.TorusKnotGeometry( 10, 3, 100, 16 );
+		const material = new THREE.MeshBasicMaterial( { color: 0xffff00 } );
+		const torusKnot = new THREE.Mesh( geometry, material );
 		scene.add( torusKnot );
 		</code>
 

docs/api/en/geometries/TubeBufferGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,31 +35,32 @@
 		<h2>Code Example</h2>
 
 		<code>
-		function CustomSinCurve( scale ) {
+		class CustomSinCurve extends THREE.Curve {
 
-			THREE.Curve.call( this );
+			constructor( scale = 1 ) {
 
-			this.scale = ( scale === undefined ) ? 1 : scale;
+				super();
 
-		}
+				this.scale = scale;
+
+			}
 
-		CustomSinCurve.prototype = Object.create( THREE.Curve.prototype );
-		CustomSinCurve.prototype.constructor = CustomSinCurve;
+			getPoint( t, optionalTarget = new THREE.Vector3() ) {
 
-		CustomSinCurve.prototype.getPoint = function ( t ) {
+				const tx = t * 3 - 1.5;
+				const ty = Math.sin( 2 * Math.PI * t );
+				const tz = 0;
 
-			var tx = t * 3 - 1.5;
-			var ty = Math.sin( 2 * Math.PI * t );
-			var tz = 0;
+				return optionalTarget.set( tx, ty, tz ).multiplyScalar( this.scale );
 
-			return new THREE.Vector3( tx, ty, tz ).multiplyScalar( this.scale );
+			}
 
-		};
+		}
 
-		var path = new CustomSinCurve( 10 );
-		var geometry = new THREE.TubeBufferGeometry( path, 20, 2, 8, false );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var mesh = new THREE.Mesh( geometry, material );
+		const path = new CustomSinCurve( 10 );
+		const geometry = new THREE.TubeBufferGeometry( path, 20, 2, 8, false );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const mesh = new THREE.Mesh( geometry, material );
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/TubeGeometry.html

@@ -22,7 +22,7 @@
 
 		if ( /(iPad|iPhone|iPod)/g.test( navigator.userAgent ) ) {
 
-			var scene = document.getElementById( 'scene' );
+			const scene = document.getElementById( 'scene' );
 
 			scene.style.width = getComputedStyle( scene ).width;
 			scene.style.height = getComputedStyle( scene ).height;
@@ -35,31 +35,32 @@
 		<h2>Code Example</h2>
 
 		<code>
-		function CustomSinCurve( scale ) {
+		class CustomSinCurve extends THREE.Curve {
 
-			THREE.Curve.call( this );
+			constructor( scale = 1 ) {
 
-			this.scale = ( scale === undefined ) ? 1 : scale;
+				super();
 
-		}
+				this.scale = scale;
+
+			}
 
-		CustomSinCurve.prototype = Object.create( THREE.Curve.prototype );
-		CustomSinCurve.prototype.constructor = CustomSinCurve;
+			getPoint( t, optionalTarget = new THREE.Vector3() ) {
 
-		CustomSinCurve.prototype.getPoint = function ( t ) {
+				const tx = t * 3 - 1.5;
+				const ty = Math.sin( 2 * Math.PI * t );
+				const tz = 0;
 
-			var tx = t * 3 - 1.5;
-			var ty = Math.sin( 2 * Math.PI * t );
-			var tz = 0;
+				return optionalTarget.set( tx, ty, tz ).multiplyScalar( this.scale );
 
-			return new THREE.Vector3( tx, ty, tz ).multiplyScalar( this.scale );
+			}
 
-		};
+		}
 
-		var path = new CustomSinCurve( 10 );
-		var geometry = new THREE.TubeGeometry( path, 20, 2, 8, false );
-		var material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
-		var mesh = new THREE.Mesh( geometry, material );
+		const path = new CustomSinCurve( 10 );
+		const geometry = new THREE.TubeGeometry( path, 20, 2, 8, false );
+		const material = new THREE.MeshBasicMaterial( { color: 0x00ff00 } );
+		const mesh = new THREE.Mesh( geometry, material );
 		scene.add( mesh );
 		</code>
 

docs/api/en/geometries/WireframeGeometry.html

@@ -17,11 +17,11 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var geometry = new THREE.SphereBufferGeometry( 100, 100, 100 );
+		const geometry = new THREE.SphereBufferGeometry( 100, 100, 100 );
 
-		var wireframe = new THREE.WireframeGeometry( geometry );
+		const wireframe = new THREE.WireframeGeometry( geometry );
 
-		var line = new THREE.LineSegments( wireframe );
+		const line = new THREE.LineSegments( wireframe );
 		line.material.depthTest = false;
 		line.material.opacity = 0.25;
 		line.material.transparent = true;

docs/api/en/helpers/ArrowHelper.html

@@ -17,16 +17,16 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var dir = new THREE.Vector3( 1, 2, 0 );
+		const dir = new THREE.Vector3( 1, 2, 0 );
 
 		//normalize the direction vector (convert to vector of length 1)
 		dir.normalize();
 
-		var origin = new THREE.Vector3( 0, 0, 0 );
-		var length = 1;
-		var hex = 0xffff00;
+		const origin = new THREE.Vector3( 0, 0, 0 );
+		const length = 1;
+		const hex = 0xffff00;
 
-		var arrowHelper = new THREE.ArrowHelper( dir, origin, length, hex );
+		const arrowHelper = new THREE.ArrowHelper( dir, origin, length, hex );
 		scene.add( arrowHelper );
 		</code>
 

docs/api/en/helpers/AxesHelper.html

@@ -19,7 +19,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-var axesHelper = new THREE.AxesHelper( 5 );
+const axesHelper = new THREE.AxesHelper( 5 );
 scene.add( axesHelper );
 		</code>
 

docs/api/en/helpers/Box3Helper.html

@@ -20,10 +20,10 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var box = new THREE.Box3();
+		const box = new THREE.Box3();
 		box.setFromCenterAndSize( new THREE.Vector3( 1, 1, 1 ), new THREE.Vector3( 2, 1, 3 ) );
 
-		var helper = new THREE.Box3Helper( box, 0xffff00 );
+		const helper = new THREE.Box3Helper( box, 0xffff00 );
 		scene.add( helper );
 		</code>
 

docs/api/en/helpers/BoxHelper.html

@@ -22,9 +22,9 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var sphere = new THREE.SphereBufferGeometry();
-		var object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) );
-		var box = new THREE.BoxHelper( object, 0xffff00 );
+		const sphere = new THREE.SphereBufferGeometry();
+		const object = new THREE.Mesh( sphere, new THREE.MeshBasicMaterial( 0xff0000 ) );
+		const box = new THREE.BoxHelper( object, 0xffff00 );
 		scene.add( box );
 		</code>
 

docs/api/en/helpers/CameraHelper.html

@@ -19,8 +19,8 @@
 
 		<h2>Code Example</h2>
 		<code>
-var camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
-var helper = new THREE.CameraHelper( camera );
+const camera = new THREE.PerspectiveCamera( 75, window.innerWidth / window.innerHeight, 0.1, 1000 );
+const helper = new THREE.CameraHelper( camera );
 scene.add( helper );
 		</code>
 

docs/api/en/helpers/DirectionalLightHelper.html

@@ -21,8 +21,8 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var light = new THREE.DirectionalLight( 0xFFFFFF );
-		var helper = new THREE.DirectionalLightHelper( light, 5 );
+		const light = new THREE.DirectionalLight( 0xFFFFFF );
+		const helper = new THREE.DirectionalLightHelper( light, 5 );
 		scene.add( helper );
 		</code>
 

docs/api/en/helpers/GridHelper.html

@@ -16,10 +16,10 @@
 
 		<h2>Code Example</h2>
 
-		<code>var size = 10;
-		var divisions = 10;
+		<code>const size = 10;
+		const divisions = 10;
 
-		var gridHelper = new THREE.GridHelper( size, divisions );
+		const gridHelper = new THREE.GridHelper( size, divisions );
 		scene.add( gridHelper );
 		</code>
 

docs/api/en/helpers/HemisphereLightHelper.html

@@ -19,8 +19,8 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
-		var helper = new THREE.HemisphereLightHelper( light, 5 );
+		const light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
+		const helper = new THREE.HemisphereLightHelper( light, 5 );
 		scene.add( helper );
 		</code>
 

docs/api/en/helpers/PlaneHelper.html

@@ -20,8 +20,8 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var plane = new THREE.Plane( new THREE.Vector3( 1, 1, 0.2 ), 3 );
-		var helper = new THREE.PlaneHelper( plane, 1, 0xffff00 );
+		const plane = new THREE.Plane( new THREE.Vector3( 1, 1, 0.2 ), 3 );
+		const helper = new THREE.PlaneHelper( plane, 1, 0xffff00 );
 		scene.add( helper );
 		</code>
 

docs/api/en/helpers/PointLightHelper.html

@@ -20,12 +20,12 @@
 		 <h2>Code Example</h2>
 
 		<code>
-		var pointLight = new THREE.PointLight( 0xff0000, 1, 100 );
+		const pointLight = new THREE.PointLight( 0xff0000, 1, 100 );
 		pointLight.position.set( 10, 10, 10 );
 		scene.add( pointLight );
 
-		var sphereSize = 1;
-		var pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
+		const sphereSize = 1;
+		const pointLightHelper = new THREE.PointLightHelper( pointLight, sphereSize );
 		scene.add( pointLightHelper );
 		</code>
 

docs/api/en/helpers/PolarGridHelper.html

@@ -17,12 +17,12 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var radius = 10;
-		var radials = 16;
-		var circles = 8;
-		var divisions = 64;
+		const radius = 10;
+		const radials = 16;
+		const circles = 8;
+		const divisions = 64;
 
-		var helper = new THREE.PolarGridHelper( radius, radials, circles, divisions );
+		const helper = new THREE.PolarGridHelper( radius, radials, circles, divisions );
 		scene.add( helper );
 		</code>
 

docs/api/en/helpers/SkeletonHelper.html

@@ -20,7 +20,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var helper = new THREE.SkeletonHelper( skinnedMesh );
+		const helper = new THREE.SkeletonHelper( skinnedMesh );
 		scene.add( helper );
 		</code>
 

docs/api/en/helpers/SpotLightHelper.html

@@ -16,11 +16,11 @@
 
 		<h2>Code Example</h2>
 		<code>
-		var spotLight = new THREE.SpotLight( 0xffffff );
+		const spotLight = new THREE.SpotLight( 0xffffff );
 		spotLight.position.set( 10, 10, 10 );
 		scene.add( spotLight );
 
-		var spotLightHelper = new THREE.SpotLightHelper( spotLight );
+		const spotLightHelper = new THREE.SpotLightHelper( spotLight );
 		scene.add( spotLightHelper );
 		</code>
 

docs/api/en/lights/AmbientLight.html

@@ -21,7 +21,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var light = new THREE.AmbientLight( 0x404040 ); // soft white light
+		const light = new THREE.AmbientLight( 0x404040 ); // soft white light
 		scene.add( light );
 		</code>
 

docs/api/en/lights/DirectionalLight.html

@@ -41,7 +41,7 @@
 
 		<code>
 		// White directional light at half intensity shining from the top.
-		var directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
+		const directionalLight = new THREE.DirectionalLight( 0xffffff, 0.5 );
 		scene.add( directionalLight );
 		</code>
 
@@ -105,7 +105,7 @@
 			[page:Object3D.position position] property), like so:
 		</p>
 		<code>
-		var targetObject = new THREE.Object3D();
+		const targetObject = new THREE.Object3D();
 		scene.add(targetObject);
 
 		light.target = targetObject;

docs/api/en/lights/HemisphereLight.html

@@ -22,7 +22,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
+		const light = new THREE.HemisphereLight( 0xffffbb, 0x080820, 1 );
 		scene.add( light );
 		</code>
 

docs/api/en/lights/PointLight.html

@@ -22,7 +22,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-var light = new THREE.PointLight( 0xff0000, 1, 100 );
+const light = new THREE.PointLight( 0xff0000, 1, 100 );
 light.position.set( 50, 50, 50 );
 scene.add( light );
 		</code>

docs/api/en/lights/RectAreaLight.html

@@ -27,17 +27,16 @@
 		<h2>Code Example</h2>
 
 		<code>
-var width = 10;
-var height = 10;
-var intensity = 1;
-var rectLight = new THREE.RectAreaLight( 0xffffff, intensity,  width, height );
+const width = 10;
+const height = 10;
+const intensity = 1;
+const rectLight = new THREE.RectAreaLight( 0xffffff, intensity,  width, height );
 rectLight.position.set( 5, 5, 0 );
 rectLight.lookAt( 0, 0, 0 );
 scene.add( rectLight )
 
-rectLightHelper = new THREE.RectAreaLightHelper( rectLight );
+const rectLightHelper = new THREE.RectAreaLightHelper( rectLight );
 rectLight.add( rectLightHelper );
-
 		</code>
 
 		<h2>Examples</h2>

docs/api/en/lights/SpotLight.html

@@ -23,7 +23,7 @@
 		<code>
 		// white spotlight shining from the side, casting a shadow
 
-		var spotLight = new THREE.SpotLight( 0xffffff );
+		const spotLight = new THREE.SpotLight( 0xffffff );
 		spotLight.position.set( 100, 1000, 100 );
 
 		spotLight.castShadow = true;
@@ -151,7 +151,7 @@
 			It is also possible to set the target to be another object in the scene (anything with a
 			[page:Object3D.position position] property), like so:
 			<code>
-var targetObject = new THREE.Object3D();
+const targetObject = new THREE.Object3D();
 scene.add(targetObject);
 
 light.target = targetObject;

docs/api/en/lights/shadows/DirectionalLightShadow.html

@@ -24,39 +24,39 @@
 
 		<code>
 		//Create a WebGLRenderer and turn on shadows in the renderer
-		var renderer = new THREE.WebGLRenderer();
+		const renderer = new THREE.WebGLRenderer();
 		renderer.shadowMap.enabled = true;
 		renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
 
 		//Create a DirectionalLight and turn on shadows for the light
-		var light = new THREE.DirectionalLight( 0xffffff, 1, 100 );
-		light.position.set( 0, 1, 0 ); 			//default; light shining from top
-		light.castShadow = true;            // default false
+		const light = new THREE.DirectionalLight( 0xffffff, 1, 100 );
+		light.position.set( 0, 1, 0 ); //default; light shining from top
+		light.castShadow = true; // default false
 		scene.add( light );
 
 		//Set up shadow properties for the light
-		light.shadow.mapSize.width = 512;  // default
+		light.shadow.mapSize.width = 512; // default
 		light.shadow.mapSize.height = 512; // default
-		light.shadow.camera.near = 0.5;    // default
-		light.shadow.camera.far = 500;     // default
+		light.shadow.camera.near = 0.5; // default
+		light.shadow.camera.far = 500; // default
 
 		//Create a sphere that cast shadows (but does not receive them)
-		var sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
-		var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
-		var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
+		const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
+		const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
+		const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
 		sphere.castShadow = true; //default is false
 		sphere.receiveShadow = false; //default
 		scene.add( sphere );
 
 		//Create a plane that receives shadows (but does not cast them)
-		var planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
-		var planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
-		var plane = new THREE.Mesh( planeGeometry, planeMaterial );
+		const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
+		const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
+		const plane = new THREE.Mesh( planeGeometry, planeMaterial );
 		plane.receiveShadow = true;
 		scene.add( plane );
 
 		//Create a helper for the shadow camera (optional)
-		var helper = new THREE.CameraHelper( light.shadow.camera );
+		const helper = new THREE.CameraHelper( light.shadow.camera );
 		scene.add( helper );
 		</code>
 

docs/api/en/lights/shadows/PointLightShadow.html

@@ -19,39 +19,39 @@
 		<h2>Code Example</h2>
 		<code>
 		//Create a WebGLRenderer and turn on shadows in the renderer
-		var renderer = new THREE.WebGLRenderer();
+		const renderer = new THREE.WebGLRenderer();
 		renderer.shadowMap.enabled = true;
 		renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
 
 		//Create a PointLight and turn on shadows for the light
-		var light = new THREE.PointLight( 0xffffff, 1, 100 );
+		const light = new THREE.PointLight( 0xffffff, 1, 100 );
 		light.position.set( 0, 10, 0 );
-		light.castShadow = true;            // default false
+		light.castShadow = true; // default false
 		scene.add( light );
 
 		//Set up shadow properties for the light
-		light.shadow.mapSize.width = 512;  // default
+		light.shadow.mapSize.width = 512; // default
 		light.shadow.mapSize.height = 512; // default
-		light.shadow.camera.near = 0.5;       // default
-		light.shadow.camera.far = 500      // default
+		light.shadow.camera.near = 0.5; // default
+		light.shadow.camera.far = 500; // default
 
 		//Create a sphere that cast shadows (but does not receive them)
-		var sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
-		var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
-		var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
+		const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
+		const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
+		const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
 		sphere.castShadow = true; //default is false
 		sphere.receiveShadow = false; //default
 		scene.add( sphere );
 
 		//Create a plane that receives shadows (but does not cast them)
-		var planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
-		var planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
-		var plane = new THREE.Mesh( planeGeometry, planeMaterial );
+		const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
+		const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
+		const plane = new THREE.Mesh( planeGeometry, planeMaterial );
 		plane.receiveShadow = true;
 		scene.add( plane );
 
 		//Create a helper for the shadow camera (optional)
-		var helper = new THREE.CameraHelper( light.shadow.camera );
+		const helper = new THREE.CameraHelper( light.shadow.camera );
 		scene.add( helper );
 		</code>
 

docs/api/en/lights/shadows/SpotLightShadow.html

@@ -19,39 +19,39 @@
 		<h2>Code Example</h2>
 		<code>
 		//Create a WebGLRenderer and turn on shadows in the renderer
-		var renderer = new THREE.WebGLRenderer();
+		const renderer = new THREE.WebGLRenderer();
 		renderer.shadowMap.enabled = true;
 		renderer.shadowMap.type = THREE.PCFSoftShadowMap; // default THREE.PCFShadowMap
 
 		//Create a SpotLight and turn on shadows for the light
-		var light = new THREE.SpotLight( 0xffffff );
-		light.castShadow = true;            // default false
+		const light = new THREE.SpotLight( 0xffffff );
+		light.castShadow = true; // default false
 		scene.add( light );
 
 		//Set up shadow properties for the light
-		light.shadow.mapSize.width = 512;  // default
+		light.shadow.mapSize.width = 512; // default
 		light.shadow.mapSize.height = 512; // default
-		light.shadow.camera.near = 0.5;    // default
-		light.shadow.camera.far = 500      // default
-		light.shadow.focus = 1;            // default
+		light.shadow.camera.near = 0.5; // default
+		light.shadow.camera.far = 500; // default
+		light.shadow.focus = 1; // default
 
 		//Create a sphere that cast shadows (but does not receive them)
-		var sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
-		var sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
-		var sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
+		const sphereGeometry = new THREE.SphereBufferGeometry( 5, 32, 32 );
+		const sphereMaterial = new THREE.MeshStandardMaterial( { color: 0xff0000 } );
+		const sphere = new THREE.Mesh( sphereGeometry, sphereMaterial );
 		sphere.castShadow = true; //default is false
 		sphere.receiveShadow = false; //default
 		scene.add( sphere );
 
 		//Create a plane that receives shadows (but does not cast them)
-		var planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
-		var planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
-		var plane = new THREE.Mesh( planeGeometry, planeMaterial );
+		const planeGeometry = new THREE.PlaneBufferGeometry( 20, 20, 32, 32 );
+		const planeMaterial = new THREE.MeshStandardMaterial( { color: 0x00ff00 } )
+		const plane = new THREE.Mesh( planeGeometry, planeMaterial );
 		plane.receiveShadow = true;
 		scene.add( plane );
 
 		//Create a helper for the shadow camera (optional)
-		var helper = new THREE.CameraHelper( light.shadow.camera );
+		const helper = new THREE.CameraHelper( light.shadow.camera );
 		scene.add( helper );
 		</code>
 

docs/api/en/loaders/AnimationLoader.html

@@ -21,7 +21,7 @@
 
 		<code>
 		// instantiate a loader
-		var loader = new THREE.AnimationLoader();
+		const loader = new THREE.AnimationLoader();
 
 		// load a resource
 		loader.load(

docs/api/en/loaders/AudioLoader.html

@@ -22,19 +22,19 @@
 
 		<code>
 		// instantiate a listener
-		var audioListener = new THREE.AudioListener();
+		const audioListener = new THREE.AudioListener();
 
 		// add the listener to the camera
 		camera.add( audioListener );
 
 		// instantiate audio object
-		var oceanAmbientSound = new THREE.Audio( audioListener );
+		const oceanAmbientSound = new THREE.Audio( audioListener );
 
 		// add the audio object to the scene
 		scene.add( oceanAmbientSound );
 
 		// instantiate a loader
-		var loader = new THREE.AudioLoader();
+		const loader = new THREE.AudioLoader();
 
 		// load a resource
 		loader.load(

docs/api/en/loaders/BufferGeometryLoader.html

@@ -21,7 +21,7 @@
 
 		<code>
 		// instantiate a loader
-		var loader = new THREE.BufferGeometryLoader();
+		const loader = new THREE.BufferGeometryLoader();
 
 		// load a resource
 		loader.load(
@@ -30,8 +30,8 @@
 
 			// onLoad callback
 			function ( geometry ) {
-				var material = new THREE.MeshLambertMaterial( { color: 0xF5F5F5 } );
-				var object = new THREE.Mesh( geometry, material );
+				const material = new THREE.MeshLambertMaterial( { color: 0xF5F5F5 } );
+				const object = new THREE.Mesh( geometry, material );
 				scene.add( object );
 			},
 

docs/api/en/loaders/CubeTextureLoader.html

@@ -20,7 +20,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-var scene = new THREE.Scene();
+const scene = new THREE.Scene();
 scene.background = new THREE.CubeTextureLoader()
 	.setPath( 'textures/cubeMaps/' )
 	.load( [

docs/api/en/loaders/FileLoader.html

@@ -19,7 +19,7 @@
 
 		<h2>Code Example</h2>
 		<code>
-		var loader = new THREE.FileLoader();
+		const loader = new THREE.FileLoader();
 
 		//load a text file and output the result to the console
 		loader.load(

docs/api/en/loaders/FontLoader.html

@@ -23,8 +23,8 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var loader = new THREE.FontLoader();
-		var font = loader.load(
+		const loader = new THREE.FontLoader();
+		const font = loader.load(
 			// resource URL
 			'fonts/helvetiker_bold.typeface.json',
 

docs/api/en/loaders/ImageBitmapLoader.html

@@ -29,7 +29,7 @@
 
 		<code>
 		// instantiate a loader
-		var loader = new THREE.ImageBitmapLoader();
+		const loader = new THREE.ImageBitmapLoader();
 
 		// set options if needed
 		loader.setOptions( { imageOrientation: 'flipY' } );
@@ -41,8 +41,8 @@
 
 			// onLoad callback
 			function ( imageBitmap ) {
-				var texture = new THREE.CanvasTexture( imageBitmap );
-				var material = new THREE.MeshBasicMaterial( { map: texture } );
+				const texture = new THREE.CanvasTexture( imageBitmap );
+				const material = new THREE.MeshBasicMaterial( { map: texture } );
 			},
 
 			// onProgress callback currently not supported

docs/api/en/loaders/ImageLoader.html

@@ -22,7 +22,7 @@
 
 		<code>
 		// instantiate a loader
-		var loader = new THREE.ImageLoader();
+		const loader = new THREE.ImageLoader();
 
 		// load a image resource
 		loader.load(
@@ -32,8 +32,8 @@
 			// onLoad callback
 			function ( image ) {
 				// use the image, e.g. draw part of it on a canvas
-				var canvas = document.createElement( 'canvas' );
-				var context = canvas.getContext( '2d' );
+				const canvas = document.createElement( 'canvas' );
+				const context = canvas.getContext( '2d' );
 				context.drawImage( image, 100, 100 );
 			},
 

docs/api/en/loaders/MaterialLoader.html

@@ -21,7 +21,7 @@
 
 		<code>
 		// instantiate a loader
-		var loader = new THREE.MaterialLoader();
+		const loader = new THREE.MaterialLoader();
 
 		// load a resource
 		loader.load(

docs/api/en/loaders/ObjectLoader.html

@@ -21,7 +21,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var loader = new THREE.ObjectLoader();
+		const loader = new THREE.ObjectLoader();
 
 		loader.load(
 			// resource URL
@@ -47,7 +47,7 @@
 
 
 		// Alternatively, to parse a previously loaded JSON structure
-		var object = loader.parse( a_json_object );
+		const object = loader.parse( a_json_object );
 
 		scene.add( object );
 		</code>

docs/api/en/loaders/TextureLoader.html

@@ -20,17 +20,17 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var texture = new THREE.TextureLoader().load( 'textures/land_ocean_ice_cloud_2048.jpg' );
+		const texture = new THREE.TextureLoader().load( 'textures/land_ocean_ice_cloud_2048.jpg' );
 
 		// immediately use the texture for material creation
-		var material = new THREE.MeshBasicMaterial( { map: texture } );
+		const material = new THREE.MeshBasicMaterial( { map: texture } );
 		</code>
 
 		<h2>Code Example with Callbacks</h2>
 
 		<code>
 		// instantiate a loader
-		var loader = new THREE.TextureLoader();
+		const loader = new THREE.TextureLoader();
 
 		// load a resource
 		loader.load(
@@ -40,7 +40,7 @@
 			// onLoad callback
 			function ( texture ) {
 				// in this example we create the material when the texture is loaded
-				var material = new THREE.MeshBasicMaterial( {
+				const material = new THREE.MeshBasicMaterial( {
 					map: texture
 				 } );
 			},

docs/api/en/loaders/managers/LoadingManager.html

@@ -27,7 +27,7 @@
 		</p>
 
 		<code>
-		var manager = new THREE.LoadingManager();
+		const manager = new THREE.LoadingManager();
 		manager.onStart = function ( url, itemsLoaded, itemsTotal ) {
 
 			console.log( 'Started loading file: ' + url + '.\nLoaded ' + itemsLoaded + ' of ' + itemsTotal + ' files.' );
@@ -53,7 +53,7 @@
 
 		};
 
-		var loader = new THREE.OBJLoader( manager );
+		const loader = new THREE.OBJLoader( manager );
 		loader.load( 'file.obj', function ( object ) {
 
 			//
@@ -70,12 +70,12 @@
 
 		<code>
 		// Blob or File objects created when dragging files into the webpage.
-		var blobs = {'fish.gltf': blob1, 'diffuse.png': blob2, 'normal.png': blob3};
+		const blobs = {'fish.gltf': blob1, 'diffuse.png': blob2, 'normal.png': blob3};
 
-		var manager = new THREE.LoadingManager();
+		const manager = new THREE.LoadingManager();
 
 		// Initialize loading manager with URL callback.
-		var objectURLs = [];
+		const objectURLs = [];
 		manager.setURLModifier( ( url ) => {
 
 			url = URL.createObjectURL( blobs[ url ] );
@@ -87,7 +87,7 @@
 		} );
 
 		// Load as usual, then revoke the blob URLs.
-		var loader = new THREE.GLTFLoader( manager );
+		const loader = new THREE.GLTFLoader( manager );
 		loader.load( 'fish.gltf', (gltf) => {
 
 			scene.add( gltf.scene );

docs/api/en/materials/LineBasicMaterial.html

@@ -17,7 +17,7 @@
 		<h2>Code Example</h2>
 
 		<code>
-		var material = new THREE.LineBasicMaterial( {
+		const material = new THREE.LineBasicMaterial( {
 			color: 0xffffff,
 			linewidth: 1,
 			linecap: 'round', //ignored by WebGLRenderer