Chargement csv et restitution temps réel

Version imprimable

10/06/2013, 14h57
memento80

Chargement csv et restitution temps réel

Bonjour,

J'aurais souhaité une aide et/ou quelques pistes pour ma problématique suivante :

Ce sujet fait suite au sujet suivant que j'ai posté par le passé sur le sous forum "Développement Web":
http://www.developpez.net/forums/d12...ge-temps-reel/

Pour préciser, je suis débutant en javascript (voir moins :oops:) et, comme le temps n'étant pas infini, j'essaye d'optimiser l'orientation de mes recherches et d'approfondir ma connaissance de ce langage par rapport à mon problème actuel.

Pour situer le contexte de mon sujet, j'ai un site web sur lequel je souhaite restituer un "temps réel" aux utilisateurs.
Pour cela, j'ai des lignes de données stockées dans une base et disponible également sur le serveur sous la forme d'un fichier csv. Ces lignes contiennent un ensemble d'informations ainsi qu'un temps en secondes.
Chaque ligne serait à restituer en temps réel à l'utilisateur en fonction du temps entre 2 évènements.

Par exemple :
Ligne A : temps 0sec - Ligne B : temps 4sec - Ligne C : temps 10sec

Ces 3 lignes seraient restitués de la manière suivante :
Dès le déclenchement d'un minuteur par l'utilisateur, on lui affiche immédiatement la Ligne A, puis 4 sec après la Ligne B, et pour finir 6 sec après la ligne C.

L'utilisateur pourrait également accélérer la restitution de ces évènements sur la page web affiché en accélérant le déroulé du minuteur (accélération x2, x3...).

Voilà... et avec ça je suis perdu dans le méandre de mes recherches sur le web. J'ai vaguement vu en vrac : "que ce n'était pas faisable en javascript car ça ne peut pas attaquer un fichier sur un serveur", on m'a parlé quand même de la possibilité de faire ça en Ajax (j'en sais pas plus).. ou/et d'utiliser jQuery.. (n'en sachant pas plus non plus, ça en rajoute une couche à mon désarroi :cry:), etc... etc....

Si vous aviez quelques pistes/orientations sur quoi je devrais intensifier mes recherches, ça m'aiderait vraiment.

Merci d'avance.

Bonjour,

J'ai pu bien avancer sur mon problème en me dépatouillant avec des tutoriels mais il me reste quelques soucis.

J'ai réussi à lire chaque ligne de mon fichier csv et le décomposer en tableau grace à jQuery-csv.
Je récupère le premier champ de chaque ligne qui est mon minuteur pour afficher les actions à l'écran les unes après les autres (comme dans l'exemple ci-dessus). J'affiche mes actions les unes après les autres en faisant une boucle appelant une fonction "affEven" pour chaque ligne lue du csv.
Code:

1 2 3 4 5 6 7 8 $.get('../Upload/FicTest.csv', function(data){ var tabLive = $.csv.toArrays(data); // Converti le csv en tableau for (var indice = 0; indice < 9; indice++){ var minuteur = parseInt(tabLive[indice][0]); // Appel à la fonction après la durée demandée (paramètre ligne du csv) setTimeout(affEven, minuteur*1000, tabLive[indice], tabPosition, tabIdPosition); } })
Le problème, c'est que je pensais que setTimeout serait "suspensif", c'est-à-dire qu'il n'allait pas exécuter pour chaque ligne toutes les fonctions d'un coup avec le minuteur correspondant, mais qu'il allait attendre la fin de l'exécution chaque fonction avant de la relancer pour la ligne suivante.

Du coup, toutes les fonctions sont lancées en parallèle, avec certes un délai correspondant à l'attente souhaitée pour chaque ligne du csv mais, l'utilisateur ne peut pas accélérer le déroulement des évènements que je le souhaitait (x2, x3,....).

Auriez-vous des idées ?
Merci d'avance.

14/06/2013, 23h34
danielhagnoul
Bonsoir

Je ne comprends pas votre utilisation de setTimeout ?

Normalement :
Code:

1 2 3 setTimeout( function(){ // votre code }, nbMillisecondes );
15/06/2013, 12h43
memento80

Bonjour,

Oui, d'après ce que j'ai suivi comme tutoriels, on peut lancer une fonction "anonyme" comme dans votre exemple ou une "vraie" fonction comme dans le mien.

Ici, mon setTimeout lance une fonction "affEven" après avoir attendu x secondes (minuteur en sec * 1000).

tabLive[indice], tabPosition, tabIdPosition sont juste des paramètres de ma fonction.

"affEven" est ma fonction qui me permet l'affichage d'un des évènements sur la navigateur. Celle-ci marche très bien. Ce n'est pas la cause de mon soucis.
Le problème est que le setTimeOut n'est pas comme un "sleep" si je puis dire. Tous les setTimeout sont exécutés en parallèle et l'utilisateur ne peut pas accélérer le déroulement de l'affichage des évènements sur son écran.

Alors il faut écrire :

Code:

1
2
3
setTimeout( function(){
    affEven( tabLive[indice], tabPosition, tabIdPosition );
}, minuteur * 1000 );

16/06/2013, 12h04
memento80

Ok merci. En relisant le tutoriel que j'ai suivi, j'ai vu effectivement que les 2 syntaxes étaient utilisables mais que la votre aurait une meilleure compatibilité sur les anciens navigateurs.

Mais.... ça ne résout pas ma problématique... :oops:

Code:

1
2
3
4
5
6
7
8
9
10
11
function ABC(){
    // diffuse A tout de suite
 
    setTimeout( function(){
        // diffuse B 4 s après A
    }, 4000 );
 
    setTimeout( function(){
        // diffuse C 6s après B
    }, 10000 ); // 10s = 4s + 6s
}

21/06/2013, 15h11
memento80

Merci pour la contribution.

Citation:

Envoyé par memento80

Pour situer le contexte de mon sujet, j'ai un site web sur lequel je souhaite restituer un "temps réel" aux utilisateurs.
Pour cela, j'ai des lignes de données stockées dans une base et disponible également sur le serveur sous la forme d'un fichier csv. Ces lignes contiennent un ensemble d'informations ainsi qu'un temps en secondes.
Chaque ligne serait à restituer en temps réel à l'utilisateur en fonction du temps entre 2 évènements.

Par exemple :
Ligne A : temps 0sec - Ligne B : temps 4sec - Ligne C : temps 10sec

Ces 3 lignes seraient restitués de la manière suivante :
Dès le déclenchement d'un minuteur par l'utilisateur, on lui affiche immédiatement la Ligne A, puis 4 sec après la Ligne B, et pour finir 6 sec après la ligne C.

J'ai résolu mon problème en faisant un appel récursif dans ma fonction "affEven". De ce fait, la fonction "affEven" est exécutée une première fois, affiche ce que je désire et se relance avec le setTimeout souhaité... etc... etc...

Voila. Ca peut être bêtement simple des fois. :roll: