Discussion :

[nouby]

Bonjour, je voudrais effectuer une action JS toutes les 500 ms, sans utiliser setInterval, et j'ai une boucle d'animation pour un jeu que je voudrais faire, et dans la boucle d'animation j'ai mis ce code pour mesurer le temps passé et faire une action toutes les 500 ms.
Je me sers de console.log pour vérifier quand j'arrive à 500ms mais le log me dit que ça ne fait pas ce que je veux.

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
		// Enregistre le temps courant quand compteur=0.
		if(compteur==0){
			var Tdebut=Date.now();
			console.log("Temps de début : "+Tdebut);
			compteur=1;
		}
		// Lit le temps courant.
		var Tcourant=Date.now();
		// Calcule le temps passe entre le temps de debut Tdebut et le temps de fin Tfin.
		if (compteur==1){
			var Tpasse=Tcourant - Tdebut;
			console.log("Temps passé : "+Tpasse);
			// Affiche le temps passe seulement s'il vaut 500 millisecondes.
			if(Tpasse>=500){
				console.log("Temps passé : "+Tpasse);
				Tpasse=0;
				compteur=0;
			}
 
		}

Mon log :

Temps de début : 1684344910961
index.js:306 Temps passé : 0
1298index.js:306 Temps passé : NaN

[mathieu]

vous utilisez "window.requestAnimationFrame" ?

si le code que vous montrez est dans une fonction, alors la variable "Tdebut" a une portée limitée a cette fonction et est donc supprimée à la sortir de cette fonction.
pour garder la valeur du début vous pouvez faire comme cela :

Code javascript :

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
27
28
29
30
31
32
33
let compteur = 0;
let Tdebut;
 
function traitement_boucle()
{
 
	// Enregistre le temps courant quand compteur=0.
	if (compteur == 0){
		Tdebut = Date.now();
		console.log("Temps de début : "+Tdebut);
		compteur = 1;
	}
 
	// Lit le temps courant.
	var Tcourant = Date.now();
 
	// Calcule le temps passe entre le temps de debut Tdebut et le temps de fin Tfin.
	var Tpasse = Tcourant - Tdebut;
	console.log("Temps passé : "+Tpasse);
 
	// Affiche le temps passe seulement s'il vaut 500 millisecondes.
	if (Tpasse >= 500) {
		console.log("Tpasse >= 500");
		compteur=0;
	} else {
		window.requestAnimationFrame(traitement_boucle);
	}
 
 
}
 
 
window.requestAnimationFrame(traitement_boucle);

j'ai retiré le test "if (compteur == 1)" puisque le test est toujours vrai à cet endroit

[nouby]

La boucle d'animation où se trouve ce code, est une fonction anime() lancée toutes les 10 ms par un setInterval.

Merci pour ton aide !

En fait tu me proposes d'utiliser une variable globale pour Tdébut, je vais essayer pour voir
Mais ce qui m'étonne c'est que T début et Tfin étant mesurés dans la meme boucle d'animation, je comprend pas comment Tdebut peut se vider ou ne pas etre reconnu par le calcul de Tpassé.

J'essaie puis je donnerais des nouvelles


EDIT : SUPER !!!!

ça marche en effet, en mettant Tdébut en variable globale, j'en ai profité pour mettre aussi en global Tfin et Tpasse.

Mon log :

Temps de début : 1684358246439
index.js:313 Temps passé : 520
index.js:302 Temps de début : 1684358246999
index.js:313 Temps passé : 519
index.js:302 Temps de début : 1684358247559
index.js:313 Temps passé : 520
index.js:302 Temps de début : 1684358248119
index.js:313 Temps passé : 520
index.js:302 Temps de début : 1684358248679
index.js:313 Temps passé : 520
index.js:302 Temps de début : 1684358249239
index.js:313 Temps passé : 519
index.js:302 Temps de début : 1684358249799
index.js:313 Temps passé : 520
index.js:302 Temps de début : 1684358250360
index.js:313 Temps passé : 519
index.js:302 Temps de début : 1684358250919
index.js:313 Temps passé : 520
ETC......

Mon code :

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
function anime(){
 
		// Enregistre le temps courant quand compteur=0.
		if(compteur==0){
			Tdebut=Date.now();
			console.log("Temps de début : "+Tdebut);
			compteur=1;
		}
		// Lit le temps courant.
		var Tcourant=Date.now();
 
		// Calcule le temps passe entre le temps de debut Tdebut et le temps de fin Tfin.
		var Tpasse=Tcourant - Tdebut;
 
		// Affiche le temps passe seulement s'il vaut 500 millisecondes.
		if(Tpasse>=500){
			console.log("Temps passé : "+Tpasse);
			Tpasse=0;
			compteur=0;
		}
}

Merci je suis super content, tu m'as bien fait avancer là

[NoSmoking]

Bonjour,
bizarre, vous avez dit bizarre ?

D'un côté on a :

je voudrais effectuer une action JS toutes les 500 ms, sans utiliser setInterval,

et de l'autre :

La boucle d'animation où se trouve ce code, est une fonction anime() lancée toutes les 10 ms par un setInterval.

En matière d'animation vous devriez utiliser window.requestAnimationFrame comme le préconise mathieu.

A noter également qu'il existe la méthode performance.now() peut-être plus judicieuse que Date.now()

[nouby]

Oui, en fait il s'agissait d'une boucle d'animation qui déplace une image horizontalement, et faite par setInterval(anime(),15);
Mais dans la fonction anime() il y a une action à faire toutes les 450 ms, c'est de changer l'image à déplacer
ça marche très bien tel qu'il est actuellement, mon seul problème c'est que j'arrive pas à effectuer un rapetissement progressif de l'image au fur et à mesure qu'elle se rapproche du centre de l'écran, sachant qu'elle démarre son déplacement en bas à gauche de l'écran, et doit se diriger vers le centre horizontal et vertical, tout en réduisant sa taille dans un rapport normal (pas d'écrasement visuel de sa hauteur ni sa largeur, et quand l'image est réduite à une trés petite taille je la fais disparaitre en effaçant l'écran et je recommence l'anim à son début.
Mais je vais faire un post à part puisque celui-ci est résolu