Discussion :

[Poumchimie]

Bonjour,

J'ai quelques soucis sur l'asynchrone ><. J'ai lu ça qui répondait une partie de ma réponse mais je souhaite enregistrer plusieurs valeurs sur un tableau.
Voici mon code :

Code :

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

1
2
3
4
5
6
7
8
var getBoutique = JSON.parse(window.localStorage.getItem('infoBout'));
	var tri = new Array();
	for(var j = 1; j<taille; j++){
		where = getBoutique[j].adresse+", "+getBoutique[j].ville;
		boutiqueProche(lat, lon,where, function(distanceO){ 
			tri.push(distanceO);
			});
}

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
 
function boutiqueProche(cLat, cLong,where, callback){
	var geocoder= new google.maps.Geocoder();
	var currentPosition = new google.maps.LatLng(cLat, cLong); // On récupère nos info
	var recup = getBoutique.length;
	var distance;
	geocoder.geocode({ 'address': where}, function(results, status) {
   		if (status == google.maps.GeocoderStatus.OK) {
 
			var laBoutique = new google.maps.LatLng(results[0].geometry.location.lat(), results[0].geometry.location.lng());
			distance = google.maps.geometry.spherical.computeDistanceBetween(currentPosition, laBoutique);
			recup=distance/1000;
			callback(recup);
 
   		}	
   		else{
   			if( status == google.maps.GeocoderStatus.OVER_QUERY_LIMIT){
   				setTimeout( function(){
        			boutiqueProche(cLat, cLong, where, callback); // rappel fonction avec meme param
       			 }, 200);    			
   			}
   				else {	/*Faire quelque chose */ }
   		}
 
	});
}

Dans mon callback, j'enregistre bien mes valeurs dans le tableau tri[] =) mais le seul soucis est qu'il est asynchrone (Le geocoder prend trop de temps à répondre)! Donc lorsque je souhaite réutiliser mes valeurs en dehors (après la boucle for), j'ai mon tableau UNDEFINED car le geocoder prend du temps a répondre. Je voudrai savoir s'il existe une fonction qui puisse rendre le geocoder synchrone ou j'attend que le tableau se remplit pour pouvoir utiliser le tableau mais je ne vois pas comment faire ><

Merci d'avance de votre aide, pour savoir comment résoudre mon problème ><

[sekaijin]

il n'y a aucune notion de temps de loop dans la prog asynchrone

tu fais une requête qui envoie une demande au serveur et place une callback pour traiter la réponse.

celle-ci lorsque les donné arrive les traite et déclenche un événement

un handler sur cet événement réagit et manipule ton interface
les changements induit vont engendrer des événements qui seront capté par d'autre handlers et agir à leur tour

il n'y a jamais de loop ou de timeout pour déclancher une action qui manipule des donnée qu'on n'a pas reçu

A+JYT

[Poumchimie]

Merci de ta réponse!

Donc il n'y a aucun moyen que je puisse traiter les données une fois le tableau remplit ?

J'ai lu sur internet qu'il y avait un moyen mais je ne vois pas comment l'utiliser
Il faut utiliser le JQUERY.Deferred() et le deferred.promise() (http://api.jquery.com/promise/) Si tu as une idée comment l'utiliser, je suis preneur =)

[sekaijin]

tu dit je veux executer ma fonction lorsque le tableau est rempli

et tu fait j'exécute ma fonction au bout de X minute et ça plante parce que le tableau n'est pas rempli

ma réponse est :
execute ta fonction lorsque le tableau est rempli

donc utilise les événements

Code :

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

1
2
3
4
5
6
if (window.addEventListener) {
  window.addEventListener('monTableauEstRempli', mafonction, false);
}
else if (window.attachEvent) {
  window.attachEvent('monTableauEstRempli', mafonction );
}

A+JYT

[Poumchimie]

Merci je comprend beaucoup mieux!
Je ne maîtrise pas encore assez bien javascript

Comment je peux dire que mon tableau est remplie et appelé le
window.attachEvent('monTableauEstRempli', mafonction ); ?

Code :

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

1
2
3
4
5
6
7
8
9
10
 
if(tri.length == 29)
{
  if (window.addEventListener) {
  window.addEventListener('monTableauEstRempli', mafonction, false);
  }
  else if (window.attachEvent) {
  window.attachEvent('monTableauEstRempli', mafonction );
  }
}

Dois je le lancer comme ça ? C'est la première fois que je vois qu'on peut mettre un addEventListener avec autre que click ou onclick! Mon parcours sera long pour le javascript xD

[sekaijin]

dans ton callback ajax lorsque le tableau est chargé tu créé un nouvel événement
https://developer.mozilla.org/en-US/...PI/CustomEvent
http://davidwalsh.name/customevent

A+JYT

[SylvainPV]

sekaijin c'est bien d'illustrer ton nouveau post sur la programmation évènementielle mais assure-toi que ça répond bien à la question Je ne vois pas ce qu'il va faire avec ça s'il ne sait pas quand déclencher cet évènement.

Poumchimie, dans ta boucle for tu vas lancer plusieurs requêtes asynchrones et tu ne sais pas dans combien de temps ni dans quel ordre tu auras toutes les réponses. En revanche, tu peux exécuter un bout de code à chaque fois qu'une requête est terminée.

Par conséquent tu peux déterminer quand toutes les requêtes sont terminées en tenant un compteur et en le décrémentant à chaque fois qu'une requête se finit:

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
var boutiques = JSON.parse(window.localStorage.getItem('infoBout'));
var tri = [];
var boutiquesRestantes = boutiques.length;
for(var j = 0; j<boutiques.length; j++){
	var where = boutiques[j].adresse+", "+boutiques[j].ville;
	boutiqueProche(lat, lon,where, function(distanceO){ 
		tri.push(distanceO);
		boutiquesRestantes--;
		if(boutiquesRestantes===0){
			onAllDataLoaded(tri);
		}
	});
}
 
function onAllDataLoaded(data){
	//tu peux travailler avec toutes tes données
}

[sekaijin]

1) nous ne sommes pas là pour faire le travail des autres
2) nous n'avons pas les informations pour donner une réponse complète

dans le post initial il est fait mention d'une callback callback(recup); .

à la fin de cette fonction recup on est sur que les données sont chargées
il suffit donc là de lever l'événement.
et de s'y abonner avec par esemple ta fonction onAllDataLoaded.

[Poumchimie]

Je vous remercie de votre aide !
J'ai passé une soirée pour comprendre le customEvent, attachEvent et addEventListener mais je n'ai toujours pas compris comment l'utiliser ><

Tu m'as sauvé la vie sekaijin et SylvainPV! xD
Mon but est de récupérer la distance de chaque adresse puis de mettre un marker sur la carte si l'adresse est proche de moi!