Demo Apps

I have written several demo apps.
(1) A regular gadget with gadgets.* API
This is based on official youtube gadget presented here. Official youtube gadget uses traditional gadget API, which means it can not be run in open social containers.
I modified the source of official youtube gadget to make it compatible with open social API. Source is hosted here.
I run it on Ringside, and it works well. Screenshot is shown below:

Besides, I run it on iGoogle sandbox and Orkut sandbox successfully.

(2) An open social gadget
This gadget is written with Open Social API so that it can be run in all standard compatible containers. This gadget lists all friends you have in a container. If you add it to your Orkut account, it will list your friends in your Orkut account. If you add it to your hi5 account, it will list your friends in your hi5 account.
Source is hosted here.
I run it on Ringside, and screenshot is shown below:

Besides, I run it on iGoogle sandbox and Orkut sandbox successfully.

(3) A Facebook application.
This application gets your friend list on Facebook and displays related information including profile picture, last name, first name and birth date. You can see its information here. Meanwhile you can add it to your Facebook account.
Screenshot is shown below:
 

(4) A port of application (3)(The facebook application). 
Because Ringside implements Facebook API and FBML, application (3) should be able to be run on Ringside with minor modifications. New API key and secret should be used. Besides Ringside RESTful server (instead of Facebook server) address should be used.
Finally, I got it to run successfully on Ringside.

(5) Make Facebook to use Ringside application
I used the method described in this post and this post. It should work. But unfortunately it did not work. Currently I don't know why.

To try it in Ringside
First go to http://gf1.ucs.indiana.edu:8080/ to log in.
Then click tab "Applications":

Following page should be displayed:

Main panel displays a list of all applications you have added to your account. You can click any one to use it.
Or you can click button "Find More Apps" at top right corner to browse more available apps.
Application "youtube gadget" is the application (1) described above.
Application "Friend gadget(Open social)" is the application (2) described above.
Application "Your Friends Native" is the application(4) described above.
To run application (3), you need a Facebook account and add it to your account by accessing here.

Interaction between Facebook and Ringside

(1) Can Ringside use applications of Facebook?
Generally not. To use applications of Facebook, one of the two requirements must be satisfied:
<1> You know the callback URL of the application.
If you know the callback URL, you can create a new application on Ringside serve which points to the same callback URL. However, as far as I know, you have no way to figure out the callback URLs of Facebook applications developed by others.
<2> Facebook exposes a "proxy URL".
In this case, Facebook does not need to expose callback URL of an application. Instead, Facebook acts as a Proxy server and sits between Ringside server and your app. Then you points "Callback URL" of your Ringside app at the Facebook "proxy URL". So the communication style is:
    your Ringside app <=> Ringside server <=> Facebook <=> Facebook App.
Facebook is a relay station which connects Ringside server with Facebook applications. However, as far as I know, currently Facebook does not support the "proxy URL".

(2) Can Facebook use applications of Ringside?
Yes. Ringside supports the second method described above.
If you has built an application on a Ringside server and you want to that application to be accessed in Facebook, you should:
[*] add a new application in your Facebook account;
[*] copy configuration information of your Ringside app to the newly created app in Facebook.
[*] set Callback URL(in Facebook setting) to point to your Ringside app. Note: there is a specific format of "proxy URL" of apps in Ringside: http://ringside_server:port/trust.php/facebook/canvas_path. You should replace canvas_path with your real value. It should be the canvas path you set in Ringside server rather than Facebook.
Note that that app is run inside of backend Ringside server instead of Facebook. So the app generates all output based on information stored on backend Ringside server. For example, if the app returns a list of your friends, you will see friend list of the profile you set up on Ringside server. In other words, you will not see your Facebook friend list.
Architecture:
 
<1> browser sends request to Facebook
<2> Facebook sends request to "Callback URL" (format is: http://ringside_server:port/trust.php/facebook/canvas_path)
<3> Ringside server sends request to your app server
<4> Your app makes calls to Ringside server and integrates response into output
<5> Your app returns final output to Ringside server
<6> Ringside server passes the output to Facebook
<7> Facebook returns response to client.
One issue is: if response in step <5> contains FBML segment, who will render the FBML? Ringside server or Facebook? I guess Facebook renders FBML into HTML. In other words, Ringside server just acts as a pure proxy and it does not render inbound messages. Maybe I am wrong, I am not 100% sure about my guess.

(3) More possibilities
Actually, your app can makes use of all resources that you have privilege to access. No matter where you deploy your app, your app can makes API calls to Facebook, Ringside server and open social containers(e.g. Orkut, hi5...).
Architecture:
  
In this way, you can integrate different resources and produce better result.

Facebook Application Development and Concepts

Developing a simple application for Facebook platform is not as easy as developing a "hello,world" application in C/C++ or Java etc.
Here is a step-by-step tutorial about how to build a Facebook app. It is exhaustive and I just supplement two cents.

Resources:
Description about the basic architecture:
http://wiki.developers.facebook.com/index.php/Random_questions 
More resources about how to build Facebook Apps:
http://www.merchantos.com/makebeta/facebook/facebook-php-tutorial/

First, it is necessary to introduce the basic concepts. These concepts confused me once upon a time.

Profile Action
When you browse profile of a user, you should see following layout:

The entries within red box are called profile actions. One way to set profile action of your app is through app setting interface provided by Facebook. Following entry "Default Action FBML" should be displayed:

You can make use of fb:profile-action to set profile action.
Another way to set profile action is use API: Profile.setFBML.

Profile Box
On your profile page, there is a small box for every application you have added. This small box is called profile box which is demonstrated below.

You can set content of profile box of your app by accessing app setting page:

Moreover, you can set profile box by using API: Profile.setFBML.
Note: Profile.setFBML can be used to set both profile box and profile action.

Cache in profile action and profile box:
Setting of profile action and profile box is cached in Facebook server. See architecture here.

<1> A user sends requests to Facebook through profile action or profile box.
<2> Facebook immediately returns cached response to the user. In other words, Facebook does not communicate with your app server instantly. The cache is for per user per application.
Update of profile action/box is done asynchronously. Usually, when a user requests your canvas page, profile action/box will be updated if related code is contained in your canvas page.

Canvas Page
When a user click your app in the left navigation bar, your app will be put into canvas page which is shown below:
 
Facebook retrieves content of the page and renders it in canvas page. By setting Canvas Page URL, you tell Facebook that your app should be accessed through the specific URL. By setting "Callback URL", you tell Facebook where content should be retrieved. Facebook platform is like a proxy. When a user uses your app by accessing "Canvas Page URL", Facebook determines the true URL that should be visited. Then Facebook sends request to the URL and renders response in Canvas Page.
 

How does Facebook handle your app in canvas page?
See here. I briefly describe the procedure:
 
<1> browser sends request to facebook platform.
<2> Facebook platform sends requests to your app server
<3> Your app makes API calls to Facebook and integrates response into output
<4> Your app returns output(html segment with or without FBML)
<5> After facebook gets response from your app server, Facebook renders FBML to HTML and displays result in client browser.

Add a new app
After you add developer application into your facebook account, you should be able to create your own applications. There are many options you can set to customize your Facebook app, the interface looks like this:

And this site contains detailed information about almost every field:
http://www.marketing-ninja.com/facebook-app/starting-your-first-facebook-app-demystifying-application-form-field-by-field/

You should have a server which will host your Facebook app. If you user Apache http server, you need to configure the server so that when a directory(not a file) is requested index.php will be returned(if it exists).
In my Apache httpd server, related configuration is like this:

<IfModule dir_module>
    DirectoryIndex index.html index.php
</IfModule>