Compteur de temps pour vente flash

Version imprimable

Voir 40 message(s) de cette discussion en une page

22/12/2013, 15h37
NoSmoking
Tout d'abord
Merci de soigner l'indentation, pensez à ceux qui lisent!

Citation:

...n ayant pas le niveau d'apporter des réelles modifications au script.

le code est opérationnel même si pas top.

Citation:

Tu as ajouté un "var iTimer" mais où dois je ajouté ce bout de code ?

cette variable doit être globale là où tu l'a mis c'est correct.

Citation:

il faut qu il aille chercher dans la bdd la date d'échéance $project['end_date'] de chaque produit de manière automatique.

c'es juste un morceau de PHP du type
Code:

1 2 3 var dateFin = "<?php echo $dateFin ?>"; var dateDeb = "<?php echo $dateDeb ?>"; update_cur_time( dateFin, dateDeb);
Citation:

Ca ne marche pas toujours pas mais je comprend bien qu'il y a des choses à modifier.

dans le code suivant il suffit de lancer la fonction initCompteur qui enchainera
Code:

1 2 3 initCompteur(dateFin, dateDeb); // Appel de la fonction point final // initCompteur(t1, t2); INUTILE // afficheCompteur(end); INUTILE

Code:

1
2
var dateFin = "<?php echo $end_date ?>"; // Date échéance
          var dateDeb = new Date();                   // date du jour

Je met ce code à la fin ou je l'intègre à function initCompteur(t1,t2) ? car si je l intègre je dois alors tout virer ce bout de code ou les remplacer par les nouvelles valeurs ?:

Code:

1
2
3
4
5
6
var loc = new Date();
          end = end.getTime();
          cur = cur.getTime();
          loc = loc.getTime();
          var temp = cur - loc;
          end = end - temp;

Voilà où j'en suis. Ca ne marche pas mais j'ai du me tromper:

Code:

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
 
var iTimer;
function initCompteur(dateFin,dateDeb) {
    var dateFin = "<?php echo $end_date ?>"; // Date échéance
    var dateDeb = new Date();                // date du jour
    var loc = new Date();
    dateFin = dateFin.getTime();
    dateDeb = dateDeb.getTime();
    loc = loc.getTime();
    var temp = dateDeb - loc;
    dateFin = dateFin - temp;
    // affichage immédiat
    afficheCompteur(end); // ex function cur_time
    // rappel de la fonction toutes les 1s
    iTimer = setInterval(function () {
        afficheCompteur(end); // ex function cur_time
    }, 1000);
}
 
function afficheCompteur(end) {
    var loc = new Date();
    loc = loc.getTime();
 
    var diff = end - loc;
    var dd = Math.floor(diff / (1000 * 60 * 60 * 24));
    var hh = Math.floor((diff - (1000 * 60 * 60 * 24 * dd)) / (1000 * 60 * 60));
    var mm = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh)) / (1000 * 60));
    var ss = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh) - (1000 * 60 * mm)) / (1000));
    if (dd < 10) {
        dd = '0' + dd;
    }
    if (hh < 10) {
        hh = '0' + hh;
    }
    if (mm < 10) {
        mm = '0' + mm;
    }
    if (ss < 10) {
        ss = '0' + ss;
    }
    // on peut faire un SI diff <= 0 ALORS
    if (dd == 00 && hh == 00 && mm == 00 && ss == 00) {
        clearInterval(iTimer);
    }
    document.getElementById('update_day').innerHTML = dd;
    document.getElementById('update_hour').innerHTML = hh;
    document.getElementById('update_minute').innerHTML = mm;
    document.getElementById('update_second').innerHTML = ss;
}
var iTimer;
// Init des variables par exemple, le format est adapté aux oldBrowsers
var dateFin = 'December 25, 2013 00:00:00'; // Date échéance
var dateDeb = new Date(); // date du jour
// appel de la fonction d'initialisation
initCompteur(dateFin,dateDeb);

La console me dit "dateFin is not define"

