Playing MP3s with Rails! (SoundManager2 Rails Plugin)

Posted by Larry Karnowski Fri, 07 Mar 2008 14:55:00 GMT

So you want to play MP3s from your web application? The best tool I've found for that is Scott Schill's SoundManager2 Javascript API. It invisibly uses a very small Flash object to play the MP3s, and the whole thing is very scriptable through Javascript. Getting it set up is not difficult, but it's a little bit of a pain -- so I wrote a Rails plugin!

Here's what you do:

  • Install the Rails plugin like this: ./script/plugin install http://soundmanager2.rubyforge.org/svn/soundmanager2

  • Then run the generator to get the SoundManager2 files in your app: ./script/generate sound_manager2

  • You'll notice the following files are created: public/soundmanager2.swf
    public/javascripts/soundmanager2.js
    public/javascripts/soundmanager2-jsmin.js
    public/javascripts/soundmanager2-rails.js
    public/images/SoundManager2/pause-control.gif
    public/images/SoundManager2/play-control.gif

  • Then, to add basic play/stop functionality to your view, add the following to your ERB file:

<%= javascript_include_tag :defaults %>

<%= 
  sounds = [
      ["sound1", "http://url/to/sound1.mp3"],
      ["sound2", url_for(:controller => "sounds", :action => "listen", :id => "2")],
  ]
%>  

<%= initialize_sounds(sounds) %>

<div>Play sound 1: <%= toggle_sound "sound1" %></div> 
<div>Play sound 2: <%= toggle_sound "sound2" %></div>
  • Or, if you want more functionality, start calling the SoundManager2 Javascript APIs directly.

Here are some screenshots of this plugin in action. Here you're looking at part of a table with MP3s ready to play...

And then here you've clicked on the middle song. Note the MP3 will start playing immediately, even while it's downloading!

Clicking the "pause" button will stop the playback.

Here are the project links:

Oh, and by the way, both the Javascript API and Rails plugins are released with BSD/MIT licenses!

I'm definitely wanting to put more "off-the-shelf" behavior in this plugin, but for now the simple play/stop behavior is all my application needs. If you need something else, or want to send me some patches, please shoot me an email!

Tags , , , , ,  | 1 comment

Comments

Leave a response

  1. chris said 25 days later:

    Hi, I like this plugin a lot :-)

    I have a problem, though:

    If I'm iterating through a bunch of MP3s something like this :

    <% for mp3 in @mp3s %>

  <% sound = [[mp3.name, mp3.public_filename]] %><%= initialize_sounds(sound, debug=true) %><%= toggle_sound mp3.name %>

<% end %>

    Only the last MP3 is loaded as a sound. For the rest, I get this:

    soundManager.onload() threw an exception: soundManager.createSound(): Not loaded yet - wait for soundManager.onload() before calling sound-related methods
    soundManager.initComplete(): calling soundManager.onload()

    Any idea where I'm going wrong and what I can do about it?

    BTW, I posted this question on the plugin's Agile Web Development page earlier, where it's still awaiting moderation.

RSS feed for this post

(leave url/email »)

   Comment Markup Help Preview comment