Refactored panorama creation helpers into SceneUtils.js

This cleaned up cube mapping examples quite a bit ;)

examples/materials_cubemap.html

@@ -41,6 +41,7 @@
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/SceneUtils.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
@@ -112,9 +113,9 @@
 				var cubeMaterial2 = new THREE.MeshLambertMaterial( { color: 0xffee00, env_map: refractionCube, refraction_ratio: 0.95 } );
 				var cubeMaterial1 = new THREE.MeshLambertMaterial( { color: 0xffffff, env_map: reflectionCube } )
 
-				//createCubePlanes( 10000, images );
-				//createCube( 10000, images );
-				createCubeWebGL( 10000, reflectionCube );
+				//SceneUtils.addPanoramaCubePlanes( sceneCube, 100000, images );
+				//SceneUtils.addPanoramaCube( sceneCube, 100000, images );
+				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, reflectionCube );
 				
 				webglRenderer = new THREE.WebGLRenderer( scene );
 				webglRenderer.setSize( window.innerWidth, window.innerHeight );
@@ -133,77 +134,13 @@
 
 			}
 
-			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				scene.addObject(mesh);
-
-			}
-
-			function addCubeMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				sceneCube.addObject(mesh);
-
-			}
-
-			function createCubeWebGL( size, textureCube ) {
-			
-				var material = new THREE.MeshCubeMaterial( { env_map: textureCube } );
-
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, null, true ), material );
-				sceneCube.addObject( mesh );
-			
-			}
-
-			function createCube( size, images ) {
-
-				var materials = [];
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[4] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, materials, true ), new THREE.MeshFaceMaterial() );
-				sceneCube.addObject( mesh );
-
-			}
-			
-			function createCubePlanes( size, images ) {
-
-				var hsize = size/2, plane = new Plane( size, size ), pi2 = Math.PI/2, pi = Math.PI;
-
-				addCubeMesh( plane, 1,      0,     0,  -hsize,  0,      0,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-				addCubeMesh( plane, 1, -hsize,     0,       0,  0,    pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				addCubeMesh( plane, 1,  hsize,     0,       0,  0,   -pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				addCubeMesh( plane, 1,     0,  hsize,       0,  pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				addCubeMesh( plane, 1,     0, -hsize,       0, -pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-			
-			}
-
 			function createScene( geometry, m1, m2, m3 ) {
 
 				var s = 15;
 
-				addMesh( geometry, s,      0, 0, -100, 0,0,0, m1 );
-				addMesh( geometry, s,   -900, 0, -100, 0,0,0, m2 );
-				addMesh( geometry, s,    900, 0, -100, 0,0,0, m3 );
+				SceneUtils.addMesh( scene, geometry, s,      0, 0, -100, 0,0,0, m1 );
+				SceneUtils.addMesh( scene, geometry, s,   -900, 0, -100, 0,0,0, m2 );
+				SceneUtils.addMesh( scene, geometry, s,    900, 0, -100, 0,0,0, m3 );
 
 			}
 

examples/materials_cubemap_balls_reflection.html

@@ -39,6 +39,7 @@
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 		<script type="text/javascript" src="../src/extras/GeometryUtils.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/SceneUtils.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
@@ -92,6 +93,7 @@
 					// Merging spheres in a single geometry
 					
 					GeometryUtils.merge( geometry, sphere );
+
 				}
 
 				var path = "textures/cube/pisa/";
@@ -112,9 +114,9 @@
 				mesh.position.x = 100;
 				scene.addObject( mesh );
 
-				//createCubePlanes( 100000, images );
-				//createCube( 100000, images );
-				createCubeWebGL( 100000, textureCube );
+				//SceneUtils.addPanoramaCubePlanes( sceneCube, 100000, images );
+				//SceneUtils.addPanoramaCube( sceneCube, 100000, images );
+				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer( scene );
 				webglRenderer.setSize( window.innerWidth, window.innerHeight );
@@ -133,70 +135,6 @@
 
 			}
 
-			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				sceneCube.addObject(mesh);
-
-			}
-
-			function addCubeMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				sceneCube.addObject(mesh);
-
-			}
-
-			function createCubePlanes( size, images ) {
-
-				var hsize = size/2, plane = new Plane( size, size ), pi2 = Math.PI/2, pi = Math.PI;
-
-				addCubeMesh( plane, 1,      0,     0,  -hsize,  0,      0,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-				addCubeMesh( plane, 1, -hsize,     0,       0,  0,    pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				addCubeMesh( plane, 1,  hsize,     0,       0,  0,   -pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				addCubeMesh( plane, 1,     0,  hsize,       0,  pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				addCubeMesh( plane, 1,     0, -hsize,       0, -pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-
-			}
-
-			function createCubeWebGL( size, textureCube ) {
-				
-				var material = new THREE.MeshCubeMaterial( { env_map: textureCube } );
-				
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, null, true ), material );
-				sceneCube.addObject( mesh );
-				
-			}
-
-			function createCube( size, images ) {
-			
-				var materials = [];
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[4] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, materials, true ), new THREE.MeshFaceMaterial() );
-				sceneCube.addObject( mesh );
-
-			}
-
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX ) * 10;

examples/materials_cubemap_balls_refraction.html

@@ -39,6 +39,7 @@
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 		<script type="text/javascript" src="../src/extras/GeometryUtils.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/SceneUtils.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
@@ -91,6 +92,7 @@
 
 					// Merging spheres in a single geometry
 					GeometryUtils.merge( geometry, sphere );
+                    
 				}
 
 				var path = "textures/cube/skybox/";
