Editor: More let/const usage. (#23398)

editor/js/Config.js

@@ -1,8 +1,8 @@
 function Config() {
 
-	var name = 'threejs-editor';
+	const name = 'threejs-editor';
 
-	var storage = {
+	const storage = {
 		'language': 'en',
 
 		'autosave': true,
@@ -33,9 +33,9 @@ function Config() {
 
 	} else {
 
-		var data = JSON.parse( window.localStorage[ name ] );
+		const data = JSON.parse( window.localStorage[ name ] );
 
-		for ( var key in data ) {
+		for ( const key in data ) {
 
 			storage[ key ] = data[ key ];
 
@@ -53,7 +53,7 @@ function Config() {
 
 		setKey: function () { // key, value, key, value ...
 
-			for ( var i = 0, l = arguments.length; i < l; i += 2 ) {
+			for ( let i = 0, l = arguments.length; i < l; i += 2 ) {
 
 				storage[ arguments[ i ] ] = arguments[ i + 1 ];
 

editor/js/History.js

@@ -14,7 +14,7 @@ function History( editor ) {
 
 	// signals
 
-	var scope = this;
+	const scope = this;
 
 	this.editor.signals.startPlayer.add( function () {
 
@@ -34,10 +34,10 @@ History.prototype = {
 
 	execute: function ( cmd, optionalName ) {
 
-		var lastCmd = this.undos[ this.undos.length - 1 ];
-		var timeDifference = new Date().getTime() - this.lastCmdTime.getTime();
+		const lastCmd = this.undos[ this.undos.length - 1 ];
+		const timeDifference = new Date().getTime() - this.lastCmdTime.getTime();
 
-		var isUpdatableCmd = lastCmd &&
+		const isUpdatableCmd = lastCmd &&
 			lastCmd.updatable &&
 			cmd.updatable &&
 			lastCmd.object === cmd.object &&
@@ -94,7 +94,7 @@ History.prototype = {
 
 		}
 
-		var cmd = undefined;
+		let cmd = undefined;
 
 		if ( this.undos.length > 0 ) {
 
@@ -129,7 +129,7 @@ History.prototype = {
 
 		}
 
-		var cmd = undefined;
+		let cmd = undefined;
 
 		if ( this.redos.length > 0 ) {
 
@@ -157,7 +157,7 @@ History.prototype = {
 
 	toJSON: function () {
 
-		var history = {};
+		const history = {};
 		history.undos = [];
 		history.redos = [];
 
@@ -169,7 +169,7 @@ History.prototype = {
 
 		// Append Undos to History
 
-		for ( var i = 0; i < this.undos.length; i ++ ) {
+		for ( let i = 0; i < this.undos.length; i ++ ) {
 
 			if ( this.undos[ i ].hasOwnProperty( 'json' ) ) {
 
@@ -181,7 +181,7 @@ History.prototype = {
 
 		// Append Redos to History
 
-		for ( var i = 0; i < this.redos.length; i ++ ) {
+		for ( let i = 0; i < this.redos.length; i ++ ) {
 
 			if ( this.redos[ i ].hasOwnProperty( 'json' ) ) {
 
@@ -199,10 +199,10 @@ History.prototype = {
 
 		if ( json === undefined ) return;
 
-		for ( var i = 0; i < json.undos.length; i ++ ) {
+		for ( let i = 0; i < json.undos.length; i ++ ) {
 
-			var cmdJSON = json.undos[ i ];
-			var cmd = new Commands[ cmdJSON.type ]( this.editor ); // creates a new object of type "json.type"
+			const cmdJSON = json.undos[ i ];
+			const cmd = new Commands[ cmdJSON.type ]( this.editor ); // creates a new object of type "json.type"
 			cmd.json = cmdJSON;
 			cmd.id = cmdJSON.id;
 			cmd.name = cmdJSON.name;
@@ -211,10 +211,10 @@ History.prototype = {
 
 		}
 
-		for ( var i = 0; i < json.redos.length; i ++ ) {
+		for ( let i = 0; i < json.redos.length; i ++ ) {
 
-			var cmdJSON = json.redos[ i ];
-			var cmd = new Commands[ cmdJSON.type ]( this.editor ); // creates a new object of type "json.type"
+			const cmdJSON = json.redos[ i ];
+			const cmd = new Commands[ cmdJSON.type ]( this.editor ); // creates a new object of type "json.type"
 			cmd.json = cmdJSON;
 			cmd.id = cmdJSON.id;
 			cmd.name = cmdJSON.name;
@@ -250,7 +250,7 @@ History.prototype = {
 		this.editor.signals.sceneGraphChanged.active = false;
 		this.editor.signals.historyChanged.active = false;
 
-		var cmd = this.undos.length > 0 ? this.undos[ this.undos.length - 1 ] : undefined;	// next cmd to pop
+		let cmd = this.undos.length > 0 ? this.undos[ this.undos.length - 1 ] : undefined;	// next cmd to pop
 
 		if ( cmd === undefined || id > cmd.id ) {
 
@@ -297,7 +297,7 @@ History.prototype = {
 		this.editor.signals.sceneGraphChanged.active = false;
 		this.editor.signals.historyChanged.active = false;
 
-		var cmd = this.redo();
+		let cmd = this.redo();
 		while ( cmd !== undefined ) {
 
 			if ( ! cmd.hasOwnProperty( 'json' ) ) {

editor/js/LoaderUtils.js

@@ -1,12 +1,12 @@
-var LoaderUtils = {
+const LoaderUtils = {
 
 	createFilesMap: function ( files ) {
 
-		var map = {};
+		const map = {};
 
-		for ( var i = 0; i < files.length; i ++ ) {
+		for ( let i = 0; i < files.length; i ++ ) {
 
-			var file = files[ i ];
+			const file = files[ i ];
 			map[ file.name ] = file;
 
 		}
@@ -19,11 +19,11 @@ var LoaderUtils = {
 
 		// TOFIX: setURLModifier() breaks when the file being loaded is not in root
 
-		var itemsCount = 0;
-		var itemsTotal = 0;
+		let itemsCount = 0;
+		let itemsTotal = 0;
 
-		var files = [];
-		var filesMap = {};
+		const files = [];
+		const filesMap = {};
 
 		function onEntryHandled() {
 
@@ -41,10 +41,10 @@ var LoaderUtils = {
 
 			if ( entry.isDirectory ) {
 
-				var reader = entry.createReader();
+				const reader = entry.createReader();
 				reader.readEntries( function ( entries ) {
 
-					for ( var i = 0; i < entries.length; i ++ ) {
+					for ( let i = 0; i < entries.length; i ++ ) {
 
 						handleEntry( entries[ i ] );
 
@@ -71,9 +71,9 @@ var LoaderUtils = {
 
 		}
 
-		for ( var i = 0; i < items.length; i ++ ) {
+		for ( let i = 0; i < items.length; i ++ ) {
 
-			var item = items[ i ];
+			const item = items[ i ];
 
 			if ( item.kind === 'file' ) {
 

editor/js/Menubar.Add.js

@@ -6,28 +6,28 @@ import { AddObjectCommand } from './commands/AddObjectCommand.js';
 
 function MenubarAdd( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/add' ) );
 	container.add( title );
 
-	var options = new UIPanel();
+	const options = new UIPanel();
 	options.setClass( 'options' );
 	container.add( options );
 
 	// Group
 
-	var option = new UIRow();
+	let option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/group' ) );
 	option.onClick( function () {
 
-		var mesh = new THREE.Group();
+		const mesh = new THREE.Group();
 		mesh.name = 'Group';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -41,13 +41,13 @@ function MenubarAdd( editor ) {
 
 	// Box
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/box' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.BoxGeometry( 1, 1, 1, 1, 1, 1 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.BoxGeometry( 1, 1, 1, 1, 1, 1 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Box';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -57,13 +57,13 @@ function MenubarAdd( editor ) {
 
 	// Circle
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/circle' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.CircleGeometry( 1, 8, 0, Math.PI * 2 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.CircleGeometry( 1, 8, 0, Math.PI * 2 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Circle';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -73,13 +73,13 @@ function MenubarAdd( editor ) {
 
 	// Cylinder
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/cylinder' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.CylinderGeometry( 1, 1, 1, 8, 1, false, 0, Math.PI * 2 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.CylinderGeometry( 1, 1, 1, 8, 1, false, 0, Math.PI * 2 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Cylinder';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -89,13 +89,13 @@ function MenubarAdd( editor ) {
 
 	// Dodecahedron
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/dodecahedron' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.DodecahedronGeometry( 1, 0 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.DodecahedronGeometry( 1, 0 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Dodecahedron';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -105,13 +105,13 @@ function MenubarAdd( editor ) {
 
 	// Icosahedron
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/icosahedron' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.IcosahedronGeometry( 1, 0 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.IcosahedronGeometry( 1, 0 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Icosahedron';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -121,13 +121,13 @@ function MenubarAdd( editor ) {
 
 	// Lathe
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/lathe' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.LatheGeometry();
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } ) );
+		const geometry = new THREE.LatheGeometry();
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial( { side: THREE.DoubleSide } ) );
 		mesh.name = 'Lathe';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -137,13 +137,13 @@ function MenubarAdd( editor ) {
 
 	// Octahedron
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/octahedron' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.OctahedronGeometry( 1, 0 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.OctahedronGeometry( 1, 0 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Octahedron';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -153,14 +153,14 @@ function MenubarAdd( editor ) {
 
 	// Plane
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/plane' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.PlaneGeometry( 1, 1, 1, 1 );
-		var material = new THREE.MeshStandardMaterial();
-		var mesh = new THREE.Mesh( geometry, material );
+		const geometry = new THREE.PlaneGeometry( 1, 1, 1, 1 );
+		const material = new THREE.MeshStandardMaterial();
+		const mesh = new THREE.Mesh( geometry, material );
 		mesh.name = 'Plane';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -170,13 +170,13 @@ function MenubarAdd( editor ) {
 
 	// Ring
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/ring' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.RingGeometry( 0.5, 1, 8, 1, 0, Math.PI * 2 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.RingGeometry( 0.5, 1, 8, 1, 0, Math.PI * 2 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Ring';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -186,13 +186,13 @@ function MenubarAdd( editor ) {
 
 	// Sphere
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/sphere' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.SphereGeometry( 1, 32, 16, 0, Math.PI * 2, 0, Math.PI );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.SphereGeometry( 1, 32, 16, 0, Math.PI * 2, 0, Math.PI );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Sphere';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -202,12 +202,12 @@ function MenubarAdd( editor ) {
 
 	// Sprite
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/sprite' ) );
 	option.onClick( function () {
 
-		var sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
+		const sprite = new THREE.Sprite( new THREE.SpriteMaterial() );
 		sprite.name = 'Sprite';
 
 		editor.execute( new AddObjectCommand( editor, sprite ) );
@@ -217,13 +217,13 @@ function MenubarAdd( editor ) {
 
 	// Tetrahedron
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/tetrahedron' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.TetrahedronGeometry( 1, 0 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.TetrahedronGeometry( 1, 0 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Tetrahedron';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -233,13 +233,13 @@ function MenubarAdd( editor ) {
 
 	// Torus
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/torus' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.TorusGeometry( 1, 0.4, 8, 6, Math.PI * 2 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.TorusGeometry( 1, 0.4, 8, 6, Math.PI * 2 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Torus';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -249,13 +249,13 @@ function MenubarAdd( editor ) {
 
 	// TorusKnot
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/torusknot' ) );
 	option.onClick( function () {
 
-		var geometry = new THREE.TorusKnotGeometry( 1, 0.4, 64, 8, 2, 3 );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.TorusKnotGeometry( 1, 0.4, 64, 8, 2, 3 );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'TorusKnot';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -265,20 +265,20 @@ function MenubarAdd( editor ) {
 
 	// Tube
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/tube' ) );
 	option.onClick( function () {
 
-		var path = new THREE.CatmullRomCurve3( [
+		const path = new THREE.CatmullRomCurve3( [
 			new THREE.Vector3( 2, 2, - 2 ),
 			new THREE.Vector3( 2, - 2, - 0.6666666666666667 ),
 			new THREE.Vector3( - 2, - 2, 0.6666666666666667 ),
 			new THREE.Vector3( - 2, 2, 2 )
 		] );
 
-		var geometry = new THREE.TubeGeometry( path, 64, 1, 8, false );
-		var mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
+		const geometry = new THREE.TubeGeometry( path, 64, 1, 8, false );
+		const mesh = new THREE.Mesh( geometry, new THREE.MeshStandardMaterial() );
 		mesh.name = 'Tube';
 
 		editor.execute( new AddObjectCommand( editor, mesh ) );
@@ -289,23 +289,23 @@ function MenubarAdd( editor ) {
 	/*
 	// Teapot
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( 'Teapot' );
 	option.onClick( function () {
 
-		var size = 50;
-		var segments = 10;
-		var bottom = true;
-		var lid = true;
-		var body = true;
-		var fitLid = false;
-		var blinnScale = true;
+		let size = 50;
+		let segments = 10;
+		let bottom = true;
+		let lid = true;
+		let body = true;
+		let fitLid = false;
+		let blinnScale = true;
 
-		var material = new THREE.MeshStandardMaterial();
+		let material = new THREE.MeshStandardMaterial();
 
-		var geometry = new TeapotGeometry( size, segments, bottom, lid, body, fitLid, blinnScale );
-		var mesh = new THREE.Mesh( geometry, material );
+		let geometry = new TeapotGeometry( size, segments, bottom, lid, body, fitLid, blinnScale );
+		let mesh = new THREE.Mesh( geometry, material );
 		mesh.name = 'Teapot';
 
 		editor.addObject( mesh );
@@ -321,14 +321,14 @@ function MenubarAdd( editor ) {
 
 	// AmbientLight
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/ambientlight' ) );
 	option.onClick( function () {
 
-		var color = 0x222222;
+		const color = 0x222222;
 
-		var light = new THREE.AmbientLight( color );
+		const light = new THREE.AmbientLight( color );
 		light.name = 'AmbientLight';
 
 		editor.execute( new AddObjectCommand( editor, light ) );
@@ -338,15 +338,15 @@ function MenubarAdd( editor ) {
 
 	// DirectionalLight
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/directionallight' ) );
 	option.onClick( function () {
 
-		var color = 0xffffff;
-		var intensity = 1;
+		const color = 0xffffff;
+		const intensity = 1;
 
-		var light = new THREE.DirectionalLight( color, intensity );
+		const light = new THREE.DirectionalLight( color, intensity );
 		light.name = 'DirectionalLight';
 		light.target.name = 'DirectionalLight Target';
 
@@ -359,16 +359,16 @@ function MenubarAdd( editor ) {
 
 	// HemisphereLight
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/hemispherelight' ) );
 	option.onClick( function () {
 
-		var skyColor = 0x00aaff;
-		var groundColor = 0xffaa00;
-		var intensity = 1;
+		const skyColor = 0x00aaff;
+		const groundColor = 0xffaa00;
+		const intensity = 1;
 
-		var light = new THREE.HemisphereLight( skyColor, groundColor, intensity );
+		const light = new THREE.HemisphereLight( skyColor, groundColor, intensity );
 		light.name = 'HemisphereLight';
 
 		light.position.set( 0, 10, 0 );
@@ -380,16 +380,16 @@ function MenubarAdd( editor ) {
 
 	// PointLight
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/pointlight' ) );
 	option.onClick( function () {
 
-		var color = 0xffffff;
-		var intensity = 1;
-		var distance = 0;
+		const color = 0xffffff;
+		const intensity = 1;
+		const distance = 0;
 
-		var light = new THREE.PointLight( color, intensity, distance );
+		const light = new THREE.PointLight( color, intensity, distance );
 		light.name = 'PointLight';
 
 		editor.execute( new AddObjectCommand( editor, light ) );
@@ -399,18 +399,18 @@ function MenubarAdd( editor ) {
 
 	// SpotLight
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/spotlight' ) );
 	option.onClick( function () {
 
-		var color = 0xffffff;
-		var intensity = 1;
-		var distance = 0;
-		var angle = Math.PI * 0.1;
-		var penumbra = 0;
+		const color = 0xffffff;
+		const intensity = 1;
+		const distance = 0;
+		const angle = Math.PI * 0.1;
+		const penumbra = 0;
 
-		var light = new THREE.SpotLight( color, intensity, distance, angle, penumbra );
+		const light = new THREE.SpotLight( color, intensity, distance, angle, penumbra );
 		light.name = 'SpotLight';
 		light.target.name = 'SpotLight Target';
 
@@ -427,13 +427,13 @@ function MenubarAdd( editor ) {
 
 	// OrthographicCamera
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/orthographiccamera' ) );
 	option.onClick( function () {
 
-		var aspect = editor.camera.aspect;
-		var camera = new THREE.OrthographicCamera( - aspect, aspect );
+		const aspect = editor.camera.aspect;
+		const camera = new THREE.OrthographicCamera( - aspect, aspect );
 		camera.name = 'OrthographicCamera';
 
 		editor.execute( new AddObjectCommand( editor, camera ) );
@@ -443,12 +443,12 @@ function MenubarAdd( editor ) {
 
 	// PerspectiveCamera
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/add/perspectivecamera' ) );
 	option.onClick( function () {
 
-		var camera = new THREE.PerspectiveCamera();
+		const camera = new THREE.PerspectiveCamera();
 		camera.name = 'PerspectiveCamera';
 
 		editor.execute( new AddObjectCommand( editor, camera ) );

editor/js/Menubar.Edit.js

@@ -8,23 +8,23 @@ import { SetPositionCommand } from './commands/SetPositionCommand.js';
 
 function MenubarEdit( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/edit' ) );
 	container.add( title );
 
-	var options = new UIPanel();
+	const options = new UIPanel();
 	options.setClass( 'options' );
 	container.add( options );
 
 	// Undo
 
-	var undo = new UIRow();
+	const undo = new UIRow();
 	undo.setClass( 'option' );
 	undo.setTextContent( strings.getKey( 'menubar/edit/undo' ) );
 	undo.onClick( function () {
@@ -36,7 +36,7 @@ function MenubarEdit( editor ) {
 
 	// Redo
 
-	var redo = new UIRow();
+	const redo = new UIRow();
 	redo.setClass( 'option' );
 	redo.setTextContent( strings.getKey( 'menubar/edit/redo' ) );
 	redo.onClick( function () {
@@ -48,7 +48,7 @@ function MenubarEdit( editor ) {
 
 	// Clear History
 
-	var option = new UIRow();
+	let option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/edit/clear_history' ) );
 	option.onClick( function () {
@@ -65,7 +65,7 @@ function MenubarEdit( editor ) {
 
 	editor.signals.historyChanged.add( function () {
 
-		var history = editor.history;
+		const history = editor.history;
 
 		undo.setClass( 'option' );
 		redo.setClass( 'option' );
@@ -90,12 +90,12 @@ function MenubarEdit( editor ) {
 
 	// Center
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/edit/center' ) );
 	option.onClick( function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object === null || object.parent === null ) return; // avoid centering the camera or scene
 
@@ -114,12 +114,12 @@ function MenubarEdit( editor ) {
 
 	// Clone
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/edit/clone' ) );
 	option.onClick( function () {
 
-		var object = editor.selected;
+		let object = editor.selected;
 
 		if ( object === null || object.parent === null ) return; // avoid cloning the camera or scene
 
@@ -132,12 +132,12 @@ function MenubarEdit( editor ) {
 
 	// Delete
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/edit/delete' ) );
 	option.onClick( function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object !== null && object.parent !== null ) {
 
@@ -154,7 +154,7 @@ function MenubarEdit( editor ) {
 
 	// Set textures to sRGB. See #15903
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/edit/fixcolormaps' ) );
 	option.onClick( function () {
@@ -164,17 +164,17 @@ function MenubarEdit( editor ) {
 	} );
 	options.add( option );
 
-	var colorMaps = [ 'map', 'envMap', 'emissiveMap' ];
+	const colorMaps = [ 'map', 'envMap', 'emissiveMap' ];
 
 	function fixColorMap( obj ) {
 
-		var material = obj.material;
+		const material = obj.material;
 
 		if ( material !== undefined ) {
 
 			if ( Array.isArray( material ) === true ) {
 
-				for ( var i = 0; i < material.length; i ++ ) {
+				for ( let i = 0; i < material.length; i ++ ) {
 
 					fixMaterial( material[ i ] );
 
@@ -194,11 +194,11 @@ function MenubarEdit( editor ) {
 
 	function fixMaterial( material ) {
 
-		var needsUpdate = material.needsUpdate;
+		let needsUpdate = material.needsUpdate;
 
-		for ( var i = 0; i < colorMaps.length; i ++ ) {
+		for ( let i = 0; i < colorMaps.length; i ++ ) {
 
-			var map = material[ colorMaps[ i ] ];
+			const map = material[ colorMaps[ i ] ];
 
 			if ( map ) {
 

editor/js/Menubar.Examples.js

@@ -4,23 +4,23 @@ import { UIPanel, UIRow } from './libs/ui.js';
 
 function MenubarExamples( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/examples' ) );
 	container.add( title );
 
-	var options = new UIPanel();
+	const options = new UIPanel();
 	options.setClass( 'options' );
 	container.add( options );
 
 	// Examples
 
-	var items = [
+	const items = [
 		{ title: 'menubar/examples/Arkanoid', file: 'arkanoid.app.json' },
 		{ title: 'menubar/examples/Camera', file: 'camera.app.json' },
 		{ title: 'menubar/examples/Particles', file: 'particles.app.json' },
@@ -28,15 +28,15 @@ function MenubarExamples( editor ) {
 		{ title: 'menubar/examples/Shaders', file: 'shaders.app.json' }
 	];
 
-	var loader = new THREE.FileLoader();
+	const loader = new THREE.FileLoader();
 
-	for ( var i = 0; i < items.length; i ++ ) {
+	for ( let i = 0; i < items.length; i ++ ) {
 
 		( function ( i ) {
 
-			var item = items[ i ];
+			const item = items[ i ];
 
-			var option = new UIRow();
+			const option = new UIRow();
 			option.setClass( 'option' );
 			option.setTextContent( strings.getKey( item.title ) );
 			option.onClick( function () {

editor/js/Menubar.File.js

@@ -6,24 +6,24 @@ import { UIPanel, UIRow, UIHorizontalRule } from './libs/ui.js';
 
 function MenubarFile( editor ) {
 
-	var config = editor.config;
-	var strings = editor.strings;
+	const config = editor.config;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/file' ) );
 	container.add( title );
 
-	var options = new UIPanel();
+	const options = new UIPanel();
 	options.setClass( 'options' );
 	container.add( options );
 
 	// New
 
-	var option = new UIRow();
+	let option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/new' ) );
 	option.onClick( function () {
@@ -43,11 +43,11 @@ function MenubarFile( editor ) {
 
 	// Import
 
-	var form = document.createElement( 'form' );
+	const form = document.createElement( 'form' );
 	form.style.display = 'none';
 	document.body.appendChild( form );
 
-	var fileInput = document.createElement( 'input' );
+	const fileInput = document.createElement( 'input' );
 	fileInput.multiple = true;
 	fileInput.type = 'file';
 	fileInput.addEventListener( 'change', function () {
@@ -58,7 +58,7 @@ function MenubarFile( editor ) {
 	} );
 	form.appendChild( fileInput );
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/import' ) );
 	option.onClick( function () {
@@ -74,12 +74,12 @@ function MenubarFile( editor ) {
 
 	// Export Geometry
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/geometry' ) );
 	option.onClick( function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object === null ) {
 
@@ -88,7 +88,7 @@ function MenubarFile( editor ) {
 
 		}
 
-		var geometry = object.geometry;
+		const geometry = object.geometry;
 
 		if ( geometry === undefined ) {
 
@@ -97,7 +97,7 @@ function MenubarFile( editor ) {
 
 		}
 
-		var output = geometry.toJSON();
+		let output = geometry.toJSON();
 
 		try {
 
@@ -117,12 +117,12 @@ function MenubarFile( editor ) {
 
 	// Export Object
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/object' ) );
 	option.onClick( function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object === null ) {
 
@@ -131,7 +131,7 @@ function MenubarFile( editor ) {
 
 		}
 
-		var output = object.toJSON();
+		let output = object.toJSON();
 
 		try {
 
@@ -151,12 +151,12 @@ function MenubarFile( editor ) {
 
 	// Export Scene
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/scene' ) );
 	option.onClick( function () {
 
-		var output = editor.scene.toJSON();
+		let output = editor.scene.toJSON();
 
 		try {
 
@@ -180,14 +180,14 @@ function MenubarFile( editor ) {
 
 	// Export DAE
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/dae' ) );
 	option.onClick( async function () {
 
-		var { ColladaExporter } = await import( '../../examples/jsm/exporters/ColladaExporter.js' );
+		const { ColladaExporter } = await import( '../../examples/jsm/exporters/ColladaExporter.js' );
 
-		var exporter = new ColladaExporter();
+		const exporter = new ColladaExporter();
 
 		exporter.parse( editor.scene, function ( result ) {
 
@@ -200,12 +200,12 @@ function MenubarFile( editor ) {
 
 	// Export DRC
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/drc' ) );
 	option.onClick( async function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object === null || object.isMesh === undefined ) {
 
@@ -214,9 +214,9 @@ function MenubarFile( editor ) {
 
 		}
 
-		var { DRACOExporter } = await import( '../../examples/jsm/exporters/DRACOExporter.js' );
+		const { DRACOExporter } = await import( '../../examples/jsm/exporters/DRACOExporter.js' );
 
-		var exporter = new DRACOExporter();
+		const exporter = new DRACOExporter();
 
 		const options = {
 			decodeSpeed: 5,
@@ -229,7 +229,7 @@ function MenubarFile( editor ) {
 		};
 
 		// TODO: Change to DRACOExporter's parse( geometry, onParse )?
-		var result = exporter.parse( object, options );
+		const result = exporter.parse( object, options );
 		saveArrayBuffer( result, 'model.drc' );
 
 	} );
@@ -237,17 +237,17 @@ function MenubarFile( editor ) {
 
 	// Export GLB
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/glb' ) );
 	option.onClick( async function () {
 
-		var scene = editor.scene;
-		var animations = getAnimations( scene );
+		const scene = editor.scene;
+		const animations = getAnimations( scene );
 
-		var { GLTFExporter } = await import( '../../examples/jsm/exporters/GLTFExporter.js' );
+		const { GLTFExporter } = await import( '../../examples/jsm/exporters/GLTFExporter.js' );
 
-		var exporter = new GLTFExporter();
+		const exporter = new GLTFExporter();
 
 		exporter.parse( scene, function ( result ) {
 
@@ -260,17 +260,17 @@ function MenubarFile( editor ) {
 
 	// Export GLTF
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/gltf' ) );
 	option.onClick( async function () {
 
-		var scene = editor.scene;
-		var animations = getAnimations( scene );
+		const scene = editor.scene;
+		const animations = getAnimations( scene );
 
-		var { GLTFExporter } = await import( '../../examples/jsm/exporters/GLTFExporter.js' );
+		const { GLTFExporter } = await import( '../../examples/jsm/exporters/GLTFExporter.js' );
 
-		var exporter = new GLTFExporter();
+		const exporter = new GLTFExporter();
 
 		exporter.parse( scene, function ( result ) {
 
@@ -284,12 +284,12 @@ function MenubarFile( editor ) {
 
 	// Export OBJ
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/obj' ) );
 	option.onClick( async function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object === null ) {
 
@@ -298,9 +298,9 @@ function MenubarFile( editor ) {
 
 		}
 
-		var { OBJExporter } = await import( '../../examples/jsm/exporters/OBJExporter.js' );
+		const { OBJExporter } = await import( '../../examples/jsm/exporters/OBJExporter.js' );
 
-		var exporter = new OBJExporter();
+		const exporter = new OBJExporter();
 
 		saveString( exporter.parse( object ), 'model.obj' );
 
@@ -309,14 +309,14 @@ function MenubarFile( editor ) {
 
 	// Export PLY (ASCII)
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/ply' ) );
 	option.onClick( async function () {
 
-		var { PLYExporter } = await import( '../../examples/jsm/exporters/PLYExporter.js' );
+		const { PLYExporter } = await import( '../../examples/jsm/exporters/PLYExporter.js' );
 
-		var exporter = new PLYExporter();
+		const exporter = new PLYExporter();
 
 		exporter.parse( editor.scene, function ( result ) {
 
@@ -329,14 +329,14 @@ function MenubarFile( editor ) {
 
 	// Export PLY (Binary)
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/ply_binary' ) );
 	option.onClick( async function () {
 
-		var { PLYExporter } = await import( '../../examples/jsm/exporters/PLYExporter.js' );
+		const { PLYExporter } = await import( '../../examples/jsm/exporters/PLYExporter.js' );
 
-		var exporter = new PLYExporter();
+		const exporter = new PLYExporter();
 
 		exporter.parse( editor.scene, function ( result ) {
 
@@ -349,14 +349,14 @@ function MenubarFile( editor ) {
 
 	// Export STL (ASCII)
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/stl' ) );
 	option.onClick( async function () {
 
-		var { STLExporter } = await import( '../../examples/jsm/exporters/STLExporter.js' );
+		const { STLExporter } = await import( '../../examples/jsm/exporters/STLExporter.js' );
 
-		var exporter = new STLExporter();
+		const exporter = new STLExporter();
 
 		saveString( exporter.parse( editor.scene ), 'model.stl' );
 
@@ -365,14 +365,14 @@ function MenubarFile( editor ) {
 
 	// Export STL (Binary)
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/stl_binary' ) );
 	option.onClick( async function () {
 
-		var { STLExporter } = await import( '../../examples/jsm/exporters/STLExporter.js' );
+		const { STLExporter } = await import( '../../examples/jsm/exporters/STLExporter.js' );
 
-		var exporter = new STLExporter();
+		const exporter = new STLExporter();
 
 		saveArrayBuffer( exporter.parse( editor.scene, { binary: true } ), 'model-binary.stl' );
 
@@ -381,14 +381,14 @@ function MenubarFile( editor ) {
 
 	// Export USDZ
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/export/usdz' ) );
 	option.onClick( async function () {
 
-		var { USDZExporter } = await import( '../../examples/jsm/exporters/USDZExporter.js' );
+		const { USDZExporter } = await import( '../../examples/jsm/exporters/USDZExporter.js' );
 
-		var exporter = new USDZExporter();
+		const exporter = new USDZExporter();
 
 		saveArrayBuffer( await exporter.parse( editor.scene, { binary: true } ), 'model.usdz' );
 
@@ -401,16 +401,16 @@ function MenubarFile( editor ) {
 
 	// Publish
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/file/publish' ) );
 	option.onClick( function () {
 
-		var toZip = {};
+		const toZip = {};
 
 		//
 
-		var output = editor.toJSON();
+		let output = editor.toJSON();
 		output.metadata.type = 'App';
 		delete output.history;
 
@@ -421,33 +421,33 @@ function MenubarFile( editor ) {
 
 		//
 
-		var title = config.getKey( 'project/title' );
+		const title = config.getKey( 'project/title' );
 
-		var manager = new THREE.LoadingManager( function () {
+		const manager = new THREE.LoadingManager( function () {
 
-			var zipped = zipSync( toZip, { level: 9 } );
+			const zipped = zipSync( toZip, { level: 9 } );
 
-			var blob = new Blob( [ zipped.buffer ], { type: 'application/zip' } );
+			const blob = new Blob( [ zipped.buffer ], { type: 'application/zip' } );
 
 			save( blob, ( title !== '' ? title : 'untitled' ) + '.zip' );
 
 		} );
 
-		var loader = new THREE.FileLoader( manager );
+		const loader = new THREE.FileLoader( manager );
 		loader.load( 'js/libs/app/index.html', function ( content ) {
 
 			content = content.replace( '<!-- title -->', title );
 
-			var includes = [];
+			const includes = [];
 
 			content = content.replace( '<!-- includes -->', includes.join( '\n\t\t' ) );
 
-			var editButton = '';
+			let editButton = '';
 
 			if ( config.getKey( 'project/editable' ) ) {
 
 				editButton = [
-					'			var button = document.createElement( \'a\' );',
+					'			let button = document.createElement( \'a\' );',
 					'			button.href = \'https://threejs.org/editor/#file=\' + location.href.split( \'/\' ).slice( 0, - 1 ).join( \'/\' ) + \'/app.json\';',
 					'			button.style.cssText = \'position: absolute; bottom: 20px; right: 20px; padding: 10px 16px; color: #fff; border: 1px solid #fff; border-radius: 20px; text-decoration: none;\';',
 					'			button.target = \'_blank\';',
@@ -483,7 +483,7 @@ function MenubarFile( editor ) {
 
 	//
 
-	var link = document.createElement( 'a' );
+	const link = document.createElement( 'a' );
 	function save( blob, filename ) {
 
 		if ( link.href ) {
@@ -512,7 +512,7 @@ function MenubarFile( editor ) {
 
 	function getAnimations( scene ) {
 
-		var animations = [];
+		const animations = [];
 
 		scene.traverse( function ( object ) {
 

editor/js/Menubar.Help.js

@@ -2,23 +2,23 @@ import { UIPanel, UIRow } from './libs/ui.js';
 
 function MenubarHelp( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/help' ) );
 	container.add( title );
 
-	var options = new UIPanel();
+	const options = new UIPanel();
 	options.setClass( 'options' );
 	container.add( options );
 
 	// Source code
 
-	var option = new UIRow();
+	let option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/help/source_code' ) );
 	option.onClick( function () {
@@ -31,7 +31,7 @@ function MenubarHelp( editor ) {
 	/*
 	// Icon
 
-	var option = new UIRow();
+	let option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/help/icons' ) );
 	option.onClick( function () {
@@ -44,7 +44,7 @@ function MenubarHelp( editor ) {
 
 	// About
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/help/about' ) );
 	option.onClick( function () {
@@ -56,7 +56,7 @@ function MenubarHelp( editor ) {
 
 	// Manual
 
-	var option = new UIRow();
+	option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/help/manual' ) );
 	option.onClick( function () {

editor/js/Menubar.Play.js

@@ -2,15 +2,15 @@ import { UIPanel } from './libs/ui.js';
 
 function MenubarPlay( editor ) {
 
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var isPlaying = false;
+	let isPlaying = false;
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/play' ) );
 	title.onClick( function () {

editor/js/Menubar.Status.js

@@ -5,16 +5,16 @@ import { UIBoolean } from './libs/ui.three.js';
 
 function MenubarStatus( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu right' );
 
-	var autosave = new UIBoolean( editor.config.getKey( 'autosave' ), strings.getKey( 'menubar/status/autosave' ) );
+	const autosave = new UIBoolean( editor.config.getKey( 'autosave' ), strings.getKey( 'menubar/status/autosave' ) );
 	autosave.text.setColor( '#888' );
 	autosave.onChange( function () {
 
-		var value = this.getValue();
+		const value = this.getValue();
 
 		editor.config.setKey( 'autosave', value );
 
@@ -39,7 +39,7 @@ function MenubarStatus( editor ) {
 
 	} );
 
-	var version = new UIText( 'r' + THREE.REVISION );
+	const version = new UIText( 'r' + THREE.REVISION );
 	version.setClass( 'title' );
 	version.setOpacity( 0.5 );
 	container.add( version );

editor/js/Menubar.View.js

@@ -2,23 +2,23 @@ import { UIPanel, UIRow } from './libs/ui.js';
 
 function MenubarView( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setClass( 'menu' );
 
-	var title = new UIPanel();
+	const title = new UIPanel();
 	title.setClass( 'title' );
 	title.setTextContent( strings.getKey( 'menubar/view' ) );
 	container.add( title );
 
-	var options = new UIPanel();
+	const options = new UIPanel();
 	options.setClass( 'options' );
 	container.add( options );
 
 	// Fullscreen
 
-	var option = new UIRow();
+	const option = new UIRow();
 	option.setClass( 'option' );
 	option.setTextContent( strings.getKey( 'menubar/view/fullscreen' ) );
 	option.onClick( function () {
@@ -57,7 +57,7 @@ function MenubarView( editor ) {
 
 				if ( supported ) {
 
-					var option = new UIRow();
+					const option = new UIRow();
 					option.setClass( 'option' );
 					option.setTextContent( 'VR' );
 					option.onClick( function () {

editor/js/Menubar.js

@@ -11,7 +11,7 @@ import { MenubarStatus } from './Menubar.Status.js';
 
 function Menubar( editor ) {
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'menubar' );
 
 	container.add( new MenubarFile( editor ) );

editor/js/Player.js

@@ -3,16 +3,16 @@ import { APP } from './libs/app.js';
 
 function Player( editor ) {
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'player' );
 	container.setPosition( 'absolute' );
 	container.setDisplay( 'none' );
 
 	//
 
-	var player = new APP.Player();
+	const player = new APP.Player();
 	container.dom.appendChild( player.dom );
 
 	window.addEventListener( 'resize', function () {

editor/js/Script.js

@@ -5,27 +5,27 @@ import { SetMaterialValueCommand } from './commands/SetMaterialValueCommand.js';
 
 function Script( editor ) {
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'script' );
 	container.setPosition( 'absolute' );
 	container.setBackgroundColor( '#272822' );
 	container.setDisplay( 'none' );
 
-	var header = new UIPanel();
+	const header = new UIPanel();
 	header.setPadding( '10px' );
 	container.add( header );
 
-	var title = new UIText().setColor( '#fff' );
+	const title = new UIText().setColor( '#fff' );
 	header.add( title );
 
-	var buttonSVG = ( function () {
+	const buttonSVG = ( function () {
 
-		var svg = document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' );
+		const svg = document.createElementNS( 'http://www.w3.org/2000/svg', 'svg' );
 		svg.setAttribute( 'width', 32 );
 		svg.setAttribute( 'height', 32 );
-		var path = document.createElementNS( 'http://www.w3.org/2000/svg', 'path' );
+		const path = document.createElementNS( 'http://www.w3.org/2000/svg', 'path' );
 		path.setAttribute( 'd', 'M 12,12 L 22,22 M 22,12 12,22' );
 		path.setAttribute( 'stroke', '#fff' );
 		svg.appendChild( path );
@@ -33,7 +33,7 @@ function Script( editor ) {
 
 	} )();
 
-	var close = new UIElement( buttonSVG );
+	const close = new UIElement( buttonSVG );
 	close.setPosition( 'absolute' );
 	close.setTop( '3px' );
 	close.setRight( '1px' );
@@ -46,7 +46,7 @@ function Script( editor ) {
 	header.add( close );
 
 
-	var renderer;
+	let renderer;
 
 	signals.rendererCreated.add( function ( newRenderer ) {
 
@@ -55,12 +55,12 @@ function Script( editor ) {
 	} );
 
 
-	var delay;
-	var currentMode;
-	var currentScript;
-	var currentObject;
+	let delay;
+	let currentMode;
+	let currentScript;
+	let currentObject;
 
-	var codemirror = CodeMirror( container.dom, {
+	const codemirror = CodeMirror( container.dom, {
 		value: '',
 		lineNumbers: true,
 		matchBrackets: true,
@@ -79,7 +79,7 @@ function Script( editor ) {
 		clearTimeout( delay );
 		delay = setTimeout( function () {
 
-			var value = codemirror.getValue();
+			const value = codemirror.getValue();
 
 			if ( ! validate( value ) ) return;
 
@@ -97,11 +97,11 @@ function Script( editor ) {
 
 			if ( currentScript !== 'programInfo' ) return;
 
-			var json = JSON.parse( value );
+			const json = JSON.parse( value );
 
 			if ( JSON.stringify( currentObject.material.defines ) !== JSON.stringify( json.defines ) ) {
 
-				var cmd = new SetMaterialValueCommand( editor, currentObject, 'defines', json.defines );
+				const cmd = new SetMaterialValueCommand( editor, currentObject, 'defines', json.defines );
 				cmd.updatable = false;
 				editor.execute( cmd );
 
@@ -109,7 +109,7 @@ function Script( editor ) {
 
 			if ( JSON.stringify( currentObject.material.uniforms ) !== JSON.stringify( json.uniforms ) ) {
 
-				var cmd = new SetMaterialValueCommand( editor, currentObject, 'uniforms', json.uniforms );
+				const cmd = new SetMaterialValueCommand( editor, currentObject, 'uniforms', json.uniforms );
 				cmd.updatable = false;
 				editor.execute( cmd );
 
@@ -117,7 +117,7 @@ function Script( editor ) {
 
 			if ( JSON.stringify( currentObject.material.attributes ) !== JSON.stringify( json.attributes ) ) {
 
-				var cmd = new SetMaterialValueCommand( editor, currentObject, 'attributes', json.attributes );
+				const cmd = new SetMaterialValueCommand( editor, currentObject, 'attributes', json.attributes );
 				cmd.updatable = false;
 				editor.execute( cmd );
 
@@ -128,7 +128,7 @@ function Script( editor ) {
 	} );
 
 	// prevent backspace from deleting objects
-	var wrapper = codemirror.getWrapperElement();
+	const wrapper = codemirror.getWrapperElement();
 	wrapper.addEventListener( 'keydown', function ( event ) {
 
 		event.stopPropagation();
@@ -137,13 +137,13 @@ function Script( editor ) {
 
 	// validate
 
-	var errorLines = [];
-	var widgets = [];
+	const errorLines = [];
+	const widgets = [];
 
-	var validate = function ( string ) {
+	const validate = function ( string ) {
 
-		var valid;
-		var errors = [];
+		let valid;
+		let errors = [];
 
 		return codemirror.operation( function () {
 
@@ -167,7 +167,7 @@ function Script( editor ) {
 
 					try {
 
-						var syntax = esprima.parse( string, { tolerant: true } );
+						const syntax = esprima.parse( string, { tolerant: true } );
 						errors = syntax.errors;
 
 					} catch ( error ) {
@@ -181,9 +181,9 @@ function Script( editor ) {
 
 					}
 
-					for ( var i = 0; i < errors.length; i ++ ) {
+					for ( let i = 0; i < errors.length; i ++ ) {
 
-						var error = errors[ i ];
+						const error = errors[ i ];
 						error.message = error.message.replace( /Line [0-9]+: /, '' );
 
 					}
@@ -225,26 +225,26 @@ function Script( editor ) {
 					currentObject.material.needsUpdate = true;
 					signals.materialChanged.dispatch( currentObject.material );
 
-					var programs = renderer.info.programs;
+					const programs = renderer.info.programs;
 
 					valid = true;
-					var parseMessage = /^(?:ERROR|WARNING): \d+:(\d+): (.*)/g;
+					const parseMessage = /^(?:ERROR|WARNING): \d+:(\d+): (.*)/g;
 
-					for ( var i = 0, n = programs.length; i !== n; ++ i ) {
+					for ( let i = 0, n = programs.length; i !== n; ++ i ) {
 
-						var diagnostics = programs[ i ].diagnostics;
+						const diagnostics = programs[ i ].diagnostics;
 
 						if ( diagnostics === undefined ||
 								diagnostics.material !== currentObject.material ) continue;
 
 						if ( ! diagnostics.runnable ) valid = false;
 
-						var shaderInfo = diagnostics[ currentScript ];
-						var lineOffset = shaderInfo.prefix.split( /\r\n|\r|\n/ ).length;
+						const shaderInfo = diagnostics[ currentScript ];
+						const lineOffset = shaderInfo.prefix.split( /\r\n|\r|\n/ ).length;
 
 						while ( true ) {
 
-							var parseResult = parseMessage.exec( shaderInfo.log );
+							const parseResult = parseMessage.exec( shaderInfo.log );
 							if ( parseResult === null ) break;
 
 							errors.push( {
@@ -262,20 +262,20 @@ function Script( editor ) {
 
 			} // mode switch
 
-			for ( var i = 0; i < errors.length; i ++ ) {
+			for ( let i = 0; i < errors.length; i ++ ) {
 
-				var error = errors[ i ];
+				const error = errors[ i ];
 
-				var message = document.createElement( 'div' );
+				const message = document.createElement( 'div' );
 				message.className = 'esprima-error';
 				message.textContent = error.message;
 
-				var lineNumber = Math.max( error.lineNumber, 0 );
+				const lineNumber = Math.max( error.lineNumber, 0 );
 				errorLines.push( lineNumber );
 
 				codemirror.addLineClass( lineNumber, 'background', 'errorLine' );
 
-				var widget = codemirror.addLineWidget( lineNumber, message );
+				const widget = codemirror.addLineWidget( lineNumber, message );
 
 				widgets.push( widget );
 
@@ -289,7 +289,7 @@ function Script( editor ) {
 
 	// tern js autocomplete
 
-	var server = new CodeMirror.TernServer( {
+	const server = new CodeMirror.TernServer( {
 		caseInsensitive: true,
 		plugins: { threejs: null }
 	} );
@@ -342,7 +342,7 @@ function Script( editor ) {
 	codemirror.on( 'keypress', function ( cm, kb ) {
 
 		if ( currentMode !== 'javascript' ) return;
-		var typed = String.fromCharCode( kb.which || kb.keyCode );
+		const typed = String.fromCharCode( kb.which || kb.keyCode );
 		if ( /[\w\.]/.exec( typed ) ) {
 
 			server.complete( cm );
@@ -362,7 +362,7 @@ function Script( editor ) {
 
 	signals.editScript.add( function ( object, script ) {
 
-		var mode, name, source;
+		let mode, name, source;
 
 		if ( typeof ( script ) === 'object' ) {
 
@@ -395,7 +395,7 @@ function Script( editor ) {
 
 					mode = 'json';
 					name = 'Program Properties';
-					var json = {
+					const json = {
 						defines: object.material.defines,
 						uniforms: object.material.uniforms,
 						attributes: object.material.attributes

editor/js/Sidebar.Animation.js

@@ -2,24 +2,24 @@ import { UIPanel, UIBreak, UISelect, UIButton, UIText, UINumber, UIRow } from '.
 
 function SidebarAnimation( editor ) {
 
-	var strings = editor.strings;
-	var signals = editor.signals;
-	var mixer = editor.mixer;
+	const strings = editor.strings;
+	const signals = editor.signals;
+	const mixer = editor.mixer;
 
-	var actions = {};
+	const actions = {};
 
 	signals.objectSelected.add( function ( object ) {
 
 		if ( object !== null && object.animations.length > 0 ) {
 
-			var animations = object.animations;
+			const animations = object.animations;
 
 			container.setDisplay( '' );
 
-			var options = {};
-			var firstAnimation;
+			const options = {};
+			let firstAnimation;
 
-			for ( var animation of animations ) {
+			for ( const animation of animations ) {
 
 				if ( firstAnimation === undefined ) firstAnimation = animation.name;
 
@@ -70,7 +70,7 @@ function SidebarAnimation( editor ) {
 
 	}
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setDisplay( 'none' );
 
 	container.add( new UIText( strings.getKey( 'sidebar/animations' ) ).setTextTransform( 'uppercase' ) );
@@ -79,9 +79,9 @@ function SidebarAnimation( editor ) {
 
 	//
 
-	var animationsRow = new UIRow();
+	const animationsRow = new UIRow();
 
-	var animationsSelect = new UISelect().setFontSize( '12px' );
+	const animationsSelect = new UISelect().setFontSize( '12px' );
 	animationsRow.add( animationsSelect );
 	animationsRow.add( new UIButton( strings.getKey( 'sidebar/animations/play' ) ).setMarginLeft( '4px' ).onClick( playAction ) );
 	animationsRow.add( new UIButton( strings.getKey( 'sidebar/animations/stop' ) ).setMarginLeft( '4px' ).onClick( stopAction ) );
@@ -90,8 +90,8 @@ function SidebarAnimation( editor ) {
 
 	//
 
-	var mixerTimeScaleRow = new UIRow();
-	var mixerTimeScaleNumber = new UINumber( 0.5 ).setWidth( '60px' ).setRange( - 10, 10 ).onChange( changeTimeScale );
+	const mixerTimeScaleRow = new UIRow();
+	const mixerTimeScaleNumber = new UINumber( 0.5 ).setWidth( '60px' ).setRange( - 10, 10 ).onChange( changeTimeScale );
 
 	mixerTimeScaleRow.add( new UIText( strings.getKey( 'sidebar/animations/timescale' ) ).setWidth( '90px' ) );
 	mixerTimeScaleRow.add( mixerTimeScaleNumber );

editor/js/Sidebar.Geometry.BoxGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// width
 
-	var widthRow = new UIRow();
-	var width = new UINumber( parameters.width ).onChange( update );
+	const widthRow = new UIRow();
+	const width = new UINumber( parameters.width ).onChange( update );
 
 	widthRow.add( new UIText( strings.getKey( 'sidebar/geometry/box_geometry/width' ) ).setWidth( '90px' ) );
 	widthRow.add( width );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// height
 
-	var heightRow = new UIRow();
-	var height = new UINumber( parameters.height ).onChange( update );
+	const heightRow = new UIRow();
+	const height = new UINumber( parameters.height ).onChange( update );
 
 	heightRow.add( new UIText( strings.getKey( 'sidebar/geometry/box_geometry/height' ) ).setWidth( '90px' ) );
 	heightRow.add( height );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// depth
 
-	var depthRow = new UIRow();
-	var depth = new UINumber( parameters.depth ).onChange( update );
+	const depthRow = new UIRow();
+	const depth = new UINumber( parameters.depth ).onChange( update );
 
 	depthRow.add( new UIText( strings.getKey( 'sidebar/geometry/box_geometry/depth' ) ).setWidth( '90px' ) );
 	depthRow.add( depth );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// widthSegments
 
-	var widthSegmentsRow = new UIRow();
-	var widthSegments = new UIInteger( parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
+	const widthSegmentsRow = new UIRow();
+	const widthSegments = new UIInteger( parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
 
 	widthSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/box_geometry/widthseg' ) ).setWidth( '90px' ) );
 	widthSegmentsRow.add( widthSegments );
@@ -55,8 +55,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// heightSegments
 
-	var heightSegmentsRow = new UIRow();
-	var heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
+	const heightSegmentsRow = new UIRow();
+	const heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
 
 	heightSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/box_geometry/heightseg' ) ).setWidth( '90px' ) );
 	heightSegmentsRow.add( heightSegments );
@@ -65,8 +65,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// depthSegments
 
-	var depthSegmentsRow = new UIRow();
-	var depthSegments = new UIInteger( parameters.depthSegments ).setRange( 1, Infinity ).onChange( update );
+	const depthSegmentsRow = new UIRow();
+	const depthSegments = new UIInteger( parameters.depthSegments ).setRange( 1, Infinity ).onChange( update );
 
 	depthSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/box_geometry/depthseg' ) ).setWidth( '90px' ) );
 	depthSegmentsRow.add( depthSegments );

editor/js/Sidebar.Geometry.BufferGeometry.js

@@ -2,31 +2,31 @@ import { UIRow, UIText, UISpan, UIBreak } from './libs/ui.js';
 
 function SidebarGeometryBufferGeometry( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
 	function update( object ) {
 
 		if ( object === null ) return; // objectSelected.dispatch( null )
 		if ( object === undefined ) return;
 
-		var geometry = object.geometry;
+		const geometry = object.geometry;
 
 		if ( geometry && geometry.isBufferGeometry ) {
 
 			container.clear();
 			container.setDisplay( 'block' );
 
-			var text = new UIText( strings.getKey( 'sidebar/geometry/buffer_geometry/attributes' ) ).setWidth( '90px' );
+			const text = new UIText( strings.getKey( 'sidebar/geometry/buffer_geometry/attributes' ) ).setWidth( '90px' );
 			container.add( text );
 
-			var container2 = new UISpan().setDisplay( 'inline-block' ).setVerticalAlign( 'middle' ).setWidth( '160px' );
+			const container2 = new UISpan().setDisplay( 'inline-block' ).setVerticalAlign( 'middle' ).setWidth( '160px' );
 			container.add( container2 );
 
-			var index = geometry.index;
+			const index = geometry.index;
 
 			if ( index !== null ) {
 
@@ -36,11 +36,11 @@ function SidebarGeometryBufferGeometry( editor ) {
 
 			}
 
-			var attributes = geometry.attributes;
+			const attributes = geometry.attributes;
 
-			for ( var name in attributes ) {
+			for ( const name in attributes ) {
 
-				var attribute = attributes[ name ];
+				const attribute = attributes[ name ];
 
 				container2.add( new UIText( name ).setWidth( '80px' ) );
 				container2.add( new UIText( ( attribute.count ).format() + ' (' + attribute.itemSize + ')' ).setFontSize( '12px' ) );

editor/js/Sidebar.Geometry.CircleGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/circle_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// segments
 
-	var segmentsRow = new UIRow();
-	var segments = new UIInteger( parameters.segments ).setRange( 3, Infinity ).onChange( update );
+	const segmentsRow = new UIRow();
+	const segments = new UIInteger( parameters.segments ).setRange( 3, Infinity ).onChange( update );
 
 	segmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/circle_geometry/segments' ) ).setWidth( '90px' ) );
 	segmentsRow.add( segments );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaStart
 
-	var thetaStartRow = new UIRow();
-	var thetaStart = new UINumber( parameters.thetaStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const thetaStartRow = new UIRow();
+	const thetaStart = new UINumber( parameters.thetaStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	thetaStartRow.add( new UIText( strings.getKey( 'sidebar/geometry/circle_geometry/thetastart' ) ).setWidth( '90px' ) );
 	thetaStartRow.add( thetaStart );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaLength
 
-	var thetaLengthRow = new UIRow();
-	var thetaLength = new UINumber( parameters.thetaLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const thetaLengthRow = new UIRow();
+	const thetaLength = new UINumber( parameters.thetaLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	thetaLengthRow.add( new UIText( strings.getKey( 'sidebar/geometry/circle_geometry/thetalength' ) ).setWidth( '90px' ) );
 	thetaLengthRow.add( thetaLength );

editor/js/Sidebar.Geometry.CylinderGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radiusTop
 
-	var radiusTopRow = new UIRow();
-	var radiusTop = new UINumber( parameters.radiusTop ).onChange( update );
+	const radiusTopRow = new UIRow();
+	const radiusTop = new UINumber( parameters.radiusTop ).onChange( update );
 
 	radiusTopRow.add( new UIText( strings.getKey( 'sidebar/geometry/cylinder_geometry/radiustop' ) ).setWidth( '90px' ) );
 	radiusTopRow.add( radiusTop );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// radiusBottom
 
-	var radiusBottomRow = new UIRow();
-	var radiusBottom = new UINumber( parameters.radiusBottom ).onChange( update );
+	const radiusBottomRow = new UIRow();
+	const radiusBottom = new UINumber( parameters.radiusBottom ).onChange( update );
 
 	radiusBottomRow.add( new UIText( strings.getKey( 'sidebar/geometry/cylinder_geometry/radiusbottom' ) ).setWidth( '90px' ) );
 	radiusBottomRow.add( radiusBottom );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// height
 
-	var heightRow = new UIRow();
-	var height = new UINumber( parameters.height ).onChange( update );
+	const heightRow = new UIRow();
+	const height = new UINumber( parameters.height ).onChange( update );
 
 	heightRow.add( new UIText( strings.getKey( 'sidebar/geometry/cylinder_geometry/height' ) ).setWidth( '90px' ) );
 	heightRow.add( height );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// radialSegments
 
-	var radialSegmentsRow = new UIRow();
-	var radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
+	const radialSegmentsRow = new UIRow();
+	const radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
 
 	radialSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/cylinder_geometry/radialsegments' ) ).setWidth( '90px' ) );
 	radialSegmentsRow.add( radialSegments );
@@ -55,8 +55,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// heightSegments
 
-	var heightSegmentsRow = new UIRow();
-	var heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
+	const heightSegmentsRow = new UIRow();
+	const heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
 
 	heightSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/cylinder_geometry/heightsegments' ) ).setWidth( '90px' ) );
 	heightSegmentsRow.add( heightSegments );
@@ -65,8 +65,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// openEnded
 
-	var openEndedRow = new UIRow();
-	var openEnded = new UICheckbox( parameters.openEnded ).onChange( update );
+	const openEndedRow = new UIRow();
+	const openEnded = new UICheckbox( parameters.openEnded ).onChange( update );
 
 	openEndedRow.add( new UIText( strings.getKey( 'sidebar/geometry/cylinder_geometry/openended' ) ).setWidth( '90px' ) );
 	openEndedRow.add( openEnded );

editor/js/Sidebar.Geometry.DodecahedronGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/dodecahedron_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// detail
 
-	var detailRow = new UIRow();
-	var detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
+	const detailRow = new UIRow();
+	const detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
 
 	detailRow.add( new UIText( strings.getKey( 'sidebar/geometry/dodecahedron_geometry/detail' ) ).setWidth( '90px' ) );
 	detailRow.add( detail );

editor/js/Sidebar.Geometry.ExtrudeGeometry.js

@@ -6,13 +6,13 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
-	var options = parameters.options;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
+	const options = parameters.options;
 	options.curveSegments = options.curveSegments != undefined ? options.curveSegments : 12;
 	options.steps = options.steps != undefined ? options.steps : 1;
 	options.depth = options.depth != undefined ? options.depth : 100;
@@ -24,8 +24,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// curveSegments
 
-	var curveSegmentsRow = new UIRow();
-	var curveSegments = new UIInteger( options.curveSegments ).onChange( update ).setRange( 1, Infinity );
+	const curveSegmentsRow = new UIRow();
+	const curveSegments = new UIInteger( options.curveSegments ).onChange( update ).setRange( 1, Infinity );
 
 	curveSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/curveSegments' ) ).setWidth( '90px' ) );
 	curveSegmentsRow.add( curveSegments );
@@ -34,8 +34,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// steps
 
-	var stepsRow = new UIRow();
-	var steps = new UIInteger( options.steps ).onChange( update ).setRange( 1, Infinity );
+	const stepsRow = new UIRow();
+	const steps = new UIInteger( options.steps ).onChange( update ).setRange( 1, Infinity );
 
 	stepsRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/steps' ) ).setWidth( '90px' ) );
 	stepsRow.add( steps );
@@ -44,8 +44,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// depth
 
-	var depthRow = new UIRow();
-	var depth = new UINumber( options.depth ).onChange( update ).setRange( 1, Infinity );
+	const depthRow = new UIRow();
+	const depth = new UINumber( options.depth ).onChange( update ).setRange( 1, Infinity );
 
 	depthRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/depth' ) ).setWidth( '90px' ) );
 	depthRow.add( depth );
@@ -54,20 +54,22 @@ function GeometryParametersPanel( editor, object ) {
 
 	// enabled
 
-	var enabledRow = new UIRow();
-	var enabled = new UICheckbox( options.bevelEnabled ).onChange( update );
+	const enabledRow = new UIRow();
+	const enabled = new UICheckbox( options.bevelEnabled ).onChange( update );
 
 	enabledRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelEnabled' ) ).setWidth( '90px' ) );
 	enabledRow.add( enabled );
 
 	container.add( enabledRow );
 
+	let thickness, size, offset, segments;
+
 	if ( options.bevelEnabled === true ) {
 
 		// thickness
 
-		var thicknessRow = new UIRow();
-		var thickness = new UINumber( options.bevelThickness ).onChange( update );
+		const thicknessRow = new UIRow();
+		thickness = new UINumber( options.bevelThickness ).onChange( update );
 
 		thicknessRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelThickness' ) ).setWidth( '90px' ) );
 		thicknessRow.add( thickness );
@@ -76,8 +78,8 @@ function GeometryParametersPanel( editor, object ) {
 
 		// size
 
-		var sizeRow = new UIRow();
-		var size = new UINumber( options.bevelSize ).onChange( update );
+		const sizeRow = new UIRow();
+		size = new UINumber( options.bevelSize ).onChange( update );
 
 		sizeRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelSize' ) ).setWidth( '90px' ) );
 		sizeRow.add( size );
@@ -86,8 +88,8 @@ function GeometryParametersPanel( editor, object ) {
 
 		// offset
 
-		var offsetRow = new UIRow();
-		var offset = new UINumber( options.bevelOffset ).onChange( update );
+		const offsetRow = new UIRow();
+		offset = new UINumber( options.bevelOffset ).onChange( update );
 
 		offsetRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelOffset' ) ).setWidth( '90px' ) );
 		offsetRow.add( offset );
@@ -96,8 +98,8 @@ function GeometryParametersPanel( editor, object ) {
 
 		// segments
 
-		var segmentsRow = new UIRow();
-		var segments = new UIInteger( options.bevelSegments ).onChange( update ).setRange( 0, Infinity );
+		const segmentsRow = new UIRow();
+		segments = new UIInteger( options.bevelSegments ).onChange( update ).setRange( 0, Infinity );
 
 		segmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/extrude_geometry/bevelSegments' ) ).setWidth( '90px' ) );
 		segmentsRow.add( segments );
@@ -106,7 +108,7 @@ function GeometryParametersPanel( editor, object ) {
 
 	}
 
-	var button = new UIButton( strings.getKey( 'sidebar/geometry/extrude_geometry/shape' ) ).onClick( toShape ).setWidth( '90px' ).setMarginLeft( '90px' );
+	const button = new UIButton( strings.getKey( 'sidebar/geometry/extrude_geometry/shape' ) ).onClick( toShape ).setWidth( '90px' ).setMarginLeft( '90px' );
 	container.add( button );
 
 	//
@@ -120,7 +122,7 @@ function GeometryParametersPanel( editor, object ) {
 				steps: steps.getValue(),
 				depth: depth.getValue(),
 				bevelEnabled: enabled.getValue(),
-				bevelThickness: thickness !== undefined ? thickness.getValue() : options.bevelThickness,
+				bevelThickness: options.bevelThickness,
 				bevelSize: size !== undefined ? size.getValue() : options.bevelSize,
 				bevelOffset: offset !== undefined ? offset.getValue() : options.bevelOffset,
 				bevelSegments: segments !== undefined ? segments.getValue() : options.bevelSegments

editor/js/Sidebar.Geometry.IcosahedronGeometry.js

@@ -6,19 +6,19 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/icosahedron_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -27,8 +27,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// detail
 
-	var detailRow = new UIRow();
-	var detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
+	const detailRow = new UIRow();
+	const detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
 
 	detailRow.add( new UIText( strings.getKey( 'sidebar/geometry/icosahedron_geometry/detail' ) ).setWidth( '90px' ) );
 	detailRow.add( detail );

editor/js/Sidebar.Geometry.LatheGeometry.js

@@ -7,17 +7,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// segments
 
-	var segmentsRow = new UIRow();
-	var segments = new UIInteger( parameters.segments ).onChange( update );
+	const segmentsRow = new UIRow();
+	const segments = new UIInteger( parameters.segments ).onChange( update );
 
 	segmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/lathe_geometry/segments' ) ).setWidth( '90px' ) );
 	segmentsRow.add( segments );
@@ -26,8 +26,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// phiStart
 
-	var phiStartRow = new UIRow();
-	var phiStart = new UINumber( parameters.phiStart * 180 / Math.PI ).onChange( update );
+	const phiStartRow = new UIRow();
+	const phiStart = new UINumber( parameters.phiStart * 180 / Math.PI ).onChange( update );
 
 	phiStartRow.add( new UIText( strings.getKey( 'sidebar/geometry/lathe_geometry/phistart' ) ).setWidth( '90px' ) );
 	phiStartRow.add( phiStart );
@@ -36,8 +36,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// phiLength
 
-	var phiLengthRow = new UIRow();
-	var phiLength = new UINumber( parameters.phiLength * 180 / Math.PI ).onChange( update );
+	const phiLengthRow = new UIRow();
+	const phiLength = new UINumber( parameters.phiLength * 180 / Math.PI ).onChange( update );
 
 	phiLengthRow.add( new UIText( strings.getKey( 'sidebar/geometry/lathe_geometry/philength' ) ).setWidth( '90px' ) );
 	phiLengthRow.add( phiLength );
@@ -46,10 +46,10 @@ function GeometryParametersPanel( editor, object ) {
 
 	// points
 
-	var pointsRow = new UIRow();
+	const pointsRow = new UIRow();
 	pointsRow.add( new UIText( strings.getKey( 'sidebar/geometry/lathe_geometry/points' ) ).setWidth( '90px' ) );
 
-	var points = new UIPoints2().setValue( parameters.points ).onChange( update );
+	const points = new UIPoints2().setValue( parameters.points ).onChange( update );
 	pointsRow.add( points );
 
 	container.add( pointsRow );

editor/js/Sidebar.Geometry.Modifiers.js

@@ -2,15 +2,15 @@ import { UIRow, UIButton } from './libs/ui.js';
 
 function SidebarGeometryModifiers( editor, object ) {
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIRow().setPaddingLeft( '90px' );
+	const container = new UIRow().setPaddingLeft( '90px' );
 
-	var geometry = object.geometry;
+	const geometry = object.geometry;
 
 	// Compute Vertex Normals
 
-	var button = new UIButton( 'Compute Vertex Normals' );
+	const button = new UIButton( 'Compute Vertex Normals' );
 	button.onClick( function () {
 
 		geometry.computeVertexNormals();

editor/js/Sidebar.Geometry.OctahedronGeometry.js

@@ -6,19 +6,19 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/octahedron_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -27,8 +27,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// detail
 
-	var detailRow = new UIRow();
-	var detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
+	const detailRow = new UIRow();
+	const detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
 
 	detailRow.add( new UIText( strings.getKey( 'sidebar/geometry/octahedron_geometry/detail' ) ).setWidth( '90px' ) );
 	detailRow.add( detail );

editor/js/Sidebar.Geometry.PlaneGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// width
 
-	var widthRow = new UIRow();
-	var width = new UINumber( parameters.width ).onChange( update );
+	const widthRow = new UIRow();
+	const width = new UINumber( parameters.width ).onChange( update );
 
 	widthRow.add( new UIText( strings.getKey( 'sidebar/geometry/plane_geometry/width' ) ).setWidth( '90px' ) );
 	widthRow.add( width );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// height
 
-	var heightRow = new UIRow();
-	var height = new UINumber( parameters.height ).onChange( update );
+	const heightRow = new UIRow();
+	const height = new UINumber( parameters.height ).onChange( update );
 
 	heightRow.add( new UIText( strings.getKey( 'sidebar/geometry/plane_geometry/height' ) ).setWidth( '90px' ) );
 	heightRow.add( height );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// widthSegments
 
-	var widthSegmentsRow = new UIRow();
-	var widthSegments = new UIInteger( parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
+	const widthSegmentsRow = new UIRow();
+	const widthSegments = new UIInteger( parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
 
 	widthSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/plane_geometry/widthsegments' ) ).setWidth( '90px' ) );
 	widthSegmentsRow.add( widthSegments );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// heightSegments
 
-	var heightSegmentsRow = new UIRow();
-	var heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
+	const heightSegmentsRow = new UIRow();
+	const heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
 
 	heightSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/plane_geometry/heightsegments' ) ).setWidth( '90px' ) );
 	heightSegmentsRow.add( heightSegments );

editor/js/Sidebar.Geometry.RingGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// innerRadius
 
-	var innerRadiusRow = new UIRow();
-	var innerRadius = new UINumber( parameters.innerRadius ).onChange( update );
+	const innerRadiusRow = new UIRow();
+	const innerRadius = new UINumber( parameters.innerRadius ).onChange( update );
 
 	innerRadiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/ring_geometry/innerRadius' ) ).setWidth( '90px' ) );
 	innerRadiusRow.add( innerRadius );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// outerRadius
 
-	var outerRadiusRow = new UIRow();
-	var outerRadius = new UINumber( parameters.outerRadius ).onChange( update );
+	const outerRadiusRow = new UIRow();
+	const outerRadius = new UINumber( parameters.outerRadius ).onChange( update );
 
 	outerRadiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/ring_geometry/outerRadius' ) ).setWidth( '90px' ) );
 	outerRadiusRow.add( outerRadius );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaSegments
 
-	var thetaSegmentsRow = new UIRow();
-	var thetaSegments = new UIInteger( parameters.thetaSegments ).setRange( 3, Infinity ).onChange( update );
+	const thetaSegmentsRow = new UIRow();
+	const thetaSegments = new UIInteger( parameters.thetaSegments ).setRange( 3, Infinity ).onChange( update );
 
 	thetaSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/ring_geometry/thetaSegments' ) ).setWidth( '90px' ) );
 	thetaSegmentsRow.add( thetaSegments );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// phiSegments
 
-	var phiSegmentsRow = new UIRow();
-	var phiSegments = new UIInteger( parameters.phiSegments ).setRange( 3, Infinity ).onChange( update );
+	const phiSegmentsRow = new UIRow();
+	const phiSegments = new UIInteger( parameters.phiSegments ).setRange( 3, Infinity ).onChange( update );
 
 	phiSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/ring_geometry/phiSegments' ) ).setWidth( '90px' ) );
 	phiSegmentsRow.add( phiSegments );
@@ -55,8 +55,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaStart
 
-	var thetaStartRow = new UIRow();
-	var thetaStart = new UINumber( parameters.thetaStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const thetaStartRow = new UIRow();
+	const thetaStart = new UINumber( parameters.thetaStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	thetaStartRow.add( new UIText( strings.getKey( 'sidebar/geometry/ring_geometry/thetastart' ) ).setWidth( '90px' ) );
 	thetaStartRow.add( thetaStart );
@@ -65,8 +65,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaLength
 
-	var thetaLengthRow = new UIRow();
-	var thetaLength = new UINumber( parameters.thetaLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const thetaLengthRow = new UIRow();
+	const thetaLength = new UINumber( parameters.thetaLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	thetaLengthRow.add( new UIText( strings.getKey( 'sidebar/geometry/ring_geometry/thetalength' ) ).setWidth( '90px' ) );
 	thetaLengthRow.add( thetaLength );

editor/js/Sidebar.Geometry.ShapeGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// curveSegments
 
-	var curveSegmentsRow = new UIRow();
-	var curveSegments = new UIInteger( parameters.curveSegments || 12 ).onChange( changeShape ).setRange( 1, Infinity );
+	const curveSegmentsRow = new UIRow();
+	const curveSegments = new UIInteger( parameters.curveSegments || 12 ).onChange( changeShape ).setRange( 1, Infinity );
 
 	curveSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/shape_geometry/curveSegments' ) ).setWidth( '90px' ) );
 	curveSegmentsRow.add( curveSegments );
@@ -24,7 +24,7 @@ function GeometryParametersPanel( editor, object ) {
 	container.add( curveSegmentsRow );
 
 	// to extrude
-	var button = new UIButton( strings.getKey( 'sidebar/geometry/shape_geometry/extrude' ) ).onClick( toExtrude ).setWidth( '90px' ).setMarginLeft( '90px' );
+	const button = new UIButton( strings.getKey( 'sidebar/geometry/shape_geometry/extrude' ) ).onClick( toExtrude ).setWidth( '90px' ).setMarginLeft( '90px' );
 	container.add( button );
 
 	//

editor/js/Sidebar.Geometry.SphereGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// widthSegments
 
-	var widthSegmentsRow = new UIRow();
-	var widthSegments = new UIInteger( parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
+	const widthSegmentsRow = new UIRow();
+	const widthSegments = new UIInteger( parameters.widthSegments ).setRange( 1, Infinity ).onChange( update );
 
 	widthSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/widthsegments' ) ).setWidth( '90px' ) );
 	widthSegmentsRow.add( widthSegments );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// heightSegments
 
-	var heightSegmentsRow = new UIRow();
-	var heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
+	const heightSegmentsRow = new UIRow();
+	const heightSegments = new UIInteger( parameters.heightSegments ).setRange( 1, Infinity ).onChange( update );
 
 	heightSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/heightsegments' ) ).setWidth( '90px' ) );
 	heightSegmentsRow.add( heightSegments );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// phiStart
 
-	var phiStartRow = new UIRow();
-	var phiStart = new UINumber( parameters.phiStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const phiStartRow = new UIRow();
+	const phiStart = new UINumber( parameters.phiStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	phiStartRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/phistart' ) ).setWidth( '90px' ) );
 	phiStartRow.add( phiStart );
@@ -55,8 +55,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// phiLength
 
-	var phiLengthRow = new UIRow();
-	var phiLength = new UINumber( parameters.phiLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const phiLengthRow = new UIRow();
+	const phiLength = new UINumber( parameters.phiLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	phiLengthRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/philength' ) ).setWidth( '90px' ) );
 	phiLengthRow.add( phiLength );
@@ -65,8 +65,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaStart
 
-	var thetaStartRow = new UIRow();
-	var thetaStart = new UINumber( parameters.thetaStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const thetaStartRow = new UIRow();
+	const thetaStart = new UINumber( parameters.thetaStart * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	thetaStartRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/thetastart' ) ).setWidth( '90px' ) );
 	thetaStartRow.add( thetaStart );
@@ -75,8 +75,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// thetaLength
 
-	var thetaLengthRow = new UIRow();
-	var thetaLength = new UINumber( parameters.thetaLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const thetaLengthRow = new UIRow();
+	const thetaLength = new UINumber( parameters.thetaLength * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	thetaLengthRow.add( new UIText( strings.getKey( 'sidebar/geometry/sphere_geometry/thetalength' ) ).setWidth( '90px' ) );
 	thetaLengthRow.add( thetaLength );

editor/js/Sidebar.Geometry.TeapotGeometry.js

@@ -4,14 +4,14 @@ import { TeapotGeometry } from '../../examples/jsm/geometries/TeapotGeometry.js'
 
 function GeometryParametersPanel( signals, object ) {
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var parameters = object.geometry.parameters;
+	const parameters = object.geometry.parameters;
 
 	// size
 
-	var sizeRow = new UIRow();
-	var size = new UINumber( parameters.size ).onChange( update );
+	const sizeRow = new UIRow();
+	const size = new UINumber( parameters.size ).onChange( update );
 
 	sizeRow.add( new UIText( 'Size' ).setWidth( '90px' ) );
 	sizeRow.add( size );
@@ -20,8 +20,8 @@ function GeometryParametersPanel( signals, object ) {
 
 	// segments
 
-	var segmentsRow = new UIRow();
-	var segments = new UIInteger( parameters.segments ).setRange( 1, Infinity ).onChange( update );
+	const segmentsRow = new UIRow();
+	const segments = new UIInteger( parameters.segments ).setRange( 1, Infinity ).onChange( update );
 
 	segmentsRow.add( new UIText( 'Segments' ).setWidth( '90px' ) );
 	segmentsRow.add( segments );
@@ -30,8 +30,8 @@ function GeometryParametersPanel( signals, object ) {
 
 	// bottom
 
-	var bottomRow = new UIRow();
-	var bottom = new UICheckbox( parameters.bottom ).onChange( update );
+	const bottomRow = new UIRow();
+	const bottom = new UICheckbox( parameters.bottom ).onChange( update );
 
 	bottomRow.add( new UIText( 'Bottom' ).setWidth( '90px' ) );
 	bottomRow.add( bottom );
@@ -40,8 +40,8 @@ function GeometryParametersPanel( signals, object ) {
 
 	// lid
 
-	var lidRow = new UIRow();
-	var lid = new UICheckbox( parameters.lid ).onChange( update );
+	const lidRow = new UIRow();
+	const lid = new UICheckbox( parameters.lid ).onChange( update );
 
 	lidRow.add( new UIText( 'Lid' ).setWidth( '90px' ) );
 	lidRow.add( lid );
@@ -50,8 +50,8 @@ function GeometryParametersPanel( signals, object ) {
 
 	// body
 
-	var bodyRow = new UIRow();
-	var body = new UICheckbox( parameters.body ).onChange( update );
+	const bodyRow = new UIRow();
+	const body = new UICheckbox( parameters.body ).onChange( update );
 
 	bodyRow.add( new UIText( 'Body' ).setWidth( '90px' ) );
 	bodyRow.add( body );
@@ -60,8 +60,8 @@ function GeometryParametersPanel( signals, object ) {
 
 	// fitted lid
 
-	var fitLidRow = new UIRow();
-	var fitLid = new UICheckbox( parameters.fitLid ).onChange( update );
+	const fitLidRow = new UIRow();
+	const fitLid = new UICheckbox( parameters.fitLid ).onChange( update );
 
 	fitLidRow.add( new UIText( 'Fitted Lid' ).setWidth( '90px' ) );
 	fitLidRow.add( fitLid );
@@ -70,8 +70,8 @@ function GeometryParametersPanel( signals, object ) {
 
 	// blinn-sized
 
-	var blinnRow = new UIRow();
-	var blinn = new UICheckbox( parameters.blinn ).onChange( update );
+	const blinnRow = new UIRow();
+	const blinn = new UICheckbox( parameters.blinn ).onChange( update );
 
 	blinnRow.add( new UIText( 'Blinn-scaled' ).setWidth( '90px' ) );
 	blinnRow.add( blinn );

editor/js/Sidebar.Geometry.TetrahedronGeometry.js

@@ -6,19 +6,19 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/tetrahedron_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -27,8 +27,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// detail
 
-	var detailRow = new UIRow();
-	var detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
+	const detailRow = new UIRow();
+	const detail = new UIInteger( parameters.detail ).setRange( 0, Infinity ).onChange( update );
 
 	detailRow.add( new UIText( strings.getKey( 'sidebar/geometry/tetrahedron_geometry/detail' ) ).setWidth( '90px' ) );
 	detailRow.add( detail );

editor/js/Sidebar.Geometry.TorusGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/torus_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// tube
 
-	var tubeRow = new UIRow();
-	var tube = new UINumber( parameters.tube ).onChange( update );
+	const tubeRow = new UIRow();
+	const tube = new UINumber( parameters.tube ).onChange( update );
 
 	tubeRow.add( new UIText( strings.getKey( 'sidebar/geometry/torus_geometry/tube' ) ).setWidth( '90px' ) );
 	tubeRow.add( tube );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// radialSegments
 
-	var radialSegmentsRow = new UIRow();
-	var radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
+	const radialSegmentsRow = new UIRow();
+	const radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
 
 	radialSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/torus_geometry/radialsegments' ) ).setWidth( '90px' ) );
 	radialSegmentsRow.add( radialSegments );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// tubularSegments
 
-	var tubularSegmentsRow = new UIRow();
-	var tubularSegments = new UIInteger( parameters.tubularSegments ).setRange( 1, Infinity ).onChange( update );
+	const tubularSegmentsRow = new UIRow();
+	const tubularSegments = new UIInteger( parameters.tubularSegments ).setRange( 1, Infinity ).onChange( update );
 
 	tubularSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/torus_geometry/tubularsegments' ) ).setWidth( '90px' ) );
 	tubularSegmentsRow.add( tubularSegments );
@@ -55,8 +55,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// arc
 
-	var arcRow = new UIRow();
-	var arc = new UINumber( parameters.arc * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
+	const arcRow = new UIRow();
+	const arc = new UINumber( parameters.arc * THREE.MathUtils.RAD2DEG ).setStep( 10 ).onChange( update );
 
 	arcRow.add( new UIText( strings.getKey( 'sidebar/geometry/torus_geometry/arc' ) ).setWidth( '90px' ) );
 	arcRow.add( arc );

editor/js/Sidebar.Geometry.TorusKnotGeometry.js

@@ -6,17 +6,17 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/torusKnot_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -25,8 +25,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// tube
 
-	var tubeRow = new UIRow();
-	var tube = new UINumber( parameters.tube ).onChange( update );
+	const tubeRow = new UIRow();
+	const tube = new UINumber( parameters.tube ).onChange( update );
 
 	tubeRow.add( new UIText( strings.getKey( 'sidebar/geometry/torusKnot_geometry/tube' ) ).setWidth( '90px' ) );
 	tubeRow.add( tube );
@@ -35,8 +35,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// tubularSegments
 
-	var tubularSegmentsRow = new UIRow();
-	var tubularSegments = new UIInteger( parameters.tubularSegments ).setRange( 1, Infinity ).onChange( update );
+	const tubularSegmentsRow = new UIRow();
+	const tubularSegments = new UIInteger( parameters.tubularSegments ).setRange( 1, Infinity ).onChange( update );
 
 	tubularSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/torusKnot_geometry/tubularsegments' ) ).setWidth( '90px' ) );
 	tubularSegmentsRow.add( tubularSegments );
@@ -45,8 +45,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// radialSegments
 
-	var radialSegmentsRow = new UIRow();
-	var radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
+	const radialSegmentsRow = new UIRow();
+	const radialSegments = new UIInteger( parameters.radialSegments ).setRange( 1, Infinity ).onChange( update );
 
 	radialSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/torusKnot_geometry/radialsegments' ) ).setWidth( '90px' ) );
 	radialSegmentsRow.add( radialSegments );
@@ -55,8 +55,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// p
 
-	var pRow = new UIRow();
-	var p = new UINumber( parameters.p ).onChange( update );
+	const pRow = new UIRow();
+	const p = new UINumber( parameters.p ).onChange( update );
 
 	pRow.add( new UIText( strings.getKey( 'sidebar/geometry/torusKnot_geometry/p' ) ).setWidth( '90px' ) );
 	pRow.add( p );
@@ -65,8 +65,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// q
 
-	var qRow = new UIRow();
-	var q = new UINumber( parameters.q ).onChange( update );
+	const qRow = new UIRow();
+	const q = new UINumber( parameters.q ).onChange( update );
 
 	qRow.add( new UIText( strings.getKey( 'sidebar/geometry/torusKnot_geometry/q' ) ).setWidth( '90px' ) );
 	qRow.add( q );

editor/js/Sidebar.Geometry.TubeGeometry.js

@@ -7,27 +7,27 @@ import { SetGeometryCommand } from './commands/SetGeometryCommand.js';
 
 function GeometryParametersPanel( editor, object ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIRow();
+	const container = new UIRow();
 
-	var geometry = object.geometry;
-	var parameters = geometry.parameters;
+	const geometry = object.geometry;
+	const parameters = geometry.parameters;
 
 	// points
 
-	var pointsRow = new UIRow();
+	const pointsRow = new UIRow();
 	pointsRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/path' ) ).setWidth( '90px' ) );
 
-	var points = new UIPoints3().setValue( parameters.path.points ).onChange( update );
+	const points = new UIPoints3().setValue( parameters.path.points ).onChange( update );
 	pointsRow.add( points );
 
 	container.add( pointsRow );
 
 	// radius
 
-	var radiusRow = new UIRow();
-	var radius = new UINumber( parameters.radius ).onChange( update );
+	const radiusRow = new UIRow();
+	const radius = new UINumber( parameters.radius ).onChange( update );
 
 	radiusRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/radius' ) ).setWidth( '90px' ) );
 	radiusRow.add( radius );
@@ -36,8 +36,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// tubularSegments
 
-	var tubularSegmentsRow = new UIRow();
-	var tubularSegments = new UIInteger( parameters.tubularSegments ).onChange( update );
+	const tubularSegmentsRow = new UIRow();
+	const tubularSegments = new UIInteger( parameters.tubularSegments ).onChange( update );
 
 	tubularSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/tubularsegments' ) ).setWidth( '90px' ) );
 	tubularSegmentsRow.add( tubularSegments );
@@ -46,8 +46,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// radialSegments
 
-	var radialSegmentsRow = new UIRow();
-	var radialSegments = new UIInteger( parameters.radialSegments ).onChange( update );
+	const radialSegmentsRow = new UIRow();
+	const radialSegments = new UIInteger( parameters.radialSegments ).onChange( update );
 
 	radialSegmentsRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/radialsegments' ) ).setWidth( '90px' ) );
 	radialSegmentsRow.add( radialSegments );
@@ -56,8 +56,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// closed
 
-	var closedRow = new UIRow();
-	var closed = new UICheckbox( parameters.closed ).onChange( update );
+	const closedRow = new UIRow();
+	const closed = new UICheckbox( parameters.closed ).onChange( update );
 
 	closedRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/closed' ) ).setWidth( '90px' ) );
 	closedRow.add( closed );
@@ -66,8 +66,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// curveType
 
-	var curveTypeRow = new UIRow();
-	var curveType = new UISelect().setOptions( { centripetal: 'centripetal', chordal: 'chordal', catmullrom: 'catmullrom' } ).setValue( parameters.path.curveType ).onChange( update );
+	const curveTypeRow = new UIRow();
+	const curveType = new UISelect().setOptions( { centripetal: 'centripetal', chordal: 'chordal', catmullrom: 'catmullrom' } ).setValue( parameters.path.curveType ).onChange( update );
 
 	curveTypeRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/curvetype' ) ).setWidth( '90px' ), curveType );
 
@@ -75,8 +75,8 @@ function GeometryParametersPanel( editor, object ) {
 
 	// tension
 
-	var tensionRow = new UIRow().setDisplay( curveType.getValue() == 'catmullrom' ? '' : 'none' );
-	var tension = new UINumber( parameters.path.tension ).setStep( 0.01 ).onChange( update );
+	const tensionRow = new UIRow().setDisplay( curveType.getValue() == 'catmullrom' ? '' : 'none' );
+	const tension = new UINumber( parameters.path.tension ).setStep( 0.01 ).onChange( update );
 
 	tensionRow.add( new UIText( strings.getKey( 'sidebar/geometry/tube_geometry/tension' ) ).setWidth( '90px' ), tension );
 

editor/js/Sidebar.Geometry.js

@@ -11,21 +11,21 @@ import { VertexNormalsHelper } from '../../examples/jsm/helpers/VertexNormalsHel
 
 function SidebarGeometry( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setBorderTop( '0' );
 	container.setDisplay( 'none' );
 	container.setPaddingTop( '20px' );
 
-	var currentGeometryType = null;
+	let currentGeometryType = null;
 
 	// Actions
 
 	/*
-	var objectActions = new UISelect().setPosition( 'absolute' ).setRight( '8px' ).setFontSize( '11px' );
+	let objectActions = new UISelect().setPosition( 'absolute' ).setRight( '8px' ).setFontSize( '11px' );
 	objectActions.setOptions( {
 
 		'Actions': 'Actions',
@@ -41,10 +41,10 @@ function SidebarGeometry( editor ) {
 	} );
 	objectActions.onChange( function ( event ) {
 
-		var action = this.getValue();
+		let action = this.getValue();
 
-		var object = editor.selected;
-		var geometry = object.geometry;
+		let object = editor.selected;
+		let geometry = object.geometry;
 
 		if ( confirm( action + ' ' + object.name + '?' ) === false ) return;
 
@@ -52,9 +52,9 @@ function SidebarGeometry( editor ) {
 
 			case 'Center':
 
-				var offset = geometry.center();
+				let offset = geometry.center();
 
-				var newPosition = object.position.clone();
+				let newPosition = object.position.clone();
 				newPosition.sub( offset );
 				editor.execute( new SetPositionCommand( editor, object, newPosition ) );
 
@@ -64,11 +64,11 @@ function SidebarGeometry( editor ) {
 
 			case 'Flatten':
 
-				var newGeometry = geometry.clone();
+				let newGeometry = geometry.clone();
 				newGeometry.uuid = geometry.uuid;
 				newGeometry.applyMatrix( object.matrix );
 
-				var cmds = [ new SetGeometryCommand( editor, object, newGeometry ),
+				let cmds = [ new SetGeometryCommand( editor, object, newGeometry ),
 					new SetPositionCommand( editor, object, new THREE.Vector3( 0, 0, 0 ) ),
 					new SetRotationCommand( editor, object, new THREE.Euler( 0, 0, 0 ) ),
 					new SetScaleCommand( editor, object, new THREE.Vector3( 1, 1, 1 ) ) ];
@@ -87,8 +87,8 @@ function SidebarGeometry( editor ) {
 
 	// type
 
-	var geometryTypeRow = new UIRow();
-	var geometryType = new UIText();
+	const geometryTypeRow = new UIRow();
+	const geometryType = new UIText();
 
 	geometryTypeRow.add( new UIText( strings.getKey( 'sidebar/geometry/type' ) ).setWidth( '90px' ) );
 	geometryTypeRow.add( geometryType );
@@ -97,9 +97,9 @@ function SidebarGeometry( editor ) {
 
 	// uuid
 
-	var geometryUUIDRow = new UIRow();
-	var geometryUUID = new UIInput().setWidth( '102px' ).setFontSize( '12px' ).setDisabled( true );
-	var geometryUUIDRenew = new UIButton( strings.getKey( 'sidebar/geometry/new' ) ).setMarginLeft( '7px' ).onClick( function () {
+	const geometryUUIDRow = new UIRow();
+	const geometryUUID = new UIInput().setWidth( '102px' ).setFontSize( '12px' ).setDisabled( true );
+	const geometryUUIDRenew = new UIButton( strings.getKey( 'sidebar/geometry/new' ) ).setMarginLeft( '7px' ).onClick( function () {
 
 		geometryUUID.setValue( THREE.MathUtils.generateUUID() );
 
@@ -115,8 +115,8 @@ function SidebarGeometry( editor ) {
 
 	// name
 
-	var geometryNameRow = new UIRow();
-	var geometryName = new UIInput().setWidth( '150px' ).setFontSize( '12px' ).onChange( function () {
+	const geometryNameRow = new UIRow();
+	const geometryName = new UIInput().setWidth( '150px' ).setFontSize( '12px' ).onChange( function () {
 
 		editor.execute( new SetGeometryValueCommand( editor, editor.selected, 'name', geometryName.getValue() ) );
 
@@ -129,7 +129,7 @@ function SidebarGeometry( editor ) {
 
 	// parameters
 
-	var parameters = new UISpan();
+	const parameters = new UISpan();
 	container.add( parameters );
 
 	// buffergeometry
@@ -138,24 +138,24 @@ function SidebarGeometry( editor ) {
 
 	// Size
 
-	var geometryBoundingBox = new UIText().setFontSize( '12px' ).setVerticalAlign( 'middle' );
+	const geometryBoundingBox = new UIText().setFontSize( '12px' ).setVerticalAlign( 'middle' );
 
 	container.add( new UIText( strings.getKey( 'sidebar/geometry/bounds' ) ).setWidth( '90px' ) );
 	container.add( geometryBoundingBox );
 
 	// Helpers
 
-	var helpersRow = new UIRow().setMarginTop( '16px' ).setPaddingLeft( '90px' );
+	const helpersRow = new UIRow().setMarginTop( '16px' ).setPaddingLeft( '90px' );
 	container.add( helpersRow );
 
-	var vertexNormalsButton = new UIButton( strings.getKey( 'sidebar/geometry/show_vertex_normals' ) );
+	const vertexNormalsButton = new UIButton( strings.getKey( 'sidebar/geometry/show_vertex_normals' ) );
 	vertexNormalsButton.onClick( function () {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( editor.helpers[ object.id ] === undefined ) {
 
-			var helper = new VertexNormalsHelper( object );
+			const helper = new VertexNormalsHelper( object );
 			editor.addHelper( object, helper );
 
 		} else {
@@ -171,11 +171,11 @@ function SidebarGeometry( editor ) {
 
 	async function build() {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object && object.geometry ) {
 
-			var geometry = object.geometry;
+			const geometry = object.geometry;
 
 			container.setDisplay( 'block' );
 
@@ -196,7 +196,7 @@ function SidebarGeometry( editor ) {
 
 				} else {
 
-					var { GeometryParametersPanel } = await import( `./Sidebar.Geometry.${ geometry.type }.js` );
+					const { GeometryParametersPanel } = await import( `./Sidebar.Geometry.${ geometry.type }.js` );
 
 					parameters.add( new GeometryParametersPanel( editor, object ) );
 

editor/js/Sidebar.Object.js

@@ -12,11 +12,11 @@ import { SetColorCommand } from './commands/SetColorCommand.js';
 
 function SidebarObject( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setBorderTop( '0' );
 	container.setPaddingTop( '20px' );
 	container.setDisplay( 'none' );
@@ -24,7 +24,7 @@ function SidebarObject( editor ) {
 	// Actions
 
 	/*
-	var objectActions = new UI.Select().setPosition( 'absolute' ).setRight( '8px' ).setFontSize( '11px' );
+	let objectActions = new UI.Select().setPosition( 'absolute' ).setRight( '8px' ).setFontSize( '11px' );
 	objectActions.setOptions( {
 
 		'Actions': 'Actions',
@@ -40,7 +40,7 @@ function SidebarObject( editor ) {
 	} );
 	objectActions.onChange( function ( event ) {
 
-		var object = editor.selected;
+		let object = editor.selected;
 
 		switch ( this.getValue() ) {
 
@@ -66,8 +66,8 @@ function SidebarObject( editor ) {
 
 	// type
 
-	var objectTypeRow = new UIRow();
-	var objectType = new UIText();
+	const objectTypeRow = new UIRow();
+	const objectType = new UIText();
 
 	objectTypeRow.add( new UIText( strings.getKey( 'sidebar/object/type' ) ).setWidth( '90px' ) );
 	objectTypeRow.add( objectType );
@@ -76,9 +76,9 @@ function SidebarObject( editor ) {
 
 	// uuid
 
-	var objectUUIDRow = new UIRow();
-	var objectUUID = new UIInput().setWidth( '102px' ).setFontSize( '12px' ).setDisabled( true );
-	var objectUUIDRenew = new UIButton( strings.getKey( 'sidebar/object/new' ) ).setMarginLeft( '7px' ).onClick( function () {
+	const objectUUIDRow = new UIRow();
+	const objectUUID = new UIInput().setWidth( '102px' ).setFontSize( '12px' ).setDisabled( true );
+	const objectUUIDRenew = new UIButton( strings.getKey( 'sidebar/object/new' ) ).setMarginLeft( '7px' ).onClick( function () {
 
 		objectUUID.setValue( THREE.MathUtils.generateUUID() );
 
@@ -94,8 +94,8 @@ function SidebarObject( editor ) {
 
 	// name
 
-	var objectNameRow = new UIRow();
-	var objectName = new UIInput().setWidth( '150px' ).setFontSize( '12px' ).onChange( function () {
+	const objectNameRow = new UIRow();
+	const objectName = new UIInput().setWidth( '150px' ).setFontSize( '12px' ).onChange( function () {
 
 		editor.execute( new SetValueCommand( editor, editor.selected, 'name', objectName.getValue() ) );
 
@@ -108,10 +108,10 @@ function SidebarObject( editor ) {
 
 	// position
 
-	var objectPositionRow = new UIRow();
-	var objectPositionX = new UINumber().setPrecision( 3 ).setWidth( '50px' ).onChange( update );
-	var objectPositionY = new UINumber().setPrecision( 3 ).setWidth( '50px' ).onChange( update );
-	var objectPositionZ = new UINumber().setPrecision( 3 ).setWidth( '50px' ).onChange( update );
+	const objectPositionRow = new UIRow();
+	const objectPositionX = new UINumber().setPrecision( 3 ).setWidth( '50px' ).onChange( update );
+	const objectPositionY = new UINumber().setPrecision( 3 ).setWidth( '50px' ).onChange( update );
+	const objectPositionZ = new UINumber().setPrecision( 3 ).setWidth( '50px' ).onChange( update );
 
 	objectPositionRow.add( new UIText( strings.getKey( 'sidebar/object/position' ) ).setWidth( '90px' ) );
 	objectPositionRow.add( objectPositionX, objectPositionY, objectPositionZ );
@@ -120,10 +120,10 @@ function SidebarObject( editor ) {
 
 	// rotation
 
-	var objectRotationRow = new UIRow();
-	var objectRotationX = new UINumber().setStep( 10 ).setNudge( 0.1 ).setUnit( '°' ).setWidth( '50px' ).onChange( update );
-	var objectRotationY = new UINumber().setStep( 10 ).setNudge( 0.1 ).setUnit( '°' ).setWidth( '50px' ).onChange( update );
-	var objectRotationZ = new UINumber().setStep( 10 ).setNudge( 0.1 ).setUnit( '°' ).setWidth( '50px' ).onChange( update );
+	const objectRotationRow = new UIRow();
+	const objectRotationX = new UINumber().setStep( 10 ).setNudge( 0.1 ).setUnit( '°' ).setWidth( '50px' ).onChange( update );
+	const objectRotationY = new UINumber().setStep( 10 ).setNudge( 0.1 ).setUnit( '°' ).setWidth( '50px' ).onChange( update );
+	const objectRotationZ = new UINumber().setStep( 10 ).setNudge( 0.1 ).setUnit( '°' ).setWidth( '50px' ).onChange( update );
 
 	objectRotationRow.add( new UIText( strings.getKey( 'sidebar/object/rotation' ) ).setWidth( '90px' ) );
 	objectRotationRow.add( objectRotationX, objectRotationY, objectRotationZ );
@@ -132,10 +132,10 @@ function SidebarObject( editor ) {
 
 	// scale
 
-	var objectScaleRow = new UIRow();
-	var objectScaleX = new UINumber( 1 ).setPrecision( 3 ).setWidth( '50px' ).onChange( update );
-	var objectScaleY = new UINumber( 1 ).setPrecision( 3 ).setWidth( '50px' ).onChange( update );
-	var objectScaleZ = new UINumber( 1 ).setPrecision( 3 ).setWidth( '50px' ).onChange( update );
+	const objectScaleRow = new UIRow();
+	const objectScaleX = new UINumber( 1 ).setPrecision( 3 ).setWidth( '50px' ).onChange( update );
+	const objectScaleY = new UINumber( 1 ).setPrecision( 3 ).setWidth( '50px' ).onChange( update );
+	const objectScaleZ = new UINumber( 1 ).setPrecision( 3 ).setWidth( '50px' ).onChange( update );
 
 	objectScaleRow.add( new UIText( strings.getKey( 'sidebar/object/scale' ) ).setWidth( '90px' ) );
 	objectScaleRow.add( objectScaleX, objectScaleY, objectScaleZ );
@@ -144,8 +144,8 @@ function SidebarObject( editor ) {
 
 	// fov
 
-	var objectFovRow = new UIRow();
-	var objectFov = new UINumber().onChange( update );
+	const objectFovRow = new UIRow();
+	const objectFov = new UINumber().onChange( update );
 
 	objectFovRow.add( new UIText( strings.getKey( 'sidebar/object/fov' ) ).setWidth( '90px' ) );
 	objectFovRow.add( objectFov );
@@ -154,8 +154,8 @@ function SidebarObject( editor ) {
 
 	// left
 
-	var objectLeftRow = new UIRow();
-	var objectLeft = new UINumber().onChange( update );
+	const objectLeftRow = new UIRow();
+	const objectLeft = new UINumber().onChange( update );
 
 	objectLeftRow.add( new UIText( strings.getKey( 'sidebar/object/left' ) ).setWidth( '90px' ) );
 	objectLeftRow.add( objectLeft );
@@ -164,8 +164,8 @@ function SidebarObject( editor ) {
 
 	// right
 
-	var objectRightRow = new UIRow();
-	var objectRight = new UINumber().onChange( update );
+	const objectRightRow = new UIRow();
+	const objectRight = new UINumber().onChange( update );
 
 	objectRightRow.add( new UIText( strings.getKey( 'sidebar/object/right' ) ).setWidth( '90px' ) );
 	objectRightRow.add( objectRight );
@@ -174,8 +174,8 @@ function SidebarObject( editor ) {
 
 	// top
 
-	var objectTopRow = new UIRow();
-	var objectTop = new UINumber().onChange( update );
+	const objectTopRow = new UIRow();
+	const objectTop = new UINumber().onChange( update );
 
 	objectTopRow.add( new UIText( strings.getKey( 'sidebar/object/top' ) ).setWidth( '90px' ) );
 	objectTopRow.add( objectTop );
@@ -184,8 +184,8 @@ function SidebarObject( editor ) {
 
 	// bottom
 
-	var objectBottomRow = new UIRow();
-	var objectBottom = new UINumber().onChange( update );
+	const objectBottomRow = new UIRow();
+	const objectBottom = new UINumber().onChange( update );
 
 	objectBottomRow.add( new UIText( strings.getKey( 'sidebar/object/bottom' ) ).setWidth( '90px' ) );
 	objectBottomRow.add( objectBottom );
@@ -194,8 +194,8 @@ function SidebarObject( editor ) {
 
 	// near
 
-	var objectNearRow = new UIRow();
-	var objectNear = new UINumber().onChange( update );
+	const objectNearRow = new UIRow();
+	const objectNear = new UINumber().onChange( update );
 
 	objectNearRow.add( new UIText( strings.getKey( 'sidebar/object/near' ) ).setWidth( '90px' ) );
 	objectNearRow.add( objectNear );
@@ -204,8 +204,8 @@ function SidebarObject( editor ) {
 
 	// far
 
-	var objectFarRow = new UIRow();
-	var objectFar = new UINumber().onChange( update );
+	const objectFarRow = new UIRow();
+	const objectFar = new UINumber().onChange( update );
 
 	objectFarRow.add( new UIText( strings.getKey( 'sidebar/object/far' ) ).setWidth( '90px' ) );
 	objectFarRow.add( objectFar );
@@ -214,8 +214,8 @@ function SidebarObject( editor ) {
 
 	// intensity
 
-	var objectIntensityRow = new UIRow();
-	var objectIntensity = new UINumber().onChange( update );
+	const objectIntensityRow = new UIRow();
+	const objectIntensity = new UINumber().onChange( update );
 
 	objectIntensityRow.add( new UIText( strings.getKey( 'sidebar/object/intensity' ) ).setWidth( '90px' ) );
 	objectIntensityRow.add( objectIntensity );
@@ -224,8 +224,8 @@ function SidebarObject( editor ) {
 
 	// color
 
-	var objectColorRow = new UIRow();
-	var objectColor = new UIColor().onInput( update );
+	const objectColorRow = new UIRow();
+	const objectColor = new UIColor().onInput( update );
 
 	objectColorRow.add( new UIText( strings.getKey( 'sidebar/object/color' ) ).setWidth( '90px' ) );
 	objectColorRow.add( objectColor );
@@ -234,8 +234,8 @@ function SidebarObject( editor ) {
 
 	// ground color
 
-	var objectGroundColorRow = new UIRow();
-	var objectGroundColor = new UIColor().onInput( update );
+	const objectGroundColorRow = new UIRow();
+	const objectGroundColor = new UIColor().onInput( update );
 
 	objectGroundColorRow.add( new UIText( strings.getKey( 'sidebar/object/groundcolor' ) ).setWidth( '90px' ) );
 	objectGroundColorRow.add( objectGroundColor );
@@ -244,8 +244,8 @@ function SidebarObject( editor ) {
 
 	// distance
 
-	var objectDistanceRow = new UIRow();
-	var objectDistance = new UINumber().setRange( 0, Infinity ).onChange( update );
+	const objectDistanceRow = new UIRow();
+	const objectDistance = new UINumber().setRange( 0, Infinity ).onChange( update );
 
 	objectDistanceRow.add( new UIText( strings.getKey( 'sidebar/object/distance' ) ).setWidth( '90px' ) );
 	objectDistanceRow.add( objectDistance );
@@ -254,8 +254,8 @@ function SidebarObject( editor ) {
 
 	// angle
 
-	var objectAngleRow = new UIRow();
-	var objectAngle = new UINumber().setPrecision( 3 ).setRange( 0, Math.PI / 2 ).onChange( update );
+	const objectAngleRow = new UIRow();
+	const objectAngle = new UINumber().setPrecision( 3 ).setRange( 0, Math.PI / 2 ).onChange( update );
 
 	objectAngleRow.add( new UIText( strings.getKey( 'sidebar/object/angle' ) ).setWidth( '90px' ) );
 	objectAngleRow.add( objectAngle );
@@ -264,8 +264,8 @@ function SidebarObject( editor ) {
 
 	// penumbra
 
-	var objectPenumbraRow = new UIRow();
-	var objectPenumbra = new UINumber().setRange( 0, 1 ).onChange( update );
+	const objectPenumbraRow = new UIRow();
+	const objectPenumbra = new UINumber().setRange( 0, 1 ).onChange( update );
 
 	objectPenumbraRow.add( new UIText( strings.getKey( 'sidebar/object/penumbra' ) ).setWidth( '90px' ) );
 	objectPenumbraRow.add( objectPenumbra );
@@ -274,8 +274,8 @@ function SidebarObject( editor ) {
 
 	// decay
 
-	var objectDecayRow = new UIRow();
-	var objectDecay = new UINumber().setRange( 0, Infinity ).onChange( update );
+	const objectDecayRow = new UIRow();
+	const objectDecay = new UINumber().setRange( 0, Infinity ).onChange( update );
 
 	objectDecayRow.add( new UIText( strings.getKey( 'sidebar/object/decay' ) ).setWidth( '90px' ) );
 	objectDecayRow.add( objectDecay );
@@ -284,55 +284,55 @@ function SidebarObject( editor ) {
 
 	// shadow
 
-	var objectShadowRow = new UIRow();
+	const objectShadowRow = new UIRow();
 
 	objectShadowRow.add( new UIText( strings.getKey( 'sidebar/object/shadow' ) ).setWidth( '90px' ) );
 
-	var objectCastShadow = new UIBoolean( false, strings.getKey( 'sidebar/object/cast' ) ).onChange( update );
+	const objectCastShadow = new UIBoolean( false, strings.getKey( 'sidebar/object/cast' ) ).onChange( update );
 	objectShadowRow.add( objectCastShadow );
 
-	var objectReceiveShadow = new UIBoolean( false, strings.getKey( 'sidebar/object/receive' ) ).onChange( update );
+	const objectReceiveShadow = new UIBoolean( false, strings.getKey( 'sidebar/object/receive' ) ).onChange( update );
 	objectShadowRow.add( objectReceiveShadow );
 
 	container.add( objectShadowRow );
 
 	// shadow bias
 
-	var objectShadowBiasRow = new UIRow();
+	const objectShadowBiasRow = new UIRow();
 
 	objectShadowBiasRow.add( new UIText( strings.getKey( 'sidebar/object/shadowBias' ) ).setWidth( '90px' ) );
 
-	var objectShadowBias = new UINumber( 0 ).setPrecision( 5 ).setStep( 0.0001 ).setNudge( 0.00001 ).onChange( update );
+	const objectShadowBias = new UINumber( 0 ).setPrecision( 5 ).setStep( 0.0001 ).setNudge( 0.00001 ).onChange( update );
 	objectShadowBiasRow.add( objectShadowBias );
 
 	container.add( objectShadowBiasRow );
 
 	// shadow normal offset
 
-	var objectShadowNormalBiasRow = new UIRow();
+	const objectShadowNormalBiasRow = new UIRow();
 
 	objectShadowNormalBiasRow.add( new UIText( strings.getKey( 'sidebar/object/shadowNormalBias' ) ).setWidth( '90px' ) );
 
-	var objectShadowNormalBias = new UINumber( 0 ).onChange( update );
+	const objectShadowNormalBias = new UINumber( 0 ).onChange( update );
 	objectShadowNormalBiasRow.add( objectShadowNormalBias );
 
 	container.add( objectShadowNormalBiasRow );
 
 	// shadow radius
 
-	var objectShadowRadiusRow = new UIRow();
+	const objectShadowRadiusRow = new UIRow();
 
 	objectShadowRadiusRow.add( new UIText( strings.getKey( 'sidebar/object/shadowRadius' ) ).setWidth( '90px' ) );
 
-	var objectShadowRadius = new UINumber( 1 ).onChange( update );
+	const objectShadowRadius = new UINumber( 1 ).onChange( update );
 	objectShadowRadiusRow.add( objectShadowRadius );
 
 	container.add( objectShadowRadiusRow );
 
 	// visible
 
-	var objectVisibleRow = new UIRow();
-	var objectVisible = new UICheckbox().onChange( update );
+	const objectVisibleRow = new UIRow();
+	const objectVisible = new UICheckbox().onChange( update );
 
 	objectVisibleRow.add( new UIText( strings.getKey( 'sidebar/object/visible' ) ).setWidth( '90px' ) );
 	objectVisibleRow.add( objectVisible );
@@ -341,8 +341,8 @@ function SidebarObject( editor ) {
 
 	// frustumCulled
 
-	var objectFrustumCulledRow = new UIRow();
-	var objectFrustumCulled = new UICheckbox().onChange( update );
+	const objectFrustumCulledRow = new UIRow();
+	const objectFrustumCulled = new UICheckbox().onChange( update );
 
 	objectFrustumCulledRow.add( new UIText( strings.getKey( 'sidebar/object/frustumcull' ) ).setWidth( '90px' ) );
 	objectFrustumCulledRow.add( objectFrustumCulled );
@@ -351,8 +351,8 @@ function SidebarObject( editor ) {
 
 	// renderOrder
 
-	var objectRenderOrderRow = new UIRow();
-	var objectRenderOrder = new UIInteger().setWidth( '50px' ).onChange( update );
+	const objectRenderOrderRow = new UIRow();
+	const objectRenderOrder = new UIInteger().setWidth( '50px' ).onChange( update );
 
 	objectRenderOrderRow.add( new UIText( strings.getKey( 'sidebar/object/renderorder' ) ).setWidth( '90px' ) );
 	objectRenderOrderRow.add( objectRenderOrder );
@@ -361,8 +361,8 @@ function SidebarObject( editor ) {
 
 	// user data
 
-	var objectUserDataRow = new UIRow();
-	var objectUserData = new UITextArea().setWidth( '150px' ).setHeight( '40px' ).setFontSize( '12px' ).onChange( update );
+	const objectUserDataRow = new UIRow();
+	const objectUserData = new UITextArea().setWidth( '150px' ).setHeight( '40px' ).setFontSize( '12px' ).onChange( update );
 	objectUserData.onKeyUp( function () {
 
 		try {
@@ -391,25 +391,25 @@ function SidebarObject( editor ) {
 
 	function update() {
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object !== null ) {
 
-			var newPosition = new THREE.Vector3( objectPositionX.getValue(), objectPositionY.getValue(), objectPositionZ.getValue() );
+			const newPosition = new THREE.Vector3( objectPositionX.getValue(), objectPositionY.getValue(), objectPositionZ.getValue() );
 			if ( object.position.distanceTo( newPosition ) >= 0.01 ) {
 
 				editor.execute( new SetPositionCommand( editor, object, newPosition ) );
 
 			}
 
-			var newRotation = new THREE.Euler( objectRotationX.getValue() * THREE.MathUtils.DEG2RAD, objectRotationY.getValue() * THREE.MathUtils.DEG2RAD, objectRotationZ.getValue() * THREE.MathUtils.DEG2RAD );
+			const newRotation = new THREE.Euler( objectRotationX.getValue() * THREE.MathUtils.DEG2RAD, objectRotationY.getValue() * THREE.MathUtils.DEG2RAD, objectRotationZ.getValue() * THREE.MathUtils.DEG2RAD );
 			if ( object.rotation.toVector3().distanceTo( newRotation.toVector3() ) >= 0.01 ) {
 
 				editor.execute( new SetRotationCommand( editor, object, newRotation ) );
 
 			}
 
-			var newScale = new THREE.Vector3( objectScaleX.getValue(), objectScaleY.getValue(), objectScaleZ.getValue() );
+			const newScale = new THREE.Vector3( objectScaleX.getValue(), objectScaleY.getValue(), objectScaleZ.getValue() );
 			if ( object.scale.distanceTo( newScale ) >= 0.01 ) {
 
 				editor.execute( new SetScaleCommand( editor, object, newScale ) );
@@ -570,7 +570,7 @@ function SidebarObject( editor ) {
 
 			try {
 
-				var userData = JSON.parse( objectUserData.getValue() );
+				const userData = JSON.parse( objectUserData.getValue() );
 				if ( JSON.stringify( object.userData ) != JSON.stringify( userData ) ) {
 
 					editor.execute( new SetValueCommand( editor, object, 'userData', userData ) );
@@ -589,7 +589,7 @@ function SidebarObject( editor ) {
 
 	function updateRows( object ) {
 
-		var properties = {
+		const properties = {
 			'fov': objectFovRow,
 			'left': objectLeftRow,
 			'right': objectRightRow,
@@ -609,13 +609,13 @@ function SidebarObject( editor ) {
 			'shadow': [ objectShadowBiasRow, objectShadowNormalBiasRow, objectShadowRadiusRow ]
 		};
 
-		for ( var property in properties ) {
+		for ( const property in properties ) {
 
-			var uiElement = properties[ property ];
+			const uiElement = properties[ property ];
 
 			if ( Array.isArray( uiElement ) === true ) {
 
-				for ( var i = 0; i < uiElement.length; i ++ ) {
+				for ( let i = 0; i < uiElement.length; i ++ ) {
 
 					uiElement[ i ].setDisplay( object[ property ] !== undefined ? '' : 'none' );
 

editor/js/Sidebar.Project.Materials.js

@@ -4,38 +4,38 @@ import { SetMaterialCommand } from './commands/SetMaterialCommand.js';
 
 function SidebarProjectMaterials( editor ) {
 
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 
-	var headerRow = new UIRow();
+	const headerRow = new UIRow();
 	headerRow.add( new UIText( strings.getKey( 'sidebar/project/materials' ).toUpperCase() ) );
 
 	container.add( headerRow );
 
-	var listbox = new UIListbox();
+	const listbox = new UIListbox();
 	container.add( listbox );
 
 	container.add( new UIBreak() );
 
-	var buttonsRow = new UIRow();
+	const buttonsRow = new UIRow();
 	container.add( buttonsRow );
 
-	var assignMaterial = new UIButton( strings.getKey( 'sidebar/project/Assign' ) );
+	const assignMaterial = new UIButton( strings.getKey( 'sidebar/project/Assign' ) );
 	assignMaterial.onClick( function () {
 
-		var selectedObject = editor.selected;
+		const selectedObject = editor.selected;
 
 		if ( selectedObject !== null ) {
 
-			var oldMaterial = selectedObject.material;
+			const oldMaterial = selectedObject.material;
 
 			// only assing materials to objects with a material property (e.g. avoid assigning material to THREE.Group)
 
 			if ( oldMaterial !== undefined ) {
 
-				var material = editor.getMaterialById( parseInt( listbox.getValue() ) );
+				const material = editor.getMaterialById( parseInt( listbox.getValue() ) );
 
 				if ( material !== undefined ) {
 
@@ -64,7 +64,7 @@ function SidebarProjectMaterials( editor ) {
 
 		if ( object !== null ) {
 
-			var index = Object.values( editor.materials ).indexOf( object.material );
+			const index = Object.values( editor.materials ).indexOf( object.material );
 			listbox.selectIndex( index );
 
 		}

editor/js/Sidebar.Project.Renderer.js

@@ -5,36 +5,36 @@ import { UIBoolean } from './libs/ui.three.js';
 
 function SidebarProjectRenderer( editor ) {
 
-	var config = editor.config;
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const config = editor.config;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var currentRenderer = null;
+	let currentRenderer = null;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 
-	var headerRow = new UIRow();
+	const headerRow = new UIRow();
 	headerRow.add( new UIText( strings.getKey( 'sidebar/project/renderer' ).toUpperCase() ) );
 	container.add( headerRow );
 
 	// Antialias
 
-	var antialiasRow = new UIRow();
+	const antialiasRow = new UIRow();
 	container.add( antialiasRow );
 
 	antialiasRow.add( new UIText( strings.getKey( 'sidebar/project/antialias' ) ).setWidth( '90px' ) );
 
-	var antialiasBoolean = new UIBoolean( config.getKey( 'project/renderer/antialias' ) ).onChange( createRenderer );
+	const antialiasBoolean = new UIBoolean( config.getKey( 'project/renderer/antialias' ) ).onChange( createRenderer );
 	antialiasRow.add( antialiasBoolean );
 
 	// Physically Correct lights
 
-	var physicallyCorrectLightsRow = new UIRow();
+	const physicallyCorrectLightsRow = new UIRow();
 	container.add( physicallyCorrectLightsRow );
 
 	physicallyCorrectLightsRow.add( new UIText( strings.getKey( 'sidebar/project/physicallyCorrectLights' ) ).setWidth( '90px' ) );
 
-	var physicallyCorrectLightsBoolean = new UIBoolean( config.getKey( 'project/renderer/physicallyCorrectLights' ) ).onChange( function () {
+	const physicallyCorrectLightsBoolean = new UIBoolean( config.getKey( 'project/renderer/physicallyCorrectLights' ) ).onChange( function () {
 
 		currentRenderer.physicallyCorrectLights = this.getValue();
 		signals.rendererUpdated.dispatch();
@@ -44,15 +44,15 @@ function SidebarProjectRenderer( editor ) {
 
 	// Shadows
 
-	var shadowsRow = new UIRow();
+	const shadowsRow = new UIRow();
 	container.add( shadowsRow );
 
 	shadowsRow.add( new UIText( strings.getKey( 'sidebar/project/shadows' ) ).setWidth( '90px' ) );
 
-	var shadowsBoolean = new UIBoolean( config.getKey( 'project/renderer/shadows' ) ).onChange( updateShadows );
+	const shadowsBoolean = new UIBoolean( config.getKey( 'project/renderer/shadows' ) ).onChange( updateShadows );
 	shadowsRow.add( shadowsBoolean );
 
-	var shadowTypeSelect = new UISelect().setOptions( {
+	const shadowTypeSelect = new UISelect().setOptions( {
 		0: 'Basic',
 		1: 'PCF',
 		2: 'PCF Soft',
@@ -72,12 +72,12 @@ function SidebarProjectRenderer( editor ) {
 
 	// Tonemapping
 
-	var toneMappingRow = new UIRow();
+	const toneMappingRow = new UIRow();
 	container.add( toneMappingRow );
 
 	toneMappingRow.add( new UIText( strings.getKey( 'sidebar/project/toneMapping' ) ).setWidth( '90px' ) );
 
-	var toneMappingSelect = new UISelect().setOptions( {
+	const toneMappingSelect = new UISelect().setOptions( {
 		0: 'No',
 		1: 'Linear',
 		2: 'Reinhard',
@@ -87,7 +87,7 @@ function SidebarProjectRenderer( editor ) {
 	toneMappingSelect.setValue( config.getKey( 'project/renderer/toneMapping' ) );
 	toneMappingRow.add( toneMappingSelect );
 
-	var toneMappingExposure = new UINumber( config.getKey( 'project/renderer/toneMappingExposure' ) );
+	const toneMappingExposure = new UINumber( config.getKey( 'project/renderer/toneMappingExposure' ) );
 	toneMappingExposure.setDisplay( toneMappingSelect.getValue() === '0' ? 'none' : '' );
 	toneMappingExposure.setWidth( '30px' ).setMarginLeft( '10px' );
 	toneMappingExposure.setRange( 0, 10 );

editor/js/Sidebar.Project.Video.js

@@ -4,9 +4,9 @@ import { APP } from './libs/app.js';
 
 function SidebarProjectVideo( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'render' );
 
 	// Video
@@ -16,30 +16,30 @@ function SidebarProjectVideo( editor ) {
 
 	// Resolution
 
-	var resolutionRow = new UIRow();
+	const resolutionRow = new UIRow();
 	container.add( resolutionRow );
 
 	resolutionRow.add( new UIText( strings.getKey( 'sidebar/project/resolution' ) ).setWidth( '90px' ) );
 
-	var videoWidth = new UIInteger( 1024 ).setTextAlign( 'center' ).setWidth( '28px' );
+	const videoWidth = new UIInteger( 1024 ).setTextAlign( 'center' ).setWidth( '28px' );
 	resolutionRow.add( videoWidth );
 
 	resolutionRow.add( new UIText( '×' ).setTextAlign( 'center' ).setFontSize( '12px' ).setWidth( '12px' ) );
 
-	var videoHeight = new UIInteger( 1024 ).setTextAlign( 'center' ).setWidth( '28px' );
+	const videoHeight = new UIInteger( 1024 ).setTextAlign( 'center' ).setWidth( '28px' );
 	resolutionRow.add( videoHeight );
 
-	var videoFPS = new UIInteger( 30 ).setTextAlign( 'center' ).setWidth( '20px' );
+	const videoFPS = new UIInteger( 30 ).setTextAlign( 'center' ).setWidth( '20px' );
 	resolutionRow.add( videoFPS );
 
 	resolutionRow.add( new UIText( 'fps' ).setFontSize( '12px' ) );
 
 	// Duration
 
-	var videoDurationRow = new UIRow();
+	const videoDurationRow = new UIRow();
 	videoDurationRow.add( new UIText( strings.getKey( 'sidebar/project/duration' ) ).setWidth( '90px' ) );
 
-	var videoDuration = new UIInteger( 10 );
+	const videoDuration = new UIInteger( 10 );
 	videoDurationRow.add( videoDuration );
 
 	container.add( videoDurationRow );

editor/js/Sidebar.Project.js

@@ -6,21 +6,21 @@ import { SidebarProjectVideo } from './Sidebar.Project.Video.js';
 
 function SidebarProject( editor ) {
 
-	var config = editor.config;
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const config = editor.config;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UISpan();
+	const container = new UISpan();
 
-	var settings = new UIPanel();
+	const settings = new UIPanel();
 	settings.setBorderTop( '0' );
 	settings.setPaddingTop( '20px' );
 	container.add( settings );
 
 	// Title
 
-	var titleRow = new UIRow();
-	var title = new UIInput( config.getKey( 'project/title' ) ).setLeft( '100px' ).setWidth( '150px' ).onChange( function () {
+	const titleRow = new UIRow();
+	const title = new UIInput( config.getKey( 'project/title' ) ).setLeft( '100px' ).setWidth( '150px' ).onChange( function () {
 
 		config.setKey( 'project/title', this.getValue() );
 
@@ -33,8 +33,8 @@ function SidebarProject( editor ) {
 
 	// Editable
 
-	var editableRow = new UIRow();
-	var editable = new UICheckbox( config.getKey( 'project/editable' ) ).setLeft( '100px' ).onChange( function () {
+	const editableRow = new UIRow();
+	const editable = new UICheckbox( config.getKey( 'project/editable' ) ).setLeft( '100px' ).onChange( function () {
 
 		config.setKey( 'project/editable', this.getValue() );
 
@@ -47,8 +47,8 @@ function SidebarProject( editor ) {
 
 	// WebVR
 
-	var vrRow = new UIRow();
-	var vr = new UICheckbox( config.getKey( 'project/vr' ) ).setLeft( '100px' ).onChange( function () {
+	const vrRow = new UIRow();
+	const vr = new UICheckbox( config.getKey( 'project/vr' ) ).setLeft( '100px' ).onChange( function () {
 
 		config.setKey( 'project/vr', this.getValue() );
 

editor/js/Sidebar.Properties.js

@@ -6,9 +6,9 @@ import { SidebarMaterial } from './Sidebar.Material.js';
 
 function SidebarProperties( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UITabbedPanel();
+	const container = new UITabbedPanel();
 	container.setId( 'properties' );
 
 	container.addTab( 'object', strings.getKey( 'sidebar/properties/object' ), new SidebarObject( editor ) );

editor/js/Sidebar.Scene.js

@@ -5,20 +5,20 @@ import { UIOutliner, UITexture } from './libs/ui.three.js';
 
 function SidebarScene( editor ) {
 
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setBorderTop( '0' );
 	container.setPaddingTop( '20px' );
 
 	// outliner
 
-	var nodeStates = new WeakMap();
+	const nodeStates = new WeakMap();
 
 	function buildOption( object, draggable ) {
 
-		var option = document.createElement( 'div' );
+		const option = document.createElement( 'div' );
 		option.draggable = draggable;
 		option.innerHTML = buildHTML( object );
 		option.value = object.id;
@@ -27,9 +27,9 @@ function SidebarScene( editor ) {
 
 		if ( nodeStates.has( object ) ) {
 
-			var state = nodeStates.get( object );
+			const state = nodeStates.get( object );
 
-			var opener = document.createElement( 'span' );
+			const opener = document.createElement( 'span' );
 			opener.classList.add( 'opener' );
 
 			if ( object.children.length > 0 ) {
@@ -57,9 +57,9 @@ function SidebarScene( editor ) {
 
 		if ( Array.isArray( material ) ) {
 
-			var array = [];
+			const array = [];
 
-			for ( var i = 0; i < material.length; i ++ ) {
+			for ( let i = 0; i < material.length; i ++ ) {
 
 				array.push( material[ i ].name );
 
@@ -99,12 +99,12 @@ function SidebarScene( editor ) {
 
 	function buildHTML( object ) {
 
-		var html = `<span class="type ${ getObjectType( object ) }"></span> ${ escapeHTML( object.name ) }`;
+		let html = `<span class="type ${ getObjectType( object ) }"></span> ${ escapeHTML( object.name ) }`;
 
 		if ( object.isMesh ) {
 
-			var geometry = object.geometry;
-			var material = object.material;
+			const geometry = object.geometry;
+			const material = object.material;
 
 			html += ` <span class="type Geometry"></span> ${ escapeHTML( geometry.name ) }`;
 			html += ` <span class="type Material"></span> ${ escapeHTML( getMaterialName( material ) ) }`;
@@ -129,9 +129,9 @@ function SidebarScene( editor ) {
 
 	}
 
-	var ignoreObjectSelectedSignal = false;
+	let ignoreObjectSelectedSignal = false;
 
-	var outliner = new UIOutliner( editor );
+	const outliner = new UIOutliner( editor );
 	outliner.setId( 'outliner' );
 	outliner.onChange( function () {
 
@@ -152,9 +152,9 @@ function SidebarScene( editor ) {
 
 	// background
 
-	var backgroundRow = new UIRow();
+	const backgroundRow = new UIRow();
 
-	var backgroundType = new UISelect().setOptions( {
+	const backgroundType = new UISelect().setOptions( {
 
 		'None': '',
 		'Color': 'Color',
@@ -172,14 +172,14 @@ function SidebarScene( editor ) {
 	backgroundRow.add( new UIText( strings.getKey( 'sidebar/scene/background' ) ).setWidth( '90px' ) );
 	backgroundRow.add( backgroundType );
 
-	var backgroundColor = new UIColor().setValue( '#000000' ).setMarginLeft( '8px' ).onInput( onBackgroundChanged );
+	const backgroundColor = new UIColor().setValue( '#000000' ).setMarginLeft( '8px' ).onInput( onBackgroundChanged );
 	backgroundRow.add( backgroundColor );
 
-	var backgroundTexture = new UITexture().setMarginLeft( '8px' ).onChange( onBackgroundChanged );
+	const backgroundTexture = new UITexture().setMarginLeft( '8px' ).onChange( onBackgroundChanged );
 	backgroundTexture.setDisplay( 'none' );
 	backgroundRow.add( backgroundTexture );
 
-	var backgroundEquirectangularTexture = new UITexture().setMarginLeft( '8px' ).onChange( onBackgroundChanged );
+	const backgroundEquirectangularTexture = new UITexture().setMarginLeft( '8px' ).onChange( onBackgroundChanged );
 	backgroundEquirectangularTexture.setDisplay( 'none' );
 	backgroundRow.add( backgroundEquirectangularTexture );
 
@@ -198,7 +198,7 @@ function SidebarScene( editor ) {
 
 	function refreshBackgroundUI() {
 
-		var type = backgroundType.getValue();
+		const type = backgroundType.getValue();
 
 		backgroundType.setWidth( type === 'None' ? '150px' : '110px' );
 		backgroundColor.setDisplay( type === 'Color' ? '' : 'none' );
@@ -209,9 +209,9 @@ function SidebarScene( editor ) {
 
 	// environment
 
-	var environmentRow = new UIRow();
+	const environmentRow = new UIRow();
 
-	var environmentType = new UISelect().setOptions( {
+	const environmentType = new UISelect().setOptions( {
 
 		'None': '',
 		'Equirectangular': 'Equirect',
@@ -229,7 +229,7 @@ function SidebarScene( editor ) {
 	environmentRow.add( new UIText( strings.getKey( 'sidebar/scene/environment' ) ).setWidth( '90px' ) );
 	environmentRow.add( environmentType );
 
-	var environmentEquirectangularTexture = new UITexture().setMarginLeft( '8px' ).onChange( onEnvironmentChanged );
+	const environmentEquirectangularTexture = new UITexture().setMarginLeft( '8px' ).onChange( onEnvironmentChanged );
 	environmentEquirectangularTexture.setDisplay( 'none' );
 	environmentRow.add( environmentEquirectangularTexture );
 
@@ -246,7 +246,7 @@ function SidebarScene( editor ) {
 
 	function refreshEnvironmentUI() {
 
-		var type = environmentType.getValue();
+		const type = environmentType.getValue();
 
 		environmentType.setWidth( type !== 'Equirectangular' ? '150px' : '110px' );
 		environmentEquirectangularTexture.setDisplay( type === 'Equirectangular' ? '' : 'none' );
@@ -279,8 +279,8 @@ function SidebarScene( editor ) {
 
 	}
 
-	var fogTypeRow = new UIRow();
-	var fogType = new UISelect().setOptions( {
+	const fogTypeRow = new UIRow();
+	const fogType = new UISelect().setOptions( {
 
 		'None': '',
 		'Fog': 'Linear',
@@ -301,47 +301,47 @@ function SidebarScene( editor ) {
 
 	// fog color
 
-	var fogPropertiesRow = new UIRow();
+	const fogPropertiesRow = new UIRow();
 	fogPropertiesRow.setDisplay( 'none' );
 	fogPropertiesRow.setMarginLeft( '90px' );
 	container.add( fogPropertiesRow );
 
-	var fogColor = new UIColor().setValue( '#aaaaaa' );
+	const fogColor = new UIColor().setValue( '#aaaaaa' );
 	fogColor.onInput( onFogSettingsChanged );
 	fogPropertiesRow.add( fogColor );
 
 	// fog near
 
-	var fogNear = new UINumber( 0.1 ).setWidth( '40px' ).setRange( 0, Infinity ).onChange( onFogSettingsChanged );
+	const fogNear = new UINumber( 0.1 ).setWidth( '40px' ).setRange( 0, Infinity ).onChange( onFogSettingsChanged );
 	fogPropertiesRow.add( fogNear );
 
 	// fog far
 
-	var fogFar = new UINumber( 50 ).setWidth( '40px' ).setRange( 0, Infinity ).onChange( onFogSettingsChanged );
+	const fogFar = new UINumber( 50 ).setWidth( '40px' ).setRange( 0, Infinity ).onChange( onFogSettingsChanged );
 	fogPropertiesRow.add( fogFar );
 
 	// fog density
 
-	var fogDensity = new UINumber( 0.05 ).setWidth( '40px' ).setRange( 0, 0.1 ).setStep( 0.001 ).setPrecision( 3 ).onChange( onFogSettingsChanged );
+	const fogDensity = new UINumber( 0.05 ).setWidth( '40px' ).setRange( 0, 0.1 ).setStep( 0.001 ).setPrecision( 3 ).onChange( onFogSettingsChanged );
 	fogPropertiesRow.add( fogDensity );
 
 	//
 
 	function refreshUI() {
 
-		var camera = editor.camera;
-		var scene = editor.scene;
+		const camera = editor.camera;
+		const scene = editor.scene;
 
-		var options = [];
+		const options = [];
 
 		options.push( buildOption( camera, false ) );
 		options.push( buildOption( scene, false ) );
 
 		( function addObjects( objects, pad ) {
 
-			for ( var i = 0, l = objects.length; i < l; i ++ ) {
+			for ( let i = 0, l = objects.length; i < l; i ++ ) {
 
-				var object = objects[ i ];
+				const object = objects[ i ];
 
 				if ( nodeStates.has( object ) === false ) {
 
@@ -349,7 +349,7 @@ function SidebarScene( editor ) {
 
 				}
 
-				var option = buildOption( object, true );
+				const option = buildOption( object, true );
 				option.style.paddingLeft = ( pad * 18 ) + 'px';
 				options.push( option );
 
@@ -446,7 +446,7 @@ function SidebarScene( editor ) {
 
 	function refreshFogUI() {
 
-		var type = fogType.getValue();
+		const type = fogType.getValue();
 
 		fogPropertiesRow.setDisplay( type === 'None' ? 'none' : '' );
 		fogNear.setDisplay( type === 'Fog' ? '' : 'none' );
@@ -466,11 +466,11 @@ function SidebarScene( editor ) {
 	/*
 	signals.objectChanged.add( function ( object ) {
 
-		var options = outliner.options;
+		let options = outliner.options;
 
-		for ( var i = 0; i < options.length; i ++ ) {
+		for ( let i = 0; i < options.length; i ++ ) {
 
-			var option = options[ i ];
+			let option = options[ i ];
 
 			if ( option.value === object.id ) {
 

editor/js/Sidebar.Script.js

@@ -6,11 +6,11 @@ import { RemoveScriptCommand } from './commands/RemoveScriptCommand.js';
 
 function SidebarScript( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setDisplay( 'none' );
 
 	container.add( new UIText( strings.getKey( 'sidebar/script' ) ).setTextTransform( 'uppercase' ) );
@@ -19,20 +19,20 @@ function SidebarScript( editor ) {
 
 	//
 
-	var scriptsContainer = new UIRow();
+	const scriptsContainer = new UIRow();
 	container.add( scriptsContainer );
 
-	var newScript = new UIButton( strings.getKey( 'sidebar/script/new' ) );
+	const newScript = new UIButton( strings.getKey( 'sidebar/script/new' ) );
 	newScript.onClick( function () {
 
-		var script = { name: '', source: 'function update( event ) {}' };
+		const script = { name: '', source: 'function update( event ) {}' };
 		editor.execute( new AddScriptCommand( editor, editor.selected, script ) );
 
 	} );
 	container.add( newScript );
 
 	/*
-	var loadScript = new UI.Button( 'Load' );
+	let loadScript = new UI.Button( 'Load' );
 	loadScript.setMarginLeft( '4px' );
 	container.add( loadScript );
 	*/
@@ -44,7 +44,7 @@ function SidebarScript( editor ) {
 		scriptsContainer.clear();
 		scriptsContainer.setDisplay( 'none' );
 
-		var object = editor.selected;
+		const object = editor.selected;
 
 		if ( object === null ) {
 
@@ -52,17 +52,17 @@ function SidebarScript( editor ) {
 
 		}
 
-		var scripts = editor.scripts[ object.uuid ];
+		const scripts = editor.scripts[ object.uuid ];
 
 		if ( scripts !== undefined && scripts.length > 0 ) {
 
 			scriptsContainer.setDisplay( 'block' );
 
-			for ( var i = 0; i < scripts.length; i ++ ) {
+			for ( let i = 0; i < scripts.length; i ++ ) {
 
 				( function ( object, script ) {
 
-					var name = new UIInput( script.name ).setWidth( '130px' ).setFontSize( '12px' );
+					const name = new UIInput( script.name ).setWidth( '130px' ).setFontSize( '12px' );
 					name.onChange( function () {
 
 						editor.execute( new SetScriptValueCommand( editor, editor.selected, script, 'name', this.getValue() ) );
@@ -70,7 +70,7 @@ function SidebarScript( editor ) {
 					} );
 					scriptsContainer.add( name );
 
-					var edit = new UIButton( strings.getKey( 'sidebar/script/edit' ) );
+					const edit = new UIButton( strings.getKey( 'sidebar/script/edit' ) );
 					edit.setMarginLeft( '4px' );
 					edit.onClick( function () {
 
@@ -79,7 +79,7 @@ function SidebarScript( editor ) {
 					} );
 					scriptsContainer.add( edit );
 
-					var remove = new UIButton( strings.getKey( 'sidebar/script/remove' ) );
+					const remove = new UIButton( strings.getKey( 'sidebar/script/remove' ) );
 					remove.setMarginLeft( '4px' );
 					remove.onClick( function () {
 

editor/js/Sidebar.Settings.History.js

@@ -4,25 +4,25 @@ import { UIBoolean, UIOutliner } from './libs/ui.three.js';
 
 function SidebarSettingsHistory( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var config = editor.config;
+	const config = editor.config;
 
-	var history = editor.history;
+	const history = editor.history;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 
 	container.add( new UIText( strings.getKey( 'sidebar/history' ).toUpperCase() ) );
 
 	//
 
-	var persistent = new UIBoolean( config.getKey( 'settings/history' ), strings.getKey( 'sidebar/history/persistent' ) );
+	const persistent = new UIBoolean( config.getKey( 'settings/history' ), strings.getKey( 'sidebar/history/persistent' ) );
 	persistent.setPosition( 'absolute' ).setRight( '8px' );
 	persistent.onChange( function () {
 
-		var value = this.getValue();
+		const value = this.getValue();
 
 		config.setKey( 'settings/history', value );
 
@@ -30,8 +30,8 @@ function SidebarSettingsHistory( editor ) {
 
 			alert( 'The history will be preserved across sessions.\nThis can have an impact on performance when working with textures.' );
 
-			var lastUndoCmd = history.undos[ history.undos.length - 1 ];
-			var lastUndoId = ( lastUndoCmd !== undefined ) ? lastUndoCmd.id : 0;
+			const lastUndoCmd = history.undos[ history.undos.length - 1 ];
+			const lastUndoId = ( lastUndoCmd !== undefined ) ? lastUndoCmd.id : 0;
 			editor.history.enableSerialization( lastUndoId );
 
 		} else {
@@ -45,9 +45,9 @@ function SidebarSettingsHistory( editor ) {
 
 	container.add( new UIBreak(), new UIBreak() );
 
-	var ignoreObjectSelectedSignal = false;
+	let ignoreObjectSelectedSignal = false;
 
-	var outliner = new UIOutliner( editor );
+	const outliner = new UIOutliner( editor );
 	outliner.onChange( function () {
 
 		ignoreObjectSelectedSignal = true;
@@ -61,13 +61,13 @@ function SidebarSettingsHistory( editor ) {
 
 	//
 
-	var refreshUI = function () {
+	const refreshUI = function () {
 
-		var options = [];
+		const options = [];
 
 		function buildOption( object ) {
 
-			var option = document.createElement( 'div' );
+			const option = document.createElement( 'div' );
 			option.value = object.id;
 
 			return option;
@@ -76,11 +76,11 @@ function SidebarSettingsHistory( editor ) {
 
 		( function addObjects( objects ) {
 
-			for ( var i = 0, l = objects.length; i < l; i ++ ) {
+			for ( let i = 0, l = objects.length; i < l; i ++ ) {
 
-				var object = objects[ i ];
+				const object = objects[ i ];
 
-				var option = buildOption( object );
+				const option = buildOption( object );
 				option.innerHTML = '&nbsp;' + object.name;
 
 				options.push( option );
@@ -92,11 +92,11 @@ function SidebarSettingsHistory( editor ) {
 
 		( function addObjects( objects ) {
 
-			for ( var i = objects.length - 1; i >= 0; i -- ) {
+			for ( let i = objects.length - 1; i >= 0; i -- ) {
 
-				var object = objects[ i ];
+				const object = objects[ i ];
 
-				var option = buildOption( object );
+				const option = buildOption( object );
 				option.innerHTML = '&nbsp;' + object.name;
 				option.style.opacity = 0.3;
 

editor/js/Sidebar.Settings.Shortcuts.js

@@ -4,9 +4,9 @@ import { RemoveObjectCommand } from './commands/RemoveObjectCommand.js';
 
 function SidebarSettingsShortcuts( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var IS_MAC = navigator.platform.toUpperCase().indexOf( 'MAC' ) >= 0;
+	const IS_MAC = navigator.platform.toUpperCase().indexOf( 'MAC' ) >= 0;
 
 	function isValidKeyBinding( key ) {
 
@@ -14,28 +14,28 @@ function SidebarSettingsShortcuts( editor ) {
 
 	}
 
-	var config = editor.config;
-	var signals = editor.signals;
+	const config = editor.config;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 
-	var headerRow = new UIRow();
+	const headerRow = new UIRow();
 	headerRow.add( new UIText( strings.getKey( 'sidebar/settings/shortcuts' ).toUpperCase() ) );
 	container.add( headerRow );
 
-	var shortcuts = [ 'translate', 'rotate', 'scale', 'undo', 'focus' ];
+	const shortcuts = [ 'translate', 'rotate', 'scale', 'undo', 'focus' ];
 
 	function createShortcutInput( name ) {
 
-		var configName = 'settings/shortcuts/' + name;
-		var shortcutRow = new UIRow();
+		const configName = 'settings/shortcuts/' + name;
+		const shortcutRow = new UIRow();
 
-		var shortcutInput = new UIInput().setWidth( '15px' ).setFontSize( '12px' );
+		const shortcutInput = new UIInput().setWidth( '15px' ).setFontSize( '12px' );
 		shortcutInput.setTextAlign( 'center' );
 		shortcutInput.setTextTransform( 'lowercase' );
 		shortcutInput.onChange( function () {
 
-			var value = shortcutInput.getValue().toLowerCase();
+			const value = shortcutInput.getValue().toLowerCase();
 
 			if ( isValidKeyBinding( value ) ) {
 
@@ -89,7 +89,7 @@ function SidebarSettingsShortcuts( editor ) {
 
 	}
 
-	for ( var i = 0; i < shortcuts.length; i ++ ) {
+	for ( let i = 0; i < shortcuts.length; i ++ ) {
 
 		createShortcutInput( shortcuts[ i ] );
 
@@ -107,11 +107,11 @@ function SidebarSettingsShortcuts( editor ) {
 
 			case 'delete':
 
-				var object = editor.selected;
+				const object = editor.selected;
 
 				if ( object === null ) return;
 
-				var parent = object.parent;
+				const parent = object.parent;
 				if ( parent !== null ) editor.execute( new RemoveObjectCommand( editor, object ) );
 
 				break;

editor/js/Sidebar.Settings.Viewport.js

@@ -4,22 +4,22 @@ import { UIBoolean } from './libs/ui.three.js';
 
 function SidebarSettingsViewport( editor ) {
 
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 
-	var headerRow = new UIRow();
+	const headerRow = new UIRow();
 	headerRow.add( new UIText( strings.getKey( 'sidebar/settings/viewport' ).toUpperCase() ) );
 	container.add( headerRow );
 
 	// grid
 
-	var showGridRow = new UIRow();
+	const showGridRow = new UIRow();
 
 	showGridRow.add( new UIText( strings.getKey( 'sidebar/settings/viewport/grid' ) ).setWidth( '90px' ) );
 
-	var showGrid = new UIBoolean( true ).onChange( function () {
+	const showGrid = new UIBoolean( true ).onChange( function () {
 
 		signals.showGridChanged.dispatch( showGrid.getValue() );
 
@@ -29,11 +29,11 @@ function SidebarSettingsViewport( editor ) {
 
 	// helpers
 
-	var showHelpersRow = new UIRow();
+	const showHelpersRow = new UIRow();
 
 	showHelpersRow.add( new UIText( strings.getKey( 'sidebar/settings/viewport/helpers' ) ).setWidth( '90px' ) );
 
-	var showHelpers = new UIBoolean( true ).onChange( function () {
+	const showHelpers = new UIBoolean( true ).onChange( function () {
 
 		signals.showHelpersChanged.dispatch( showHelpers.getValue() );
 

editor/js/Sidebar.Settings.js

@@ -6,26 +6,26 @@ import { SidebarSettingsHistory } from './Sidebar.Settings.History.js';
 
 function SidebarSettings( editor ) {
 
-	var config = editor.config;
-	var strings = editor.strings;
+	const config = editor.config;
+	const strings = editor.strings;
 
-	var container = new UISpan();
+	const container = new UISpan();
 
-	var settings = new UIPanel();
+	const settings = new UIPanel();
 	settings.setBorderTop( '0' );
 	settings.setPaddingTop( '20px' );
 	container.add( settings );
 
 	// language
 
-	var options = {
+	const options = {
 		en: 'English',
 		fr: 'Français',
 		zh: '中文'
 	};
 
-	var languageRow = new UIRow();
-	var language = new UISelect().setWidth( '150px' );
+	const languageRow = new UIRow();
+	const language = new UISelect().setWidth( '150px' );
 	language.setOptions( options );
 
 	if ( config.getKey( 'language' ) !== undefined ) {
@@ -36,7 +36,7 @@ function SidebarSettings( editor ) {
 
 	language.onChange( function () {
 
-		var value = this.getValue();
+		const value = this.getValue();
 
 		editor.config.setKey( 'language', value );
 

editor/js/Sidebar.js

@@ -9,19 +9,19 @@ import { SidebarSettings } from './Sidebar.Settings.js';
 
 function Sidebar( editor ) {
 
-	var strings = editor.strings;
+	const strings = editor.strings;
 
-	var container = new UITabbedPanel();
+	const container = new UITabbedPanel();
 	container.setId( 'sidebar' );
 
-	var scene = new UISpan().add(
+	const scene = new UISpan().add(
 		new SidebarScene( editor ),
 		new SidebarProperties( editor ),
 		new SidebarAnimation( editor ),
 		new SidebarScript( editor )
 	);
-	var project = new SidebarProject( editor );
-	var settings = new SidebarSettings( editor );
+	const project = new SidebarProject( editor );
+	const settings = new SidebarSettings( editor );
 
 	container.addTab( 'scene', strings.getKey( 'sidebar/scene' ), scene );
 	container.addTab( 'project', strings.getKey( 'sidebar/project' ), project );

editor/js/Storage.js

@@ -1,6 +1,6 @@
 function Storage() {
 
-	var indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
+	const indexedDB = window.indexedDB || window.mozIndexedDB || window.webkitIndexedDB || window.msIndexedDB;
 
 	if ( indexedDB === undefined ) {
 
@@ -9,19 +9,19 @@ function Storage() {
 
 	}
 
-	var name = 'threejs-editor';
-	var version = 1;
+	const name = 'threejs-editor';
+	const version = 1;
 
-	var database;
+	let database;
 
 	return {
 
 		init: function ( callback ) {
 
-			var request = indexedDB.open( name, version );
+			const request = indexedDB.open( name, version );
 			request.onupgradeneeded = function ( event ) {
 
-				var db = event.target.result;
+				const db = event.target.result;
 
 				if ( db.objectStoreNames.contains( 'states' ) === false ) {
 
@@ -50,9 +50,9 @@ function Storage() {
 
 		get: function ( callback ) {
 
-			var transaction = database.transaction( [ 'states' ], 'readwrite' );
-			var objectStore = transaction.objectStore( 'states' );
-			var request = objectStore.get( 0 );
+			const transaction = database.transaction( [ 'states' ], 'readwrite' );
+			const objectStore = transaction.objectStore( 'states' );
+			const request = objectStore.get( 0 );
 			request.onsuccess = function ( event ) {
 
 				callback( event.target.result );
@@ -63,11 +63,11 @@ function Storage() {
 
 		set: function ( data ) {
 
-			var start = performance.now();
+			const start = performance.now();
 
-			var transaction = database.transaction( [ 'states' ], 'readwrite' );
-			var objectStore = transaction.objectStore( 'states' );
-			var request = objectStore.put( data, 0 );
+			const transaction = database.transaction( [ 'states' ], 'readwrite' );
+			const objectStore = transaction.objectStore( 'states' );
+			const request = objectStore.put( data, 0 );
 			request.onsuccess = function () {
 
 				console.log( '[' + /\d\d\:\d\d\:\d\d/.exec( new Date() )[ 0 ] + ']', 'Saved state to IndexedDB. ' + ( performance.now() - start ).toFixed( 2 ) + 'ms' );
@@ -80,9 +80,9 @@ function Storage() {
 
 			if ( database === undefined ) return;
 
-			var transaction = database.transaction( [ 'states' ], 'readwrite' );
-			var objectStore = transaction.objectStore( 'states' );
-			var request = objectStore.clear();
+			const transaction = database.transaction( [ 'states' ], 'readwrite' );
+			const objectStore = transaction.objectStore( 'states' );
+			const request = objectStore.clear();
 			request.onsuccess = function () {
 
 				console.log( '[' + /\d\d\:\d\d\:\d\d/.exec( new Date() )[ 0 ] + ']', 'Cleared IndexedDB.' );

editor/js/Strings.js

@@ -1,8 +1,8 @@
 function Strings( config ) {
 
-	var language = config.getKey( 'language' );
+	const language = config.getKey( 'language' );
 
-	var values = {
+	const values = {
 
 		en: {
 

editor/js/Toolbar.js

@@ -2,19 +2,19 @@ import { UIPanel, UIButton, UICheckbox } from './libs/ui.js';
 
 function Toolbar( editor ) {
 
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'toolbar' );
 
 	// translate / rotate / scale
 
-	var translateIcon = document.createElement( 'img' );
+	const translateIcon = document.createElement( 'img' );
 	translateIcon.title = strings.getKey( 'toolbar/translate' );
 	translateIcon.src = 'images/translate.svg';
 
-	var translate = new UIButton();
+	const translate = new UIButton();
 	translate.dom.className = 'Button selected';
 	translate.dom.appendChild( translateIcon );
 	translate.onClick( function () {
@@ -24,11 +24,11 @@ function Toolbar( editor ) {
 	} );
 	container.add( translate );
 
-	var rotateIcon = document.createElement( 'img' );
+	const rotateIcon = document.createElement( 'img' );
 	rotateIcon.title = strings.getKey( 'toolbar/rotate' );
 	rotateIcon.src = 'images/rotate.svg';
 
-	var rotate = new UIButton();
+	const rotate = new UIButton();
 	rotate.dom.appendChild( rotateIcon );
 	rotate.onClick( function () {
 
@@ -37,11 +37,11 @@ function Toolbar( editor ) {
 	} );
 	container.add( rotate );
 
-	var scaleIcon = document.createElement( 'img' );
+	const scaleIcon = document.createElement( 'img' );
 	scaleIcon.title = strings.getKey( 'toolbar/scale' );
 	scaleIcon.src = 'images/scale.svg';
 
-	var scale = new UIButton();
+	const scale = new UIButton();
 	scale.dom.appendChild( scaleIcon );
 	scale.onClick( function () {
 
@@ -50,7 +50,7 @@ function Toolbar( editor ) {
 	} );
 	container.add( scale );
 
-	var local = new UICheckbox( false );
+	const local = new UICheckbox( false );
 	local.dom.title = strings.getKey( 'toolbar/local' );
 	local.onChange( function () {
 

editor/js/Viewport.Camera.js

@@ -2,11 +2,11 @@ import { UISelect } from './libs/ui.js';
 
 function ViewportCamera( editor ) {
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
 	//
 
-	var cameraSelect = new UISelect();
+	const cameraSelect = new UISelect();
 	cameraSelect.setPosition( 'absolute' );
 	cameraSelect.setRight( '10px' );
 	cameraSelect.setTop( '10px' );
@@ -25,13 +25,13 @@ function ViewportCamera( editor ) {
 
 	function update() {
 
-		var options = {};
+		const options = {};
 
-		var cameras = editor.cameras;
+		const cameras = editor.cameras;
 
-		for ( var key in cameras ) {
+		for ( const key in cameras ) {
 
-			var camera = cameras[ key ];
+			const camera = cameras[ key ];
 			options[ camera.uuid ] = camera.name;
 
 		}

editor/js/Viewport.Info.js

@@ -2,10 +2,10 @@ import { UIPanel, UIBreak, UIText } from './libs/ui.js';
 
 function ViewportInfo( editor ) {
 
-	var signals = editor.signals;
-	var strings = editor.strings;
+	const signals = editor.signals;
+	const strings = editor.strings;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'info' );
 	container.setPosition( 'absolute' );
 	container.setLeft( '10px' );
@@ -13,10 +13,10 @@ function ViewportInfo( editor ) {
 	container.setFontSize( '12px' );
 	container.setColor( '#fff' );
 
-	var objectsText = new UIText( '0' ).setMarginLeft( '6px' );
-	var verticesText = new UIText( '0' ).setMarginLeft( '6px' );
-	var trianglesText = new UIText( '0' ).setMarginLeft( '6px' );
-	var frametimeText = new UIText( '0' ).setMarginLeft( '6px' );
+	const objectsText = new UIText( '0' ).setMarginLeft( '6px' );
+	const verticesText = new UIText( '0' ).setMarginLeft( '6px' );
+	const trianglesText = new UIText( '0' ).setMarginLeft( '6px' );
+	const frametimeText = new UIText( '0' ).setMarginLeft( '6px' );
 
 	container.add( new UIText( strings.getKey( 'viewport/info/objects' ) ).setTextTransform( 'lowercase' ) );
 	container.add( objectsText, new UIBreak() );
@@ -35,13 +35,13 @@ function ViewportInfo( editor ) {
 
 	function update() {
 
-		var scene = editor.scene;
+		const scene = editor.scene;
 
-		var objects = 0, vertices = 0, triangles = 0;
+		let objects = 0, vertices = 0, triangles = 0;
 
-		for ( var i = 0, l = scene.children.length; i < l; i ++ ) {
+		for ( let i = 0, l = scene.children.length; i < l; i ++ ) {
 
-			var object = scene.children[ i ];
+			const object = scene.children[ i ];
 
 			object.traverseVisible( function ( object ) {
 
@@ -49,7 +49,7 @@ function ViewportInfo( editor ) {
 
 				if ( object.isMesh ) {
 
-					var geometry = object.geometry;
+					const geometry = object.geometry;
 
 					vertices += geometry.attributes.position.count;
 

editor/js/Viewport.js

@@ -19,9 +19,9 @@ import { RoomEnvironment } from '../../examples/jsm/environments/RoomEnvironment
 
 function Viewport( editor ) {
 
-	var signals = editor.signals;
+	const signals = editor.signals;
 
-	var container = new UIPanel();
+	const container = new UIPanel();
 	container.setId( 'viewport' );
 	container.setPosition( 'absolute' );
 
@@ -30,58 +30,58 @@ function Viewport( editor ) {
 
 	//
 
-	var renderer = null;
-	var pmremGenerator = null;
+	let renderer = null;
+	let pmremGenerator = null;
 
-	var camera = editor.camera;
-	var scene = editor.scene;
-	var sceneHelpers = editor.sceneHelpers;
-	var showSceneHelpers = true;
+	const camera = editor.camera;
+	const scene = editor.scene;
+	const sceneHelpers = editor.sceneHelpers;
+	let showSceneHelpers = true;
 
-	var objects = [];
+	const objects = [];
 
 	// helpers
 
-	var grid = new THREE.Group();
+	const grid = new THREE.Group();
 
-	var grid1 = new THREE.GridHelper( 30, 30, 0x888888 );
+	const grid1 = new THREE.GridHelper( 30, 30, 0x888888 );
 	grid1.material.color.setHex( 0x888888 );
 	grid1.material.vertexColors = false;
 	grid.add( grid1 );
 
-	var grid2 = new THREE.GridHelper( 30, 6, 0x222222 );
+	const grid2 = new THREE.GridHelper( 30, 6, 0x222222 );
 	grid2.material.color.setHex( 0x222222 );
 	grid2.material.depthFunc = THREE.AlwaysDepth;
 	grid2.material.vertexColors = false;
 	grid.add( grid2 );
 
-	var viewHelper = new ViewHelper( camera, container );
-	var vr = new VR( editor );
+	const viewHelper = new ViewHelper( camera, container );
+	const vr = new VR( editor );
 
 	//
 
-	var box = new THREE.Box3();
+	const box = new THREE.Box3();
 
-	var selectionBox = new THREE.Box3Helper( box );
+	const selectionBox = new THREE.Box3Helper( box );
 	selectionBox.material.depthTest = false;
 	selectionBox.material.transparent = true;
 	selectionBox.visible = false;
 	sceneHelpers.add( selectionBox );
 
-	var objectPositionOnDown = null;
-	var objectRotationOnDown = null;
-	var objectScaleOnDown = null;
+	let objectPositionOnDown = null;
+	let objectRotationOnDown = null;
+	let objectScaleOnDown = null;
 
-	var transformControls = new TransformControls( camera, container.dom );
+	const transformControls = new TransformControls( camera, container.dom );
 	transformControls.addEventListener( 'change', function () {
 
-		var object = transformControls.object;
+		const object = transformControls.object;
 
 		if ( object !== undefined ) {
 
 			box.setFromObject( object, true );
 
-			var helper = editor.helpers[ object.id ];
+			const helper = editor.helpers[ object.id ];
 
 			if ( helper !== undefined && helper.isSkeletonHelper !== true ) {
 
@@ -98,7 +98,7 @@ function Viewport( editor ) {
 	} );
 	transformControls.addEventListener( 'mouseDown', function () {
 
-		var object = transformControls.object;
+		const object = transformControls.object;
 
 		objectPositionOnDown = object.position.clone();
 		objectRotationOnDown = object.rotation.clone();
@@ -109,7 +109,7 @@ function Viewport( editor ) {
 	} );
 	transformControls.addEventListener( 'mouseUp', function () {
 
-		var object = transformControls.object;
+		const object = transformControls.object;
 
 		if ( object !== undefined ) {
 
@@ -157,8 +157,8 @@ function Viewport( editor ) {
 
 	// object picking
 
-	var raycaster = new THREE.Raycaster();
-	var mouse = new THREE.Vector2();
+	const raycaster = new THREE.Raycaster();
+	const mouse = new THREE.Vector2();
 
 	// events
 
@@ -180,13 +180,13 @@ function Viewport( editor ) {
 
 	}
 
-	var onDownPosition = new THREE.Vector2();
-	var onUpPosition = new THREE.Vector2();
-	var onDoubleClickPosition = new THREE.Vector2();
+	const onDownPosition = new THREE.Vector2();
+	const onUpPosition = new THREE.Vector2();
+	const onDoubleClickPosition = new THREE.Vector2();
 
 	function getMousePosition( dom, x, y ) {
 
-		var rect = dom.getBoundingClientRect();
+		const rect = dom.getBoundingClientRect();
 		return [ ( x - rect.left ) / rect.width, ( y - rect.top ) / rect.height ];
 
 	}
@@ -195,11 +195,11 @@ function Viewport( editor ) {
 
 		if ( onDownPosition.distanceTo( onUpPosition ) === 0 ) {
 
-			var intersects = getIntersects( onUpPosition, objects );
+			const intersects = getIntersects( onUpPosition, objects );
 
 			if ( intersects.length > 0 ) {
 
-				var object = intersects[ 0 ].object;
+				const object = intersects[ 0 ].object;
 
 				if ( object.userData.object !== undefined ) {
 
@@ -229,7 +229,7 @@ function Viewport( editor ) {
 
 		// event.preventDefault();
 
-		var array = getMousePosition( container.dom, event.clientX, event.clientY );
+		const array = getMousePosition( container.dom, event.clientX, event.clientY );
 		onDownPosition.fromArray( array );
 
 		document.addEventListener( 'mouseup', onMouseUp );
@@ -238,7 +238,7 @@ function Viewport( editor ) {
 
 	function onMouseUp( event ) {
 
-		var array = getMousePosition( container.dom, event.clientX, event.clientY );
+		const array = getMousePosition( container.dom, event.clientX, event.clientY );
 		onUpPosition.fromArray( array );
 
 		handleClick();
@@ -249,9 +249,9 @@ function Viewport( editor ) {
 
 	function onTouchStart( event ) {
 
-		var touch = event.changedTouches[ 0 ];
+		const touch = event.changedTouches[ 0 ];
 
-		var array = getMousePosition( container.dom, touch.clientX, touch.clientY );
+		const array = getMousePosition( container.dom, touch.clientX, touch.clientY );
 		onDownPosition.fromArray( array );
 
 		document.addEventListener( 'touchend', onTouchEnd );
@@ -260,9 +260,9 @@ function Viewport( editor ) {
 
 	function onTouchEnd( event ) {
 
-		var touch = event.changedTouches[ 0 ];
+		const touch = event.changedTouches[ 0 ];
 
-		var array = getMousePosition( container.dom, touch.clientX, touch.clientY );
+		const array = getMousePosition( container.dom, touch.clientX, touch.clientY );
 		onUpPosition.fromArray( array );
 
 		handleClick();
@@ -273,14 +273,14 @@ function Viewport( editor ) {
 
 	function onDoubleClick( event ) {
 
-		var array = getMousePosition( container.dom, event.clientX, event.clientY );
+		const array = getMousePosition( container.dom, event.clientX, event.clientY );
 		onDoubleClickPosition.fromArray( array );
 
-		var intersects = getIntersects( onDoubleClickPosition, objects );
+		const intersects = getIntersects( onDoubleClickPosition, objects );
 
 		if ( intersects.length > 0 ) {
 
-			var intersect = intersects[ 0 ];
+			const intersect = intersects[ 0 ];
 
 			signals.objectFocused.dispatch( intersect.object );
 
@@ -295,7 +295,7 @@ function Viewport( editor ) {
 	// controls need to be added *after* main logic,
 	// otherwise controls.enabled doesn't work.
 
-	var controls = new EditorControls( camera, container.dom );
+	const controls = new EditorControls( camera, container.dom );
 	controls.addEventListener( 'change', function () {
 
 		signals.cameraChanged.dispatch( camera );
@@ -366,7 +366,7 @@ function Viewport( editor ) {
 
 		if ( window.matchMedia ) {
 
-			var mediaQuery = window.matchMedia( '(prefers-color-scheme: dark)' );
+			const mediaQuery = window.matchMedia( '(prefers-color-scheme: dark)' );
 			mediaQuery.addListener( function ( event ) {
 
 				renderer.setClearColor( event.matches ? 0x333333 : 0xaaaaaa );
@@ -499,7 +499,7 @@ function Viewport( editor ) {
 
 	signals.helperAdded.add( function ( object ) {
 
-		var picker = object.getObjectByName( 'picker' );
+		const picker = object.getObjectByName( 'picker' );
 
 		if ( picker !== undefined ) {
 
@@ -511,7 +511,7 @@ function Viewport( editor ) {
 
 	signals.helperRemoved.add( function ( object ) {
 
-		var picker = object.getObjectByName( 'picker' );
+		const picker = object.getObjectByName( 'picker' );
 
 		if ( picker !== undefined ) {
 
@@ -659,7 +659,7 @@ function Viewport( editor ) {
 
 	signals.viewportCameraChanged.add( function () {
 
-		var viewportCamera = editor.viewportCamera;
+		const viewportCamera = editor.viewportCamera;
 
 		if ( viewportCamera.isPerspectiveCamera ) {
 
@@ -714,14 +714,14 @@ function Viewport( editor ) {
 
 	// animations
 
-	var clock = new THREE.Clock(); // only used for animations
+	const clock = new THREE.Clock(); // only used for animations
 
 	function animate() {
 
-		var mixer = editor.mixer;
-		var delta = clock.getDelta();
+		const mixer = editor.mixer;
+		const delta = clock.getDelta();
 
-		var needsUpdate = false;
+		let needsUpdate = false;
 
 		if ( mixer.stats.actions.inUse > 0 ) {
 
@@ -749,8 +749,8 @@ function Viewport( editor ) {
 
 	//
 
-	var startTime = 0;
-	var endTime = 0;
+	let startTime = 0;
+	let endTime = 0;
 
 	function render() {