JSM: Added module and TS file for EquirectangularToCubeGenerator.

docs/manual/en/introduction/Import-via-modules.html

@@ -192,6 +192,7 @@
 						<li>DDSLoader</li>
 						<li>DRACOLoader</li>
 						<li>EXRLoader</li>
+						<li>EquirectangularToCubeGenerator</li>
 						<li>FBXLoader</li>
 						<li>GCodeLoader</li>
 						<li>GLTFLoader</li>

examples/js/loaders/EquirectangularToCubeGenerator.js

@@ -197,29 +197,29 @@ THREE.EquirectangularToCubeGenerator = ( function () {
 			},
 
 			vertexShader:
-        "varying vec3 localPosition;\n\
-        \n\
-        void main() {\n\
-          localPosition = position;\n\
-          gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\
-        }",
+				"varying vec3 localPosition;\n\
+				\n\
+				void main() {\n\
+					localPosition = position;\n\
+					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\
+				}",
 
 			fragmentShader:
-        "#include <common>\n\
-        varying vec3 localPosition;\n\
-        uniform sampler2D equirectangularMap;\n\
-        \n\
-        vec2 EquirectangularSampleUV(vec3 v) {\n\
-          vec2 uv = vec2(atan(v.z, v.x), asin(v.y));\n\
-          uv *= vec2(0.1591, 0.3183); // inverse atan\n\
-          uv += 0.5;\n\
-          return uv;\n\
-        }\n\
-        \n\
-        void main() {\n\
-          vec2 uv = EquirectangularSampleUV(normalize(localPosition));\n\
-          gl_FragColor = texture2D(equirectangularMap, uv);\n\
-        }",
+				"#include <common>\n\
+				varying vec3 localPosition;\n\
+				uniform sampler2D equirectangularMap;\n\
+				\n\
+				vec2 EquirectangularSampleUV(vec3 v) {\n\
+					vec2 uv = vec2(atan(v.z, v.x), asin(v.y));\n\
+					uv *= vec2(0.1591, 0.3183); // inverse atan\n\
+					uv += 0.5;\n\
+					return uv;\n\
+				}\n\
+				\n\
+				void main() {\n\
+					vec2 uv = EquirectangularSampleUV(normalize(localPosition));\n\
+					gl_FragColor = texture2D(equirectangularMap, uv);\n\
+				}",
 
 			blending: THREE.NoBlending
 

examples/jsm/loaders/EquirectangularToCubeGenerator.d.ts

@@ -0,0 +1,34 @@
+import {
+  PixelFormat,
+  Texture,
+  TextureDataType,
+  TextureFilter,
+  WebGLRenderer,
+  WebGLRenderTargetCube
+} from '../../../src/Three';
+
+export interface CubemapGeneratorOptions {
+  resolution?: number;
+  generateMipmaps?: boolean;
+  magFilter?: TextureFilter;
+  minFilter?: TextureFilter;
+}
+
+export interface EquirectangularToCubeGeneratorOptions {
+  resolution?: number;
+  format?: PixelFormat;
+  type?: TextureDataType;
+}
+
+export class CubemapGenerator {
+  constructor(renderer: WebGLRenderer);
+
+  fromEquirectangular(texture: Texture, options?: CubemapGeneratorOptions): WebGLRenderTargetCube;
+}
+
+export class EquirectangularToCubeGenerator {
+  constructor(sourceTexture: Texture, options?: EquirectangularToCubeGeneratorOptions);
+
+  dispose(): void;
+  update(renderer: WebGLRenderer): Texture;
+}

examples/jsm/loaders/EquirectangularToCubeGenerator.js

@@ -0,0 +1,251 @@
+/**
+* @author Richard M. / https://github.com/richardmonette
+* @author WestLangley / http://github.com/WestLangley
+*/
+
+import {
+	BackSide,
+	BoxBufferGeometry,
+	CubeCamera,
+	Mesh,
+	NoBlending,
+	PerspectiveCamera,
+	Scene,
+	ShaderMaterial,
+	UniformsUtils,
+	WebGLRenderTargetCube
+} from "../../../build/three.module.js";
+
+var CubemapGenerator = function ( renderer ) {
+
+	this.renderer = renderer;
+
+};
+
+CubemapGenerator.prototype.fromEquirectangular = function ( texture, options ) {
+
+	options = options || {};
+
+	var scene = new Scene();
+
+	var shader = {
+
+		uniforms: {
+			tEquirect: { value: null },
+		},
+
+		vertexShader:
+
+			`
+			varying vec3 vWorldDirection;
+
+			//include <common>
+			vec3 transformDirection( in vec3 dir, in mat4 matrix ) {
+
+				return normalize( ( matrix * vec4( dir, 0.0 ) ).xyz );
+
+			}
+
+			void main() {
+
+				vWorldDirection = transformDirection( position, modelMatrix );
+
+				#include <begin_vertex>
+				#include <project_vertex>
+
+			}
+			`,
+
+		fragmentShader:
+
+			`
+			uniform sampler2D tEquirect;
+
+			varying vec3 vWorldDirection;
+
+			//include <common>
+			#define RECIPROCAL_PI 0.31830988618
+			#define RECIPROCAL_PI2 0.15915494
+
+			void main() {
+
+				vec3 direction = normalize( vWorldDirection );
+
+				vec2 sampleUV;
+
+				sampleUV.y = asin( clamp( direction.y, - 1.0, 1.0 ) ) * RECIPROCAL_PI + 0.5;
+
+				sampleUV.x = atan( direction.z, direction.x ) * RECIPROCAL_PI2 + 0.5;
+
+				gl_FragColor = texture2D( tEquirect, sampleUV );
+
+			}
+			`
+	};
+
+	var material = new ShaderMaterial( {
+
+		type: 'CubemapFromEquirect',
+
+		uniforms: UniformsUtils.clone( shader.uniforms ),
+		vertexShader: shader.vertexShader,
+		fragmentShader: shader.fragmentShader,
+		side: BackSide,
+		blending: NoBlending
+
+	} );
+
+	material.uniforms.tEquirect.value = texture;
+
+	var mesh = new Mesh( new BoxBufferGeometry( 5, 5, 5 ), material );
+
+	scene.add( mesh );
+
+	var resolution = options.resolution || 512;
+
+	var params = {
+		type: texture.type,
+		format: texture.format,
+		encoding: texture.encoding,
+		generateMipmaps: ( options.generateMipmaps !== undefined ) ? options.generateMipmaps : texture.generateMipmaps,
+		minFilter: ( options.minFilter !== undefined ) ? options.minFilter : texture.minFilter,
+		magFilter: ( options.magFilter !== undefined ) ? options.magFilter : texture.magFilter
+	};
+
+	var camera = new CubeCamera( 1, 10, resolution, params );
+
+	camera.update( this.renderer, scene );
+
+	mesh.geometry.dispose();
+	mesh.material.dispose();
+
+	return camera.renderTarget;
+
+};
+
+//
+
+var EquirectangularToCubeGenerator = ( function () {
+
+	var camera = new PerspectiveCamera( 90, 1, 0.1, 10 );
+	var scene = new Scene();
+	var boxMesh = new Mesh( new BoxBufferGeometry( 1, 1, 1 ), getShader() );
+	boxMesh.material.side = BackSide;
+	scene.add( boxMesh );
+
+	var EquirectangularToCubeGenerator = function ( sourceTexture, options ) {
+
+		options = options || {};
+
+		this.sourceTexture = sourceTexture;
+		this.resolution = options.resolution || 512;
+
+		this.views = [
+			{ t: [ 1, 0, 0 ], u: [ 0, - 1, 0 ] },
+			{ t: [ - 1, 0, 0 ], u: [ 0, - 1, 0 ] },
+			{ t: [ 0, 1, 0 ], u: [ 0, 0, 1 ] },
+			{ t: [ 0, - 1, 0 ], u: [ 0, 0, - 1 ] },
+			{ t: [ 0, 0, 1 ], u: [ 0, - 1, 0 ] },
+			{ t: [ 0, 0, - 1 ], u: [ 0, - 1, 0 ] },
+		];
+
+		var params = {
+			format: options.format || this.sourceTexture.format,
+			magFilter: this.sourceTexture.magFilter,
+			minFilter: this.sourceTexture.minFilter,
+			type: options.type || this.sourceTexture.type,
+			generateMipmaps: this.sourceTexture.generateMipmaps,
+			anisotropy: this.sourceTexture.anisotropy,
+			encoding: this.sourceTexture.encoding
+		};
+
+		this.renderTarget = new WebGLRenderTargetCube( this.resolution, this.resolution, params );
+
+	};
+
+	EquirectangularToCubeGenerator.prototype = {
+
+		constructor: EquirectangularToCubeGenerator,
+
+		update: function ( renderer ) {
+
+			var currentRenderTarget = renderer.getRenderTarget();
+
+			boxMesh.material.uniforms.equirectangularMap.value = this.sourceTexture;
+
+			for ( var i = 0; i < 6; i ++ ) {
+
+				var v = this.views[ i ];
+
+				camera.position.set( 0, 0, 0 );
+				camera.up.set( v.u[ 0 ], v.u[ 1 ], v.u[ 2 ] );
+				camera.lookAt( v.t[ 0 ], v.t[ 1 ], v.t[ 2 ] );
+
+				renderer.setRenderTarget( this.renderTarget, i );
+				renderer.clear();
+				renderer.render( scene, camera );
+
+			}
+
+			renderer.setRenderTarget( currentRenderTarget );
+
+			return this.renderTarget.texture;
+
+		},
+
+		dispose: function () {
+
+			this.renderTarget.dispose();
+
+		}
+
+	};
+
+	function getShader() {
+
+		var shaderMaterial = new ShaderMaterial( {
+
+			uniforms: {
+				"equirectangularMap": { value: null },
+			},
+
+			vertexShader:
+				"varying vec3 localPosition;\n\
+				\n\
+				void main() {\n\
+					localPosition = position;\n\
+					gl_Position = projectionMatrix * modelViewMatrix * vec4( position, 1.0 );\n\
+				}",
+
+			fragmentShader:
+				"#include <common>\n\
+				varying vec3 localPosition;\n\
+				uniform sampler2D equirectangularMap;\n\
+				\n\
+				vec2 EquirectangularSampleUV(vec3 v) {\n\
+					vec2 uv = vec2(atan(v.z, v.x), asin(v.y));\n\
+					uv *= vec2(0.1591, 0.3183); // inverse atan\n\
+					uv += 0.5;\n\
+					return uv;\n\
+				}\n\
+				\n\
+				void main() {\n\
+					vec2 uv = EquirectangularSampleUV(normalize(localPosition));\n\
+					gl_FragColor = texture2D(equirectangularMap, uv);\n\
+				}",
+
+			blending: NoBlending
+
+		} );
+
+		shaderMaterial.type = 'EquirectangularToCubeGenerator';
+
+		return shaderMaterial;
+
+	}
+
+	return EquirectangularToCubeGenerator;
+
+} )();
+
+export { CubemapGenerator, EquirectangularToCubeGenerator };

examples/webgl_loader_gltf.html

@@ -15,27 +15,22 @@
 			<a href="https://hdrihaven.com/hdri/?h=pedestrian_overpass" target="_blank" rel="noopener">Pedestrian Overpass</a> by <a href="https://hdrihaven.com/" target="_blank" rel="noopener">HDRI Haven</a>
 		</div>
 
-		<script src="../build/three.js"></script>
-
-		<script src="js/controls/OrbitControls.js"></script>
-		<script src="js/loaders/GLTFLoader.js"></script>
-
-		<script src="js/loaders/EquirectangularToCubeGenerator.js"></script>
-		<script src="js/loaders/RGBELoader.js"></script>
-
-		<script src="js/pmrem/PMREMGenerator.js"></script>
-		<script src="js/pmrem/PMREMCubeUVPacker.js"></script>
-
-		<script src="js/WebGL.js"></script>
-		<script src="js/libs/stats.min.js"></script>
-
-		<script>
-
-			if ( WEBGL.isWebGLAvailable() === false ) {
-
-				document.body.appendChild( WEBGL.getWebGLErrorMessage() );
-
-			}
+		<script type="module">
+			import {
+				PerspectiveCamera,
+				Scene,
+				UnsignedByteType,
+				WebGLRenderer
+			} from "../build/three.module.js";
+
+			import Stats from './jsm/libs/stats.module.js';
+
+			import { OrbitControls } from './jsm/controls/OrbitControls.js';
+			import { GLTFLoader } from './jsm/loaders/GLTFLoader.js';
+			import { RGBELoader } from './jsm/loaders/RGBELoader.js';
+			import { EquirectangularToCubeGenerator } from './jsm/loaders/EquirectangularToCubeGenerator.js';
+			import { PMREMGenerator } from './jsm/pmrem/PMREMGenerator.js';
+			import { PMREMCubeUVPacker } from './jsm/pmrem/PMREMCubeUVPacker.js';
 
 			var container, stats, controls;
 			var camera, scene, renderer;
@@ -48,60 +43,60 @@
 				container = document.createElement( 'div' );
 				document.body.appendChild( container );
 
-				camera = new THREE.PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.25, 20 );
+				camera = new PerspectiveCamera( 45, window.innerWidth / window.innerHeight, 0.25, 20 );
 				camera.position.set( - 1.8, 0.9, 2.7 );
 
