Scaled webvr_cubes down.

examples/webvr_cubes.html

@@ -39,9 +39,9 @@
 			var camera, scene, raycaster, renderer;
 			var effect, controls;
 
-			var cubes = [];
+			var room;
+
 			var INTERSECTED;
-			var radius = 100, theta = 0;
 			var crosshair;
 
 			init();
@@ -62,7 +62,7 @@
 
 				scene = new THREE.Scene();
 
-				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 1000 );
+				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 10 );
 				scene.add( camera );
 
 				crosshair = new THREE.Mesh(
@@ -76,11 +76,11 @@
 				crosshair.position.z = - 2;
 				camera.add( crosshair );
 
-				var mesh = new THREE.Mesh(
-					new THREE.BoxGeometry( 200, 200, 200, 10, 10, 10 ),
+				room = new THREE.Mesh(
+					new THREE.BoxGeometry( 6, 6, 6, 10, 10, 10 ),
 					new THREE.MeshBasicMaterial( { color: 0x202020, wireframe: true } )
 				);
-				scene.add( mesh );
+				scene.add( room );
 
 				scene.add( new THREE.HemisphereLight( 0x404020, 0x202040, 0.5 ) );
 
@@ -88,15 +88,15 @@
 				light.position.set( 1, 1, 1 ).normalize();
 				scene.add( light );
 
-				var geometry = new THREE.BoxGeometry( 5, 5, 5 );
+				var geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
 
 				for ( var i = 0; i < 200; i ++ ) {
 
 					var object = new THREE.Mesh( geometry, new THREE.MeshLambertMaterial( { color: Math.random() * 0xffffff } ) );
 
-					object.position.x = Math.random() * 200 - 100;
-					object.position.y = Math.random() * 200 - 100;
-					object.position.z = Math.random() * 200 - 100;
+					object.position.x = Math.random() * 4 - 2;
+					object.position.y = Math.random() * 4 - 2;
+					object.position.z = Math.random() * 4 - 2;
 
 					object.rotation.x = Math.random() * 2 * Math.PI;
 					object.rotation.y = Math.random() * 2 * Math.PI;
@@ -107,12 +107,11 @@
 					object.scale.z = Math.random() + 0.5;
 
 					object.userData.velocity = new THREE.Vector3();
-					object.userData.velocity.x = Math.random() - 0.5;
-					object.userData.velocity.y = Math.random() - 0.5;
-					object.userData.velocity.z = Math.random() - 0.5;
+					object.userData.velocity.x = Math.random() * 0.01 - 0.005;
+					object.userData.velocity.y = Math.random() * 0.01 - 0.005;
+					object.userData.velocity.z = Math.random() * 0.01 - 0.005;
 
-					scene.add( object );
-					cubes.push( object );
+					room.add( object );
 
 				}
 
@@ -139,7 +138,7 @@
 					if ( INTERSECTED ) {
 
 						var object = INTERSECTED;
-						object.userData.velocity.subVectors( object.position, camera.position ).normalize();
+						object.userData.velocity.subVectors( object.position, camera.position ).normalize().multiplyScalar( 0.1 );
 
 					}
 
@@ -175,7 +174,7 @@
 
 				raycaster.setFromCamera( { x: 0, y: 0 }, camera );
 
-				var intersects = raycaster.intersectObjects( cubes );
+				var intersects = raycaster.intersectObjects( room.children );
 
 				if ( intersects.length > 0 ) {
 
@@ -199,31 +198,31 @@
 
 				controls.update();
 
-				for ( var i = 0; i < cubes.length; i ++ ) {
+				for ( var i = 0; i < room.children.length; i ++ ) {
 
-					var cube = cubes[ i ];
+					var cube = room.children[ i ];
 
 					cube.userData.velocity.multiplyScalar( 0.999 );
 
 					cube.position.add( cube.userData.velocity );
 
-					if ( cube.position.x < - 100 || cube.position.x > 100 ) {
+					if ( cube.position.x < - 3 || cube.position.x > 3 ) {
 
-						cube.position.x = THREE.Math.clamp( cube.position.x, - 100, 100 );
+						cube.position.x = THREE.Math.clamp( cube.position.x, - 3, 3 );
 						cube.userData.velocity.x = - cube.userData.velocity.x;
 
 					}
 
-					if ( cube.position.y < - 100 || cube.position.y > 100 ) {
+					if ( cube.position.y < - 3 || cube.position.y > 3 ) {
 
-						cube.position.y = THREE.Math.clamp( cube.position.y, - 100, 100 );
+						cube.position.y = THREE.Math.clamp( cube.position.y, - 3, 3 );
 						cube.userData.velocity.y = - cube.userData.velocity.y;
 
 					}
 
-					if ( cube.position.z < - 100 || cube.position.z > 100 ) {
+					if ( cube.position.z < - 3 || cube.position.z > 3 ) {
 
-						cube.position.z = THREE.Math.clamp( cube.position.z, - 100, 100 );
+						cube.position.z = THREE.Math.clamp( cube.position.z, - 3, 3 );
 						cube.userData.velocity.z = - cube.userData.velocity.z;
 
 					}

examples/webvr_vive.html

@@ -41,7 +41,7 @@
 			var camera, scene, raycaster, renderer;
 			var effect, controls;
 
-			var box;
+			var room;
 
 			var INTERSECTED;
 			var crosshair;
@@ -64,7 +64,7 @@
 
 				scene = new THREE.Scene();
 
-				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 1000 );
+				camera = new THREE.PerspectiveCamera( 70, window.innerWidth / window.innerHeight, 0.1, 10 );
 				scene.add( camera );
 
 				crosshair = new THREE.Mesh(
@@ -78,12 +78,12 @@
 				crosshair.position.z = - 2;
 				camera.add( crosshair );
 
-				box = new THREE.Mesh(
+				room = new THREE.Mesh(
 					new THREE.BoxGeometry( 6, 6, 6, 10, 10, 10 ),
 					new THREE.MeshBasicMaterial( { color: 0x202020, wireframe: true } )
 				);
-				box.position.y = 3;
-				scene.add( box );
+				room.position.y = 3;
+				scene.add( room );
 
 				scene.add( new THREE.HemisphereLight( 0x404020, 0x202040, 0.5 ) );
 
@@ -114,7 +114,7 @@
 					object.userData.velocity.y = Math.random() * 0.01 - 0.005;
 					object.userData.velocity.z = Math.random() * 0.01 - 0.005;
 
-					box.add( object );
+					room.add( object );
 
 				}
 
@@ -153,7 +153,7 @@
 
 					group.position.y = - 2;
 					group.rotation.y = - Math.PI / 2;
-					box.add( group );
+					room.add( group );
 
 				} );
 
@@ -216,7 +216,7 @@
 
 				raycaster.setFromCamera( { x: 0, y: 0 }, camera );
 
-				var intersects = raycaster.intersectObjects( box.children );
+				var intersects = raycaster.intersectObjects( room.children );
 
 				if ( intersects.length > 0 ) {
 
@@ -241,9 +241,9 @@
 				controls.update();
 
 
-				for ( var i = 0; i < box.children.length; i ++ ) {
+				for ( var i = 0; i < room.children.length; i ++ ) {
 
-					var cube = box.children[ i ];
+					var cube = room.children[ i ];
 
 					if ( cube.geometry instanceof THREE.BoxGeometry === false ) continue;