Il faut que tu arrêtes de tout changer à l'emporte pièce et que tu essaies de comprendre ce que tu écris.

Pourquoi vouloir changer le contenu des fonctions qui fonctionnent, tu as tout pour reconstituer le script, je le fais pour toi.

Code:

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
function initCompteur( t1, t2) {
  var end = new Date(t1);
  var cur = new Date(t2);
  var loc = new Date();
  end = end.getTime();
  cur = cur.getTime();
  loc = loc.getTime();
  var temp = cur - loc;
  end = end - temp;
  // affichage immédiat
  afficheCompteur( end);    // ex function cur_time
  // rappel de la fonction toutes les 1s
  iTimer = setInterval(function () {
    afficheCompteur( end);    // ex function cur_time
  }, 1000);
}
function afficheCompteur(end) {
  var loc = new Date();
  loc = loc.getTime();
 
  var diff = end - loc;
  var dd = Math.floor(diff / (1000 * 60 * 60 * 24));
  var hh = Math.floor((diff - (1000 * 60 * 60 * 24 * dd)) / (1000 * 60 * 60));
  var mm = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh)) / (1000 * 60));
  var ss = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh) - (1000 * 60 * mm)) / (1000));
  if (dd < 10) {
    dd = '0' + dd;
  }
  if (hh < 10) {
    hh = '0' + hh;
  }
  if (mm < 10) {
    mm = '0' + mm;
  }
  if (ss < 10) {
    ss = '0' + ss;
  }
  // on peut faire un SI diff <= 0 ALORS
  if (dd == 00 && hh == 00 && mm == 00 && ss == 00) {
    clearInterval( iTimer);
  }
  document.getElementById('d').innerHTML = dd;
  document.getElementById('h').innerHTML = hh;
  document.getElementById('m').innerHTML = mm;
  document.getElementById('s').innerHTML = ss;
}
var iTimer;
// Init des variables par exemple, le format est adapté aux oldBrowsers
var dateFin = 'December 25, 2013 00:00:00'; // Date échéance
var dateDeb = new Date();                   // date du jour
// appel de la fonction d'initialisation
initCompteur( dateFin, dateDeb);            // la fonction a été renommée

il te reste à intégrer tes variables PHP comme je te l'ai indiqué.

22/12/2013, 23h02
cedrus

Merci. Alors j'ai tout remis ce que tu as écris et modifié simplement cette variable comme ceci:

Code:

var dateFin = "<?php echo $project['end_date'] ?>";

pour qu il prenne en compte dans la bdd la date de clôture de chaque produit. Pour l instant ça ne fonctionne toujours pas. Il faut toujours actualiser la page pour que le compte à rebours s'actualise.

Tu m avais dit aussi de déclarer les variables d,h,m et s mais je t avoue que je ne sais pas comment faire. En tout cas merci pour le temps que tu m'accordes.
23/12/2013, 19h32
NoSmoking

Il faudrait connaitre le format de sortie de var dateFin = "<?php echo $project['end_date'] ?>"; pour vérifier si il est conforme à l'attendu.

Citation:

Tu m avais dit aussi de déclarer les variables d,h,m et s ...

Non, je parlais des éléments du DOM

Citation:

..., les éléments du DOM recevant le changement, d-h-m-et s, doivent exister avant de leur affecter un innerHTML.

il est vrai que par pure fainéantise j'ai raccourci les ID des éléments qui sont donc en fait update_day, update_hour, update_minute et update_second
23/12/2013, 21h20
cedrus

J'ai repris simplement le $project['end_date'] qui était au tout début du code. Mais est ce que pour la syntaxe du script c est la même chose ?
Dans la base de donnée la date de fin 'end_date' est indiquée exactement comme cela: 2013-12-31 11:45:12

Du coup sur le site le compte à rebours est affiché comme cela http://guitaretv.com/partage/chrono.jpg

Pour les éléments de Dom, je t avoue que je sais même pas ce que c'est..donc je sais pas comment vérifier leur existence...:cry:
23/12/2013, 22h08
NoSmoking

Il faut simplement que la variable soit initialisée avant sont utilisation.

Citation:

Pour les éléments de Dom, je t avoue que je sais même pas ce que c'est..d

DOM = Document Object Model, plein d'info sur À propos du Document Object Model

En gros quand tu écris document.getElementById('update_date').innerHTML = dd, tu récupères l'élément du document ayant comme ID 'update_date' et tu remplaces son contenu, innerHTML, par ce que contient la variable dd, donc si l'élément n'existe pas ou ne fait pas encore partie du document, document en cours d'écriture ou script exécuté avant la déclaration de cet élément, le script plante.

Citation:

2013-12-31 11:45:12

n'est pas au bon format pour Date()
23/12/2013, 23h15
cedrus

1. Pour initialiser la variable il faut ajouter au script :

Code:

$end_date = 'end_date';

ou

Code:

$data['end_date']=$project['end_date'];

?

2. Il y a 3 Date() dans le script. A ce que je vois dans la partie php il faut les remplacer par Date('Y-m-d h:i:s') ?

3.Pour les DOM je regarde des liens sur le web mais je nage toujours...
24/12/2013, 18h16
NoSmoking

il faut que tu remplaces l'espace par un T

Code:

$end_date = str_replace(' ', 'T', $end_date);

:fleche: http://www.ecma-international.org/ec...#sec-15.9.1.15
26/12/2013, 13h39
cedrus

Là je suis un peu largué...
26/12/2013, 14h54
NoSmoking

Citation:

Là je suis un peu largué...

cela ne va pas nous aider à résoudre ton questionnement!

Montre nous le code auquel tu es arrivé, je redoute le pire ;)

Voilà où j en suis avec le code complet, grâce aux différentes aides et explications.

Code:

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
<?php 
$date1 = $project['end_date'];
$date2 = date('Y-m-d h:i:s');
$diff = abs(strtotime($date1) - strtotime($date2));
$years = floor($diff / (365*60*60*24));
$months = floor(($diff - $years * 365*60*60*24) / (30*60*60*24));
$days = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24)/ (60*60*24));
$day1 = floor($diff/ (60*60*24));
$hours = floor(($diff - $day1*60*60*24)/ (60*60));
$minuts = floor(($diff - $day1*60*60*24 - $hours*60*60)/ 60);
$seconds = floor(($diff - $day1*60*60*24 - $hours*60*60 - $minuts*60));
date('d', strtotime($project['end_date']));
if($day1 < 10) $day1 = '0'.$day1;
if($hours < 10) $hours = '0'.$hours;
if($minuts < 10) $minuts = '0'.$minuts;
if($seconds < 10) $seconds = '0'.$seconds;
?>
<script>
function initCompteur( t1, t2) {
  var end = new Date(t1);
  var cur = new Date(t2);
  var loc = new Date('Y-m-d h:i:s');
  end = end.getTime();
  cur = cur.getTime();
  loc = loc.getTime();
  var temp = cur - loc;
  end = end - temp;
  // affichage immédiat
  afficheCompteur( end);    // ex function cur_time
  // rappel de la fonction toutes les 1s
  iTimer = setInterval(function () {
    afficheCompteur( end);    // ex function cur_time
  }, 1000);
}
function afficheCompteur(end) {
  var loc = new Date('Y-m-d h:i:s');
  loc = loc.getTime();
 
 var update_day= "days";   
 var update_hour;
 var update_minute;
 var update_second;
 
  var diff = end - loc;
  var dd = Math.floor(diff / (1000 * 60 * 60 * 24));
  var hh = Math.floor((diff - (1000 * 60 * 60 * 24 * dd)) / (1000 * 60 * 60));
  var mm = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh)) / (1000 * 60));
  var ss = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh) - (1000 * 60 * mm)) / (1000));
  if (dd < 10) {
    dd = '0' + dd;
  }
  if (hh < 10) {
    hh = '0' + hh;
  }
  if (mm < 10) {
    mm = '0' + mm;
  }
  if (ss < 10) {
    ss = '0' + ss;
  }
  // on peut faire un SI diff <= 0 ALORS
  if (dd == 00 && hh == 00 && mm == 00 && ss == 00) {
    clearInterval( iTimer);
  }
  document.getElementById('update_day').innerHTML = dd;
  document.getElementById('update_hour').innerHTML = hh;
  document.getElementById('update_minute').innerHTML = mm;
  document.getElementById('update_second').innerHTML = ss;
}
var iTimer;
// $end_date = 'end_date';
$end_date = str_replace(' ', 'T', $end_date);
// $data['end_date']=$project['end_date'];
// Init des variables par exemple, le format est adapté aux oldBrowsers
var dateFin = "<?php echo $project['end_date'] ?>"; // Date échéance
var dateDeb = new Date('Y-m-d h:i:s');                   // date du jour
// appel de la fonction d'initialisation
initCompteur( dateFin, dateDeb);            // la fonction a été renommée
</script>
<div style="float:right;">
    <h4>
