Wednesday, November 25, 2009

Flash on Google Sites

This is a brief how-to add a Flash on a Google Site.

Google Sites allows adding Flash embedded into a Google Gadget. I uploaded a swf file to my Google Site - FlexWebTools and found a gadget that allows displaying any SWF on a Google Site page. It is called AnyFlash. It is pretty easy to use and it worked fine in my Firefox 3.5.5 on Mac OS X 10.5.8. Then I send a link to my site to my friends and they discovered that the SWF was not displayed properly on IE6 and in Firefox on Linux. I reviewed AnyFlash source code and eventually found that there is a bug 939 in the Google Gadget API. Therefore, I created a new gadget that does not use the gadgets.flash.embedFlash() method and works well with Firefox, Safari and IE6 browsers on Mac, Windows and Linux.

While working on the gadget, I found a few different ways of embedding Flash into a gadget. Some of them are pretty straightforward like simply pointing to a swf in the context tag. Some are more sophisticated. For instance, they would display images while SWF is loading, provide controls to start the application, etc. The source code for public Google Gadgets is available for preview. It is really fun to read and there are a lot of interesting stuff in the plugins code.

I compared a few SWF embedding options and decided to use SWFObject 2 API because it comes with lots of pretty helpful features that ensure a smooth SWF loading. By the way, it is used by Flash Builder too. So, I created a gadget called FlashWrapper. It is public and anyone is welcome to use it.

The setup and configuration is pretty easy. Once you add it to your page, the page will display a dialog where you can specify your SWF URL, the width and height of the SWF, the minimum required browser version (optional), the the background color (optional). The SWF could be stored on a Google Site, or on any other site.

Please let me know if you find any bugs or experience any problems with it. I hope FlashWrapper will be useful.