IT Hero: O Mestre das Impressoras

by ElectricMeteor77

118 lines4.0 KB

<!DOCTYPE html>
<html lang="pt-br">
<head>
    <meta charset="UTF-8">
    <title>IT Hero: O Mestre das Impressoras</title>
    <style>
        body { margin: 0; background: #2c3e50; display: flex; flex-direction: column; align-items: center; font-family: sans-serif; color: white; }
        canvas { background: #7cfc00; border: 5px solid #34495e; margin-top: 20px; image-rendering: pixelated; }
        .ui { margin-top: 10px; text-align: center; }
    </style>
</head>
<body>

    <div class="ui">
        <h1>IT Hero: Simulação de Reparos</h1>
        <p>Use as <b>Setas</b> para mover e segure <b>Espaço</b> perto da impressora vermelha.</p>
        <h2 id="placar">Reparos: 0</h2>
    </div>

    <canvas id="gameCanvas" width="600" height="400"></canvas>

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

        // Configurações do Jogo
        let pontos = 0;
        const teclas = {};

        // Objeto do Jogador
        const player = {
            x: 300, y: 200, width: 30, height: 30, speed: 4, color: "#2980b9"
        };

        // Lista de Impressoras
        const impressoras = [
            { x: 100, y: 100, status: "ok", timer: 0, color: "#95a5a6" },
            { x: 450, y: 250, status: "ok", timer: 0, color: "#95a5a6" }
        ];

        // Detectar Teclas
        window.addEventListener("keydown", e => teclas[e.key] = true);
        window.addEventListener("keyup", e => teclas[e.key] = false);

        function logicaDoJogo() {
            // Movimentação
            if (teclas["ArrowUp"]) player.y -= player.speed;
            if (teclas["ArrowDown"]) player.y += player.speed;
            if (teclas["ArrowLeft"]) player.x -= player.speed;
            if (teclas["ArrowRight"]) player.x += player.speed;

            // Lógica das Impressoras
            impressoras.forEach(imp => {
                // Chance aleatória de quebrar
                if (imp.status === "ok" && Math.random() < 0.005) {
                    imp.status = "quebrada";
                    imp.color = "#e74c3c";
                }

                // Verificar Colisão e Reparo
                let dx = player.x - imp.x;
                let dy = player.y - imp.y;
                let distancia = Math.sqrt(dx*dx + dy*dy);

                if (distancia < 40 && imp.status === "quebrada" && teclas[" "]) {
                    imp.timer += 2; // Progresso do conserto
                    imp.color = "#f1c40f"; // Amarelo enquanto conserta

                    if (imp.timer >= 100) {
                        imp.status = "ok";
                        imp.color = "#95a5a6";
                        imp.timer = 0;
                        pontos++;
                        placarTxt.innerText = "Reparos: " + pontos;
                    }
                } else if (imp.status === "quebrada" && !teclas[" "]) {
                    imp.color = "#e74c3c";
                }
            });
        }

        function desenhar() {
            // Limpar fundo (Grama)
            ctx.fillStyle = "#7fb069";
            ctx.fillRect(0, 0, canvas.width, canvas.height);

            // Desenhar Impressoras
            impressoras.forEach(imp => {
                ctx.fillStyle = imp.color;
                ctx.fillRect(imp.x, imp.y, 40, 40);
                
                // Barra de progresso se estiver consertando
                if (imp.timer > 0) {
                    ctx.fillStyle = "white";
                    ctx.fillRect(imp.x, imp.y - 10, imp.timer * 0.4, 5);
                }
            });

            // Desenhar Jogador
            ctx.fillStyle = player.color;
            ctx.fillRect(player.x, player.y, player.width, player.height);
            // "Cabeça" do boneco
            ctx.fillStyle = "#f3dbc2";
            ctx.fillRect(player.x + 5, player.y + 5, 20, 10);
        }

        function gameLoop() {
            logicaDoJogo();
            desenhar();
            requestAnimationFrame(gameLoop);
        }

        gameLoop();
    </script>
</body>
</html>

Game Source: IT Hero: O Mestre das Impressoras

Creator: ElectricMeteor77

Libraries: none

Complexity: moderate (118 lines, 4.0 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: it-hero-o-mestre-das-impressoras-electricmeteor77" to link back to the original. Then publish at arcadelab.ai/publish.