[JavaScript] Compte et Decompte

Compte et Decompte [JavaScript] - HTML/CSS - Programmation

Marsh Posté le 16-06-2006 à 00:05:31    

Bonjour, j'ai un problème avec un mini logiciel que j'essaye de faire :
 
Je veux faire apparaitre sur 3 champs distinct :
- l'heure actuelle
- l'heure d'un prochain événement ( qui ici apparait tout les 84 min )
- un compte à rebours de l'arrivé de cet evenement
 
A prioris ca parait simple, mais quelque chose déconne, et je ne vois pas quoi.
 
Je copie mon code ici, si quelqu'un pouvais m'aider ca serais sympa :)
 

Code :
  1. <html><head>
  2. <title>Gain SXP</title>
  4. <script type="text/javascript">
  6. var temps = new Date;
  7. var heure = temps.getHours();
  8. var minute = temps.getMinutes();
  9. var seconde = temps.getSeconds();
  11. var heuregain = 10 ;
  12. var minutegain = 11 ;
  13. var secondegain = 12 ;
  15. var heurerestant = heuregain - heure ;
  16. var minuterestant = minutegain - minute ;
  17. var seconderestant = secondegain - seconde ;
  19. function HeureCheck()
  20. { if (sec < 10)
  21.   { sec0 = "0"; }
  22.   else
  23.   { sec0 = ""; }
  24.         if (min < 10)
  25.         { min0 = "0"; }
  26.         else
  27.         { min0 = ""; }
  28.               if (heure < 10)
  29.               { heure0 = "0"; }
  30.               else
  31.               { heure0 = ""; }
  32.      
  33.   HeureActu = heure0 + heure + ":" + min0 + min + ":" + sec0 + sec ;
  34.   document.chrono.CurrentTime.value = HeureActu ;
  35.  
  36.   if ( heure >= heuregain )
  37.      { if ( minute >= minutegain )
  38.        { heuregain = heuregain + 1 ;
  39.          minutegain = minutegain + 24 } }
  41.   if ( minutegain >= 60 )
  42.      { minutegain = minutegain - 60 ;
  43.        heuregain = heuregain + 1 }
  45.   if ( heuregain >= 24 )
  46.      { heuregain = heuregain - 24 }
  48.   TempsGain = heuregain + ":" + minutegain + ":" + secondegain ;
  49.   document.chrono.GainTime.value = TempsGain ;
  50.  
  51.   if ( minuterestant < 0 )
  52.      { minuterestant = minuterestant + 60 ;
  53.        heurerestant = heurerestant - 1 } }
  54.  
  55.   TempsGain = heuregain + ":" + minutegain + ":" + secondegain ;
  56.   document.chrono.GainTime.value = TempsGain ;
  57.  
  58. </script>
  59. </head>
  61. <body onLoad="HeureCheck();">
  63. <form name="chrono">
  64. <input type="text" name="CurrentTime" size=5 readonly="1"> Heure actuelle <br /><br />
  65. <input type="text" name="GainTime" size=5 readonly="1"> Heure du prochain gain <br /><br />
  66. <input type="text" name="GainTimeLeft" size=5 readonly="1"> Temps restant
  67. </form>
  69. </body>
  70. </html>


Message édité par HolySpirit le 16-06-2006 à 01:40:56
Reply

Marsh Posté le 16-06-2006 à 00:05:31   

Reply

Marsh Posté le 16-06-2006 à 01:18:24    

Salut!
 
Il y a plusieurs problèmes dans ton script:
 
- Tu déclares la variable "min" et "sec" mais tu utilises "minute" et "seconde"
- Le "Have OK" n'a rien à faire là :  { sec0 = "0"; }have Ok
- Il manque un paquet de ";"
 
Il est préférable de ne pas utiliser des noms de fonction comme nom de variable (comme min ou time)
 
Et si tu veux une solution à ton problème, il faudrait déjà que tu l'exposes!  
Parce que : <<A prioris ca parait simple, mais quelque chose déconne, et je ne vois pas quoi.>>
Ben moi non plus! :)
 
Sinon, tu n'affectes nulle part la valeur du champ "GainTimeLeft" et si tu veux un compte à rebours, il faudrait appeler la fonction à intervalle régulier...

Reply

Marsh Posté le 16-06-2006 à 01:44:09    

Alors, j'ai édité le code en corrigeant les erreurs que tu m'as indiqué.
 
Par contre, je ne vois pas où il manque des ";" ?
J'en ai mis après chaque instructions, sauf la dernière du programme, et a priori je n'ai pas besoin d'en mettre après une boucle if, si ?
 
