Mutant Frog Adventure
About this app
A platformer game set in Communist-era Belgrade with a mutant frog protagonist.
Mutant Frog Adventure
Related apps
Put this on your site
Source
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Mutant Frog Adventure</title>
<meta name="description" content="A platformer game set in Communist-era Belgrade with a mutant frog protagonist.">
<meta name="keywords" content="platformer, game, mutant frog, adventure, Belgrade, Communist">
<style>
body, html {
margin: 0;
padding: 0;
overflow: hidden;
font-family: 'Press Start 2P', cursive;
}
canvas {
background: linear-gradient(#5c94fc, #5a6872);
display: block;
}
</style>
<link href="https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap" rel="stylesheet">
</head>
<body>
<canvas id="gameCanvas"></canvas>
<script>
const canvas = document.getElementById('gameCanvas');
const ctx = canvas.getContext('2d');
canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
class Player {
constructor() {
this.x = 100;
this.y = canvas.height - 150;
this.width = 50;
this.height = 50;
this.speed = 5;
this.dy = 0;
this.gravity = 0.5;
this.jumpStrength = 10;
this.grounded = false;
this.color = '#228B22';
}
draw() {
ctx.fillStyle = this.color;
ctx.fillRect(this.x, this.y, this.width, this.height);
}
update() {
if (this.grounded) {
this.dy = 0;
} else {
this.dy += this.gravity;
}
this.y += this.dy;
if (this.y + this.height > canvas.height) {
this.y = canvas.height - this.height;
this.grounded = true;
}
this.draw();
}
jump() {
if (this.grounded) {
this.dy = -this.jumpStrength;
this.grounded = false;
}
}
moveLeft() {
this.x -= this.speed;
}
moveRight() {
this.x += this.speed;
}
}
const player = new Player();
function gameLoop() {
ctx.clearRect(0, 0, canvas.width, canvas.height);
player.update();
requestAnimationFrame(gameLoop);
}
gameLoop();
window.addEventListener('keydown', function(e) {
if (e.code === 'ArrowLeft') player.moveLeft();
if (e.code === 'ArrowRight') player.moveRight();
if (e.code === 'Space') player.jump();
// Implement shooting and bomb dropping
});
window.addEventListener('keyup', function(e) {
// Implement shooting and bomb dropping
});
</script>
</body>
</html>
NEW APPS
These are apps made by the community!