How can i develop Facebook Application?

I mainly focus on development of applications for facebook, and sometime we will also review interesting applications and their cool features which you might have stumbled upon.

stay with me, I will try to answer all of your questions in this blog.

1. 
   
2. echo "hello readers of fbcookbook";
3. ?>
   

facing trouble to trigger multiple onload event to work FBJS does not allow acess to the window object. So how can onload event fire when

is loaded on canvas. also FBJS is executed after the entire page has been loaded. so really shouldn’t matter where you call the function within your canvas page file. however let’s see how can we trigger on load for multiple div.

In this example we create two div which load by onload. One is for content a message and another which load the value by ajax way.

For that reason in FBJS we create a varraible array and pushing two functions on that array variable.

1. var onload = [];
2. 
   
3. onload.push(function() {
4. //ONLOAD STUFFS HERE
5. msg_laod();
6. do_ajax();
7. 
   
8. });
9. 
   
10. 
    

now we define the two functions. The message load function just simply display a text message on

. and do_ajax() function display the value by ajax call.

1. 
   

now we trigger on the onload event . by pushing functions into an array and executing them at the bottom of the page it ensures that the elements are indeed in the dom tree. here we add setTimeout function to to make sure the browser is fully loaded. It allows 100 miliseconds. because the rest of the page to load (facebook footer and such). increasing the 100 milisecond limit can solve some of these problems.

1. 
   
2. 
   
3. 
   

in this way we can easily load onload functions in the div. we combine the whole code and looks like that:

1. 
   
2. include_once 'config.php';
3. ?>
4. 
   
5. "msg" style="width:398px;height:298px;">test message content
6. "ajax" style="width: 398px; height: 298px;">
7. 
   
8. 
   

embedding google map in canvas

ever tried to embed static google map in your facebook application canvas? wait a bit, i think you are firing a question at me “whats the difference, its all the same, a static image, eh?” - nope! it wont work the way you think . whenever you try to embed a static google map image, google parse it as a “Bad Or Malformed” request and returns nothing! and in canvas url you can’t directly import any javascript but fbjs. so all we have to do is embed google map using a object

enough said, lets see it in action. first try to embed a google static map in regular way and see the result.

1. 
   
2. include_once("config.php");
3. ?>
4. Here is the map of Dhaka
   
5. 'http://maps.google.com/staticmap?center=23.70991,90.407&zoom=14&size=400x300&key==23.7099,90.407,green' />
   
6. Pretty cool, ya?
   

output is

1. Here is the map of Dhaka
2. Pretty cool, ya?

you will be surprised that this code will render only the texts and no image in your application canvas, though the image url is fully valid.

now here is the revised version using

1. 
   
2. include("config.php");
3. ?>
4. Here is the map of Dhaka
   
5. '400' height='300' style='border:0' frameborder='0' src='http://sandbox.ofhas.in/fbtest/map.php?lat=23.7099&lon=90.407' >
6. 
   
7. Pretty cool, eh?
   

-------------continue-------------------
Reference & thanks to : http://fbcookbook.ofhas.in/