<?php if($project['unlimited_days'] != 1)
{ ?>
    <img src="<?php echo base_url();?>images/clock.png" alt="" />
    <span id='update_day'><?php echo $day1 ; ?></span>:<span id='update_hour'><?php echo $hours ; ?></span>:<span id='update_minute'><?php echo $minuts ; ?></span>:<span id='update_second'><?php echo $seconds ; ?></span><br>
    <span style="margin-left:12px;">&nbsp;</span><span style="font-size: 13px;margin: 0px 6px;"><?php echo DAYS;?></span><span style="font-size: 13px;margin: 0px 6px;"><?php echo HRS;?></span><span style="font-size: 13px;margin: 0px 6px;"><?php echo MIN;?></span><span style="font-size: 13px;margin: 0px 6px;"><?php echo SEC;?></span>
<?php } ?>

Le compte à rebours s affiche bien mais ne s'actualise toujours pas toutes les secondes. La console indique

Citation:

ReferenceError: str_replace is not defined

.

Donc il n accède pas à la date de fin dans le code ligne 79

Code:

$end_date = str_replace(' ', 'T', $end_date);

Mais je sais pas comment corriger la syntaxe de cette ligne

Cela va être dur mais on va essayer, d'autant que tu ne semble pas avoir bien lu/compris ce que l'on t'a expliqué jusqu'à présent.
- PHP = coté SERVEUR
- Javascript = coté CLIENT
une fois que l'on est coté CLIENT on ne parle plus de PHP.

la partie HTML doit être finalisée avant l'appel à la fonction de mise à jour de l'heure, dit plusieurs fois, donc ton script NE DOIT PAS être lancé avant que la page soit complète, dans ton code la partie HTML arrive après le lancement de la fonction.

Il me semble inutile de vouloir mettre des valeurs dans des éléments qui vont être modifié immédiatement.

la partie HTML devient

Code:

1
2
3
4
5
6
7
8
9
<span id='update_day'></span>:
<span id='update_hour'></span>:
<span id='update_minute'></span>:
<span id='update_second'></span><br>
<span style="margin-left:12px;">&nbsp;</span>
<span style="font-size: 13px;margin: 0px 6px;">DAYS</span>
<span style="font-size: 13px;margin: 0px 6px;">HRS</span>
<span style="font-size: 13px;margin: 0px 6px;">MIN</span>
<span style="font-size: 13px;margin: 0px 6px;">SEC</span>

inutile donc de mélanger PHP et HTML dans cette partie et tu tirerais avantage à passer par les classes de style plutôt que de mettre le style dans les balises ( à voir plus tard, pas urgent dans ton cas)

La partie script, on a vu quelle "fonctionnait", je parle là que des fonctions

