Remedie

iframe is the new embeds (when it's disabled)

Remedie makes full use of video sharing sites "Share this video" feature by auto-generating those embed flash player inside its DOM on Shadowbox player.

Unfortunately the web is sometimes not as free as we expect it to be. Some videos on YouTube, Veoh, Nico Nico Douga or Vimeo do not allow embedding and you'll see errors like this.

Also, even when the embedding itself is enabled, you can't get the full features and the exact same user experience as with the one you have on their site. For example, you can't fullscreen Nico Nico Douga video, nor watch the 480p Hi-Res video in Hulu embed player, 30-minute or longer Veoh video only gives you a 5 minute preview, and some videos on Vimeo don't enable HD in embedded players.

Today Remedie added a new feature to break these restrictions: iframe. (This is not actually new since we already use this technique in MSN Video and South Park Studios)

This might sound like a backward solution, but this is a great compromise. You can right-click or Ctrl-click the thumbnail to open the context menu and select "play item in an embedded iframe" and the page opens inline inside an iframe, and you can play and click "Fullscreen" or enable HD, whatever you want to do. The fullscreen makes the video actually fullscreen (tested with Safari, Firefox both on Mac OS X and Windows), so there's no problem actually playing back in an iframe.

The nice thing about Remedie's YouTube plugin is that now it checks if the video disables embedding by scraping the page, and if so, it falls back to the iframe mode automatically. I'd like to make this smart change to other video sharing sites in the near future, but that might be complicated and slow the crawling for some sites.

There's one caveat with Nico Nico Douga with Safari though: they set temporary cookies before opening the flash video, and Safari doesn't accept the cookies in an iframe by default, so playback will fail. You can open the Safari preferences and change the cookie preference to "Always accept" to deal with this. With IE you need to change the privacy setting in the same way. Firefox accepts all cookies in an iframe so there's no problem.

MSN Video plugin

0.3.0 release got an experimental "iframe" embed for the sites that do not allow direct flash embeds, and that now allows you to watch embeded videos from MSN Video including my favorite internet drama series The Guild Season 2.

You can just subscribe to their RSS feed and now you can watch the video inside Remedie. Since it's an iframe loading the page, you need to click the "fit-to-screen" button once to fit with the internal window correctly.

Veoh plugin updates

This morning, one of our favorite video sharing site Veoh got a major site upgrade. Just as expected, they updated their undocumented Ajax search API as well, and that made Remedie search plugin stop working for them. I spent a couple of minutes digging their new HTML and URL layouts and figured out how to fix it, which was rather easy :)

So the new Veoh search apparently doesn't use all the AJAX stuff and instead directly embed thumbnails, URLs and titles in its HTML, which makes it really easy for Remedie (Plagger) to scrape out. 

You can subscribe to the search query URL like http://www.veoh.com/search/videos/q/{keyword} or collection like http://www.veoh.com/collection/{collection name} and they both should work fine. Remedie plugin takes care of sorting and unfiltering search results to be reverse chronological and all languages (rather than default "English").

Note that some of the official videos, for instance from NBC or Comedy Central, are not embeddable and you'll see errors like this on Remedie.

In that case you simply need to open the "Link" in the right side and watch the video on veoh site. Some big video files requires you to download their Web Player to watch the whole video, as well.

Enjoy!

Shadowbox UI merged and 0.3.0 release

This weekend and Monday I spent a couple of hours digging how Shadobox.js works and integrated most of functionalities we built around JW Media Player, and merged to the github master. The new UI is sexier and even more useful since it has Next/Prev button using Shadowbox's gallery functionality.

So you can click those buttons to skip to the next video, or go back to the previous one, which you couldn't do with the original player and JS code. Of course hot keys are still available, so you can use right/left arrow key, and also hit Esc (or q or x) to quit watching the video.

I needed to hand-patch some of Shadowbox plugins (especially FLV and QuickTime) to enable some of the advanced features like RTMP streaming, Thumbnails and DOM scripting, but otherwise it was straightforward.

The Shadowbox.JS developer seems to be working on version 3 of its code, but so far as I tested it's still under the development. We'll keep an eye on it when it's out, since the new code base seems more flexible.

I also added a new experimental enclosure type "HTML" which you can inline with an iframe, or open in a new browser window. As an example, there's a new plugin for South Park Studios videos, which doesn't allow SWF embeds but you can still watch it in fullscreen inside iframe if you're using Firefox (with Safari apparently you can't fullscreen inside iframe for security reasons, which sounds reasonable).

Last night I tagged the current master as 0.3.0. This doesn't really mean anything besides just git tags, but there's a benefit of doing it since a) it gives you an overview of what has been changed, b) gives you the list of bugs fixed and c) makes the "rhythm" of periodic releases which makes the development more fun and sustainable (hopefully).

As always, try out the new UI and features, and report on IRC (#remedie@freenode) if you find bugs, or have any useful suggestions!

Some UI updates: jGrowl and Shadowbox.js

Here are some screencasts (no audio) for the the new UI enhancements matsuu and I added last night.

The first one is Shadowbox.js, the lightbox-ish media player that uses JW Media Player. Fortunately we used JW Media Player already, so the changes we needed to replace JW player with Shadowbox was not that big. (You might have noticed that with the mousemove events over the channel image gives a random list of video thumbnails in the channel, a la iPhoto/MobileMe style. That's a new thing as well :) This feature is under the development and you can get the code from shadowbox branch.

The next one is jGrowl, growl-ish jQuery plugin to display the notification window with an animation. So whenever you refresh the channel and if there's a new item in it, you'll get notified. This is not Mac's Growl, but the one that lives on the browser! This feature is ready to be used so it's in the master branch you can git pull from. (Note that this is quite a hack for now, since the plan is to eventually replace this with an upgraded server side asynchronous events using technologies like Comet.)

git pull the latest code and enjoy!

Upgraded jQuery and JW Media Player

Remedie includes jQuery and JW Media Player so that we can build this cool UI to play videos smoothly, and we recently upgraded the bundled versions of these libraries.

jQuery 1.3 is based on John Resig's sizzle CSS selector and it's brilliantly fast and has a built-in support of jQuery.live() to bind events on dynamically generated elements, which is very important because Remedie currently builds almost all of its HTML elements with jQuery DOM manipulation on the fly without any page load.

JW Media Player was upgraded to 4.4, the trunk version instead of the released 4.3 because we found some minor problems with audio thumbnails and RTMP. I needed to update parameters and what not to work with the latest but so far it works fine. I haven't realized it but JW Media Player seems to have lots of plugins to add functionalities to its player. Currently Remedie uses custom JavaScript code to, say, add keyboard hotkey to manipulate videos but I guess it could be done using Flash plugin as well. We haven't built  any ActionScript code ourselves but it might be fun to do, especially to add some useful features like these!

Home

This is a blog for the Remedie project, perl and JSON based pluggable Media Center application. See github for source code and Google Code for Wiki and issue tracker (SVN repository on Google code is OLD!).

Subscribe to the feed and join the IRC channel #remedie on freenode to keep yourself updated.