Emanuele Feronato » Facebook

Develop Flash Facebook applications with Facebook Graph API Development with Flash

Emanuele Feronato — Thu, 20 Jan 2011 21:51:35 +0000

The latest result of my collaboration with Packt Publishing is Facebook Graph API Development with Flash by Michael James Williams, who also owns a blog about Flash game developing.

Michael is an excellent writer and I was pleased to be the reviewer of this book.

Yes, it’s me!! I’ve carefully read the book page by page, image by image, and I have to say it’s a great resource both for developers trying to make Flash Facebook applications and for everyone looking for a guide on the Facebook Graph API. Guaranteed by the reviewer :)

While some tutorials taken from the book will come soon (I am polishing the book I am writing during these days and I have thousands of ideas to show you once it will be on the shelves), let me show you what you’ll learn reading this book:

* Make your AS3 projects more social and personalise them for your users by adding Facebook integration
* Grab information directly from Facebook into your applications by using Facebook’s Graph API
* Securely authenticate your users with OAuth 2.0 to log them into Facebook
* Access information about your users and their friends directly from Facebook – no need to make them type it all in again
* Upload photographs, add wall posts, and create events through AS3
* Search on Facebook’s databases with the powerful Facebook Query Language
* Build an AS3 Facebook SDK that you can drop into any AS3 project to add Facebook integration
* Easily access both public and private Facebook data from the surface of a graph

If you’re looking for a book to start developing Flash Facebook applications, Facebook Graph API Development with Flash is your book.

Create a Facebook application like “Friend interview” – Step 3

Emanuele Feronato — Wed, 24 Nov 2010 17:35:58 +0000

Here we go with the 3rd step. In this tutorial you will learn how to publish a full featured feed post to your friends’ wall, and to handle “umlauts” characters like “äöü” for the pleasure of our German readers, and for every user who has friends whose names contain special characters.

This is the kind of feed you are going to publish:

And this is the link of the application, just in case you want to have a look: About you Facebook application

The code is almost similar to the one we used in step 2:


 
include_once "facebook.php";
 
$facebook = new Facebook(array('appId'=>'157934074246374','secret'=>'dontstealmysecretkey','cookie'=>true,'domain'=>'gamesalsa.com'));
 
$session = $facebook->getSession();
 
if(!$session){
	$url = $facebook->getLoginUrl(array('canvas'=>1,'fbconnect'=>0,'req_perms'=>'publish_stream','next'=>'http://apps.facebook.com/about_you_game/','cancel_url'=>'http://apps.facebook.com/about_you_game/'));
	echo "Redirecting to permission request...
";
	echo "";	
}
else{
     if($_POST[to_do]=="Answer and publish"){
          $ch=curl_init();
     	curl_setopt($ch, CURLOPT_URL, "https://graph.facebook.com/$_POST[user]/feed");
     	curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
     	curl_setopt($ch, CURLOPT_POST, 1) ;
     	curl_setopt($ch, CURLOPT_POSTFIELDS, "access_token=$session[access_token]&message=".urlencode("just answered a question about you:")."&link=".urlencode("http://apps.facebook.com/about_you_game/")."&picture=".urlencode("http://www.gamesalsa.com/aboutyou/about_you_icon.png")."&name=".urlencode("Do you think $_POST[name] likes this app ?")."&caption=".urlencode("and the answer is...")."&description=".strtoupper(urlencode($_POST[answer]))."&actions=".urlencode("{\"name\": \"Play now\", \"link\": \"http://apps.facebook.com/about_you_game/\"}"));
     	$result = curl_exec($ch);
     	curl_close($ch);
     }
	$friends = $facebook->api('me/friends');
	$number_of_friends = count($friends[data]);
	$random = rand(0,$number_of_friends-1);
	$friend_id = $friends[data][$random][id];
	$friend_name = $friends[data][$random][name];
	$img = "http://graph.facebook.com/$friend_id/picture?type=large";
}
 
?>
 


 

	


	 echo $img; ?>');background-repeat:no-repeat;padding:5px 5px 5px 210px;font:normal 16px verdana">
		Do you think  echo $friend_name; ?> likes this app?
		
		     
		      echo $friend_id;?>" />
		      echo $friend_name;?>" />

Using proper html tags such as http-equiv at line 38 allow us to properly render special characters, while the key of this post is line 20, where we pass a lot more information than in step 2.

Let’s see it in detail:

access_token: it’s the access token required to publish on friends’ wall. Its value must be

$session[access_token]

message: it’s the message which will appear next to your name. I used

