diff --git a/index.css b/index.css index ac68193..622eaa5 100644 --- a/index.css +++ b/index.css @@ -34,10 +34,8 @@ p { .message { position: relative; - margin-bottom: -1024px; - bottom: 1024px; - width: 1024px; - height: 1024px; + margin-bottom: -768px; + bottom: 768px; display: flex; flex-direction: column; @@ -61,7 +59,7 @@ p { padding: 10px; } -#canvas { +#canvas, .message { width: 768px; height: 768px; /*image-rendering: pixelated;*/ @@ -73,8 +71,13 @@ section#main { } @media (max-width: 1920px) { - #canvas { + #canvas, .message { width: min(512px, 90vw); height: min(512px, 90vw); } + + .message { + margin-bottom: min(512px, 90vw); + bottom: min(512px, 90vw); + } } \ No newline at end of file diff --git a/index.html b/index.html index f9a1e67..ec2a8e3 100644 --- a/index.html +++ b/index.html @@ -9,9 +9,12 @@

UniButton

+

The left mouse is the only button. Click to launch... figure out the rest of the combos yourself.

+

By Onez, more games at Discord

- +
placeholder diff --git a/js/index.js b/js/index.js index f355f69..796266a 100644 --- a/js/index.js +++ b/js/index.js @@ -30,14 +30,21 @@ function Game() { } Game.prototype.main = function () { + let { entities, player } = this; + if (player.health <= 0) { + document.querySelector('.message').style.display = 'flex'; + return; + } else { + } + for (let ent of entities) { ent.pos.x += ent.vel.x; ent.pos.y += ent.vel.y; - ent.vel.x *= 0.8; - ent.vel.y *= 0.8; + ent.vel.x *= 0.9; + ent.vel.y *= 0.9; ent.rot += 0.03 * ent.dir; ent.rot = ent.rot % (Math.PI * 10); @@ -47,16 +54,24 @@ Game.prototype.main = function () { ent.ticks++; + let dist = ((ent.pos.x - player.pos.x) ** 2) + ((ent.pos.y - player.pos.y) ** 2); + let dp = (Math.sin(ent.rot) * (ent.pos.x - player.pos.x)) - (Math.cos(ent.rot) * (ent.pos.y - player.pos.y)); - dp /= ((ent.pos.x - player.pos.x) ** 2) + ((ent.pos.y - player.pos.y) ** 2); + dp /= dist; - dp *= 30; + dp *= 10; - if (Math.random() < -dp && Math.random() > 5 / (ent.ticks+2)) { + if (ent == player) continue; + + if (Math.random() < -dp && Math.random() > 3 / (ent.ticks+2)) { ent.bump(); } + + if (Math.sqrt(dist) < 96 / 2) { + player.health --; + } } } @@ -85,6 +100,10 @@ Game.prototype.render = function () { ctx.restore(); } +Game.prototype.ui = function() { + document.querySelector('.ui-text').textContent = `HP: ${this.player.health}` +} + Game.prototype.click = function () { let { player } = this; @@ -95,5 +114,6 @@ var game = new Game(); setInterval(function () { game.main() }, 1000 / 60); setInterval(function () { game.render() }, 1000 / 60); +setInterval(function () { game.ui() }, 1000 / 10); game.canvas.onclick = () => game.click(); \ No newline at end of file diff --git a/js/player.js b/js/player.js index fc574b6..b011343 100644 --- a/js/player.js +++ b/js/player.js @@ -9,6 +9,8 @@ function Player() { this.rot = 0; this.dir = 1; this.ticks = 0; + + this.health = 100; } Player.prototype.bump = function () { @@ -18,11 +20,11 @@ Player.prototype.bump = function () { player.dir *= -1; } - player.vel.x *= 0.6; - player.vel.y *= 0.6; + player.vel.x *= 0.9; + player.vel.y *= 0.9; - player.vel.x += Math.sin(player.rot) * 25; - player.vel.y -= Math.cos(player.rot) * 25; + player.vel.x += Math.sin(player.rot) * 8; + player.vel.y -= Math.cos(player.rot) * 8; player.ticks = 0; } \ No newline at end of file