diff --git a/team/oppgave1/uke4/script.js b/team/oppgave1/uke4/script.js index 4ce7934..9e260ad 100644 --- a/team/oppgave1/uke4/script.js +++ b/team/oppgave1/uke4/script.js @@ -6,22 +6,25 @@ let petElement = document.getElementById('petId'); let frogImage = document.getElementById('tamaFrog').src = "img/default.jpg"; -setInterval(foodFunction, 1000); -setInterval(petFunction, 1000); +let foodCounter = setInterval(foodFunction, 1000); +let petCounter = setInterval(petFunction, 1000); // View -// function reset() { -// if (foodTime < 0){ -// foodTime += 50; -// petTime += 10; -// defaultImg(); -// } -// } +function reset() { + if (foodTime < 0){ + defaultImg(); + foodTime = 50; + setInterval(foodFunction, 1000); + petTime = 10; + setInterval(petFunction, 1000); + } +} function foodFunction() { if (foodTime < 0) { //game over??? document.getElementById('tamaFrog').src = "img/dead.jpg"; - // setTimeout(afterLife, 1000); + clearInterval(foodCounter); + setTimeout(afterLife, 5000); } else { foodElement.innerHTML = foodTime + " seconds remaining" foodTime-- @@ -34,6 +37,7 @@ function foodFunction() { function feed() { if (foodTime > 0 && petTime > 5) { foodTime += 10; + petElement.innerHTML = petTime + " seconds remaining." + " Pet the frog"; document.getElementById('tamaFrog').src = "img/eating.jpg"; setTimeout(defaultImg, 500) } @@ -45,15 +49,21 @@ function defaultImg() { } function petFunction() { - if (petTime < 5) { +if (petTime < 0) { + clearInterval(petCounter); +} else if (petTime < 5) { document.getElementById('tamaFrog').src = "img/angry.jpg"; + petElement.innerHTML = petTime + " seconds remaining" + petTime--; } else { petElement.innerHTML = petTime + " seconds remaining" - petTime-- - + petTime-- } } + + + function pet() { if (foodTime > 0) { petTime += 10; diff --git a/team/oppgave1/uke4/style.css b/team/oppgave1/uke4/style.css index df9746e..5d497ff 100644 --- a/team/oppgave1/uke4/style.css +++ b/team/oppgave1/uke4/style.css @@ -1,14 +1,17 @@ .FrogFace { - user-select: none; + user-select: none; padding: 2px; - border: solid, 5px rgb(19, 204, 19); + border: solid, 15px rgb(19, 204, 19); max-width: 650px; + } -img{ +.img{ max-width: 100%; max-height: 100%; + + } .square { height: 75px;