[javaxcript / PHP] Temps

kript -  
Bonjours à tous, j'ai un gros problème pour finir mon site web, je souhaite réaliser un décompte comme dans le jeux "ogame" lors de la construction des batiments et recherches.
A savoir :
lors du clique sur "construction", mise dans la base de doné du temps en seconde ... plus aucun lien n'est actif pr les autre structure, le lien construction est remplacé par le temps récupéré de la bd rafraichi a la seconde au format ( x jours, 00:00:00 ) et le lien annuler qui supprime le temps de la base de donné sql ce qui raffiche les lien initial a savoir construction, sa va bientot faire plus d'un moi que je me prend la tete alors si quelqu'un a une idée sa serai vraiment sympa. Je suis ouvert à toute proposition et toute variante convenant.

Merci d'avance sa me soulagerait d'un poid !!
@ +

25 réponses

Résumé de la discussion

Le sujet porte sur la réalisation d'un décompte type Ogame pour la construction et les recherches, avec enregistrement du temps en secondes dans la base et gel des liens tant que le compte reste actif. Plusieurs réponses proposent des solutions mixtes entre JavaScript et PHP pour afficher dynamiquement le décompte, convertir la durée en heures, minutes et secondes et stocker le tout en base via une requête MySQL. Des approches techniques évoquées incluent des fonctions de conversion en format HH:MM:SS, l'utilisation de sessions PHP ou de chronomètres JavaScript alimentant des images pour les chiffres. D'autres échanges suggèrent d'afficher les liens lorsque le décompte atteint zéro ou d'actualiser la page sans perte de l'état, afin d'offrir une expérience utilisateur fluide.

