From a515117b7fb75d3184236c5a4f2a318568f1e4b1 Mon Sep 17 00:00:00 2001
From: neingeist <neingeist@bl0rg.net>
Date: Tue, 14 Aug 2012 21:31:16 +0200
Subject: [PATCH] shoot

---
 herzle.html | 91 +++++++++++++++++++++++++++++++++++++++--------------
 1 file changed, 67 insertions(+), 24 deletions(-)
diff --git a/herzle.html b/herzle.html
index 243c07e..35fcc0e 100644
--- a/herzle.html
+++ b/herzle.html
@@ -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">&lt;3</span>
   <span id="player">&lt;</span>
-  <span id="pewpew"></span>
+  <div id="pewpew"></div>
 </body>
 
 </html>
