| Index: branches/new-upload/phase3/js2/mwEmbed/example_usage/seeking_example.html |
| — | — | @@ -0,0 +1,69 @@ |
| | 2 | +<!doctype html> |
| | 3 | +<html> |
| | 4 | +<head> |
| | 5 | + <title>Video element properties</title> |
| | 6 | + <script type="text/javascript" src="../mv_embed.js"></script> |
| | 7 | + <style> |
| | 8 | + #render_box { |
| | 9 | + position:absolute; |
| | 10 | + width:400px; |
| | 11 | + height:300px; |
| | 12 | + } |
| | 13 | + #frame_overlay { |
| | 14 | + position:absolute; |
| | 15 | + width:400px; |
| | 16 | + height:300px; |
| | 17 | + top: 28px; |
| | 18 | + left: 9px; |
| | 19 | + } |
| | 20 | + |
| | 21 | + </style> |
| | 22 | + <script> |
| | 23 | +var pos = 0; |
| | 24 | +var duration = 10; |
| | 25 | +var step = 0.04; |
| | 26 | +var render = false; |
| | 27 | + |
| | 28 | +function renderNext() { |
| | 29 | + $j('#pos').val(pos); |
| | 30 | + document.getElementById('render_box').setCurrentTime(pos, function(currentTime) { |
| | 31 | + return function() { |
| | 32 | + //call ogg.addFrame(); |
| | 33 | + pos += step; |
| | 34 | + if(render && pos <= duration) |
| | 35 | + renderNext(); |
| | 36 | + }; |
| | 37 | + }(pos)); |
| | 38 | +} |
| | 39 | + |
| | 40 | +function startRender() { |
| | 41 | + if(!render) { |
| | 42 | + duration = document.getElementById('render_box').getDuration(); |
| | 43 | + render = true; |
| | 44 | + pos = 0; |
| | 45 | + renderNext(); |
| | 46 | + } |
| | 47 | +} |
| | 48 | +function stopRender() { |
| | 49 | + render = false; |
| | 50 | +} |
| | 51 | +function seek() { |
| | 52 | + var seekTo = $j('#pos').val(); |
| | 53 | + document.getElementById('render_box').setCurrentTime(seekTo, function() { alert('seeked'); }); |
| | 54 | +} |
| | 55 | + </script> |
| | 56 | +</head> |
| | 57 | +<body> |
| | 58 | +<playlist id="render_box" src="sample_smil.xml" controls="false"></playlist> |
| | 59 | +<div id="frame_overlay"></div> |
| | 60 | + |
| | 61 | +<div id="info" style="position: absolute; top:360px"> |
| | 62 | + <button onclick="startRender()">Start</button> |
| | 63 | + <button onclick="stopRender()">Stop</button> |
| | 64 | + position: <input type="text" id="pos" value="0.0" /> |
| | 65 | + <button onclick="seek()">seek</button> |
| | 66 | + <span id="status"></span><br> |
| | 67 | +</div> |
| | 68 | +</body> |
| | 69 | +</html> |
| | 70 | + |
| Index: branches/new-upload/phase3/js2/mwEmbed/libSequencer/mvPlayList.js |
| — | — | @@ -769,6 +769,31 @@ |
| 770 | 770 | perc_offset = next_perc_offset; |
| 771 | 771 | } |
| 772 | 772 | }, |
| | 773 | + setCurrentTime: function(pos, callback){ |
| | 774 | + js_log('pl:setCurrentTime:' + pos + ' sts:' + this.seek_time_sec ); |
| | 775 | + var plObj = this; |
| | 776 | + var prevClip=null; |
| | 777 | + |
| | 778 | + //jump to the clip at pos |
| | 779 | + var currentOffset = 0; |
| | 780 | + var nextTime = 0; |
| | 781 | + for (var i in plObj.default_track.clips) { |
| | 782 | + var clip = plObj.default_track.clips[i]; |
| | 783 | + nextTime = clip.getDuration(); |
| | 784 | + if (currentOffset + nextTime > pos) { |
| | 785 | + //update the clip relative seek_time_sec |
| | 786 | + clipTime = pos - currentOffset; |
| | 787 | + if (plObj.cur_clip.id != clip.id) { |
| | 788 | + plObj.updateCurrentClip( clip ); |
| | 789 | + } |
| | 790 | + plObj.cur_clip.embed.setCurrentTime(clipTime, callback); |
| | 791 | + plObj.currentTime = pos; |
| | 792 | + plObj.doSmilActions(); |
| | 793 | + return ''; |
| | 794 | + } |
| | 795 | + currentOffset += nextTime; |
| | 796 | + } |
| | 797 | + }, |
| 773 | 798 | //gets playlist controls large control height for sporting |
| 774 | 799 | //next prev button and more status display |
| 775 | 800 | getControlsHTML:function(){ |
| — | — | @@ -2109,4 +2134,4 @@ |
| 2110 | 2135 | newString = newString.replace (myRegExp, '&' + entities[i] + ';'); |
| 2111 | 2136 | } |
| 2112 | 2137 | return newString; |
| 2113 | | -} |
| \ No newline at end of file |
| | 2138 | +} |
| Index: branches/new-upload/phase3/js2/mwEmbed/libEmbedVideo/mv_nativeEmbed.js |
| — | — | @@ -77,6 +77,27 @@ |
| 78 | 78 | |
| 79 | 79 | } |
| 80 | 80 | }, |
| | 81 | + setCurrentTime: function(pos, callback){ |
| | 82 | + var _this = this; |
| | 83 | + this.getVID(); |
| | 84 | + if(!this.vid) { |
| | 85 | + js_log('native:setCurrentTime: load video'); |
| | 86 | + this.load(); |
| | 87 | + var loaded = function(event) { |
| | 88 | + js_log('native:setCurrentTime (after load): ' + pos + ' : dur: ' + this.getDuration()); |
| | 89 | + _this.vid.currentTime = pos; |
| | 90 | + var once = function(event) { callback(); _this.vid.removeEventListener('seeked', once, false) }; |
| | 91 | + _this.vid.addEventListener('seeked', once, false); |
| | 92 | + _this.removeEventListener('loadedmetadata', once, false); |
| | 93 | + }; |
| | 94 | + _this.addEventListener('loadedmetadata', loaded, false); |
| | 95 | + } else { |
| | 96 | + js_log('native:setCurrentTime: ' + pos + ' : ' + this.supportsURLTimeEncoding() + ' dur: ' + this.getDuration() + ' sts:' + this.seek_time_sec ); |
| | 97 | + _this.vid.currentTime = pos; |
| | 98 | + var once = function(event) { callback(); _this.vid.removeEventListener('seeked', once, false) }; |
| | 99 | + _this.vid.addEventListener('seeked', once, false); |
| | 100 | + } |
| | 101 | + }, |
| 81 | 102 | monitor : function(){ |
| 82 | 103 | this.getVID(); //make shure we have .vid obj |
| 83 | 104 | if(!this.vid){ |