| Index: trunk/extensions/MetavidWiki/skins/mv_embed/example_usage/sample_smil.smil.xml |
| — | — | @@ -28,7 +28,7 @@ |
| 29 | 29 | transOut="xFade" |
| 30 | 30 | type="video/ogg" |
| 31 | 31 | fill="transition" |
| 32 | | - dur="10s" |
| | 32 | + dur="12s" |
| 33 | 33 | poster="sample_fish.jpg"/> |
| 34 | 34 | |
| 35 | 35 | <video src="sample_eclipse.ogg?t=0:0:0/0:0:06" |
| Index: trunk/extensions/MetavidWiki/skins/mv_embed/embedLibs/mv_nativeEmbed.js |
| — | — | @@ -38,12 +38,12 @@ |
| 39 | 39 | //@@todo : loading progress |
| 40 | 40 | postEmbedJS:function(){ |
| 41 | 41 | this.getVID(); |
| 42 | | - if(this.vid){ |
| | 42 | + if(typeof this.vid != 'undefined'){ |
| 43 | 43 | this.vid.play(); |
| 44 | 44 | //this.vid.load(); //does not seem to work so well |
| 45 | 45 | setTimeout('$j(\'#'+this.id+'\').get(0).monitor()',100); |
| 46 | 46 | }else{ |
| 47 | | - js_log('could not grab vid obj:' + typeof this.vid); |
| | 47 | + js_log('could not grab vid obj trying again:' + typeof this.vid); |
| 48 | 48 | setTimeout('$j(\'#'+this.id+'\').get(0).postEmbedJS()',100); |
| 49 | 49 | } |
| 50 | 50 | }, |
| — | — | @@ -79,8 +79,6 @@ |
| 80 | 80 | this.setSliderValue(this.currentTime/this.duration ); |
| 81 | 81 | this.setStatus( seconds2ntp(this.currentTime) + '/'+ seconds2ntp(this.duration )); |
| 82 | 82 | } |
| 83 | | - }else{ |
| 84 | | - this.setStatus('seek to: ' + seconds2ntp(Math.round( (this.sliderVal*this.duration)) )); |
| 85 | 83 | } |
| 86 | 84 | } |
| 87 | 85 | //update load progress if nessisary f |
| Index: trunk/extensions/MetavidWiki/skins/mv_embed/embedLibs/mv_oggplayEmbed.js |
| — | — | @@ -35,8 +35,7 @@ |
| 36 | 36 | }, |
| 37 | 37 | postEmbedJS:function(){ |
| 38 | 38 | this.getOggElement(); |
| 39 | | - if(this.controls){ |
| 40 | | - this.activateSlider(); |
| | 39 | + if(this.controls){ |
| 41 | 40 | setTimeout('document.getElementById(\''+this.id+'\').monitor()',250); |
| 42 | 41 | } |
| 43 | 42 | //check if in playlist mode: |
| Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_embed.js |
| — | — | @@ -472,10 +472,10 @@ |
| 473 | 473 | expiryDate.setTime( expiryDate.getTime() + expiry ); |
| 474 | 474 | } |
| 475 | 475 | document.cookie = name + "=" + escape(value) + |
| 476 | | - (expiryDate ? ("; expires=" + expiryDate.toGMTString()) : "") + |
| 477 | | - (path ? ("; path=" + path) : "") + |
| 478 | | - (domain ? ("; domain=" + domain) : "") + |
| 479 | | - (secure ? "; secure" : ""); |
| | 476 | + (expiryDate ? ("; expires=" + expiryDate.toGMTString()) : "") + |
| | 477 | + (path ? ("; path=" + path) : "") + |
| | 478 | + (domain ? ("; domain=" + domain) : "") + |
| | 479 | + (secure ? "; secure" : ""); |
| 480 | 480 | } |
| 481 | 481 | |
| 482 | 482 | /* |
| — | — | @@ -532,8 +532,8 @@ |
| 533 | 533 | _this.start_time_sec = (_this.instanceOf == 'mvPlayList')?0: |
| 534 | 534 | _this.start_time_sec = ntp2seconds(_this.getTimeReq().split('/')[0]); |
| 535 | 535 | |
| 536 | | - js_log('looking for: #mv_seeker_slider_'+_this.id + "\n " + |
| 537 | | - 'start sec: '+_this.start_time_sec + ' base offset: '+_this.base_seeker_slider_offset); |
| | 536 | + //js_log('looking for: #mv_seeker_slider_'+_this.id + "\n " + |
| | 537 | + // 'start sec: '+_this.start_time_sec + ' base offset: '+_this.base_seeker_slider_offset); |
| 538 | 538 | |
| 539 | 539 | //buid dragable hook here: |
| 540 | 540 | $j('#mv_seeker_slider_'+_this.id).draggable({ |
| — | — | @@ -566,7 +566,7 @@ |
| 567 | 567 | _this.seek_time_sec=ntp2seconds(_this.jump_time); |
| 568 | 568 | _this.stop(); |
| 569 | 569 | //do play in 300ms (give things time to "cool down") |
| 570 | | - setTimeout('$j(\'#'+_this.id+'\').get(0).play()',300); |
| | 570 | + setTimeout('$j(\'#'+_this.id+'\').get(0).play()',300); |
| 571 | 571 | } |
| 572 | 572 | }); |
| 573 | 573 | }, |
| — | — | @@ -624,7 +624,7 @@ |
| 625 | 625 | 'volume_control':{ |
| 626 | 626 | 'w':22, |
| 627 | 627 | 'o':function(){ |
| 628 | | - return '<div id="volume_icon_'+ctrlBuilder.id+'" class="volume_icon"><a href="javascript:$j(\'#'+ctrlBuilder.id+'\').get(0).toggleMute();"></a></div>' |
| | 628 | + return '<div id="volume_icon_'+ctrlBuilder.id+'" class="volume_icon volume_on"><a href="javascript:$j(\'#'+ctrlBuilder.id+'\').get(0).toggleMute();"></a></div>' |
| 629 | 629 | } |
| 630 | 630 | }, |
| 631 | 631 | 'time_display':{ |
| — | — | @@ -2202,35 +2202,41 @@ |
| 2203 | 2203 | var clip = this.anno_data_cache[clip_id]; |
| 2204 | 2204 | //js_log('on clip:'+ clip_id); |
| 2205 | 2205 | //set prev_link (if cur_link is still empty) |
| 2206 | | - if(s_sec < clip.start_time_sec && link.current=='') |
| | 2206 | + if( s_sec < clip.start_time_sec && e_sec < clip.start_time_sec && link.prev=='') |
| 2207 | 2207 | link.prev = clip_id; |
| 2208 | 2208 | |
| 2209 | | - //clip is encapsulated by the current clip add current link: |
| 2210 | | - if(s_sec > clip.start_time_sec && e_sec < clip.end_time_sec ) |
| | 2209 | + //clip is not done e_sec < clip |
| | 2210 | + if( s_sec > clip.start_time_sec && e_sec < clip.end_time_sec ) |
| 2211 | 2211 | link.current = clip_id; |
| 2212 | 2212 | |
| 2213 | | - if(e_sec < clip.start_time_sec && link.next=='') |
| | 2213 | + if( e_sec > clip.start_time_sec && link.next=='') |
| 2214 | 2214 | link.next = clip_id; |
| 2215 | 2215 | } |
| 2216 | 2216 | var html=''; |
| 2217 | 2217 | for(var link_type in link){ |
| 2218 | 2218 | var link_id = link[link_type]; |
| 2219 | 2219 | if(link_id!=''){ |
| 2220 | | - var clip = this.anno_data_cache[link_id]; |
| 2221 | | - |
| | 2220 | + var clip = this.anno_data_cache[link_id]; |
| 2222 | 2221 | var title_msg=''; |
| 2223 | 2222 | for(var j in clip['meta']){ |
| 2224 | 2223 | title_msg+=j.replace(/_/g,' ') +': ' +clip['meta'][j].replace(/_/g,' ') +" \n"; |
| 2225 | 2224 | } |
| 2226 | | - var time_req = clip.time_req; |
| | 2225 | + var time_req = clip.time_req; |
| 2227 | 2226 | if(link_type=='current') //if current start from end of current clip play to end of current meta: |
| 2228 | | - time_req = curTime[1]+ '/' + seconds2ntp(clip.end_time_sec); |
| | 2227 | + time_req = curTime[1]+ '/' + seconds2ntp( clip.end_time_sec ); |
| 2229 | 2228 | |
| 2230 | | - html+='<p><a href="#" title="' +title_msg + '" '+ |
| 2231 | | - 'onClick="$j(\'#'+this.id+'\').get(0).playByTimeReq(\''+ |
| 2232 | | - time_req + '\'); return false; ">' + |
| | 2229 | + //do special linkbacks for metavid content: |
| | 2230 | + var regTimeCheck = new RegExp(/[0-9]+:[0-9]+:[0-9]+\/[0-9]+:[0-9]+:[0-9]+/); |
| | 2231 | + html+='<p><a '; |
| | 2232 | + if( regTimeCheck.test( this.media_element.linkback ) ){ |
| | 2233 | + html+=' href="'+ this.media_element.linkback.replace(regTimeCheck,time_req) +'" '; |
| | 2234 | + }else{ |
| | 2235 | + html+=' href="#" onClick="$j(\'#'+this.id+'\').get(0).playByTimeReq(\''+ |
| | 2236 | + time_req + '\'); return false; "'; |
| | 2237 | + } |
| | 2238 | + html+=' title="' + title_msg + '">' + |
| 2233 | 2239 | getMsg(link_type+'_clip_msg') + |
| 2234 | | - '</a></p>'; |
| | 2240 | + '</a><br><span style="font-size:small">'+ title_msg +'<span></p>'; |
| 2235 | 2241 | } |
| 2236 | 2242 | } |
| 2237 | 2243 | //js_log("should set html:"+ html); |
| — | — | @@ -2244,19 +2250,14 @@ |
| 2245 | 2251 | }, |
| 2246 | 2252 | doThumbnailHTML:function() |
| 2247 | 2253 | { |
| 2248 | | - js_log('f:doThumbnailHTML'); |
| 2249 | | - js_log('thum disp:'+this.thumbnail_disp); |
| | 2254 | + js_log('f:doThumbnailHTML'+ this.thumbnail_disp); |
| 2250 | 2255 | this.closeDisplayedHTML(); |
| 2251 | 2256 | this.thumbnail_disp = true; |
| 2252 | | - var embed_code = this.getThumbnailHTML(); |
| 2253 | | - |
| 2254 | | - //js_log("embed code: " + embed_code); |
| 2255 | | - if($j('#mv_embedded_player_'+this.id).length==0) |
| 2256 | | - js_log("can't find mv_embedded_player_"+this.id); |
| 2257 | | - |
| 2258 | | - $j('#mv_embedded_player_'+this.id).html(embed_code); |
| | 2257 | + |
| | 2258 | + $j('#mv_embedded_player_'+this.id).html( this.getThumbnailHTML() ); |
| 2259 | 2259 | this.paused = true; |
| 2260 | | - $j("#mv_play_pause_button_"+this.id).attr('class', 'play_button'); |
| | 2260 | + if(!this.pc) //if not in playlist mode update the play_pause button: |
| | 2261 | + $j("#mv_play_pause_button_"+this.id).attr('class', 'play_button'); |
| 2261 | 2262 | }, |
| 2262 | 2263 | refreshControlsHTML:function(){ |
| 2263 | 2264 | js_log('refreshing controls HTML'); |
| — | — | @@ -2407,16 +2408,17 @@ |
| 2408 | 2409 | //if(this.class)class_atr = ' class="'+this.class+'"'; |
| 2409 | 2410 | //if(this.style)style_atr = ' style="'+this.style+'"'; |
| 2410 | 2411 | // else style_atr = 'overflow:hidden;height:'+this.height+'px;width:'+this.width+'px;'; |
| 2411 | | - var thumbnail = this.media_element.getThumbnailURL(); |
| | 2412 | + var thumbnail_src = this.media_element.getThumbnailURL(); |
| 2412 | 2413 | |
| 2413 | 2414 | //put it all in the div container dc_id |
| 2414 | 2415 | thumb_html+= '<div id="dc_'+this.id+'" style="position:relative;'+ |
| 2415 | 2416 | ' overflow:hidden; top:0px; left:0px; width:'+this.playerPixelWidth()+'px; height:'+this.playerPixelHeight()+'px; z-index:0;">'+ |
| 2416 | 2417 | '<img width="'+this.playerPixelWidth()+'" height="'+this.playerPixelHeight()+'" style="position:relative;width:'+this.playerPixelWidth()+';height:'+this.playerPixelHeight()+'"' + |
| 2417 | | - ' id="img_thumb_'+this.id+'" src="' + thumbnail + '">'; |
| | 2418 | + ' id="img_thumb_'+this.id+'" src="' + thumbnail_src + '">'; |
| 2418 | 2419 | |
| 2419 | 2420 | if(this.play_button==true) |
| 2420 | 2421 | thumb_html+=this.getPlayButton(); |
| | 2422 | + |
| 2421 | 2423 | thumb_html+='</div>'; |
| 2422 | 2424 | return thumb_html; |
| 2423 | 2425 | }, |
| — | — | @@ -2690,7 +2692,8 @@ |
| 2691 | 2693 | * base embed controls |
| 2692 | 2694 | * the play button calls |
| 2693 | 2695 | */ |
| 2694 | | - play : function(){ |
| | 2696 | + play: function(){ |
| | 2697 | + var this_id = (this.pc!=null)?this.pc.pp.id:this.id; |
| 2695 | 2698 | js_log("mv_embed play:"+this.id); |
| 2696 | 2699 | js_log('thum disp:'+this.thumbnail_disp); |
| 2697 | 2700 | //check if thumbnail is being displayed and embed html |
| — | — | @@ -2702,20 +2705,25 @@ |
| 2703 | 2706 | $j('#'+this.id).html(this.getPluginMissingHTML()); |
| 2704 | 2707 | }else{ |
| 2705 | 2708 | this.doEmbedHTML(); |
| 2706 | | - this.onClipDone_disp=false; |
| | 2709 | + this.onClipDone_disp=false; |
| | 2710 | + this.paused=false; |
| 2707 | 2711 | } |
| 2708 | 2712 | }else{ |
| 2709 | 2713 | //the plugin is already being displayed |
| 2710 | | - js_log("we are already playing" ); |
| | 2714 | + js_log("we are already playing..." ); |
| 2711 | 2715 | } |
| | 2716 | + //update "paused state" |
| | 2717 | + $j("#mv_play_pause_button_"+this_id).attr('class', 'pause_button'); |
| 2712 | 2718 | }, |
| 2713 | | - toggleMute:function(){ |
| | 2719 | + toggleMute:function(){ |
| | 2720 | + var this_id = (this.pc!=null)?this.pc.pp.id:this.id; |
| | 2721 | + js_log('f:toggleMute'); |
| 2714 | 2722 | if(this.muted){ |
| 2715 | 2723 | this.muted=false; |
| 2716 | | - $j('#volume_icon_'+this.id).removeClass('volume_off').addClass('volume_on'); |
| | 2724 | + $j('#volume_icon_'+this_id).removeClass('volume_off').addClass('volume_on'); |
| 2717 | 2725 | }else{ |
| 2718 | 2726 | this.muted=true; |
| 2719 | | - $j('#volume_icon_'+this.id).removeClass('volume_on').addClass('volume_off'); |
| | 2727 | + $j('#volume_icon_'+this_id).removeClass('volume_on').addClass('volume_off'); |
| 2720 | 2728 | } |
| 2721 | 2729 | }, |
| 2722 | 2730 | play_or_pause : function(){ |
| — | — | @@ -2724,17 +2732,18 @@ |
| 2725 | 2733 | |
| 2726 | 2734 | //check state and set play or pause |
| 2727 | 2735 | if(this.paused){ |
| 2728 | | - js_log('do play'); |
| 2729 | | - js_log('set : #mv_play_pause_button_'+this_id + ' to pause_button'); |
| 2730 | | - $j("#mv_play_pause_button_"+this_id).attr('class', 'pause_button'); |
| | 2736 | + //js_log('do play'); |
| 2731 | 2737 | //(paused) do play |
| 2732 | 2738 | this.play(); |
| 2733 | 2739 | this.paused=false; |
| | 2740 | + //update "paused state" onPlay |
| | 2741 | + $j("#mv_play_pause_button_"+this_id).attr('class', 'pause_button'); |
| 2734 | 2742 | }else{ |
| 2735 | 2743 | js_log('do pause'); |
| 2736 | 2744 | //(playing) do pause |
| 2737 | 2745 | this.pause(); |
| 2738 | | - this.paused=true; |
| | 2746 | + this.paused=true; |
| | 2747 | + //update "paused state" |
| 2739 | 2748 | $j("#mv_play_pause_button_"+this_id).attr('class', 'play_button'); |
| 2740 | 2749 | } |
| 2741 | 2750 | }, |
| — | — | @@ -2834,41 +2843,17 @@ |
| 2835 | 2844 | return document.embeds[this.pid]; |
| 2836 | 2845 | } |
| 2837 | 2846 | return null; |
| 2838 | | - }, |
| 2839 | | - /*activateSlider : function(slider_id){ |
| 2840 | | - var id = (this.pc)?this.pc.pp.id:this.id; |
| 2841 | | - var thisVid = this; |
| 2842 | | - this.sliderVal=0; |
| 2843 | | - //js_log('parent id: '+ parent_id + ' id: ' + this.id); |
| 2844 | | - $j('#slider_'+id).slider({ |
| 2845 | | - handle:'#playhead_'+id, |
| 2846 | | - slide:function(e, ui) { |
| 2847 | | - thisVid.userSlide=true; |
| 2848 | | - thisVid.sliderVal=( ui.pixel/ ( $j('#slider_'+id).width()- |
| 2849 | | - $j('#playhead_'+id).width() )); |
| 2850 | | - //js_log('user slide: ' +thisVid.sliderVal ); |
| 2851 | | - }, |
| 2852 | | - change: function(slider){ |
| 2853 | | - //js_log("change: " + thisVid.sliderVal); |
| 2854 | | - thisVid.doSeek(thisVid.sliderVal); |
| 2855 | | - thisVid.userSlide=false; |
| 2856 | | - } |
| 2857 | | - }); |
| 2858 | | - //if(!slider_id)slider_id=this.id; |
| 2859 | | - //get a pointer to this id (as this in onSlide context is not "this") |
| 2860 | | - /*var parent_id = this.id; |
| 2861 | | - },*/ |
| | 2847 | + }, |
| 2862 | 2848 | setSliderValue: function(perc){ |
| 2863 | | - var id = (this.pc)?this.pc.pp.id:this.id; |
| | 2849 | + //js_log('setSliderValue:'+perc+' ct:'+ this.currentTime); |
| | 2850 | + var this_id = (this.pc)?this.pc.pp.id:this.id; |
| 2864 | 2851 | //alinment offset: |
| 2865 | 2852 | if(!this.mv_seeker_width) |
| 2866 | | - this.mv_seeker_width = $j('#mv_seeker_slider_'+id).width(); |
| | 2853 | + this.mv_seeker_width = $j('#mv_seeker_slider_'+this_id).width(); |
| 2867 | 2854 | |
| 2868 | | - //js_log('currentTime:'+ this.currentTime); |
| 2869 | | - |
| 2870 | | - var val = Math.round( perc * $j('#mv_seeker_'+id).width() - (this.mv_seeker_width*perc)); |
| 2871 | | - $j('#mv_seeker_slider_'+id).css('left', (val)+'px' ); |
| 2872 | | - //js_log('perc in: ' + perc + ' * ' + $j('#mv_seeker_'+id).width() + ' = set to: '+ val + ' - '+ Math.round(this.mv_seeker_width*perc) ); |
| | 2855 | + var val = Math.round( perc * $j('#mv_seeker_'+this_id).width() - (this.mv_seeker_width*perc)); |
| | 2856 | + $j('#mv_seeker_slider_'+this_id).css('left', (val)+'px' ); |
| | 2857 | + //js_log('set#mv_seeker_slider_'+this_id + ' perc in: ' + perc + ' * ' + $j('#mv_seeker_'+this_id).width() + ' = set to: '+ val + ' - '+ Math.round(this.mv_seeker_width*perc) ); |
| 2873 | 2858 | //js_log('op:' + offset_perc + ' *('+perc+' * ' + $j('#slider_'+id).width() + ')'); |
| 2874 | 2859 | }, |
| 2875 | 2860 | setStatus:function(value){ |
| Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_playlist.js |
| — | — | @@ -213,16 +213,13 @@ |
| 214 | 214 | doWhenClipLoadDone:function(){ |
| 215 | 215 | this.loading=false; |
| 216 | 216 | this.getHTML(); |
| 217 | | - }, |
| 218 | | - /* |
| 219 | | - * @@todo getDuration should replace getDuration |
| 220 | | - */ |
| | 217 | + }, |
| 221 | 218 | getDuration:function(regen){ |
| 222 | 219 | //js_log("GET PL DURRATION for : "+ this.tracks[this.default_track_id].clips.length + 'clips'); |
| 223 | 220 | if(!regen && this.pl_duration) |
| 224 | 221 | return this.pl_duration; |
| 225 | 222 | |
| 226 | | - durSum=0; |
| | 223 | + var durSum=0; |
| 227 | 224 | $j.each(this.default_track.clips, function(i,clip){ |
| 228 | 225 | if(clip.embed){ |
| 229 | 226 | js_log('plDUR:add : '+ clip.getDuration()); |
| — | — | @@ -236,11 +233,6 @@ |
| 237 | 234 | //js_log("return dur: " + this.pl_duration); |
| 238 | 235 | return this.pl_duration; |
| 239 | 236 | }, |
| 240 | | - getDurationNTP:function(){ |
| 241 | | - //get duration in ms and return in NTP |
| 242 | | - return seconds2ntp(this.getDuration()); |
| 243 | | - //return 'wtf'; |
| 244 | | - }, |
| 245 | 237 | getDataSource:function(){ |
| 246 | 238 | js_log("f:getDataSource "+ this.src); |
| 247 | 239 | //determine the type / first is it m3u or xml? |
| — | — | @@ -408,11 +400,12 @@ |
| 409 | 401 | updateTimeThumb:function(perc){ |
| 410 | 402 | //get float seconds: |
| 411 | 403 | var float_sec = (this.getDuration()*perc) |
| 412 | | - js_log('float sec:' + float_sec); |
| | 404 | + //js_log('float sec:' + float_sec); |
| 413 | 405 | |
| 414 | 406 | //update display & cur_clip: |
| 415 | 407 | var pl_sum_time =0; |
| 416 | 408 | var clip_float_sec=0; |
| | 409 | + //js_log('seeking clip: '); |
| 417 | 410 | for(var i in this.default_track.clips){ |
| 418 | 411 | var clip = this.default_track.clips[i]; |
| 419 | 412 | if( (clip.getDuration() + pl_sum_time) >= float_sec ){ |
| — | — | @@ -425,12 +418,14 @@ |
| 426 | 419 | } |
| 427 | 420 | pl_sum_time+=clip.getDuration(); |
| 428 | 421 | } |
| 429 | | - //update start offset (@@todo should probably happen somewhere else like in getDuration() ) |
| | 422 | + //js_log('found clip: '+ this.cur_clip.id + 'transIn:'); |
| | 423 | + |
| | 424 | + //updte start offset (@@todo should probably happen somewhere else like in getDuration() ) |
| 430 | 425 | if(!this.cur_clip.embed.start_offset) |
| 431 | 426 | this.cur_clip.embed.start_offset=this.cur_clip.embed.media_element.selected_source.start_offset; |
| 432 | 427 | |
| 433 | 428 | //render effects ontop: |
| 434 | | - //issue thumbnail update request: (if plugin supports it will render out frame) |
| | 429 | + //issue thumbnail update request: (if plugin supports it will render out frame (if media ) |
| 435 | 430 | this.cur_clip.embed.updateTimeThumb(perc); |
| 436 | 431 | |
| 437 | 432 | this.cur_clip.embed.currentTime = (float_sec -pl_sum_time)+this.cur_clip.embed.start_offset ; |
| — | — | @@ -440,18 +435,22 @@ |
| 441 | 436 | |
| 442 | 437 | }, |
| 443 | 438 | updateBaseStatus:function(){ |
| 444 | | - js_log('update title'); |
| | 439 | + js_log('f:updateBaseStatus'); |
| 445 | 440 | $j('#ptitle_'+this.id).html(''+ |
| 446 | 441 | '<b>' + this.title + '</b> '+ |
| 447 | 442 | this.getClipCount()+' clips, <i>'+ |
| 448 | | - this.getDurationNTP() + '</i>' ); |
| | 443 | + seconds2ntp( this.getDuration() ) + '</i>' ); |
| 449 | 444 | //update status: |
| 450 | | - this.cur_clip.embed.setStatus('0:0:00/'+this.getDurationNTP()); |
| | 445 | + this.setStatus('0:0:00/'+seconds2ntp( this.getDuration() )); |
| 451 | 446 | }, |
| 452 | 447 | /*setStatus overide (could call the jquery directly) */ |
| 453 | 448 | setStatus:function(value){ |
| 454 | 449 | $j('#mv_time_'+this.id).html(value); |
| 455 | 450 | }, |
| | 451 | + setSliderValue:function(value){ |
| | 452 | + //js_log('calling original embed slider with val: '+value); |
| | 453 | + this.cur_clip.embed.pe_setSliderValue(value); |
| | 454 | + }, |
| 456 | 455 | /*gets adds hidden desc to the #dc container*/ |
| 457 | 456 | getAllClipDesc : function(){ |
| 458 | 457 | //js_log("build all clip details pages"); |
| — | — | @@ -533,21 +532,19 @@ |
| 534 | 533 | //where the plugin supports pre_loading future clips and manage that in javascript |
| 535 | 534 | //stop current clip |
| 536 | 535 | this.cur_clip.embed.stop(); |
| 537 | | - //do swap: |
| 538 | | - |
| 539 | | - //if it has a transOut let it tha transition hide when done |
| 540 | | - $j('#clipDesc_'+this.cur_clip.id).hide(); |
| 541 | | - this.cur_clip=next_clip; |
| 542 | | - //if not already vissable show |
| 543 | | - if(!$j('#clipDesc_'+this.cur_clip.id).is(':visible')) |
| 544 | | - $j('#clipDesc_'+this.cur_clip.id).show(); |
| 545 | | - |
| | 536 | + this.updateCurrentClip(next_clip); |
| 546 | 537 | this.cur_clip.embed.play(); |
| 547 | 538 | }else{ |
| 548 | 539 | js_log('do next'); |
| 549 | 540 | this.switchPlayingClip(next_clip); |
| 550 | 541 | } |
| 551 | 542 | }, |
| | 543 | + updateCurrentClip:function(new_clip){ |
| | 544 | + //do swap: |
| | 545 | + $j('#clipDesc_'+this.cur_clip.id).hide(); |
| | 546 | + this.cur_clip=new_clip; |
| | 547 | + $j('#clipDesc_'+this.cur_clip.id).show(); |
| | 548 | + }, |
| 552 | 549 | prev: function(){ |
| 553 | 550 | //advance the playhead to the previous clip |
| 554 | 551 | var prev_clip = this.getClip(-1); |
| — | — | @@ -559,10 +556,7 @@ |
| 560 | 557 | //pause current clip |
| 561 | 558 | this.cur_clip.embed.pause; |
| 562 | 559 | //do swap: |
| 563 | | - $j('#clipDesc_'+this.cur_clip.id).hide(); |
| 564 | | - this.cur_clip=prev_clip; |
| 565 | | - $j('#clipDesc_'+this.cur_clip.id).show(); |
| 566 | | - |
| | 560 | + this.updateCurrentClip(prev_clip); |
| 567 | 561 | this.cur_clip.embed.play(); |
| 568 | 562 | }else{ |
| 569 | 563 | js_log('do prev hard embed swap'); |
| — | — | @@ -613,9 +607,13 @@ |
| 614 | 608 | this.cur_clip.embed.play(); |
| 615 | 609 | } |
| 616 | 610 | }, |
| | 611 | + toggleMute:function(){ |
| | 612 | + this.cur_clip.embed.toggleMute(); |
| | 613 | + }, |
| 617 | 614 | //wrappers for call to pl object to current embed obj |
| 618 | | - play_or_pause:function(){ |
| 619 | | - this.cur_clip.embed.play_or_pause(); |
| | 615 | + play_or_pause:function(){ |
| | 616 | + js_log('pl:play_or_pause'); |
| | 617 | + this.cur_clip.embed.play_or_pause(); |
| 620 | 618 | }, |
| 621 | 619 | fullscreen:function(){ |
| 622 | 620 | this.cur_clip.embed.fullscreen(); |
| — | — | @@ -1236,23 +1234,10 @@ |
| 1237 | 1235 | return this.pe_getPlayButton(this.pc.pp.id); |
| 1238 | 1236 | }, |
| 1239 | 1237 | setStatus:function(value){ |
| 1240 | | - var plObj = this.pc.pp; |
| 1241 | | - //only update status if playlist driver otherwise ignore and let master playlist update |
| 1242 | | - if(this.supports['playlist_driver']){ |
| 1243 | | - //js_log('set status:'+ value); |
| 1244 | | - var pl_value='On clip ' + (plObj.cur_clip.order+1) + ' of ' + plObj.getClipCount() + '<br>'; |
| 1245 | | - this.pe_setStatus(value); |
| 1246 | | - }else{ |
| 1247 | | - //js_log("set time via base offset:"+base_dur + ' curTime:'+plObj.cur_clip.embed.currentTime) |
| 1248 | | - this.pe_setStatus(seconds2ntp(plObj.cur_clip.dur_offset + plObj.cur_clip.embed.currentTime) + '/'+ plObj.getDurationNTP()); |
| 1249 | | - } |
| | 1238 | + //status updates hanndled by playlist obj |
| 1250 | 1239 | }, |
| 1251 | 1240 | setSliderValue:function(value){ |
| 1252 | | - if(!this.userSlide){ |
| 1253 | | - var sliderVal = this.pc.pp.getPlayHeadPos(value); |
| 1254 | | - //js_log('set slider value:c:'+this.id+' v:'+ value + ' trueVa:'+ sliderVal); |
| 1255 | | - this.pe_setSliderValue(sliderVal); |
| 1256 | | - } |
| | 1241 | + //setSlider value hanndled by playlist obj |
| 1257 | 1242 | }, |
| 1258 | 1243 | /*activateSlider:function(){ |
| 1259 | 1244 | //map the slider to the parent playlist slider id: |
| — | — | @@ -1509,6 +1494,17 @@ |
| 1510 | 1495 | var ct = new Date(); |
| 1511 | 1496 | //js_log('mvPlayList:monitor trueTime: '+ ( (ct.getTime() - this.clockStartTime )/1000)); |
| 1512 | 1497 | |
| | 1498 | + //update the playlist current time: |
| | 1499 | + this.currentTime = this.cur_clip.dur_offset + this.cur_clip.embed.currentTime; |
| | 1500 | + |
| | 1501 | + //update status |
| | 1502 | + this.setStatus(seconds2ntp(this.currentTime) + '/' + seconds2ntp(this.getDuration()) ); |
| | 1503 | + |
| | 1504 | + //update slider: |
| | 1505 | + if(!this.userSlide){ |
| | 1506 | + this.setSliderValue(this.currentTime / this.getDuration()); |
| | 1507 | + } |
| | 1508 | + |
| 1513 | 1509 | //status updates are hanndled by children clips ... playlist just mannages smil actions |
| 1514 | 1510 | this.doSmilActions(); |
| 1515 | 1511 | |
| — | — | @@ -1521,50 +1517,50 @@ |
| 1522 | 1518 | //handles the rendering of overlays loaind of future clips (if nessesary) |
| 1523 | 1519 | //@@todo could be lazy loaded if nessesary |
| 1524 | 1520 | mvPlayList.prototype.doSmilActions = function(){ |
| 1525 | | - //js_log('f:doSmilActions: ' + this.cur_clip.embed.currentTime); |
| | 1521 | + //js_log('f:doSmilActions: ' + this.cur_clip.id + ' tid: ' + this.cur_clip.transIn.pClip.id ); |
| 1526 | 1522 | var offSetTime = 0; //offset time should let us start a transition later on if we have to. |
| 1527 | | - _pClip = this.cur_clip; |
| | 1523 | + var _clip = this.cur_clip; //setup a local pointer to cur_clip |
| 1528 | 1524 | |
| 1529 | | - |
| 1530 | | - //@@todo move some of this out of this loop (ie init should assure .dur |
| 1531 | | - if(!_pClip.dur) |
| 1532 | | - _pClip.dur = _pClip.embed.getDuration(); |
| 1533 | 1525 | |
| 1534 | | - //check for duration actions / clip freze mode |
| 1535 | | - if(_pClip.dur <= _pClip.embed.currentTime && _pClip.order != _pClip.pp.getClipCount()-1 ){ |
| 1536 | | - //force next clip |
| 1537 | | - js_log('order:' +_pClip.order + ' != count:' + (_pClip.pp.getClipCount()-1) + |
| 1538 | | - ' smil dur: '+_pClip.dur + ' <= curTime: ' + _pClip.embed.currentTime + ' go to next clip..'); |
| 1539 | | - _pClip.pp.next(); |
| 1540 | | - } |
| 1541 | | - |
| 1542 | | - if(_pClip.dur >= _pClip.embed.currentTime ){ |
| 1543 | | - //@@todo freeze-frame on onClipStop |
| 1544 | | - } |
| 1545 | | - |
| 1546 | | - if(_pClip.begin){ |
| 1547 | | - //@@todo do freeze until begin time |
| 1548 | | - } |
| | 1526 | + //do any smil time actions that may change the current clip |
| | 1527 | + if(this.userSlide){ |
| | 1528 | + //current clip set via updateTimeThumb function |
| | 1529 | + }else{ |
| | 1530 | + //assume playing and go to next: |
| | 1531 | + if( _clip.dur <= _clip.embed.currentTime |
| | 1532 | + && _clip.order != _clip.pp.getClipCount()-1 ){ |
| | 1533 | + //force next clip |
| | 1534 | + js_log('order:' +_clip.order + ' != count:' + (_clip.pp.getClipCount()-1) + |
| | 1535 | + ' smil dur: '+_clip.dur + ' <= curTime: ' + _clip.embed.currentTime + ' go to next clip..'); |
| | 1536 | + //do a _play next: |
| | 1537 | + _clip.pp.next(); |
| | 1538 | + } |
| | 1539 | + } |
| 1549 | 1540 | //@@todo could maybe generalize transIn with trasOut into one "flow" with a few scattered if statements |
| 1550 | 1541 | //update/setup all transitions (will render current transition state) |
| 1551 | 1542 | var in_range=false; |
| 1552 | | - for(trans_id in _pClip.trans){ |
| 1553 | | - js_log("ON TRANS: " + trans_id + _pClip.embed.currentTime); |
| 1554 | | - tObj = _pClip.trans[trans_id]; |
| 1555 | | - //make sure we are in range: |
| 1556 | | - if(trans_id=='transIn') |
| 1557 | | - in_range = (_pClip.embed.currentTime <= _pClip.transIn.dur); |
| 1558 | | - if(trans_id=='transOut') |
| 1559 | | - in_range = (_pClip.embed.currentTime >= (_pClip.dur - tObj.dur)); |
| | 1543 | + //pretty similar actions per transition types so group into a loop: |
| | 1544 | + var tran_types = {'transIn':true,'transOut':true}; |
| | 1545 | + for(var tid in tran_types ){ |
| | 1546 | + eval('var tObj = _clip.'+tid); |
| | 1547 | + if(!tObj) |
| | 1548 | + continue; |
| | 1549 | + //js_log('f:doSmilActions: ' + _clip.id + ' tid:'+tObj.id + ' tclip_id:'+ tObj.pClip.id); |
| | 1550 | + //make sue we are in range: |
| | 1551 | + if(tid=='transIn') |
| | 1552 | + in_range = (_clip.embed.currentTime <= tObj.dur)?true:false; |
| 1560 | 1553 | |
| | 1554 | + if(tid=='transOut') |
| | 1555 | + in_range = (_clip.embed.currentTime >= (_clip.dur - tObj.dur))?true:false; |
| | 1556 | + |
| 1561 | 1557 | if(in_range){ |
| 1562 | | - if(this.userSlide){ |
| 1563 | | - js_log('user slide update transition state:'+ _pClip.embed.currentTime ); |
| 1564 | | - if(trans_id=='transIn') |
| 1565 | | - mvTransLib.doUpdate(tObj, (_pClip.embed.currentTime / tObj.dur) ); |
| | 1558 | + if(this.userSlide){ |
| | 1559 | + if(tid=='transIn') |
| | 1560 | + mvTransLib.doUpdate(tObj, (_clip.embed.currentTime / tObj.dur) ); |
| 1566 | 1561 | |
| 1567 | | - if(trans_id=='transOut') |
| 1568 | | - mvTransLib.doUpdate(tObj, (_pClip.embed.currentTime-(_pClip.dur - tObj.dur)) /tObj.dur); |
| | 1562 | + if(tid=='transOut') |
| | 1563 | + mvTransLib.doUpdate(tObj, (_clip.embed.currentTime-(_clip.dur - tObj.dur)) /tObj.dur); |
| | 1564 | + |
| 1569 | 1565 | }else{ |
| 1570 | 1566 | if(tObj.animation_state==0){ |
| 1571 | 1567 | js_log('init/run_transition '); |
| — | — | @@ -1575,7 +1571,7 @@ |
| 1576 | 1572 | //close up transition if done & still onDispaly |
| 1577 | 1573 | if( tObj.overlay_selector_id ){ |
| 1578 | 1574 | js_log('close up transition :'+tObj.overlay_selector_id); |
| 1579 | | - mvTransLib.doCloseTransition( tObj ) ; |
| | 1575 | + mvTransLib.doCloseTransition( tObj ); |
| 1580 | 1576 | } |
| 1581 | 1577 | } |
| 1582 | 1578 | } |
| — | — | @@ -1610,10 +1606,9 @@ |
| 1611 | 1607 | |
| 1612 | 1608 | if(!this['type'][tObj.type][tObj.subtype]) |
| 1613 | 1609 | return js_log('mvTransLib does not support subType: '+tObj.subtype); |
| 1614 | | - |
| 1615 | | - js_log('setup overlay_selector_id '); |
| | 1610 | + |
| 1616 | 1611 | //setup overlay_selector_id |
| 1617 | | - if(tObj.subtype=='crossfade'){ |
| | 1612 | + if(tObj.subtype=='crossfade'){ |
| 1618 | 1613 | if(tObj.transAttrType=='transIn') |
| 1619 | 1614 | var other_pClip = tObj.pClip.pp.getClip(-1); |
| 1620 | 1615 | if(tObj.transAttrType=='transOut') |
| — | — | @@ -1621,8 +1616,10 @@ |
| 1622 | 1617 | |
| 1623 | 1618 | if(typeof(other_pClip)=='undefined' || other_pClip.id == tObj.pClip.pp.cur_clip.id) |
| 1624 | 1619 | js_log('Error: crossfade without media asset'); |
| 1625 | | - |
| 1626 | | - tObj.overlay_selector_id = 'clipDesc_'+other_pClip.id; |
| | 1620 | + //if not sliding start playback: |
| | 1621 | + if(!tObj.pClip.pp.userSlide) |
| | 1622 | + other_pClip.embed.play(); |
| | 1623 | + tObj.overlay_selector_id = 'clipDesc_'+other_pClip.id; |
| 1627 | 1624 | }else{ |
| 1628 | 1625 | tObj.overlay_selector_id =this.getOverlaySelector(tObj); |
| 1629 | 1626 | } |
| — | — | @@ -1634,7 +1631,7 @@ |
| 1635 | 1632 | doCloseTransition:function(tObj){ |
| 1636 | 1633 | if(tObj.subtype=='crossfade'){ |
| 1637 | 1634 | //close up crossfade |
| 1638 | | - js_log("close up crossfade"); |
| | 1635 | + js_log("close up crossfade"); |
| 1639 | 1636 | }else{ |
| 1640 | 1637 | $j('#'+tObj.overlay_selector_id).remove(); |
| 1641 | 1638 | } |
| — | — | @@ -1659,7 +1656,18 @@ |
| 1660 | 1657 | //init the transition if nessesary: |
| 1661 | 1658 | if(!tObj.overlay_selector_id) |
| 1662 | 1659 | this.doInitTransition(tObj); |
| | 1660 | + |
| | 1661 | + //@@todo we should ensure visability outside of doUpate loop |
| | 1662 | + if(!$j('#'+tObj.overlay_selector_id).is(':visible')) |
| | 1663 | + $j('#'+tObj.overlay_selector_id).show(); |
| | 1664 | + |
| 1663 | 1665 | //do update: |
| | 1666 | + /*js_log('doing update for: '+ tObj.pClip.id + |
| | 1667 | + ' type:' + tObj.transAttrType + |
| | 1668 | + ' t_type:'+ tObj.type + |
| | 1669 | + ' subypte:'+ tObj.subtype + |
| | 1670 | + ' percent:' + percent);*/ |
| | 1671 | + |
| 1664 | 1672 | this['type'][tObj.type][tObj.subtype].u(tObj,percent); |
| 1665 | 1673 | }, |
| 1666 | 1674 | /* |
| — | — | @@ -1710,7 +1718,7 @@ |
| 1711 | 1719 | } |
| 1712 | 1720 | } |
| 1713 | 1721 | } |
| 1714 | | -//smile based extension of <video> tag: |
| | 1722 | +//very limited smile feature set more details soon: |
| 1715 | 1723 | //region="video_region" transIn="fromGreen" begin="2s" |
| 1716 | 1724 | //http://www.w3.org/TR/2007/WD-SMIL3-20070713/smil-extended-media-object.html#edef-ref |
| 1717 | 1725 | var smilPlaylist ={ |
| — | — | @@ -1788,7 +1796,6 @@ |
| 1789 | 1797 | ); |
| 1790 | 1798 | //all the overwritten and new methods for playlist extension of mv_embed |
| 1791 | 1799 | mvSMILClip.prototype = { |
| 1792 | | - trans:{},//transition object stores transIn and transOut |
| 1793 | 1800 | init:function(smil_clip_element, mvClipInit){ |
| 1794 | 1801 | _this = this; |
| 1795 | 1802 | |
| — | — | @@ -1816,21 +1823,21 @@ |
| 1817 | 1824 | //lookup and assing copies of transitions |
| 1818 | 1825 | // (since transition needs to hold some per-instance state info) |
| 1819 | 1826 | if(this.transIn && this.pp.transitions[this.transIn]){ |
| 1820 | | - this.trans['transIn'] =this.pp.transitions[this.transIn].clone(); |
| 1821 | | - this.trans['transIn'].pClip = _this; |
| 1822 | | - this.trans['transIn'].transAttrType='transIn'; |
| | 1827 | + this.transIn = this.pp.transitions[this.transIn].clone(); |
| | 1828 | + this.transIn.pClip = _this; |
| | 1829 | + this.transIn.transAttrType='transIn'; |
| 1823 | 1830 | } |
| 1824 | 1831 | |
| 1825 | 1832 | if(this.transOut && this.pp.transitions[this.transOut]){ |
| 1826 | | - this.trans['transOut'] = this.pp.transitions[ this.transOut ].clone(); |
| 1827 | | - this.trans['transOut'].pClip = _this; |
| 1828 | | - this.trans['transOut'].transAttrType = 'transOut'; |
| | 1833 | + this.transOut = this.pp.transitions[ this.transOut ].clone(); |
| | 1834 | + this.transOut.pClip = _this; |
| | 1835 | + this.transOut.transAttrType = 'transOut'; |
| 1829 | 1836 | } |
| 1830 | 1837 | //parse duration / begin times: |
| 1831 | 1838 | if(this.dur) |
| 1832 | | - this.dur = smilParseTime(this.dur); |
| 1833 | | - |
| 1834 | | - //check if the transition is a valid id: |
| | 1839 | + this.dur = smilParseTime(this.dur); |
| | 1840 | + |
| | 1841 | + //@@todo check if valid transition id |
| 1835 | 1842 | return this; |
| 1836 | 1843 | }, |
| 1837 | 1844 | /* |
| — | — | @@ -1898,8 +1905,7 @@ |
| 1899 | 1906 | * the main animation loop called every MV_ANIMATION_CB_RATE or 34ms ~around 30frames per second~ |
| 1900 | 1907 | */ |
| 1901 | 1908 | run_transition:function(){ |
| 1902 | | - //js_log('f:run_transition:' + this.interValCount); |
| 1903 | | - // |
| | 1909 | + //js_log('f:run_transition:' + this.interValCount); |
| 1904 | 1910 | //read directly from plugin if avaliable (for native video) |
| 1905 | 1911 | if(typeof this.pClip.embed.vid !='undefined'){ |
| 1906 | 1912 | this.interValCount=0; |
| — | — | @@ -1909,26 +1915,34 @@ |
| 1910 | 1916 | if(this.prev_curtime!=this.pClip.embed.currentTime){ |
| 1911 | 1917 | this.prev_curtime = this.pClip.embed.currentTime; |
| 1912 | 1918 | this.interValCount=0; |
| 1913 | | - } |
| 1914 | | - } |
| 1915 | | - |
| | 1919 | + } |
| | 1920 | + } |
| 1916 | 1921 | //start_time =assinged by doSmilActions |
| 1917 | 1922 | //base_cur_time = pClip.embed.currentTime; |
| 1918 | | - //dur = assinged by attribute |
| 1919 | | - |
| | 1923 | + //dur = assinged by attribute |
| 1920 | 1924 | if(this.animation_state==0){ |
| 1921 | 1925 | mvTransLib.doInitTransition(this); |
| 1922 | 1926 | this.animation_state=1; |
| 1923 | 1927 | } |
| 1924 | 1928 | //set percetage include difrence of currentTime to prev_curTime |
| 1925 | 1929 | // ie updated inbetween currentTime updates) |
| 1926 | | - var percentage = ( (this.pClip.embed.currentTime + ( (this.interValCount*MV_ANIMATION_CB_RATE)/1000) ) ) / this.dur; |
| 1927 | 1930 | |
| | 1931 | + if(this.transAttrType=='transIn') |
| | 1932 | + var percentage = ( this.pClip.embed.currentTime + |
| | 1933 | + ( (this.interValCount*MV_ANIMATION_CB_RATE)/1000 ) |
| | 1934 | + ) / this.dur ; |
| | 1935 | + |
| | 1936 | + if(this.transAttrType=='transOut') |
| | 1937 | + var percentage = (this.pClip.embed.currentTime + |
| | 1938 | + ( (this.interValCount*MV_ANIMATION_CB_RATE)/1000 ) |
| | 1939 | + - (this.pClip.dur - this.dur) |
| | 1940 | + ) /this.dur ; |
| | 1941 | + |
| 1928 | 1942 | /*js_log('percentage = ct:'+this.pClip.embed.currentTime + ' + ic:'+this.interValCount +' * cb:'+MV_ANIMATION_CB_RATE + |
| 1929 | 1943 | ' / ' + this.dur + ' = ' + percentage ); |
| 1930 | 1944 | */ |
| 1931 | 1945 | |
| 1932 | | - //js_log('cur percentage: '+percentage); |
| | 1946 | + //js_log('cur percentage of transition: '+percentage); |
| 1933 | 1947 | //update state based on curent time + cur_time_offset (for now just use pClip.embed.currentTime) |
| 1934 | 1948 | mvTransLib.doUpdate(this, percentage); |
| 1935 | 1949 | |