@@ -109,9 +111,9 @@
 				mesh.position.x = 100;
 				scene.addObject( mesh );
 
-				//createCubePlanes( 100000, images );
-				//createCube( 100000, images );
-				createCubeWebGL( 100000, textureCube );
+				//SceneUtils.addPanoramaCubePlanes( sceneCube, 100000, images );
+				//SceneUtils.addPanoramaCube( sceneCube, 100000, images );
+				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer( scene );
 				webglRenderer.setSize( window.innerWidth, window.innerHeight );
@@ -130,56 +132,6 @@
 
 			}
 
-			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				sceneCube.addObject(mesh);
-
-			}
-
-			function createCubePlanes( size, images ) {
-
-				var hsize = size/2, plane = new Plane( size, size ), pi2 = Math.PI/2, pi = Math.PI;
-
-				addMesh( plane, 1,      0,     0,  -hsize,  0,      0,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-				addMesh( plane, 1, -hsize,     0,       0,  0,    pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				addMesh( plane, 1,  hsize,     0,       0,  0,   -pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				addMesh( plane, 1,     0,  hsize,       0,  pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				addMesh( plane, 1,     0, -hsize,       0, -pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-
-			}
-
-			function createCubeWebGL( size, textureCube ) {
-				
-				var material = new THREE.MeshCubeMaterial( { env_map: textureCube } );
-				
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, null, true ), material );
-				sceneCube.addObject( mesh );
-				
-			}
-
-			function createCube( size, images ) {
-			
-				var materials = [];
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[4] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, materials, true ), new THREE.MeshFaceMaterial() );
-				sceneCube.addObject( mesh );
-
-			}
-
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX ) * 10;

examples/materials_cubemap_escher.html

@@ -36,6 +36,7 @@
 		<script type="text/javascript" src="../src/extras/primitives/Plane.js"></script>
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/SceneUtils.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
@@ -89,9 +90,9 @@
 				mesh.scale.x = mesh.scale.y = mesh.scale.z = 16;
 				scene.addObject( mesh );
 