Bobot (l’IA à votre service)
  1. PhP
    Bjr

    Ha là tu exagères qd même un petit peu non ?
    C'est de l'arithmétique élémentaire ! LOL

    Bon alors voici quelques explications sur le fct toHMS()

    Elle convertit une durée exprimée en secondes en Heures - Minutes -Secondes (format HH:MM:SS) et stocke le resultat dans un tableau "temps" quelle retourne à la fin.

    duree : contient un nombre en secondes représentant une durée
    pour 2 heures alors duree vaut 7200 (3600 sec x 2)

    temps[0] = Chiffre des dizaines pour les heures (entre 0 et 9)
    temps[1] = Chiffre des unités pour les heures (entre 0 et 9)
    temps[2] = Chiffre des dizaines pour les minutes (entre 0 et 5)
    temps[3] = Chiffre des unités pour les minutes (entre 0 et 9)
    temps[4] = Chiffre des dizaines pour les secondes (entre 0 et 5)
    temps[5] = Chiffre des unités pour les secondes (entre 0 et 9)

    Math.floor(x) : retourne la partie entière de la variable x
    Si x vaut 1.6 alors Math.floor(x) = 1
    Si x vaut 0.1 alors Math.floor(x) = 0

    Et voici la version qui intègre les jours :

    function toHMS(duree)
    {
    var temps = new Array();

    var jj = Math.floor(duree/(3600*24)); // 24h par jour
    var hh = Math.floor((duree/3600); // 3600 sec /heure
    var mm = Math.floor((duree-hh*3600)/60); // 60 sec /min
    var ss = duree-hh*3600-mm*60;

    temps[0]=Math.floor(hh/10);
    temps[1]=hh-temps[0]*10;
    temps[2]=Math.floor(mm/10);
    temps[3]=mm-temps[2]*10;
    temps[4]=Math.floor(ss/10);
    temps[5]=ss-temps[4]*10;

    return temps;
    }
    3
    1. Makari
      j'ai trouvé ce script qui m'a l'air plus simple, tel qu'il est la j'arrive a avoir mes diffenrents temps qui s'affichent correctement mais seul le dernier affiché est dynamique, les precedent le temps s'affiche mais est immobile.

      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
      <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
      <head>
      <title>Créer un compte à rebours</title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <meta http-equiv="Content-Language" content="fr" />
      </head>

      <body>

      <script language="JavaScript">

      function t()
      {
      var compteur=document.getElementById('compteur');
      s=duree;
      m=0;h=0;
      if(s<0)
      {
      compteur.innerHTML="arrivé<br />"+"<a href=http://lien1.fr>continuer</a>"
      }
      else
      {
      if(s>59)
      {
      m=Math.floor(s/60);
      s=s-m*60
      }
      if(m>59)
      {
      h=Math.floor(m/60);
      m=m-h*60
      }
      if(s<10)
      {
      s="0"+s
      }
      if(m<10)
      {
      m="0"+m
      }

      compteur.innerHTML=h+"h"+m+"m"+s//+"<br /><a href=http://lien2.fr>interrompre</a>"
      }
      duree=duree-1;
      window.setTimeout("t();",999);

      }

      </script>
      <div id="compteur"></div>
      <script language="JavaScript">
      duree="<?php echo $timestampF;?>";

      t();
      </script>
      </body>
      </html>
      0
      1. Makari
        compteur.php c'est ce script, celui dont on parle lol

        mais le truc qui pose probleme c'est le fait que j'appelle ce fichier, ce script, je sais pas comment ca s'appelle, 'fin bref l'ensemble du fichier JS des compteurs, je l'appelle plusieurs fois, a chaque tour de boucle de ma requete sql.

        du coup, il me cré a chaque fois un ensemble de compteurs, et ce que je cherche c'est simplement un affichage dynamique d'un temps, et .. euh bon j'arrive pas a trouver les mots pour bien m'expliquer et je commence a avoir sacrement mal au crane :/ mais en gros ce que je cherche c'est ca :

        boucle{
        //affichage d'un compteur dynamique selon la valeur de $tpstmp

        $tptms=ligne[tps] // en gros le tps de l'enregistrement de la base de donnée
        include("script machin truc dont on cause.php");

        }

        et que du coup ca affiche le compteur dynamique.
        Je cherche d'autres scripts ailleurs mais a chaque fois je n'arrive pas a avoir les differents compteurs qui tournent en meme temps (j'ai bien sur essayé de modifier des trucs, mais la plupart du code c'est du chinois pour moi)

        je continue mes tests, je reposterai si j'arrive a quelque chose
        0
        1. PhP
          j'ignore ce que contient ton fichier compteur2.php alors ...

          Sinon pour

          for (var i=0; i<5; i++)
          {
          compteurs.add("compteur_"+i,(i+1)*3);
          }
          compteurs.init();

          tu noteras que j'ai défini 2 classes d'objet : CountDown qui gère un compteur et CountDownManager qui gère une liste de compteurs.

          Pourquoi ? Pour éviter de lancer un timer via setInterval séparé pour chaque compteur. A la place j'en utilise un seul qui est utilisé par CountDownManager pour l'ensemble des compteurs qu'il gère. Il faut bien voir que si tu lances trop de timers tu risques de planter le navigateur. grrrr

          compteurs est donc de type CountDownManager

          compteurs.add créé en fait un nouveau compteur de type CountDown et l'ajoute à la liste des compteurs que CountDownManager possède en interne : cette liste est une propriété de CountDownManager elle se nomme items.
          Tu noteras que items n'est ni plus ni moins qu'un objet prédifini Javascript de type Array ... c'est à dire un tableau !

          CountDownManager.prototype.add=function(id,duration)
          {
          var item = new CountDown(id,duration);
          item.index = this.items.length;
          item.parent = this;
          this.items[this.items.length]=item;
          return item;
          }

          var item = new CountDown(id,duration);
          Créé un nouveau compteur avec l'id du div et la durée passée en paramètre à la fct add() et le stocke dans une variable locale nommée item (note qu'ici je n'utilise pas this.item mais item tout court c'est une variable locale à la fct et temporaire mais elle ne fait pas partie des propriétés de l'objet CoutDownManager)

          CountDownManager ne se sert pas lui même de ces paramètres c'est pourquoi ils ne sont pas conservés après l'appel de la fct

          Note que la création se passe exactement comme je te l'ai dit ds mon post précédent ;-)

          item.index = this.items.length;
          bon ok ici je triche un peu : j'ajoute une nouvelle propriété dans l'objet item (alors que je ne l'ai pas explicitement déclarée dans la classe CountDown ! Ben oui Javascript autorise ce genre de fantaisie)
          l'index ici correspond simplement à la position de l'objet item dans le tableau items

          item.parent = this;
          j'associe le parent (en fait l'objet CountDownManager) au compteur. dans mon ex this = l'objet référencé dans la variable compteurs

          this.items[this.items.length]=item;
          Ajoute le nouveau compteur item dans le tableau items
          this.items.length retourne la taille du tableau donc la premère fois comme
          this.items.length vaut 0 (en effet par défaut le tableau items est vide donc sa taille est à zéro logique non ?)
          c'est comme si on écrivait this.items[0] = item, la fois suivante this.items[1] = item et ainsi de suite
          Note la taille du tableau est automatiquement gérée par Javascript : en fait un tableau est un objet en JS qui stocke sa taille en interne malin :-)

          return item;
          retourne l'objet de type CountDown qui vient d'être ajouté au cas où on en aurait besoin: pas utilisé ici

          Si tu regardes attentivement les autres méthodes de CountDownManager tu noteras qu'il se contente d'appeller les méthodes des objets CountDown contenus dans sa liste dans des boucles for

          Enfin la boucle for (var i=0; i<5; i++) c'est juste parce que je sais que dans ma page j'ai 5 compteurs compteur_0 à compteur_4 mais bien sûr ce n'est pas obligatoire.
          De plus j'en profite pour initailiser une durée différence pour chaque compteur : en fait un multiple de 3. c'est purement arbitraire.

          Enfin c'est la fonction compteurs.init() qui elle créé vraiment les compteurs HTML et les affiche
          0
          2. Makari
            j'ai essayé d'analyser comme j'ai pu le code, et a ce que je comprends, les compteurs se créer avec ca :

            for (var i=0; i<5; i++)
            {
            compteurs.add("compteur_"+i,(i+1)*3);
            }
            compteurs.init();

            pour l'affichage, ca n'a pas l'air compliqué, mais bon, pour le moment j'essaye juste d'y adapter mon code.
            j'ai tester avec deux enregistrement, la strucuture ressemble a ca :

            $pipo=0;
            while ($ligne = mysql_fetch_array($Tps))
            {
            $TPScompteur[$pipo]=$ligne['Tps'];
            include("compteur2.php");
            $pipo++;
            }

            et j'ai modifier la partie citée en haut (avec le for) dans compteur.php, ce qui donne :

            compteurs.add("compteur_<?php echo $pipo; ?>",<?php echo $TPScompteur[$pipo]; ?>);
            compteurs.init();

            mais ca marche pas du tout :p
            je pense que c'est parceque le fichier compteur2.php ne doit etre appelé qu'une sele fois, mais je n'en suis pas sur, le probleme c'est que dans ma boucle while, il y'a tout un tas de traitement, donc je ne peux pas vraiment remplir le tableau des temps, et faire l'appel pour le tableau en entier d'un coup :/
            enfin, deja j'aimerai savoir si mon probleme est bien a cause d'un appel multiple au fichier compteur2.php ou non, si c'est le cas, peut etre que je pourrais me débrouiller, sinon bah retour case départ ^^

            merci pour l'aide au fait ;)
            0
            1. PhP
              hé j'ai jamais dit que mon code correspondrait exactement à ce que tu recherches ... sache que c'est quasiment impossible de trouver un script qui fasse exactement ce que tu veux sur le net par contre ça peut t'orienter, te donner la marche à suivre ...

              T'as pas besoin de pause et ben tu l'utilises pas LOL Par contre lorsque tu charges ta page il faut bien que tu initialises chaque compteur avant de lancer les décomptes non ?

              Mon ex : Comment Ca Marche lol

              La classe CountDown sert à gérer chaque compteur individuellement

              Chaque compteur possède les propriétés suivantes :
              this.duration : la durée du compteur
              this.timeLeft : le temps restant
              this.id : l'id du tag div dans lequel est placé le compteur
              this.state : l'état du compteur - démarré/arrêté/en pause etc
              this.parent : le gestionnaire de compteur de type CountDownManager (en fait CountDownManager gère simplement une liste d'objet CountDown)

              Oui mais c'est quoi this ?

              C'est tout ce qui fait le puissance de la prog objet : this est une référence vers l'objet actuel
              Si j'écris
              var cpt1 = new CountDown("div_cpt1",100);
              var cpt2 = new CountDown("div_cpt2",200);
              la fonction 
              function CountDown(id,duration)
{
	this.duration = duration;
	this.startTime = 0;
	this.id = id;
	this.timeLeft = this.duration;
	this.state = CountDown.States.READY;
}


              est appelée 2 fois de suite pour initialiser 2 objets. Note que c'est l'opérateur new qui fait toute la différence. ici on n'appelle pas simplement la fonction CountDown() on instancie d'abord un nouvel objet qui est implicitement passé comme paramètre à la fonction CountDown et ce paramètre "automatique" s'appelle this
              this est différent à chaque fois du fait de l'utilisation de l'opérateur new : on a bien 2 objets distincts
              Et que stockes-t-on dans cpt1 et cpt2 à ton avis ? hé bien la valeur de this tout simplement car il ne faut surtout pas la perdre ...

              Ensuite lorsqu'on appelle une méthode par ex display()
              cpt1.display() dans la méthode display() this contient la valeur stockée dans cpt1
              de même
              cpt2.display() dans la méthode display() this contient la valeur stockée dans cpt2

              on ne risque donc pas de mélanger les variables.

              Pour chaque compteur on doit créer un nouvel objet de type CountDown, tout comme pour créer un nouveau tableau en JS tu écrirais mon_tableau=new Array(); ou encore en php $mon_tableau=array();
              Ex
              var mon_compteur = new CountDown(...);

              Lors de la création je passe également 2 paramètres :
              - le premier id correspond à l'id d'un tag <div> qui va contenir le compteur
              - le second la durée du compteur que je nomme duration

              Par ex dans ma page html j'ai un div => <grasdiv></gras>
              alors je peux créer un compteur de 5 minutes par ex ainsi
              var mon_compteur = new CountDown("var mon_compteur",300);

              Cette instruction ne fait rien que de créer le compteur en mémoire : elle ne l'affiche pas et ne le lance pas !
              En effet tu peux remarquer que le div est vide ....

              Pour que le compteur apparaisse il faut d'abord le créer dans la page c'est-à-dire mettre quelque chose dans la balise div : c'est le rôle de la méthode build() (une méthode est une fonction comme les autres sauf qu'elle s'applique à un objet)

              Comme tu peux le voir elle modifie le contenu de la balise div en manipulant sa propriété innerHTML
              Bien sûr tu peux aussi initialiser directement tes div dans la page HTML mais c'est plus fastidieux et source d'erreur car il faut penser à donner un id spécifique à l'intérieur de chaque div

              Au final lorsque tu appelles build() c'est comme si tu écrivais :
              <div id="conteneur_du_compteur"><img id="conteneur_du_compteur_0" src="c0.gif">.....</div>

              Note comment les id sont associés : c'est très important !

              La méthode
              0
              1. Makari
                j'avoue avoir un peu de mal a tout comprendre :p
                j'ai copié le code et essayé de le faire marcher/comprendre mais c'est pas encore ca ^^

                deja je pense qu'il y'a moyen de l'alleger pas mal, et je suis pas sur qu'il remplisse une certaine fonction (peut etre ma faute si je me suis mal expliqué :( )

                en fait. euh.. j'ai une base de donnée. il y'a X enregistrement de temps.
                je faire une requete sql pour les sortir et les traiter ds ma page php.
                donc, en boucle de type

                while ($ligne = mysql_fetch_array($Tps))
                {
                $TPScompteur=$ligne['Tps'];
                include("compteur1/2.php");
                }

                le compteur doit juste affiché le temps restant dynamiquement, je n'ai pas besoin de bouton start, pause ou reset.
                et je ne sais pas combien de tableau je devrai afficher (ca peut etre un seul et ca peut etre trente cinq ^^)

                voila, si quelqu'un se dit " trop facile, quel noob ce noob" bin je veux bien qu'il me dise quoi faire :p
                en attendant je vais essayer de fouiller un peu la dedans pour voir si je peux bidouiller un peu ;)
                0
                1. PhP
                  Bjr

                  un ex de compteur multiple mais sans gestion de reprise en cas de rafraîchissement de la page (pas de sauvegarde du contexte T'Oh ! )

                  Comme tu peux le constater le code a sérieusement été revu pour intégrer des objets Javascript le seul moyen de faire les choses proprement :

                  countdown2.htm (à copier dans le répertoire où se trouvent déjà les images) 

                  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" dir="ltr" lang="en">
<head>
<title>Game</title>
<style>

body
{
font-size:10pt;
font-family:Arial;
}

div img
{
padding:0px;
margin:0px;
display:inline;
border-width:0px;
}

</style>
<script type="text/javascript">
<!--
function toHMS(duree)
{
	var temps = new Array();
	
	var hh = Math.floor(duree/3600);
	var mm = Math.floor((duree-hh*3600)/60);
	var ss = duree-hh*3600-mm*60;

	temps[0]=Math.floor(hh/10);
	temps[1]=hh-temps[0]*10;
	temps[2]=Math.floor(mm/10);
	temps[3]=mm-temps[2]*10;
	temps[4]=Math.floor(ss/10);
	temps[5]=ss-temps[4]*10;
	return temps;
}

function CountDown(id,duration)
{
	this.duration = duration;
	this.startTime = 0;
	this.id = id;
	this.timeLeft = this.duration;
	this.state = CountDown.States.READY;
}

CountDown.States = {
	STARTED : 1,
	PAUSED : 2,
	READY : 3,
	TERMINATED : 4
}	

CountDown.prototype.build=function()
{
	var html = "";
	html +="<img id=\""+this.id+"_0\" src=\"c0.gif\">";
	html +="<img id=\""+this.id+"_1\" src=\"c0.gif\">";
	html +="<img src=\"colon.gif\">";
	html +="<img id=\""+this.id+"_2\" src=\"c0.gif\">";
	html +="<img id=\""+this.id+"_3\" src=\"c0.gif\">";	
	html +="<img src=\"colon.gif\">";
	html +="<img id=\""+this.id+"_4\" src=\"c0.gif\">";
	html +="<img id=\""+this.id+"_5\" src=\"c0.gif\">";	
	var elt=document.getElementById(this.id).innerHTML = html;
}

CountDown.prototype.display=function()
{
	var seq = toHMS(this.timeLeft);
	for (var i=0; i < 6; i++)
	{
		document.getElementById(this.id+"_"+i).src="c"+seq[i]+".gif";
	}
}

CountDown.prototype.refresh=function()
{
	if (this.state != CountDown.States.STARTED) return;
	
	if (this.timeLeft)
	{
		this.timeLeft--;	
	}
	this.display();
	if (!this.timeLeft)
	{
		this.state = CountDown.States.TERMINATED;
		this.parent.doTimeOut(this.id);
	}	
}

CountDown.prototype.start=function()
{
	if ((this.state != CountDown.States.PAUSED) && (this.state != CountDown.States.STARTED))
	{
		this.timeLeft=this.duration;
	}	
	this.state = CountDown.States.STARTED;
	this.display();
}

CountDown.prototype.reset=function()
{
	this.timeLeft = this.duration;
	this.state = CountDown.States.READY;
	this.display();	
}

CountDown.prototype.pause=function()
{
	this.state = CountDown.States.PAUSED;
}

function CountDownManager()
{
	this.items = new Array();
}

CountDownManager.prototype.add=function(id,duration)
{
	var item = new CountDown(id,duration);
	item.index = this.items.length;
	item.parent = this;
	this.items[this.items.length]=item;
	return item;
}

CountDownManager.prototype.doTimeOut=function(id)
{
	if (typeof(this.onTimeOut)=="function") this.onTimeOut(id);
}

CountDownManager.prototype.init=function()
{
	for (var i=0; i < this.items.length; i++)
	{
		this.items[i].build();
		this.items[i].display();
	}
}

CountDownManager.prototype.refresh=function()
{
	for (var i=0; i < this.items.length; i++)
	{
		this.items[i].refresh();
	}
}

CountDownManager.prototype.start=function()
{
	for (var i=0; i < this.items.length; i++)
	{
		this.items[i].start();
	}
}

CountDownManager.prototype.pause=function()
{
	for (var i=0; i < this.items.length; i++)
	{
		this.items[i].pause();
	}
}

CountDownManager.prototype.reset=function()
{
	for (var i=0; i < this.items.length; i++)
	{
		this.items[i].reset();
	}
}

function decompte()
{
	compteurs.refresh();
}

var compteurs = new CountDownManager();

// Fonction appelée lorsqu'un compteur arrive à zéro
compteurs.onTimeOut = function(id)
{
	var elt=document.getElementById("resultat");
	elt.innerHTML+="<p>Le compteur "+id+" est arrivé à zéro !</p>";
}

function load()
{

	for (var i=0; i<4; i++)
	{
		compteurs.add("compteur_"+i,(i+1)*3);
	}	
	compteurs.init();
    window.setInterval("decompte()",1000);
}

// -->
</script>
</head>
<body onload="load()">
Exemple de comptes à rebours multiples<br /><br />
<table border="1">
<tr>
	<td>Compteur 0</td><td><div id="compteur_0"></div></td>
	<td><input type="button" onclick="compteurs.items[0].start()" value="Start"></td>
	<td><input type="button" onclick="compteurs.items[0].pause()" value="Pause"></td>
	<td><input type="button" onclick="compteurs.items[0].reset()" value="Reset"></td>
</tr>
<tr>
	<td>Compteur 1</td><td><div id="compteur_1"></div></td>
	<td><input type="button" onclick="compteurs.items[1].start()" value="Start"></td>
	<td><input type="button" onclick="compteurs.items[1].pause()" value="Pause"></td>
	<td><input type="button" onclick="compteurs.items[1].reset()" value="Reset"></td>
</tr>
<tr>
	<td>Compteur 2</td><td><div id="compteur_2"></div></td>
	<td><input type="button" onclick="compteurs.items[2].start()" value="Start"></td>
	<td><input type="button" onclick="compteurs.items[2].pause()" value="Pause"></td>
	<td><input type="button" onclick="compteurs.items[2].reset()" value="Reset"></td>
</tr>
<tr>
	<td>Compteur 3</td><td><div id="compteur_3"></div></td>
	<td><input type="button" onclick="compteurs.items[3].start()" value="Start"></td>
	<td><input type="button" onclick="compteurs.items[3].pause()" value="Pause"></td>
	<td><input type="button" onclick="compteurs.items[3].reset()" value="Reset"></td>
</tr>
<tr>
	<td colspan="2">Tous les compteurs</td>
	<td><input type="button" onclick="compteurs.start()" value="Start"></td>
	<td><input type="button" onclick="compteurs.pause()" value="Pause"></td>
	<td><input type="button" onclick="compteurs.reset()" value="Reset"></td>
</tr>
</table>
<div id="resultat"></div>
</html>
                  --

                  PhP  
                  Il y a 10 types de personnes dans le monde : ceux qui comprennent le binaire et les autres ...
                  0
                  1. Makari
                    pour precisermon probleme, je fais une boucle qui sort des enregistrement, a chaque tour je voudrais que ca m'affiche un compteur correspondant, j'ai essayé de mettre la variable "restant" (qui contient le nombre de secondes a afficher en H/MS) en tableau, mais quand ca passe dans la parite JS, ca plante (peut etre que ma syntaxe etait mauvaise) j'avais essayé un truc de ce type :

                    $restant[$boucle]=$tpsTMP;
                    include("countdown.php)

                    et en remplacant toute les anciennes variables $restant par $restant[$boucle]
                    et les variables 'restant' JS par 'restant[<?php echo $boucle; ?>]'

                    je ne connais pas les tableau en JS, donc ptetre que je me suis planté la, mais ptetre que ca peut pas fonctionner tout court de cette maniere :/

                    j'ai besoin d'aide :p
                    0
                    1. Makari
                      bin le temps affiché au compteur vient d'une base de donnée, mais je sais pas si ca suffit .. (suis quelque peu débutant ^^)
                      0
                      1. PhP
                        Bsr

                        C'est possible de gèrer plusieurs compteurs indépendants mais dans ce cas l'utilisateur ne doit surtout pas recharger la page où alors tu dois utiliser AJAX pour sauvegarder le contexte en PHP dans une session ou une base de données
                        0
                        1. Makari
                          bonjour,

                          je cherchais également ce genre de compteur, et ca marche ;)
                          mais j'aurai voulu savoir comment faire pour l'utiliser plusieurs fois dans la meme page

                          en fait, je l'utilise pour un jeu, ou il montre le temps qu'il reste pour qu'une unité soit produite, mais je voudrai que toutes les unités en production aient leur compteur, or, la ca marche pas, le dernier compteur prenant la valeur des variables precedentes, au final je me retrouve avec que des compteur affaichant 0 et un seul affichant un temps normal.
                          0
                          1. PhP
                            Ops j'ai validé trop vite !

                            Tu oublies ma réponse précédente !

                            A la place il fallait lire :

                            Et voici la version qui intègre les jours : 

                            function toHMS(duree)
{
   	var temps = new Array();
	var jour = 3600*24; // Durée d'un jour en secondes 

	var jj = Math.floor(duree/jour);  	
        var hh = Math.floor((duree-jj*jour)/3600);	
	var mm = Math.floor((duree-jj*jour-hh*3600)/60);
	var ss = duree-jj*jour-hh*3600-mm*60;

	
	temps.push(Math.floor(jj/10));
	temps.push(jj-Math.floor(jj/10)*10);
	temps.push(Math.floor(hh/10));
	temps.push(hh-Math.floor(hh/10)*10);
	temps.push(Math.floor(mm/10));
	temps.push(mm-Math.floor(mm/10)*10);
	temps.push(Math.floor(ss/10));
	temps.push(ss-Math.floor(ss/10)*10);

	temps.reverse();
	return temps;
}


                            Il faut remplacer le code pour les images ainsi : 
                            <div>
<img id="seq_7" src="c0.gif"><img id="seq_6" src="c0.gif">
<img id="seq_5" src="c0.gif"><img id="seq_4" src="c0.gif"><img src="colon.gif"><img id="seq_3" src="c0.gif"><img id="seq_2" src="c0.gif"><img src="colon.gif"><img id="seq_1" src="c0.gif"><img id="seq_0" src="c0.gif">
</div>


                            temps.push(elt) : ajoute elt à la fin du tableau

                            temps.reverse() : inverse tous les éléments du tableau

                            si array = new Array("A","B","C") alors après array.reverse() array contient ("C","B","A")

                            Donc maintenant :

                            temps[0] = Chiffre des unités pour les secondes (entre 0 et 9)
                            temps[1] = Chiffre des dizainespour les secondes (entre 0 et 5)
                            temps[2] = Chiffre des unités pour les minutes (entre 0 et 9)
                            temps[3] = Chiffre des dizaines pour les minutes (entre 0 et 5)
                            temps[4] = Chiffre des unités pour les heures (entre 0 et 9)
                            temps[5] = Chiffre des dizaines pour les heures (entre 0 et 2)
                            temps[6] = Chiffre des unités pour les jours (entre 0 et 9)
                            temps[7] = Chiffre des dizaines pour les jours (entre 0 et 9)

                            Pourquoi un tel changement ?
                            Tout simplement pour simplifier les évolutions : si par ex tu souhaites afficher les jours non plus sur 2 chiffres mais sur trois à l'avenir

                            Test avec 86410 comme durée initiale ...
                            0
                            1. Kript
                              Merci beaucoup, et désolé mais moi mon truc c'est le php, le javascript je vien de m'y mettre donc j'ai un peu du mal. Merci
                              0
                              1. Kript
                                Bonjours, alors merci pour le compteur, il marche très bien !!, j'aimerai cependant rajouter des digite pour le nombre de jours et je ne comprend pas ce code donc si quelqu'un pouvait m'aider sa serait cool merci d'avance 

                                <script type="text/javascript">
<!--

function toHMS(duree)
{
	var temps = new Array();
	
	var hh = Math.floor(duree/3600);
	var mm = Math.floor((duree-hh*3600)/60);
	var ss = duree-hh*3600-mm*60;

	
	temps[0]=Math.floor(hh/10);
	temps[1]=hh-temps[0]*10;
	temps[2]=Math.floor(mm/10);
	temps[3]=mm-temps[2]*10;
	temps[4]=Math.floor(ss/10);
	temps[5]=ss-temps[4]*10;
	
	return temps;
}
function decompte()
{
	var seq = toHMS(restant);
	for (var i=0; i < 6; i++)
	{
		document.getElementById("seq_"+i).src="c"+seq[i]+".gif";
	}

	if (restant)
	{
		restant--;
		window.setTimeout("decompte()",1000);
	}
	else
	{
		document.print('<META http-equiv="refresh" content="1; URL=infrastruture.php">')
	}	
}
</script>
                                1
                                2. Kript
                                  Ton dernier sscript ce rapproche de ce que je veu si tu pouvai m'envoyer les image du compteur et le script sa serait cool, mon MSN est geotinc@hotmail.com.
                                  Encore merci
                                  1
                                  1. PhP
                                    Bsr

                                    un truc moin bête qu'il n'y parait en utilisant Javascript + PHP et les sessions

                                    http://www.nobodysperfect.freesurf.fr/countdown/countdown.php

                                    Tu peux remplacer les sessions par un appel à la base MySQL : à toi d'adapter ...
                                    1
                                    1. Split044
                                      Salut :)

                                      Est ce possible de recevoir le script de ton décompte de temps?

                                      voici mon adresse msn : thesplit44@msn.com

                                      Merci d'avance
                                      0
                                  2. js
                                    Avec javascript ce qu'on pourrait faire, c'est utiliser 2 frames (cadres). Sur l'une le countdown qui continuerait jusqu'à ce qu'on lui demande de s'arrêter, sur l'autre tout le reste pourrait être actualisé sans affecter le décompte du temps. J'ai déjà fait cela en javascript ( parent.xxx pour communiquer entre frames) mais je ne sais pas comment on fait cette communication en PHP.
                                    1
                                    1. Kript
                                      Oui cela me conviendrai en plus l'aspect est jolie seul problème quand on actualise la page le compteur se remet a 0 !! :(
                                      Mais sinon l'aspect et le principe me convient.
                                      1
                                      • 1
                                      • 2

                                      Discussions similaires

                                      Durée du sablier Snapchat
                                      Snapeeejdvjz

                                      7 réponses
                                      Temps d’écran « ignorer la limite »
                                      karnameismy

                                      16 réponses
                                      Les meilleurs amis snapchat changent en combien de temps?
                                      jhuifcehrg

                                      5 réponses
                                      Je tiens combien de temps avec 2Go d'internet ?
                                      champi100

                                      7 réponses
                                      Délai de validation sur Leboncoin
                                      Ddaavviid

                                      1 réponse