Compteur d'inscriptions automatisé

**Perceuse-Killer** · 13/01/2011, 16h14

Bonjour à tous,

Je souhaiterais mettre en place un compteur d'inscriptions sur mon site de la même trempe que : http://badoo.com/.

A chaque inscription, je souhaite incrémenter le compteur (ça devrait pas être trop dur en interrogeant la base de données et en rafraichissant le compteur).

Cependant, je ne vois pas comment incrémenter régulièrement le compteur pour feindre des nouvelles inscriptions (comme badoo).

Merci d'avance pour vos conseils avisés.

Bien cordialement,
Perceuse-Killer

**larffas68** · 14/01/2011, 11h50

salut,

tu pourrais mettre un cron qui s’exécute tous les jours et qui compte le nombre d'inscription réelle, qui fait un calcul avec un coefficient et qui ajoute ce nombre dans ta base de donnée au nombre d'inscrit sur le site par exemple

bonne continuation

**scourjean** · 14/01/2011, 12h02

Pas besoin de cron, sur Badoo il y a un nombre de départ pour l'initialisation ça tu peux l'avoir avec ta bdd.

Ensuite tu appelles une fonction js toutes les secondes ou plus.
Le principe est :
- var nbDepart = ... (ton chiffre qui sera passé en paramètre à ta fonction js)
- var nbCurrent = ... (chiffre qui s'incrémente avec le temps à chaque appel de ta fonction)

Tu veux faire le même effet que Badoo qui change uniquement les chiffres différents du nombre précédent ou bien tu veux faire un autre effet de fade ou slide sur le chiffre entier ?
Parce que ça demande pas le même traitement.

**Perceuse-Killer** · 14/01/2011, 13h56

Bonjour larffas68 et scourjean et merci pour vos réponses,

Je comprends mieux le principe.

Concernant l'effet du compteur, celui de badoo m'intéresserait et c'est vrai que je n'ai pas trop idée comment cela fonctionne. Je vais peut-être simplifier la chose.

Merci encore.

Bien cordialement,
Perceuse-Killer

**scourjean** · 14/01/2011, 15h12

Voilà un petit code de test que tu pourras personnaliser avec du css, des images mais qui est fonctionnel, j'ai essayé de te le commenter pour que tu le comprennes.

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<?php
        $nb = "99";
        $tab_num = array(
                "0"=>"<div class='number'>0</div>","1"=>"<div class='number'>1</div>",
                "2"=>"<div class='number'>2</div>","3"=>"<div class='number'>3</div>",
                "4"=>"<div class='number'>4</div>","5"=>"<div class='number'>5</div>",
                "6"=>"<div class='number'>6</div>","7"=>"<div class='number'>7</div>",
                "8"=>"<div class='number'>8</div>","9"=>"<div class='number'>9</div>"
        );
?>
<html>
	<head>
		<style type="text/css">
		.number{
			float:left;
		}
		</style>
		<script type="text/javascript" src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
		<script type="text/javascript">
			function verifChiffre(pos,nb)
			{
				if (pos>=0)
				{
					// Si on a plus de chiffres que l'ancien nombre
					if (nb.length>$("div#compteur div.number").length)
					{
						$("div#compteur div.number").slideToggle("slow",function(){
							// On vide
							$("div#compteur").html("");
							for(var i=0; i<nb.length; i++)
							{
								$("div#compteur").append("<div class='number' style='display:none;'>"+nb[i]+"</div>");
							}
							// On réaffiche
							$("div#compteur div.number:hidden").slideToggle("slow");
						});
					}
					else
					{
						// Si le chiffre est différent de celui affiché on met à jour uniquement ce chiffre
						if (nb[pos]!=$("div#compteur div.number:eq("+pos+")").html())
						{
							$("div#compteur div.number:eq("+pos+")").slideToggle("slow",function(){
								$("div#compteur div.number:hidden").html(nb[pos]);
								$("div#compteur div.number:hidden").slideToggle("slow");
								// On rappel la fonction pour verifier le chiffre précédent
								verifChiffre(pos-1,nb);
							});
						}
						// Si le chiffre est inchangé alors les autres chiffres n'ont pas besoin d'être modifier
					}
				}
			}
			function majCompteur()
			{
				var nbCurrent = "";
				// On parcourt les div class number qui sont dans la div id compteur
				$("div#compteur div.number").each(function(){
					// On récupère le contenu qu'on ajoute à nbCurrent
					nbCurrent += $(this).html();
				});
				// On incrémente de 1 nbCurrent
				nbCurrent = parseInt(nbCurrent) + parseInt(1);
				// Passage du nombre en chaîne de caractères
				nbCurrent = ""+nbCurrent+"";
				// On parcourt chaque chiffre (caractère) en partant de la fin
				var i = nbCurrent.length-1;
				verifChiffre(i,nbCurrent);
			}
			$(document).ready(function(){
				setInterval('majCompteur()',5000);
			});
		</script>
	</head>
	<body>
		<div id="compteur">
			<?php
                        for ($i=0;$i<=strlen($nb);$i++)
                        {
                                echo $tab_num[$nb[$i]];
                        }
                        ?>
		</div>
	</body>
</html>