|
|
|
|
@ -3,27 +3,8 @@
|
|
|
|
|
<head>
|
|
|
|
|
<script type="text/javascript">
|
|
|
|
|
|
|
|
|
|
cur_step = 10;
|
|
|
|
|
t = -Math.PI/2;
|
|
|
|
|
|
|
|
|
|
function timed() {
|
|
|
|
|
var el = document.getElementById("herzle");
|
|
|
|
|
|
|
|
|
|
el.style.position = "absolute";
|
|
|
|
|
el.style.left = ( Math.cos(t) + 1)/2 * window.innerWidth;
|
|
|
|
|
el.style.top = ((Math.sin(t)*Math.cos(t)) + 1)/2 * window.innerHeight;
|
|
|
|
|
|
|
|
|
|
el.style.fontSize = (1.0 - Math.abs(Math.cos(t))) * 300;
|
|
|
|
|
|
|
|
|
|
t = t + 0.1;
|
|
|
|
|
if (t > 3*Math.PI/2) {
|
|
|
|
|
t = -Math.PI/2;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// setTimeout("timed()", 100);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
player_pos = 0;
|
|
|
|
|
pewpew = 0;
|
|
|
|
|
|
|
|
|
|
document.onkeydown = onKeyDown;
|
|
|
|
|
|
|
|
|
|
@ -41,11 +22,68 @@
|
|
|
|
|
player.style.left = player_pos;
|
|
|
|
|
}
|
|
|
|
|
if (e.keyCode == '32') { // space = fire
|
|
|
|
|
var pewpew = document.getElementById("pewpew");
|
|
|
|
|
pewpew.innerHTML = "pew! pew!";
|
|
|
|
|
shoot(player_pos);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
shoots = [];
|
|
|
|
|
function shoot(player_pos) {
|
|
|
|
|
shoots[shoots.length] = [player_pos, 500];
|
|
|
|
|
pewpew = 5;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function gameLoop() {
|
|
|
|
|
// render shoots
|
|
|
|
|
for(var i = 0; i < shoots.length; i++) {
|
|
|
|
|
if (shoots[i]) {
|
|
|
|
|
var shootdiv = document.getElementById('shoot' + i);
|
|
|
|
|
|
|
|
|
|
if (!shootdiv) {
|
|
|
|
|
shootdiv = document.createElement('div');
|
|
|
|
|
shootdiv.setAttribute('id', 'shoot' + i);
|
|
|
|
|
shootdiv.setAttribute('class', 'shoot');
|
|
|
|
|
shootdiv.innerHTML = '|';
|
|
|
|
|
|
|
|
|
|
var body = document.getElementsByTagName('body')[0];
|
|
|
|
|
body.appendChild(shootdiv);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
shootdiv.style.left = shoots[i][0];
|
|
|
|
|
shootdiv.style.top = shoots[i][1];
|
|
|
|
|
} else {
|
|
|
|
|
if (deldiv = document.getElementById('shoot' + i)) {
|
|
|
|
|
var body = document.getElementsByTagName('body')[0];
|
|
|
|
|
body.removeChild(deldiv);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// render pew pew
|
|
|
|
|
var pewpewdiv = document.getElementById("pewpew");
|
|
|
|
|
if (pewpew > 0) {
|
|
|
|
|
pewpewdiv.innerHTML = "pew! pew!";
|
|
|
|
|
} else {
|
|
|
|
|
pewpewdiv.innerHTML = "";
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// animate shoots
|
|
|
|
|
for(var i = 0; i < shoots.length; i++) {
|
|
|
|
|
if (shoots[i]) {
|
|
|
|
|
shoots[i][1] -= 10;
|
|
|
|
|
if (shoots[i][1] < 0) {
|
|
|
|
|
delete(shoots[i]);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// animate pew pew
|
|
|
|
|
if (pewpew > 0) {
|
|
|
|
|
pewpew -= 1;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
setTimeout("gameLoop()", 100);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
|
|
|
|
|
<style type="text/css">
|
|
|
|
|
@ -57,19 +95,24 @@
|
|
|
|
|
#player {
|
|
|
|
|
position: absolute;
|
|
|
|
|
bottom: 10%;
|
|
|
|
|
-webkit-transform: rotate(90deg);
|
|
|
|
|
-moz-transform: rotate(90deg);
|
|
|
|
|
}
|
|
|
|
|
#pewpew {
|
|
|
|
|
position:absolute;
|
|
|
|
|
top: 10%;
|
|
|
|
|
right: 10%;
|
|
|
|
|
}
|
|
|
|
|
div.shoot {
|
|
|
|
|
position:absolute;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
</head>
|
|
|
|
|
|
|
|
|
|
<body>
|
|
|
|
|
<body onload="gameLoop();">
|
|
|
|
|
<span id="herzle"><3</span>
|
|
|
|
|
<span id="player"><</span>
|
|
|
|
|
<span id="pewpew"></span>
|
|
|
|
|
<div id="pewpew"></div>
|
|
|
|
|
</body>
|
|
|
|
|
|
|
|
|
|
</html>
|
|
|
|
|
|
