Una de las posibilidades que nos brinda la plataforma Facebook para crear aplicaciones es la de tener diálogos con el Look&Feel de la propia red social. Y todo esto sin crujirnos la cabeza para hacerlos. Podemos hacer diálogos simples (con un botón) o de decisión (con dos botones), y además pueden ser pop-ups:
o contextuales:
Para ello sólo bastan algunas líneas de FBJS:
1 2 3 4 5 6 7 | var usuario_pulsa_ok = function() { // Ejecutaremos este código cuando el usuario acepte el diálogo }; var dialog = new Dialog(Dialog.DIALOG_POP); dialog.onconfirm = usuario_pulsa_ok; dialog.showMessage('Test de diálogo', 'Sólo tienes una salida ! Pulsar Ok', 'Ok'); |
Con este código vemos un diálogo simple con un texto y un mensaje de Ok, si quisiéramos hacer este diálogo contextual deberíamos cambiar DIALOG_POP por DIALOG_CONTEXTUAL. Y si quisiéramos que el diálogo se cerrara automáticamente pasados unos segundos:
1 | setTimeout(function(){ dialog.hide(); }, 2000); // Cerrar tras 2 segundos |
Un diálogo de dos botones sería también así de fácil (basta con cambiar de método a la hora de mostrarlo:showMessage por showChoice. Quedaría así:
1 2 3 4 5 6 7 8 9 10 11 12 13 | var cerrar = function() { // Se ejecutará esto cuando el usuario cancele el diálogo (responda no a la pregunta, o lo cierre) } var aceptar = funcion () { // Se ejecutará esto cuando el usuario acepte la pregunta. } var dialog = new Dialog(Dialog.DIALOG_POP); dialog.oncancel = cerrar; dialog.onconfirm = aceptar; dialog.showChoice('¿Esta seguro?', '¿De verdad que no te gusta la nueva versión de Facebook?', 'Sí, prefiero la anterior', 'No, renovarse o morir'); |
Ahora sólo queda una cuestión pendiente, estos diálogos aún tienen más posibilidades, aunque están llenas de bugs, dentro de los diálogos se acepta texto, imágenes, divs, tablas y lo que queramos, aunque hay que introducirlo todo de una forma especial y no siempre va a funcionar. Sólo necesitamos crear una fb-string:
1 |
Y podemos hacer esto más sencillo con una función en PHP que introduzca los contenidos dentro del tag:
1 2 3 4 | function facebook_fbstr($var, $string) { echo '<fb:js-string var="'.$var.'">'."\n".$string."\n".'</fb:js-string>'."\n"; } |
Así cuando llamemos al diálogo, sólo tendremos que poner:
1 | dialog.showMessage(loquequierodentrodeldialogo, 'Pulsa Ok', 'Ok'); |
Aunque esta última característica es muy bonita, puede ser que en ocasiones necesitemos para que funcione correctamente eliminar las cookies del navegador, o incluso cerrar y reabrir sesión, y ya sabemos que a un usuario normal no le podemos decir eso, ya que se cabrearía y no usaría nuestra aplicación (a no ser que fuera vital para su existencia); tampoco le podemos decir que la culpa la tiene Facebook ya que aunque los usuario vean todos los días fallar a Facebook, cuando pasa en tu aplicación, la culpa la tienes tú… por lo tanto, me reservo para una futura entrega una solución un poco más original para hacer que siempre funcionen los diálogos más complicados.
Pingback: Bitacoras.com /
When playing Quordle, you must guess four words simultaneously as opposed to a five-letter word.
This is a great inspiring article. I am pretty much pleased with your good work. You put really very helpful information.
It’s a game. Five dollars is free. Try it It’s not an easy game ->-> 토토사이트.com