From c4dcfc5f255d089132e8020227c81343176b2256 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Mon, 24 Jun 2019 12:11:01 -0400
Subject: [PATCH 01/21] WIP: Added hdr support to cubeTexturePass

# Conflicts:
#	examples/js/postprocessing/CubeTexturePass.js
#	src/renderers/shaders/ShaderChunk.d.ts
#	src/renderers/shaders/ShaderLib.d.ts
---
 examples/js/postprocessing/CubeTexturePass.js |  44 +++--
 .../webgl_postprocessing_backgrounds.html     |  31 +++-
 src/materials/Materials.d.ts                  |   1 +
 src/materials/Materials.js                    |   1 +
 src/materials/MeshCubeMaterial.d.ts           |  24 +++
 src/materials/MeshCubeMaterial.js             |  51 +++++
 src/renderers/shaders/ShaderChunk.d.ts        | 174 +++++++++---------
 src/renderers/shaders/ShaderChunk.js          |   4 +
 src/renderers/shaders/ShaderLib.d.ts          |  29 +--
 src/renderers/shaders/ShaderLib.js            |  23 +++
 .../shaders/ShaderLib/cubeEnv_frag.glsl.js    |  52 ++++++
 .../shaders/ShaderLib/cubeEnv_vert.glsl.js    |  25 +++
 src/renderers/webgl/WebGLPrograms.js          |   3 +-
 13 files changed, 336 insertions(+), 126 deletions(-)
 create mode 100644 src/materials/MeshCubeMaterial.d.ts
 create mode 100644 src/materials/MeshCubeMaterial.js
 create mode 100644 src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
 create mode 100644 src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js

diff --git a/examples/js/postprocessing/CubeTexturePass.js b/examples/js/postprocessing/CubeTexturePass.js
index 9fed85b4f46f6c..87b34f98cfa26f 100644
--- a/examples/js/postprocessing/CubeTexturePass.js
+++ b/examples/js/postprocessing/CubeTexturePass.js
@@ -10,21 +10,17 @@ THREE.CubeTexturePass = function ( camera, envMap, opacity ) {
 
 	this.needsSwap = false;
 
-	this.cubeShader = THREE.ShaderLib[ 'cube' ];
+	this.cubeMaterial = new THREE.MeshCubeMaterial();
+
 	this.cubeMesh = new THREE.Mesh(
 		new THREE.BoxBufferGeometry( 10, 10, 10 ),
-		new THREE.ShaderMaterial( {
-			uniforms: this.cubeShader.uniforms,
-			vertexShader: this.cubeShader.vertexShader,
-			fragmentShader: this.cubeShader.fragmentShader,
-			depthTest: false,
-			depthWrite: false,
-			side: THREE.BackSide
-		} )
+		this.cubeMaterial
 	);
 
 	this.envMap = envMap;
+	this.envMapIntensity = 1.0;
 	this.opacity = ( opacity !== undefined ) ? opacity : 1.0;
+	this.roughness = 0.0;
 
 	this.cubeScene = new THREE.Scene();
 	this.cubeCamera = new THREE.PerspectiveCamera();
@@ -38,19 +34,29 @@ THREE.CubeTexturePass.prototype = Object.assign( Object.create( THREE.Pass.proto
 
 	render: function ( renderer, writeBuffer, readBuffer, deltaTime, maskActive ) {
 
+		var camera = this.camera;
+
 		var oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
-		this.cubeCamera.projectionMatrix.copy( this.camera.projectionMatrix );
-		this.cubeCamera.quaternion.setFromRotationMatrix( this.camera.matrixWorld );
-
-		this.cubeMesh.material.uniforms[ "tCube" ].value = this.envMap;
-		this.cubeMesh.material.uniforms[ "opacity" ].value = this.opacity;
-		this.cubeMesh.material.transparent = ( this.opacity < 1.0 );
-
-		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
-		if ( this.clear ) renderer.clear();
-		renderer.render( this.cubeScene, this.cubeCamera );
+		this.cubeCamera.projectionMatrix.copy( camera.projectionMatrix );
+		this.cubeCamera.near = 0.01;
+		this.cubeCamera.far = 20;
+		this.cubeCamera.aspect = camera.aspect;
+		this.cubeCamera.updateProjectionMatrix();
+		this.cubeCamera.quaternion.setFromRotationMatrix( camera.matrixWorld );
+		if( this.cubeMaterial.envMap != this.envMap ) {
+			this.cubeMaterial.envMap = this.envMap;
+			this.cubeMaterial.needsUpdate = true;
+		}
+		this.cubeMaterial.envMapIntensity = this.envMapIntensity;
+		this.cubeMaterial.roughness = this.roughness;
+		this.cubeMaterial.opacity = this.opacity;
+		this.cubeMaterial.transparent = ( this.opacity < 1.0 );
+
+		renderer.setRenderTarget(this.renderToScreen ? null : readBuffer);
+		if(this.clear) renderer.clear();
+		renderer.render( this.cubeScene, this.cubeCamera);
 
 		renderer.autoClear = oldAutoClear;
 
diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index bcaac2b68cb6d3..7ba5e385969cb5 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -48,6 +48,9 @@
 		<script src="js/postprocessing/CubeTexturePass.js"></script>
 		<script src="js/postprocessing/ShaderPass.js"></script>
 
+		<script src="js/loaders/RGBELoader.js"></script>
+		<script src="js/loaders/HDRCubeTextureLoader.js"></script>
+
 		<script src="js/controls/OrbitControls.js"></script>
 
 		<script>
@@ -70,7 +73,9 @@
 				cubeTexturePass: true,
 				cubeTexturePassOpacity: 1.0,
 
-				renderPass: true
+				renderPass: true,
+
+				exposure: 1,
 
 				//autoRotate: true,
 
@@ -101,6 +106,8 @@
 
 				gui.add( params, "renderPass" );
 
+				gui.add( params, "exposure", 0, 2 );
+
 				//gui.add( params, "autoRotate" );
 
 				//gui.add( params, 'camera', [ 'perspective', 'orthographic' ] );
@@ -202,13 +209,23 @@
 				cubeTexturePassP = new THREE.CubeTexturePass( cameraP );
 				composer.addPass( cubeTexturePassP );
 
-				var ldrUrls = genCubeUrls( "textures/cube/pisa/", ".png" );
-				new THREE.CubeTextureLoader().load( ldrUrls, function ( ldrCubeMap ) {
+				// var ldrUrls = genCubeUrls( "textures/cube/pisa/", ".png" );
+				// new THREE.CubeTextureLoader().load( ldrUrls, function ( ldrCubeMap ) {
 
-					cubeTexturePassP.envMap = ldrCubeMap;
-					console.log( "loaded envmap" );
+				// 	cubeTexturePassP.envMap = ldrCubeMap;
+				// 	console.log( "loaded envmap" );
 
-				} );
+				// } );
+
+				var hdrUrls = [ 'px.hdr', 'nx.hdr', 'py.hdr', 'ny.hdr', 'pz.hdr', 'nz.hdr' ];
+
+				var hdrCubeMap = new THREE.HDRCubeTextureLoader( THREE.UnsignedByteType )
+					.setPath( './textures/cube/pisaHDR/' )
+					.load( hdrUrls, function () {
+
+						cubeTexturePassP.envMap = hdrCubeMap;
+
+					} );
 
 				renderPass = new THREE.RenderPass( scene, cameraP );
 				renderPass.clear = false;
@@ -278,6 +295,8 @@
 
 				renderPass.enabled = params.renderPass;
 
+				renderer.toneMappingExposure = params.exposure;
+
 				composer.render();
 
 				stats.end();
diff --git a/src/materials/Materials.d.ts b/src/materials/Materials.d.ts
index ff7faa9d47a5fa..05aaf91c7d8db8 100644
--- a/src/materials/Materials.d.ts
+++ b/src/materials/Materials.d.ts
@@ -15,4 +15,5 @@ export * from './MeshBasicMaterial';
 export * from './MeshMatcapMaterial';
 export * from './LineDashedMaterial';
 export * from './LineBasicMaterial';
+export * from './MeshCubeMaterial';
 export * from './Material';
diff --git a/src/materials/Materials.js b/src/materials/Materials.js
index 28844e95884fc5..7b77be06c4c578 100644
--- a/src/materials/Materials.js
+++ b/src/materials/Materials.js
@@ -15,4 +15,5 @@ export { MeshBasicMaterial } from './MeshBasicMaterial.js';
 export { MeshMatcapMaterial } from './MeshMatcapMaterial.js';
 export { LineDashedMaterial } from './LineDashedMaterial.js';
 export { LineBasicMaterial } from './LineBasicMaterial.js';
+export { MeshCubeMaterial } from './MeshCubeMaterial.js';
 export { Material } from './Material.js';
diff --git a/src/materials/MeshCubeMaterial.d.ts b/src/materials/MeshCubeMaterial.d.ts
new file mode 100644
index 00000000000000..4e48876bc8f8f7
--- /dev/null
+++ b/src/materials/MeshCubeMaterial.d.ts
@@ -0,0 +1,24 @@
+import { Color } from './../math/Color';
+import { Texture } from './../textures/Texture';
+import { MaterialParameters, Material } from './Material';
+import { Combine } from '../constants';
+/**
+ * parameters is an object with one or more properties defining the material's appearance.
+ */
+export interface MeshCubeMaterialParameters extends MaterialParameters {
+	envMap?: Texture;
+	envMapIntensity?: number;
+	opacity: number;
+}
+
+export class MeshCubeMaterial extends Material {
+
+	constructor( parameters?: MeshCubeMaterialParameters );
+
+	envMap?: Texture;
+	envMapIntensity?: number;
+	opacity: number;
+
+	setValues( parameters: MeshCubeMaterialParameters ): void;
+
+}
diff --git a/src/materials/MeshCubeMaterial.js b/src/materials/MeshCubeMaterial.js
new file mode 100644
index 00000000000000..6c50ea8ed3b58c
--- /dev/null
+++ b/src/materials/MeshCubeMaterial.js
@@ -0,0 +1,51 @@
+import { Material } from './Material';
+import { BackSide } from '../constants';
+
+/**
+ * @author bhouston / https://clara.io
+ *
+ * parameters = {
+ *
+ * }
+ */
+
+function MeshCubeMaterial ( parameters ) {
+
+	Material.call( this );
+
+	this.type = 'MeshCubeMaterial';
+
+	this.envMap = null;
+	this.envMapIntensity = 1.0;
+
+	this.roughness = 0.0;
+
+	this.depthTest = false;
+	this.depthWrite = false;
+	this.side = BackSide;
+
+	this.lights = false;
+
+	this.setValues( parameters );
+
+};
+
+MeshCubeMaterial.prototype = Object.create( Material.prototype );
+MeshCubeMaterial.prototype.constructor = MeshCubeMaterial;
+
+MeshCubeMaterial.prototype.isMeshCubeMaterial = true;
+
+MeshCubeMaterial.prototype.copy = function ( source ) {
+
+	Material.prototype.copy.call( this, source );
+
+	this.envMap = source.envMap;
+	this.envMapIntensity = source.envMapIntensity;
+
+	this.roughness = source.roughness;
+
+	return this;
+
+};
+
+export { MeshCubeMaterial };
diff --git a/src/renderers/shaders/ShaderChunk.d.ts b/src/renderers/shaders/ShaderChunk.d.ts
index 8f9a246d183d99..1cb6d0fecb8850 100644
--- a/src/renderers/shaders/ShaderChunk.d.ts
+++ b/src/renderers/shaders/ShaderChunk.d.ts
@@ -2,92 +2,94 @@
 export let ShaderChunk: {
   [name: string]: string;
 
-  alphamap_fragment: string;
-  alphamap_pars_fragment: string;
-  alphatest_fragment: string;
-  aomap_fragment: string;
-  aomap_pars_fragment: string;
-  begin_vertex: string;
-  beginnormal_vertex: string;
-  bsdfs: string;
-  bumpmap_pars_fragment: string;
-  clipping_planes_fragment: string;
-  clipping_planes_pars_fragment: string;
-  clipping_planes_pars_vertex: string;
-  clipping_planes_vertex: string;
-  color_fragment: string;
-  color_pars_fragment: string;
-  color_pars_vertex: string;
-  color_vertex: string;
-  common: string;
-  cube_frag: string;
-  cube_vert: string;
-  cube_uv_reflection_fragment: string;
-  defaultnormal_vertex: string;
-  depth_frag: string;
-  depth_vert: string;
-  distanceRGBA_frag: string;
-  distanceRGBA_vert: string;
-  displacementmap_vertex: string;
-  displacementmap_pars_vertex: string;
-  emissivemap_fragment: string;
-  emissivemap_pars_fragment: string;
-  encodings_pars_fragment: string;
-  encodings_fragment: string;
-  envmap_fragment: string;
-  envmap_pars_fragment: string;
-  envmap_pars_vertex: string;
-  envmap_vertex: string;
-  equirect_frag: string;
-  equirect_vert: string;
-  fog_fragment: string;
-  fog_pars_fragment: string;
-  linedashed_frag: string;
-  linedashed_vert: string;
-  lightmap_fragment: string;
-  lightmap_pars_fragment: string;
-  lights_lambert_vertex: string;
-  lights_pars_begin: string;
-  lights_pars_map: string;
-  lights_phong_fragment: string;
-  lights_phong_pars_fragment: string;
-  lights_physical_fragment: string;
-  lights_physical_pars_fragment: string;
-  lights_fragment_begin: string;
-  lights_fragment_maps: string;
-  lights_fragment_end: string;
-  logdepthbuf_fragment: string;
-  logdepthbuf_pars_fragment: string;
-  logdepthbuf_pars_vertex: string;
-  logdepthbuf_vertex: string;
-  map_fragment: string;
-  map_pars_fragment: string;
-  map_particle_fragment: string;
-  map_particle_pars_fragment: string;
-  meshbasic_frag: string;
-  meshbasic_vert: string;
-  meshlambert_frag: string;
-  meshlambert_vert: string;
-  meshphong_frag: string;
-  meshphong_vert: string;
-  meshphysical_frag: string;
-  meshphysical_vert: string;
-  metalnessmap_fragment: string;
-  metalnessmap_pars_fragment: string;
-  morphnormal_vertex: string;
-  morphtarget_pars_vertex: string;
-  morphtarget_vertex: string;
-  normal_flip: string;
-  normal_frag: string;
-  normal_fragment_begin: string;
-  normal_fragment_maps: string;
-  normal_vert: string;
-  normalmap_pars_fragment: string;
-  packing: string;
-  points_frag: string;
-  points_vert: string;
-  shadow_frag: string;
-  shadow_vert: string;
+	alphamap_fragment: string;
+	alphamap_pars_fragment: string;
+	alphatest_fragment: string;
+	aomap_fragment: string;
+	aomap_pars_fragment: string;
+	begin_vertex: string;
+	beginnormal_vertex: string;
+	bsdfs: string;
+	bumpmap_pars_fragment: string;
+	clipping_planes_fragment: string;
+	clipping_planes_pars_fragment: string;
+	clipping_planes_pars_vertex: string;
+	clipping_planes_vertex: string;
+	color_fragment: string;
+	color_pars_fragment: string;
+	color_pars_vertex: string;
+	color_vertex: string;
+	common: string;
+	cube_frag: string;
+	cube_vert: string;
+	cubeEnv_frag: string;
+	cubeEnv_vert: string;
+	cube_uv_reflection_fragment: string;
+	defaultnormal_vertex: string;
+	depth_frag: string;
+	depth_vert: string;
+	distanceRGBA_frag: string;
+	distanceRGBA_vert: string;
+	displacementmap_vertex: string;
+	displacementmap_pars_vertex: string;
+	emissivemap_fragment: string;
+	emissivemap_pars_fragment: string;
+	encodings_pars_fragment: string;
+	encodings_fragment: string;
+	envmap_fragment: string;
+	envmap_pars_fragment: string;
+	envmap_pars_vertex: string;
+	envmap_vertex: string;
+	equirect_frag: string;
+	equirect_vert: string;
+	fog_fragment: string;
+	fog_pars_fragment: string;
+	linedashed_frag: string;
+	linedashed_vert: string;
+	lightmap_fragment: string;
+	lightmap_pars_fragment: string;
+	lights_lambert_vertex: string;
+	lights_pars_begin: string;
+	lights_pars_map: string;
+	lights_phong_fragment: string;
+	lights_phong_pars_fragment: string;
+	lights_physical_fragment: string;
+	lights_physical_pars_fragment: string;
+	lights_fragment_begin: string;
+	lights_fragment_maps: string;
+	lights_fragment_end: string;
+	logdepthbuf_fragment: string;
+	logdepthbuf_pars_fragment: string;
+	logdepthbuf_pars_vertex: string;
+	logdepthbuf_vertex: string;
+	map_fragment: string;
+	map_pars_fragment: string;
+	map_particle_fragment: string;
+	map_particle_pars_fragment: string;
+	meshbasic_frag: string;
+	meshbasic_vert: string;
+	meshlambert_frag: string;
+	meshlambert_vert: string;
+	meshphong_frag: string;
+	meshphong_vert: string;
+	meshphysical_frag: string;
+	meshphysical_vert: string;
+	metalnessmap_fragment: string;
+	metalnessmap_pars_fragment: string;
+	morphnormal_vertex: string;
+	morphtarget_pars_vertex: string;
+	morphtarget_vertex: string;
+	normal_flip: string;
+	normal_frag: string;
+	normal_fragment_begin: string;
+	normal_fragment_maps: string;
+	normal_vert: string;
+	normalmap_pars_fragment: string;
+	packing: string;
+	points_frag: string;
+	points_vert: string;
+	shadow_frag: string;
+	shadow_vert: string;
 
   premultiplied_alpha_fragment: string;
   project_vertex: string;
diff --git a/src/renderers/shaders/ShaderChunk.js b/src/renderers/shaders/ShaderChunk.js
index 2adf87807dac15..d7da022be8dbac 100644
--- a/src/renderers/shaders/ShaderChunk.js
+++ b/src/renderers/shaders/ShaderChunk.js
@@ -92,6 +92,8 @@ import background_frag from './ShaderLib/background_frag.glsl.js';
 import background_vert from './ShaderLib/background_vert.glsl.js';
 import cube_frag from './ShaderLib/cube_frag.glsl.js';
 import cube_vert from './ShaderLib/cube_vert.glsl.js';
+import cubeEnv_frag from './ShaderLib/cubeEnv_frag.glsl.js';
+import cubeEnv_vert from './ShaderLib/cubeEnv_vert.glsl.js';
 import depth_frag from './ShaderLib/depth_frag.glsl.js';
 import depth_vert from './ShaderLib/depth_vert.glsl.js';
 import distanceRGBA_frag from './ShaderLib/distanceRGBA_frag.glsl.js';
@@ -214,6 +216,8 @@ export var ShaderChunk = {
 	background_vert: background_vert,
 	cube_frag: cube_frag,
 	cube_vert: cube_vert,
+	cubeEnv_frag: cubeEnv_frag,
+	cubeEnv_vert: cubeEnv_vert,
 	depth_frag: depth_frag,
 	depth_vert: depth_vert,
 	distanceRGBA_frag: distanceRGBA_frag,
diff --git a/src/renderers/shaders/ShaderLib.d.ts b/src/renderers/shaders/ShaderLib.d.ts
index 116d3059528b02..e72d173d1a31b8 100644
--- a/src/renderers/shaders/ShaderLib.d.ts
+++ b/src/renderers/shaders/ShaderLib.d.ts
@@ -7,18 +7,19 @@ export interface Shader {
 }
 
 export let ShaderLib: {
-  [name: string]: Shader;
-  basic: Shader;
-  lambert: Shader;
-  phong: Shader;
-  standard: Shader;
-  points: Shader;
-  dashed: Shader;
-  depth: Shader;
-  normal: Shader;
-  cube: Shader;
-  equirect: Shader;
-  depthRGBA: Shader;
-  distanceRGBA: Shader;
-  physical: Shader;
+	[name: string]: Shader;
+	basic: Shader;
+	lambert: Shader;
+	phong: Shader;
+	standard: Shader;
+	points: Shader;
+	dashed: Shader;
+	depth: Shader;
+	normal: Shader;
+	cube: Shader;
+	equirect: Shader;
+	depthRGBA: Shader;
+	distanceRGBA: Shader;
+	cubeEnv: Shader;
+	physical: Shader;
 };
diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js
index 76f0c50cc50b78..f11a7a727c902f 100644
--- a/src/renderers/shaders/ShaderLib.js
+++ b/src/renderers/shaders/ShaderLib.js
@@ -267,6 +267,29 @@ var ShaderLib = {
 
 };
 
+/* -------------------------------------------------------------------------
+//	Cube map shader
+ ------------------------------------------------------------------------- */
+
+ ShaderLib.cubeEnv = {
+
+	uniforms: mergeUniforms( [
+		UniformsLib.common,
+		ShaderLib.standard.uniforms,
+		{
+			envMap: { value: null },
+			envMapIntensity: { value: 1.0 },
+			tFlip: { value: - 1 },
+			opacity: { value: 1.0 },
+			roughness: { value: 0.0 }
+		}
+	] ),
+
+	vertexShader: ShaderChunk.cubeEnv_vert,
+	fragmentShader: ShaderChunk.cubeEnv_frag
+
+};
+
 ShaderLib.physical = {
 
 	uniforms: mergeUniforms( [
diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js b/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
new file mode 100644
index 00000000000000..b01780cdf7d1e4
--- /dev/null
+++ b/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
@@ -0,0 +1,52 @@
+export default /* glsl */`
+uniform float tFlip;
+uniform float opacity;
+uniform float roughness;
+
+varying vec3 vWorldPosition;
+
+#include <common>
+#include <logdepthbuf_pars_fragment>
+#include <clipping_planes_pars_fragment>
+#include <envmap_pars_fragment>
+#include <cube_uv_reflection_fragment>
+
+void main() {
+
+	#include <clipping_planes_fragment>
+
+	vec3 queryReflectVec = vec3( tFlip * vWorldPosition.x, vWorldPosition.yz );
+
+	vec4 envMapColor = vec4( 0.0 );
+
+	#if defined( ENVMAP_TYPE_CUBE )
+
+		#ifdef TEXTURE_LOD_EXT
+
+			envMapColor = textureCubeLodEXT( envMap, queryReflectVec, roughness * 8.0 );
+
+		#else
+
+			envMapColor = textureCube( envMap, queryReflectVec, roughness * 8.0 );
+
+		#endif
+
+		envMapColor.rgb = envMapTexelToLinear( envMapColor ).rgb;
+		envMapColor.rgb *= envMapIntensity;
+
+	#elif defined( ENVMAP_TYPE_CUBE_UV )
+
+		envMapColor = textureCubeUV( queryReflectVec, queryReflectVec, roughness );
+		envMapColor.rgb *= envMapIntensity;
+
+	#endif
+
+	gl_FragColor = envMapColor;
+	gl_FragColor.a = opacity;
+
+	#include <tonemapping_fragment>
+	#include <encodings_fragment>
+	#include <logdepthbuf_fragment>
+
+}
+`;
\ No newline at end of file
diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js b/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
new file mode 100644
index 00000000000000..9fa26ff07f9caa
--- /dev/null
+++ b/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
@@ -0,0 +1,25 @@
+export default /* glsl */`
+varying vec3 vWorldPosition;
+
+#include <common>
+#include <clipping_planes_pars_vertex>
+
+#if NUM_CLIPPING_PLANES == 0
+	#if ! defined( VARYING_VVIEWPOSITION )
+   		varying vec3 vViewPosition;
+   		#define VARYING_VVIEWPOSITION 1
+   #endif
+#endif
+
+void main() {
+
+	vWorldPosition = transformDirection( position, modelMatrix );
+
+	#include <begin_vertex>
+	#include <project_vertex>
+	#include <clipping_planes_vertex>
+
+	vViewPosition = - mvPosition.xyz;
+
+}
+`;
\ No newline at end of file
diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js
index edb523d1827bfc..81f6e851154b9b 100644
--- a/src/renderers/webgl/WebGLPrograms.js
+++ b/src/renderers/webgl/WebGLPrograms.js
@@ -24,7 +24,8 @@ function WebGLPrograms( renderer, extensions, capabilities, textures ) {
 		LineDashedMaterial: 'dashed',
 		PointsMaterial: 'points',
 		ShadowMaterial: 'shadow',
-		SpriteMaterial: 'sprite'
+		SpriteMaterial: 'sprite',
+		MeshCubeMaterial: 'cubeEnv',
 	};
 
 	var parameterNames = [

From 5cc50bc2731dfe3e85ce6858e94d7590ff7ebdd7 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Mon, 24 Jun 2019 12:24:33 -0400
Subject: [PATCH 02/21] Added hdr support to cubeTexturePass

---
 .../webgl_postprocessing_backgrounds.html     | 26 ++++++++++++-------
 src/renderers/WebGLRenderer.js                | 13 ++++++++++
 2 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index 7ba5e385969cb5..00a2008f501fef 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -58,6 +58,8 @@
 			var scene, renderer, composer;
 			var clearPass, texturePass, renderPass;
 			var cameraP, cubeTexturePassP;
+			var material;
+			var ldrCubeMap, hdrCubeMap;
 			//var cameraO, cubeTexturePassO;
 			var gui, stats;
 
@@ -77,6 +79,8 @@
 
 				exposure: 1,
 
+				hdr: true
+
 				//autoRotate: true,
 
 				//camera: 'perspective'
@@ -108,6 +112,8 @@
 
 				gui.add( params, "exposure", 0, 2 );
 
+				gui.add( params, "hdr" );
+
 				//gui.add( params, "autoRotate" );
 
 				//gui.add( params, 'camera', [ 'perspective', 'orthographic' ] );
@@ -171,7 +177,7 @@
 
 				var geometry = new THREE.SphereBufferGeometry( 1, 48, 24 );
 
-				var material = new THREE.MeshStandardMaterial();
+				material = new THREE.MeshStandardMaterial();
 				material.roughness = 0.5 * Math.random() + 0.25;
 				material.metalness = 0;
 				material.color.setHSL( Math.random(), 1.0, 0.3 );
@@ -209,21 +215,20 @@
 				cubeTexturePassP = new THREE.CubeTexturePass( cameraP );
 				composer.addPass( cubeTexturePassP );
 
-				// var ldrUrls = genCubeUrls( "textures/cube/pisa/", ".png" );
-				// new THREE.CubeTextureLoader().load( ldrUrls, function ( ldrCubeMap ) {
+				var ldrUrls = genCubeUrls( "textures/cube/pisa/", ".png" );
+				ldrCubeMap = new THREE.CubeTextureLoader().load( ldrUrls, function ( ) {
 
-				// 	cubeTexturePassP.envMap = ldrCubeMap;
-				// 	console.log( "loaded envmap" );
+					console.log( "loaded ldr envmap" );
 
-				// } );
+				} );
 
 				var hdrUrls = [ 'px.hdr', 'nx.hdr', 'py.hdr', 'ny.hdr', 'pz.hdr', 'nz.hdr' ];
-
-				var hdrCubeMap = new THREE.HDRCubeTextureLoader( THREE.UnsignedByteType )
+				hdrCubeMap = new THREE.HDRCubeTextureLoader()
 					.setPath( './textures/cube/pisaHDR/' )
-					.load( hdrUrls, function () {
+					.load( THREE.UnsignedByteType, hdrUrls, function () {
 
-						cubeTexturePassP.envMap = hdrCubeMap;
+						hdrCubeMap.magFilter = THREE.LinearFilter;
+						console.log( "loaded hdr envmap" );
 
 					} );
 
@@ -296,6 +301,7 @@
 				renderPass.enabled = params.renderPass;
 
 				renderer.toneMappingExposure = params.exposure;
+				cubeTexturePassP.envMap = params.hdr ? hdrCubeMap : ldrCubeMap;
 
 				composer.render();
 
diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js
index 148695dbdbb51a..26d7f4140ba652 100644
--- a/src/renderers/WebGLRenderer.js
+++ b/src/renderers/WebGLRenderer.js
@@ -1921,6 +1921,11 @@ function WebGLRenderer( parameters ) {
 
 				refreshUniformsPoints( m_uniforms, material );
 
+			} else if ( material.isMeshCubeMaterial ) {
+
+				refreshUniformsCommon( m_uniforms, material );
+				refreshUniformsCube( m_uniforms, material );
+
 			} else if ( material.isSpriteMaterial ) {
 
 				refreshUniformsSprites( m_uniforms, material );
@@ -2101,6 +2106,14 @@ function WebGLRenderer( parameters ) {
 
 	}
 
+	function refreshUniformsCube ( uniforms, material ) {
+
+		uniforms.roughness.value = material.roughness;
+		uniforms.opacity.value = material.opacity;
+		uniforms.envMapIntensity.value = material.envMapIntensity;
+
+	}
+
 	function refreshUniformsLine( uniforms, material ) {
 
 		uniforms.diffuse.value.copy( material.color );

From ade17f94c9fd4535549364fe7026d8e3776d4cef Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Mon, 24 Jun 2019 14:07:07 -0400
Subject: [PATCH 03/21] Replaced ShaderMaterial(ShaderLib.cube) with
 MeshCubeMaterial in WebGLBackground

---
 .../shaders/ShaderLib/cubeEnv_vert.glsl.js    |  3 +++
 .../shaders/ShaderLib/cube_vert.glsl.js       |  2 ++
 src/renderers/webgl/WebGLBackground.js        | 26 +++----------------
 3 files changed, 8 insertions(+), 23 deletions(-)

diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js b/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
index 9fa26ff07f9caa..aa5ff159f8c78d 100644
--- a/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
+++ b/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
@@ -20,6 +20,9 @@ void main() {
 	#include <clipping_planes_vertex>
 
 	vViewPosition = - mvPosition.xyz;
+	gl_Position.z = gl_Position.w; // set z to camera.far
+	// important because otherwise the cube used for rendering the cubeMap might
+	// get clipped
 
 }
 `;
\ No newline at end of file
diff --git a/src/renderers/shaders/ShaderLib/cube_vert.glsl.js b/src/renderers/shaders/ShaderLib/cube_vert.glsl.js
index 66f1c4302c7614..00d39a39ad527d 100644
--- a/src/renderers/shaders/ShaderLib/cube_vert.glsl.js
+++ b/src/renderers/shaders/ShaderLib/cube_vert.glsl.js
@@ -11,6 +11,8 @@ void main() {
 	#include <project_vertex>
 
 	gl_Position.z = gl_Position.w; // set z to camera.far
+	// important because otherwise the cube used for rendering the cubeMap might
+	// get clipped
 
 }
 `;
diff --git a/src/renderers/webgl/WebGLBackground.js b/src/renderers/webgl/WebGLBackground.js
index 95a4f0677f6298..45ca76c95d4c20 100644
--- a/src/renderers/webgl/WebGLBackground.js
+++ b/src/renderers/webgl/WebGLBackground.js
@@ -6,6 +6,7 @@ import { BackSide, FrontSide } from '../../constants.js';
 import { BoxBufferGeometry } from '../../geometries/BoxGeometry.js';
 import { PlaneBufferGeometry } from '../../geometries/PlaneGeometry.js';
 import { ShaderMaterial } from '../../materials/ShaderMaterial.js';
+import { MeshCubeMaterial } from '../../materials/MeshCubeMaterial.js';
 import { Color } from '../../math/Color.js';
 import { Mesh } from '../../objects/Mesh.js';
 import { ShaderLib } from '../shaders/ShaderLib.js';
@@ -66,16 +67,7 @@ function WebGLBackground( renderer, state, objects, premultipliedAlpha ) {
 
 				boxMesh = new Mesh(
 					new BoxBufferGeometry( 1, 1, 1 ),
-					new ShaderMaterial( {
-						type: 'BackgroundCubeMaterial',
-						uniforms: cloneUniforms( ShaderLib.cube.uniforms ),
-						vertexShader: ShaderLib.cube.vertexShader,
-						fragmentShader: ShaderLib.cube.fragmentShader,
-						side: BackSide,
-						depthTest: false,
-						depthWrite: false,
-						fog: false
-					} )
+					new MeshCubeMaterial()
 				);
 
 				boxMesh.geometry.removeAttribute( 'normal' );
@@ -87,24 +79,12 @@ function WebGLBackground( renderer, state, objects, premultipliedAlpha ) {
 
 				};
 
-				// enable code injection for non-built-in material
-				Object.defineProperty( boxMesh.material, 'map', {
-
-					get: function () {
-
-						return this.uniforms.tCube.value;
-
-					}
-
-				} );
-
 				objects.update( boxMesh );
 
 			}
 
 			var texture = background.isWebGLRenderTargetCube ? background.texture : background;
-			boxMesh.material.uniforms.tCube.value = texture;
-			boxMesh.material.uniforms.tFlip.value = ( background.isWebGLRenderTargetCube ) ? 1 : - 1;
+			boxMesh.material.envMap = texture;
 
 			if ( currentBackground !== background ||
 			     currentBackgroundVersion !== texture.version ) {

From bac05aa449d5b88d0d398bf2d77e61559b604ab2 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Mon, 24 Jun 2019 14:27:16 -0400
Subject: [PATCH 04/21] Added changes to /examples/jsm. Fixed declarations

---
 .../jsm/postprocessing/CubeTexturePass.js     | 48 ++++++++++---------
 .../webgl_postprocessing_backgrounds.html     | 18 ++++---
 src/materials/MeshCubeMaterial.d.ts           |  1 +
 3 files changed, 38 insertions(+), 29 deletions(-)

diff --git a/examples/jsm/postprocessing/CubeTexturePass.js b/examples/jsm/postprocessing/CubeTexturePass.js
index 7857b608f743e0..71311350f08e2a 100644
--- a/examples/jsm/postprocessing/CubeTexturePass.js
+++ b/examples/jsm/postprocessing/CubeTexturePass.js
@@ -3,13 +3,11 @@
  */
 
 import {
-	BackSide,
 	BoxBufferGeometry,
 	Mesh,
 	PerspectiveCamera,
 	Scene,
-	ShaderLib,
-	ShaderMaterial
+	MeshCubeMaterial
 } from "../../../build/three.module.js";
 import { Pass } from "../postprocessing/Pass.js";
 
@@ -21,21 +19,17 @@ var CubeTexturePass = function ( camera, envMap, opacity ) {
 
 	this.needsSwap = false;
 
-	this.cubeShader = ShaderLib[ 'cube' ];
+	this.cubeMaterial = new MeshCubeMaterial();
+
 	this.cubeMesh = new Mesh(
 		new BoxBufferGeometry( 10, 10, 10 ),
-		new ShaderMaterial( {
-			uniforms: this.cubeShader.uniforms,
-			vertexShader: this.cubeShader.vertexShader,
-			fragmentShader: this.cubeShader.fragmentShader,
-			depthTest: false,
-			depthWrite: false,
-			side: BackSide
-		} )
+		this.cubeMaterial
 	);
 
 	this.envMap = envMap;
+	this.envMapIntensity = 1.0;
 	this.opacity = ( opacity !== undefined ) ? opacity : 1.0;
+	this.roughness = 0.0;
 
 	this.cubeScene = new Scene();
 	this.cubeCamera = new PerspectiveCamera();
@@ -49,19 +43,29 @@ CubeTexturePass.prototype = Object.assign( Object.create( Pass.prototype ), {
 
 	render: function ( renderer, writeBuffer, readBuffer/*, deltaTime, maskActive*/ ) {
 
+		var camera = this.camera;
+
 		var oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
-		this.cubeCamera.projectionMatrix.copy( this.camera.projectionMatrix );
-		this.cubeCamera.quaternion.setFromRotationMatrix( this.camera.matrixWorld );
-
-		this.cubeMesh.material.uniforms[ "tCube" ].value = this.envMap;
-		this.cubeMesh.material.uniforms[ "opacity" ].value = this.opacity;
-		this.cubeMesh.material.transparent = ( this.opacity < 1.0 );
-
-		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
-		if ( this.clear ) renderer.clear();
-		renderer.render( this.cubeScene, this.cubeCamera );
+		this.cubeCamera.projectionMatrix.copy( camera.projectionMatrix );
+		this.cubeCamera.near = 0.01;
+		this.cubeCamera.far = 20;
+		this.cubeCamera.aspect = camera.aspect;
+		this.cubeCamera.updateProjectionMatrix();
+		this.cubeCamera.quaternion.setFromRotationMatrix( camera.matrixWorld );
+		if( this.cubeMaterial.envMap != this.envMap ) {
+			this.cubeMaterial.envMap = this.envMap;
+			this.cubeMaterial.needsUpdate = true;
+		}
+		this.cubeMaterial.envMapIntensity = this.envMapIntensity;
+		this.cubeMaterial.roughness = this.roughness;
+		this.cubeMaterial.opacity = this.opacity;
+		this.cubeMaterial.transparent = ( this.opacity < 1.0 );
+
+		renderer.setRenderTarget(this.renderToScreen ? null : readBuffer);
+		if(this.clear) renderer.clear();
+		renderer.render( this.cubeScene, this.cubeCamera);
 
 		renderer.autoClear = oldAutoClear;
 
diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index 7d886a653d9b15..3ae7898166c951 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -25,7 +25,9 @@
 				Scene,
 				SphereBufferGeometry,
 				TextureLoader,
-				WebGLRenderer
+				WebGLRenderer,
+				UnsignedByteType,
+				LinearFilter
 			} from "../build/three.module.js";
 
 			import Stats from './jsm/libs/stats.module.js';
@@ -39,6 +41,7 @@
 			import { ClearPass } from './jsm/postprocessing/ClearPass.js';
 			import { CopyShader } from './jsm/shaders/CopyShader.js';
 			import { OrbitControls } from './jsm/controls/OrbitControls.js';
+			import { HDRCubeTextureLoader } from './jsm/loaders/HDRCubeTextureLoader.js';
 
 			var scene, renderer, composer;
 			var clearPass, texturePass, renderPass;
@@ -154,7 +157,7 @@
 
 				var geometry = new SphereBufferGeometry( 1, 48, 24 );
 
-				material = new THREE.MeshStandardMaterial();
+				material = new MeshStandardMaterial();
 				material.roughness = 0.5 * Math.random() + 0.25;
 				material.metalness = 0;
 				material.color.setHSL( Math.random(), 1.0, 0.3 );
@@ -193,23 +196,24 @@
 				composer.addPass( cubeTexturePassP );
 
 				var ldrUrls = genCubeUrls( "textures/cube/pisa/", ".png" );
-				ldrCubeMap = new THREE.CubeTextureLoader().load( ldrUrls, function ( ) {
+				ldrCubeMap = new CubeTextureLoader().load( ldrUrls, function ( ) {
 
 					console.log( "loaded ldr envmap" );
 
 				} );
 
 				var hdrUrls = [ 'px.hdr', 'nx.hdr', 'py.hdr', 'ny.hdr', 'pz.hdr', 'nz.hdr' ];
-				hdrCubeMap = new THREE.HDRCubeTextureLoader()
+				hdrCubeMap = new HDRCubeTextureLoader()
 					.setPath( './textures/cube/pisaHDR/' )
-					.load( THREE.UnsignedByteType, hdrUrls, function () {
+					.setType( UnsignedByteType )
+					.load( hdrUrls, function () {
 
-						hdrCubeMap.magFilter = THREE.LinearFilter;
+						hdrCubeMap.magFilter = LinearFilter;
 						console.log( "loaded hdr envmap" );
 
 					} );
 
-				renderPass = new THREE.RenderPass( scene, cameraP );
+				renderPass = new RenderPass( scene, cameraP );
 				renderPass.clear = false;
 				composer.addPass( renderPass );
 
diff --git a/src/materials/MeshCubeMaterial.d.ts b/src/materials/MeshCubeMaterial.d.ts
index 4e48876bc8f8f7..c3716f87309fd1 100644
--- a/src/materials/MeshCubeMaterial.d.ts
+++ b/src/materials/MeshCubeMaterial.d.ts
@@ -18,6 +18,7 @@ export class MeshCubeMaterial extends Material {
 	envMap?: Texture;
 	envMapIntensity?: number;
 	opacity: number;
+	roughness: number;
 
 	setValues( parameters: MeshCubeMaterialParameters ): void;
 

From 0905e1f446c333bdee587e2b63fb221687c642e0 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Mon, 24 Jun 2019 15:06:09 -0400
Subject: [PATCH 05/21] Fixed CI formatting errors

---
 src/materials/MeshCubeMaterial.d.ts                  | 2 --
 src/materials/MeshCubeMaterial.js                    | 4 ++--
 src/renderers/WebGLRenderer.js                       | 2 +-
 src/renderers/shaders/ShaderLib.js                   | 2 +-
 src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js | 2 +-
 src/renderers/webgl/WebGLBackground.js               | 2 +-
 6 files changed, 6 insertions(+), 8 deletions(-)

diff --git a/src/materials/MeshCubeMaterial.d.ts b/src/materials/MeshCubeMaterial.d.ts
index c3716f87309fd1..454de1a76d64e0 100644
--- a/src/materials/MeshCubeMaterial.d.ts
+++ b/src/materials/MeshCubeMaterial.d.ts
@@ -1,7 +1,5 @@
-import { Color } from './../math/Color';
 import { Texture } from './../textures/Texture';
 import { MaterialParameters, Material } from './Material';
-import { Combine } from '../constants';
 /**
  * parameters is an object with one or more properties defining the material's appearance.
  */
diff --git a/src/materials/MeshCubeMaterial.js b/src/materials/MeshCubeMaterial.js
index 6c50ea8ed3b58c..cfd4719f899b86 100644
--- a/src/materials/MeshCubeMaterial.js
+++ b/src/materials/MeshCubeMaterial.js
@@ -9,7 +9,7 @@ import { BackSide } from '../constants';
  * }
  */
 
-function MeshCubeMaterial ( parameters ) {
+function MeshCubeMaterial( parameters ) {
 
 	Material.call( this );
 
@@ -28,7 +28,7 @@ function MeshCubeMaterial ( parameters ) {
 
 	this.setValues( parameters );
 
-};
+}
 
 MeshCubeMaterial.prototype = Object.create( Material.prototype );
 MeshCubeMaterial.prototype.constructor = MeshCubeMaterial;
diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js
index 3c4a9a351b778f..8196025c07ac82 100644
--- a/src/renderers/WebGLRenderer.js
+++ b/src/renderers/WebGLRenderer.js
@@ -2082,7 +2082,7 @@ function WebGLRenderer( parameters ) {
 
 	}
 
-	function refreshUniformsCube ( uniforms, material ) {
+	function refreshUniformsCube( uniforms, material ) {
 
 		uniforms.roughness.value = material.roughness;
 		uniforms.opacity.value = material.opacity;
diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js
index f11a7a727c902f..b848fd61b97a01 100644
--- a/src/renderers/shaders/ShaderLib.js
+++ b/src/renderers/shaders/ShaderLib.js
@@ -271,7 +271,7 @@ var ShaderLib = {
 //	Cube map shader
  ------------------------------------------------------------------------- */
 
- ShaderLib.cubeEnv = {
+ShaderLib.cubeEnv = {
 
 	uniforms: mergeUniforms( [
 		UniformsLib.common,
diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js b/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
index aa5ff159f8c78d..475116d2fdf8a1 100644
--- a/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
+++ b/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
@@ -25,4 +25,4 @@ void main() {
 	// get clipped
 
 }
-`;
\ No newline at end of file
+`;
diff --git a/src/renderers/webgl/WebGLBackground.js b/src/renderers/webgl/WebGLBackground.js
index 45ca76c95d4c20..bc7cacde99a32e 100644
--- a/src/renderers/webgl/WebGLBackground.js
+++ b/src/renderers/webgl/WebGLBackground.js
@@ -2,7 +2,7 @@
  * @author mrdoob / http://mrdoob.com/
  */
 
-import { BackSide, FrontSide } from '../../constants.js';
+import { FrontSide } from '../../constants.js';
 import { BoxBufferGeometry } from '../../geometries/BoxGeometry.js';
 import { PlaneBufferGeometry } from '../../geometries/PlaneGeometry.js';
 import { ShaderMaterial } from '../../materials/ShaderMaterial.js';

From d18e36e5cc40513bb665cc1e73a1a6c070d57a36 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Tue, 25 Jun 2019 09:00:08 -0400
Subject: [PATCH 06/21] Added newline for CI check

---
 src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js b/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
index b01780cdf7d1e4..9a87e25f3b7d7d 100644
--- a/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
+++ b/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
@@ -49,4 +49,4 @@ void main() {
 	#include <logdepthbuf_fragment>
 
 }
-`;
\ No newline at end of file
+`;

From a204d665044c97e8c701804e9284ba2a3bdc2a62 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Tue, 25 Jun 2019 09:56:10 -0400
Subject: [PATCH 07/21] Forgot to flip cube maps

---
 src/renderers/WebGLRenderer.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js
index 8196025c07ac82..1bf9294d25d26c 100644
--- a/src/renderers/WebGLRenderer.js
+++ b/src/renderers/WebGLRenderer.js
@@ -2087,6 +2087,7 @@ function WebGLRenderer( parameters ) {
 		uniforms.roughness.value = material.roughness;
 		uniforms.opacity.value = material.opacity;
 		uniforms.envMapIntensity.value = material.envMapIntensity;
+		uniforms.tFlip.value = material.envMap.isCubeTexture ? - 1 : 1;
 
 	}
 

From bf973aaf0cb458628fd25f3a896894fc8076a9c6 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 3 Jul 2019 16:11:39 -0400
Subject: [PATCH 08/21] Renamed MeshCubeMaterial to SkyboxMaterial

---
 examples/js/postprocessing/CubeTexturePass.js      |  2 +-
 examples/jsm/postprocessing/CubeTexturePass.js     |  8 ++++----
 src/materials/Materials.d.ts                       |  2 +-
 src/materials/Materials.js                         |  2 +-
 .../{MeshCubeMaterial.d.ts => SkyboxMaterial.d.ts} |  8 ++++----
 .../{MeshCubeMaterial.js => SkyboxMaterial.js}     | 14 +++++++-------
 src/renderers/WebGLRenderer.js                     |  6 +++---
 src/renderers/shaders/ShaderChunk.d.ts             |  4 ++--
 src/renderers/shaders/ShaderChunk.js               |  8 ++++----
 src/renderers/shaders/ShaderLib.js                 | 10 +++-------
 .../{cubeEnv_frag.glsl.js => skybox_frag.glsl.js}  |  0
 .../{cubeEnv_vert.glsl.js => skybox_vert.glsl.js}  |  0
 src/renderers/webgl/WebGLBackground.js             |  4 ++--
 src/renderers/webgl/WebGLPrograms.js               |  2 +-
 14 files changed, 33 insertions(+), 37 deletions(-)
 rename src/materials/{MeshCubeMaterial.d.ts => SkyboxMaterial.d.ts} (60%)
 rename src/materials/{MeshCubeMaterial.js => SkyboxMaterial.js} (63%)
 rename src/renderers/shaders/ShaderLib/{cubeEnv_frag.glsl.js => skybox_frag.glsl.js} (100%)
 rename src/renderers/shaders/ShaderLib/{cubeEnv_vert.glsl.js => skybox_vert.glsl.js} (100%)

diff --git a/examples/js/postprocessing/CubeTexturePass.js b/examples/js/postprocessing/CubeTexturePass.js
index a0f0cbec347257..aa74bc1df0ff5b 100644
--- a/examples/js/postprocessing/CubeTexturePass.js
+++ b/examples/js/postprocessing/CubeTexturePass.js
@@ -10,7 +10,7 @@ THREE.CubeTexturePass = function ( camera, envMap, opacity ) {
 
 	this.needsSwap = false;
 
-	this.cubeMaterial = new THREE.MeshCubeMaterial();
+	this.cubeMaterial = new THREE.SkyboxMaterial();
 
 	this.cubeMesh = new THREE.Mesh(
 		new THREE.BoxBufferGeometry( 10, 10, 10 ),
diff --git a/examples/jsm/postprocessing/CubeTexturePass.js b/examples/jsm/postprocessing/CubeTexturePass.js
index 71311350f08e2a..41f6e4c3b1df0f 100644
--- a/examples/jsm/postprocessing/CubeTexturePass.js
+++ b/examples/jsm/postprocessing/CubeTexturePass.js
@@ -7,7 +7,7 @@ import {
 	Mesh,
 	PerspectiveCamera,
 	Scene,
-	MeshCubeMaterial
+	SkyboxMaterial
 } from "../../../build/three.module.js";
 import { Pass } from "../postprocessing/Pass.js";
 
@@ -19,7 +19,7 @@ var CubeTexturePass = function ( camera, envMap, opacity ) {
 
 	this.needsSwap = false;
 
-	this.cubeMaterial = new MeshCubeMaterial();
+	this.cubeMaterial = new SkyboxMaterial();
 
 	this.cubeMesh = new Mesh(
 		new BoxBufferGeometry( 10, 10, 10 ),
@@ -63,8 +63,8 @@ CubeTexturePass.prototype = Object.assign( Object.create( Pass.prototype ), {
 		this.cubeMaterial.opacity = this.opacity;
 		this.cubeMaterial.transparent = ( this.opacity < 1.0 );
 
-		renderer.setRenderTarget(this.renderToScreen ? null : readBuffer);
-		if(this.clear) renderer.clear();
+		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
+		if( this.clear ) renderer.clear();
 		renderer.render( this.cubeScene, this.cubeCamera);
 
 		renderer.autoClear = oldAutoClear;
diff --git a/src/materials/Materials.d.ts b/src/materials/Materials.d.ts
index 05aaf91c7d8db8..4b32a5896704f4 100644
--- a/src/materials/Materials.d.ts
+++ b/src/materials/Materials.d.ts
@@ -15,5 +15,5 @@ export * from './MeshBasicMaterial';
 export * from './MeshMatcapMaterial';
 export * from './LineDashedMaterial';
 export * from './LineBasicMaterial';
-export * from './MeshCubeMaterial';
+export * from './SkyboxMaterial';
 export * from './Material';
diff --git a/src/materials/Materials.js b/src/materials/Materials.js
index 7b77be06c4c578..eb2101e02655ae 100644
--- a/src/materials/Materials.js
+++ b/src/materials/Materials.js
@@ -15,5 +15,5 @@ export { MeshBasicMaterial } from './MeshBasicMaterial.js';
 export { MeshMatcapMaterial } from './MeshMatcapMaterial.js';
 export { LineDashedMaterial } from './LineDashedMaterial.js';
 export { LineBasicMaterial } from './LineBasicMaterial.js';
-export { MeshCubeMaterial } from './MeshCubeMaterial.js';
+export { SkyboxMaterial } from './SkyboxMaterial.js';
 export { Material } from './Material.js';
diff --git a/src/materials/MeshCubeMaterial.d.ts b/src/materials/SkyboxMaterial.d.ts
similarity index 60%
rename from src/materials/MeshCubeMaterial.d.ts
rename to src/materials/SkyboxMaterial.d.ts
index 454de1a76d64e0..327ffdb8f43355 100644
--- a/src/materials/MeshCubeMaterial.d.ts
+++ b/src/materials/SkyboxMaterial.d.ts
@@ -3,21 +3,21 @@ import { MaterialParameters, Material } from './Material';
 /**
  * parameters is an object with one or more properties defining the material's appearance.
  */
-export interface MeshCubeMaterialParameters extends MaterialParameters {
+export interface SkyboxMaterialParameters extends MaterialParameters {
 	envMap?: Texture;
 	envMapIntensity?: number;
 	opacity: number;
 }
 
-export class MeshCubeMaterial extends Material {
+export class SkyboxMaterial extends Material {
 
-	constructor( parameters?: MeshCubeMaterialParameters );
+	constructor( parameters?: SkyboxMaterialParameters );
 
 	envMap?: Texture;
 	envMapIntensity?: number;
 	opacity: number;
 	roughness: number;
 
-	setValues( parameters: MeshCubeMaterialParameters ): void;
+	setValues( parameters: SkyboxMaterialParameters ): void;
 
 }
diff --git a/src/materials/MeshCubeMaterial.js b/src/materials/SkyboxMaterial.js
similarity index 63%
rename from src/materials/MeshCubeMaterial.js
rename to src/materials/SkyboxMaterial.js
index cfd4719f899b86..96464742b0dfe3 100644
--- a/src/materials/MeshCubeMaterial.js
+++ b/src/materials/SkyboxMaterial.js
@@ -9,11 +9,11 @@ import { BackSide } from '../constants';
  * }
  */
 
-function MeshCubeMaterial( parameters ) {
+function SkyboxMaterial( parameters ) {
 
 	Material.call( this );
 
-	this.type = 'MeshCubeMaterial';
+	this.type = 'SkyboxMaterial';
 
 	this.envMap = null;
 	this.envMapIntensity = 1.0;
@@ -30,12 +30,12 @@ function MeshCubeMaterial( parameters ) {
 
 }
 
-MeshCubeMaterial.prototype = Object.create( Material.prototype );
-MeshCubeMaterial.prototype.constructor = MeshCubeMaterial;
+SkyboxMaterial.prototype = Object.create( Material.prototype );
+SkyboxMaterial.prototype.constructor = SkyboxMaterial;
 
-MeshCubeMaterial.prototype.isMeshCubeMaterial = true;
+SkyboxMaterial.prototype.isSkyboxMaterial = true;
 
-MeshCubeMaterial.prototype.copy = function ( source ) {
+SkyboxMaterial.prototype.copy = function ( source ) {
 
 	Material.prototype.copy.call( this, source );
 
@@ -48,4 +48,4 @@ MeshCubeMaterial.prototype.copy = function ( source ) {
 
 };
 
-export { MeshCubeMaterial };
+export { SkyboxMaterial };
diff --git a/src/renderers/WebGLRenderer.js b/src/renderers/WebGLRenderer.js
index 1bf9294d25d26c..5f92823ca5d23c 100644
--- a/src/renderers/WebGLRenderer.js
+++ b/src/renderers/WebGLRenderer.js
@@ -1897,10 +1897,10 @@ function WebGLRenderer( parameters ) {
 
 				refreshUniformsPoints( m_uniforms, material );
 
-			} else if ( material.isMeshCubeMaterial ) {
+			} else if ( material.isSkyboxMaterial ) {
 
 				refreshUniformsCommon( m_uniforms, material );
-				refreshUniformsCube( m_uniforms, material );
+				refreshUniformsSkybox( m_uniforms, material );
 
 			} else if ( material.isSpriteMaterial ) {
 
@@ -2082,7 +2082,7 @@ function WebGLRenderer( parameters ) {
 
 	}
 
-	function refreshUniformsCube( uniforms, material ) {
+	function refreshUniformsSkybox( uniforms, material ) {
 
 		uniforms.roughness.value = material.roughness;
 		uniforms.opacity.value = material.opacity;
diff --git a/src/renderers/shaders/ShaderChunk.d.ts b/src/renderers/shaders/ShaderChunk.d.ts
index 5435397fa46511..49fd633f05c273 100644
--- a/src/renderers/shaders/ShaderChunk.d.ts
+++ b/src/renderers/shaders/ShaderChunk.d.ts
@@ -22,8 +22,8 @@ export let ShaderChunk: {
 	common: string;
 	cube_frag: string;
 	cube_vert: string;
-	cubeEnv_frag: string;
-	cubeEnv_vert: string;
+	skybox_frag: string;
+	skybox_vert: string;
 	cube_uv_reflection_fragment: string;
 	defaultnormal_vertex: string;
 	depth_frag: string;
diff --git a/src/renderers/shaders/ShaderChunk.js b/src/renderers/shaders/ShaderChunk.js
index d7da022be8dbac..0f854dfbbb75c6 100644
--- a/src/renderers/shaders/ShaderChunk.js
+++ b/src/renderers/shaders/ShaderChunk.js
@@ -92,8 +92,8 @@ import background_frag from './ShaderLib/background_frag.glsl.js';
 import background_vert from './ShaderLib/background_vert.glsl.js';
 import cube_frag from './ShaderLib/cube_frag.glsl.js';
 import cube_vert from './ShaderLib/cube_vert.glsl.js';
-import cubeEnv_frag from './ShaderLib/cubeEnv_frag.glsl.js';
-import cubeEnv_vert from './ShaderLib/cubeEnv_vert.glsl.js';
+import skybox_frag from './ShaderLib/skybox_frag.glsl.js';
+import skybox_vert from './ShaderLib/skybox_vert.glsl.js';
 import depth_frag from './ShaderLib/depth_frag.glsl.js';
 import depth_vert from './ShaderLib/depth_vert.glsl.js';
 import distanceRGBA_frag from './ShaderLib/distanceRGBA_frag.glsl.js';
@@ -216,8 +216,8 @@ export var ShaderChunk = {
 	background_vert: background_vert,
 	cube_frag: cube_frag,
 	cube_vert: cube_vert,
-	cubeEnv_frag: cubeEnv_frag,
-	cubeEnv_vert: cubeEnv_vert,
+	skybox_frag: skybox_frag,
+	skybox_vert: skybox_vert,
 	depth_frag: depth_frag,
 	depth_vert: depth_vert,
 	distanceRGBA_frag: distanceRGBA_frag,
diff --git a/src/renderers/shaders/ShaderLib.js b/src/renderers/shaders/ShaderLib.js
index b848fd61b97a01..127712f6024080 100644
--- a/src/renderers/shaders/ShaderLib.js
+++ b/src/renderers/shaders/ShaderLib.js
@@ -267,11 +267,7 @@ var ShaderLib = {
 
 };
 
-/* -------------------------------------------------------------------------
-//	Cube map shader
- ------------------------------------------------------------------------- */
-
-ShaderLib.cubeEnv = {
+ShaderLib.skybox = {
 
 	uniforms: mergeUniforms( [
 		UniformsLib.common,
@@ -285,8 +281,8 @@ ShaderLib.cubeEnv = {
 		}
 	] ),
 
-	vertexShader: ShaderChunk.cubeEnv_vert,
-	fragmentShader: ShaderChunk.cubeEnv_frag
+	vertexShader: ShaderChunk.skybox_vert,
+	fragmentShader: ShaderChunk.skybox_frag
 
 };
 
diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js b/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
similarity index 100%
rename from src/renderers/shaders/ShaderLib/cubeEnv_frag.glsl.js
rename to src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
diff --git a/src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js b/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
similarity index 100%
rename from src/renderers/shaders/ShaderLib/cubeEnv_vert.glsl.js
rename to src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
diff --git a/src/renderers/webgl/WebGLBackground.js b/src/renderers/webgl/WebGLBackground.js
index bc7cacde99a32e..adf78c03af4832 100644
--- a/src/renderers/webgl/WebGLBackground.js
+++ b/src/renderers/webgl/WebGLBackground.js
@@ -6,7 +6,7 @@ import { FrontSide } from '../../constants.js';
 import { BoxBufferGeometry } from '../../geometries/BoxGeometry.js';
 import { PlaneBufferGeometry } from '../../geometries/PlaneGeometry.js';
 import { ShaderMaterial } from '../../materials/ShaderMaterial.js';
-import { MeshCubeMaterial } from '../../materials/MeshCubeMaterial.js';
+import { SkyboxMaterial } from '../../materials/SkyboxMaterial.js';
 import { Color } from '../../math/Color.js';
 import { Mesh } from '../../objects/Mesh.js';
 import { ShaderLib } from '../shaders/ShaderLib.js';
@@ -67,7 +67,7 @@ function WebGLBackground( renderer, state, objects, premultipliedAlpha ) {
 
 				boxMesh = new Mesh(
 					new BoxBufferGeometry( 1, 1, 1 ),
-					new MeshCubeMaterial()
+					new SkyboxMaterial()
 				);
 
 				boxMesh.geometry.removeAttribute( 'normal' );
diff --git a/src/renderers/webgl/WebGLPrograms.js b/src/renderers/webgl/WebGLPrograms.js
index 96ae5bcda09ea0..1272142226d169 100644
--- a/src/renderers/webgl/WebGLPrograms.js
+++ b/src/renderers/webgl/WebGLPrograms.js
@@ -25,7 +25,7 @@ function WebGLPrograms( renderer, extensions, capabilities ) {
 		PointsMaterial: 'points',
 		ShadowMaterial: 'shadow',
 		SpriteMaterial: 'sprite',
-		MeshCubeMaterial: 'cubeEnv',
+		SkyboxMaterial: 'skybox',
 	};
 
 	var parameterNames = [

From 989fdd23fba74a1cd4be3ad45eb71081d8b461d6 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 3 Jul 2019 16:23:05 -0400
Subject: [PATCH 09/21] Missed a couple spaces in the last commit

---
 examples/js/postprocessing/CubeTexturePass.js  | 6 +++---
 examples/jsm/postprocessing/CubeTexturePass.js | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/examples/js/postprocessing/CubeTexturePass.js b/examples/js/postprocessing/CubeTexturePass.js
index aa74bc1df0ff5b..6932ab61d28ce8 100644
--- a/examples/js/postprocessing/CubeTexturePass.js
+++ b/examples/js/postprocessing/CubeTexturePass.js
@@ -54,9 +54,9 @@ THREE.CubeTexturePass.prototype = Object.assign( Object.create( THREE.Pass.proto
 		this.cubeMaterial.opacity = this.opacity;
 		this.cubeMaterial.transparent = ( this.opacity < 1.0 );
 
-		renderer.setRenderTarget(this.renderToScreen ? null : readBuffer);
-		if(this.clear) renderer.clear();
-		renderer.render( this.cubeScene, this.cubeCamera);
+		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
+		if( this.clear ) renderer.clear();
+		renderer.render( this.cubeScene, this.cubeCamera );
 
 		renderer.autoClear = oldAutoClear;
 
diff --git a/examples/jsm/postprocessing/CubeTexturePass.js b/examples/jsm/postprocessing/CubeTexturePass.js
index 41f6e4c3b1df0f..0aafca11a9d457 100644
--- a/examples/jsm/postprocessing/CubeTexturePass.js
+++ b/examples/jsm/postprocessing/CubeTexturePass.js
@@ -65,7 +65,7 @@ CubeTexturePass.prototype = Object.assign( Object.create( Pass.prototype ), {
 
 		renderer.setRenderTarget( this.renderToScreen ? null : readBuffer );
 		if( this.clear ) renderer.clear();
-		renderer.render( this.cubeScene, this.cubeCamera);
+		renderer.render( this.cubeScene, this.cubeCamera );
 
 		renderer.autoClear = oldAutoClear;
 

From 3099b18bf332e15b6fa98aeedcde7ed737825120 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 3 Jul 2019 16:31:56 -0400
Subject: [PATCH 10/21] Removed clipping planes and log depth buffer

---
 src/renderers/shaders/ShaderLib/skybox_frag.glsl.js | 5 -----
 src/renderers/shaders/ShaderLib/skybox_vert.glsl.js | 2 --
 2 files changed, 7 deletions(-)

diff --git a/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js b/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
index 9a87e25f3b7d7d..7790eee43503a2 100644
--- a/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
+++ b/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
@@ -6,15 +6,11 @@ uniform float roughness;
 varying vec3 vWorldPosition;
 
 #include <common>
-#include <logdepthbuf_pars_fragment>
-#include <clipping_planes_pars_fragment>
 #include <envmap_pars_fragment>
 #include <cube_uv_reflection_fragment>
 
 void main() {
 
-	#include <clipping_planes_fragment>
-
 	vec3 queryReflectVec = vec3( tFlip * vWorldPosition.x, vWorldPosition.yz );
 
 	vec4 envMapColor = vec4( 0.0 );
@@ -46,7 +42,6 @@ void main() {
 
 	#include <tonemapping_fragment>
 	#include <encodings_fragment>
-	#include <logdepthbuf_fragment>
 
 }
 `;
diff --git a/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js b/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
index 475116d2fdf8a1..744ebc5ef74620 100644
--- a/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
+++ b/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
@@ -2,7 +2,6 @@ export default /* glsl */`
 varying vec3 vWorldPosition;
 
 #include <common>
-#include <clipping_planes_pars_vertex>
 
 #if NUM_CLIPPING_PLANES == 0
 	#if ! defined( VARYING_VVIEWPOSITION )
@@ -17,7 +16,6 @@ void main() {
 
 	#include <begin_vertex>
 	#include <project_vertex>
-	#include <clipping_planes_vertex>
 
 	vViewPosition = - mvPosition.xyz;
 	gl_Position.z = gl_Position.w; // set z to camera.far

From 8939d85f0a25c16764d0f7c39e91177e2467a962 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 3 Jul 2019 16:33:49 -0400
Subject: [PATCH 11/21] Renamed variable

---
 src/renderers/shaders/ShaderLib/skybox_frag.glsl.js | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js b/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
index 7790eee43503a2..18a3642a427abd 100644
--- a/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
+++ b/src/renderers/shaders/ShaderLib/skybox_frag.glsl.js
@@ -11,7 +11,7 @@ varying vec3 vWorldPosition;
 
 void main() {
 
-	vec3 queryReflectVec = vec3( tFlip * vWorldPosition.x, vWorldPosition.yz );
+	vec3 queryVec = vec3( tFlip * vWorldPosition.x, vWorldPosition.yz );
 
 	vec4 envMapColor = vec4( 0.0 );
 
@@ -19,11 +19,11 @@ void main() {
 
 		#ifdef TEXTURE_LOD_EXT
 
-			envMapColor = textureCubeLodEXT( envMap, queryReflectVec, roughness * 8.0 );
+			envMapColor = textureCubeLodEXT( envMap, queryVec, roughness * 8.0 );
 
 		#else
 
-			envMapColor = textureCube( envMap, queryReflectVec, roughness * 8.0 );
+			envMapColor = textureCube( envMap, queryVec, roughness * 8.0 );
 
 		#endif
 
@@ -32,7 +32,7 @@ void main() {
 
 	#elif defined( ENVMAP_TYPE_CUBE_UV )
 
-		envMapColor = textureCubeUV( queryReflectVec, queryReflectVec, roughness );
+		envMapColor = textureCubeUV( queryVec, queryVec, roughness );
 		envMapColor.rgb *= envMapIntensity;
 
 	#endif

From 70a4dc61051c528b0c92ce09f326268e0d67bb58 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 3 Jul 2019 16:34:25 -0400
Subject: [PATCH 12/21] Removed comment

---
 src/renderers/shaders/ShaderLib/cube_vert.glsl.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/renderers/shaders/ShaderLib/cube_vert.glsl.js b/src/renderers/shaders/ShaderLib/cube_vert.glsl.js
index 00d39a39ad527d..66f1c4302c7614 100644
--- a/src/renderers/shaders/ShaderLib/cube_vert.glsl.js
+++ b/src/renderers/shaders/ShaderLib/cube_vert.glsl.js
@@ -11,8 +11,6 @@ void main() {
 	#include <project_vertex>
 
 	gl_Position.z = gl_Position.w; // set z to camera.far
-	// important because otherwise the cube used for rendering the cubeMap might
-	// get clipped
 
 }
 `;

From 8d32c8a275b27228d66c69f6fde2ec6065b0ec0b Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 3 Jul 2019 16:36:39 -0400
Subject: [PATCH 13/21] Undid changes to WebGLBackground

---
 src/renderers/webgl/WebGLBackground.js | 28 ++++++++++++++++++++++----
 1 file changed, 24 insertions(+), 4 deletions(-)

diff --git a/src/renderers/webgl/WebGLBackground.js b/src/renderers/webgl/WebGLBackground.js
index adf78c03af4832..95a4f0677f6298 100644
--- a/src/renderers/webgl/WebGLBackground.js
+++ b/src/renderers/webgl/WebGLBackground.js
@@ -2,11 +2,10 @@
  * @author mrdoob / http://mrdoob.com/
  */
 
-import { FrontSide } from '../../constants.js';
+import { BackSide, FrontSide } from '../../constants.js';
 import { BoxBufferGeometry } from '../../geometries/BoxGeometry.js';
 import { PlaneBufferGeometry } from '../../geometries/PlaneGeometry.js';
 import { ShaderMaterial } from '../../materials/ShaderMaterial.js';
-import { SkyboxMaterial } from '../../materials/SkyboxMaterial.js';
 import { Color } from '../../math/Color.js';
 import { Mesh } from '../../objects/Mesh.js';
 import { ShaderLib } from '../shaders/ShaderLib.js';
@@ -67,7 +66,16 @@ function WebGLBackground( renderer, state, objects, premultipliedAlpha ) {
 
 				boxMesh = new Mesh(
 					new BoxBufferGeometry( 1, 1, 1 ),
-					new SkyboxMaterial()
+					new ShaderMaterial( {
+						type: 'BackgroundCubeMaterial',
+						uniforms: cloneUniforms( ShaderLib.cube.uniforms ),
+						vertexShader: ShaderLib.cube.vertexShader,
+						fragmentShader: ShaderLib.cube.fragmentShader,
+						side: BackSide,
+						depthTest: false,
+						depthWrite: false,
+						fog: false
+					} )
 				);
 
 				boxMesh.geometry.removeAttribute( 'normal' );
@@ -79,12 +87,24 @@ function WebGLBackground( renderer, state, objects, premultipliedAlpha ) {
 
 				};
 
+				// enable code injection for non-built-in material
+				Object.defineProperty( boxMesh.material, 'map', {
+
+					get: function () {
+
+						return this.uniforms.tCube.value;
+
+					}
+
+				} );
+
 				objects.update( boxMesh );
 
 			}
 
 			var texture = background.isWebGLRenderTargetCube ? background.texture : background;
-			boxMesh.material.envMap = texture;
+			boxMesh.material.uniforms.tCube.value = texture;
+			boxMesh.material.uniforms.tFlip.value = ( background.isWebGLRenderTargetCube ) ? 1 : - 1;
 
 			if ( currentBackground !== background ||
 			     currentBackgroundVersion !== texture.version ) {

From e62e9cc8a4250c4436df5d3c86cacd236ee733fa Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Mon, 8 Jul 2019 16:31:23 -0400
Subject: [PATCH 14/21] Removed unnecessary varying 'vViewPosition'

---
 src/renderers/shaders/ShaderLib/skybox_vert.glsl.js | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js b/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
index 744ebc5ef74620..28767add8b3782 100644
--- a/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
+++ b/src/renderers/shaders/ShaderLib/skybox_vert.glsl.js
@@ -3,13 +3,6 @@ varying vec3 vWorldPosition;
 
 #include <common>
 
-#if NUM_CLIPPING_PLANES == 0
-	#if ! defined( VARYING_VVIEWPOSITION )
-   		varying vec3 vViewPosition;
-   		#define VARYING_VVIEWPOSITION 1
-   #endif
-#endif
-
 void main() {
 
 	vWorldPosition = transformDirection( position, modelMatrix );
@@ -17,7 +10,6 @@ void main() {
 	#include <begin_vertex>
 	#include <project_vertex>
 
-	vViewPosition = - mvPosition.xyz;
 	gl_Position.z = gl_Position.w; // set z to camera.far
 	// important because otherwise the cube used for rendering the cubeMap might
 	// get clipped

From f33550e490ad83c8ddca9d841e9a8de3b53d37c6 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 10 Jul 2019 13:28:18 -0400
Subject: [PATCH 15/21] Update webgl_postprocessing_backgrounds.html

---
 examples/webgl_postprocessing_backgrounds.html | 1 +
 1 file changed, 1 insertion(+)

diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index 3ae7898166c951..292b41c107f71f 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -123,6 +123,7 @@
 				renderer.setPixelRatio( devicePixelRatio );
 				renderer.setSize( width, height );
 				document.body.appendChild( renderer.domElement );
+				renderer.gammaOutput = true;
 
 				stats = new Stats();
 				container.appendChild( stats.dom );

From 3161d6dd3253cae799b6c3334c5b0ddb44dc0a57 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 24 Jul 2019 14:53:20 -0400
Subject: [PATCH 16/21] reverted gammaOutput, changed default hdr parameters

---
 examples/webgl_postprocessing_backgrounds.html | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index 292b41c107f71f..ca665308d471dd 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -67,7 +67,7 @@
 
 				exposure: 1,
 
-				hdr: true
+				hdr: false
 
 				//autoRotate: true,
 
@@ -123,7 +123,6 @@
 				renderer.setPixelRatio( devicePixelRatio );
 				renderer.setSize( width, height );
 				document.body.appendChild( renderer.domElement );
-				renderer.gammaOutput = true;
 
 				stats = new Stats();
 				container.appendChild( stats.dom );

From a99287d73aaf2cd74ac559240262a60aaa27c3d8 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Thu, 25 Jul 2019 16:44:48 -0400
Subject: [PATCH 17/21] Fixed import convention

---
 .../webgl_postprocessing_backgrounds.html     | 43 +++++++------------
 1 file changed, 15 insertions(+), 28 deletions(-)

diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index ca665308d471dd..e73c909c989949 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -15,20 +15,7 @@
 		<div id="container"></div>
 
 		<script type="module">
-			import {
-				CubeTextureLoader,
-				Group,
-				Mesh,
-				MeshStandardMaterial,
-				PerspectiveCamera,
-				PointLight,
-				Scene,
-				SphereBufferGeometry,
-				TextureLoader,
-				WebGLRenderer,
-				UnsignedByteType,
-				LinearFilter
-			} from "../build/three.module.js";
+			import * as THREE from "../build/three.module.js";
 
 			import Stats from './jsm/libs/stats.module.js';
 
@@ -119,7 +106,7 @@
 				var aspect = width / height;
 				var devicePixelRatio = window.devicePixelRatio || 1;
 
-				renderer = new WebGLRenderer();
+				renderer = new THREE.WebGLRenderer();
 				renderer.setPixelRatio( devicePixelRatio );
 				renderer.setSize( width, height );
 				document.body.appendChild( renderer.domElement );
@@ -129,40 +116,40 @@
 
 				//
 
-				cameraP = new PerspectiveCamera( 65, aspect, 1, 10 );
+				cameraP = new THREE.PerspectiveCamera( 65, aspect, 1, 10 );
 				cameraP.position.z = 7;
 
-				scene = new Scene();
+				scene = new THREE.Scene();
 
-				var group = new Group();
+				var group = new THREE.Group();
 				scene.add( group );
 
-				var light = new PointLight( 0xddffdd, 1.0 );
+				var light = new THREE.PointLight( 0xddffdd, 1.0 );
 				light.position.z = 70;
 				light.position.y = - 70;
 				light.position.x = - 70;
 				scene.add( light );
 
-				var light2 = new PointLight( 0xffdddd, 1.0 );
+				var light2 = new THREE.PointLight( 0xffdddd, 1.0 );
 				light2.position.z = 70;
 				light2.position.x = - 70;
 				light2.position.y = 70;
 				scene.add( light2 );
 
-				var light3 = new PointLight( 0xddddff, 1.0 );
+				var light3 = new THREE.PointLight( 0xddddff, 1.0 );
 				light3.position.z = 70;
 				light3.position.x = 70;
 				light3.position.y = - 70;
 				scene.add( light3 );
 
-				var geometry = new SphereBufferGeometry( 1, 48, 24 );
+				var geometry = new THREE.SphereBufferGeometry( 1, 48, 24 );
 
-				material = new MeshStandardMaterial();
+				material = new THREE.MeshStandardMaterial();
 				material.roughness = 0.5 * Math.random() + 0.25;
 				material.metalness = 0;
 				material.color.setHSL( Math.random(), 1.0, 0.3 );
 
-				var mesh = new Mesh( geometry, material );
+				var mesh = new THREE.Mesh( geometry, material );
 				group.add( mesh );
 
 				// postprocessing
@@ -185,7 +172,7 @@
 				texturePass = new TexturePass();
 				composer.addPass( texturePass );
 
-				var textureLoader = new TextureLoader();
+				var textureLoader = new THREE.TextureLoader();
 				textureLoader.load( "textures/hardwood2_diffuse.jpg", function ( map ) {
 
 					texturePass.map = map;
@@ -196,7 +183,7 @@
 				composer.addPass( cubeTexturePassP );
 
 				var ldrUrls = genCubeUrls( "textures/cube/pisa/", ".png" );
-				ldrCubeMap = new CubeTextureLoader().load( ldrUrls, function ( ) {
+				ldrCubeMap = new THREE.CubeTextureLoader().load( ldrUrls, function ( ) {
 
 					console.log( "loaded ldr envmap" );
 
@@ -205,10 +192,10 @@
 				var hdrUrls = [ 'px.hdr', 'nx.hdr', 'py.hdr', 'ny.hdr', 'pz.hdr', 'nz.hdr' ];
 				hdrCubeMap = new HDRCubeTextureLoader()
 					.setPath( './textures/cube/pisaHDR/' )
-					.setType( UnsignedByteType )
+					.setDataType( THREE.UnsignedByteType )
 					.load( hdrUrls, function () {
 
-						hdrCubeMap.magFilter = LinearFilter;
+						hdrCubeMap.magFilter = THREE.LinearFilter;
 						console.log( "loaded hdr envmap" );
 
 					} );

From 0a473c887dac2a38a9fd434d814e98b1cb835d5f Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Tue, 30 Jul 2019 09:16:25 -0400
Subject: [PATCH 18/21] Added back gammaOutput=true and sRGB encoding to demo

---
 examples/webgl_postprocessing_backgrounds.html | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index e73c909c989949..aa50032bb1d5cf 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -110,6 +110,7 @@
 				renderer.setPixelRatio( devicePixelRatio );
 				renderer.setSize( width, height );
 				document.body.appendChild( renderer.domElement );
+				renderer.gammaOutput = true;
 
 				stats = new Stats();
 				container.appendChild( stats.dom );
@@ -188,6 +189,7 @@
 					console.log( "loaded ldr envmap" );
 
 				} );
+				ldrCubeMap.encoding = THREE.sRGBEncoding;
 
 				var hdrUrls = [ 'px.hdr', 'nx.hdr', 'py.hdr', 'ny.hdr', 'pz.hdr', 'nz.hdr' ];
 				hdrCubeMap = new HDRCubeTextureLoader()

From e4ada7d050f6b503cd25f43e4e5c0876c4ccf95f Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 7 Aug 2019 12:42:47 -0400
Subject: [PATCH 19/21] Fixed background not aligning with reflection in
 objects

---
 examples/jsm/postprocessing/CubeTexturePass.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/examples/jsm/postprocessing/CubeTexturePass.js b/examples/jsm/postprocessing/CubeTexturePass.js
index 0aafca11a9d457..ca2a676c93ea9d 100644
--- a/examples/jsm/postprocessing/CubeTexturePass.js
+++ b/examples/jsm/postprocessing/CubeTexturePass.js
@@ -48,12 +48,12 @@ CubeTexturePass.prototype = Object.assign( Object.create( Pass.prototype ), {
 		var oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
-		this.cubeCamera.projectionMatrix.copy( camera.projectionMatrix );
+		this.cubeCamera.copy( camera );
 		this.cubeCamera.near = 0.01;
 		this.cubeCamera.far = 20;
-		this.cubeCamera.aspect = camera.aspect;
-		this.cubeCamera.updateProjectionMatrix();
+		this.cubeCamera.position.set(0, 0, 0);
 		this.cubeCamera.quaternion.setFromRotationMatrix( camera.matrixWorld );
+		this.cubeCamera.updateProjectionMatrix();
 		if( this.cubeMaterial.envMap != this.envMap ) {
 			this.cubeMaterial.envMap = this.envMap;
 			this.cubeMaterial.needsUpdate = true;

From 2b6a568118de730d0f1954208517194832e9bd93 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Wed, 7 Aug 2019 12:52:00 -0400
Subject: [PATCH 20/21] Copied changes from examples/jsm to examples/js

---
 examples/js/postprocessing/CubeTexturePass.js | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/examples/js/postprocessing/CubeTexturePass.js b/examples/js/postprocessing/CubeTexturePass.js
index 6932ab61d28ce8..31447c03e12397 100644
--- a/examples/js/postprocessing/CubeTexturePass.js
+++ b/examples/js/postprocessing/CubeTexturePass.js
@@ -39,12 +39,12 @@ THREE.CubeTexturePass.prototype = Object.assign( Object.create( THREE.Pass.proto
 		var oldAutoClear = renderer.autoClear;
 		renderer.autoClear = false;
 
-		this.cubeCamera.projectionMatrix.copy( camera.projectionMatrix );
+		this.cubeCamera.copy( camera );
 		this.cubeCamera.near = 0.01;
 		this.cubeCamera.far = 20;
-		this.cubeCamera.aspect = camera.aspect;
-		this.cubeCamera.updateProjectionMatrix();
+		this.cubeCamera.position.set(0, 0, 0);
 		this.cubeCamera.quaternion.setFromRotationMatrix( camera.matrixWorld );
+		this.cubeCamera.updateProjectionMatrix();
 		if( this.cubeMaterial.envMap != this.envMap ) {
 			this.cubeMaterial.envMap = this.envMap;
 			this.cubeMaterial.needsUpdate = true;

From 35207069c94defdbf95aa37b7d97004146906ad0 Mon Sep 17 00:00:00 2001
From: Daniel Sturk <danielsturk1@gmail.com>
Date: Fri, 11 Oct 2019 16:12:20 -0400
Subject: [PATCH 21/21] Removed commented code

---
 examples/webgl_postprocessing_backgrounds.html | 8 --------
 1 file changed, 8 deletions(-)

diff --git a/examples/webgl_postprocessing_backgrounds.html b/examples/webgl_postprocessing_backgrounds.html
index aa50032bb1d5cf..63d19c3422d00c 100644
--- a/examples/webgl_postprocessing_backgrounds.html
+++ b/examples/webgl_postprocessing_backgrounds.html
@@ -56,10 +56,6 @@
 
 				hdr: false
 
-				//autoRotate: true,
-
-				//camera: 'perspective'
-
 			};
 
 			init();
@@ -89,10 +85,6 @@
 
 				gui.add( params, "hdr" );
 
-				//gui.add( params, "autoRotate" );
-
-				//gui.add( params, 'camera', [ 'perspective', 'orthographic' ] );
-
 				gui.open();
 
 			}