urlencode("just answered a question about you:")

because I wanted my friend to see “Emanuele Feronato just answered a question about you:”. I also used urlencode although it’s useless in this case, just not to forget to encode the string should I change it in the near future with another string with some special characters.

picture: the absolute URL of the picture to display on the left of your post.

urlencode("http://www.gamesalsa.com/aboutyou/about_you_icon.png")

name: it’s the name of the link you are publishing in the feed. This is where we will place the question.

urlencode("Do you think $_POST[name] likes this app ?")

link: it’s the link attached to the picture and the name. You may want to use the URL of the application itself.

urlencode("http://apps.facebook.com/about_you_game/")

caption: the caption of the link, placed just under the link itself. Don’t write anything important here as it won’t be noticed that much since the blue color of the link grabs almost all attention. Perfect to write something like “and the answer is…”

urlencode("and the answer is...")

description: it’s the description of the link and it’s the longest text you can enter. We’ll place the answer there.

strtoupper(urlencode($_POST[answer]))

actions: you can also add a custom action to the action footer of the post (where you can find “Like”, “Comment”, and so on). Actions should be added as a JSON list containing “name” and “link”

urlencode("{\"name\": \"Play now\", \"link\": \"http://apps.facebook.com/about_you_game/\"}")

And here you, go, have a try with the application: About you Facebook application.

Create a Facebook application like “Friend interview” – Step 2

Emanuele Feronato — Thu, 28 Oct 2010 08:55:02 +0000

In step 1 you learned how to authenticate and select a random friend of yours.

In this second part you will learn how to get more information about your friends and how to post the answer on their wall.

This is what you will get:

and once you hit “Answer and publish” you will post on your friend’s wall this way:

You need to know how cURL works. I may consider publishing a tutorial about cURL if I have enough requests.

Let’s jump straight to the code:


 
include_once "facebook.php";
 
$facebook = new Facebook(array('appId'=>'157934074246374','secret'=>'onceiwasapornsuperstar','cookie'=>true,'domain'=>'gamesalsa.com'));
 
$session = $facebook->getSession();
 
if(!$session){
	$url = $facebook->getLoginUrl(array('canvas'=>1,'fbconnect'=>0,'req_perms'=>'publish_stream','next'=>'http://apps.facebook.com/about_you_game/','cancel_url'=>'http://apps.facebook.com/about_you_game/'));
	echo "Redirecting to permission request...
";
	echo "";	
}
else{
     if($_POST[to_do]=="Answer and publish"){
          $ch=curl_init();
     	curl_setopt($ch, CURLOPT_URL, "https://graph.facebook.com/$_POST[user]/feed");
     	curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
     	curl_setopt($ch, CURLOPT_POST, 1) ;
     	curl_setopt($ch, CURLOPT_POSTFIELDS, "access_token=$session[access_token]&message=".urlencode("Do you think $_POST[name] likes this app ?")."&link=".urlencode("http://apps.facebook.com/about_you_game/")."&name=".urlencode($_POST[answer]));
     	$result = curl_exec($ch);
     	curl_close($ch);
     }
	$friends = $facebook->api('me/friends');
	$number_of_friends = count($friends[data]);
	$random = rand(0,$number_of_friends-1);
	$friend_id = $friends[data][$random][id];
	$friend_name = $friends[data][$random][name];
	$img = "http://graph.facebook.com/$friend_id/picture?type=large";
}
 
?>
 


 
 echo $img; ?>');background-repeat:no-repeat;padding:5px 5px 5px 210px;font:normal 16px verdana">
Do you think  echo $friend_name; ?> likes this app?

     
      echo $friend_id;?>" />
      echo $friend_name;?>" />

Obviously I won’t comment HTML, so let’s dive into php exploring the new lines not already explained in step 1.

Line 10: getting the login url with some new parameters:

next: the url to go to after a successful login
cancel_url: the url to go to after the user cancels
req_perms: comma separated list of requested extended perms

I am asking for publish_stream permission. It enables your application to post content, comments, and likes to a user’s stream and to the streams of the user’s friends. That’s what I need to publish something on my friends’ wall.

You can find the full docs about permissions at this official page.

Line 15: I am about to publish the answer about a random friend if the user clicked on “Answer and publish” button (line 43)

Line 16: initializing a cURL session

Line 17: setting the URL where to send the cURL request

Line 18: saving the result of the cURL session in a string

Line 19: setting cURL method to POST

Line 20: the core of the script: the variables to be passed in POST.

access_token: the authorization token.
message: the URL encoded message (“Do you think xxx likes this app?”)
link: the link to the application
name: the answer to the question

Line 21: executing the cURL session

Line 22: closing the cURL session

The big profile image on the left of the question can be obtained at line 29.

Test the application at this page.

Next time, generating and saving random questions.

Create a Facebook application like “Friend interview”

Emanuele Feronato — Wed, 20 Oct 2010 21:41:41 +0000

Do you know Friend Interview?

It’s a Facebook application which asks a random question about a random friend of yours, and publish the result on his wall. I won’t publish a snapshot of such app since it’s full of rubbish and ads, but I am sure you know what I am talking about (and moreover there’s the link!).

You should know how to create a Facebook application, anyway I’ll post a recap here.

1) Go to http://www.facebook.com/developers/ and click on “Set Up New Application”.

2) Give a name to your application. You can give it any name as long as it does not infringe copyrights, agree to terms and click on “Create Application”.

3) On “Facebook Integration” panel give it a Canvas Page name (this must be unique), and in “Canvas URL” write the path on the folder on your server which will contain the application itself, set “Canvas Type” as “IFrame” and “IFrame Size” to “Auto-resize”, then press “Save Changes” and at the moment you are ready to create your application.

4) Download the Facebook API from GitHub and copy facebook.php in the folder you specified in the Canvas URL.

Now everything is ready to develop your application. In this first part, we will ask for permissions and choose one random friend.

Create a new file called index.php with this code:


 
include_once "facebook.php";
 
$facebook = new Facebook(array('appId'=>'157934074246374','secret'=>'sorrythissecretkeywontwork','cookie'=>true,'domain'=>'gamesalsa.com'));
 
$session = $facebook->getSession();
 
if(!$session){
    $url = $facebook->getLoginUrl(array('canvas'=>1,'fbconnect'=>0));
    echo "Redirecting to permission request...
";
    echo "";  
}
else{
    $friends = $facebook->api('me/friends');
    $number_of_friends = count($friends[data]);
    echo "You have $number_of_friends friends
";
    $random = rand(0,$number_of_friends-1);
    echo "A random friend name: ".$friends[data][$random][name]."
";
    echo "A good question would be: do you think ".$friends[data][$random][name]." likes this app?
";    
}
 
?>

Let’s see its meaning:

Line 3: including the required library.

Line 5: initializing the Facebook application. In the array you must pass the following elements:

appId: the application ID
secret: the application secret
cookie: (optional) boolean true to enable cookie support
domain: (optional) domain for the cookie
fileUpload: (optional) boolean indicating if file uploads are enabled

Line 7: getting the session object. At this point, the script splits in two paths, according to $session value.

$session is NULL (lines 9-13)

If $session is NULL, we need to redirect to the login url to let the player allow the application use his personal information. The redirection is made with a simple javascript, using getLoginUrl.

$session is not NULL (lines 14-21)

In this case I put in $friends array an array with all friends names and Ids, then I randomly pick one of them and display its name and a possible question.

And that’s it, this is what you’ll get:

You can test it by yourself here: http://apps.facebook.com/about_you_game/

Now you know how to pick a random friend. During next step you will be able to answer a question about him and post it on its wall.

PHP Facebook Graph API “Hello World” application

Emanuele Feronato — Thu, 16 Sep 2010 23:12:47 +0000

While I am preparing a new tutorial about Facebook applications (and a php FB game, maybe HTML5 based), I notice there isn’t any “Hello World” application about Facebook applications using the new Graph API with just some PHP lines.

If you don’t know what is the Graph API and don’t want to get an headache with strange words such as “access token”, ever mind… as said I’ll explain it in a few days. But if you are already messing with Graph API and Facebook and are looking for a really simple and working code, this is the post for you.

Try the application: Hello World.

… and get the source code:


 
include_once "facebook.php";
 
$facebook = new Facebook(array('appId'=>'150635898302665','secret'=>'12345678901234567890123456789012','cookie'=>true,'domain'=>'gamemummy.com'));
 
$session = $facebook->getSession();
 
echo "Current session content:";
var_dump($session);
 
try{
     $me = $facebook ->api('/me');
     echo "Graph data about me:";
     var_dump($me);
}catch(FacebookApiException $e){
     echo "Facebook exception: ".$e;
     $url = $facebook->getLoginUrl(array('canvas'=>1,'fbconnect'=>0));
     echo "\"javascript:void(0)\" onclick=\"top.location.href = '".$url."'\">Get access token
";
}
 
?>