Code:

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
34
35
36
37
38
39
40
41
42
43
44
45
46
function initCompteur( t1, t2) {
  var end = new Date(t1);
  var cur = new Date(t2);
  var loc = new Date();
  end = end.getTime();
  cur = cur.getTime();
  loc = loc.getTime();
  var temp = cur - loc;
  end = end - temp;
  // affichage immédiat
  afficheCompteur( end);    // ex function cur_time
  // rappel de la fonction toutes les 1s
  iTimer = setInterval(function () {
    afficheCompteur( end);    // ex function cur_time
  }, 1000);
}
function afficheCompteur(end) {
  var loc = new Date();
  loc = loc.getTime();
 
  var diff = end - loc;
  var dd = Math.floor(diff / (1000 * 60 * 60 * 24));
  var hh = Math.floor((diff - (1000 * 60 * 60 * 24 * dd)) / (1000 * 60 * 60));
  var mm = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh)) / (1000 * 60));
  var ss = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh) - (1000 * 60 * mm)) / (1000));
  if (dd < 10) {
    dd = '0' + dd;
  }
  if (hh < 10) {
    hh = '0' + hh;
  }
  if (mm < 10) {
    mm = '0' + mm;
  }
  if (ss < 10) {
    ss = '0' + ss;
  }
  // on peut faire un SI diff <= 0 ALORS
  if (dd == 00 && hh == 00 && mm == 00 && ss == 00) {
    clearInterval( iTimer);
  }
  document.getElementById('update_day').innerHTML = dd;
  document.getElementById('update_hour').innerHTML = hh;
  document.getElementById('update_minute').innerHTML = mm;
  document.getElementById('update_second').innerHTML = ss;
}

La partie lancement du script enfin, avec tes récupérations de date

Code:

1
2
3
4
var iTimer;
var dateFin = "<?php str_replace(' ', 'T', $project['end_date']) ?>"; // récupération et mise au format
var dateDeb = new Date();            // date du jour;
initCompteur( dateFin, dateDeb);  // appel de la fonction

Maintenant si on met bout à bout ce qui est ci dessus on obtient

Code:

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>C'est pas simple et pourtant</title>
</head>
<body>
<span id='update_day'></span>:
<span id='update_hour'></span>:
<span id='update_minute'></span>:
<span id='update_second'></span><br>
<span style="margin-left:12px;">&nbsp;</span>
<span style="font-size: 13px;margin: 0px 6px;">DAYS</span>
<span style="font-size: 13px;margin: 0px 6px;">HRS</span>
<span style="font-size: 13px;margin: 0px 6px;">MIN</span>
<span style="font-size: 13px;margin: 0px 6px;">SEC</span>
<!-- ici on place la partie SCRIPT -->
<script>
function initCompteur( t1, t2) {
  var end = new Date(t1);
  var cur = new Date(t2);
  var loc = new Date();
  end = end.getTime();
  cur = cur.getTime();
  loc = loc.getTime();
  var temp = cur - loc;
  end = end - temp;
  // affichage immédiat
  afficheCompteur( end);    // ex function cur_time
  // rappel de la fonction toutes les 1s
  iTimer = setInterval(function () {
    afficheCompteur( end);    // ex function cur_time
  }, 1000);
}
function afficheCompteur(end) {
  var loc = new Date();
  loc = loc.getTime();
 
  var diff = end - loc;
  var dd = Math.floor(diff / (1000 * 60 * 60 * 24));
  var hh = Math.floor((diff - (1000 * 60 * 60 * 24 * dd)) / (1000 * 60 * 60));
  var mm = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh)) / (1000 * 60));
  var ss = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh) - (1000 * 60 * mm)) / (1000));
  if (dd < 10) {
    dd = '0' + dd;
  }
  if (hh < 10) {
    hh = '0' + hh;
  }
  if (mm < 10) {
    mm = '0' + mm;
  }
  if (ss < 10) {
    ss = '0' + ss;
  }
  // on peut faire un SI diff <= 0 ALORS
  if (dd == 00 && hh == 00 && mm == 00 && ss == 00) {
    clearInterval( iTimer);
  }
  document.getElementById('update_day').innerHTML = dd;
  document.getElementById('update_hour').innerHTML = hh;
  document.getElementById('update_minute').innerHTML = mm;
  document.getElementById('update_second').innerHTML = ss;
}
var iTimer;
var dateFin = "<?php str_replace(' ', 'T', $project['end_date']) ?>"; // récupération et mise au format
var dateDeb = new Date();            // date du jour;
initCompteur( dateFin, dateDeb);  // appel de la fonction
</script>
</body>
</html>

