Foros del Web » Programando para Internet » Javascript » Frameworks JS »

notificaciones en html5, casi funcionando..

Estas en el tema de notificaciones en html5, casi funcionando.. en el foro de Frameworks JS en Foros del Web. hola gente, Estoy estudiando esto de la Api de notificaciones de html5 y he logrado que me funcione, siempre y cuando presione un boton para ...
  #1 (permalink)  
Antiguo 02/07/2012, 17:07
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Pregunta notificaciones en html5, casi funcionando..

hola gente,
Estoy estudiando esto de la Api de notificaciones de html5 y he logrado que me funcione, siempre y cuando presione un boton para ejecutar la notificación.
Lo que no puedo conseguir es que ese notificación se ejecute automaticamente al recibir una variable. Cuando hago click en este link:
Código HTML:
Ver original
  1. <a href="#" id="show_html_notification" style="margin-bottom:25px;font-size:11px;margin-left:-17px;margin-top:25px;">Activate Notification</a>

se ejecuta este script que carga un php el cual levanta datos de la BD y la notificación funciona perfectamente.

Código Javascript:
Ver original
  1. $(document).ready(function () {        
  2.         if (window.webkitNotifications) {
  3.             window.Notifications = window.webkitNotifications;                             
  4.         $('#show_html_notification').click(function () {
  5.                     if (window.Notifications.checkPermission() == 0) {
  6.                         createNotification('html');
  7.                     } else {
  8.                         window.Notifications.requestPermission();
  9.                     }
  10.                 });                            
  11.             } else {
  12.         alert('HTML 5 Notifications are not supported on this browser/OS.');
  13.         }
  14.         });        
  15.  
  16.       function createNotification(type) {
  17.     if(type != 'html')
  18.     var notification = window.Notifications.createNotification("You have received HTML 5 Notification");
  19.     else
  20.     var notification = window.Notifications.createHTMLNotification('content.php');
  21.             notification.show();
  22.         }

Yo necesito que ese boton no se necesite presionar, si no que se ejecute solo cada x tiempo (30 segundo) que es cuando se conecta a la BD y lee si hay nueva notificación, se que estoy cerca, pero no logro que ese boton se auto-presione solo y me ejecute el código javascript.

Desde ya les agradezco el tiempo prestado.
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #2 (permalink)  
Antiguo 02/07/2012, 18:18
Colaborador
 
Fecha de Ingreso: mayo-2008
Ubicación: $MX['VZ']['Xalapa']
Mensajes: 3.005
Antigüedad: 16 años, 6 meses
Puntos: 528
Respuesta: notificaciones en html5, casi funcionando..

Para empezar, tu problema es de javascript.
segundo, si analizas tu código, verás que al elemento show_html_notification le estás asignando un evento, si quieres que se ejecute la acción, o bien podrías simular el click o mejor colocas en una función ese código para que lo puedas llamar fácilmente.
  #3 (permalink)  
Antiguo 03/07/2012, 08:32
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

Hola ocp001a,

Gracias por responder.
Eso es lo que necesito pero no se como hacerlo. Estoy estudiando un manual de javascript, pero no se aprende de un dia para otro.
No te pido que me lo soluciones, pero si tienes un ejemplo o algo te lo agradeceria mucho.
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #4 (permalink)  
Antiguo 05/07/2012, 08:39
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

Hola compañeros,

Alguna idea de como puedo solucionar esto, le he estado dando vueltas pero no puedo colocar ese codigo en una funcion para poder llamarlo de alguna manera.
Necesito que se auto ejecute para que compruebe si hay o no nuevas notificaciones.

Gracias por el tiempo prestado
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #5 (permalink)  
Antiguo 05/07/2012, 09:29
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: notificaciones en html5, casi funcionando..

Consultá por el uso de setInterval()
http://www.w3schools.com/jsref/met_win_setinterval.asp

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #6 (permalink)  
Antiguo 05/07/2012, 18:55
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

Hola emprear,

