wellconsidered

hey man i like where this is headed. i’m heading development of a flash site that wants to integrate facebook connect and stumbled across your blog. if u could email me the library u are workin with i’d love to help ya out and see if we can improve it and get it to a place where it needs to be.

i love the test site so far, keep it up!

-anthony

I have set up a git respository for public use.
Feel free to take use this whereas feedback and additions are very welcome.

http://github.com/pierot/fbflashbridge/tree/master

Hello i’d like to test this libs wanna share? :)

This is a great chunk of code. Thanks very much for the help!

This was a great find thank you! I do have a question though, when I am looking at the console in FireBug, things seem to be happening twice. This is essentially the output i am seeing.

FLASH LOADED
LOGGED_IN
GETTING USER INFO OF LOGGED IN USER OR USER WITH GIVEN UID
LOG IN READY
LOGGED_IN
GETTING USER INFO OF LOGGED IN USER OR USER WITH GIVEN UID
USER_INFO
USER_INFO

Have you seen this or know why it is happening? I haven’t really started programming much, so I dont know if it will affect anything, but I don’t think those functions should be called 2x.

Thanks!

Also, why do you have all of the setTimeouts()? Does the FBBridge not initialize right away?

So the reason things were happening twice is because in function FBFlashBridgeOnLoad() you are waiting for the session to be ready, and when it is you call FBFlashBridgeLoggedIn(). But in the callback function of requireSession in function FBFlashBridgeLogIn() you call FBFlashBridgeLoggedIn() as well. Consequently when you log in and the session is ready FBFlashBridgeLoggedIn() is called 2x.

I just commented out the call to FBFlashBridgeLoggedIn() from the callback function of requireSession().

Michael, you were right to state that there was something wrong with the double logins etc.
I fixed it. Not like you suggest because you would loose automatic logins and so on.
The update can be found on github or in the source of http://stream.microsite.be/cecemel/.

Concerning the timeout: I added that so I’m sure at any moment the flash is correctly embedded and all the rest is loaded before enabling all functionality.

Hi,
Is it possible to convert this app to Flash? I tried to do it this afternoon but I got stuck and haven’t figured it out so far.
All I need is a login box that shows up rather than being redirected to the facebook site.

Cheers

Hi,
Great idea.
I have a question regarding the facebook’s popup that appears when you’re not logged in.
I read your sources but couldn’t find an explanation…
Suppose the user is not logged in to facebook, and not yet connected to the website.
In IE I can see a popup (for all I know it’s generated from FB’s JS lib) but in Firefox the popup is not visible (just a flicker) and you cannot proceed.
Will I be right to assume that this JS dialog popup is unavoidable, thus making firefox unusable till this flex/js visibility conflict is resolved?
Thanks,
Dan

[...] Facebook Connect to Actionscript 3 Example Facebook Connect Flash App (pictured above) FBFlashBridge at Github Read more | Permalink | Comments | Read more articles in hacks | Digg this! Posted by Jason Striegel at 11:00 am. Filed under Uncategorized   [link] [...]

[...] Facebook Connect to Actionscript 3 Example Facebook Connect Flash App (pictured above) FBFlashBridge at Github Read more | Permalink | Comments | Read more articles in hacks | Digg this! [...]

[...] Facebook Connect to Actionscript 3 Example Facebook Connect Flash App (pictured above) FBFlashBridge at Github [...]

[...] web de Pieter [...]

[...] Pieter Michels post on Facebook Connect to Actionscript 3 [...]

hi i’m kinda new to this facebook connect feature… not sure but it seems to me that using a bridge between two client library’s is a bit overkill? why bridge between flex and a a javascript library? it seems like a hack?… surely it would be better to write a pure native as3 version that did not depend on javascript?

of course using their native javascript api means that it would be easier to maintain provided they did not change the api too much, but i need to integrate this feature into an air app…

Hi Ryan, In a way you’re right but this is built for easy use in a html/javascript environment as well. You’re also correct to say that in this way I can maintain a javascript lib that is natively supported by Facebook and handle all data in javascript instead changing as3 code or having the chance that Flash breaks with even a small adaptation to the javascript.

[...] Read More: Facebook Connect to Actionscript 3 | wellconsidered. [...]

I’m not sure if this is happening for anyone else but does your display picture show up in Internet Explorer?

Great work by the way!

–í–æ—Ç —Ç–?–?,—Å–æ–?–ª–?—Å–µ–? —Å –ø—Ä–µ–¥—ã–¥—É—â–?–º–? –±–ª–æ–?–?–µ—Ä–?–º–?
) Bye

