Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
Showing
25 changed files
with
427 additions
and
6 deletions.
There are no files selected for viewing
File renamed without changes.
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes.
File renamed without changes.
File renamed without changes.
File renamed without changes
File renamed without changes.
File renamed without changes.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
010 Intro to Animation Balloon Game - HTML Course @ CoderDojo DCU | ||
=================================== |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,212 @@ | ||
//get the random number where the balloon will below | ||
var maxBlows=0; | ||
|
||
//the score value | ||
var score; | ||
|
||
//blown up attempts | ||
var blownUpAttempts; | ||
|
||
//increase the size | ||
var increaseSizeBy = 50; | ||
|
||
//this will be our image | ||
var logo; | ||
|
||
//boom div | ||
var boom; | ||
|
||
//game over div | ||
var gameOver; | ||
|
||
//score div | ||
var scoreDiv; | ||
|
||
//increase the score by | ||
var increaseScoreBy; | ||
|
||
//current life | ||
var livesRemaining; | ||
|
||
//lives left div | ||
var livesLeft; | ||
|
||
// High score div | ||
var highScore; | ||
|
||
//reset the game | ||
function resetGame(increaseBy) { | ||
|
||
//get random number between 0-10 | ||
maxBlows = Math.floor(Math.random()*11); | ||
|
||
//you starting a new balloon here | ||
blownUpAttempts = 0; | ||
|
||
//hide the boom | ||
boom.style.display="none"; | ||
|
||
//display the image | ||
logo.style.display="block"; | ||
|
||
//set the lives left | ||
livesLeft.innerHTML = livesRemaining; | ||
|
||
//score div | ||
scoreDiv = document.getElementById("score"); | ||
|
||
//reset the size | ||
logo.style.width="150px"; | ||
|
||
//increase the score, this will increase by level | ||
increaseScoreBy += increaseBy; | ||
} | ||
|
||
//resets the values | ||
function resetGameValues() { | ||
score = 0; | ||
livesRemaining = 3; | ||
increaseScoreBy=0; | ||
} | ||
|
||
//starts the game | ||
function startGame() { | ||
|
||
//reset the game values | ||
resetGameValues(); | ||
|
||
//get the image | ||
logo = document.getElementById("logoDiv"); | ||
|
||
//get the lives left div | ||
livesLeft = document.getElementById("livesLeft"); | ||
|
||
// boom div | ||
boom = document.getElementById("boom"); | ||
|
||
//high score | ||
highScore = document.getElementById("highScore"); | ||
highScore.style.display="none"; | ||
|
||
//resets the max baloon size | ||
resetGame(10); | ||
|
||
//hide the game over div | ||
gameOver = document.getElementById("gameOver"); | ||
gameOver.style.display="none"; | ||
|
||
//reset score to zero | ||
scoreDiv.innerHTML = score; | ||
} | ||
|
||
//resizes the image | ||
function blow() { | ||
|
||
//its another blow | ||
blownUpAttempts++; | ||
|
||
//you loose you have exceed the blows | ||
if(blownUpAttempts > maxBlows) { | ||
boomBallon(); | ||
} else { //successful blow | ||
successfulBlow(); | ||
} | ||
} | ||
|
||
function happyWithScore() { | ||
//display the score | ||
var result = document.getElementById("result"); | ||
result.innerHTML="Well done, high score is: " + score; | ||
|
||
//show the widgets | ||
highScore.style.display = "block"; | ||
logo.style.display = "none"; | ||
} | ||
|
||
//boom you lost | ||
function boomBallon() { | ||
|
||
//show the boom | ||
boom.style.display="block"; | ||
|
||
//hide the logo | ||
logo.style.display="none"; | ||
} | ||
|
||
//good blow | ||
function successfulBlow() { | ||
|
||
//get the current width | ||
var width = parseInt(logo.offsetWidth); | ||
|
||
//Set the width value + new size; | ||
width = width + increaseSizeBy; | ||
|
||
//increase the image size | ||
logo.style.width = width+"px"; | ||
|
||
//increase the score | ||
score += increaseScoreBy; | ||
|
||
//display the score | ||
scoreDiv.innerHTML = score; | ||
} | ||
|
||
//stop blowing the baloon | ||
function tieTheBalloon() { | ||
|
||
if(livesRemaining > 0) { | ||
//if you have hit the jackpot | ||
if(blownUpAttempts == maxBlows) { | ||
moveToNextLevel(); | ||
} else { | ||
lostLife(); | ||
} | ||
} else { | ||
startGame(); | ||
} | ||
} | ||
|
||
|
||
//You passed this level | ||
function moveToNextLevel() { | ||
|
||
//increase the score by 100 | ||
score += 100; | ||
scoreDiv.innerHTML = score; | ||
|
||
//reset game and increase the scoring | ||
resetGame(10); | ||
} | ||
|
||
//lost a life | ||
function lostLife() { | ||
//lost life | ||
livesRemaining--; | ||
|
||
//set the score to zero | ||
score = 0; | ||
scoreDiv.innerHTML = score; | ||
|
||
//game over you lose | ||
if(livesRemaining == 0) { | ||
|
||
//end of life | ||
logo.style.display="none"; | ||
boom.style.display="none"; | ||
gameOver.style.display="block"; | ||
|
||
//set the lives left | ||
livesLeft.innerHTML = livesRemaining; | ||
} else { //lives remaining | ||
|
||
//end of life | ||
logo.style.display="none"; | ||
boom.style.display="block"; | ||
|
||
//reset the game | ||
resetGame(0); | ||
} | ||
|
||
} | ||
|
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,76 @@ | ||
<!DOCTYPE html> | ||
<html> | ||
|
||
<head> | ||
<title>Blow it up - Can you beat the Game?</title> | ||
<link rel="stylesheet" type="text/css" href="style.css" /> | ||
<script type="text/javascript" src="animation.js"></script> | ||
</head> | ||
|
||
<body onload="startGame()"> | ||
<div id="header"> | ||
|
||
<div id="titleDiv"> | ||
<div id="titleInner"> | ||
<h1>CoderDojo Balloon Game </h1> | ||
</div> | ||
<h1 id="canYou">Can you beat the Balloon?</h1> | ||
</div> | ||
<div id="stopButton"> | ||
<button id="stop" onclick="tieTheBalloon()">Tie It</button> | ||
</div> | ||
|
||
<div id="scoreDiv"> | ||
<div id="scoreTitle" class="resultHeader">SCORE</div> | ||
<div id="score" class="resultAmount">0</div> | ||
<div id="livesLeftTitle" class="resultHeader">LIVES LEFT</div> | ||
<div id="livesLeft" class="resultAmount">3</div> | ||
|
||
<button id="happy" class="nextButton" onclick="happyWithScore()">Happy</button> | ||
</div> | ||
|
||
</div> | ||
|
||
<div id="logoDiv"> | ||
<img src="coder.png" onclick="blow()" id ="image"/> | ||
</div> | ||
|
||
<div id="boom"> | ||
BooooooooM!! | ||
<br/> | ||
<button id="nextLife" class="nextButton" onclick="lostLife()">Next Life</button> | ||
</div> | ||
|
||
<div id="highScore"> | ||
<div id="result"> | ||
|
||
</div> | ||
<button class="nextButton" onclick="startGame()">New Game</button> | ||
</div> | ||
|
||
<div id="gameOver"> | ||
<blink>Game Over!!</blink> | ||
<br/> | ||
<button id="newGame" class="nextButton" onclick="startGame()">New Game</button> | ||
</div> | ||
|
||
<blink> | ||
<h2>Blow It, Blow It, Hurry Up</h2> | ||
</blink> | ||
<h3>Rules</h3> | ||
<ul> | ||
<li>Blow up the balloon by clicking on the logo</li> | ||
<li>You never know when its going to blow</li> | ||
<li>The balloon has a max blows of 11</li> | ||
<li>You get 10 points for every successful blow</li> | ||
<li>If you think the balloon is at its max, hit the tie button </li> | ||
<li>If you quit too early you loose a life</li> | ||
<li>If you blow too many times you loose a life</li> | ||
<li>If you guess right you get extra 100 points</li> | ||
<li>If you guess right your next round blows increase by 10 points</li> | ||
<li>Challenge yourself and see what your highest score is</li> | ||
<li>If you are happy with your highest score hit "Happy" to end the game</li> | ||
</ul> | ||
<h3>Are you the coderdojo balloon champion?</h3> | ||
</body> | ||
</html> |
Oops, something went wrong.