Rails helper for SWFObject

By Alastair | June 5, 2007

SWFObject (formally know as FlashObject) is a javascript file that unobtrusively embeds flash in a web page. It works by replacing a holder div with Flash content, if the end user doesn’t have Flash or the targeted Flash player SWFObject will ‘fail’ silently and keep the original div. Here’s a Rails helper that let’s you use SWFObject in your views.

The steps are:

1) download SWFObject, and place it in ‘public/javascripts’

2) include it in your layout file

<%= javascript_include_tag "swfobject" %>

3) put the helper in ‘app/helpers/application_helper.rb’:

# swf_object
  def swf_object(swf, id, width, height, flash_version, background_color, params = {}, vars = {}, create_div = false)
    # create div ?
    create_div ? output = "<div id='#{id}'>This website requires <a href='http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash&promoid=BIOW' target='_blank'>Flash player</a> #{flash_version} or higher.</div><script type='text/javascript'>" : output = "<script type='text/javascript'>"
    output << "var so = new SWFObject('#{swf}', '#{id}', '#{width}', '#{height}', '#{flash_version}', '#{background_color}');"
    params.each  {|key, value| output << "so.addParam('#{key}', '#{value}');"}
    vars.each    {|key, value| output << "so.addVariable('#{key}', '#{value}');"}
    output << "so.write('#{id}');"
    output << "</script>"
  end

4) Then in any rhtml page you can use the helper like so (note: place your SWFs in ‘public/swfs’):

<%= swf_object("/swfs/myswf.swf", "flash_id", "550", "400", "9", "#000000",
        {:wmode => "transparent", :quality => "high"},
        {:myvar1 => "foo1", :myvar2 => "foo2"}) %>

In the above code the flash content will replace a div with the id ‘flash_id’, the required arguments are (SWF File location, holder div to replace, width, height, flash version, background color) it also shows two parameters being set ‘wmode’ to transparent (for those annoying flash overlay ads) and ‘quality’ to high, it also passes two variables to the SWF ‘myvar1′ and ‘myvar2′ which are then available at root level of your SWF (’_level0.myvar’ in AS2, a bit trickier in AS3, and ‘Application.application.parameters.myvar’ with Flex).

4b) I, being a lazy/absent-minded programmer, included an option to programmatically create the holder div, just add true as the last argument:

<%= swf_object("/swfs/myswf.swf", "flash_id", "550", "400", "9", "#000000",
        {:wmode => "transparent", :quality => "high"},
        {:myvar1 => "foo1", :myvar2 => "foo2"},
        true) %>
This entry was posted in ActionScript, Flash, Flex, JavaScript, Ruby on Rails. Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

8 Comments

  1. Scott Becker
    Posted June 5, 2007 at 3:34 pm | Permalink

    Good idea… This probably won’t format as nicely as I’d like, but we’ll see. I’m a big fan of named arguments, like most rails methods have, so you don’t have to remember the order of things. (Which is first? height or width, etc). So, for a nice rails-esque API, you could design it to be called it like this:

    “/swfs/myswf.swf”,
    :id => “flash_id”,
    :width => “550″,
    :height => “400″,
    :version => “9″,
    :bgcolor => “#000000″,
    :params => {:wmode => “transparent”, :quality => “high”},
    :vars => {:myvar1 => “foo1″, :myvar2 => “foo2″}
    ) %>

    Just a thought.

  2. Scott Becker
    Posted June 5, 2007 at 3:35 pm | Permalink

    It mostly formatted. Left off the beginning, which was

    swf_object(
    :src => “/swfs/myswf.swf”,

    …etc

  3. Henrik N
    Posted October 10, 2007 at 8:43 am | Permalink

    Made a helper for SWFObject 2.0. Would write it up in my own blog, but I’ve yet to write full docs and tidy it up some more. Since I somewhat doubt I’ll ever get around to that, I’ll dump it here for now :) http://pastie.textmate.org/private/nu0hpwxmtcx0toi58j4kha

    Takes hash arguments (for everything but the src), encodes flashvars properly.

    Used your default placeholder text; hope you don’t mind.

  4. jakes
    Posted March 28, 2008 at 1:00 am | Permalink

    hi
    it shows This website requires Flash player 8 or higher.
    “transparent”, :quality => “high”},
    {:myvar1 => “foo1″, :myvar2 => “foo2″},
    true) %>
    i put this in my rhtml file and i installed flv player also but the problem is remain
    plz help me i have to deliver my site
    thanks
    jakes

  5. Alastair
    Posted March 28, 2008 at 5:52 am | Permalink

    @jakes did you remember to put SWFObject in ‘public/javascripts’? and put < %= javascript_include_tag "swfobject" %> in your app’s layout?

  6. luo
    Posted August 18, 2008 at 2:03 am | Permalink

    i hava a error
    SWFObject is not defined
    [Break on this error] var so = new SWFObject(”/swf/FileUpload_5.swf”, “flashcontent”, “400″, “200″,…
    please help me.
    thank you

  7. Marc-Andre Lafortune
    Posted January 17, 2009 at 2:05 pm | Permalink

    I wrote a plugin for the latest version of SWFObject (2.1) which makes it a breeze to do this. It also treats SWF like other assets (images, javascripts, etc…) Check it out at:

    http://github.com/marcandre/swf_fu

  8. Duncan Beevers
    Posted February 10, 2009 at 9:13 pm | Permalink

    swfobject no longer uses the global SWFObject. This helper is invalid for recent versions of swfobject. I maintain an up-to-date helper here: http://github.com/duncanbeevers/swf_object_helper/tree/master

Post a Comment

Your email is never published nor shared. Required fields are marked *

*
*

*
To prove you're a person (not a spam script), type the security word shown in the picture. Click on the picture to hear an audio file of the word.
Click to hear an audio file of the anti-spam word