[Résolue]2 timer javascriot sur la même page

Eléphant du PHP | 69 Messages

15 mars 2012, 20:02

bonjour,

j'ai un petit problème avec les timers javascript.
Je suis parfaitement capable de faire un timer javascript sur ma page.
le problème est quand que j'ajoute un 2iemme timer.
Le premier ne fonctionne plus :( !! c'est probablement due aux valeur par défaut des timers qui rentre en conflit.

s'ils sont séparer Mes 2 timer fonctionne avec l'heure du Server (PHP) mon Horloge fonctionne a 100%, mais mon countdown, quand je lui donne la variable php il arrete de faire -1 a chaque seconde :S

Je donne 10$ via PAYPAL a celui qui voudrais bien me refaire le code Javascript complet pour que mes 2 timers fonctionne correctement ensemble avec lheure du serveur !!

Voici mes timers, j'ai un Horloge et un Countdown :
	var currenttime2 = '<? print date("F d, Y H:i:s", time())?>'
	var serverdate2=new Date(currenttime2)

	function padlength(what){
	var output2=(what.toString().length==1)? "0"+what : what
	return output2
	}

	function displaytime2(){
	serverdate2.setSeconds(serverdate2.getSeconds()+1)
	var timestring2=padlength(serverdate2.getHours())+":"+padlength(serverdate2.getMinutes())+":"+padlength(serverdate2.getSeconds())
	document.getElementById("servertime").innerHTML=timestring2
	}

	window.onload=function(){
	setInterval("displaytime2()", 1000)
	}
dateFuture1 = new Date(<? echo $date[2]; ?>,<? echo $months; ?>,<? echo $date[1]; ?>,<? echo $time[0]; ?>,<? echo $time[1]; ?>,<? echo $time[2]; ?>);


function GetCount(ddate,iid){
	currenttime = '<? print date("F d, Y H:i:s", time())?>'
	dateNow = new Date(currenttime );	//grab current date
	amount = ddate.getTime() - dateNow.getTime();	//calc milliseconds between dates
	delete dateNow;

	// if time is already past
	if(amount < 0){
		document.getElementById('1secs').innerHTML="Now!";
	}
	// else date is still good
	else{
		days=0;hours=0;mins=0;secs=0;out="";

		amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

		days=Math.floor(amount/86400);//days
		amount=amount%86400;

		hours=Math.floor(amount/3600);//hours
		amount=amount%3600;

		mins=Math.floor(amount/60);//minutes
		amount=amount%60;

		secs=Math.floor(amount);//seconds
		document.getElementById('1days').innerHTML=days; 
		document.getElementById('1hours').innerHTML=hours; 
		document.getElementById('1mins').innerHTML=mins; 
		document.getElementById('1secs').innerHTML=secs;

	}
}
window.onload=function(){
setInterval("GetCount(dateFuture1)", 1000)
}
Modifié en dernier par Poinball le 16 mars 2012, 00:35, modifié 1 fois.

Mammouth du PHP | 558 Messages

15 mars 2012, 21:58

donne les 10$ avant cela va me motivé à lire ton sujet 8-) .
ptdr on aura tous vue...

Eléphant du PHP | 69 Messages

15 mars 2012, 22:17

Si tu ne veux pas de mon offre n'écris pas sur ce sujet !
J'ai besoin de ce code le plus vite possible et mes force en javascript sont limité !
je n'ai pas d'autre choix

Mammouth du PHP | 558 Messages

15 mars 2012, 22:32

