AI game creator

Click here for free DL of the app version that can save data.

No:20242

←

Prev Next

→

Basic platformer
Developer User7287｜Date and time 23/10/9 1:04:24
Build time 22.819 sec｜Game capacity 3.734KB｜

Script

←

Prev　Next

→ 　

Back　

[PR]現在の欲しいゲームランキング

Click here for free DL of the app version that can save data.

<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Juego de Plataformas</title>
  <style>
    body {
      margin: 0;
      padding: 0;
    }

canvas {
      display: block;
    }
  </style>
</head>
<body>
  <canvas id="gameCanvas"></canvas>

// Configuración del tamaño del lienzo
    const canvasWidth = 480;
    const canvasHeight = 320;
    canvas.width = canvasWidth;
    canvas.height = canvasHeight;

// Jugador
    const player = {
      x: 50,
      y: canvasHeight - 100,
      width: 50,
      height: 50,
      speed: 5,
      isJumping: false,
      jumpHeight: 150,
      isFalling: false,
      fallSpeed: 0,
    };

// Plataforma
    const platform = {
      x: 0,
      y: canvasHeight - 50,
      width: canvasWidth,
      height: 50,
    };

// Teclas
    const keys = {
      ArrowUp: false,
      ArrowRight: false,
      ArrowLeft: false,
    };

// Eventos de teclado
    window.addEventListener("keydown", handleKeyDown);
    window.addEventListener("keyup", handleKeyUp);

// Maneja el evento de presionar tecla
    function handleKeyDown(event) {
      event.preventDefault();
      keys[event.key] = true;
    }

// Maneja el evento de soltar tecla
    function handleKeyUp(event) {
      event.preventDefault();
      keys[event.key] = false;
    }

// Actualiza la posición del jugador en cada fotograma
    function updatePlayerPosition() {
      if (keys.ArrowRight && player.x < canvasWidth - player.width) player.x += player.speed;
      if (keys.ArrowLeft && player.x > 0) player.x -= player.speed;

if (keys.ArrowUp) {
        if (!player.isJumping && !player.isFalling) {
          player.isJumping = true;
          player.fallSpeed = -player.jumpHeight / 10;
        }
      }

if (player.isJumping) {
        player.y += player.fallSpeed;
        player.fallSpeed += 1;

if (player.y > canvasHeight - player.height) {
          player.isJumping = false;
          player.isFalling = true;
          player.y = canvasHeight - player.height;
        }
      }

if (player.isFalling) {
        if (player.y < canvasHeight - player.height) {
          player.y += player.fallSpeed;
          player.fallSpeed += 1;
        } else {
          player.isFalling = false;
          player.y = canvasHeight - player.height;
        }
      }
    }

// Dibuja el jugador y la plataforma en el lienzo
    function draw() {
      context.clearRect(0, 0, canvasWidth, canvasHeight);

context.fillStyle = "#000000";
      context.fillRect(player.x, player.y, player.width, player.height);

context.fillStyle = "#FF0000";
      context.fillRect(platform.x, platform.y, platform.width, platform.height);
    }

// Verifica las colisiones entre el jugador y la plataforma
    function checkCollisions() {
      const playerBottom = player.y + player.height;
      const platformTop = platform.y;
      
      if (playerBottom >= platformTop && player.x < platform.x + platform.width && player.x + player.width > platform.x) {
        player.isJumping = false;
        player.isFalling = false;
        player.y = canvasHeight - player.height;
      }
    }

// Función de actualización del juego en cada fotograma
    function updateGame() {
      updatePlayerPosition();
      checkCollisions();
      draw();
    }

// Bucle principal del juego
    function gameLoop() {
      updateGame();
      requestAnimationFrame(gameLoop);
    }

// Inicio del juego
    gameLoop();
  </script>
</body>
</html>