-				//createCubePlanes( 6000, images );
-				//createCube( 6000, images );
-				createCubeWebGL( 6000, textureCube );
+				//SceneUtils.addPanoramaCubePlanes( scene, 6000, images );
+				//SceneUtils.addPanoramaCube( scene, 6000, images );
+				SceneUtils.addPanoramaCubeWebGL( scene, 6000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer( scene );
 				webglRenderer.setSize( window.innerWidth, window.innerHeight );
@@ -109,58 +110,6 @@
 
 			}
 
-			function addCubeMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				mesh.overdraw = true;
-				mesh.updateMatrix();
-				scene.addObject(mesh);
-
-			}
-
-			function createCube( size, images ) {
-				
-				var materials = [];
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[4] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, materials, true ), new THREE.MeshFaceMaterial() );
-				scene.addObject( mesh );
-
-			}
-
-			function createCubePlanes( size, images ) {
-
-				var hsize = size/2, plane = new Plane( size, size ), pi2 = Math.PI/2, pi = Math.PI;
-
-				addCubeMesh( plane, 1,      0,     0,  -hsize,  0,      0,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-				addCubeMesh( plane, 1, -hsize,     0,       0,  0,    pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				addCubeMesh( plane, 1,  hsize,     0,       0,  0,   -pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				addCubeMesh( plane, 1,     0,  hsize,       0,  pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				addCubeMesh( plane, 1,     0, -hsize,       0, -pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-
-			}
-
-			function createCubeWebGL( size, textureCube ) {
-				
-				var material = new THREE.MeshCubeMaterial( { env_map: textureCube } );
-				
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, null, true ), material );
-				scene.addObject( mesh );
-				
-			}
-
 			function onDocumentMouseMove(event) {
 
 				mouseX = ( event.clientX - windowHalfX );

examples/materials_cubemap_refraction.html

@@ -40,6 +40,7 @@
 		<script type="text/javascript" src="../src/extras/primitives/Cube.js"></script>
 		<script type="text/javascript" src="../src/extras/io/Loader.js"></script>
 		<script type="text/javascript" src="../src/extras/ImageUtils.js"></script>
+		<script type="text/javascript" src="../src/extras/SceneUtils.js"></script>
 
 		<script type="text/javascript" src="js/Stats.js"></script>
 
@@ -110,9 +111,9 @@
 				var cubeMaterial2 = new THREE.MeshBasicMaterial( { color: 0xccfffd, env_map: textureCube, refraction_ratio: 0.985 } );
 				var cubeMaterial1 = new THREE.MeshBasicMaterial( { color: 0xffffff, env_map: textureCube, refraction_ratio: 0.98 } )
 
-				//createCubePlanes( 100000, images );
-				createCube( 100000, images );
-				//createCubeWebGL( 100000, textureCube );
+				//SceneUtils.addPanoramaCubePlanes( sceneCube, 100000, images );
+				//SceneUtils.addPanoramaCube( sceneCube, 100000, images );
+				SceneUtils.addPanoramaCubeWebGL( sceneCube, 100000, textureCube );
 
 				webglRenderer = new THREE.WebGLRenderer( scene );
 				webglRenderer.setSize( window.innerWidth, window.innerHeight );
@@ -130,77 +131,13 @@
 
 			}
 
-			function addMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				scene.addObject(mesh);
-
-			}
-
-			function addCubeMesh( geometry, scale, x, y, z, rx, ry, rz, material ) {
-
-				mesh = new THREE.Mesh( geometry, material );
-				mesh.position.x = x;
-				mesh.position.y = y;
-				mesh.position.z = z;
-				mesh.rotation.x = rx;
-				mesh.rotation.y = ry;
-				mesh.rotation.z = rz;
-				mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
-				sceneCube.addObject(mesh);
-
-			}
-
-			function createCubePlanes( size, images ) {
-
-				var hsize = size/2, plane = new Plane( size, size ), pi2 = Math.PI/2, pi = Math.PI;
-
-				addCubeMesh( plane, 1,      0,     0,  -hsize,  0,      0,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-				addCubeMesh( plane, 1, -hsize,     0,       0,  0,    pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				addCubeMesh( plane, 1,  hsize,     0,       0,  0,   -pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				addCubeMesh( plane, 1,     0,  hsize,       0,  pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				addCubeMesh( plane, 1,     0, -hsize,       0, -pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-
-			}
-
-			function createCubeWebGL( size, textureCube ) {
-				
-				var material = new THREE.MeshCubeMaterial( { env_map: textureCube } );
-				
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, null, true ), material );
-				sceneCube.addObject( mesh );
-				
-			}
-
-			function createCube( size, images ) {
-			
-				var materials = [];
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[4] ) } ) );
-				materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
-
-				mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, materials, true ), new THREE.MeshFaceMaterial() );
-				sceneCube.addObject( mesh );
-
-			}
-
 			function createScene( geometry, m1, m2, m3 ) {
 
 				var s = 1.5, z = -1000;
 
-				addMesh( geometry, s,      0, 0, z, 0,0,0, m1 );
-				addMesh( geometry, s,   -900, 0, z, 0,0,0, m2 );
-				addMesh( geometry, s,    900, 0, z, 0,0,0, m3 );
+				SceneUtils.addMesh( scene, geometry, s,      0, 0, z, 0,0,0, m1 );
+				SceneUtils.addMesh( scene, geometry, s,   -900, 0, z, 0,0,0, m2 );
+				SceneUtils.addMesh( scene, geometry, s,    900, 0, z, 0,0,0, m3 );
 
 			}
 

