Detecting Success of Dynamic Embedding

Since SWFObject 2.x's dynamic publishing option uses an asynchronous domready/onload event, the default swfobject.embed code won't return a boolean indicating whether the embed was successful.  In most cases, this is no big deal. However, some developers rely on this 'success' boolean for determining whether they need to go to Plan B and present alternate HTML-based content or perhaps change their page's styling.

For instance, a developer may want to use AJAX to load HTML content if a SWF fails to load. A boolean indicating success would help him/her handle their custom DOM manipulation.

Thanks to SWFObject's flexible API, there are a couple of ways you can handle this situation.

Asynchronous approach: Use the Callback function

SWFObject 2.2 introduced a callback feature that allows you to invoke a custom function when a SWF is embedded. This function includes an event object that includes information about the embed's success or failure. Read more about the callback function.

Synchronous approach: Roll your own SWFObject method

If you're willing to forgo using swfobject.embed (and it's automatic use of the domready event), you can roll your own custom embed script that will instantly return a boolean indicating the success of the embed attempt.

Here's a relatively simple example of how you can roll your own embed code. For convenience — and a clean global namespace — this example appends the new function to the swfobject JavaScript object. Note that this function embeds the SWF as soon as the function is invoked, so it should not be used until after the DOM has finished loading.

swfobject.customEmbed = function (swfLoc, id, w, h, version, color){
   if (swfobject.hasFlashPlayerVersion(version)){ 
      var so = swfobject.createSWF({data:swfLoc,width:w,height:h}, {bgcolor:color},id); 
      //swfobject.createSWF returns an HTML element, not a boolean
      if(so){ return true; } 
  } 
  return false; 
}

The custom embed function could be used like this:

var success = swfobject.customEmbed("mymovie.swf", "flashcontent", "550", "400", "10", "#FFF");
 
if(!success){ 
   //embed failed! do something appropriate 
   document.getElementById("flashcontent").innerHTML = "<p>SWFObject was unable to load the SWF!</p>"; 
}

If you want to run the script as soon as the DOM has loaded, you can simply invoke it using SWFObject's swfobject.addDomLoadEvent function.

//Create the function
swfobject.customEmbed = function (swfLoc, id, w, h, version, color){ 
   if (swfobject.hasFlashPlayerVersion(version)){ 
      var so = swfobject.createSWF({data:swfLoc,width:w,height:h}, {bgcolor:color},id); 
      if(so){ return true; } 
   } 
   return false; 
} 
 
//Invoke the function once the DOM is ready
swfobject.addDomLoadEvent(function (){
   var success = swfobject.customEmbed("mymovie.swf", "flashcontent", "550", "400", "7", "#FFF"); 
   if(!success){ 
      document.getElementById("flashcontent").innerHTML = "<p>SWFObject was unable to load the SWF!</p>"; 
   } 
});

Demo: Custom embed script that returns a boolean

Questions or Comments?

If you have questions or would like to point out an error, please post your remarks in the SWFObject Google Group. Thanks!