Pelea escolar de Roblox: Juego de agarrar, golpear y suplex

34 Kari_szn

Abrir en el editor Video Publica tu código

Pelea escolar de Roblox: Juego de agarrar, golpear y suplex

Recomendado

11 September 2025

Juego Brick Breaker HTML Canvas JavaScript

28 January 2026

Coche Eggy

9 December 2024

Pasar el ratón por encima de la imagen

HTML

<!DOCTYPE html>
<html>
<head>
    <title>Roblox Battle: Fixed Grab & Slam</title>
    <style>
        body { margin: 0; background: #000; display: flex; align-items: center; justify-content: center; height: 100vh; overflow: hidden; font-family: 'Arial Black', sans-serif; }
        canvas { background: #1a1a1a; border: 5px solid #444; }
        #ui { position: absolute; top: 10px; color: #fff; text-align: center; pointer-events: none; }
        #restartBtn { position: absolute; display: none; padding: 15px 30px; font-size: 24px; background: #00e676; color: white; border: none; border-bottom: 5px solid #00c853; border-radius: 8px; cursor: pointer; z-index: 10; }
    </style>
</head>
<body>
    <div id="ui"><h1>SCHOOL BRAWL</h1><p>Z: Grab | C: SLAM | X: Suplex | SPACE: Punch</p></div>
    <button id="restartBtn" onclick="resetGame()">RESTART</button>
    <canvas id="game"></canvas>

let shake = 0; let particles = []; let blood = []; 
    let suplexTimer = 0; let slamTimer = 0; let detentionTimer = 0;
    const gravity = 0.8;

let player = { x: 500, y: 390, w: 40, h: 60, color: "#00a2ff", grabbing: null, angle: 0, dir: 1, punch: 0, vy: 0, jumping: false };
    const colors = ["#ff3e3e", "#ff8c00", "#ffd700", "#44ff44", "#00ffff", "#e81ed2", "#ffffff"];
    let enemies = colors.map((c, i) => ({ x: 100 + (i * 120), y: 390, w: 40, h: 60, color: c, hp: 100, grabbed: false, angle: 0, vy: 0, dead: false }));

function resetGame() {
        blood = []; particles = []; detentionTimer = 0;
        restartBtn.style.display = "none";
        player.x = 500; player.y = 390; player.vy = 0; player.grabbing = null;
        enemies.forEach(en => { en.dead = false; en.hp = 100; en.y = 390; en.grabbed = false; en.angle = 0; });
    }

function update() {
        if (detentionTimer > 0) { detentionTimer--; restartBtn.style.display = "block"; return; }

player.y += player.vy; player.vy += gravity;
        if (player.y >= 390) { player.y = 390; player.vy = 0; player.jumping = false; }

if (slamTimer > 0 && player.grabbing) {
            slamTimer--;
            player.grabbing.y += 20; 
            player.grabbing.angle += 0.5;
            if (slamTimer === 0) {
                shake = 30; player.grabbing.hp -= 40;
                player.grabbing.grabbed = false;
                let victim = player.grabbing; // temp ref to clear
                player.grabbing = null;
                victim.angle = 0;
                if (victim.hp <= 0) victim.dead = true;
            }
        } 
        else if (suplexTimer > 0 && player.grabbing) {
            suplexTimer--;
            player.angle -= 0.15; player.grabbing.angle -= 0.25;
            player.grabbing.x = player.x - (50 * player.dir);
            player.grabbing.y = player.y - 30;
            if (suplexTimer === 0) {
                shake = 25; player.grabbing.hp -= 40;
                player.grabbing.grabbed = false;
                let victim = player.grabbing;
                player.grabbing = null;
                player.angle = 0;
                victim.angle = 0;
                if (victim.hp <= 0) victim.dead = true;
            }
        } else {
            if (keys["ArrowLeft"]) { player.x -= 7; player.dir = -1; }
            if (keys["ArrowRight"]) { player.x += 7; player.dir = 1; }
            enemies.forEach(en => {
                if (en.grabbed) { 
                    en.x = player.x; en.y = player.y - 50; 
                } else {
                    if (en.y < 390) { en.vy += gravity; en.y += en.vy; } else { en.y = 390; en.vy = 0; }
                }
            });
        }
        if (player.punch > 0) player.punch--;
        if (shake > 0) shake *= 0.9;
    }

function drawChar(obj, isP) {
        ctx.save();
        ctx.translate(obj.x + 20, obj.y + 30);
        ctx.rotate(obj.angle || 0);
        ctx.fillStyle = obj.dead ? "#333" : obj.color;
        ctx.fillRect(-20, -15, 40, 45); 
        ctx.beginPath(); ctx.arc(0, -25, 18, 0, Math.PI*2); ctx.fill();
        ctx.fillStyle = "white";
        let lookDir = (isP ? player.dir : (player.x > obj.x ? 1 : -1));
        ctx.fillRect(lookDir === 1 ? 5 : -15, -28, 8, 4);
        ctx.restore();
    }

function loop() { update(); draw(); requestAnimationFrame(loop); }
    loop();
</script>
</body>
</html>

Pelea escolar de Roblox: Juego de agarrar, golpear y suplex

Recomendado

Juego Brick Breaker HTML Canvas JavaScript

Coche Eggy

Pasar el ratón por encima de la imagen

HTML

CSS

JS

Recomendado

Juego Brick Breaker HTML Canvas JavaScript

Coche Eggy

Pasar el ratón por encima de la imagen

HTMLCopy

CSSCopy

JSCopy

HTML

CSS

JS