Si, la función para actualizar cada x tiempo y como funciona la conozco, pero no es ese el problema. Lo que no se como hacer es una funcion que me ejecute el script que yo tengo, es decir (claro que no es asi) pero seria como:

function refrescaAutomaticamente();
{
(y aqui adentro mi script y que se ejecuta)
}

no se si me explico bien.

Gracias por tu tiempo
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #7 (permalink)  
Antiguo 05/07/2012, 19:11
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: notificaciones en html5, casi funcionando..

Es mas o menos asi
vos tenes esto

Código Javascript:
Ver original
  1. $('#show_html_notification').click(function () {
  2.                     if (window.Notifications.checkPermission() == 0) {
  3.                         createNotification('html');
  4.                     } else {
  5.                         window.Notifications.requestPermission();
  6.                     }
  7.                 });                            
  8.             } else {
  9.         alert('HTML 5 Notifications are not supported on this browser/OS.');
  10.         }
  11.         });

estás usando jQuery para que en el evento click se genere la notificación, vos decis que no necesitas de ese click. Entonces quitamos el click, definis una función, y le haces setInterval para que se ejecute cada minuto, o el tiempo que desees

Código Javascript:
Ver original
  1. function notificar(){      
  2.         if (window.webkitNotifications) {
  3.             window.Notifications = window.webkitNotifications;                              
  4.  
  5.                     if (window.Notifications.checkPermission() == 0) {
  6.                         createNotification('html');
  7.                     } else {
  8.                         window.Notifications.requestPermission();
  9.                     }
  10.                            
  11.             } else {
  12.         alert('HTML 5 Notifications are not supported on this browser/OS.');
  13.         }
  14.      
  15.  }


<body onload="setInterval('notificar()', 60000"> --> 1 minuto
El alert indicando que el navegador no soporta el método, lo pondria fuera de la función notificar para que se ejecute solo una vez.

Te aclaro que tus funciones no las revisé, supongo que tu "casi", significa que están bien
SAludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #8 (permalink)  
Antiguo 05/07/2012, 20:23
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

Hola emprear,

Lo voy a chequear y te digo.
La verdad que del "casi" funcionando, en realidad esta funcionando, el problema es que para ver la notificacion le tengo que dar click al boton de notificacion y asi no sirve, la idea es que cada ves que recibo una notificacion salte automaticamente, no se si me explico.
Funcionar, funciona y bien, pero manualmente, entonces pense, (o algo así) si en ves de darle click al boton puedo hacer que esa función se autoejecute cada x tiempo, al momento de recibir una nueva notificacion ya la veré por que al actualizarse la carga....

Lo chequeo y te digo, si sale un diez para vos...

Saludos y gracias por tu tiempo
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #9 (permalink)  
Antiguo 05/07/2012, 20:59
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: notificaciones en html5, casi funcionando..

Primero, te corrijo un error que cometí, me comí un parentesis final en

<body onload="setInterval('notificar()', 60000)">
Demo
http://emprear.com.ar/html5/noti.html

El automático esta solo para el boton "notify" (saque la script de otro lado)
Pero detecto un problema, para que Chrome te pida la autorización, si no uso el botón, no pasa nada, una vez que autoricé se recarga sin problemas. lo hice medio exagerado, cada 10 segundos

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.

Última edición por emprear; 06/07/2012 a las 11:28 Razón: ortografía
  #10 (permalink)  
Antiguo 05/07/2012, 21:53
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

Lo que haz echo esta fantastico.
Lo unico que no entiendo es, cual es el sentido de tenerlo en texto plain y html?
Se podria eliminar uno de estos no?, digo, para achicar el codigo.
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #11 (permalink)  
Antiguo 05/07/2012, 22:12
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: notificaciones en html5, casi funcionando..

Ahi la modifiqué para que veas que hace con html... (tenes que dar click al botón)
Tampoco hay que poner algo muy pesado, se sobreentiende que es para dar una información mínima, un pequeño logo con un texto y un link x ejemplo
Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #12 (permalink)  
Antiguo 06/07/2012, 09:09
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

Hola emprear,

