game programming hw3

by YouTingKuo

HTML

<div id="info">hw3
</div>

<audio id="jumpsound" style="display:none">
<source src="https://youtingkuo.github.io/sound/jump.mp3" type='audio/mp3'>
</audio>
<audio id="bornsound" style="display:none">
<source src="https://youtingkuo.github.io/sound/born.mp3" type='audio/mp3'>
</audio>
<audio id="victorysound" style="display:none">
<source src="https://youtingkuo.github.io/sound/victory.mp3" type='audio/mp3'>
</audio>
<audio id="coinsound" style="display:none">
<source src="https://youtingkuo.github.io/sound/coinSound.mp3" type='audio/mp3'>
</audio>
<audio id="soundtrack" autoplay loop style="display:none">
<source src="https://youtingkuo.github.io/sound/rockmanBGM.mp3" type='audio/mp3'>
</audio>

<script src="https://cdnjs.cloudflare.com/ajax/libs/three.js/r70/three.min.js"></script>
<script src="https://jyunming-chen.github.io/tutsplus/js/KeyboardState.js"></script>
<script type="text/javascript">
document.oncontextmenu=function(){return false;}
</script>
<div id="scoreShow"></div>
<div id="victoryShow"></div>
<div id="fScoreShow"></div>
<div id="restartShow"></div>
<div id="pressShow"></div>

CSS

#info {
  position: absolute;
  top: 0px;
  font-size: 30px;
  width: 100%;
  padding: 10px;
  text-align: center;
  color: #ffff00
}

body {
  overflow: hidden;
}

#pressShow {
    position: absolute;
    top: 300px;
    font-size: 60px;
    width: 100%;
    padding:5px;
    text-align: center;
    color: #ffff00;
}

#fScoreShow {
    position: absolute;
	top: 320px;
	font-size: 100px;
	width: 100%;
	padding: 10px;
	text-align: center;
	color: #ffff00
}

#victoryShow {
    position: absolute;
	top: 220px;
	font-size: 100px;
	width: 100%;
	padding: 10px;
	text-align: center;
	color: #ffff00
}

#restartShow {
    position: absolute;
	top: 460px;
	font-size: 40px;
	left: 210px;
	width: 100%;
	padding: 10px;
	text-align: center;
	color: #ffff00
}

#scoreShow {
    position: absolute;
    top: 10px;
    font-size: 40px;
    right: 580px;
    width: 100%;
    padding:5px;
    text-align: center;
    color: #ffff00;
}

JavaScript

var camera, scene, renderer;
var satellite, angle = 0;
//var stats;
var pos, vel, force;
var clock = new THREE.Clock();
var countX = 0;
var scoreShow, pressShow;
var control;
var state = -1; // -1:準備 0:開始 1:其他
var bornPlay = false;
var facingLeftOrRight = true; //true:right  false:left

var jumpSound, bornsound, coinSound, victorySound, restartShow, soundTrack;
var gold = [];
var score = 0;
var gold1, gold2, gold3, gold4, gold5, gold6, gold7, gold8, gold9, gold10;
///////////////////
var rockman;
var stArray = [];
var baseS = 0;
var counter = 0;
///////////////////

var keyboard = new KeyboardState();

init();
animate();

function height (x) {
	if (x < 2)
  	return 0;
  else if(x >= 2 && x < 36)// x > 0
  	return 7;
  else if(x >= 36 && x < 50) return 0;
  else if(x >= 50 && x < 83) return 16;
  else if(x >= 83 && x < 85) return 0;
  else if(x >= 85 && x < 120) return 31;
  else if(x >= 120 && x < 149.5) return 0;
  else if(x >= 149.5 && x < 185) return 7;
  else if(x >= 185 && x < 212.5) return 0;
  else if(x >= 212.5 && x < 247) return 15;
  else return 0;
}

function setUpStArray() {
  for (var i = 0; i < 8; i++) {
    var row = [];
    for (var j = 0; j < 12; j++)
      row.push(new THREE.Vector2(j * 0.094, 1 - 0.124 * i));
    stArray.push(row);
  }
}

function init() {
  renderer = new THREE.WebGLRenderer({
    antialias: true
  });
	
  jumpSound = document.getElementById ('jumpsound');
  bornSound = document.getElementById ('bornsound');
  coinSound = document.getElementById ('coinsound');
  victorySound = document.getElementById ('victorysound');
	soundTrack = document.getElementById ('soundtrack');
  
  pos = new THREE.Vector3(-20, 4.5, 0);
  vel = new THREE.Vector3(0, 0, 0);
  force = new THREE.Vector3(0, -190, 0);

	scoreShow = document.getElementById("scoreShow");
	pressShow = document.getElementById("pressShow");
	victoryShow = document.getElementById("victoryShow");
	fScoreShow = document.getElementById("fScoreShow");
	restartShow =...