… and don’t try to steal my secret key, it’s not real…

Horror Profile Facebook application source code released

Emanuele Feronato — Fri, 04 Dec 2009 09:23:57 +0000

Horror Profile is a Facebook application I developed a month ago.

Now it’s time to release the source code. You will find some useful tips about dynamic image creation with php.

If you are absolutely new to Facebook applications, I suggest you to read “Developing a Facebook Application for absolute beginners” posts 1, 2, 3, 4 and 5.

The idea is simple: placing the profile picture in a mirror (that is a transparent PNG image) and writing the user first name as big as I can.


 
// this is the core function.
// giving an user id, a text (user first name) and an url (path to the user profile picture)
// creates the horror picture
 
function create_pic($id,$text,$url){
 
	// creation of a new image, the final one
	$im = imagecreatetruecolor(500,500);
	// importing profile picture
	$profile = imagecreatefromjpeg($url);
	// importing transparent mirror image
	$mirror = imagecreatefrompng("mirror.png");
 
	// retrieving profile picture size
	$sizes = getimagesize($url);
 
	$x_dim = $sizes[0];
	$y_dim = $sizes[1];
 
	// mirror transparency is 265x335, so I resize the profile picture
	// to fit this size, keeping widht/height ratio
	if($x_dim<265 or $y_dim<335){
		$mult = max(265/$x_dim,335/$y_dim);
		$final_x = $x_dim*$mult;
		$final_y = $y_dim*$mult;
	}
 
	// pasting the resized profile picture on the final image
	imagecopyresampled($im,$profile,250-$final_x/2,300-$final_y/2,0,0,$final_x,$final_y,$x_dim,$y_dim);
	// pasting the mirror on the final image
	imagecopyresampled($im,$mirror,0,0,0,0,500,500,500,500);
 
	// creating some colors
	$color = imagecolorallocate($im, 125, 0, 0);
	$shadow = imagecolorallocate($im, 0, 0, 0);
 
	// this is the path of the font I am using
	$font = "SF Gushing Meadow.ttf";
 
	// starting at font size 0
	$size = 0;
	// boolean variable to determine if the font fits on the picture
	$it_fits = true;
	// increasing font zize by one unit until it won't fit anymore
	do{
	     $last_dim = $dim;
	     $size++;
	     $dim = imageftbbox($size, 0, $font, $text);
	     if($dim[4]-$dim[6]>500){
	          $it_fits=false;
	     }
	} while($it_fits);
 
	// adding the text
	$center = floor((500-$last_dim[4]+$last_dim[6])/2);
	imagettftext($im, $size-1, 0, $center, $last_dim[7]*-1+10, $shadow, $font, $text);
	imagettftext($im, $size-1, 0, $center-1, $last_dim[7]*-1+9, $color, $font, $text);
 
	// saving the image
	imagejpeg($im,"temp/".$id.".jpg",80);
	// freeing memory
	imagedestroy($im);
	imagedestroy($profile);
	imagedestroy($mirror);
}
 
?>
 

 
 

 
require_once "facebook.php";
 
$appapikey = "xxxxx";
$appsecret = "xxxx";
 
$facebook = new Facebook($appapikey, $appsecret);
 
$user_id = $facebook->require_login();
 
$my_array = $facebook->api_client->users_getInfo($user_id,"first_name,pic_big");
 
// getting user name and profile picture
$text = $my_array[0][first_name];
$pic = $my_array[0][pic_big];
 
// core function: creation of the horror picture
create_pic($user_id,$text,$pic);
 
$has_permission = $facebook->api_client->users_hasAppPermission("photo_upload");
 
if($has_permission and $_GET[pub]){
	$response_array = $facebook->api_client->photos_upload("temp/".$user_id.".jpg", "", "Created with http://apps.facebook.com/horror_name/", $user_id);
}
 
?>
 

 
Hello  echo $user_id; ?>" useyou="false" linked="false" firstnameonly="true">, let's see how horrific is your profile:
 
 echo $user_id; ?>.jpg" />
 
 if(!$has_permission){ ?>
     Scare your friends!! Publish this horrific photo on your profile!!
 } else { ?>
	 if(!$_GET[pub]) { ?>
     	Scare your friends!! Publish this horrific photo on your profile!!
	 } else { ?>
		PHOTO PUBLISHED
	 } ?>
 } ?>
 

 

	Concept and coding by Emanuele Feronato
	Picture by AliceinDeadLand

Hope you will make something decent out of it…

Creation of a Flash Facebook application using AMFPHP

