We will explore some examples of hand maintained video distribution techniques. That is, methods where we will be doing each necessary step manually. The overall goal is to host our video online on a web server, and publish the subtitles if they are separate.
We will assume you have burnt in your subtitles onto the video itself, and have a FTP account on a web server you can host files and web pages. We aim to publish our subtitled video on the web to allow anyone to download it, and to give them a HTML preview page in their web browser, and a link to download the video. To do this will take a few steps.
ffmpeg2theora is a conversion utility for transcoding from various video codecs to Ogg Theora.
The TheoraCookbook may also give you some ideas and hints on working with Theora video:
http://en.flossmanuals.net/TheoraCookbook/Introduction
The end result of the this step should be a URL you can use for referring to your publicly accessible video, as hosted on your web server. You can give this URL out to people so that they can download your video.
The second method is to use the latest HTML5 standard's <video> tag, which for Theora video is supported by Firefox 3.5, and Safari 4 with the Xiph QT components :
http://www.xiph.org/quicktime/
You can see the required HTML page to create on your web server in the Theora Cookbook here :
http://en.flossmanuals.net/TheoraCookbook/HTML5
A simple HTML document is shown below, which includes the <video> tag. You should use the URL you obtained at the end of Step 2, in place of the example URL http://my-server.org/video.ogm
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><title>My Video Test</title></head> <body> <video src="../http://my-server.org/video.ogm" width="480" height="320" autoplay="autoplay" controls="controls"> Sorry, your browser does not support the video tag. Try using Firefox 3.5+ </video></body> </html>
You can see a real example here :
http://andycat.engagemedia.org/videotranslation/example1.html
You should inspect the HTML source of that webpage to see the reference to a real Theora video, in this case a link to a EngageMedia.org hosted video.
We will assume you have not burnt in your subtitles onto the video itself, ie you have possibly multiple subtitle files (in SRT format) as well as your video and have a FTP account on a web server you can host files and web pages. We aim to publish our subtitled video on the web to allow anyone to download it, and to give them a HTML preview page in their web browser, and a link to download the video. To do this will take a few steps.
ffmpeg2theora is a conversion utility for transcoding from various video codecs to Ogg Theora.
The Theora Cookbook may also give you some ideas and hints on working with Theora video: http://en.flossmanuals.net/TheoraCookbook/Introduction
The end result of the this step should be URLs you can use for referring to your publicly accessible video and subtitle files, as hosted on your web server. You can give these URLs out to people so that they can download your video and/or subtitles.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><title>My Video Test</title></head> <body> <video src="../http://my-server.org/video.ogm" width="480" height="320" autoplay="autoplay" controls="controls"> Sorry, your browser does not support the video tag. Try using Firefox 3.5+ </video></body> </html>
We can now modify the above HTML page that includes the video tag, to include our SRT files dynamically, ⁞⁞ showing as the video plays.
Firstly, notice below that we will integrate JQuery - a GPL Javascript library available (http://jquery.com/) and an example Javascript implementation of using displaying subtitles in a webpage from a SRT file available at :
http://v2v.cc/~j/jquery.srt/jquery.srt.jsA simple HTML document is shown below, which includes the modification to include the Javascript files and to reference to your subtitle file. Only one subtitle file can be referenced at a time, unless you start developing further with Javascript. To customise this for your video and subtitle, you should use the URLs you obtained at the end of Step 2, in place of the example URL http://my-server.org/video.ogm and http://my-server.org/video.srt
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><title>My Video Test</title> <script type="text/javascript" src="../http://v2v.cc/~j/jquery.srt/jquery.js"></script> <script type="text/javascript" src="../http://v2v.cc/~j/jquery.srt/jquery.srt.js"></script> </head> <body> <video id="video" src="../http://my-server.org/video.ogm" width="480" height="320" autoplay="autoplay" controls="controls"> Sorry, your browser does not support the video tag. Try using Firefox 3.5+ </video> <div class="srt" data-video="video" data-srt="http://my-server.org/video.srt"> subtitle content </div> </body> </html>
You can see a real example here :
http://andycat.engagemedia.org/videotranslation/example2.html
You should inspect the HTML source of that webpage to see the reference to a real Theora video, and a real SRT file.
The original example of playing a SubRip (.srt) subtitle, along side a Ogg Theora video, using the HTML5 video tag can be seen at :
http://v2v.cc/~j/jquery.srt/
To research further into emerging open standards for video on the web in HTML5, see the mailing list of whatwg, specifically a thread around captions for web video:
http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2009-February/018600.html
http://wiki.whatwg.org/wiki/Video_accessibility
There has been error in communication with Booktype server. Not sure right now where is the problem.
You should refresh this page.