J'ai rajouté l'affection de "GainTimeLeft" (j'avais oublié de la remettre après l'avoir retiré un moment)
 
Et désolé si je n'ai pas été assez précis lors de mon 1er post !
En fait, je n'arrive pas a affecter les valeurs aux inputs du formulaire. Ceux-ci restent désespérément vide, et je ne sais pas pourquoi =/

Reply

Marsh Posté le 16-06-2006 à 09:25:29    

tu utiliserai l'objet date tu t'emmerderai largement moins, en plus ton script ne gère absolument pas les jours :o et donc c'est foireux :o
Et pourquoi s'emmerder comme tu le fais alors qu'avec date ça marche comme sur des roulettes : (codé en 1h) (ouais je sais c'est beaucoup mais j'étais tombé sur une erreur de débutant) :(

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <title></title>
  5. <script>
  6. var eventTime = initDate(2006,6,25,16,40,35);
  8. /*initialise une nouvelle date*/
  9. function initDate(annee, mois, jour, heure, secondes, minutes) {
  10.  var newDate = new Date();
  11.  newDate.setYear(annee);
  12.  newDate.setMonth(mois);
  13.  newDate.setDate(jour);
  14.  newDate.setHours(heure);
  15.  newDate.setSeconds(secondes);
  16.  newDate.setMinutes(minutes);
  17.  return newDate;
  18. }
  20. /*ecrit une date dans un elt*/
  21. function writeTime(eltId, time, allhours) {
  22.  var elt = document.getElementById(eltId);
  23.  if (allhours) {
  24.   var h=time.getDate()*24+time.getHours();
  25.  } else {
  26.   var h=time.getHours();
  27.  }
  28.  var m=time.getMinutes();
  29.  var s=time.getSeconds();
  30.  elt.value = ((h<10) ? "0"+h : h) + ":" + ((m<10) ? "0"+m : m) + ":" + ((s<10) ? "0"+s : s);
  31. }
  33. /*Fonction qui s'occupe de gerer le decompte*/
  34. function updateTime() {
  35.  var time = new Date();
  36.  var restTime = new Date(eventTime-time);
  37.  restTime.setSeconds(restTime.getSeconds()+Math.round(restTime.getMilliseconds()/1000)); //on arrondis les secondes afin de ne pas avoir de decalage de temps.
  38.  writeTime("actualTime",time);
  39.  writeTime("restTime",restTime,true);
  40.  writeTime("eventTime",eventTime);
  41.  setTimeout("updateTime()",1000);
  42. }
  44. window.onload=updateTime;
  45. </script>
  46. </head>
  48. <body>
  50. <label>Heure Actuelle : </label><input type="text" id="actualTime"><br>
  51. <label>Temps restant : </label><input type="text" id="restTime"><br>
  52. <label>Prochain &eacute;v&egrave;nement : </label><input type="text" id="eventTime"><br>
  53. </body>
  54. </html>


Message édité par gatsu35 le 16-06-2006 à 09:36:48
Reply

Marsh Posté le 16-06-2006 à 13:31:39    

Je m'attendais plus à une correction de mon script qu'un script tout fait  :D  
 
En tout cas merci, par contre, je ne comprends pas quel est l'interêt d'utiliser le window.onload=updateTime; plutot que le <body onLoad=".....">
 
et pourquoi il faut mettre :
 

Code :
  1. window.onload=updateTime;


et non :
 

Code :
  1. window.onload=updateTime();

Reply

Marsh Posté le 16-06-2006 à 14:48:16    

c'est au choix, soit tu appelles la fonction dans le body onload soit en modifiant le window.onload (ce qui est plus propre).
 
Quand tu me mets pas de guillemets, tu passes entièrement l'objet updateTime dans le window.onload. c'est comme si tu faisais un copier-coller du contenu de updateTime dans window.onload.
Si tu mets des parenthèse ça ne représente rien du tout et ça ne lancera pas la fonction.

Reply

Marsh Posté le 16-06-2006 à 17:54:58    

D'accord merci pour les réponses ( par contre ton script semble déconner au niveau des heures. Si je met un evenement à venir dans la minute, j'ai un compte à rebours de plus de 700heures ^^

Reply

Marsh Posté le 16-06-2006 à 19:39:35    

ouais jvais corriger ça de retour chez moi.
 
C'est parce que lors de la soustraction je récupere un objet Date, et ça le fait pas du tout :(  

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed