How can I check to see if the user has Facebook Timeline?

Question

I want to enable certain features only for users with the "publish_actions" permission and Timeline. How can I detect if the user enabled Timeline?

Foothill

Answer 1

Currently there is no API way to check if user have enabled timeline.

You can try to use "Add To Timeline (beta)" social plugin (passing publish_actions as perms) in combination with Facebook JS-SDK Events.

Subscribe to auth.login, auth.authResponseChange and/or auth.statusChange events and check status property of response passed to event listener, once event fired and user is connected you can publish action and if succeed mark user as one who have timeline installed.

This however have some downsides:

• Better be sure not to ask users for publish_actions in flows other than "Add To Timeline" social plugin to be sure they are have both timeline and permission granted.
• You should be publishing action to ensure that they have granted permissions to do so, since those events can be other user actions (like password change or Facebook user switching, etc...).

Cantabile

Answer 2

1) A partial solution is to check if user has a album named "cover photos". Although not all but MOST users who would have activated timeline would have this album!!

2) A sure way is to actually retrieve html contents of a user's profile and check if it has a timeline!!

Suppository

Answer 3

Eventually (likely in the near future) everyone's profile will be rolled over to Timeline, so it would seem facebook has not provided a reliable way to detect a timeline-enabled app.

Runaway

Answer 4

The following potential solution requires no additional permissions request. If you add the Facebook timeline plugin code within a concealed DIV you can wait until after the FB Canvas is done loading (or xfbml in web pages) and test the CSS height of that element. If the user does not have Timeline it will be 0px. Otherwise, it will be 250px (as I've included it). This only works within Facebook Apps (not in Facebook integrate web pages):

Facebook hides this plugin element if the user has not activated timeline by setting the element style height to 0.

Add this to your App page:

<div id="timeline-hidden" style="display:none">
  <div class="fb-add-to-timeline" data-show-faces="true"></div>
</div>
<div id="timeline-test"></div>

Then, in your javascript (this use jQuery, FYI):

window.fbAsyncInit = function () {
FB.init({ ... }); // after your FB.init code

    FB.Canvas.setDoneLoading(
  function (result) {

    var str_timeline;
    var tlsrc = $("#timeline-hidden").find("iframe").first().css("height");

    if("0px"==tlsrc)
        str_timeline = '<h2 style="color:red">This user DOES NOT have timeline.<h2>';
    else
        str_timeline = "<h2>This user DOES have timeline.</h2>";

    $("#timeline-test").html(str_timeline + ", timeline plugin css height:" + tlsrc + ", loadtime: " + result.time_delta_ms);
  }
);

};

The following for Web Integration is somewhat less reliable due to potential network latency, but the concept could be modified to some workable solution:

Since FB.Canvas.setDoneLoading is not called on a website that includes FB integration, modify the FB.Canvas.setDoneLoading function above to subscribe to the xfbml.render action and put a timeout on the test:

window.fbAsyncInit = function () { FB.init({ ... }); // after your FB.init code

$(document).ready(function () {
    FB.Event.subscribe('xfbml.render',
  function () {
    setTimeout( function(){
        var str_timeline;
        var tlsrc = $("#timeline-hidden").find("iframe").first().css("height");

        if("0px"==tlsrc)
            str_timeline = '<strong><span style="color:red">This user DOES NOT have timeline.</span></strong>';
        else
            str_timeline = "<strong>This user DOES have timeline.</strong>";


        $("#timeline-test").html(str_timeline + ", timeline plugin css height:" + tlsrc);
    }, 250);
  }
);

});

};

I've found in my testing that moving the FB.Event.subscribe('xfbml.render', into a $(document).ready(function() { ... }); helps with latency when your app is embedded in a Facebook page (takes a little longer to load). Just started testing this out, so it may or may not hold up to further testing.

Haycock