Compteur qui augmente de 295 par seconde, depuis le 1er janvier 2017

Version imprimable

Bonjour à tous :mrgreen:,

Je cherche à réaliser un compteur qui augmente de 295 points chaque seconde et qui prends en compte le 1er janvier 2017 comme date de départ.

Malgré plus d'une semaine de recherches intensives, le compteur que j'obtiens n'est non seulement pas assez rapide, mais en plus il ne prends pas en compte le 1/1/17 comme point de départ haha !
Code:

1 2 3 4 5 6 7 8 9 10 11 <script type="text/javascript"> var i=00000; function augmenter() { i++; document.getElementById("timer").innerHTML = i; } setInterval("augmenter()", -100); </script> <p align="center" size="100px" id="timer">00000</p>
Merci à tous pour votre aide, c'est une première ;)

(je file me présenter ^^)

Je crois avoir trouvé une piste, qu'en pensez vous ? :)

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
<script>
var START_DATE = new Date("January 1, 2017 01:00:00"); // put in the starting date here
var INTERVAL = 0.1; // in seconds
var INCREMENT = 30; // increase per tick
var START_VALUE = 1; // initial value when it's the start date
var count = 0;
 
window.onload = function()
{
 var msInterval = INTERVAL * 1000;
 var now = new Date();
 count = parseInt((now - START_DATE)/msInterval) * INCREMENT + START_VALUE;
 document.getElementById('counter').innerHTML = count;
 setInterval("count += INCREMENT; document.getElementById('counter').innerHTML = count;", msInterval)
}
</script>
<script>
function addCommas(nStr)
{
	nStr += '';
	x = nStr.split('.');
	x1 = x[0];
	x2 = x.length > 1 ? '.' + x[1] : '';
	var rgx = /(\\d+)(\\d{3})/;
	while (rgx.test(x1)) {
		x1 = x1.replace(rgx, '$1' + ',' + '$2');
	}
	return x1 + x2;
}
</script>

Compteur qui augmente de 295 par seconde, depuis le 1er janvier 2017

Je n'ai pas commenté le code, car selon votre niveau vous comprendrez facilement ou pas. Si vous êtes débutant en JS ce n'est pas trivial, je vous conseille de chercher ici.

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
<!DOCTYPE html>
<html lang="fr" dir="ltr">
<head>
  <meta http-equiv="cache-control" content="public, max-age=60">
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <meta name="author" content="Daniel Hagnoul">
  <title>Test</title>
  <style>
 
  </style>
  <script>
    'use strict';
 
    document.addEventListener( 'DOMContentLoaded', ev => {
            
    });
    
    window.addEventListener( 'load', ev => {
      
      let
        ObjInterval = null,
        timer = document.querySelector( "#timer" ),
        nbSec = Math.floor( ( new Date() - new Date( 2017, 0, 1 ) ) / 1000 ),
        nombre = 295,
        n = nbSec * nombre;
        
      function augmenter(){
        if ( n + nombre <= Number.MAX_VALUE ){
          n += nombre;
          timer.textContent = n;
        } else if ( ObjInterval ){
          clearInterval( ObjInterval );
          throw new Error( `$( n ) > Number.MAX_VALUE, impossible d'augmenter n` );
        }
      }
      
      ObjInterval = setInterval( augmenter, 1000 );
      
    });
  </script>
</head>
<body>
  <main>
 
    <p id="timer"></p>
 
  </main>
</body>
</html>

Pour addCommas, ça me paraît sous-optimal d’utiliser une regexp. J’ai essayé différentes approches, et celle-ci est environ 8 fois plus rapide d’après mes tests :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function addCommas(nStr) {
  if (!nStr) return '0';
 
  let s = String(nStr);
  let len = s.length;
  if (len <= 3) return s;
 
  let output = '';
  let partSize = (len % 3) || 3;
  let i = 0;
  while (i < len) {
    for (let j = 0; j < partSize; j++) {
      output += s[i + j];
    }
    i += partSize;
    if (i < len) output += ',';
    partSize = 3;
  }
  return output;
}

20/01/2017, 08h32
totoyoz

Merci pour vos réponse, c'est résolu !
Ce n'est plus 295 par secondes mais 4440, et pour que le compteur soit plus fluide, j'ai changé l'interval en dixième de seconde (soit 444/0.1).

Il ne restait plus qu'à lier le compteur à une belle typo et c'est parfait, 1000 mercis :P