hw6 throw

by YouTingKuo

HTML

<div id="info">
  hw6
  <br>
  <button id="throw" style="width:20%">Throw</button>
</div>
<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://rawgit.com/jyunming-chen/game3js/master/js/ccdbox.js"></script>
<script src="https://code.jquery.com/jquery-2.1.4.min.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 {
	  background-color: #fff;
	  color: #111;
	  margin: 0px;
	  overflow: hidden;
	  font-family: Monospace;
	  font-size: 20px;
	}
	
	#info {
	  position: absolute;
	  top: 0px;
	  width: 100%;
	  padding: 5px;
	  text-align: center;
	  color: #ffff00
	}
	
	a {
	  color: #00ffff
	}
	
	strong {
	  color: red
	}
	
	#container {
	  z-index: 0;
	  left: 0px;
	  top: 0px;
	  overflow: hidden;
	  position: absolute;
	  width: 100%;
	  height: 100%;
	}

JavaScript

var scene, renderer, camera;
var controls;
var lowerArm, upperArm;
var trashCan;
var gcontrols;
var clock = new THREE.Clock();
var ball, ballP, ballV, ballF;
var frontHitDetect = true;
var backHitDetect = true;
var ballArray = [];
var ts;
var count = 0;
var keyboard = new KeyboardState();
var lastPos = new THREE.Vector3();
var keys = [
  [0, [-40, 55, -10]],
  [1, [-40, 55, 100]]
];

$("#throw").click(function() {
  ts = clock.getElapsedTime();
  tsphere.material.visible = true;
	update.release = false;
  frontHitDetect = true;
  backHitDetect = true;
  
  for(var i = 0; i < ballArray.length; i++) 
  	scene.remove(ballArray[i]);
  count = 0;
});

var gcontrols;
var theta1 = 0,
  theta2 = 0,
  theta3 = 0, theta4 = 0;
var tsphere;
var target;

var axes = [];
var joints = [];

init();
animate();

////////////////////////////////////////////////////////
function fk(q, joints) {
  var m = new THREE.Matrix4();

  var localzero = new THREE.Vector3(0, 0, 0);
  m.makeTranslation(0, 0, -15);
  m.multiply(new THREE.Matrix4().makeTranslation(-25, 100, 0));
  localzero.applyMatrix4(m);
  joints[0].copy(localzero);

  m.multiply(new THREE.Matrix4().makeRotationZ(q[0])); // 'ZXY'
  m.multiply(new THREE.Matrix4().makeRotationX(q[1]));
  m.multiply(new THREE.Matrix4().makeRotationY(q[2]));
  m.multiply(new THREE.Matrix4().makeTranslation(0, -40, 0));
  localzero.set(0, 0, 0);
  localzero.applyMatrix4(m);
  joints[1].copy(localzero);

  m.multiply(new THREE.Matrix4().makeRotationX(q[3]));
  m.multiply(new THREE.Matrix4().makeTranslation(0, -40, 0));
  localzero.set(0, 0, 0);
  localzero.applyMatrix4(m);
  joints[2].copy(localzero);
}

/////////////////////////////////////////////////////////////

function setarm() {
  var axis = new CCD_axis(new THREE.Vector3(0, 0, 1), 0);
  axis.limits = new THREE.Vector2(-6, 0);
  axes.push(axis);
  var axis = new CCD_axis(new THREE.Vector3(1, 0, 0), 0);
  axis.limits = new THREE.Vector2(-2.5, 2.5);
  axes.push(axis);
  var axis = new...