Thursday, May 7th, 2009

Uberplayer shows us what JavaScript media players can look like

Category: jQuery

Media Players seem to be a hot topic right now. After the upgrades to Scott Schiller’s SoundManager, Paul Bakaus of the jQuery UI team now puts a firm stake into the ground with the uberplayer.

Uberplayer Screenshot

The uberplayer takes a leaf out of the book of the UI of standalone media players. Instead of cluttering the interface with all kind of controls it only shows what is needed on demand. The different menus slide in and out as needed, there is a coverflow menu with video previews and very useful keyboard shortcuts.

Check it out – I love the amount of detail that went into it and how smooth the overall experience is.

Posted by Chris Heilmann at 11:24 am

3.4 rating from 47 votes


Comments feed TrackBack URI

javascript media player is slightly misleading.

this is a flash media player controlled with javascript.

Comment by driverdave — May 7, 2009

Indeed. Only the GUI is JavaScript, the rest is flash. It doesn’t help the case that most of the fantastic GUI things here could just as well be added in the flash itself.

Comment by Drakim — May 7, 2009

The coverflow implementation is very slow and clunky (at least on the latest version of Chrome). Detracts from the experience.

Also, what’s up with the name? Does it want to be taken seriously or not?

Comment by thnkfstr — May 7, 2009

For me the entire page displays the Flash menu when I right click in my browser. Not sure this really counts as a Javascript player at all.

Comment by pplante — May 7, 2009

@driverdave: It depends on what you consider the player. The actual video output is Flash, everything else JavaScript.

@Drakim: Except that Flash can easily replaced by something else, i.e. the tag or Quicktime. In fact, I had a experimental quicktime version running some weeks ago.

@thnkfstr: Coverflow is mostly chunky during playback – it’s due to the flash overlay. Also, it’s by no means meant as a finished product. The name is more of a codename.

Comment by pbakaus — May 7, 2009

Can and should are two different things. And also, doesn’t *every single RIA framework* have a demo that looks identical to this these days?

Comment by ilazarte — May 7, 2009


i’d consider the player whatever plays the media.

the user interface controls the player, and many players allow a javascript user interface to control their player.

this is a javascript UI controlling a flash media player.

i can see some cases where this would be needed, and have done these things myself. but if your implementation fails without the flash plugin, why not just implement everything in flash?

Comment by driverdave — May 7, 2009

Why does it have to be something Flash can’t do? It’s nice that I can grab this and have a decent youtube media player interface to add to my site, and I can modify and tweak the interface with javascript which I know. I don’t know Flash, never had any interest in learning it, as far as I understand it (and I could be wrong) I’d have to spend a lot of money on development tools just to be able to create and/or edit flash programs.

Comment by jrussbowman — May 7, 2009


good points, and this is a cool user interface.

Comment by driverdave — May 7, 2009


Actionscript is essentially an extension of Javascript, the syntax is basically exactly the same and a lot of the things you’re used to doing in Javascript will work in Actionscript. I don’t think you’ll have any trouble with AS if you’re comfortable with JS. Also, there seem to be some good free or open source development tools (although if somebody could give me some tips for getting any of them to work on OSX I’d appreciate it!) for flash.

Comment by okonomiyaki3000 — May 7, 2009

I really like the interface, and if it can be configured via javascript without modifying flash so much better.

Comment by jfalameda — May 8, 2009

@driverdave another case for JavaScript controlling a flash player is accessibility. You cannot get into flash using a keyboard with non-ie, non-windows browsers. You can however reach the player controls and have your music and videos that way. Turn off CSS at and you’ll see that they use buttons to control the player, too.

Comment by Chris Heilmann — May 8, 2009

@driverdave and others: There are several advantages – the most critical one is that you can exchange the youtube API for anything else. It could even be released as plugin. Second is what Chris mentioned – accessibility. Third, what others have already mentioned, is that pure flash is definitely harder to maintain. Flash itself is not open – only the container format SWF is. And any flash content needs to be compiled.

Comment by pbakaus — May 8, 2009

It’s cool, and will be very useful once native video handling becomes more streamlined!

Comment by mdmadph — May 8, 2009

Leave a comment

You must be logged in to post a comment.