Really nice work on this! Excellent coding standards, easy to port to a completely different application. One suggestion, the setTimeouts seem racey…I got around two of them by having Flex initiate the FB library onInitComplete with a EI call to FBFlashBridgeInit(). Still don’t know when FB.init() is complete, but luckily my app requires navigation to the FB connect interface, so I’m 99% confident everything will be ready by the time the module requests FBFlashBridgeFlashLoaded() or the user requests FBFlashBridgeLogIn().

Again, thank you very much for sharing. Saved me a whole lot of time.

Hi. This looks great!
I am trying to install it, but I only get an error saying:
TypeError: Error #1009: Cannot access a property or method of a null object reference.
at FBFlashBridge/connectToFB()[C:\2009\Flex\pierot-fbflashbridge\pierot-fbflashbridge-902a4ee8867eec1210080d09e54561b1a05d5337\www\src\FBFlashBridge.mxml:116]
at FBFlashBridge/__btnConnect_click()[C:\2009\Flex\pierot-fbflashbridge\pierot-fbflashbridge-902a4ee8867eec1210080d09e54561b1a05d5337\www\src\FBFlashBridge.mxml:249]

I don’t know what I am doing wrong, but I am also quite new in Flex. Anyone had the same error?

Hi Per
It seems you have an variable that is not instantiated (probably _fbBridge variable).

Thanks for responding so fast. :) I think I have missed something important. Is there any tutorial on how to deploy step by step. I downloaded the zip-file, and imported it to Flex, changed API-code etc.

Sorry for spamming. I figured it out. Thanks a lot again. This is very nice!

this looks so sexy, but i can’t make it work… i’ve made my own app, enabled facebook connect, replaced the api key (html & mxml), uploaded to my site, and… nothing
i figured out that it calls the js login function, but the callback is never fired… also, even in your online example things don’t seem to work

my other question would be: you wrote this in January – since then the Facebook AS3 API was released – does that API do what your bridge does? (dumb question – i’m still very new to the facebook API)

basically what i’d like to do is to have a ‘layer’ opening, asking for permissions and login (or even a small popup in the middle of the screen), and when you’re done with that, the flash application would get notified… the common solution consists of opening a huge new window where you log in, then it tells you to close it, and then you have to probably click a button in the flash app… maybe you could give me a suggestion for this?

thanks,
Z

Hi Ryan, In a way you’re right but this is built for easy use in a html/javascript environment as well. You’re also correct to say that in this way I can maintain a javascript lib that is natively supported by Facebook and handle all data in javascript instead changing as3 code or having the chance that Flash breaks with even a small adaptation to the javascript.

Hi,
Thanks to share your great job but where I can find the lib be.wellconsidered.apis.fbbridge ?
br

Great example. (Almost) exactly what I was looking for. Is there a solution to the disappearing login screen when using Firefox? Ideally loging in should be two clicks, one on a Connect button and one to give permission. This is the closet working example I’ve seen. Suggestion for the missing login screen?

Robin
The dissapearing login screen is because of the wmode of the flash that is embedded in your HTML page.
You should set it to transparent.

Thanks for the quick reply!

I’m trying to compile the code but unfortunately there is a library missing:
/as3fbflashbridge/build/bin/as3fbflashbridge.swc
Any idea where I can get this?

I have the same problem with as3fbflashbridge.swc !!

Please help :)

Any update on the missing as3fbflashbridge.swc file?
I still can’t compile because of this…

Robin, Poudibiz
I meaning to post another update on the libraries I’m posting here but in the meantime you can download the swc here:
http://as3fbflashbridge.googlecode.com/svn/trunk/build/bin/as3fbflashbridge.swc

All recent libraries are now hosted on Google Code. Post coming up in the next few days.

[...] pierot’s fbflashbridge [...]

Hi,while running this I face the problem of facebook connect,whenever I click the fconnect button I get an error of null object reference.So, whether I need to pass the apikey or any other thing I have to do,please tell me as early as possible.

I am considering using this on one of my projects. Thanks for putting this together!!!

One concern that I have is that it doesn’t seem to work in the new Google Chrome browser.

Is there someone who can help me to import this example on flash cs3 not flex.
thx