Emanuele Feronato — Tue, 17 Nov 2009 01:29:05 +0000

Some days ago I showed you how to create a Flash Facebook application using the AS3 API.

Now Yarden Refaeli from Rigel Games is sharing with us his experience in creating a Flash Facebook application using another technique.

Let’s read it:

« Hello, my name is Yarden Refaeli and I have been flash programmer for 1 year. A few weeks ago, I decided to make my first facebook flash game, Snaker. Well, I won’t lie: It was HARD. After I made it to the end, I decided to write a tutorial about the best approach to build flash-facebook game. So let’s start!

First, we need to save our meta user-data about every user in OUR database, and for this we need to use a server-side language (in this tutorial I will talk about Mysql, but every other database or server-side language is fine).

Let’s say we want to make a game that save our score at the end, and then show us the score we got, and the scores of our friends. We need to save the score for every user, with it’s unique id, which can easily access through facebook APIs. Now lets say we want to do all the server-side jobs, with PHP and not flash: we don’t want to get the user-data we need from facebook-flash API, then send it all the way to the server and store it in the database, we want ALL the facebook/database related work, done on the server-side, with PHP. You should know, that you can access simple facebook library PHP code from flash, you need to authenticate first with the facebook function “set_user” with your user’s uid, and session key, that passed via the FBML tag in the flash vars. (for some strange reason, there is NO official documentation for this function AT ALL)

Now, flash needs to communicate with the server-side (POST requests for example). We can build our own dandy classes in PHP and AS3 (as I did in the beginning), but why? We shouldn’t spend precious time on this task when we have AMFPHP!

AMFPHP is a great open-source tool that allow flash to communicate with the server-side in a few lines of code! All you need to do, is of course, write the server-side functions, and then you can call it from your SWF, with Actionscript 3.

For example, if we want to get the user’s name from the server (using PHP and Facebook PHP-Platform), we need to create the following PHP class:


 
class HiWorld {
 
	public $facebook;
 
	public function HiWorld() {
		include "path/to/facebook/PHP/platform";
	}
 
	public function sayHi($uid, $sessionKey) {
		$appapikey = "fefcc99d6c09e56d9330d3d8e9e1d30a";
		$appsecret = "eb5680d5137ba850487984ac75d97583";
		$this->facebook = new Facebook($appapikey, $appsecret);
		$this->facebook->set_user($uid, $sessionKey);
 
		$name = $facebook->api_client->users_getInfo($uid, 'name');
		$name = $name[0];
 
		return "Hi," . $name . ", how do you do?";					
	}
}
 
?>

And save it in the “services” directory of AMFPHP, on our server. Now all we need to do is to call this function from our Actionscript 3 code, like this:

package {
	// required for flash file and output display
	import flash.display.MovieClip;
	import fl.events.*;
	import flash.events.*;
	// required to send/recieve data over AMF
	import flash.net.NetConnection;
	import flash.net.Responder;
 
	import flash.text.TextField;
 
	public class Main extends MovieClip {
		private var gateway:String = "path/to/gateway.php";
		private var connection:NetConnection;
		private var responder:Responder;
		private var response_text:TextField;
 
		public function Main() {
			// Responder to handle data returned from AMFPHP.
			this.responder = new Responder(this.onResult);
			this.connection = new NetConnection;
			// Gateway.php url for NetConnection
			this.connection.connect(this.gateway);
 
			this.respond_text = new TextField();
			addChild(this.response_txt);
 
			// Get the auth vars from the flash vars
			var sessionKey:String = LoaderInfo(this._root.loaderInfo).parameters.fb_sig_session_key;
			var uid:String = LoaderInfo(this._root.loaderInfo).parameters.fb_sig_user;
 
			// call remote function
			this.connection.call("HiWorld.sayHi", responder, uid, sessionKey);
		}
 
		// Handle an AMF call. This method is defined by the responder. 
		private function onResult(result:Object):void {
			this.response_txt.text = String(result);
		}
	}
}

In this tutorial, we use the NetConnection class to connect flash and PHP. Actually, the NetConnect is more like the “pipe” between them, as all the data passed with it. The first parameter for the “connect” method of our connection object, is the className.function to call, the second is the responder object, and the others are the parameters for the function. When you call the remote function, you can pass as many parameters to PHP as the function require. The responder is an object with a reference to a function, (simple and stupid ;) ) that will be invoked when the request completed. When we get the data from the server, the “onResult” function called, with the result parameter. The result paramter is an object that the server returned. Our function simply cast it to string and put it in our text field.