esto esta muy bien, pero que muy bien.
Me he pasado toda la noche pensando y me preguntaba.
De la forma que lo tengo yo ahora es la siguiente:
Yo utilizo la version html por que cargo un php, este php
se conecta a la BD y si el campo Notificacion recibe un dato(por medio de un form)
me muestra una leyenda y el usuario, si no hay dato la notificion se muestra igual
pero vacia.
Entonces he pensado que tal ves se pueda mezclar javascript y php.
Por ej. el script que tenemos de la notificacion se divide en dos partes (o tres si dejamos el texto plano).
esta:
Código Javascript:
Ver original
  1. if (!window.webkitNotifications) {
  2.         alert('Sorry , your browser does not support desktop notification. Try Google Chrome.');
  3.     }
  4.         function RequestPermission (callback)
  5.     {
  6.         window.webkitNotifications.requestPermission(callback);
  7.     }
que chequea si se permiten o no las notificaciones, y esta:
Código Javascript:
Ver original
  1. function notification ()
  2.     {
  3.         if (window.webkitNotifications.checkPermission() > 0) {
  4.             RequestPermission(HTMLnotification);
  5.         }
  6.        
  7.         var popup = window.webkitNotifications.createHTMLNotification('content.php');
  8.         popup.show();
  9.         setTimeout(function()
  10.         {
  11.         popup.cancel();
  12.         }, '20000');
  13.     }
que ejecuta notificacion y si el permiso esta dado crea el pop up cargando el archivo php.

Ahora mi pregunta y duda es, de que forma se puede conectar con php, para que realize el setInterval pero que solo se muestre el popup si el campo notificacion de la BD tiene x dato?,
o sea, la linea
Código Javascript:
Ver original
  1. var popup = window.webkitNotifications.createHTMLNotification('content.php');
se tendría que ejecutar dentro de php para que cheque si hay datos y si hay que pase a la siguiente popup.show();

Por que aunque esto funciona bien en realidad es un bucle que cheque un campo de la BD y si tiene x dato lo muestra en el popup, cuando en realidad se tendría que mostrar cuando recibe un datos (email, ingreso en BD, ex).

Bueno, si tienes alguna idea o por donde puedo empezar a echarle mano te lo agradezco, yo creo que se podría crear un muy buen código de notificación que no existe del todo con javascript y php o por lo menos yo no lo conozco.

Saludos
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..
  #13 (permalink)  
Antiguo 06/07/2012, 11:24
Avatar de emprear
Colaborador
 
Fecha de Ingreso: junio-2007
Ubicación: me mudé
Mensajes: 8.388
Antigüedad: 17 años, 4 meses
Puntos: 1567
Respuesta: notificaciones en html5, casi funcionando..

Estamos llegando a un punto en que requiriría pruebas que ahora no tengo tiempo de hacer. solo te dejo la idea

hacés una consulta al php via ajax y segun los resultados, llamas a la función notificación() ó no (el setInterval sería para la llamada a ajax, no para la notificación)

Pero para serte sincero, en tanto esta api solo sea soportada al momento por Chrome, mucha importancia no le doy, se pueder hacer con javascript creando una capa que se muestre a intervalos

Saludos
__________________
La voz de las antenas va, sustituyendo a Dios.
Cuando finalice la mutación, nueva edad media habrá
S.R.
  #14 (permalink)  
Antiguo 06/07/2012, 15:41
 
Fecha de Ingreso: agosto-2008
Ubicación: Miami, FL
Mensajes: 210
Antigüedad: 16 años, 2 meses
Puntos: 2
Respuesta: notificaciones en html5, casi funcionando..

ok, no había caído en la cuenta que solo funciona con chrome, pense que como era html5 y javascript funcionaba en cualquier browser.
Bueno, seguiré tirando así, dentro de todo me funciona igual.

Saludos y gracias
__________________
Se invierte mas dinero en cirugía de pechos y viagra que en la cura del Alzheimer. En unos años tendremos viejas con grandes tetas y viejos con erecciones pero que no recordarán para que sirven..

Etiquetas: html5, javascript, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 11:33.