ahorcado-java-script/game.html at main · MathiasMSVDev/ahorcado-java-script · 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
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
<!DOCTYPE html>
<html lang="es">

<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Game</title>
    <link rel="shortcut icon" href="./img/favicon.ico" type="image/x-icon" />
    <link href="https://fonts.googleapis.com/css2?family=Inter&display=swap" rel="stylesheet" />
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/css/bootstrap.min.css" rel="stylesheet"
        integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx" crossorigin="anonymous" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.9.1/font/bootstrap-icons.css" />
    <link rel="stylesheet" href="./css/reset.css" />
    <link rel="stylesheet" href="./css/game.css" />
</head>

<body>
    <main>
        <div class="card">
            <div class="card-header">
                <header>
                    <img src="./img/logo.svg" alt="Logo" />
                </header>
            </div>
            <div class="card-body">
                <canvas></canvas>
                <div class="ingresar-letras" id="ingresar-letras"></div>
                <div class="grupo-lineas" id="grupo-lineas"></div>
                <div class="error-letras" id="error-letras"></div>
                <div class="teclado">
                    <button onclick="teclado_mobile('Q');">Q</button>
                    <button onclick="teclado_mobile('W');">W</button>
                    <button onclick="teclado_mobile('E');">E</button>
                    <button onclick="teclado_mobile('R');">R</button>
                    <button onclick="teclado_mobile('T');">T</button>
                    <button onclick="teclado_mobile('Y');">Y</button>
                    <button onclick="teclado_mobile('U');">U</button>
                    <button onclick="teclado_mobile('I');">I</button>
                    <button onclick="teclado_mobile('O');">O</button>
                    <button onclick="teclado_mobile('P');">P</button>
                </div>
                <div class="teclado">
                    <button onclick="teclado_mobile('A');">A</button>
                    <button onclick="teclado_mobile('S');">S</button>
                    <button onclick="teclado_mobile('D');">D</button>
                    <button onclick="teclado_mobile('F');">F</button>
                    <button onclick="teclado_mobile('G');">G</button>
                    <button onclick="teclado_mobile('H');">H</button>
                    <button onclick="teclado_mobile('J');">J</button>
                    <button onclick="teclado_mobile('K');">K</button>
                    <button onclick="teclado_mobile('L');">L</button>
                    <button onclick="teclado_mobile('Ñ');">Ñ</button>
                </div>
                <div class="teclado">
                    <button onclick="teclado_mobile('Z');">Z</button>
                    <button onclick="teclado_mobile('X');">X</button>
                    <button onclick="teclado_mobile('C');">C</button>
                    <button onclick="teclado_mobile('V');">V</button>
                    <button onclick="teclado_mobile('B');">B</button>
                    <button onclick="teclado_mobile('N');">N</button>
                    <button onclick="teclado_mobile('M');">M</button>
                    <button onclick="teclado_mobile('Ü');">Ü</button>
                </div>
                <div class="botones">
                    <div class="botones-body">
                        <button type="button" class="btn-nuevo-juego">
                            <p>Nuevo Juego</p>
                        </button>
                        <button type="button" class="btn-desistir">
                            <p>Desistir</p>
                        </button>
                    </div>
                </div>
            </div>
            <div class="card-footer text-center">
                <p>Desarrollado por José Leonel Inga Quintana (JakubSkraly)</p>
                <p>Oracle Next Education y Alura LATAM</p>
                <p>
                    <a type="button"><i class="bi bi-github"></i></a>
                    <a type="button"><i class="bi bi-linkedin"></i></a>
                </p>
            </div>
        </div>
    </main>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.0/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa"
        crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/howler@2.2.3/dist/howler.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/js-confetti@latest/dist/js-confetti.browser.js"></script>
    <script src="//cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    <script src="./js/game.js"></script>
    <script src="./js/canvas.js"></script>
    <script src="./js/main.js"></script>
</body>

</html>