Mini Mario

by SparkHero77

71 lines1.2 KB

<!DOCTYPE html>
<html>
<head>
  <title>Mini Mario</title>
  <style>
    body {
      margin: 0;
      overflow: hidden;
      background: skyblue;
    }
    canvas {
      display: block;
      margin: auto;
      background: #5c94fc;
    }
  </style>
</head>
<body>

<canvas id="game" width="800" height="400"></canvas>

<script>
const canvas = document.getElementById("game");
const ctx = canvas.getContext("2d");

let player = {
  x: 50,
  y: 300,
  w: 40,
  h: 40,
  dx: 0,
  dy: 0,
  speed: 4,
  jump: -12,
  grounded: false
};

let gravity = 0.5;

let keys = {};

let platforms = [
  {x:0,y:350,w:800,h:50},
  {x:300,y:280,w:120,h:20},
  {x:500,y:220,w:120,h:20}
];

document.addEventListener("keydown", e => keys[e.key] = true);
document.addEventListener("keyup", e => keys[e.key] = false);

function update() {

  if(keys["ArrowRight"]) player.dx = player.speed;
  else if(keys["ArrowLeft"]) player.dx = -player.speed;
  else player.dx = 0;

  if(keys[" "] && player.grounded){
    player.dy = player.jump;
    player.grounded = false;
  }

  player.dy += gravity;

  player.x += player.dx;
  player.y += player.dy;

  player.grounded = false;

  for(let p of platforms){

    if(player.x < p.x + p

Game Source: Mini Mario

Creator: SparkHero77

Libraries: none

Complexity: moderate (71 lines, 1.2 KB)

The full source code is displayed above on this page.

Remix Instructions

To remix this game, copy the source code above and modify it. Add a ARCADELAB header at the top with "remix_of: mini-mario-sparkhero77" to link back to the original. Then publish at arcadelab.ai/publish.