Hey! The wmode-Param makes the FB-Connect-Box flickering. If you set it to “transparent” or “opaque” this will stop. But then you won’t be able to use umlauts (?§, ??, ?º, ?) and other special characters that are not part of the normal US/english keyboard in your form fields. Thats too bad. It excludes every language with special characters. I hope there will be an Flash version of FB connect soon. :(

I just loading this up it seems to be working — I can log in — but after login the popup displays

Forbidden
You don’t have permission to access / on this server.

Any ideas why this is happening?

Hi great code, One thing I’ve been trying to get the Email to friend working and in the code I have downloaded from github

the email a friend code seems not to be working, wondering if I am missing some stuff.

For example in the mxml

_fbBridge.addEventListener(FBBridgeEvent.EMAIL_SENT_FAILED_AUTH, onEmailSentFailedAuth);

but in this class FBBridgeEvent
http://github.com/pierot/fbflashbridge/blob/13652b514c43c04a1d7bcf5759d6408ab3e93385/flex/src/be/wellconsidered/apis/fbbridge/events/FBBridgeEvent.as

No mention of EMAIL_SENT_FAILED_AUTH

just these

public static var LOGGED_IN:String = “LOGGED_IN”;
public static var LOGGED_OUT:String = “LOGGED_OUT”;
public static var STATUS_SET:String = “STATUS_SET”;
public static var FRIENDS_LIST:String = “FRIENDS_LIST”;
public static var USERS_INFO:String = “USERS_INFO”;
public static var USER_INFO:String = “USER_INFO”;
public static var APP_USERS:String = “APP_USERS”;

Am I using old code?

(I’m using the raw source files rather than the compiled .swc clip, and converting to flash ide rather than flex.) SO may have missed something, any clues.

Ta

Steve

Hi.
I’m trying to recompile the as3fbflashbridge.swc to improve it adding it functions to get the user’s photos. I’ve got the raw code from github but after compile it and use it in my project appear a lot of problems. It seems like it doesn’t recognize the class FBBridge in the new swc that i’ve compiled.
Do you know if could be any problem for use flex builder 4?
Any help?.
Thanks

Bruno

Very nice example. Although I can’t get it running for some reason. What I’m supposed to do with the ‘www’ folder in the zip-package?

Thanks

Hi excellent this is something what i was looking for ,
but i un able to view any login screen when i click the connect button. if any body know about this please let me know as this is urgent requirement for me.

Does anyone know how to post a SWF to a user’s Facebook wall where the size is larger than 320 x 260? Trekyourself (http://www.trekyourself.com) posts a 420 x 420 SWF.

Thank’s for nice example :)

Does any body have a a clue why it isn’t working with Google Chrome?

[...] dengan menggunakan teknik external interface ke Javascript. Contohnya ialah source yang dibuat oleh Pieter Michels. Konsep source ini ialah mentranslasikan contoh kode yang diberikan oleh Facebook ke kode [...]

Well…. Im pulling my hair our. This tutorials started well – seemed perfect…. then it says i need flex.

I cant use flex. alll i want to do is use the as3 libruary -> have a pop up connect window – > then use the api to do something with the data i get back from flash.

These tutorials are all far to hard…. i wish… really wish someone could just tell me what to do … Im putty in your hands. I just want to build a little game on my site that uses flash with connect…… But i have no idea.

If theres anyone that can help…. next time you have a problem i will do everything in my power to help you back

martin

[...] may have seen my last blog post about a Facebook Connect to Flash bridge and so now, there is a second Flash bridge, for OpenSocial this time. We used it internally for the [...]

nice example, it run on my project.
i can get my name, status, but i don’t know i can get my location that was available on library.
does anybody have same problem?

Do you need your own facebook app to do this? ( with an api Key, etc… )

Thanks

@pallzoltan: I would suggest using the official Adobe library instead of mine. But, I tend to find my library in some cases somewhat easier to user + it has a lot of hooks for use in Javascript / HTML projects.

@aygham: Again, you can perfectly use the library in Flash IDE. Try downloading the source code from GitHub. (http://github.com/pierot/fbflashbridge)

@Bruno: I don’t think there is a problem when compiling in Flash Builder. I did it before without any errors.

@martin: You don’t need Flex at all. I you need more help: mail me.

@super tan: The amount of information you can fetch from a user depends on his permissions and settings. Some people allow location or e-mail to be visible, others not.

@Xavi Colomer: Yes, you need to create an application in the Developers section of Facebook.

@pieter you have saved me countless hours of research

[...] I threw away the old library (http://www.wellconsidered.be/blog/2009/01/04/facebook-connect-to-actionscript-3/ all comments are closed now) and reworked the idea of a library and choose an implementation more [...]