-				scene = new THREE.Scene();
+				scene = new Scene();
 
-				new THREE.RGBELoader()
-					.setType( THREE.UnsignedByteType )
+				new RGBELoader()
+					.setType( UnsignedByteType )
 					.setPath( 'textures/equirectangular/' )
 					.load( 'pedestrian_overpass_2k.hdr', function ( texture ) {
 
-					var cubeGenerator = new THREE.EquirectangularToCubeGenerator( texture, { resolution: 1024 } );
-					cubeGenerator.update( renderer );
+						var cubeGenerator = new EquirectangularToCubeGenerator( texture, { resolution: 1024 } );
+						cubeGenerator.update( renderer );
 
-					var pmremGenerator = new THREE.PMREMGenerator( cubeGenerator.renderTarget.texture );
-					pmremGenerator.update( renderer );
+						var pmremGenerator = new PMREMGenerator( cubeGenerator.renderTarget.texture );
+						pmremGenerator.update( renderer );
 
-					var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods );
-					pmremCubeUVPacker.update( renderer );
+						var pmremCubeUVPacker = new PMREMCubeUVPacker( pmremGenerator.cubeLods );
+						pmremCubeUVPacker.update( renderer );
 
-					var envMap = pmremCubeUVPacker.CubeUVRenderTarget.texture;
+						var envMap = pmremCubeUVPacker.CubeUVRenderTarget.texture;
 
-					// model
+						// model
 
-					var loader = new THREE.GLTFLoader().setPath( 'models/gltf/DamagedHelmet/glTF/' );
-					loader.load( 'DamagedHelmet.gltf', function ( gltf ) {
+						var loader = new GLTFLoader().setPath( 'models/gltf/DamagedHelmet/glTF/' );
+						loader.load( 'DamagedHelmet.gltf', function ( gltf ) {
 
-						gltf.scene.traverse( function ( child ) {
+							gltf.scene.traverse( function ( child ) {
 
-							if ( child.isMesh ) {
+								if ( child.isMesh ) {
 
-								child.material.envMap = envMap;
+									child.material.envMap = envMap;
 
-							}
+								}
 
-						} );
+							} );
 
-						scene.add( gltf.scene );
+							scene.add( gltf.scene );
 
-					} );
+						} );
 
-					pmremGenerator.dispose();
-					pmremCubeUVPacker.dispose();
+						pmremGenerator.dispose();
+						pmremCubeUVPacker.dispose();
 
-					scene.background = cubeGenerator.renderTarget;
+						scene.background = cubeGenerator.renderTarget;
 
-				} );
+					} );
 
