Interrompre un traitement déclenché par un évènement
Bonjour, :D
J'ai fais des recherches sur le forum et sur google mais je n'ai pas trouvé de réponse satisfaisante, du moins pour le débutant en javascript que je suis. C'est pourquoi je me tourne vers vous.
Je réalise un outil qui permet d'afficher un ensemble de marker sur une carte en utilisant l'api google map. Entre l'apparition de chaque marker il se passe un temps variable.
Les coordonnées des marker et le timestamp sont stocké dans un fichier en JSON qui est chargé dans une variable global automatiquement après le chargement de la page.
L'utilisateur clique sur un input de type bouton qui va déclencher un simple for qui va parcourir la variable et faire un setTimeout pour afficher chaque marker a l'instant où il faut.
L'utilisateur doit pouvoir arrêter la boucle en pleins milieu via un autre bouton et influencer le temps qui s'écoule entre l'affichage de deux marker via un coefficient temps saisie en input de manière dynamique.
Dans un premier temps je cherche juste la possibilité d'interrompre la boucle, pour ça je pensais utilisé un simple booléen dans la conditions du for et modifier sa valeur lorsque l'utilisateur souhaite interrompre le traitement. Le problème c'est que le changement de valeur de la variable n'est pas pris en compte dans la fonction.
J'aimerais savoir pourquoi et comment passer outre se désagrément.
Mon code js ressemble a ça :
JS
Code:
1 2 3 4 5 6
|
var log = new Log();
$(function init_listener()
{
$("#log").click(function(){log.logReader();});
}); |
Code:
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
|
Log.prototype = {
logReader: function()
{
if (this.readingStart) //par défaut c'est a faux
{
this.readingStart = false;
document.getElementById("log").value = "Start read logs";
this.stopLog();
}
else
{
this.readingStart = true;
document.getElementById("log").value = "Stop read logs";
this.readLog();
}
},
readLog: function()
{
//....
for (; this.readingStart && this.currentStep < this.data.length;
this.currentStep++) {
//....
var l = this.data[this.currentStep];
this.timeoutlist.push(
setTimeout((function(j){
return function(){
callbackMap[j.function_name](j.args, j.timestamp);}
})(l), d_time <= d_date ? 0 : d_time));
//...
}
//....
} |
HTML
Code:
1 2
|
<input id="log" type=button value="Read logs"> |
Excusez moi pour ce post un peu long j'ai essayé de le faire le plus explicite possible si vous avez des questions n'hésitez pas.
Merci par avance pour votre aide :ave: