SetTimeout et inner.HTML

par **ptitgenie69** » 06 juin 2007, 12:00

je me penche dessus, merci bien

par **Sékiltoyai** » 05 juin 2007, 17:57

Bah suffit juste d'implémenter ca :

secondes = secondes + timeout/1000
si ingame alors
si secondes>=t_ingame alors
ingame = faux
secondes = 0
fsi
sinon
si secondes>=t_pause alors
ingame = true
secondes = 0
fsi
fsi
min = partie_entiere(secondes/60) // minutes à l'affichage
sec = secondes modulo 60 // secondes à l'affichage

Code : Tout sélectionner

function horloge()
{
   setTimeout("horloge();",1000);
   secondes = secondes + 1;
   lim = ingame?t_ingame:t_pause;
   if(secondes>=lim)
   {
       ingame = !ingame;
       secondes = 0;
   }
   min = Math.floor(secondes/60); // minutes à l'affichage 
   sec = secondes%60; // secondes à l'affichage
}

Tu as juste à initialiser les variables suivantes à partir de ton script php:

ingame : est on en cours de partie ou non ?
secondes : durée déjà écoulée dans la phase en cours
t_pause : durée d'une phase de pause
t_ingame : durée d'une phase de jeu

Le seul problème, c'est que le chargement de la page prend toujours un peu de temps, donc même en faisant les calculs à la toute fin du code php, et en lancant la fonction js au tout début du script js, il y a un petit intervalle, mais sinon si le pc client ne rame pas trop, la fonction s'exécutera toutes les secondes sans se décaler puisque setTimeout est appelé juste après le début de la fonction, donc on minimise la perte de temps.

Après c'est vrai que l'idéal serait un rafraichissement régulier par l'AJAX, mais même en AJAX, il y a le décalage dû au temps de réponse du serveur au client, et à l'analyse de cette réponse (ce n'est pas instantanné), mais ca reste négligeable. Après, le mieux, c'est de tester, et de voir combien de décalage maximum tu acceptes, en fonction des contraintes du jeu...

par **ptitgenie69** » 05 juin 2007, 11:15

tu as une proposition codé ?? ou un exemple ?

par **Sékiltoyai** » 05 juin 2007, 10:42

Je me disais bien...
bah sinon, rien ne t'empèche de passer au script javascript directement le temps déjà écoulé, et ensuite faire une horloge en javascript pour calculer le temps en temps réel...

par **ptitgenie69** » 05 juin 2007, 08:34

en fait, j'ai besoin de cette variable pour le calcul de départ, et la fonction time me donne le nombre de secondes depuis le 1er janvier 1970 (si j'ai bonne mémoire). Et donc, je calcul a partir de cette date car tout le monde aura la meme. Et ainsi, lorsqu'on arrivera dans la partie, a n'importe quel moment, le temps écoulé sera pareil pour tout le monde.

J'ai aussi compris que si ma fonction restait statique, c'ets tout simplement parce que la varible départ n'était pas mis a jour a chaque fois mais juste la 1ère fois, normal c'est du php !

Donc je vais quand meme devoir utiliser de l'ajax pour cela.

PS : je vous tient au courant.

par **Sékiltoyai** » 04 juin 2007, 09:37

A quoi sert ceci ?

Code : Tout sélectionner

depart = <?=time()?>;

par **ptitgenie69** » 04 juin 2007, 09:14

bon, effectivement, ce code ci fonctionne :

Code : Tout sélectionner

<?
//on regarde si une session a déjà été lancé
if(!isset($_SESSION['user_w_bad'])){
session_start();
}
?>
<script>


// définition des variables
var duree = 180;
var pause = 60;
var partie = duree + pause;
var depart = <?=time()?>;
var calcul = depart % partie;
var minutes = 0;
var secondes = 0;

function chronos(){

//calcul des variables
calcul = calcul + pause;
calcul = ((calcul - partie)*(-1));
minutes = Math.round(calcul / 60);
secondes = calcul % 60;

// vérifie si on est ingame ou en pause
	if (secondes>0){
		//INGAME
		if (secondes < 10 && secondes > 0)secondes = "0" + secondes;
		document.getElementById("play_timer").innerHTML = '';
		document.getElementById("play_timer").innerHTML = ("Ingame - " + minutes + ":" + secondes);
	}
	else
	{
	// PAUSE
	secondes = pause - (secondes * (-1));
	if (secondes < 10 && secondes > 0)secondes = "0" + secondes;
	document.getElementById("play_timer").innerHTML = '';
	document.getElementById("play_timer").innerHTML = ("Breack - " + minutes + ":" + secondes);	
	
	}
// relance la fonction
depart = <?=time()?>;
setTimeout('chronos();',500);
}
</script>

<div id="play_timer" style="position:absolute; top:100; left:100; height:200; width:200">d
<script>
chronos();
</script>
</div>

encore un petit bug entre le ingame et la pause mais bon, je vais chercher ^^.
merci encore

par **Sékiltoyai** » 03 juin 2007, 22:05

Je pense que tes problèmes viennent de là :

Relis ton code 2 secondes. Tu initialises des variables dans ta fonction, c'est à dire qu'à chaque fois que ta fonction s'exécute, les variables sont toutes remises à leur valeur initiale.

par **ptitgenie69** » 03 juin 2007, 21:16

