JW Player - Error loading player: HTML5 player not found in Rails 3.2 app on Heroku

Question

I have the licensed version of JW Player 6. I downloaded the files and put them in the assets/javascript directory. Aside from the skins directory, there is a JS file for the HTML5 player as well as a flash.swf file for the flash player. Everything that I've done thus far has worked locally but as soon as I push to Heroku I get errors.

First attempt:

In my application.js file:

...
//= require jwplayer/jwplayer
//= require jwplayer/jwplayer.html5 # the file name is jwplayer.html5.js
...

After running rake assets:clean ; rake assets:precompile I get the following error in the view (on Heroku):

An ActionView::Template::Error occurred in nodes#show:
jwplayer/jwplayer.html5.js isn't precompiled

---

Second attempt:

In my application.js file:

...
//= require jwplayer/jwplayer
...

Then, I added this to the production.rb environment config file:

# Also tried %w(jwplayer.html5.js)
config.assets.precompile += %w(jwplayer/jwplayer.html5.js)

After cleaning and precompiling the assets and pushing to Heroku, the original ActionView::Template::Error was no longer happening, but now the JW Player displays this message:

Error loading player: HTML5 player not found

---

This is the JW Player initialization in the HAML view:

:javascript
  jwplayer("video_display_object_#{display_object.id}").setup({
    width: "948",
    height: "533",
    image: "#{display_object.video_screenshot_url}",
    file: "#{display_object.resource_url}",
    modes: [
        { type: 'flash',
          src: "#{asset_path('jwplayer/jwplayer.flash.swf')}",
          config: {
            skin: "#{asset_path('jwplayer/skins/beelden.xml')}",
            'controlbar.position': 'over',
            'controlbar.idlehide': 'true'
          }
        },
        // I've also tried "#{javascript_path('jwplayer/jwplayer.html5.js}"
        // And "/assets/jwplayer/jwplayer.html5.js"
        { type: 'html5', src: "#{asset_path('jwplayer/jwplayer.html5.js')}" }
    ]
  });

I don't really know what to do at this point. Like I mentioned earlier, everything works locally, just not on Heroku.

Any suggestions?

Answer 1

This was quite frustrating, but we managed to get it up and running. The solution is actually quite simple (once you know what to do):

If you decide NOT to use the cloud-hosted JW Player (which is quite easy to set up since the asset pipeline is not involved), download and unzip the jwplayer folder.

Drop the extracted jwplayer folder into your Rails app's /app/assets/javascripts folder.

Add the following to your /app/assets/javascripts/application.js:

//= require jwplayer/jwplayer
//= require jwplayer/jwplayer.html5

Run rake assets:precompile.

To get the player up and running in a view, use the piece of (HAML) code below. (Additional options are available here.)

%div{id: 'video'} Loading the player...
:javascript
  jwplayer('video').setup({
    file: 'INSERT_VIDEO_FILE_PATH_HERE',
    flashplayer: "#{asset_path('jwplayer.flash.swf')}",
    html5player: "#{asset_path('jwplayer.html5.js')}"
  });

It's essential you specify the flashplayer and html5player attributes (in case you want to support both versions of the player).

Customize away!