Note: AMFPHP is also ENCRYPT the data sent (vice-versa), and automatically decrypt it as well in the other side.

This way, we can access all the data that facebook supply… Now only the skies are the real limit… This is what I’ve done in snaker (Actually, I’ve built a Highscore class in AS, that handle all the highscore and facebook related data).

This was my first tutorial ever about AMFPHP and facebook! Feel free to send me feedback to yard2010[at]gmail[dot]com! I hope you learned something new =]

All the code above most be in it’s appropriate place: PHP on compatible server, and the SWF must run only in a facebook canvas page with the fb:swf FBML tag! »

Creating a Flash Facebook application with the Facebook Actionscript API – part 2

Emanuele Feronato — Wed, 11 Nov 2009 17:16:09 +0000

It’s time to make some considerations on the Facebook application made with the Facebook Actionscript API I blogged some days ago.

There was a doubt about putting a secret key in the swf file.

Well, you should never give away your secret key, but let me point on two things:

1) You can encrypt your swf file, obfuscating the secret key… and just in case you think nothing is encrypted enough… surprise…

2) My Facebook application works without api and secret keys. That’s it… I tested it with more than one account, and everybody was able to use the application even if my keys are stored this way:

var api_key:String="xxxxxxxxxxxxxxxxxxxxxxx"; var secret_key:String="yyyyyyyyyyyyyyyyyyyyyyy";

I am not hiding them, they are really a series of x and y… probably when you render a swf in canvas mode, they aren’t mandatory.

I have to say, I did not find docs about it, so take it as it comes.

The feature introduce this time is showing all your friends… there was a reader that was unable to populate a list with friend names, so here it is.

I didn’t create any list, but I’m simply showing them in a text area.

package {
	import flash.display.Sprite;
	import fl.controls.Button;
	import flash.events.MouseEvent;
	import flash.text.TextField;
	// facebook libraries
	import com.facebook.Facebook;
	import com.facebook.utils.FacebookSessionUtil;
	import com.facebook.commands.notifications.*;
	import com.facebook.commands.friends.*;
	import com.facebook.commands.stream.*;
	import com.facebook.commands.users.*;
	import com.facebook.events.*;
	import com.facebook.data.users.*;
	import com.facebook.data.friends.*;
	import com.facebook.net.FacebookCall;
 
	public class facebook_demo extends Sprite {
		var vars_field:TextField=new TextField  ;
		var friends_field:TextField=new TextField  ;
		var my_button:Button;
		var fbook:Facebook;
		// these are the api and secret keys you should be used to
		var api_key:String="xxxxxxxxxxxxxxxxxxxxxxx";
		var secret_key:String="yyyyyyyyyyyyyyyyyyyyyyy";
		// starting a new facebook session
		var fb_session:FacebookSessionUtil=new FacebookSessionUtil(api_key,secret_key,loaderInfo);
		// in this object I will store all variables Facebook will pass to the movie
		var passed_vars:Object;
		// this variable will hold all facebook API calls
		var fbcall:FacebookCall;
		public function facebook_demo() {
			// just placing some buttons...
			place_buttons();
			// just creating a text field...
			create_vars_field();
			// initializing the session
			fbook=fb_session.facebook;
			// this function will just print out all variables Facebook is passing to the movie
			get_vars();
			// getting friends uids (unique ids)
			fbcall = new GetFriends();
			fbook.post(fbcall);
			// function on_get_friends will be called once the post is completed
			fbcall.addEventListener(FacebookEvent.COMPLETE, on_get_friends);
		}
		// function to be called after GetFriends has finished
		function on_get_friends(e:FacebookEvent):void {
			var friends = (e.data as GetFriendsData).friends;
			var friends_num:int=friends.length;
			var uids:Array = new Array();
			// loading all friends uids into an array
			for (var i:int=0; i<friends_num; i++) {
				var user=friends.getItemAt(i) as FacebookUser;
				uids.push(user.uid);
			}
			// retrieving informations for all uids contained in the uids array
			fbcall=new GetInfo(uids,[GetInfoFieldValues.ALL_VALUES]);
			fbook.post(fbcall);
			// the function on_friend_list_loaded will be called once the post is completed
			fbcall.addEventListener(FacebookEvent.COMPLETE, on_friend_list_loaded);
		}
		// function to be called after GetInfo has finished
		function on_friend_list_loaded(e:FacebookEvent) {
			var friends_data = ((e.data as GetInfoData).userCollection);
			var friends_num=friends_data.length;
			// scanning all friends array and printing name and last name of each one
			for (var i:int=0; i<friends_num; i++) {
				var user=friends_data.getItemAt(i);
				friends_field.appendText(user.first_name+" "+user.last_name+"\n");
			}
		}
		// this is the core function, the one that will handle clicks on buttons and publising notes or stories according
		// to the button I am pressing
		function onclick(event:MouseEvent):void {
			// retrieving the user id (it's one of the variables passed by Facebook)
			var uid:Number=Number(passed_vars["fb_sig_user"]);
			switch (event.currentTarget.label) {
				case "Publish a note" :
					// publishing a note
					fbcall=new SendNotification([uid],"just sent a self-notification using \"http://apps.facebook.com/flash_demo/\">Facebook Flash Demo","user_to_user");
					fbook.post(fbcall);
					break;
				case "Publish a story" :
					// publishing a story
					fbcall=new PublishPost("is using Facebook Flash Demo",{'href':'http://apps.facebook.com/flash_demo/','name':'Facebook Flash Demo','description':'that\'s it','caption':'this image was published by a Flash Movie','media':[{'type': 'image','src':  'http://www.gamemummy.com/facebook/flash_demo/api.jpg', 'href': 'http://apps.facebook.com/flash_demo/'}]},[{'href':'http://apps.facebook.com/flash_demo/','text':'Visit Facebook Flash Demo'}],uid.toString());
					fbook.post(fbcall);
					break;
			}
		}
		function create_vars_field():void {
			addChild(vars_field);
			vars_field.width=340;
			vars_field.height=320;
			vars_field.x=0;
			vars_field.y=10;
			vars_field.text="DEFAULT VARS PASSED BY FACEBOOK:\n\n";
			addChild(friends_field);
			friends_field.width=340;
			friends_field.height=320;
			friends_field.x=350;
			friends_field.y=10;
			friends_field.text="YOUR FACEBOOK FRIENDS (scroll with mousewheel):\n\n";
		}
		function get_vars():void {
			var varname:String;
			var varvalue:String;
			passed_vars=root.loaderInfo.parameters;
			for (varname in passed_vars) {
				varvalue=String(passed_vars[varname]);
				vars_field.appendText(varname+":\t"+varvalue+"\n");
			}
		}
		function place_buttons():void {
			var bnames:Array=new Array("Publish a note","Publish a story");
			for (var i:int=0; i<2; i++) {
				my_button=new Button  ;
				addChild(my_button);
				my_button.label=bnames[i];
				my_button.move(225+150*i,350);
				my_button.addEventListener(MouseEvent.CLICK,onclick);
			}
		}
	}
}

