Twitter powered subtitles: Creation and playback for SMIL 3.0 SMILText, *.srt and Timed Text (BBC iPlayer)

Since my first post on Twitter powered subtitles for BBC iPlayer Tony Hirst has put together another interesting post presenting a method for curating supplemental content for students using his DeliTV. Tony finishes his post commenting that it would be useful to see how timed text could be used to supplement radio broadcasts with either embedded subtitles or a standalone player.

In my original post I mentioned that I tried the smilText JavaScript engine without any success. I also had a looked at how radio broadcasts are delivered via BBC iPlayer. As the majority aren’t available for download and the BBC are phasing out RealAudio next month (RealAudio can be synchronised with RealText for captioning) these were also dead-ends (I did however come across iPlayer Converter which is useful if you “want to be able to access BBC Radio programming but can’t use the iPlayer”). I also had a look at Tony’s suggested Accessible HTML5 Video with JavaScripted captions, again a dead-end without converting audio into a compatibly format.

Having exhausted these other avenues I decided to have another look at the smilText JavaScript engine again and guess what I got it to work! So as well as adding a real-time twitter player it made sense to add some other additional features below:

• Real-time twitter playback using smilText JavaScript engine
• SMIL 3.0 SMILText creation/download
• SubRip .srt creation/download
• Timed Text Authoring Format creation/download (used with BBC iPlayer and others)
• API access documentation

And here is the link to the tool:

*** Twitter Powered Subtitles Tool ***

How I got it to work

So what did I do wrong? Quite a bit as it turns out:

1. Didn’t import all of the scripts for the JavaScript SMILText Player. In my defence the official documentation was a little missleading.
2. Understanding the SMILText schema (need a <tev> before a <clear>???)
3. Using closing tags like this <tev /> instead of <tev></tev>. Don’t know if this was because of the DOCTYPE was wrong or the way the JavaScript parsed the document.
4. smilText JavaScript engine doesn’t appear to implement hh:mm:ss ClockValueSyntax

Observations and further development

It is worth noting that smilText JavaScript engine doesn’t appear to automatically wrap on white-spaces. I don’t no if this is a limitation of the engine or the SMIL language. I also wanted to keep <a> tags in browser playback but this doesn’t appear to be part of SMIL 3.0 smilText.

How this tool/concept be further developed? The playback browser is very basic but could be easily enhanced with some TLC. The smilText JavaScript API has some useful methods which could easily be exploited. There is also the question of how this tool could be integrated into other services like Twapper Keeper, opensubtitles.org (which is used by boxee and others) or FanHubz.

As always the source code is available here for further development.