neingeist
/
30shooter
Archived
1
0
Fork 0
Code Releases Activity

collision!

Browse Source
master
neingeist 12 years ago
parent a515117b7f
commit 59513aa5a8
1 changed files with 49 additions and 6 deletions
Show Stats Download Patch File Download Diff File

55
herzle.html
Unescape Escape View File

@ -29,10 +29,40 @@
shoots = []; shoots = [];
function shoot(player_pos) { function shoot(player_pos) {
shoots[shoots.length] = [player_pos, 500]; shoots[shoots.length] = [player_pos, 500];
pewpew = 5; // pewpew = 5;
} }
function isCollided(a, b) {
var a_left = parseInt(a.style.left);
var a_right = a_left + a.offsetWidth;
var a_top = parseInt(a.style.top);
var a_bottom = a_top + a.offsetHeight;
var b_left = parseInt(b.style.left);
var b_right = b_left + b.offsetWidth;
var b_top = parseInt(b.style.top);
var b_bottom = b_top + b.offsetHeight;
return !(
(a_left > b_right) ||
(a_right < b_left) ||
(a_top > b_bottom) ||
(a_bottom < b_top)
);
}
function gameLoop() { function gameLoop() {
// detect collision
var enemydiv = document.getElementById("enemy");
for(var i = 0; i < shoots.length; i++) {
if (shoots[i]) {
var shootdiv = document.getElementById('shoot' + i);
if (shootdiv && isCollided(shootdiv, enemydiv)) {
pewpew = 10;
}
}
}
// render shoots // render shoots
for(var i = 0; i < shoots.length; i++) { for(var i = 0; i < shoots.length; i++) {
if (shoots[i]) { if (shoots[i]) {
@ -66,6 +96,11 @@ function gameLoop() {
pewpewdiv.innerHTML = ""; pewpewdiv.innerHTML = "";
} }
// render enemy
var enemydiv = document.getElementById("enemy");
enemydiv.style.left = 300;
enemydiv.style.top = 10;
// animate shoots // animate shoots
for(var i = 0; i < shoots.length; i++) { for(var i = 0; i < shoots.length; i++) {
if (shoots[i]) { if (shoots[i]) {
@ -88,15 +123,22 @@ function gameLoop() {
<style type="text/css"> <style type="text/css">
* { * {
font-size: 20pt; font-size: 2em;
color: #ff00ff; color: #ff00ff;
font-family: helvetica, arial; font-family: helvetica, arial;
} }
#player { #player {
position: absolute; position: absolute;
bottom: 10%; bottom: 10%;
-webkit-transform: rotate(90deg); /* -webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg); -moz-transform: rotate(90deg); */
}
#enemy {
position: absolute;
top: 10%;
/* -webkit-transform: rotate(90deg);
-moz-transform: rotate(90deg); */
border-style: solid; border-width: 1px;
} }
#pewpew { #pewpew {
position:absolute; position:absolute;
@ -105,13 +147,14 @@ function gameLoop() {
} }
div.shoot { div.shoot {
position:absolute; position:absolute;
border-style: solid; border-width: 1px;
} }
</style> </style>
</head> </head>
<body onload="gameLoop();"> <body onload="gameLoop();">
<span id="herzle">&lt;3</span> <div id="enemy">3</div>
<span id="player">&lt;</span> <div id="player">&lt;</div>
<div id="pewpew"></div> <div id="pewpew"></div>
</body> </body>