jquery.deferred, fancytree, et IIFE
Bonjour
Une question sur un phénomène qui m'échappe un peu, que je présume lié à l'asynchronisme mais sans vraiment arriver à me l'expliquer.
Enfin en tout cas je cherche un éclairage.
Donc voici mon bout de code
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
|
function expandResultNodes(responseText) {
var result_keys=[];
$.each(responseText, function( index, keypath) {
result_keys.push(keypath.split("/").pop());
});
var FTPtree = $("#Tree_sasFTP").fancytree("getTree") ;
// Use deferred promise:
FTPtree.loadKeyPath(responseText).done(function(){
defferedFilterNodes(FTPtree);
});
// FTPtree.loadKeyPath(responseText).done(
// defferedFilterNodes(FTPtree)
// );
function defferedFilterNodes (tree){
tree.filterNodes(function(node) {
console.log("filtering " + node.key);
return result_keys.some(function(element) {
// checks whether a result_keys element equals node key
return element == node.key;
});
});
}
} |
j'envoie en AJAX une requête de recherche de mots-clés sur mon serveur, la recherche s'effectue sur le serveur sur une partie du file system qui correspond à une zone de dépose FTP, le serveur renvoie une réponse en JSON qui est constituée d'un tableau de chemins de clefs. Exemple de réponse mis en forme par firefox :
Code:
1 2 3 4 5 6 7 8 9
|
0 "/_f83b45b7c4d40be3b25b7abfcb7226c4/_eb8cf44ea2366ae3cf1af572d5a818e0/_393d735d160b9d21ddde00b739991e59"
1 "/_f83b45b7c4d40be3b25b7abfcb7226c4/_eb8cf44ea2366ae3cf1af572d5a818e0/_32a9a6fc7652124f1882f52e2316ee0e"
2 "/_f83b45b7c4d40be3b25b7abfcb7226c4/_eb8cf44ea2366ae3cf1af572d5a818e0/_32a9a6fc7652124f1882f52e2316ee0e/_19a2fd29b73244e41f9eaa4ec6dc5e79/_fb58a0b2d0e222117b83e361be8643e4"
3 "/_f83b45b7c4d40be3b25b7abfcb7226c4/_eb8cf44ea2366ae3cf1af572d5a818e0/_32a9a6fc7652124f1882f52e2316ee0e/_19a2fd29b73244e41f9eaa4ec6dc5e79/_32a1178799b476d197251c2d1e617903"
[...]
24 "/_f83b45b7c4d40be3b25b7abfcb7226c4/_eb8cf44ea2366ae3cf1af572d5a818e0/_f45e1e6c72e2e8a80889794671538c6e/_11fe4e4e36adeacf04d8efbffcf4259a/_16b6520368113327455a2574562a902f"
25 "/_f83b45b7c4d40be3b25b7abfcb7226c4/_eb8cf44ea2366ae3cf1af572d5a818e0/_123fcfdc7ff35b145093d9ff49ada47b" |
Ces clefs sont des éléments identifiants pour les nœuds d'une arborescence représentée par Fancytree : https://github.com/mar10/fancytree
A la base, avant de recevoir cette réponse Fancytree ne représente que le premier niveau de répertoires, donc la racine et 8 répertoires sous-jacents.
le code une fois la réponse JSON reçue, charge de manière "lazy" (lazy loading==requêtes AJAX pour chaque nouveau noeud ou branches à visualiser qui n'est pas déjà présent)
C'est ce que fait :
Code:
FTPtree.loadKeyPath(responseText)
la doc de cette fonction loadKeyPath ici : http://wwwendt.de/tech/fancytree/doc...ml#loadKeyPath
puis une fois les branches adéquates chargées, je vais mettre en évidence les résultats de la requête. En fait ces résultats sont les clefs terminales de chaque ligne du tableau des chemins.
d'où le
Code:
1 2 3 4 5
|
var result_keys=[];
$.each(responseText, function( index, keypath) {
result_keys.push(keypath.split("/").pop());
}); |
qui ne garde que le dernier élément de chaque ligne pour en constituer un nouveau tableau correspondant aux résultats effectifs de la requête.
et donc à la fin de loadKeyPath, je filtre les résultats avec cette fonctionnalité, extension de fancytree :
https://github.com/mar10/fancytree/wiki/ExtFilter
en comparant les éléments du tableau des résultats avec les clefs précédemment chargées, ce que fait la fonction defferedFilterNodes
le truc c'est que si j'appelle cette fonction directement dans le .done(), seuls les éléments affichés avant l'exécution de loadKeyPath sont filtrés, donc le premier niveau d'arborescence, alors que tous les éléments sont bien chargés
Code:
1 2 3 4
|
FTPtree.loadKeyPath(responseText).done(
defferedFilterNodes(FTPtree)
); |
Si j'appelle cette fonction dans le cadre d'une IIFE, ça marche nickel et tous les résultats, toutes les branches == tous les éléments transmis sont bien filtrés et mis en évidence
Code:
1 2 3 4
|
FTPtree.loadKeyPath(responseText).done(function(){
defferedFilterNodes(FTPtree);
}); |
J'ai bien l'intuition de ce qui se passe, mais je ne sais pas me l'expliquer avec des notions réellement formelles liées à Javascript.
Quelqu'un saurait il m'expliquer ce phénomène ? aussi bête soit-il ou non ?