[xiph-commits] r3992 - itext
silvia at svn.annodex.net
silvia at svn.annodex.net
Mon Aug 31 21:01:00 PDT 2009
Author: silvia
Date: 2009-08-31 21:01:00 -0700 (Mon, 31 Aug 2009)
New Revision: 3992
Added:
itext/mediafrag.html
Modified:
itext/
Log:
Added media fragment addressing demo for W3C media fragment WG.
Property changes on: itext
___________________________________________________________________
Modified: bzr:revision-info
- timestamp: 2009-08-27 16:19:50.058000088 +1000
committer: Silvia Pfeiffer <silvia.pfeiffer at vquence.com>
properties:
branch-nick: silvia
+ timestamp: 2009-09-01 14:00:02.934999943 +1000
committer: Silvia Pfeiffer <silvia.pfeiffer at vquence.com>
properties:
branch-nick: silvia
Modified: bzr:file-ids
- images images-20090827061947-90od8aat0cqntkjz-1
images/itext.png itext.png-20090827061947-90od8aat0cqntkjz-2
images/spriteArrows.png spritearrows.png-20090827061947-90od8aat0cqntkjz-3
+ mediafrag.html mediafrag.html-20090901035944-4i1qi917cw5svgqk-1
Modified: bzr:revision-id:v4
- 1 silvia.pfeiffer at vquence.com-20090713110521-cz7evclxohf4rbs2
2 silvia.pfeiffer at vquence.com-20090714003359-apmpuor2ttarph5n
3 silvia.pfeiffer at vquence.com-20090714143931-q6j8ritt91jn5rhu
4 silvia.pfeiffer at vquence.com-20090718094222-58zgcmsg9gggbnt1
5 silvia.pfeiffer at vquence.com-20090718094708-wb83p9u6jr1xlhm6
6 silvia.pfeiffer at vquence.com-20090718095409-p6en5qufj62m8w3h
7 silvia.pfeiffer at vquence.com-20090718113424-9s8cmt1guxj6qoky
8 silvia.pfeiffer at vquence.com-20090718113445-n0q9c14w4i11pe36
9 silvia.pfeiffer at vquence.com-20090718123622-xdp52y76dvpem2ya
10 silvia.pfeiffer at vquence.com-20090718131644-69y0zml0ccbwc5er
11 silvia.pfeiffer at vquence.com-20090719002119-ekzto9pc7jqs3gw9
12 silvia.pfeiffer at vquence.com-20090719120832-srm8qemvr5jjy67w
13 silvia.pfeiffer at vquence.com-20090719130420-s7xjh35zrfj8117x
14 silvia.pfeiffer at vquence.com-20090720065454-m2g8tcjgpgw8aetr
15 silvia.pfeiffer at vquence.com-20090720131039-ivpstebztd7u3vwx
16 silvia.pfeiffer at vquence.com-20090720190949-r4ahzq2regl7opf1
17 silvia.pfeiffer at vquence.com-20090720210510-i54efp8a9sem4g6g
18 silvia.pfeiffer at vquence.com-20090721063829-4pvft92pnt7k966p
19 silvia.pfeiffer at vquence.com-20090721065410-0miir37pbb73k35r
20 silvia.pfeiffer at vquence.com-20090721065911-9ngk00aeujudpw8p
21 silvia.pfeiffer at vquence.com-20090721121059-uthu2kmvu74zjv06
22 silvia.pfeiffer at vquence.com-20090721125735-lwwo9ivbdhj0jdhp
23 silvia.pfeiffer at vquence.com-20090721130655-sdqdgbs0lexyrwh5
24 silvia.pfeiffer at vquence.com-20090721143346-065b9v0rr1tcmyg0
25 silvia.pfeiffer at vquence.com-20090722010421-9sx8ynfzcoxh1eai
26 silvia.pfeiffer at vquence.com-20090722014433-yrqaapi0kmfec1oh
27 silvia.pfeiffer at vquence.com-20090722062945-586zxe3smxv1gdcw
28 silvia.pfeiffer at vquence.com-20090727123838-lcxe2fb7n2111ipd
29 silvia.pfeiffer at vquence.com-20090728151700-ai24t8itvj8hxs0c
30 silvia.pfeiffer at vquence.com-20090728210031-2n53wzpuledyqg9w
31 silvia.pfeiffer at vquence.com-20090730034353-pcrnaae01i2q5430
32 silvia.pfeiffer at vquence.com-20090731122706-nrrle33ore1cjl87
33 silvia.pfeiffer at vquence.com-20090801092101-zyu1s0ntmio5bihb
34 silvia.pfeiffer at vquence.com-20090801092534-5pvl2ehkqi87p9le
35 silvia.pfeiffer at vquence.com-20090801233833-xa51k548ng1tqxso
36 silvia.pfeiffer at vquence.com-20090802130400-k998eftqulgcrp04
37 silvia.pfeiffer at vquence.com-20090802143005-c1sm52ru0kfed912
38 silvia.pfeiffer at vquence.com-20090827061919-ejpm51zs89ekbd56
39 silvia.pfeiffer at vquence.com-20090827061950-6fu26p80jdvdh50c
+ 1 silvia.pfeiffer at vquence.com-20090713110521-cz7evclxohf4rbs2
2 silvia.pfeiffer at vquence.com-20090714003359-apmpuor2ttarph5n
3 silvia.pfeiffer at vquence.com-20090714143931-q6j8ritt91jn5rhu
4 silvia.pfeiffer at vquence.com-20090718094222-58zgcmsg9gggbnt1
5 silvia.pfeiffer at vquence.com-20090718094708-wb83p9u6jr1xlhm6
6 silvia.pfeiffer at vquence.com-20090718095409-p6en5qufj62m8w3h
7 silvia.pfeiffer at vquence.com-20090718113424-9s8cmt1guxj6qoky
8 silvia.pfeiffer at vquence.com-20090718113445-n0q9c14w4i11pe36
9 silvia.pfeiffer at vquence.com-20090718123622-xdp52y76dvpem2ya
10 silvia.pfeiffer at vquence.com-20090718131644-69y0zml0ccbwc5er
11 silvia.pfeiffer at vquence.com-20090719002119-ekzto9pc7jqs3gw9
12 silvia.pfeiffer at vquence.com-20090719120832-srm8qemvr5jjy67w
13 silvia.pfeiffer at vquence.com-20090719130420-s7xjh35zrfj8117x
14 silvia.pfeiffer at vquence.com-20090720065454-m2g8tcjgpgw8aetr
15 silvia.pfeiffer at vquence.com-20090720131039-ivpstebztd7u3vwx
16 silvia.pfeiffer at vquence.com-20090720190949-r4ahzq2regl7opf1
17 silvia.pfeiffer at vquence.com-20090720210510-i54efp8a9sem4g6g
18 silvia.pfeiffer at vquence.com-20090721063829-4pvft92pnt7k966p
19 silvia.pfeiffer at vquence.com-20090721065410-0miir37pbb73k35r
20 silvia.pfeiffer at vquence.com-20090721065911-9ngk00aeujudpw8p
21 silvia.pfeiffer at vquence.com-20090721121059-uthu2kmvu74zjv06
22 silvia.pfeiffer at vquence.com-20090721125735-lwwo9ivbdhj0jdhp
23 silvia.pfeiffer at vquence.com-20090721130655-sdqdgbs0lexyrwh5
24 silvia.pfeiffer at vquence.com-20090721143346-065b9v0rr1tcmyg0
25 silvia.pfeiffer at vquence.com-20090722010421-9sx8ynfzcoxh1eai
26 silvia.pfeiffer at vquence.com-20090722014433-yrqaapi0kmfec1oh
27 silvia.pfeiffer at vquence.com-20090722062945-586zxe3smxv1gdcw
28 silvia.pfeiffer at vquence.com-20090727123838-lcxe2fb7n2111ipd
29 silvia.pfeiffer at vquence.com-20090728151700-ai24t8itvj8hxs0c
30 silvia.pfeiffer at vquence.com-20090728210031-2n53wzpuledyqg9w
31 silvia.pfeiffer at vquence.com-20090730034353-pcrnaae01i2q5430
32 silvia.pfeiffer at vquence.com-20090731122706-nrrle33ore1cjl87
33 silvia.pfeiffer at vquence.com-20090801092101-zyu1s0ntmio5bihb
34 silvia.pfeiffer at vquence.com-20090801092534-5pvl2ehkqi87p9le
35 silvia.pfeiffer at vquence.com-20090801233833-xa51k548ng1tqxso
36 silvia.pfeiffer at vquence.com-20090802130400-k998eftqulgcrp04
37 silvia.pfeiffer at vquence.com-20090802143005-c1sm52ru0kfed912
38 silvia.pfeiffer at vquence.com-20090827061919-ejpm51zs89ekbd56
39 silvia.pfeiffer at vquence.com-20090827061950-6fu26p80jdvdh50c
40 silvia.pfeiffer at vquence.com-20090901040002-3qs6tqiqcod3cda2
Added: itext/mediafrag.html
===================================================================
--- itext/mediafrag.html (rev 0)
+++ itext/mediafrag.html 2009-09-01 04:01:00 UTC (rev 3992)
@@ -0,0 +1,125 @@
+<!DOCTYPE HTML>
+<html lang="en">
+ <head>
+ <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
+
+ <title>Experiments with HTML5 video and media fragments</title>
+ </head>
+
+ <body>
+
+ <h1>Experiments with HTML5 video and media fragment URI references</h1>
+
+ <div id="main">
+
+ <video class="v" src="elephants_dream/elephant.ogv#t=20" poster="elephants_dream/elephant.png"
+ controls></video>
+
+ <form name="displayurl" action="">
+ <label>Link to this video:</label>
+ <input name="offseturl" type="text" readonly="" onclick="document.displayurl.offseturl.focus();document.displayurl.offseturl.select();" value=""/>
+ </form>
+
+ <form name="jumptime" action="" method="GET">
+ <label>Jump to time offset:</label>
+ <input name="time" type="int"/>
+ <input name="button" type="button" value="Jump" onclick="jumpToTimeoffset(this.form)"/>
+ </form>
+
+ <form name="videourl" action="" method="GET">
+ <label>Change video element url:</label>
+ <input name="url" type="text" value="elephants_dream/elephant.ogv#t=20"/>
+ <input name="button" type="button" value="Change" onclick="changeVideoUrl(this.form)"/>
+ </form>
+
+
+ </div>
+
+<p>Note: The demo works best in Firefox version >= 3.5, but also in the latest experimental releases of Safari (with XiphQT installed), Opera and Chrome. It will not work in IE.</p>
+
+<p>Note: The demo only takes time in float format for seconds - no other parsing or even error handling has been implemented yet.</p>
+
+<h1>Experiment description</h1>
+
+<p>This is a demo of temporal media fragment URI references for HTML5 video. Features:</p>
+<ul>
+ <li>contains HTML5 video tag</li>
+ <li>updates URI bar with current temporal media fragment offset while video is playing</li>
+ <li>displays current link with time offset</li>
+ <li>jumps to time offset in video, if given in page URI</li>
+ <li>jumps to time offset in video, if offset time submitted via entry box</li>
+ <li>jumps to time offset in video by setting video element url to different time offset</li>
+</ul>
+
+
+<p>The demo was created by Silvia Pfeiffer to explore video access approaches using media fragment URI references with the new HTML5 video tag.</p>
+
+<p>Thanks to the Orange Open Movie Team for the <a href="http://creativecommons.org/licenses/by/2.5/">Creative Commons licensed</a> "Elephants Dream" movie that was used as an example here, (c) copyright 2006, Blender Foundation / Netherlands Media Art Institute / www.elephantsdream.org.</p>
+
+<script type="text/javascript">
+ // get video element and url
+ var video = document.getElementsByTagName("video")[0];
+
+ // get page URL without fragment
+ var currenturl = location.href;
+ var pageurl = location.href.split("#")[0];
+ var pageoffset = 0;
+ var offsettime = 0;
+ if (location.href.split("#")[1] != null) {
+ pageoffset = location.href.split("#")[1];
+ if (pageoffset.substring(2) != null) {
+ offsettime = pageoffset.substring(2);
+ }
+ }
+
+ // set cut-paste-entry to currenturl as default
+ document.displayurl.offseturl.value = currenturl;
+
+ // once video is loaded, jump to time offset
+ video.addEventListener("loadedmetadata", function() {
+ // calculate video url & offset
+ // jump to offset given in video url
+ var videourl = video.src;
+ var videooffset = videourl.split("#")[1];
+ var videooffsettime = 0;
+ if (videooffset.substring(2) != null) {
+ videooffsettime = videooffset.substring(2);
+ video.currentTime = videooffsettime;
+ }
+
+ // first time only
+ // jump to offset given in page url
+ if (offsettime != 0) {
+ video.currentTime = offsettime;
+ offsettime = 0;
+ }
+ }, false);
+
+ // set callback for video to update page URL with time offset
+ video.addEventListener("timeupdate", function() {
+ if (video.ended) {
+ return;
+ }
+ videotime = video.currentTime;
+ location.href = pageurl + "#t=" + videotime;
+ document.displayurl.offseturl.value = location.href;
+ }, false);
+
+ // jump to time offset action
+ function jumpToTimeoffset(form) {
+ var time = form.time.value;
+ video.currentTime = time;
+ }
+
+ // change the video's url
+ function changeVideoUrl(form) {
+ var newurl = form.url.value;
+ alert(form.url.value);
+ video.src = newurl;
+ video.load(newurl);
+ }
+
+</script>
+
+ </body>
+</html>
More information about the commits
mailing list