src/extras/SceneUtils.js

@@ -0,0 +1,54 @@
+var SceneUtils = {
+	
+	addMesh: function ( scene, geometry, scale, x, y, z, rx, ry, rz, material ) {
+		
+		var mesh = new THREE.Mesh( geometry, material );
+		mesh.scale.x = mesh.scale.y = mesh.scale.z = scale;
+		mesh.position.x = x;
+		mesh.position.y = y;
+		mesh.position.z = z;
+		mesh.rotation.x = rx;
+		mesh.rotation.y = ry;
+		mesh.rotation.z = rz;
+		scene.addObject( mesh );
+
+	},
+	
+	addPanoramaCubeWebGL: function ( scene, size, textureCube ) {
+		
+		var material = new THREE.MeshCubeMaterial( { env_map: textureCube } ),
+			mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, null, true ), material );
+		
+		scene.addObject( mesh );
+		
+	},
+
+	addPanoramaCube: function( scene, size, images ) {
+	
+		var materials = [];
+		materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
+		materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
+		materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
+		materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
+		materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[4] ) } ) );
+		materials.push( new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
+
+		mesh = new THREE.Mesh( new Cube( size, size, size, 1, 1, materials, true ), new THREE.MeshFaceMaterial() );
+		scene.addObject( mesh );
+
+	},
+
+	addPanoramaCubePlanes: function ( scene, size, images ) {
+
+		
+		var hsize = size/2, plane = new Plane( size, size ), pi2 = Math.PI/2, pi = Math.PI;
+
+		SceneUtils.addMesh( scene, plane, 1,      0,     0,  -hsize,  0,      0,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[5] ) } ) );
+		SceneUtils.addMesh( scene, plane, 1, -hsize,     0,       0,  0,    pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[0] ) } ) );
+		SceneUtils.addMesh( scene, plane, 1,  hsize,     0,       0,  0,   -pi2,  0, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[1] ) } ) );
+		SceneUtils.addMesh( scene, plane, 1,     0,  hsize,       0,  pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[2] ) } ) );
+		SceneUtils.addMesh( scene, plane, 1,     0, -hsize,       0, -pi2,    0, pi, new THREE.MeshBasicMaterial( { map: new THREE.Texture( images[3] ) } ) );
+
+	}
+	
+}