5 <meta charset="utf-8" />
\r
7 <script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
\r
8 <script src="js/effects.core.js" type="text/javascript"></script>
\r
9 <script src="js/effects.blind.js" type="text/javascript"></script>
\r
10 <script src="js/effects.slide.js" type="text/javascript"></script>
\r
11 <script src="js/jcarousel/lib/jquery.jcarousel.pack.js" type="text/javascript"></script>
\r
12 <script src="js/contentPanel.js" type="text/javascript"></script>
\r
14 <script src="jquery.sync.js" type="text/javascript"></script>
\r
15 <script src="html5tv.js" type="text/javascript"></script>
\r
16 <link rel="stylesheet" type="text/css" href="hcalendar.css" />
\r
18 <link rel="stylesheet" type="text/css" href="js/jcarousel/lib/jquery.jcarousel.css" />
\r
19 <link rel="stylesheet" type="text/css" href="js/jcarousel/skins/ie7/skin.css" />
\r
21 <script src="media/_editing/video.js" type="text/javascript"></script>
\r
22 <link href="media/_editing/video.css" rel="stylesheet" type="text/css" />
\r
24 <title>{title} | HTML5TV</title>
\r
32 <div id="videoAndMoreInformation">
\r
34 <div id="videoContainer">
\r
35 <video id="vid" x-autoplay="autoplay" controls="controls">
\r
36 <source src="media/_editing/video.ogv" />
\r
38 <source src="RDTV_ep2_5min.mov" />
\r
40 <p id="videoElementWarning">Viewing these demos requires a browser capable of rendering the HTML 5 video element.<br />Please install a current version of <a href="http://www.mozilla.com">Firefox</a>, <a href="http://www.apple.com/safari">Safari</a> or <a href="http://www.google.com/chrome">Google Chrome</a>.</p>
\r
42 <div id="subtitle"></div>
\r
43 </div> <!-- videoContainer -->
\r
45 <div id="slide" style="display: inline">
\r
46 <img src="media/_editing/s/bars.png">
\r
48 <div id="additional_video" style="display: inline">
\r
52 </div> <!-- videoAndMoreInformation -->
\r
56 <h2 class="toggleContentPanel carouselContainer">Presentation</h2>
\r
58 <div id="carouselContainer">
\r
59 <ul id="carousel" class="jcarousel-skin-ie7">
\r
60 <!-- Content loaded dynamically -->
\r
62 </div> <!-- carouselContainer -->
\r
66 {html.subtitles_table}
\r
70 <div id="hcalendar">
\r
75 </div> <!-- content -->
\r
79 This web interface is based on BBC R&D TV
\r
80 <a href="http://www.bbc.co.uk/blogs/rad/2009/08/html5.html">HTML 5 and timed media</a> from the RAD blog</p>
\r
81 and metadata is done using <a href="http://microformats.org/wiki/hcalendar-cheatsheet">hCalendar</a> microformat.
\r