Browse Source

Made webvr_cubes examples a bit more fun.

Mr.doob 9 năm trước cách đây
mục cha
commit
78b1a094c3
1 tập tin đã thay đổi với 36 bổ sung11 xóa
  1. 36 11
      examples/webvr_cubes.html

+ 36 - 11
examples/webvr_cubes.html

@@ -40,6 +40,7 @@
 			var effect, controls;
 			var effect, controls;
 
 
 			var room;
 			var room;
+			var isMouseDown = false;
 
 
 			var INTERSECTED;
 			var INTERSECTED;
 			var crosshair;
 			var crosshair;
@@ -88,7 +89,7 @@
 				light.position.set( 1, 1, 1 ).normalize();
 				light.position.set( 1, 1, 1 ).normalize();
 				scene.add( light );
 				scene.add( light );
 
 
-				var geometry = new THREE.BoxGeometry( 0.2, 0.2, 0.2 );
+				var geometry = new THREE.BoxGeometry( 0.15, 0.15, 0.15 );
 
 
 				for ( var i = 0; i < 200; i ++ ) {
 				for ( var i = 0; i < 200; i ++ ) {
 
 
@@ -133,20 +134,26 @@
 
 
 				}
 				}
 
 
-				renderer.domElement.addEventListener( 'click', function ( event ) {
+				document.addEventListener( 'mousedown', onMouseDown, false );
+				document.addEventListener( 'mouseup', onMouseUp, false );
+				document.addEventListener( 'touchstart', onMouseDown, false );
+				document.addEventListener( 'touchend', onMouseUp, false );
 
 
-					if ( INTERSECTED ) {
+				//
 
 
-						var object = INTERSECTED;
-						object.userData.velocity.subVectors( object.position, camera.position ).normalize().multiplyScalar( 0.1 );
+				window.addEventListener( 'resize', onWindowResize, false );
 
 
-					}
+			}
 
 
-				} );
+			function onMouseDown() {
 
 
-				//
+				isMouseDown = true;
 
 
-				window.addEventListener( 'resize', onWindowResize, false );
+			}
+
+			function onMouseUp() {
+
+				isMouseDown = false;
 
 
 			}
 			}
 
 
@@ -170,6 +177,21 @@
 
 
 			function render() {
 			function render() {
 
 
+				if ( isMouseDown === true ) {
+
+					var cube = room.children[ 0 ];
+					room.remove( cube );
+
+					cube.position.set( 0, 0, - 0.75 );
+					cube.position.applyQuaternion( camera.quaternion );
+					cube.userData.velocity.x = ( Math.random() - 0.5 ) * 0.02;
+					cube.userData.velocity.y = ( Math.random() - 0.5 ) * 0.02;
+					cube.userData.velocity.z = ( Math.random() * 0.01 - 0.05 );
+					cube.userData.velocity.applyQuaternion( camera.quaternion );
+					room.add( cube );
+
+				}
+
 				// find intersections
 				// find intersections
 
 
 				raycaster.setFromCamera( { x: 0, y: 0 }, camera );
 				raycaster.setFromCamera( { x: 0, y: 0 }, camera );
@@ -196,7 +218,7 @@
 
 
 				}
 				}
 
 
-				controls.update();
+				// Keep cubes inside room
 
 
 				for ( var i = 0; i < room.children.length; i ++ ) {
 				for ( var i = 0; i < room.children.length; i ++ ) {
 
 
@@ -227,10 +249,13 @@
 
 
 					}
 					}
 
 
-					cube.rotation.x += 0.01;
+					cube.rotation.x += cube.userData.velocity.x * 2;
+					cube.rotation.y += cube.userData.velocity.y * 2;
+					cube.rotation.z += cube.userData.velocity.z * 2;
 
 
 				}
 				}
 
 
+				controls.update();
 				effect.render( scene, camera );
 				effect.render( scene, camera );
 
 
 			}
 			}