-				renderer = new THREE.WebGLRenderer( { antialias: true } );
+				renderer = new WebGLRenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 				renderer.gammaOutput = true;
 				container.appendChild( renderer.domElement );
 
-				controls = new THREE.OrbitControls( camera, renderer.domElement );
+				controls = new OrbitControls( camera, renderer.domElement );
 				controls.target.set( 0, - 0.2, - 0.2 );
 				controls.update();
 

examples/webgl_materials_cubemap_dynamic.html

@@ -10,13 +10,28 @@
 
 		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">three.js webgl</a> - materials - dynamic cube reflection<br/>Photo by <a href="http://www.flickr.com/photos/jonragnarsson/2294472375/" target="_blank" rel="noopener">J&oacute;n Ragnarsson</a>.</div>
 
-		<script src="../build/three.js"></script>
-		<script src="js/loaders/EquirectangularToCubeGenerator.js"></script>
-
-		<script>
+		<script type="module">
+			import {
+				BoxBufferGeometry,
+				CubeCamera,
+				IcosahedronBufferGeometry,
+				LinearFilter,
+				LinearMipMapLinearFilter,
+				Math as _Math,
+				Mesh,
+				MeshBasicMaterial,
+				PerspectiveCamera,
+				Scene,
+				TextureLoader,
+				TorusKnotBufferGeometry,
+				UVMapping,
+				WebGLRenderer
+			} from "../build/three.module.js";
+
+			import { CubemapGenerator } from './jsm/loaders/EquirectangularToCubeGenerator.js';
 
 			var camera, scene, renderer;
