El lunes 1 de marzo se acaba la posibilidad de enviar notificaciones a los usuarios de Facebook vía aplicación.

Cómo ya os he comentado alguna vez Facebook es una plataforma que está cambiando constantemente, así que más nos vale tener claro que cuando hacemos una aplicación dentro de un tiempo siempre vamos a tener que retocarla para ajustarla a estos cambios de la plataforma.

Las cajas de diálogo son un elemento muy útil para informar a los usuarios o para solicitar su aprobación para una determinada acción. Este tipo de cajas son muy utilizadas por las aplicaciones de escritorio y por muchas webs.

Facebook nos ofrece la posibilidad de mostrar este tipo de cajas, ya sea utilizando FBML o utilizando FBJS. En este post os voy a explicar como mostrar una caja de diálogo con FBML.

Os pongo aquí mi pequeño ejemplo:

<fb:dialog id="cajaDialogo" cancel_button=1>
  <fb:dialog-title>Título de la caja de diálogo
  <fb:dialog-content>&iquest Quieres probar la pregunta?
      <form id="miFormulario">
        <p/>
        <input type="radio" name="like_dialog" value="yes"/>Sí
        <br/>
        <input type="radio" name="like_dialog" value="no"/>No
        <p/>
      </form>
  </fb:dialog-content>
  <fb:dialog-button type="submit" value="Yes" form_id="miFormulario" />
</fb:dialog>

Haz click aquí para mostrar el <a href="#" clicktoshowdialog="cajaDialogo">diálogo</a>

Cómo veis para mostrar la caja hay que mostrarla utilizando un evento de Facebook en el enlace.

Ayer di una charla sobre el desarrollo de aplicaciones para Facebook en Tucamon dentro de las actividades que organiza ADWA en Alicante.

En la web de ADWA han colgado la presentación que utilicé como apoyo para mi conferencia por si alguno quiere descarcargársela.

La conferencia estuvo estructurada en torno a 3 partes:

• ¿Qué es una aplicación de Facebook?
• Anatomía y tecnología de una aplicación de Facebook.
• Cómo crear tu primera aplicación en Facebook paso a paso.

En cuanto cuelguen el vídeo de la charla os lo adjuntaré en Faceblog.

La foto la hizo Andrés Karp de ADWA.

Hay dos maneras de hacerlo:

1. Cargando la película Flash desde FBML a través del parámetro flashvars con el tag fb:swf.
   Os pongo aquí un ejemplo: <fb:swf swfbgcolor=”000000″ imgstyle=”border-width:3px; border-color:white;” swfsrc=’http://www.videojuegosparachicas.com/facebook/memorion/php/swf/memorion.swf’ imgsrc=’http://www.videojuegosparachicas.com/src/almacen/miniaturas/578.jpg’ width=’640′ height=’480′ flashvars=’foto=1.jpg&uid=1&fotos=foto1.jpg’ />

2. Cargando desde dentro de la película Flash un fichero XML programado con los datos. Os pongo aquí el código de un fichero PHP de ejemplo que muestra la foto grande de un usuario cuyo identificador suministramos vía querystring con la variable userid:

   <?php
   // the facebook client library
   include_once 'php/facebook.php';
   
   $appapikey = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
   $appsecret = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx';
   
   $facebook = new Facebook($appapikey, $appsecret);
   
   //$user_id = $facebook->require_login();
   session_id(preg_replace("/[^A-Za-z0-9-]/","",$facebook->api_client->session_key));
   session_start();
   
   $fql = "SELECT pic_big FROM user WHERE uid=642932973";
   $resultado2 = $facebook->api_client->fql_query($fql);
   
   foreach($resultado2 as $datos2){
   	$datos = $datos2["pic_big"];
   }
   
   header ("content-type: text/xml");
   echo('<?xml version="1.0" encoding="UTF-8"?>');
   ?>
   <foto><![CDATA[]]></foto>

Cómo veis no es nada complicado.

Muchas veces nos interesa en una aplicación poder saber que amigos del usuario han agregado también la aplicación para poderle ofrecer al usuario esa información.

Por ejemplo, en la tabla de records de un juego es agradable para el usuario no sólo ver los records totales, si no ver también las mejores puntuaciones de sus amigos.

¿Cómo podemos saber que amigos del usuario son usuarios de nuestra aplicación?

Bueno, podemos optar por el método más “duro” que es contrastar nuestra lista de usuarios con la lista de amigos del usuario.

Afortunadamente Facebook nos lo pone más fácil y nos da la opción de obtener ese listado de amigos a través de un método de su API, getAppUsers, este método pertenece a la clase Friends, así que la expresión completa vendría a ser Friends.getAppUsers.

Los parámetros de esta función serían los siguientes:

• api_key: La clave api de la aplicación.
• session_key: El identificador de sesión del usuario.
• call_id: El identificador de la petición a la API, Facebook recomienda utilizar el tiempo actual en microsegundos.
• sig: El hash en MD5 con todos los parámetros para autentificar la petición.
• v: La versión de la API, como siempre es “1.0″.

Hay dos parámetros opcionales:

• format: El formato en el que se devuelve el resultado, puede ser XML (por defecto es este) o JSON.
• callback: Función a ejecutar una vez se ha obtenido la respuesta, este parámetro está especialmente pensado para cuando hacemos la llamada desde Javascript.

