-
Notifications
You must be signed in to change notification settings - Fork 0
/
script.js
139 lines (115 loc) · 4.19 KB
/
script.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
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
let contadorDeCartasSelecionadas = 0;
let cartasViradas = 0;
let númeroDeCartas;
let qtdJogadas = 0
let cronometro = 0;
let id;
function configurações() {
númeroDeCartas = parseInt(prompt("Com quantas cartas você deseja jogar?", "Digite um número par entre 4 e 14."));
while (númeroDeCartas % 2 !== 0 || númeroDeCartas < 4 || númeroDeCartas > 14 || númeroDeCartas === NaN) {
númeroDeCartas = parseInt(prompt("Com quantas cartas você deseja jogar?"))
}
const endereçoDasImagens = [
"/assets/explodyparrot.gif",
"/assets/bobrossparrot.gif",
"/assets/fiestaparrot.gif",
"/assets/tripletsparrot.gif",
"/assets/metalparrot.gif",
"/assets/revertitparrot.gif",
"/assets/unicornparrot.gif"
]
endereçoDasImagens.sort(comparador)
const númeroDeRepetições = númeroDeCartas / 2;
const cardsHTML = []
let elementosHTML;
for (let i = 0; i < númeroDeRepetições; i++) {
for (let j = 0; j < 2; j++) {
elementosHTML = `
<article class="card" data-identifier="card" onclick="recebeClique(this)">
<div class="front-face face" data-identifier="front-face" >
<img src="/assets/front.png" >
</div>
<div class="back-face face" data-identifier="back-face">
<img src="${endereçoDasImagens[i]}" >
</div>
</article>
`
cardsHTML.push(elementosHTML)
}
}
cardsHTML.sort(comparador)
const seção = document.querySelector("section");
for (let i = 0; i < cardsHTML.length; i++) {
seção.innerHTML += cardsHTML[i]
}
id = setInterval(cronometrar, 1000)
}
function recebeClique(endereçoClique) {
const verificação = endereçoClique.classList.contains("virado")
if (!verificação) {
if (contadorDeCartasSelecionadas < 2) {
CliqueNaCarta(endereçoClique)
}
}
}
function CliqueNaCarta(endereçoClique) {
const verificação = endereçoClique.classList.contains("selecionado")
if (!verificação) {
endereçoClique.classList.add("selecionado")
const frontFace = endereçoClique.querySelector(".front-face")
const backFace = endereçoClique.querySelector(".back-face")
frontFace.classList.add("face-frente")
backFace.classList.add("face-costas")
contadorDeCartasSelecionadas++
qtdJogadas++
}
if (contadorDeCartasSelecionadas === 2) {
compararCartas()
}
}
function compararCartas() {
const cartasSelecionadas = document.querySelectorAll(".selecionado")
if (cartasSelecionadas[0].innerHTML === cartasSelecionadas[1].innerHTML) {
for (let i = 0; i < cartasSelecionadas.length; i++) {
cartasSelecionadas[i].classList.remove("selecionado")
cartasSelecionadas[i].classList.add("virado")
}
cartasViradas = cartasViradas + 2
contadorDeCartasSelecionadas = 0
} else {
setTimeout(virarCartas, 1000)
}
setTimeout(fimDoJogo, 1000)
}
function virarCartas() {
const cartasSelecionadas = document.querySelectorAll(".selecionado")
for (let i = 0; i < cartasSelecionadas.length; i++) {
const frontFace = document.querySelector(".selecionado .front-face")
const backFace = document.querySelector(".selecionado .back-face")
frontFace.classList.remove("face-frente")
backFace.classList.remove("face-costas")
cartasSelecionadas[i].classList.remove("selecionado")
}
contadorDeCartasSelecionadas = 0;
}
function fimDoJogo() {
if (cartasViradas === númeroDeCartas) {
clearInterval(id)
alert(`Você ganhou em ${qtdJogadas} jogadas e em ${cronometro} segundos! `)
const pergunta = prompt("Você deseja jogar novamente?", "sim")
if (pergunta === "sim") {
document.location.reload(true)
} else {
alert("Obrigado por jogar!")
}
}
}
function comparador() {
return Math.random() - 0.5;
}
function cronometrar() {
cronometro++;
const contador = document.querySelector(".contador");
contador.innerHTML = cronometro;
}
configurações()