Como contar las visitas de los usuarios en un cookie mediante JavaScript

feranimaciones · #1 (**permalink**) 16/05/2012, 20:26

Me explico, yo agrego los usuarios mediante un input, supongamos que agrego a "Juan Bananas", se guarda en el cookie cosa que ya logre. Lo que no eh logrado es hacer que "Juan Bananas" al momento de refrescar me cuente las visitas, pero llega un momento en donde agrego un nuevo usuario supongamos "Bananas Juan" y el contador de Bananas Juan empieza en 0 de igual forma refresco y se guardan las visitas. Pero si vuelvo a seleccionar a "Juan Bananas" el contador debe de estar donde se quedo anteriormente.
Lo eh intentado creando el cookies con el nombre del usuario y en el contenido la cuenta de visitas, pero aun no logro hacerlo funcionar, ese es mi problema guardar la cantidad de visitas en un usuario determinado.

Comparto el código:
======================================…
Posiblemente no funcione de tanto que le eh movido.

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-…
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Actividad 5 JavaScript</title> 
 <script language="JavaScript">
 var visitas;
 function crearcookie() 
 {
 var nom=document.getElementById('nombre').va…
 if(nom==null || nom== NaN || nom=="") 
 {  
 alert("Ingrese un nombre por favor.")
 }
 else
 {
 visitas=null;
 var sCadena = nom + "=" + visitas + "; "; 
 var fFecha = new Date(); 
 fFecha.setTime(fFecha.getTime() + (1 * 86400000)); 
 sCadena += "expires=" + fFecha.toGMTString() + "; "; 
 sCadena += "path=/Raudell_praccticas"; 
 //alert("creando cokkie")
 //alert(sCadena) 
 document.cookie = sCadena; 
 alert("Agregado."); 
 }
 }
 function Contador(info){
 // Cuántas veces
 var cuenta = getCookie(nom)
 if ( cuenta== null) {
 cuenta = 0; 
 }
 else{
 cuenta++; 
 }
 setCookie (nom, cuenta, caduca);
 return cuenta+1;
 } 
 </script>  
 </head>
   <body >
  <p>Bienvenido extraño.</p>
  <p>Ingrese su nombre visitante: </p> 
  <input type="nombre" id="nombre" style="width:500px"> 
  <input type="button" name="agregar" value="agregar" onclick="crearcookie()" />  
  <script LANGUAGE="JavaScript">
  <!--
  var visitas = Contador();
  if ( visitas == 1 ) 
  {
    document.write("Hola, esta es la primera vez que visitas esta página. ");
  }
  else
  { 
    document.write("Hola, has visitado esta página <b>" + visitas + "</b> veces. ")
  }
  if(visitas==5)
  {
   document.write("Has ganado un carro ")  
  }
  //-->
 </script> 
 </body>
</html>

======================================…
De antemano gracias.

emprear · #2 (**permalink**) 16/05/2012, 23:48

En primer lugar, Bienvenido a FDW @feranimaciones, en segundo, un buen tutorial sobre cookies
http://www.w3schools.com/js/js_cookies.asp
está en inglés pero es facil de entender...

Ejemplo, por algun lado tenés
var cuenta = getCookie(nom)
sencillamente no existe un método ó función de javascript que se llame getCookie(), en todo caso, deberías crear una función a tal efecto, idem para setCookie()....

te dejo una pequeña librería para escribir, leer y borrar cookies, cargala desde un archivo js externo, y después intenta hacer tu script llamando a esas funciones
cookies.js

Código Javascript:

Ver original/******************
funciones para creación, lectura y borrado de cookies
ejempo de establecimiento de una cookie
<a href="crearCookie('color','rojo','1','');>Crear cookie de nombre color, con valor rojo que expirará en 1 día</a>
El valor para horas no se tendrá en cuenta si se especifican dias, 
para que la cookie expire en determinada cantidad de horas, 
indicar el 4º parámetro y el de las horas dejarlo en blanco, pero respetando las comillas simples.
crearCookie('color','rojo','','1') --> la cookie cadicará en 1 hora
emprear(c)2006
[email protected]
******************/
 
 
function crearCookie(nombre,valor,dias,horas) {
    if (dias) {
        var fecha = new Date();
        fecha.setTime(fecha.getTime()+(dias*24*60*60*1000));
        var expires = "; expires="+fecha.toGMTString();
    }else if (!dias && horas){
        var fecha = new Date();
        fecha.setTime(fecha.getTime()+(horas*60*60*1000));
        var expires = "; expires="+fecha.toGMTString();
}
    else var expires = "";
    document.cookie = nombre+"="+valor+expires+"; path=/";
}
 