Cela devrait fonctionner sauf erreur de frappe ou de copié/collé.

Une fois de plus
Merci de soigner l'indentation, pensez à ceux qui lisent!

En suivant ton code, il affiche pour indiquer le compteur "NaN: NaN: NaN: NaN"

Attention la condition

Code:

1
2
3
<?php if($project['unlimited_days'] != 1)
{ ?>
<img src="<?php echo base_url();?>images/clock.png" alt="" />

ne doit pas être supprimée !

Du coup voilà ce que j ai mis mais j'ai du encore faire une erreur:

Code:

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
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
<div style="float:right;">
<h4>
<?php if($project['unlimited_days'] != 1)
{ ?>
<img src="<?php echo base_url();?>images/clock.png" alt="" />
 
<span id='update_day'></span>:<span id='update_hour'></span>:<span id='update_minute'></span>:<span id='update_second'></span><br>
 
<span style="margin-left:12px;">&nbsp;</span><span style="font-size: 13px;margin: 0px 6px;"><?php echo DAYS;?></span><span style="font-size: 13px;margin: 0px 6px;"><?php echo HRS;?></span><span style="font-size: 13px;margin: 0px 6px;"><?php echo MIN;?></span><span style="font-size: 13px;margin: 0px 6px;"><?php echo SEC;?></span>
<?php } ?>
</h4></div>
<script>
function initCompteur( t1, t2) {
  var end = new Date(t1);
  var cur = new Date(t2);
  var loc = new Date();
  end = end.getTime();
  cur = cur.getTime();
  loc = loc.getTime();
  var temp = cur - loc;
  end = end - temp;
  // affichage immédiat
  afficheCompteur( end);    // ex function cur_time
  // rappel de la fonction toutes les 1s
  iTimer = setInterval(function () {
    afficheCompteur( end);    // ex function cur_time
  }, 1000);
}
function afficheCompteur(end) {
  var loc = new Date();
  loc = loc.getTime();
 
  var diff = end - loc;
  var dd = Math.floor(diff / (1000 * 60 * 60 * 24));
  var hh = Math.floor((diff - (1000 * 60 * 60 * 24 * dd)) / (1000 * 60 * 60));
  var mm = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh)) / (1000 * 60));
  var ss = Math.floor((diff - (1000 * 60 * 60 * 24 * dd) - (1000 * 60 * 60 * hh) - (1000 * 60 * mm)) / (1000));
  if (dd < 10) {
    dd = '0' + dd;
  }
  if (hh < 10) {
    hh = '0' + hh;
  }
  if (mm < 10) {
    mm = '0' + mm;
  }
  if (ss < 10) {
    ss = '0' + ss;
  }
  // on peut faire un SI diff <= 0 ALORS
  if (dd == 00 && hh == 00 && mm == 00 && ss == 00) {
    clearInterval( iTimer);
  }
  document.getElementById('update_day').innerHTML = dd;
  document.getElementById('update_hour').innerHTML = hh;
  document.getElementById('update_minute').innerHTML = mm;
  document.getElementById('update_second').innerHTML = ss;
}
var iTimer;
var dateFin = "<?php str_replace(' ', 'T', $project['end_date']) ?>"; // récupération date échéance et mise au format
var dateDeb = new Date();                   // date du jour
// appel de la fonction d'initialisation
initCompteur( dateFin, dateDeb);            // la fonction a été renommée
</script>

26/12/2013, 18h15
NoSmoking

Citation:

Envoyé par NoSmoking

Cela devrait fonctionner sauf erreur de frappe ou de copié/collé.

j'ai juste oublié de faire un écho de la valeur

Code:

var dateFin = "<?php echo str_replace(' ', 'T', $project['end_date']) ?>"; // récupération date échéance et mise au format

