Facebook.loadOnce is simple wrapper for the official Facebook JS SDK for promise-based lazy-loading.

facebook.loadonce.js

/*global $ */

/*

 _______  _______  _______  _______  _______  _______  _______  ___   _
|       ||   _   ||       ||       ||  _    ||       ||       ||   | | |
|    ___||  |_|  ||       ||    ___|| |_|   ||   _   ||   _   ||   |_| |
|   |___ |       ||       ||   |___ |       ||  | |  ||  | |  ||      _|
|    ___||       ||      _||    ___||  _   | |  |_|  ||  |_|  ||     |_
|   |    |   _   ||     |_ |   |___ | |_|   ||       ||       ||    _  |
|___|    |__| |__||_______||_______||_______||_______||_______||___| |_|
 ___      _______  _______  ______   _______  __    _  _______  _______
|   |    |       ||   _   ||      | |       ||  |  | ||       ||       |
|   |    |   _   ||  |_|  ||  _    ||   _   ||   |_| ||       ||    ___|
|   |    |  | |  ||       || | |   ||  | |  ||       ||       ||   |___
|   |___ |  |_|  ||       || |_|   ||  |_|  ||  _    ||      _||    ___|
|       ||       ||   _   ||       ||       || | |   ||     |_ |   |___
|_______||_______||__| |__||______| |_______||_|  |__||_______||_______|


Facebook.loadOnce is a simple wrapper for the official Facebook JS SDK for promise-based lazy-loading.


  1. Whenever you want to for example initialize a Facebook button:

  Facebook.loadOnce("nl-nl").done(function (FB) {
                            FB.XFBML.parse();
                          });


  2. When you call loadOnce again it will NOT load again but with it WILL trigger 
     the done handler immediately:

  Facebook.loadOnce().done(function (FB) {
                            FB.XFBML.parse();
                          });

  Note that the culture parameter is not required the second time. If you pass in 
  a culture string that is different from the first, an exception will be thrown.


  3. Also, since Facebook.loadOnce returns a Promise object, you can use the full 
  Promise API, including chaining asynchronous calls:

  Facebook.loadOnce("nl-nl").then(function () {
    return $.post("/dummy", { some: "data" });
  })
  .then(function() {
    return $("#dialog").animate({ opacity : 1});
  })
  .done(function () {
    console.log("all done!");
  });

*/

var Facebook = (function() {
  "use strict";

  var _loadingStarted, _culture;

  window.fbAsyncInit = function() {
    if (window.FB)
      _loadingStarted.resolve(window.FB);
    else
      _loadingStarted.reject(); // shouldn't happen! probably means a bug in FB
  };

  function _load() {
    _loadingStarted = $.Deferred();

    // Load the SDK Asynchronously
    (function (d) {
      var js, id = 'facebook-jssdk', ref = d.getElementsByTagName('script')[0];
      if (d.getElementById(id)) { return; }
      js = d.createElement('script');
      js.id = id;
      js.async = true;
      js.src = "//connect.facebook.net/"+_culture+"/all.js";
      ref.parentNode.insertBefore(js, ref);
    } (document));
  }

  return {
    loadOnce : function(culture) {
      if (_loadingStarted)
        if (culture !== _culture)
          throw new Error("Culture cannot be changed after first load");

      if (!_loadingStarted)
      {
        if (!culture)
          throw new Error("Argument missing: culture");

        _culture = culture;
        _load();
      }

      return _loadingStarted.promise();
    }
  };

}());