function leerCookie(nombre) {
    var nombreCO = nombre + "=";
    var ca = document.cookie.split(';');
    for(var i=0;i < ca.length;i++) {
        var c = ca[i];
        while (c.charAt(0)==' ') c = c.substring(1,c.length);
        if (c.indexOf(nombreCO) == 0) return c.substring(nombreCO.length,c.length);
    }
    return null;
}
 
function borrarCookie(nombre) {
    crearCookie(nombre,"",-1);
}

Saludos

feranimaciones · #3 (**permalink**) 17/05/2012, 23:25

Gracias @emprear leei la pagina, ya logre sacar mis dudas. Y logre terminar mi código. De ante mano gracias :).

PD. Mañana pongo la solución a este problema.

feranimaciones · #4 (**permalink**) 18/05/2012, 11:22

Aquí el código terminado.

Código HTML:

Ver original<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Actividad 5 JavaScript</title>
 <script type="text/javascript">
  /* Fernando Manuel
  */ 
 function getCookie(c_name)
 {
 var i,x,y,ARRcookies=document.cookie.split(";");
 for (i=0;i<ARRcookies.length;i++)
   {
   x=ARRcookies[i].substr(0,ARRcookies[i].indexOf("="));
   y=ARRcookies[i].substr(ARRcookies[i].indexOf("=")+1);
   x=x.replace(/^\s+|\s+$/g,"");
   if (x==c_name)
     {
      return unescape(y);
     }
   }
 }  
 function setCookie(c_name,value,exdays)
 {
  var exdate=new Date();
  exdate.setDate(exdate.getDate() + exdays);
  var c_value=escape(value) + ((exdays==null) ? "" : "; expires="+exdate.toUTCString());
  document.cookie=c_name + "=" + c_value;
 }
 function checkCookie()
 {
  var username=getCookie("ultimo");
  if (username!=null && username!="")
  {
    //username=username.replace("2","1")
    var visita=getCookie(username);
    visita=parseInt(visita);
    visita+=1;
    setCookie(username,visita,365);
    if(visita==5)
    {
     alert("Bienvenido de nuevo, sus visitas "+ visita + " ,del usuario "+ username+" Usted a ganado un auto al ser la visita 5"); 
    }
    else
    {
     alert("Bienvenido de nuevo, sus visitas " + visita +" ,del usuario " + username+"."); 
    }
   }
   else 
   {
    username=prompt("Porfavor Ingresa tu nombre:  ","");
    if (username!=null && username!="")
    {
      username=username;
      alert("Es la primera ves que visita este sitio "+username+" bienvenido.")
      setCookie(username,1,365);
      setCookie("ultimo",username,365);
    }
   }
  }
  function ademas()
  {
   username=prompt("Porfavor Ingresa tu nombre:  ","");
    if (username!=null && username!="")
    {
      username=username;
      alert("Es la primera ves que visita este sitio "+username+" bienvenido.")
      setCookie(username,1,365);
      setCookie("ultimo",username,365);
    } 
  }
  function cambiar()
  {
    username=prompt("Porfavor Ingresa tu nombre:  ","");
    if (username!=null && username!="")
    {
     // var esta=getCookie("username");
      var esta=username;     
      if(esta!=null && esta!="")
      {
       setCookie("ultimo",esta,365);         
       var visitaa=getCookie(ultimo);
       visitaa=parseInt(visitaa);
       visitaa+=1;
       setCookie("ultimo",visitaa,365);
       alert("Bienvenido de nuevo "+esta+", visitas "+ visitaa+".");
      }
      else
      {
       alert("No se encuntra ningun usurio. o ya esta en linea")
      }
    }
  }
 </script>
 </head>
 <body onload="checkCookie()">
  <p>¿Agregar a alguin mas?</p>
   <input type="button"  name="boton1" value="Agregar"  onclick="ademas()" />  
 <p>¿Cambiar a un usuario registrado?</p>
   <input type="button"  name="boton2" value="Cambiar"  onclick="cambiar()" />  
 </body>
</html>