Bonjour à tous,
voilà j'ai un PB sur mon code, le principe aprsè avoir fait une sélection avec une API on lance un compte à rebours à échéance j'affiche un message disant délai expiré jusque là ça fonctionne.
Si l'internaute entre temps fait une autre sélection, la sélection est bien pris en compte mais le compte à rebours tourne sur les 2 sélections.
Je n'arrive pas à faire le clearInterval sur le précédent.
function countDown(){
// Set the date we're counting down to
var countDownDate = new Date().getTime()+ 120000;//1200000
// Update the count down every 1 second
var x = setInterval(function() {
// Get todays date and time
var now = new Date().getTime();
// Find the distance between now an the count down date
var distance = countDownDate - now;
// Time calculations for days, hours, minutes and seconds
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// on lance le chrono dans l'id countDown
$("#countDown").text( minutes + " m " + seconds + " s ");
$("footer").css({"backgroundColor": "darkseagreen"});
// une fois arrivé à 0 on affiche un message
if (distance < 0) {
clearInterval(x);
// affichage après expiration
$("#countDown").text("Votre réservation vient d'expirer...");
$("footer").css({"background-color": "tomato"});
}
}, 1000);
}
Voici le code de la validation :
var valider = document.getElementById("save");
valider.addEventListener("click", function(){
//storage
var sessionStation = {
name: station.name,
adresse: station.address
};
if(sessionStorage.getItem('nameStation')){
//sessionStorage.clear();
clearInterval(x);
console.log("OK"); //$("#countDown").text("Votre réservation vient d'expirer...");
//$("#reservation").text("");
}
sessionStorage.setItem("nameStation", sessionStation.name);
var sessionStation_json = JSON.stringify(sessionStation);
// Affichage de la station réservé
$("#reservation").text("Vous avez réservé 1 Vélo, station: " + sessionStorage.getItem('nameStation') + " pour");
// on appel la function pour le chrono
var x = countDown();
//Après avoir validé on scroll au footer
$('html, body').animate({
scrollTop: $("#reservation").offset().top
}, 1000);
})
merci de votre aide et bonne journée