The result as usual is on the application page and there is no need to download anything since you can just try it by just cutting/pasting the code on the example you can find at this link.

Can you all make the application work without api and secret keys?

Creating a Flash Facebook application with the Facebook Actionscript API

Emanuele Feronato — Wed, 04 Nov 2009 00:11:33 +0000

It’s time to see how can we build a Flash Facebook application.

What we are going to do is a Flash movie to be embedded in a Facebook application, able to interact with the user by publishing notes and stories on the wall.

The first thing we need is the official Facebook Actionscript API. This library contains all we need to create a complete Facebook Flash application.

You can download the source code at this link, but before messing with AS3, let’s create the PHP part.

I suggest you to read the Developing a Facebook Application for absolute beginners posts from 1 to 5 if you don’t know how to create a basic Facebook application.

Then, take a look at the PHP code:


 

 

 
require_once "facebook.php";
 
$appapikey = "xxxxxxx";
$appsecret = "yyyyyy";
 
$facebook = new Facebook($appapikey, $appsecret);
 
$user_id = $facebook->require_login();
 
$has_permission = $facebook->api_client->users_hasAppPermission("publish_stream");
 
if(!$has_permission){
 
?>
 
You won't be able to test the flash demo if you don't allow publish stream permission -
 
ALLOW PERMISSION
 
 } ?>

Notice at lines 1-3 the way you can import CSS style sheets. Don’t forget to use htmlentities on the imported file.

Then, at lines 5-9 I created a simple javascript function called grant that just redirects the browser to the application page. That is, basically it refreshes the page, and it will be called once the user will grant (or won’t grant) the permission to publish contents on his wall by submitting the permission form as you can see at line 30.

This is possible thanks to next_fbjs="grant()".

Another important thing in this script you should arleady know is the way I ask for publishing permission.

You can ask for permission inside the Flash movie itself but I found it easier to ask directly from Php. This way, you can even hide the Flash movie if the user does not grant permissions.

