Question

如果游戏没有结束，飞船也没有坠落，我们就允许用户操作飞船的运动。我们需要每隔 30 毫秒就检测一下用户是否还按着按键，因为飞船只能在按键持续按下的情况下移动。注意这与我们之前在步骤 1 中看到的 keyup、keydown 事件有何不同，前者是消极被动，后者是积极主动。JavaScript 并没有解决这种问题的机制，不过我的 gameQuery 却提供了！为了激活这个功能，我们需要在指定 playground 节点的时候就设置参数 keyTracker: true。

$("#playground").playground({height: PLAYGROUND_HEIGHT, width: PLAYGROUND_WIDTH, keyTracker: true});

一旦按键记录器激活了，你就可以把你想关注的按键代码作为索引值来读取 jQuery.gameQuery.keyTracker 数组，这样就能了解指定按键情况。如果得到的值时 true，那么指定按键当前正被按下。这能方便你用简单的回调函数管理玩家控制（player controls）。为了控制精灵移动，我们使用同样的技术手段。

这个时候这些代码对你来说应该很眼熟了吧：），唯一的陷阱就是别忘记飞船不能跑出屏幕。当玩家飞船爆炸，它应该能往下坠落。当飞船坠出屏幕之外并且还有剩余的生命的时候，飞重新生成船；否则游戏结束。为了能重新生成飞船，我们需要移除包含爆炸动画的精灵，重新显示隐藏起来的飞船精灵。这个简单的调用 jQuery 的 show 函数即可。不要忘了把飞船摆到正确的位置，重设游戏为正常模式。

//..
} else {
  var posy = parseInt($("#player").css("top"))+5;
  var posx = parseInt($("#player").css("left"))-5;
  if(posy > PLAYGROUND_HEIGHT){
  //Does the player did get out of the screen?
  if($("#player")[0].player.respawn()){
  gameOver = true;
  $("#playground").append('<div style="position: absolute; ... >');
  $("#restartbutton").click(restartgame);
  $("#actors,#playerMissileLayer,#enemiesMissileLayer").fadeTo(1000,0);
  $("#background").fadeTo(5000,0);
  } else {
  $("#explosion").remove();
  $("#player").children().show();
  $("#player").css("top", PLAYGROUND_HEIGHT / 2);
  $("#player").css("left", PLAYGROUND_WIDTH / 2);
  playerHit = false;
  }
  } else {
  $("#player").css("top", ""+ posy +"px");
  $("#player").css("left", ""+ posx +"px");
  }
}
  }
}, REFRESH_RATE);

那么游戏结束的时候我们也该做些什么呢？我们可以显示一条友好的提示，并且慢慢的隐藏游戏内容。为了实现这个我们可以简单的增加 hml 节点到 playground，然后显示我们想显示的。jQuery 的 append() 函数很适合处理这个，它把字符串参数添加到选择元素的末尾。这里我们在 playground 节点上调用此方法来添包含以下 html 代码的 div 层。

<div style="position: absolute; top: 50px; width: 700px; color: white; font-family: verdana, sans-serif;">
<center>
<h1>Game Over</h1>
<br>
<a style="cursor: pointer;" id="restartbutton">Click here to restart the game!</a>
</center>
</div>

提供给玩家重启游戏的功能，看起来会更友好。这是个很意义的功能，不过 gameQuery 并没有提供简单的方法来重设游戏状态。对于我的上个游戏以及这个游戏来说，我用了个小技巧：window.location。这个 JavaScript 对象可以操纵浏览器的 URL，重新载入页面当然不在话下。这对我们就足够了。

但 restart 按钮节点被添加，我们需要为其注册页面重载事件。就像我们之前用 keydown、keyup 那样。这里用到的 jQuery 函数是 click，使用一个函数作为参数，当事件触发的时候就执行这个函数。

厄，这就完了！祝贺你，如果你一直跟着进度看到这里！最后一部分是一系列为了使游戏更完善的小东西。