Reloj con Javascript en Twig

Monserrat Foster

unread,

Jan 28, 2013, 2:42:16 AM1/28/13

to symfo...@googlegroups.com

Hola, he intentado hacer un reloj en javascript para que lo muestre en twig, el problema es que, no actualiza automaticamente la hora, no se si es un error mio, o no estoy utilizando bien el javascript y es posible que sea un error extremadamente tonto y/o este haciendo una burrada de novato, asi que mis disculpas por adelantado.

<html>
<head>
<meta charset="UTF-8" />
<title>{% block title %}Sistema de Soporte a Usuarios TiCad{% endblock %}</title>
{% block stylesheets %}
<link rel="stylesheet" href="{{ asset ('css/style.css')}}">
{% endblock %}

<link rel="shortcut icon" href="{{ asset('favicon.ico') }}" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"/>
<script src="{{asset ('js/jquery.min.js') }}"></script>
<script src="{{asset ('js/script.js')}}"></script>
<script src="{{asset ('http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js')}}"></script>
</head>
<body>
{% if app.session.hasFlash('notice') %}
<div id="flashmessage" class="flash-notice">
{{ app.session.flash('notice') }}
</div>
{% endif %}
{% if app.session.hasFlash('info') %}
<div id="flashmessage" class="flash-notice">
{{ app.session.flash('info') }}
</div>
{% endif %}
<div id="top-bar">
{% block bar %}
<div class="page-full-width cf">
<ul id="nav" class="fl">
<li class="v-sep"><a class="round button dark menu-user image-left">Ha iniciado sesion como <strong>{{app.user.username}}</strong></a>
<ul>
<li><a href="{{ path ('MonseUserBundle_User_show', { 'id': app.user.id })}}">Mi Perfil</a></li>
<li><a href="{{ path('logout')}}">Salir</a></li>
</ul>
</li>
<li><a class="round button dark clock image-left">
<script type="text/javascript">
var d=new Date();
var dia=new Array(7);
dia[0]="Domingo";
dia[1]="Lunes";
dia[2]="Martes";
dia[3]="Miercoles";
dia[4]="Jueves";
dia[5]="Viernes";
dia[6]="Sabado";
var mm=new Date();
var m2 = mm.getMonth() + 1;
var mesok = (m2 < 10) ? '0' + m2 : m2;
var mesok=new Array(12);
mesok[0]="Enero";
mesok[1]="Febrero";
mesok[2]="Marzo";
mesok[3]="Abril";
mesok[4]="Mayo";
mesok[5]="Junio";
mesok[6]="Julio";
mesok[7]="Agosto";
mesok[8]="Septiembre";
mesok[9]="Octubre";
mesok[10]="Noviembre";
mesok[11]="Diciembre";
var Hours;
var Mins;
var Time;
Hours = d.getHours();
if (Hours >= 12) {
Time = " P.M.";
}
else {
Time = " A.M.";
}
if (Hours > 12) {
Hours -= 12;
}
if (Hours == 0) {
Hours = 12;
}
Mins = d.getMinutes();
if (Mins < 10) {
Mins = "0" + Mins;
}
document.write("" + dia[d.getDay()]+ ", " + d.getDate() + " de " + mesok[mm.getMonth()] +" de "+ d.getFullYear()+ " - "+ Hours + ":" + Mins +" "+Time);
</script>
</a>
</li>
</ul> 
<li><a href="logout" class="round button dark menu-logoff image-left fr">Salir</a></li>

</div> 
{% endblock bar %}
</div> 


{% block body %}
{% endblock %}

{% block javascripts %}
{% endblock %}
{% block footer %}
<div id="footer">
<p>© Copyright 2013 <a href="http://www.twitter.com/monsefoster">Monse Foster</a>. Todos los derechos reservados.</p>

</div> 
{% endblock %}
</html>

Carlos Zuniga

unread,

Jan 28, 2013, 9:02:29 AM1/28/13

to symfo...@googlegroups.com

2013/1/28 Monserrat Foster <monse...@gmail.com>:

Hola, no veo que estes colocando un setInterval [0] por ningún lado.
Mueve tu código a una función y llamalo con un intervalo de 1 minuto.

En lugar de usar document.write, dale un id a tu elemento contenedor
del texto y utiliza jquery (por cierto, por que estas cargando jquery
dos veces?) para colocarlo.

En lugar de utilizar una etiqueta a, utiliza un span, ya que tu reloj
no tiene un enlace.

Y una pregunta. Por qué colocar un reloj si es más que probable que el
usuario ya tenga uno funcionando en alguna esquina de su escritorio?
;)

Saludos
[0] https://developer.mozilla.org/en-US/docs/DOM/window.setInterval
--
A menudo unas pocas horas de "Prueba y error" podrán ahorrarte minutos
de leer manuales.

Monserrat Foster

unread,

Jan 28, 2013, 9:42:31 AM1/28/13

to symfo...@googlegroups.com

Hola! Lo del Jquery fue despiste mio cuando empece a hacer la app... ya movi todo a una funcion, estaba dentro de un a es por el css que estoy usando, intente ponerlo de cantidad de otras maneras pero siempre se movia lo demas, y como mis conocimientos son basicos, me voy por lo seguro xD.

Y funciono, muchas gracias!

ahora tengo otra pregunta tecnicamente no relacionada con esto, pero es posible que me puedas ayudar, tengo

<a href="{{ path('MonseClientesBundle_desinc', { 'id': clientes.id }) }}" class="table-actions-button ic-table-active" onclick="return confirm('Está seguro que desea desincoroporar a {{clientes.razon_social}} ?')"></a>

y el alert se muestra la primera vez que doy click, pero si le doy cancelar, y pruebo a dar clic de nuevo, toma como si hubiera hecho clic en "aceptar" pero realmente nisiquiera me salio la alerta, como se arregla esto?

(En cuanto termine esto, prometo ponerme a hacer unos cursos de CSS, Javascript, Jquery y pare de contar)

Eloy González Andueza

unread,

Jan 28, 2013, 12:15:33 PM1/28/13

to symfo...@googlegroups.com

Hola:

Lo que pasa es que no estás recogiendo qué botón ha seleccionado el usuario;

Prueba lo siguiente y nos dice si te funciona.

Un saludo
<html>
<head>
<script>
function confirmar()
{
     var r=confirm("¿Estás seguro que quieres desincorporar....?")
     if (r==true)
   {

//ejecutamos código cuando pulse botón aceptar

}
else
{

//ejecutamos código cuando pulse botón cancelar

}
}
</script>
</head>
<body>

<a href="#" onclick="confirmar()" > Borrar</a>

</body>
</html>

--
--
Has recibido este mensaje porque estás suscrito al grupo "symfony-es" de Google Groups.
Para publicar en este grupo, envía un email a symfo...@googlegroups.com
Para darte de baja, envía un email a symfony-es+...@googlegroups.com
El resto de opciones puedes encontrarlas en http://groups.google.com/group/symfony-es?hl=es

Reply all

Reply to author

Forward