Fix observer

This commit is contained in:
2024-05-07 18:50:17 +04:00
parent 6443f8fd0e
commit c961220474
+26 -37
View File
@@ -132,10 +132,7 @@ function startGame() {
score.innerHTML = "<p style='color: green; font-weight: bold; margin-right: 2em;'>Correct ✅ : <span style='color: black;' id='OK'>0</span></p><p style='color: red; font-weight: bold;'>Faux ❌ : <span style='color: black;' id='KO'>0</span></p>" score.innerHTML = "<p style='color: green; font-weight: bold; margin-right: 2em;'>Correct ✅ : <span style='color: black;' id='OK'>0</span></p><p style='color: red; font-weight: bold;'>Faux ❌ : <span style='color: black;' id='KO'>0</span></p>"
chrono.innerHTML = "<p>Temps écoulé : <span id='time'></span></p>" chrono.innerHTML = "<p>Temps écoulé : <span id='time'></span></p>"
const communeElement = document.getElementById('commune') communeObserver()
const timeElement = document.getElementById('time')
communeObserver(communeElement, timeElement)
ok = document.getElementById('OK') ok = document.getElementById('OK')
ko = document.getElementById('KO') ko = document.getElementById('KO')
@@ -147,42 +144,30 @@ function startGame() {
} }
/** /**
* Observe le contenu de l'élément ayant pour id "commune" * Recommencer la partie
*
* @param {object} communeElement
* @param {object} timeElement
*/ */
function communeObserver(communeElement, timeElement) { function restartGame() {
startGame()
}
/**
* Observe le contenu de l'élément ayant pour id "commune"
*/
function communeObserver(){
const communeElement = document.getElementById('commune')
const timeElement = document.getElementById('time')
// Options de l'observateur (quelles sont les mutations à observer) // Options de l'observateur (quelles sont les mutations à observer)
const config = { childList: true, subtree: true, characterData: true } const config = { childList: true, subtree: true, characterData: true }
// Fonction callback à éxécuter quand une mutation est observée // Fonction callback à éxécuter quand une mutation est observée
const callback = function (mutationsList) { const callback = function (mutationsList) {
for (const mutation of mutationsList) { for (var mutation of mutationsList) {
if (mutation.type == "childList" || mutation.type == "characterData") { if (mutation.type == "childList" || mutation.type == "characterData") {
// Vérifie si le contenu de la balise span n'est pas égal à "..."
if (communeElement.textContent.trim() !== "...") { if (communeElement.textContent.trim() !== "...") {
updateTime(timeElement) // Vérifie si setInterval n'est pas déjà en cours
} else { if (!intervalId) {
clearInterval(intervalId)
intervalId = null
}
}
}
}
// Crée une instance de l'observateur liée à la fonction de callback
const observer = new MutationObserver(callback)
// Commence à observer le noeud cible pour les mutations précédemment configurées
observer.observe(communeElement, config)
}
/**
* Mets à jour le contenu de l'élément ayant l'id "time"
*
* @param {object} timeElement
*/
function updateTime(timeElement) {
intervalId = setInterval(() => { intervalId = setInterval(() => {
gameTime++ gameTime++
@@ -195,12 +180,16 @@ function updateTime(timeElement) {
} }
}, 1000) }, 1000)
} }
}
}
}
}
/** // Créé une instance de l'observateur lié à la fonction de callback
* Recommencer la partie const observer = new MutationObserver(callback)
*/
function restartGame() { // Commence à observer le noeud cible pour les mutations précédemment configurées
startGame() observer.observe(communeElement, config)
} }
/** /**