-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.js
96 lines (73 loc) · 2.4 KB
/
index.js
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
const cartas = document.querySelectorAll(".memoria-card");
console.log(cartas);
let tableroBloqueado = false;
let arrancaste = false;
let primeraCarta, segundaCarta;
function girar() {
if (tableroBloqueado) return;
// Si la primera carta, es igual a la que estoy apretando (segunda), que salga de la funcion
// Puedo saber cual es la segunda carta aunque todavía no la haya guardado
if (this === primeraCarta) return;
this.classList.add("girar");
if (!arrancaste) {
arrancaste = true;
primeraCarta = this;
return;
}
arrancaste = false;
segundaCarta = this;
comprobarCoincidencia();
}
// Funcion para reseTEAR LAS BAREAVLES
function resetearBareavle() {
primeraCarta = null;
segundaCarta = null;
// tableroBloqueado = false;
// arrancaste = false;
}
function comprobarCoincidencia() {
let coincidencia =
primeraCarta.dataset.participante === segundaCarta.dataset.participante;
coincidencia ? deshabilitarCartas() : devolverCartas();
}
function deshabilitarCartas() {
primeraCarta.removeEventListener("click", girar);
segundaCarta.removeEventListener("click", girar);
resetearBareavle();
}
function devolverCartas() {
tableroBloqueado = true;
setTimeout(() => {
primeraCarta.classList.remove("girar");
segundaCarta.classList.remove("girar");
tableroBloqueado = false;
resetearBareavle();
}, 700);
}
function cartasClickeables() {
cartas.forEach((carta) => carta.addEventListener("click", girar));
mezclarCartas();
}
cartasClickeables();
// Hacer el random
function mezclarCartas() {
// Recorrer todas las cartas
// Por cada carta:
// Quiero generar un numero random
// Y aplicarselo al style.order
cartas.forEach((carta) => {
let numeritoRandomico = Math.floor(Math.random() * 12);
carta.style.order = numeritoRandomico;
});
}
// TAREA
// leer que es this en los addEventListener
// Agregarle algun boton de Reset (dar vuelta todas las cartas, volver a mezclarlas, volver a agregarle los event listener... todo de nuevo)
// Contador de movimientos || un limite de movimientos (maximo de 12 movimientos y por cada !acierto, que reste uno, y cuando llega a 0, chau picho)
// Algun innerHtml que me diga: ganasTE PERRRIIIIIIIIIIII
// Sacado de contexto (miren la clase para entender xD)
// piedra = 0
// papel = 2
// tijera = 1
// const array = [[empato, gano, perdio], [gano, empato, perdio], [perdio, gano, empato]]
// array[0][1] = gano