collide demo

by Alan Lin

HTML

demo
<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="https://dl.dropboxusercontent.com/u/3587259/Code/Threejs/OrbitControls.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/dat-gui/0.5.1/dat.gui.min.js"></script> 
<script src="https://jyunming-chen.github.io/tutsplus/js/KeyboardState.js"></script>

CSS

body {
  overflow: hidden;
}

JavaScript

var scene, renderer, 	camera, 	controls, light
var batR = 5, batH  = 20;
var ballr = 5;
var keyboard = new KeyboardState();

init();
animate();

function init(){
	scene = new THREE.Scene();
  
  renderer = new THREE.WebGLRenderer();
  renderer.setSize(window.innerWidth, window.innerHeight);
	renderer.setClearColor(0x888888);
  
  camera = new THREE.PerspectiveCamera(50, window.innerWidth / window.innerHeight, 1, 10000);
  camera.position.set(0,50,200);
  controls = new THREE.OrbitControls(camera, renderer.domElement);
  
  var gridXZ = new THREE.GridHelper(100, 10);
  gridXZ.setColors(new THREE.Color(0xff0000), new THREE.Color(0xffffff));
  scene.add(gridXZ);
  
  /*light = new THREE.PointLight(0xffffff, 1);
  light.position.set(150, 100, 200);
  scene.add(light);*/
  
  document.body.appendChild(renderer.domElement);
  window.addEventListener('resize', onWindowResize, false);

 	//////////////////////////////////////////////////////////// 
  
  batorigin =  new THREE.Object3D();
  
  bat = new THREE.Mesh( new THREE.CylinderGeometry( batR, batR, batH, 32 ), new THREE.MeshBasicMaterial( {color: 0x000000}));
  bat.position.set(0,batH/2,0);
  
  bathead = new THREE.Mesh( new THREE.SphereGeometry( batR, 32, 32 ), new THREE.MeshBasicMaterial( {color: 0x000000} ) );
  bathead.position.set(0,batH,0);
  batorigin.add( bathead );
  
  batorigin.add(bat);
	scene.add( batorigin );
  
  ball = new THREE.Mesh( new THREE.SphereGeometry( ballr, 32, 32 ), new THREE.MeshBasicMaterial( {color: 0xffff00} ) );
  
  
  scene.add( ball );
}



function animate(){
	controls.update();
  keyboard.update();
	
  if (keyboard.down("Q")) {
  	ball.position.x += 1 ;
  }
  else if (keyboard.down("A")) {
  	ball.position.x -= 1 ;
  }
  else if (keyboard.down("W")) {
  	ball.position.y += 1 ;
  }
  else if (keyboard.down("S")) {
  	ball.position.y -= 1 ;
  }
  else if (keyboard.down("E")) {
  	ball.position.z += 1 ;
  }
  else if (keyboard.down("D")) {
  	ball.position.z -= 1 ;
  }
  
  AAA();
 ...