But the core of the script, the think you did not see in previous tutorials is the way I include the Flash movie at line 34 with the fb:swf tag.

You can find the official documentation at this page, and the most interesting thing is Facebook is passing some interesting parameters to the movie.

Let’s see the Actionscript now… I used the button component to create the buttons but this is not important… here it is the commented script:

package {
	import flash.display.Sprite;
	import fl.controls.Button;
	import flash.events.MouseEvent;
	import flash.text.TextField;
	// facebook rlibraries
	import com.facebook.Facebook;
	import com.facebook.utils.FacebookSessionUtil;
	import com.facebook.commands.notifications.*;
	import com.facebook.commands.stream.*;
	import com.facebook.net.FacebookCall;
 
	public class facebook_demo extends Sprite {
		var text_field:TextField = new TextField();
		var my_button:Button;
		var fbook:Facebook;
		// these are the api and secret keys you should be used to
		var api_key:String="xxxxxxxxxxxxxxx";
		var secret_key:String="yyyyyyyyyyyyyyyy";
		// starting a new facebook session
		var fb_session:FacebookSessionUtil=new FacebookSessionUtil(api_key,secret_key,loaderInfo);
		// in this object I will store all variables Facebook will pass to the movie
		var passed_vars:Object;
		// this variable will hold all facebook API calls
		var fbcall:FacebookCall;
		public function facebook_demo() {
			// just placing some buttons...
			place_buttons();
			// just creating a text field...
			create_text_field();
			// initializing the session
			fbook=fb_session.facebook;
			// this function will just print out all variables Facebook is passing to the movie
			get_vars();
		}
		// this is the core function, the one that will handle clicks on buttons and publising notes or stories according
		// to the button I am pressing
		function onclick(event:MouseEvent):void {
			// retrieving the user id (it's one of the variables passed by Facebook)
			var uid:Number=Number(passed_vars["fb_sig_user"]);
			switch (event.currentTarget.label) {
				case "Publish a note" :
					// publishing a note
					fbcall=new SendNotification([uid],"just sent a self-notification using \"http://apps.facebook.com/flash_demo/\">Facebook Flash Demo","user_to_user");
					fbook.post(fbcall);
					break;
				case "Publish a story" :
					// publishing a story
					fbcall=new PublishPost("is using Facebook Flash Demo",{'href':'http://apps.facebook.com/flash_demo/','name':'Facebook Flash Demo','description':'that\'s it','caption':'this image was published by a Flash Movie','media':[{'type': 'image','src':  'http://www.gamemummy.com/facebook/flash_demo/api.jpg', 'href': 'http://apps.facebook.com/flash_demo/'}]},[{'href':'http://apps.facebook.com/flash_demo/','text':'Visit Facebook Flash Demo'}],uid.toString());
					fbook.post(fbcall);
			}
		}
		function create_text_field():void {
			addChild(text_field);
			text_field.width=500;
			text_field.height=320;
			text_field.x=10;
			text_field.y=10;
		}
		function get_vars():void {
			var varname:String;
			var varvalue:String;
			passed_vars=root.loaderInfo.parameters;
			text_field.text="DEFAULT VARS PASSED BY FACEBOOK:\n\n";
			for (varname in passed_vars) {
				varvalue=String(passed_vars[varname]);
				text_field.appendText(varname + ":\t" + varvalue + "\n");
			}
		}
		function place_buttons():void {
			var bnames:Array=new Array("Publish a note","Publish a story");
			for (var i:int=0; i<2; i++) {
				my_button=new Button();
				addChild(my_button);
				my_button.label=bnames[i];
				my_button.move(125+150*i, 350);
				my_button.addEventListener(MouseEvent.CLICK, onclick);
			}
		}
	}
}

The interesting thing of this script is the way you can send notifications (line 44) and publish posts (line 49)… I won’t talk about notifications because Facebook will deprecate this method in late November/early December 2009 , but I want you to look at the way I publish the post following the format explained at the official attachment docs.

You can test the application at this page and download the full source code, library included.

Next time, we’ll see how to add more functions.

Horror Profile: Facebook application

Emanuele Feronato — Wed, 28 Oct 2009 11:37:16 +0000

You are all invited to try Horror Profile, a Facebook application I made in about an hour.

The application takes your name and profile photo, and combines them in a creepy environment to create an horrific photo that you can upload to your album.

During next days I’ll release the full tutorial to create an application with ads, photo uploads, dynamic text generation, and all the features you see in the application.

Meanwhile, Play with it.