à non non, je peut parfaitement commenter mes calculs sans problèmes. Mais je vais me pencher sur ton exemple et voir s'il me convient. Dommage que je n'ai personne qui puisse me dire pourquoi mon code ne se rafraichi pas alors qu'avec F5, cela est bon, est que le meme code en php fonctionner aussi ^^
merci encore

par **Sékiltoyai** » 03 juin 2007, 21:07

Avec ma technique, tu peux le faire sans calcul complexe. Il suffit juste dans le code PHP, de spécifier au script javascript dans quel phase de jeu il est, et depuis combien de temps il est dans cette phase.

Je pense que tes calculs sont plus empiriques qu'autre chose. Car autant personnellement, je peux démontrer mon algorithme, autant je pense que tu devrais avoir un peu de mal à moins que tu ais fait auparavant des tonnes de calculs qui t'ont donné ce résultat...

Bref, mes calculs sont corrects et parfaitement intégrables dans ce que tu veux faire, si tu ne veux pas avoir de problème, je pense que tu devrais t'en inspirer...

par **ptitgenie69** » 03 juin 2007, 19:56

je susi obligé de faire ce calcul complexe car j'ai besoin de la fonction time() de php pour avoir un point fixe et que lorsque l'on arrivera sur la partie en cour, tt le monde tombe sur la meme valeur, ce qui fonctionen deja avec ce code la. Et bien sur que je remet mes variables a zéro puisque je refais le calcul avec la valeur de time() qui change tt le temps (heuresement).

par **Sékiltoyai** » 03 juin 2007, 02:37

Relis ton code 2 secondes. Tu initialises des variables dans ta fonction, c'est à dire qu'à chaque fois que ta fonction s'exécute, les variables sont toutes remises à leur valeur initiale.
Ensuite, je trouve ton calcul très complexe, juste pour calculer un temps. Ne serait-ce pas plus simple de faire ces calculs là ?

secondes = secondes + timeout/1000
si ingame alors
si secondes>=t_ingame alors
ingame = faux
secondes = 0
fsi
sinon
si secondes>=t_pause alors
ingame = true
secondes = 0
fsi
fsi
min = partie_entiere(secondes/60) // minutes à l'affichage
sec = secondes modulo 60 // secondes à l'affichage

En faisant ces initialisations :

ingame : est on en cours de partie ou non ?
secondes : durée déjà écoulée dans la phase en cours
timeout : le timeout utilisé dans la fonction setTimeout()
t_pause : durée d'une phase de pause
t_ingame : durée d'une phase de jeu

Si tu souhaites utiliser ces indications, essaye de faire un premier jet, je te fournirais ensuite des détails pour l'implémentation.

par **ptitgenie69** » 03 juin 2007, 00:13

Bonsoir;

Il est déjà tard ..

Pfff, je cherche solution à un problème qui ne devrait pas
se poser !! Voila dabord le code :

<?
//on regarde si une session a déjà été lancé
if(!isset($_SESSION['user_w_bad'])){
session_start();
}
?>
<script>
function chronos(){

// définition des variables
var duree = 180;
var pause = 60;
var partie = duree + pause;
var depart = <?=time()?>;
var calcul = depart % partie;
var minutes = 0;
var secondes = 0;

//calcul des variables
calcul = calcul + pause;
calcul = ((calcul - partie)*(-1));
minutes = Math.round(calcul / 60);
secondes = calcul % 60;

// vérifie si on est ingame ou en pause
	if (secondes>0){
		//INGAME
		if (secondes < 10 && secondes > 0)secondes = "0" + secondes;
		document.getElementById("play_timer").innerHTML = '';
		document.getElementById("play_timer").innerHTML = ("Ingame - " + minutes + ":" + secondes);
	}
	else
	{
	// PAUSE
	secondes = pause - (secondes * (-1));
	if (secondes < 10 && secondes > 0)secondes = "0" + secondes;
	document.getElementById("play_timer").innerHTML = '';
	document.getElementById("play_timer").innerHTML = ("Breack - " + minutes + ":" + secondes);	
	
	}
// relance la fonction
setTimeout('chronos();',500);
}
</script>

<div id="play_timer" style="position:absolute; top:100; left:100; height:200; width:200">d
<script>
chronos();
</script>
</div>

Et une petite explication:
Ce code affiche un compte a rebour constant, quand il est fini, il recommence.
C'est pour aller avec un jeu online, dont les parties dures environ 3 minutes
et 1 minute de pause entre chaques.
Il fallait que je fasse en sorte que lorsque l'on arrive dans la partie n'importe quand,
chaque personne du jeu doit avoir le meme temps restant affiché. Je fais donc un calcul
avec time() pour avoir une valeur fixe.

Seulement le problème c'est que meme si le code fonctionne et affiche
quelque chose, mon div ne se rafraichi pas ^^

Alors je ne veut pas d'ajax, je veisn justement de refaire la fonction en javascript car avec l'ajax, sur IE6, le rafraichissement change le curseur de la souris tt les x secondes en un sablier, c'est très chi**t ...

Voila, j'espère avoir été clair !! huhu.

Bonne nuit a tous et si vous avez une idée ??

PS : le code est executable directement si vous souhaites le tester !

SetTimeout et inner.HTML

Répondre

Étendre la vue Revue du sujet : SetTimeout et inner.HTML

SetTimeout et inner.HTML