Discussion :

[clickandgo]

Bonjour à tous,

Dans le code suivant, le score total qui doit s'afficher dans la div "scoreTotalJ1" ou "scoreTotalJ2" ou bien la div d'historique est toujours un coup en retard au moment du calcul...

Que fais-je mal ?

Merci d'avance

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
import Joueur from './classes/Joueur.js'
 
const barreInfo = document.getElementById('barreInfo')
const cube = document.getElementById('cube')
const btnRoll = document.getElementById('btn-roll')
const btnHold = document.getElementById('btn-hold')
const btnNewGame = document.getElementById('btn-new-game')
const joueur1 = document.getElementById('joueur1')
const joueur2 = document.getElementById('joueur2')
const divScoreCourantJ1 = document.querySelector('.score-courant-joueur1')
const divScoreTotalJ1 = document.querySelector('.score-total-joueur1')
const divScoreCourantJ2 = document.querySelector('.score-courant-joueur2')
const divScoreTotalJ2 = document.querySelector('.score-total-joueur2')
const divHistorique = document.querySelector('.historique')
const checkHistorique = document.querySelector('.checkHistorique')
 
//Au démarrage de la page
window.onload = () => {
    barreInfo.innerHTML = `<h4>Appuyer sur le bouton "nouvelle partie" pour commencer</h4>`
    btnHold.disabled = true
    btnRoll.disabled = true
    checkHistorique.checked = false
}
 
//historique de la partie
const historique = []
 
var joueurActif
var resultatTirage = 0
 
const currentJ1 = []
const currentJ2 = []
 
var scoreCourantJ1 = 0
var scoreCourantJ2 = 0
 
var scoreTotalJ1 = 0
var scoreTotalJ2 = 0
 
const angleArray = [
    [0, 0, 0],
    [-310, -362, -38],
    [-400, -320, -2],
    [135, -217, -88],
    [-224, -317, 5],
    [-47, -219, -81],
    [-133, -360, -53]
];
 
const tirage = () => {
    //Calcul des angles finaux d'affichage de face du dé
    const randomAngle = Math.floor(Math.random() * 6) + 1
    /*ANIMATION */
    cube.style.animation = 'animate 1.4s linear';
    //console.log(randomAngle);
    cube.style.transform = 'rotateX(' + angleArray[randomAngle][0] + 'deg) rotateY(' + angleArray[randomAngle][1] + 'deg) rotateZ(' + angleArray[randomAngle][2] + 'deg)';
    cube.style.transition = '1s linear'
 
    cube.addEventListener('animationend', function (e) {
        cube.style.animation = '';
    })
 
    // const resultatTirage = (randomAngle) => {
 
    //     switch (randomAngle) {
    //         case 1:
    //             return "Vous avez tiré le chiffre un !"
    //         case 2:
    //             return "Vous avez tiré le chiffre deux !"
    //         case 3:
    //             return "Vous avez tiré le chiffre trois !"
    //         case 4:
    //             return "Vous avez tiré le chiffre quatre !"
    //         case 5:
    //             return "Vous avez tiré le chiffre cinq !"
    //         case 6:
    //             return "Vous avez tiré le chiffre six !"
    //         default:
    //             return "Veuillez tirer le dè"
    //     }
    // }
    // console.log(randomAngle)
    resultatTirage = randomAngle
    return resultatTirage
}
 
const afficherHistorique = () => {
    //On inverse le tableau d'historique
    const rows = historique.reverse()
    rows.map((row) => {
        return `<p>${row}</p>`
    })
    divHistorique.innerHTML = rows.join('')
}
 
