console
with(Math) {
c = document.getElementById("c"), c.width = 320, c.height = 240, h = c.getContext("2d"), x = 4, y = 4, a = 0, H = 100, am = 25, rc = 0, fl = 0, t = 0, SEED = random() * 100, f = (i, j) => (abs(i - 4) < 4 && abs(j - 4) < 4) ? 0 : ((i + 1e3) % 7 == 3 || (j + 1e3) % 7 == 3) ? 0 : (n = cos(i * 12.9898 + j * 78.233 + SEED) * 43758.5453, n -= n | 0, n < .05 ? 1 : 0), e = [{
x: 5,
y: 4,
h: 100
}, {
x: 4,
y: 5,
h: 100
}], k = {};
onkeydown = e => k[e.key] = 1, onkeyup = e => k[e.key] = 0, ontouchstart = e => {
e.preventDefault(), t = 1, k[e.touches[0].clientX < innerWidth / 2 ? "ArrowLeft" : "ArrowRight"] = 1, k.ArrowUp = 1
}, ontouchend = e => {
t = 0, k.ArrowLeft = k.ArrowRight = k.ArrowUp = 0
}, onclick = _ => {
if (am) {
am--, fl = 2, rc = .2, e.forEach(o => {
let d = hypot(o.x - x, o.y - y),
r = atan2(o.y - y, o.x - x) - a;
d < 5 && abs(r) < .3 && (o.h -= 50, h.fillStyle = "#fff", h.fillRect(160 + r * 160 - 2, 120 - 2, 4, 4))
})
}
};
R = _ => {
rc = rc > .02 ? rc - .02 : 0, fl && fl--, e = e.filter(o => o.h > 0), h.fillStyle = "#000", h.fillRect(0, 0, 320, 240), k.ArrowLeft && (a -= .1), k.ArrowRight && (a += .1), m = .1, (k.ArrowUp || k.w) && (nx = x + cos(a) * m, ny = y + sin(a) * m, f(floor(nx), floor(ny)) != 1 && (x = nx, y = ny)), (k.ArrowDown || k.s) && (nx = x - cos(a) * m, ny = y - sin(a) * m, f(floor(nx), floor(ny)) != 1 && (x = nx, y = ny)), (k.ArrowUp || k.w || k.ArrowDown || k.s || k.ArrowLeft || k.ArrowRight) && e.length < 10 && random() < .02 && (t = random() * 6.283, d = 1 + random() * 2, X = x + cos(t) * d, Y = y + sin(t) * d, f(floor(X), floor(Y)) == 0 && e.push({
x: X,
y: Y,
h: 100
})), random() < .005 && am < 25 && am++, e.forEach(o => {
let d = hypot(dx = x - o.x, dy = y - o.y);
d > .2 && (o.x += dx / d * (.0015 + .003 / d), o.y += dy / d * (.0015 + .003 / d), f(floor(o.x), floor(o.y)) != 1 || 0), d < .5 && (H--, fl = 2, h.fillStyle = "#800", h.fillRect(0, 0, 320, 240))
});
let w = [];
for (i = 0; i < 320; i++) {
r = a + atan((i - 160) / 160), dx = cos(r), dy = sin(r), ix = floor(x), iy = floor(y), ddx = dx ? abs(1 / dx) : 1e30, ddy = dy ? abs(1 / dy) : 1e30, sx = dx < 0 ? -1 : 1, sy = dy < 0 ? -1 : 1, tmx = dx < 0 ? (x - ix) * ddx : (ix + 1 - x) * ddx, tmy = dy < 0 ? (y - iy) * ddy : (iy + 1 - y) * ddy, d = 0;
for (;;) {
if (tmx < tmy) ix += sx, d = tmx, tmx += ddx;
else iy += sy, d = tmy, tmy += ddy;
if (d > 20 || f(ix, iy) == 1) break
}
d *= cos(r - a), w[i] = d, h2 = min(240, 240 / d), g = min(255, 200 / d) | 0, h.fillStyle = `rgb(${g},${g},${g})`, h.fillRect(i, 120 - h2 / 2 + rc * 20, 1, h2)
}
e.forEach(o => {
d = hypot(o.x - x, o.y - y), r = atan2(o.y - y, o.x - x) - a;
if (abs(r) < 1.2) {
sz = 80 / d, px = 160 + r * 160;
px >= 0 && px < 320 && d < w[px | 0] * 1.1 && (h.fillStyle = o.h > 50 ? "#400" : "#800", h.fillRect(px - sz / 2, 120 - sz / 2 + rc * 20, sz, sz * 1.5), h.fillStyle = "#f00", h.fillRect(px - sz / 4, 120 - sz / 2 + rc * 20, sz / 8, sz / 4), h.fillRect(px + sz / 4, 120 - sz / 2 + rc * 20, sz / 8, sz / 4))
}
}), fl && (h.fillStyle = "#FFA500", h.fillRect(140, 160 + rc * 20, 40, 20)), h.fillStyle = "#f00", h.fillRect(10, 10, H, 10), h.fillStyle = "#ff0", h.fillRect(10, 25, am * 4, 5), h.fillStyle = "#fff", h.font = "7px Arial", h.fillText("HP", 10, 7), h.fillText("AMMO:" + am, 10, 28), h.textAlign = "right", h.fillText("<3 KWT", 315, 235), h.textAlign = "left", H > 0 ? requestAnimationFrame(R) : (h.fillStyle = "#f00", h.font = "20px Arial", h.textAlign = "center", h.fillText("GAME OVER", 160, 120))
};
R()
}
<canvas id="c" width="320" height="240"></canvas>