JavaScript - Busco ayuda con Proyecto CountUp

   
Vista:

Busco ayuda con Proyecto CountUp

Publicado por Jose Soto (2 intervenciones) el 24/08/2015 07:16:25
Buenas a todos

La consulta es sobre un proyecto de contador que estoy realizando a golpe y porrazo, leyendo, viendo tutoriales y aprendiendo a pasos...

y en una parte del proyecto, me pregunto si la fecha para que el contador hacia adelante funcione, podria traerse desde una dB, ... Les dejo el codigo para explicar mejor

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
window.onload=function() {
    // Mes,Dia,Año,Hora, Minutos, Segundos
  	upTime('aug,23,2015,16:32:00'); // ****** Modificar esta lineas! document.getElementById('countup').setAttribute("uptime",days+':'+hours+':'+mins+':'+secs)
	}
	function upTime(countTo) {
  	now = new Date();
  	countTo = new Date(countTo);
  	difference = (now-countTo);
 
		  //days=Math.floor(difference/(60*60*1000*24)*1);
		  hours=Math.floor((difference%(60*60*1000*24))/(60*60*1000)*1);
  		mins=Math.floor(((difference%(60*60*1000*24))%(60*60*1000))/(60*1000)*1);
  		secs=Math.floor((((difference%(60*60*1000*24))%(60*60*1000))%(60*1000))/1000*1);
    	document.getElementById('countup').setAttribute("uptime",hours+':'+mins+':'+secs)
  		//document.getElementById('days').firstChild.nodeValue = days;
  		document.getElementById('hours').firstChild.nodeValue = hours;
  		document.getElementById('minutes').firstChild.nodeValue = mins;
  		document.getElementById('seconds').firstChild.nodeValue = secs;
 
  clearTimeout(upTime.to);
  upTime.to=setTimeout(function(){ upTime(countTo); },1000);
}

La parte que me interesa saber o que me guien respecto de como podria lograrlo es la siguiente:

||||| upTime('aug,23,2015,16:32:00'); |||||

Donde esta la fecha, me gustaria saber si se podria ingresar un dato a mySQL y obtener de ahi la fecha para que el reloj comience en 0 y termine a los 120 minutos y al llegar a ese tiempo me entregue un mensaje.

Desde ya muchas gracias y cualquier acotacion o sugerencia es bien recibida !!
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de xve

Busco ayuda con Proyecto CountUp

Publicado por xve (1594 intervenciones) el 24/08/2015 12:06:22
Hola Jose, lo que tu quieres, es un simple contador, que al llegar a 120 segundos te de un mensaje, no?

No entiendo muy bien por que quieres utilizar el mysql...

Te he modificado el código: http://www.lawebdelprogramador.com/codigo/JavaScript/2774-Simple-Cronometro-en-javascript.html para que al llegar a los 120 segundos te muestre el mensaje.

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
<!DOCTYPE html>
<html lang="es">
<head>
	<meta charset="utf-8">
	<title>Simple Cronometro en javascript</title>
	<meta name="title" content="Cronometro en javascript">
	<meta name="description" content="Cronometro en javascript">
	<meta name="keywords" content="código,cronometro,javascript">
 
	<script>
	var inicio=0;
	var timeout=0;
 
	function empezarDetener(elemento)
	{
		if(timeout==0)
		{
			// empezar el cronometro
 
			elemento.value="Detener";
 
			// Obtenemos el valor actual
			inicio=vuelta=new Date().getTime();
 
			// iniciamos el proceso
			funcionando();
		}else{
			// detemer el cronometro
 
			elemento.value="Empezar";
			clearTimeout(timeout);
			timeout=0;
		}
	}
 
	function funcionando()
	{
		// obteneos la fecha actual
		var actual = new Date().getTime();
 
		// obtenemos la diferencia entre la fecha actual y la de inicio
		var diff=new Date(actual-inicio);
		if(parseInt(diff.getTime()/1000)>=120)
		{
			alert("Final!!!");
		}else{
			// mostramos la diferencia entre la fecha actual y la inicial
			var result=LeadingZero(diff.getUTCHours())+":"+LeadingZero(diff.getUTCMinutes())+":"+LeadingZero(diff.getUTCSeconds());
			document.getElementById('crono').innerHTML = result;
 
			// Indicamos que se ejecute esta función nuevamente dentro de 1 segundo
			timeout=setTimeout("funcionando()",1000);
		}
	}
 
	/* Funcion que pone un 0 delante de un valor si es necesario */
	function LeadingZero(Time) {
		return (Time < 10) ? "0" + Time : + Time;
	}
	</script>
 
	<style>
	.crono_wrapper {text-align:center;width:200px;}
	</style>
</head>
 
<body>
<?php
include($_SERVER['DOCUMENT_ROOT']."/inc/headerCode.inc.php");
?>
 
<h1>Simple Cronometro en javascript</h1>
 
<div class="crono_wrapper">
	<h2 id='crono'>00:00:00</h2>
	<input type="button" value="Empezar" onclick="empezarDetener(this);">
</div>
 
<p>Puedes ver el código fuente en <a href="http://lwp-l.com/s2774">http://lwp-l.com/s2774</a></p>
 
<?php
include($_SERVER['DOCUMENT_ROOT']."/inc/footerCode.inc.php");
?>
 
</body>
</html>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar
Imágen de perfil de Vainas

Busco ayuda con Proyecto CountUp

Publicado por Vainas (239 intervenciones) el 24/08/2015 19:16:34
Buenas:

Tampoco entiendo por que quieres usar mysql....

Si quieres la fecha actual del lado del cliente puedes usar javascript y Date.

Si quieres la fecha actual del lado del servidor puedes usar por ejemplo php y algunas de sus funciones para fecha.

Si quieres una fecha de una bbdd es por que la has almacenado alli para guardarla (como por ejemplo un cumpleaños o la fecha de la compra de algo o el extreno de una pelicula....).

Saludos.
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
1
Comentar

Busco ayuda con Proyecto CountUp

Publicado por Jose Soto (2 intervenciones) el 24/08/2015 20:35:14
Muchas gracias por sus respuestas...

Si bien, para un proyecto distinto podria ser posible usar lo que me sugieren, para el proyecto en el que estoy trabajando no me sirve, ya que la fecha y hora de comienzo y final la colocaria el usuario final, por medio de un formulario ingresando esos datos a la dB.

El motivo de esto es por que la o las personas que tendrian que hacer funcionar el contador son usuarios que no conocen el funcionamiento del sistema interno, no es que yo sea el experto, pero decirle a un usuario que modifique un archivo para hacer duncionar un reloj y hacerlo en cada evento, que podrian ser 6 o 10 por dia, es poco practico.

Mi idea es poder ingresar esa fecha y hora de comienzo por medio de un form a la dB, llamar ese dato de la dB para que automaticamente, al momento en que se ejecutara la accion, comience solo y termine solo.

Como el reloj de un partido de ... futbol por ejemplo, que comienza en 0 y termina en 45"... esa es mi consulta. !!

Gracias nuevamente por sus sugerencias.

para acotar, adjunto imagen, donde se ven los equipos y arriba hay un reloj, que no vuelve a cero cuando actualizo y termina a los 45" es del sitio bet 365

vh6ly1
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar