JavaScriptで衝突判定を作成し、簡単なシューティングゲームを作成した事

#はじめに
JavaScriptで簡単なシューティングゲームを自作しました。
これを応用したら、リズムゲームなども作れるのではないかと思います。
コードは下記のリンクから飛んで頂ければ読めますが、わかりにくいかもしれません。
リンクはこちら

#苦労した点
以前作成したタイミングゲームで、要素を動かすやり方は理解していたので、問題は衝突判定でした。
ボタンを３つ設置したのですが、それぞれ適切なタイミングでdisabledを切り替える事も、ちょっと苦労しました。

#衝突判定について
衝突判定のやり方はかなりシンプルで、要素X1（x1,y1)と要素X2(x2,y2)を用意して、x1,y1,x2,y2からある一定の距離で要素同士が近づいたらアクションを起こすように書きました。下記のコードでご説明すると、要素X1のy1座標が250の時で、要素X2のx2座標が 230<x2<380 という座標領域に入った場合にif文でアクションを起こすようにしました。

if((arrowToTopOfPositionY === 250)&&(arrowToLeftOfPositionX > 230)&&(arrowToLeftOfPositionX < 380)){
    oneStepMovingOfArrowToLeft = 0;
    oneStepMovingOfArrowToTop = 0;
    document.getElementById("gameStatus").innerHTML = "SAVE!!!";
    document.getElementById("humanImage").style.backgroundColor = "yellow";
    document.getElementById("saveTargetButton").disabled = "";
  }else{
    //何もしない
  }

#ボタンのdisabledの切り替えに手こずった点について
冒頭でご説明した通り、３つのボタン（startButton,saveTargetButton,resetButton）を設置したのですが、不適切なタイミングで押せる事はバグであるので、適切にdisabledを管理しなければいけませんでした。
そのタイミングを見定めるのが、少し厄介でした。

#今後改良するとしたら
今後改良するとしたら、矢を乱数を用いて自由に動かし、速度も可変にしてよりゲーム性をあげたいな、と思います。