Regarde ce que donne le code HTML t'aideras fortement.

En effet maintenant le décompte fonctionne sous Mozilla et Chrome ! En revanche parfois les secondes délirent, il enlève 2 secondes d'un coup ou ralenti pendant 2 secondes mais j'image que ça doit être du au serveur ou navigateur..

En revanche sur IE et Safari il affiche "NaN:NaN:NaN:NaN"

Peux tu me confirmer si je dois supprimer ce bout de code qui était au tout début :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php 
$date1 = $project['end_date'];
$date2 = date('Y-m-d h:i:s');
$diff = abs(strtotime($date1) - strtotime($date2));
                                                                
$years = floor($diff / (365*60*60*24));
$months = floor(($diff - $years * 365*60*60*24) / (30*60*60*24));
$days = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24)/ (60*60*24));
                                                                
                                                                
$day1 = floor($diff/ (60*60*24));
$hours = floor(($diff - $day1*60*60*24)/ (60*60));
$minuts = floor(($diff - $day1*60*60*24 - $hours*60*60)/ 60);
$seconds = floor(($diff - $day1*60*60*24 - $hours*60*60 - $minuts*60));
                                                                
date('d', strtotime($project['end_date']));
                                                                
if($day1 < 10) $day1 = '0'.$day1;
if($hours < 10) $hours = '0'.$hours;
if($minuts < 10) $minuts = '0'.$minuts;
if($seconds < 10) $seconds = '0'.$seconds;
 
?>

26/12/2013, 22h01
NoSmoking
Citation:

Peux tu me confirmer si je dois supprimer ce bout de code qui était au tout début :

attendu que tu ne t'en sert pas tu peux effectivement supprimer les lignes concernées.

Citation:

En revanche sur IE et Safari il affiche "NaN:NaN:NaN:NaN"

il te faut formater la date différemment comme indiqué en début de discussion
Citation:
Code:

1 2 // Init des variables par exemple, le format est adapté aux oldBrowsers var dateFin = 'December 25, 2013 00:00:00'; // Date échéance
27/12/2013, 00h11
cedrus

j y arrive pas, je tourne en rond.
27/12/2013, 14h50
cedrus

Je trouve nul part d'info pour formater la date à partir d'un code déjà complexe comme nous avons intégré.

Tu me dis de faire afficher cette forme

Code:

var dateFin = 'December 25, 2013 00:00:00';

à partir de notre code déjà mis en place:

Code:

var dateFin = "<?php echo str_replace(' ', 'T', $project['end_date']) ?>";

C est au delà de mes compétences...

Le coté javascript, même si pas terrible fonctionne, tu as un problème PHP et il aurait été plus judicieux de le régler sur le forum adéquat.

Il y a 1000 et 1 façons de prendre en compte ton problème, mais la meilleur reste quand même d'apprendre les bases ;)

A partir de '2013-12-31 11:45:12' on peut également arriver à 2013,12,31,11,45,12 qui est un format valide, voir le lien déjà fourni.
Code:

1 2 3 // on remplace les -, espace et : par une virgule // pour plus d'info regarder la documentation ne fait pas de mal $date = str_replace( array(" ", "-", ":"), ',', $project['end_date']);
Les mois étant de 0 à 11 il faut décrémenter le mois
Code:

1 2 3 4 5 6 // on récupère un tableau à partir d'une chaine $date = explode( ',', $date); // on enlève 1 au mois qui dans le tableau à la 2éme position donc à l'indice 1 $date[1] -= 1; // on reconstruit la chaine $date = implode( ',', $date);
en final on obtient donc 2013,11,31,11,45,12.

Il ne restera plus qu'a injecter cette valeur dans le code javascript

Code:

var dateFin = new Date(<?php echo $date ?>); // Date échéance

Citation:

Je trouve nul part d'info pour formater la date à partir d'un code

les bases et encore les bases.
Les meilleurs cours et tutoriels PHP

Voir 40 message(s) de cette discussion en une page