commit
1e88921226
|
|
@ -19,7 +19,7 @@
|
|||
</div>
|
||||
|
||||
<div class="start" id="start">
|
||||
Start
|
||||
Click to Play
|
||||
</div>
|
||||
|
||||
<div class="sky">
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
/* logic for enemy movement and firing */
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
/* player movement logic */
|
||||
currentKey = 0;
|
||||
lastKey = 0;
|
||||
var currentKey = 0;
|
||||
var lastKey = 0;
|
||||
var lives = 3;
|
||||
|
||||
function setVars() {
|
||||
let player = document.getElementById("player");
|
||||
|
|
@ -94,6 +95,8 @@ function stop(event) {
|
|||
else if (event.keyCode == lastKey) {
|
||||
lastKey = 0;
|
||||
}
|
||||
|
||||
if (!player.classList.contains("dead")) {
|
||||
switch(event.keyCode) {
|
||||
case 38: /*Up*/
|
||||
case 87: /*W*/
|
||||
|
|
@ -113,4 +116,5 @@ function stop(event) {
|
|||
break;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -30,24 +30,20 @@ function spawnBomb() {
|
|||
bomb.style.zIndex = "1";
|
||||
bomb.style.display = "absolute";
|
||||
alien[0].appendChild(bomb);
|
||||
bombLogic = setInterval(fall, 100);
|
||||
bombs.push([bomb, bombLogic]);
|
||||
bombs.push(bomb);
|
||||
console.log("Bomb Spawned")
|
||||
}
|
||||
|
||||
/*Makes a random bomb fall a set amount and explodes if colliding with the floor*/
|
||||
function fall() {
|
||||
var bomb = bombs[Math.floor(Math.random() * bombs.length)];
|
||||
bomb[0].style.top = (bomb[0].offsetTop + 10) + "px";
|
||||
|
||||
for (let element of bombs) {
|
||||
var closestElement = document.elementFromPoint(element[0].offsetLeft, element[0].offsetTop+10);
|
||||
element.style.top = (element.offsetTop + 10) + "px";
|
||||
var closestElement = document.elementFromPoint(element.offsetLeft, element.offsetTop+10);
|
||||
if (!closestElement.classList.contains("sky") && !closestElement.classList.contains("alien") && !closestElement.classList.contains("bomb") && !closestElement.classList.contains("explosion")) {
|
||||
if(Math.floor(Math.random() * 2) == 1) {
|
||||
clearInterval(element[1]);
|
||||
element[0].className = "explosion";
|
||||
if(Math.floor(Math.random() * 100) < 10 || element.bottom >= document.body.bottom || closestElement.classList.contains("character")) {
|
||||
element.className = "explosion";
|
||||
console.log("Explosion")
|
||||
setTimeout(() => {element[0].remove()}, 3000);
|
||||
setTimeout(() => {element.remove()}, 3000);
|
||||
bombs.splice(bombs.indexOf(element),1);
|
||||
console.log("Bomb Despawned");
|
||||
}
|
||||
|
|
@ -60,8 +56,16 @@ function checkExplosion() {
|
|||
for (let element of document.getElementsByClassName("explosion")) {
|
||||
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 <= playerRect.bottom) {
|
||||
document.getElementById("player").style.display = "none";
|
||||
if (elemRect.bottom >= playerRect.top && elemRect.right >= playerRect.left && elemRect.left <= playerRect.right && elemRect.top-40 <= playerRect.bottom) {
|
||||
if (lives <= 1) {
|
||||
document.getElementById("player").className = "character dead";
|
||||
endGame();
|
||||
}
|
||||
else {
|
||||
element.remove();
|
||||
document.getElementsByTagName("li")[lives-1].style.display = "none";
|
||||
lives -= 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,5 @@
|
|||
/*Add events to webpage*/
|
||||
var intervals = []
|
||||
|
||||
function showDisplay(mode) {
|
||||
for (let element of document.body.getElementsByTagName("*")) {
|
||||
|
|
@ -10,7 +11,6 @@ function showDisplay(mode) {
|
|||
function load() {
|
||||
document.addEventListener("keydown", getKey)
|
||||
document.addEventListener("keyup", stop)
|
||||
setInterval(move, 10);
|
||||
document.getElementById("start").addEventListener("click", startGame)
|
||||
|
||||
showDisplay("none");
|
||||
|
|
@ -19,11 +19,42 @@ function load() {
|
|||
|
||||
/*Starts game functionality*/
|
||||
function startGame() {
|
||||
document.getElementById("player").className = "character";
|
||||
lives = 3;
|
||||
showDisplay("block");
|
||||
document.getElementById("start").style.display = "none";
|
||||
document.getElementsByClassName("weapon")[0].style.display = "none";
|
||||
setInterval(spawnEnemy, 2500);
|
||||
setInterval(checkExplosion, 10);
|
||||
intervals.push(setInterval(move, 10));
|
||||
intervals.push(setInterval(spawnEnemy, 2500));
|
||||
setTimeout(intervals.push(setInterval(fall, 50)), 2500);
|
||||
intervals.push(setInterval(checkExplosion, 1));
|
||||
}
|
||||
|
||||
function endGame() {
|
||||
for (let item of intervals) {
|
||||
clearInterval(item);
|
||||
}
|
||||
|
||||
for (let item of document.getElementsByClassName("bomb")) {
|
||||
item.remove();
|
||||
}
|
||||
|
||||
for (let item of document.getElementsByClassName("explosions")) {
|
||||
item.remove();
|
||||
}
|
||||
|
||||
for (let alien of aliens) {
|
||||
clearInterval(alien[1]);
|
||||
alien[0].remove();
|
||||
}
|
||||
|
||||
var button = document.getElementById("start");
|
||||
var text = document.createElement("p");
|
||||
text.innerHTML = "GAME OVER";
|
||||
button.appendChild(text);
|
||||
showDisplay("none");
|
||||
button.style.display = "block";
|
||||
text.style.display = "block";
|
||||
}
|
||||
|
||||
document.addEventListener("DOMContentLoaded", load);
|
||||
|
|
|
|||
|
|
@ -1 +0,0 @@
|
|||
/*Logic for player lives and firing ability */
|
||||
|
|
@ -1,2 +0,0 @@
|
|||
/* logic for bombs */
|
||||
|
||||
Loading…
Reference in New Issue