Showing popup in the new Facebook JavaScript SDK

Question

I used to have an href in my website. When users clicked on it, a multi-friend selector showed so they could invite their friends to my website. That was done using the following code:

 FB.ensureInit(function() {
        var dialog = new FB.UI.FBMLPopupDialog('XXXXXXX', '');
        var fbml = 'Multi-Friend-Selector FBML'
        dialog.setFBMLContent(fbml);
        dialog.setContentWidth(620);
        dialog.setContentHeight(570);
        dialog.show();
    });

Now, I'm using the new JavaScript SDK (http://connect.facebook.net/en_US/all.js), but the old methods are not present...
How can I do it with the new SDK?

Answer 1

Yes, finally got the irritating box to resize from the original 964 pixels:

For compatibility (let's hope it will get fixed in the future, or documented better) I still say

size:(width:600,height:500),

but then I break out width and height as properties of parent object, so in the end use:

size:(width:600,height:500),width:600,height:500, ...

And now it's also resizable with the JavaScript library of your choice, that is, here's a sample with jQuery resizing:

FB.ui({
    method: 'fbml.dialog',
    fbml: (
         '<div style="width:480px;border:1px black solid;">A small JavaScript library that allows you to harness ' +
         'the power of Facebook, bringing the user\'s identity, ' +
         'social graph and distribution power to your site.</div>'
       ),
    size: {width:640,height:480}, width:640, height:480
});
$(".FB_UI_Dialog").css('width', $(window).width()*0.8); // 80% of window width
// I'm also sure you could stack this call if you wanted to