-			var cube, sphere, torus, material, backgroundMesh;
+			var cube, sphere, torus, material;
 
 			var count = 0, cubeCamera1, cubeCamera2;
 
@@ -25,11 +40,11 @@
 			var lon = 0, lat = 0;
 			var phi = 0, theta = 0;
 
-			var textureLoader = new THREE.TextureLoader();
+			var textureLoader = new TextureLoader();
 
 			textureLoader.load( 'textures/2294472375_24a3b8ef46_o.jpg', function ( texture ) {
 
-				texture.mapping = THREE.UVMapping;
+				texture.mapping = UVMapping;
 
 				init( texture );
 				animate();
@@ -38,13 +53,13 @@
 
 			function init( texture ) {
 
-				renderer = new THREE.WebGLRenderer( { antialias: true } );
+				renderer = new WebGLRenderer( { antialias: true } );
 				renderer.setPixelRatio( window.devicePixelRatio );
 				renderer.setSize( window.innerWidth, window.innerHeight );
 
-				scene = new THREE.Scene();
+				scene = new Scene();
 
-				camera = new THREE.PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
+				camera = new PerspectiveCamera( 60, window.innerWidth / window.innerHeight, 1, 1000 );
 
 				// background
 
@@ -52,39 +67,39 @@
 					resolution: 1024,
 
 					generateMipmaps: true,
-					minFilter: THREE.LinearMipMapLinearFilter,
-					magFilter: THREE.LinearFilter
+					minFilter: LinearMipMapLinearFilter,
+					magFilter: LinearFilter
 				};
 
-				scene.background = new THREE.CubemapGenerator( renderer ).fromEquirectangular( texture, options );
+				scene.background = new CubemapGenerator( renderer ).fromEquirectangular( texture, options );
 
 				//
 
-				cubeCamera1 = new THREE.CubeCamera( 1, 1000, 256 );
+				cubeCamera1 = new CubeCamera( 1, 1000, 256 );
 				cubeCamera1.renderTarget.texture.generateMipmaps = true;
-				cubeCamera1.renderTarget.texture.minFilter = THREE.LinearMipMapLinearFilter;
+				cubeCamera1.renderTarget.texture.minFilter = LinearMipMapLinearFilter;
 				scene.add( cubeCamera1 );
 
-				cubeCamera2 = new THREE.CubeCamera( 1, 1000, 256 );
+				cubeCamera2 = new CubeCamera( 1, 1000, 256 );
 				cubeCamera2.renderTarget.texture.generateMipmaps = true;
-				cubeCamera2.renderTarget.texture.minFilter = THREE.LinearMipMapLinearFilter;
+				cubeCamera2.renderTarget.texture.minFilter = LinearMipMapLinearFilter;
 				scene.add( cubeCamera2 );
 
 				document.body.appendChild( renderer.domElement );
 
 				//
 
-				material = new THREE.MeshBasicMaterial( {
+				material = new MeshBasicMaterial( {
 					envMap: cubeCamera2.renderTarget.texture
 				} );
 
-				sphere = new THREE.Mesh( new THREE.IcosahedronBufferGeometry( 20, 3 ), material );
+				sphere = new Mesh( new IcosahedronBufferGeometry( 20, 3 ), material );
 				scene.add( sphere );
 
-				cube = new THREE.Mesh( new THREE.BoxBufferGeometry( 20, 20, 20 ), material );
+				cube = new Mesh( new BoxBufferGeometry( 20, 20, 20 ), material );
 				scene.add( cube );
 
-				torus = new THREE.Mesh( new THREE.TorusKnotBufferGeometry( 10, 5, 100, 25 ), material );
+				torus = new Mesh( new TorusKnotBufferGeometry( 10, 5, 100, 25 ), material );
 				scene.add( torus );
 
 				//
@@ -138,7 +153,7 @@
 
 				var fov = camera.fov + event.deltaY * 0.05;
 
-				camera.fov = THREE.Math.clamp( fov, 10, 75 );
+				camera.fov = _Math.clamp( fov, 10, 75 );
 
 				camera.updateProjectionMatrix();
 
@@ -158,8 +173,8 @@
 				lon += .15;
 
 				lat = Math.max( - 85, Math.min( 85, lat ) );
-				phi = THREE.Math.degToRad( 90 - lat );
-				theta = THREE.Math.degToRad( lon );
+				phi = _Math.degToRad( 90 - lat );
+				theta = _Math.degToRad( lon );
 
 				cube.position.x = Math.cos( time * 0.001 ) * 30;
 				cube.position.y = Math.sin( time * 0.001 ) * 30;

examples/webgl_materials_envmaps_exr.html

@@ -11,26 +11,33 @@
 		<div id="container"></div>
 		<div id="info"><a href="http://threejs.org" target="_blank" rel="noopener">threejs</a> - Example of an IBL (Image based lighting) pipeline based around<br> equirectangular EXR lightprobe data. Created by <a href="https://github.com/richardmonette" target="_blank" rel="noopener">Richard Monette</a></div>
 
-		<script src="../build/three.js"></script>
-		<script src="js/controls/OrbitControls.js"></script>
-
-		<script src="js/loaders/EXRLoader.js"></script>
-		<script src="js/loaders/EquirectangularToCubeGenerator.js"></script>
-
-		<script src="js/WebGL.js"></script>
-		<script src="js/libs/stats.min.js"></script>
-
-		<script src="js/pmrem/PMREMGenerator.js"></script>
-		<script src="js/pmrem/PMREMCubeUVPacker.js"></script>
-		<script src="js/libs/dat.gui.min.js"></script>
-
-		<script>
-
-			if ( WEBGL.isWebGLAvailable() === false ) {
-
-				document.body.appendChild( WEBGL.getWebGLErrorMessage() );
-
-			}
+		<script type="module">
+			import {
+				FloatType,
+				HalfFloatType,
+				LinearEncoding,
+				LinearToneMapping,
+				Mesh,
+				MeshBasicMaterial,
+				MeshStandardMaterial,
+				NearestFilter,
+				PerspectiveCamera,
+				PlaneBufferGeometry,
+				Scene,
+				sRGBEncoding,
+				TextureLoader,
+				TorusKnotBufferGeometry,
+				WebGLRenderer
+			} from "../build/three.module.js";
+
+			import Stats from './jsm/libs/stats.module.js';
+
+			import { GUI } from './jsm/libs/dat.gui.module.js';
+			import { OrbitControls } from './jsm/controls/OrbitControls.js';
+			import { EXRLoader } from './jsm/loaders/EXRLoader.js';
+			import { EquirectangularToCubeGenerator } from './jsm/loaders/EquirectangularToCubeGenerator.js';
+			import { PMREMGenerator } from './jsm/pmrem/PMREMGenerator.js';
+			import { PMREMCubeUVPacker } from './jsm/pmrem/PMREMCubeUVPacker.js';
 
 			var params = {
 				envMap: 'EXR',
@@ -43,7 +50,6 @@
 			var container, stats;
 			var camera, scene, renderer, controls;
 			var torusMesh, planeMesh;
-			var standardMaterial, floorMaterial;
 			var pngCubeRenderTarget, exrCubeRenderTarget;
 			var pngBackground, exrBackground;
 
@@ -55,73 +61,73 @@
 				container = document.createElement( 'div' );
 				document.body.appendChild( container );
 
-				camera = new THREE.PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 1000 );
+				camera = new PerspectiveCamera( 40, window.innerWidth / window.innerHeight, 1, 1000 );
 				camera.position.set( 0, 0, 120 );
 
-				scene = new THREE.Scene();
+				scene = new Scene();
 
-				renderer = new THREE.WebGLRenderer();
-				renderer.toneMapping = THREE.LinearToneMapping;
+				renderer = new WebGLRenderer();
+				renderer.toneMapping = LinearToneMapping;
 
 				//
 
-				var geometry = new THREE.TorusKnotBufferGeometry( 18, 8, 150, 20 );
-				var material = new THREE.MeshStandardMaterial( {
+				var geometry = new TorusKnotBufferGeometry( 18, 8, 150, 20 );
+				var material = new MeshStandardMaterial( {
 					metalness: params.roughness,
 					roughness: params.metalness,
 					envMapIntensity: 1.0
 				} );
 
-				torusMesh = new THREE.Mesh( geometry, material );
+				torusMesh = new Mesh( geometry, material );
 				scene.add( torusMesh );
 
-				var geometry = new THREE.PlaneBufferGeometry( 200, 200 );
-				var material = new THREE.MeshBasicMaterial();
+				var geometry = new PlaneBufferGeometry( 200, 200 );
+				var material = new MeshBasicMaterial();
 
-				planeMesh = new THREE.Mesh( geometry, material );
+				planeMesh = new Mesh( geometry, material );
 				planeMesh.position.y = - 50;
 				planeMesh.rotation.x = - Math.PI * 0.5;
 				scene.add( planeMesh );
 
-				new THREE.EXRLoader()
-					.setType( THREE.FloatType )
+				new EXRLoader()
+					.setType( FloatType )
 					.load( 'textures/piz_compressed.exr', function ( texture ) {
 
-					texture.minFilter = THREE.NearestFilter;
-					// texture.magFilter = THREE.NearestFilter;
-					texture.encoding = THREE.LinearEncoding;
+						texture.minFilter = NearestFilter;
+						// texture.magFilter = NearestFilter;
+						texture.encoding = LinearEncoding;
 
-					var cubemapGenerator = new THREE.EquirectangularToCubeGenerator( texture, { resolution: 512, type: THREE.HalfFloatType } );
-					exrBackground = cubemapGenerator.renderTarget;
-					var cubeMapTexture = cubemapGenerator.update( renderer );
+						var cubemapGenerator = new EquirectangularToCubeGenerator( texture, { resolution: 512, type: HalfFloatType } );
+						exrBackground = cubemapGenerator.renderTarget;
+						var cubeMapTexture = cubemapGenerator.update( renderer );
 
-					var pmremGenerator = new THREE.PMREMGenerator( cubeMapTexture );
-					pmremGenerator.update( renderer );
+						var pmremGenerator = new PMREMGenerator( cubeMapTexture );
+						pmremGenerator.update( renderer );
 
-					var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods );
-					pmremCubeUVPacker.update( renderer );
+						var pmremCubeUVPacker = new PMREMCubeUVPacker( pmremGenerator.cubeLods );
+						pmremCubeUVPacker.update( renderer );
 
-					exrCubeRenderTarget = pmremCubeUVPacker.CubeUVRenderTarget;
+						exrCubeRenderTarget = pmremCubeUVPacker.CubeUVRenderTarget;
 
-					texture.dispose();
-					pmremGenerator.dispose();
-					pmremCubeUVPacker.dispose();
+						texture.dispose();
+						pmremGenerator.dispose();
+						pmremCubeUVPacker.dispose();
 
-				} );
+					} );
 
-				new THREE.TextureLoader().load( 'textures/equirectangular.png', function ( texture ) {
+				new TextureLoader().load( 'textures/equirectangular.png', function ( texture ) {
 
-					texture.encoding = THREE.sRGBEncoding;
+					texture.encoding = sRGBEncoding;
 
-					var cubemapGenerator = new THREE.EquirectangularToCubeGenerator( texture, { resolution: 512 } );
+					var cubemapGenerator = new EquirectangularToCubeGenerator( texture, { resolution: 512 } );
 					pngBackground = cubemapGenerator.renderTarget;
 
 					var cubeMapTexture = cubemapGenerator.update( renderer );
 
-					var pmremGenerator = new THREE.PMREMGenerator( cubeMapTexture );
+					var pmremGenerator = new PMREMGenerator( cubeMapTexture );
 					pmremGenerator.update( renderer );
 
-					var pmremCubeUVPacker = new THREE.PMREMCubeUVPacker( pmremGenerator.cubeLods );
+					var pmremCubeUVPacker = new PMREMCubeUVPacker( pmremGenerator.cubeLods );
 					pmremCubeUVPacker.update( renderer );
 
 					pngCubeRenderTarget = pmremCubeUVPacker.CubeUVRenderTarget;
@@ -143,13 +149,13 @@
 				stats = new Stats();
 				container.appendChild( stats.dom );
 
-				controls = new THREE.OrbitControls( camera, renderer.domElement );
+				controls = new OrbitControls( camera, renderer.domElement );
 				controls.minDistance = 50;
 				controls.maxDistance = 300;
 
 				window.addEventListener( 'resize', onWindowResize, false );
 
-				var gui = new dat.GUI();
+				var gui = new GUI();
 
 				gui.add( params, 'envMap', [ 'EXR', 'PNG' ] );
 				gui.add( params, 'roughness', 0, 1, 0.01 );

utils/modularize.js

@@ -87,6 +87,7 @@ var files = [
 	{ path: 'loaders/DDSLoader.js', dependencies: [], ignoreList: [] },
 	{ path: 'loaders/DRACOLoader.js', dependencies: [], ignoreList: [ 'LoadingManager' ] },
 	{ path: 'loaders/EXRLoader.js', dependencies: [], ignoreList: [] },
+	{ path: 'loaders/EquirectangularToCubeGenerator.js', dependencies: [], ignoreList: [] },
 	{ path: 'loaders/FBXLoader.js', dependencies: [ { name: 'Zlib', path: 'libs/inflate.min.js' }, { name: 'TGALoader', path: 'loaders/TGALoader.js' }, { name: 'NURBSCurve', path: 'curves/NURBSCurve.js' } ], ignoreList: [] },
 	{ path: 'loaders/GCodeLoader.js', dependencies: [], ignoreList: [] },
 	{ path: 'loaders/GLTFLoader.js', dependencies: [], ignoreList: [ 'NoSide', 'Matrix2', 'DDSLoader', 'Camera' ] },