Para los que no hayáis ejecutado nunca métodos con la API os remito a este post en el que explico cómo utilizar la API de Facebook con PHP.

FBML nos ofrece la posibilidad de redireccionar el navegador a una nueva página web, pero dentro del entorno canvas de nuestra aplicación, eso sí.

Podemos con el tag fb:redirect, os pongo el siguiente ejemplo:

<fb:redirect url=”http://apps.facebook.com/moonstarhunter/?prueba=1″ />

¿Qué utilidad práctica nos ofrece el uso de este tag?

Por ejemplo sirve por ejemplo para ordenar desde el navegador un cambio de página cuando se cumple una condición (por ejemplo el uso del Internet Explorer 6) o para procesar una serie de datos de un formulario con PHP y redireccionar inmediantamente a otra página para impedir que el usuario al pulsar el botón de volver atrás no pueda provocar un fallo.

El único atributo que usa este tag es el de url, que sirve para configurar como es obvio la dirección web de destino.

Facebook es una red social muy abierta para los desarrolladores externos, está pensada para ponernos fácil a los desarrolladores crear aplicaciones de una manera rápida.

La plataforma para desarrollar aplicaciones para Facebook está formada por los siguientes elementos:

• Facebook API: Son un conjunto de clases enfocadas a darnos acceso a los datos almacenados en Facebook, como todas las clases hay una serie de elementos y propiedades con los que podremos obtener las fotos de un usuario, sus amigos, etc. Estas liberías se utilizan en conjunción con un lenguaje de programación como por ejemplo el PHP.
• FBML: Es el lenguaje de marcas de Facebook, sirve para hacer más sencillo el proceso de integrar las aplicaciones externas en Facebook, tanto a nivel visual como a nivel de contenidos almacenados en esta red social.
• XFBML: Es una extensión del FBML pensada para ser utilizada con Facebook Connect y con las aplicaciones desarrolladas en modo iframe, es bastante más limitado que el FBML.
• FQL: Es una clase que permite acceder a las bases de datos de Facebook al estilo de MySql pero con filtros de seguridad activados para impedir problemas de seguridad.
• FBJS: Es el javascript de Facebook, basado en este lenguaje en parte pero con muchas diferencias y bastantes limitaciones.

Normalmente para desarrollar una aplicación de Facebook, tendremos que utilizar casi todas estas tecnologías.

Os pongo aquí el ejemplo en el cual mostramos en pantalla todas la foto grade del perfil de tus amigos, para que el ejemplo funcione las librerías de la API de Facebook deben estar en la subcarpeta llamada phpdentro del mismo directorio que el fichero que ejecuta este código:

<?php
// the facebook client library
include_once 'php/facebook.php';

$appapikey = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'; // Aquí va tu api key
$appsecret = 'xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx'; // Aquí va tu código secreto

$facebook = new Facebook($appapikey, $appsecret);

$user_id = $facebook->require_login();
session_id(preg_replace("/[^A-Za-z0-9-]/","",$facebook->api_client->session_key));
session_start();

$fql = "SELECT uid2 FROM friend WHERE uid1=". $user_id;
$resultado = $facebook->api_client->fql_query($fql);

foreach($resultado as $datos){
	$fql2 = "SELECT pic_big FROM user WHERE uid=". $datos["uid2"];
	$resultado2 = $facebook->api_client->fql_query($fql2);

	foreach($resultado2 as $datos2){
		echo("<img src='". $datos2["pic_big"] ."' alt="foto" /><br/>";
	}
}

?>

fbFund es un fondo de Facebook de 10 millones de dólares que financia una incubadora de proyectos para mejorar su red social. Se convocan de manera anual y no sólo incluye inversiones de 25.000 a 100.000 dólares por proyecto sino que además te otorga asistencia completa por parte del personal de desarrollo de Facebook.

Este año los proyectos elegidos han sido los siguientes:

• Frintro
• Funji
• Gameyola
• Life360
• MyChurch.org
• Navify
• Nutshell Mail
• Networked Blogs
• Paradise Paintball 3D
• Photos I Like
• RentMineOnline
• RunThere
• Sortuv
• TravelBrain/GeckoGo
• Weardrobe
• Workstir
• Worldly Developments
• RunMyErrand
• Samasource
• Vittana

En los próximos días Facebook nos irá dando más información de los mismos, si alguno de ellos es interesante os mantendré al corriente

El año que viene a ver si alguno de vosotros (y yo mismo) se anima a presentarse al concurso.

Cuando desarrollamos una aplicación no siempre nos interesa que todas las secciones sean accesibles para todos los usuarios, hay secciones, como por ejemplo las páginas de administración a las que sólo queremos que accedan unos pocos usuarios.

¿Cómo hacemos entonces?

Pues Facebook nos lo pone muy fácil, con la función require_login() obligamos al usuario a acceder a la aplicación con su usuario y su clave de Facebook. En el caso de tener ya el usuario conectado no muestra al usuario de nuevo el formulario de acceso.

La respuesta de la función es el identificador del usuario de Facebook de tal manera que si tienes almacenado en base de datos o en un array un listado de identificadores autorizados tan sólo tendrás que comprobar que el identificador esté en tu lista.

Aquí va un ejemplo rápido:

<?php

$adminId = “123456″;

$userId = require_login();

if($adminId==$userId){
echo(“Eres el administrador”);
}else{
echo(“No eres el administrador”);
}

?>