Firefogg: Ogg Theora Encoding Plugin

Ajaxian » Front Page by Dion Almaer

Test Drive the latest Thusnelda theora encoder with in-browser Video Encoder Firefogg.

Firefogg is an open source extension written by xiph hacker Jan Gerber that lets web developers request ogg video from their users. Since Firefogg is a Firefox extension it allows users to stay up to date with the latest and greatest theora encoder improvements. Firefogg supports a rich api for enabling web applications to drive in-browser transcoding from any source footage to ogg theora video (and possibly other free formats in the future). Firefogg supports simultaneously uploading while its transcoding via resumable one meg post chunks. It also supports fall-back to HTTP POST all-at-once. Both methods include progress indicators.

Firefogg can also encode to a local file and an example local transcoding application is on the site. The sample application builds on jQuery UI so it supports custom themes. Integration for firefogg with wikimedia commons are in testing. With Firefoxs video tag support this should be a helpful extension for converting video to ogg theora or supporting ogg theora video contributions in your website.

Firefogg can minimize the need for costly server side transocding infrastructure. It also helps avoid the extra transcode problem that plagues net video where a user saves to a compressed format locally to save time uploading; then the server re-transcodes the video so others can view it with a flash plugin. With Fireofogg we can go strait from the high quality source to the format distributed on the web site.

Here is an example of using the API yourself to convert video:


  1. if(typeof(Firefogg) == ‘undefined’) {
  2. alert(‘You dont have Firefogg, please go to to install it’);
  4. }
  5. var ogg = new Firefogg();
  6. if(ogg.selectVideo()) {
  7. var options = JSON.stringify({‘maxSize’: 320, ‘videoBitrate’: 500});
  8. var data = JSON.stringify({‘title’: ‘example video’});
  9. ogg.upload(options,’, data);
  10. var updateStatus = function() {
  11. var status = ogg.status();
  12. var progress = ogg.progress();
  13. //do something with status and progress, i.e. set progressbar width:
  14. var progressbar = document.getElementById(‘progressbar’);
  15. parseInt(progress*200) +‘px’;
  16. progressbar.innerHTML = parseInt(progress*100) + ‘% – ‘ + status;
  17. //loop to get new status if still encoding or uploading
  18. if(ogg.state == ‘encoding’ || ogg.state == ‘uploading’) {
  19. setTimeout(updateStatus, 500);
  20. }
  21. //encoding sucessfull, state can also be ‘encoding failed’
  22. else if (ogg.state == ‘done’) {
  23. progressbar.innerHTML = ‘Upload done. You can close this window now’;
  24. }
  25. }
  26. updateStatus()
  27. }
Cet article a été publié dans Uncategorized. Ajoutez ce permalien à vos favoris.

Laisser un commentaire

Entrez vos coordonnées ci-dessous ou cliquez sur une icône pour vous connecter:


Vous commentez à l'aide de votre compte Déconnexion /  Changer )

Photo Google+

Vous commentez à l'aide de votre compte Google+. Déconnexion /  Changer )

Image Twitter

Vous commentez à l'aide de votre compte Twitter. Déconnexion /  Changer )

Photo Facebook

Vous commentez à l'aide de votre compte Facebook. Déconnexion /  Changer )


Connexion à %s