How to embed "Share on Facebook" button into Flex application?

Question

I'm trying to duplicate the behaviour of the "Share on Facebook" button from Youtube. Basically, inside a Flex app I'll have a button and when I click it I want a popup that enables me to post something on the wall.

While it is possible to make a call to javascript to open the pop-up I want to be able to set the images and the text of my posting.

Do you know how I could set the images or text as a paramter to the sharer window?

Thank you!

Answer 1

as I understood you asking for some help in accessing js popup in html page of facebook share button, so you should use ExternalInterface in this casa and access needed DOM node using getElementById function in your js interface.

In other case I want propose you to read another one way http://www.riaxe.com/blog/flex/publish-into-facebook-wall-from-flex/

Answer 2

This is fairly straightforward to do. Youtube uses the Facebook API which pops up a new window (Info on Facebook sharer API).

To do this in flex,

1. Create a button that onClick will call a javascript method, ExternalInterface.call("fbLink", "www.yahoo.com");

2. In your HTML file (most likely index.template.html) add the JavaScript method, fbLink which does the following:

   function fbLink(url) { window.popup("http://www.facebook.com/sharer.php?u=" + url, {height:440, width:620, scrollbars:true}) }

3. Now when a user clicks on the button they will be sharing the link "yahoo.com" with facebook account.

Answer 3

It seems that you want to have a button on the flash application and once clicked it opens the facebook page that shares the video/image that pertains to the clicked button. What you want to do is simply create a button that on click opens a new website to facebook using their share api which has the following format:

var facebookShare:String = "http://www.facebook.com/share.php?u=' + encodedVideoLink + '&t='+ encodedVideoText";

Where the u parameter stands for the link that you wish to share, and the t parameter stands for the title of the piece that you want to share, whether it be a picture or video.

You want to add an event listener on MouseEvent.CLICK that has as its callback function a method that handles the opening of the facebook page passing the facebookShare variable as shown above. To open another page on your browser you can use this AS3 Class called URLNavigator: http://www.danishmetal.dk/project/source/com/zorked/URLNavigator.as

To sum it up, something along these lines would do:

var facebookShare:String = "http://www.facebook.com/share.php?u=' + encodedVideoLink + '&t='+ encodedVideoText";
    facebookButton.addEventListener(MouseEvent.CLICK, this._goToUrl(facebookShare));

private function _goToUrl(link:String):Function {

        var window:String = "_blank",
            feats = "",
            thisOverlay:Object = this; // to not lose scope when returning a func

        return function (e:MouseEvent):void {
                trace("Opening link to:"+link);
                try { URLNavigator.ChangePage(link, window, feats); }
                catch (e:Error) { trace("error launching "+link+" in "+window+" with feature set "+feats); }
            }
        }

I hope that helps. If you have questions regarding the code please let me know.