//Remplir tableau de score courant du joueur actif 
const remplirScoreCourant = () => {
    //Si le joueur actif tire un "1", il perd son score courant (scoreCourant), son score courant est
    //remis à zéro et il doit passer son tour
 
    if (joueurActif == 1) {
        if (resultatTirage == 1) {
            currentJ1.length = 0
            scoreCourantJ1 = 0
            //constitution de l'historique de la partie
            historique.push([`Le joueur ${joueurActif} a tiré un 1 : il doit passer son tour, score total = ${scoreTotalJ1} points.`])
            divScoreCourantJ1.textContent = 0
            joueurActif = 2
            btnHold.disabled = true
 
        } else {
 
            currentJ1.push(resultatTirage)
            //Calcul total joueur 1
            scoreCourantJ1 = currentJ1.reduce((a, b) => a + b)
            divScoreCourantJ1.textContent = scoreCourantJ1
            //constitution de l'historique de la partie
            historique.push([`Le joueur ${joueurActif} tire un ${resultatTirage} score courant = ${scoreCourantJ1}/100 score total = ${scoreTotalJ1} points.`])
            btnHold.disabled = false
        }
 
    } else {
 
        if (resultatTirage == 1) {
            currentJ2.length = 0
            scoreCourantJ2 = 0
            //constitution de l'historique de la partie
            historique.push([`Le joueur ${joueurActif} a tiré un 1 : il doit passer son tour, score total = ${scoreTotalJ2} points.`])
            divScoreCourantJ2.textContent = 0
            joueurActif = 1
            btnHold.disabled = true
            console.log(historique)
 
        } else {
 
            //Calcul total temporaire joueur 2
            currentJ2.push(resultatTirage)
            scoreCourantJ2 = currentJ2.reduce((a, b) => a + b)
            divScoreCourantJ2.textContent = scoreCourantJ2
            //constitution de l'historique de la partie
            historique.push([`Le joueur ${joueurActif} tire un ${resultatTirage}, score courant = ${scoreCourantJ2}/100 score total = ${scoreTotalJ2} points.`])
            console.log(historique)
            btnHold.disabled = false
        }
    }
}
 
const initialiser = () => {
    //Interroge la méthode contenue dans la classe Joueur
    //pour obtenir un premier joueur de façon aléatoire
    const j = new Joueur()
    joueurActif = j.premierJoueur
    console.log("joueur actif : " + joueurActif)
    return joueurActif
}
 
btnNewGame.addEventListener('click', () => {
    //Nouvelle partie
    initialiser()
    //Mise à zéro des champs et tableaux
    currentJ1.length = 0
    currentJ2.length = 0
    historique.length = 0
 
    divScoreCourantJ1.textContent = 0
    divScoreTotalJ1.textContent = 0
    divScoreCourantJ2.textContent = 0
    divScoreTotalJ2.textContent = 0
 
    btnRoll.disabled = false
})
 
// checkHistorique.addEventListener('click', () => {
 
// })
 
//Lancement du dé
btnRoll.addEventListener('click', () => {
    btnHold.disabled = false
    tirage()
    remplirScoreCourant(joueurActif)
    //Si l'option est sélectionnée l'historique de 
    // la partie est affiché
    if (checkHistorique.checked == true) {
        divHistorique.style.display = "block"
        afficherHistorique()
    } else {
        divHistorique.style.display = "none"
    }
})
 
//Calcul du total temporaire pour chaque joueur et addition au score global
btnHold.addEventListener('click', () => {
 
    // btnHold.disabled = true
 
    if (joueurActif == 1) {
        scoreTotalJ1 += scoreCourantJ1
        divScoreTotalJ1.textContent = scoreTotalJ1
        divScoreCourantJ1.textContent = 0
        barreInfo.innerHTML = `Le joueur 1 cède son tour avec un total provisoire de ${scoreTotalJ1} points, doit obtenir ${100-scoreTotalJ1} pour gagner.`
        currentJ1.length = 0
        joueurActif = 2
 
    } else {
 
        scoreTotalJ2 += scoreCourantJ2
        divScoreTotalJ2.textContent = scoreTotalJ2
        divScoreCourantJ2.textContent = 0
        barreInfo.innerHTML = `Le joueur 2 cède son tour avec un total provisoire de ${scoreTotalJ2} points, doit obtenir ${100-scoreTotalJ2} pour gagner.`
        currentJ2.length = 0
        joueurActif = 1
    }
})

[mathieu]

les "console.log" affichent les bonnes valeurs attendues ?

[clickandgo]

Bonjour, oui !