JavaScript-Games/games/spaceinvaders/index.html at main · ZLostTK/JavaScript-Games · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no" />
    <meta name="description" content="Space Invaders – Clásico arcade con modo Solo, Versus Local y Multijugador Online P2P." />
    <title>Space Invaders</title>
    <link rel="stylesheet" href="style.css" />
</head>
<body>
    <div id="game-container">
        <canvas id="gameCanvas"></canvas>
        <button id="back-btn" onclick="location.href='../../'">&#8592; Volver</button>

        <!-- ── Online lobby (estructura estándar del proyecto) ─────────────── -->
        <div id="online-ui" class="hidden">
            <div id="online-panel">
                <h2 id="online-title">En línea</h2>
                <p id="online-status">Conectando...</p>
                <div id="host-view" class="hidden">
                    <p class="label">Código de partida</p>
                    <p id="room-code-display">------</p>
                    <button id="copy-btn">Copiar código</button>
                    <p class="hint">Comparte este código con tu rival</p>
                </div>
                <div id="join-view" class="hidden">
                    <p class="label">Introduce el código</p>
                    <input id="room-code-input" type="text" maxlength="6"
                           placeholder="XXXXXX" autocomplete="off" spellcheck="false" />
                    <button id="join-btn">Conectar</button>
                </div>
                <button id="online-back-btn">← Cancelar</button>
            </div>
        </div>
    </div>

    	<script type="module" src="./main.js"></script>
</body>
</html>