Merge pull request #5 from jpez-development/scoring

Scoring

scripts/enemy.js

@@ -1,6 +1,7 @@
 /* enemy spawning logic */
 var aliens = [];
 var bombs = [];
+var score = 0;
 
 /*Spawns Enemies*/
 function spawnEnemy() {
@@ -12,7 +13,7 @@ function spawnEnemy() {
         alien.style.left = Math.floor(Math.random() * document.body.offsetWidth) + "px";
         if (document.elementFromPoint(alien.offsetLeft, alien.offsetTop).classList.contains("alien") == false) {   
             document.body.appendChild(alien);
-            alienLogic = setInterval(spawnBomb, 3000);
+            alienLogic = setInterval(spawnBomb, Math.floor(Math.random() * 3000-1000) + 1000);
             aliens.push([alien, alienLogic]);
             console.log("Alien Spawned")
             break;
@@ -29,6 +30,12 @@ function spawnBomb() {
     bomb.style.top = "70px";
     bomb.style.zIndex = "1";
     bomb.style.display = "absolute";
+    if (Math.floor(Math.random() * 4) < 2) {
+        bomb.style.transform = "rotate(45deg)";
+    }
+    else if (Math.floor(Math.random() * 4) > 2) {
+        bomb.style.transform = "rotate(135deg)";
+    }
     alien[0].appendChild(bomb);
     bombs.push(bomb);
     console.log("Bomb Spawned")
@@ -37,6 +44,14 @@ function spawnBomb() {
 /*Makes a random bomb fall a set amount and explodes if colliding with the floor*/
 function fall() {
     for (let element of bombs) {
+        if (element.style.transform === "rotate(45deg)") {
+            element.style.top = (element.offsetTop + 10) + "px";
+            element.style.left = (element.offsetLeft + 10) + "px";
+        }
+        else if (element.style.transform === "rotate(135deg)") {
+            element.style.top = (element.offsetTop + 10) + "px";
+            element.style.left = (element.offsetLeft - 10) + "px";
+        }     
         element.style.top = (element.offsetTop + 10) + "px";
         var elemRect = element.getBoundingClientRect();
         var bodyRect = document.body.getBoundingClientRect();
@@ -48,6 +63,8 @@ function fall() {
                 setTimeout(() => {element.remove()}, 3000);
                 bombs.splice(bombs.indexOf(element),1);
                 console.log("Bomb Despawned");
+                score += 1;
+
             }
         }
     }
@@ -59,6 +76,7 @@ function checkExplosion() {
         var elemRect = element.getBoundingClientRect();
         var playerRect = document.getElementById("player").getBoundingClientRect();
         if (elemRect.bottom >= playerRect.top && elemRect.right >= playerRect.left && elemRect.left <= playerRect.right && elemRect.top-40 <= playerRect.bottom) {
+            score -= 1;
             if (lives <= 1) {
                 document.getElementById("player").className = "character dead";
                 endGame();

scripts/launch.js

@@ -19,6 +19,9 @@ function load() {
 
 /*Starts game functionality*/
 function startGame() {
+    if (document.body.contains(document.getElementById("scoreBoard"))) {
+        document.getElementById("scoreBoard").remove();
+    }
     document.getElementById("player").className = "character";
     lives = 3;
     showDisplay("block");
@@ -55,6 +58,49 @@ function endGame() {
     showDisplay("none");
     button.style.display = "block";
     text.style.display = "block";
+    setScore();
+    scoreBoard();
+}
+
+function setScore() {
+    let name = prompt("Input your initials (e.g. JFK)", "AAA");
+    localStorage.setItem(name, score);
+}
+
+function getScores() {
+    var values = [];
+    var keys = Object.keys(localStorage);
+
+    for (let i of keys) {
+        values.push([localStorage.getItem(i), i]);
+    }
+    return values;
+}
+
+function scoreBoard() {
+    var board = document.createElement("table");
+    var scores = getScores();
+    scores.sort(twoDimensionalSort);
+    for (let i in scores) {
+        var row = document.createElement("tr");
+        var col1 = document.createElement("td");
+        var col2 = document.createElement("td");
+        col1.innerHTML = scores[i][0];
+        col2.innerHTML = scores[i][1];
+        row.appendChild(col1);
+        row.appendChild(col2);
+        board.appendChild(row);
+    }
+    board.id = "scoreBoard";
+    board.style.marginTop = "250px";
+    board.style.marginLeft = "auto";
+    board.style.marginRight = "auto";
+    board.style.display = "table";
+    document.body.appendChild(board);
+}
+
+function twoDimensionalSort(a, b) {
+    return b[0] - a[0];
 }
 
 document.addEventListener("DOMContentLoaded", load);