Désoler mais n'oublie pas qu'il s'agit d'un forum ou ce sont des bénévoles qui aide par plaisir et,
non pour gagner de l'argent. En utilisant cette façon d'agir je ne pense pas que quelqu'un ai envie de t'aider.
En fait quelque part je cherche à t'aider car ce n'est pas en faisant une offre que tu obtiendras une quelconque aide,
mais en ayant un titre qui reflète ton problème.
lit donc le règlement article 3 ci-dessous l'url:
annonces/lisez-moi-reglements-generaux-t12542.html
Sur ce en espérant que tu auras compris la ou je veux en venir.
Je te souhaite bonne soirée.
(PS. l'aide que je viens de te donner te coûteras 10 000 $US ptdr).
Plus sérieusement réfléchis au titre et modifie le en conséquence,
Et si tu veux vraiment faire un don pour l'aide obtenu fait le au forum.
Pour cela pose la question à un admin si c'est possible et si oui comment faire...

Modérateur PHPfrance
Modérateur PHPfrance | 2575 Messages

15 mars 2012, 23:37

Bonjour,
Bon. Abstraction faite du titre qui est à Modifier bien sûr. Voici la solution gratuitement car le problème est simple. Il faut simplement baser le compte à rebours sur la date du serveur que tu as bien marquées. En suite, exécuter les 2 fonctions résidentes (setInterval(...)) dans un même et seul événement window.onload car il ne doit y avoir qu'un seul par page HTML. Sinon, pour le reste tout est bien écrit, les programmes fonctionnent bien.

Voici donc la solution corrigée et simplifiée : :wink:
<?php
# date for the countdown timer (sample: doomsday datetime)
$months = 12; #month
$date[1] = 21; #day
$date[2] = 2012; #year
$time[0] = 00; #hours
$time[1] = 00; #min
$time[2] = 00; #sec
#
?>


<script>
// global server datetime from PHP to JS format
var serverdate = new Date('<?php print date("F d, Y H:i:s", time()); ?>');

// one other server datetime that the countdown starts from
var dateFuture1 = new Date(<?php echo $date[2]; ?>,<?php echo $months; ?>,<?php echo $date[1]; ?>,<?php echo $time[0]; ?>,<?php echo $time[1]; ?>,<?php echo $time[2]; ?>);


// return 00~09 number format
function padlength(what){
        return ((what.toString().length==1)? "0"+what : what);
}

// timer function that displays the server datetime on HTML Element called (servertime)
function displaytime2(){
        serverdate.setSeconds(parseInt(serverdate.getSeconds())+1);
        document.getElementById("servertime").innerHTML = padlength(serverdate.getHours())+":"+padlength(serverdate.getMinutes())+":"+padlength(serverdate.getSeconds());
}

// timer function that calculate the countdown datetime and display it on HTML Elements called (1days, 1hours, 1mins, 1secs)
function GetCount(ddate){
	// elapsed time between given ddate and server datetime
        amount = ddate.getTime() - serverdate.getTime();   //calc milliseconds between dates

        // if time is already past
        if(amount < 0){
                document.getElementById('1secs').innerHTML="Now!";
        }
        // else date is still good
        else{
                days=0;hours=0;mins=0;secs=0;out="";

                amount = Math.floor(amount/1000);//kill the "milliseconds" so just secs

                days=Math.floor(amount/86400);//days
                amount=amount%86400;

                hours=Math.floor(amount/3600);//hours
                amount=amount%3600;

                mins=Math.floor(amount/60);//minutes
                amount=amount%60;

                secs=Math.floor(amount);//seconds
		
		// display
                document.getElementById('1days').innerHTML=padlength(days);
                document.getElementById('1hours').innerHTML=padlength(hours);
                document.getElementById('1mins').innerHTML=padlength(mins);
                document.getElementById('1secs').innerHTML=padlength(secs);

        }
}

// on page load start timer functions to display timer from server datetime and display the countdown timer 
window.onload=function(){
	// server datetime timer
	setInterval("displaytime2()", 1000);
	// countdown timer from the server datetime
	setInterval("GetCount(dateFuture1)", 1000);
}
</script>


<h1>Now is</h1>
<div id="servertime"></div>
<h1>Remaining time for doomsday</h1>
<div id="countdown"><span id="1days"></span> days <span id="1hours"></span>:<span id="1mins"></span>:<span id="1secs"></span></div>


<style>
#servertime, #countdown {
	height: 100px;
	font-family: calibri; font-size:5em;
	color: white;
	background: black;
	opacity: 0.8;
	padding: 10px;
	text-align:center;
	display:inline-block;
}
</style>
--------//////----//---//----//////
-------//---//----//---//----//---//
------//////----//////-----//////
-----||--------||--||---||
Prendre le recul n'est pas une perte de temps.


ps: Affrontez moi dans l'arène

Eléphant du PHP | 69 Messages

16 mars 2012, 00:30

Merci sadeq ! Veux tu le paiement ? sa ne me dérange pas ;) sinon dit moi comment faire un dont au site ! je vais versé 10$ comme promis !

Modérateur PHPfrance
Modérateur PHPfrance | 2575 Messages

16 mars 2012, 23:45

Merci, mais toute l'aide qu'on délivre sur ce Forum est totalement gratuite car notre seule motivation est de permettre à toute personne ayant la volonté d’apprendre plus sur la programmation Web de trouver ici une raison pour continuer. :wink: Et vive l'échange d'expérience.
--------//////----//---//----//////
-------//---//----//---//----//---//
------//////----//////-----//////
-----||--------||--||---||
Prendre le recul n'est pas une perte de temps.


ps: Affrontez moi dans l'arène