| Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_embed.js |
| — | — | @@ -169,11 +169,16 @@ |
| 170 | 170 | //plugin libs var names and paths: |
| 171 | 171 | lib_jquery:{'window.jQuery':'jquery/jquery-1.2.6.min.js'}, |
| 172 | 172 | lib_plugins:{ |
| | 173 | + '$j.timer.global':'jquery/plugins/jquery.timers.js', //we may be able to remove the timer |
| | 174 | + '$j.ui.progressbar':'jquery/jquery-ui-personalized-1.6rc1.debug.js' |
| | 175 | + }, |
| | 176 | + /*old lib includes: |
| 173 | 177 | '$j.fn.offsetParent':'jquery/plugins/jquery.dimensions.js', |
| 174 | 178 | '$j.ui.mouseInteraction':'jquery/plugins/ui.mouse.js', |
| 175 | | - '$j.ui.slider':'jquery/plugins/ui.slider.js', |
| 176 | | - '$j.timer.global':'jquery/plugins/jquery.timers.js' |
| 177 | | - }, |
| | 179 | + '$j.ui.slider':'jquery/plugins/ui.slider.js', |
| | 180 | + '$j.ui.draggable':'jquery/plugins/ui.draggable.js', //include draggable |
| | 181 | + '$j.ui.droppable':'jquery/plugins/ui.droppable.js' |
| | 182 | + */ |
| 178 | 183 | pc:null, //used to store pointer to parent clip (when in playlist mode) |
| 179 | 184 | load_libs:function(callback){ |
| 180 | 185 | if(callback)this.load_callback = callback; |
| — | — | @@ -508,6 +513,57 @@ |
| 509 | 514 | } |
| 510 | 515 | return o; |
| 511 | 516 | }, |
| | 517 | + /* |
| | 518 | + * addControlHooks |
| | 519 | + * to be run once controls are attached to the dom |
| | 520 | + */ |
| | 521 | + addControlHooks:function(embedObj){ |
| | 522 | + var _this = embedObj; |
| | 523 | + //add in drag/seek hooks: |
| | 524 | + if(!_this.base_seeker_slider_offset && $j('#mv_seeker_slider_'+_this.id).get(0)) |
| | 525 | + _this.base_seeker_slider_offset = $j('#mv_seeker_slider_'+_this.id).get(0).offsetLeft; |
| | 526 | + |
| | 527 | + //if playlist always start at 0 |
| | 528 | + _this.start_time_sec = (_this.instanceOf == 'mvPlayList')?0: |
| | 529 | + _this.start_time_sec = ntp2seconds(_this.getTimeReq().split('/')[0]); |
| | 530 | + |
| | 531 | + js_log('looking for: #mv_seeker_slider_'+_this.id + "\n " + |
| | 532 | + 'start sec: '+_this.start_time_sec + ' base offset: '+_this.base_seeker_slider_offset); |
| | 533 | + |
| | 534 | + //buid dragable hook here: |
| | 535 | + $j('#mv_seeker_slider_'+_this.id).draggable({ |
| | 536 | + containment:'#seeker_bar_'+_this.id, |
| | 537 | + axis:'x', |
| | 538 | + opacity:.6, |
| | 539 | + start:function(e, ui){ |
| | 540 | + _this.userSlide=true; |
| | 541 | + js_log("started draging set userSlide"+_this.userSlide) |
| | 542 | + var options = ui.options; |
| | 543 | + //remove "play button" |
| | 544 | + $j('#big_play_link_'+_this.id).fadeOut('fast'); |
| | 545 | + }, |
| | 546 | + drag:function(e, ui){ |
| | 547 | + //@@todo get the -14 number from the skin somehow |
| | 548 | + var perc = (($j('#mv_seeker_slider_'+_this.id).get(0).offsetLeft-_this.base_seeker_slider_offset) |
| | 549 | + / |
| | 550 | + ($j('#mv_seeker_'+_this.id).width()-14)); |
| | 551 | + |
| | 552 | + this.jump_time = seconds2ntp(parseInt(_this.getDuration()*perc)+ _this.start_time_sec); |
| | 553 | + js_log('perc:' + perc + ' * ' + _this.getDuration() + ' jt:'+ this.jump_time); |
| | 554 | + _this.setStatus( getMsg('seek_to')+' '+this.jump_time ); |
| | 555 | + //update the thumbnail/ frame |
| | 556 | + _this.updateTimeThumb(perc); |
| | 557 | + }, |
| | 558 | + stop:function(e, ui){ |
| | 559 | + _this.userSlide=false; |
| | 560 | + js_log('do jump to: '+this.jump_time) |
| | 561 | + //reset slider |
| | 562 | + _this.seek_time_sec=ntp2seconds(this.jump_time); |
| | 563 | + //_this.stop(); |
| | 564 | + //_this.play(); |
| | 565 | + } |
| | 566 | + }); |
| | 567 | + }, |
| 512 | 568 | components:{ |
| 513 | 569 | 'borders':{ |
| 514 | 570 | 'w':8, |
| — | — | @@ -575,7 +631,7 @@ |
| 576 | 632 | 'w':0, //special case (takes up remaning space) |
| 577 | 633 | 'o':function(){ |
| 578 | 634 | return '<div class="seeker" id="mv_seeker_'+ctrlBuilder.id+'" style="width: ' + (ctrlBuilder.avaliable_width - 18) + 'px;">'+ |
| 579 | | - ' <div class="seeker_bar">'+ |
| | 635 | + ' <div id="seeker_bar_'+ctrlBuilder.id+'" class="seeker_bar">'+ |
| 580 | 636 | ' <div class="seeker_bar_outer"></div>'+ |
| 581 | 637 | ' <div id="mv_seeker_slider_'+ctrlBuilder.id+'" class="seeker_slider"></div>'+ |
| 582 | 638 | ' <div class="seeker_bar_close"></div>'+ |
| — | — | @@ -920,17 +976,12 @@ |
| 921 | 977 | mvEmbed.load_libs(function(){ |
| 922 | 978 | //load playlist object and drag,drop,resize,hoverintent,libs |
| 923 | 979 | mvJsLoader.doLoad({ |
| 924 | | - 'mvPlayList':'mv_playlist.js', |
| 925 | | - '$j.ui.resizable':'jquery/plugins/ui.resizable.js', |
| 926 | | - '$j.ui.draggable':'jquery/plugins/ui.draggable.js', |
| 927 | | - '$j.ui.droppable':'jquery/plugins/ui.droppable.js' |
| | 980 | + 'mvPlayList':'mv_playlist.js' |
| 928 | 981 | //'$j.ui.sortable':'jquery/plugins/ui.sortable.js' |
| 929 | 982 | },function(){ |
| 930 | 983 | //load the sequencer and draggable ext |
| 931 | 984 | mvJsLoader.doLoad({ |
| 932 | | - 'mvSequencer':'mv_sequencer.js', |
| 933 | | - '$j.ui.draggable.prototype.plugins.drag':'jquery/plugins/ui.draggable.ext.js', |
| 934 | | - '$j.ui.droppable.prototype.plugins.over':'jquery/plugins/ui.droppable.ext.js' |
| | 985 | + 'mvSequencer':'mv_sequencer.js' |
| 935 | 986 | },function(){ |
| 936 | 987 | //init the sequence object (it will take over from there) |
| 937 | 988 | mvSeq = new mvSequencer(initObj); |
| — | — | @@ -1442,14 +1493,8 @@ |
| 1443 | 1494 | getURI : function(seek_time_sec) |
| 1444 | 1495 | { |
| 1445 | 1496 | if(!seek_time_sec) |
| 1446 | | - return this.src; |
| 1447 | | - |
| 1448 | | - pSrc = parseUri(this.src); |
| 1449 | | - var new_url = pSrc.protocol +'://'+ pSrc.host + pSrc.path +'?'; |
| 1450 | | - for(i in pSrc.queryKey){ |
| 1451 | | - new_url +=(i=='t')?'t=' + seconds2ntp(seek_time_sec) +'/'+ this.end_ntp +'&' : |
| 1452 | | - i+'='+ pSrc.queryKey[i]+'&'; |
| 1453 | | - } |
| | 1497 | + return this.src; |
| | 1498 | + var new_url = getUpdateTimeURL(this.src, seconds2ntp(seek_time_sec)+'/'+ this.end_ntp); |
| 1454 | 1499 | return new_url; |
| 1455 | 1500 | }, |
| 1456 | 1501 | /** Title accessor function. |
| — | — | @@ -1770,7 +1815,11 @@ |
| 1771 | 1816 | seek_time_sec:0, |
| 1772 | 1817 | base_seeker_slider_offset:null, |
| 1773 | 1818 | onClipDone_disp:false, |
| 1774 | | - supports:{}, |
| | 1819 | + supports:{}, |
| | 1820 | + //for seek thumb updates: |
| | 1821 | + cur_thumb_seek_time:0, |
| | 1822 | + thumb_seek_interval:null, |
| | 1823 | + |
| 1775 | 1824 | //utility functions for property values: |
| 1776 | 1825 | hx : function ( s ) { |
| 1777 | 1826 | if ( typeof s != 'String' ) { |
| — | — | @@ -2209,8 +2258,9 @@ |
| 2210 | 2259 | return; |
| 2211 | 2260 | }else{ |
| 2212 | 2261 | $j('#mv_embedded_controls_'+this.id).html( this.getControlsHTML() ); |
| | 2262 | + this.addControlHooks(); |
| 2213 | 2263 | } |
| 2214 | | - }, |
| | 2264 | + }, |
| 2215 | 2265 | getControlsHTML:function() |
| 2216 | 2266 | { |
| 2217 | 2267 | return ctrlBuilder.getControls(this); |
| — | — | @@ -2239,44 +2289,10 @@ |
| 2240 | 2290 | } |
| 2241 | 2291 | html_code += '</div>'; //videoPlayer div close |
| 2242 | 2292 | js_log('should set: '+this.id); |
| 2243 | | - $j(this).html(html_code); |
| 2244 | | - |
| 2245 | | - if(!_this.base_seeker_slider_offset) |
| 2246 | | - _this.base_seeker_slider_offset = $j('#mv_seeker_slider_'+_this.id).get(0).offsetLeft; |
| 2247 | | - |
| 2248 | | - _this.start_time_sec = ntp2seconds(_this.getTimeReq().split('/')[0]); |
| 2249 | | - |
| 2250 | | - js_log('start sec: '+_this.start_time_sec + ' base offset: '+_this.base_seeker_slider_offset); |
| 2251 | | - |
| 2252 | | - //buid dragable hook here: |
| 2253 | | - $j('#mv_seeker_slider_'+this.id).draggable({ |
| 2254 | | - containment:'parent', |
| 2255 | | - axis:'x', |
| 2256 | | - opacity:.6, |
| 2257 | | - start:function(e, ui){ |
| 2258 | | - _this.userSlide=true; |
| 2259 | | - js_log("started draging set userSlide"+_this.userSlide) |
| 2260 | | - }, |
| 2261 | | - drag:function(e, ui){ |
| 2262 | | - //@@todo get the -14 number from the skin somehow |
| 2263 | | - var perc = (($j('#mv_seeker_slider_'+_this.id).get(0).offsetLeft-_this.base_seeker_slider_offset) |
| 2264 | | - / |
| 2265 | | - ($j('#mv_seeker_'+_this.id).width()-14)); |
| 2266 | | - |
| 2267 | | - this.jump_time = seconds2ntp(parseInt(_this.duration*perc)+ _this.start_time_sec); |
| 2268 | | - js_log('perc:' + perc + ' * ' + _this.duration + ' jt:'+ this.jump_time); |
| 2269 | | - _this.setStatus( getMsg('seek_to')+' '+this.jump_time ); |
| 2270 | | - }, |
| 2271 | | - stop:function(e, ui){ |
| 2272 | | - _this.userSlide=false; |
| 2273 | | - js_log('do jump to: '+this.jump_time) |
| 2274 | | - //reset slider |
| 2275 | | - _this.seek_time_sec=ntp2seconds(this.jump_time); |
| 2276 | | - _this.stop(); |
| 2277 | | - _this.play(); |
| 2278 | | - } |
| 2279 | | - }); |
| 2280 | | - |
| | 2293 | + $j(this).html(html_code); |
| | 2294 | + //add hooks once Controls are in DOM |
| | 2295 | + ctrlBuilder.addControlHooks(this); |
| | 2296 | + |
| 2281 | 2297 | //js_log('set this to: ' + $j(this).html() ); |
| 2282 | 2298 | //alert('stop'); |
| 2283 | 2299 | //if auto play==true directly embed the plugin |
| — | — | @@ -2318,6 +2334,19 @@ |
| 2319 | 2335 | updateVideoSrc : function(src){ |
| 2320 | 2336 | js_log("UPDATE SRC:"+src); |
| 2321 | 2337 | this.src = src; |
| | 2338 | + }, |
| | 2339 | + updateTimeThumb: function(perc){ |
| | 2340 | + //do quick thumb update |
| | 2341 | + if(typeof org_thum_src=='undefined'){ |
| | 2342 | + org_thum_src = this.media_element.getThumbnailURL(); |
| | 2343 | + } |
| | 2344 | + if(org_thum_src.indexOf('t=')!==-1){ |
| | 2345 | + this.updateThumbnail( getUpdateTimeURL( |
| | 2346 | + seconds2ntp( (this.getDuration() * perc) + this.start_offset) |
| | 2347 | + ) |
| | 2348 | + ); |
| | 2349 | + } |
| | 2350 | + js_log('f:doUpdateTimeThumb: update thumb to: '+ perc + ' os:'+ org_thum_src); |
| 2322 | 2351 | }, |
| 2323 | 2352 | //updates the thumbnail if the thumbnail is being displayed |
| 2324 | 2353 | updateThumbnail : function(src, quick_switch){ |
| — | — | @@ -2790,7 +2819,7 @@ |
| 2791 | 2820 | } |
| 2792 | 2821 | return null; |
| 2793 | 2822 | }, |
| 2794 | | - activateSlider : function(slider_id){ |
| | 2823 | + /*activateSlider : function(slider_id){ |
| 2795 | 2824 | var id = (this.pc)?this.pc.pp.id:this.id; |
| 2796 | 2825 | var thisVid = this; |
| 2797 | 2826 | this.sliderVal=0; |
| — | — | @@ -2811,15 +2840,15 @@ |
| 2812 | 2841 | }); |
| 2813 | 2842 | //if(!slider_id)slider_id=this.id; |
| 2814 | 2843 | //get a pointer to this id (as this in onSlide context is not "this") |
| 2815 | | - /*var parent_id = this.id; */ |
| 2816 | | - }, |
| | 2844 | + /*var parent_id = this.id; |
| | 2845 | + },*/ |
| 2817 | 2846 | setSliderValue: function(perc){ |
| 2818 | 2847 | var id = (this.pc)?this.pc.pp.id:this.id; |
| 2819 | 2848 | //alinment offset: |
| 2820 | 2849 | if(!this.mv_seeker_width) |
| 2821 | 2850 | this.mv_seeker_width = $j('#mv_seeker_slider_'+id).width(); |
| 2822 | 2851 | |
| 2823 | | - js_log('currentTime:'+ this.currentTime); |
| | 2852 | + //js_log('currentTime:'+ this.currentTime); |
| 2824 | 2853 | |
| 2825 | 2854 | var val = Math.round( perc * $j('#mv_seeker_'+id).width() - (this.mv_seeker_width*perc)); |
| 2826 | 2855 | $j('#mv_seeker_slider_'+id).css('left', (val+41)+'px' ); |
| — | — | @@ -2847,23 +2876,31 @@ |
| 2848 | 2877 | } |
| 2849 | 2878 | |
| 2850 | 2879 | /* |
| 2851 | | -* EMBED OBJECTS: |
| 2852 | | -* (dynamically included) |
| 2853 | | -*/ |
| 2854 | | - |
| 2855 | | -/* |
| 2856 | 2880 | * utility functions: |
| 2857 | 2881 | */ |
| | 2882 | +function getUpdateTimeURL(url, new_time){ |
| | 2883 | + pSrc = parseUri(url); |
| | 2884 | + var new_url = pSrc.protocol +'://'+ pSrc.host + pSrc.path +'?'; |
| | 2885 | + var amp = ''; |
| | 2886 | + for(i in pSrc.queryKey){ |
| | 2887 | + new_url +=(i=='t')? amp + 't=' + new_time: |
| | 2888 | + amp+i+'='+ pSrc.queryKey[i]; |
| | 2889 | + amp = '&'; |
| | 2890 | + } |
| | 2891 | + return new_url; |
| | 2892 | +} |
| 2858 | 2893 | function seconds2ntp(sec){ |
| 2859 | | - sec = parseInt(sec); |
| 2860 | | - hours = Math.floor(sec/ 3600); |
| 2861 | | - minutes = Math.floor((sec/60) % 60); |
| 2862 | | - seconds = sec % 60; |
| | 2894 | + var sec = parseInt(sec); |
| | 2895 | + var hours = Math.floor(sec/ 3600); |
| | 2896 | + var minutes = Math.floor((sec/60) % 60); |
| | 2897 | + var seconds = sec % 60; |
| 2863 | 2898 | if ( minutes < 10 ) minutes = "0" + minutes; |
| 2864 | 2899 | if ( seconds < 10 ) seconds = "0" + seconds; |
| 2865 | 2900 | return hours+":"+minutes+":"+seconds; |
| 2866 | 2901 | } |
| 2867 | | -/* takes hh:mm:ss input returns number of seconds */ |
| | 2902 | +/* |
| | 2903 | + * takes hh:mm:ss input returns number of seconds |
| | 2904 | + */ |
| 2868 | 2905 | function ntp2seconds(ntp){ |
| 2869 | 2906 | if(!ntp){ |
| 2870 | 2907 | js_log('ntp2seconds:not valid ntp:'+ntp); |
| Index: trunk/extensions/MetavidWiki/skins/mv_embed/mv_playlist.js |
| — | — | @@ -51,6 +51,7 @@ |
| 52 | 52 | }; |
| 53 | 53 | //set up the mvPlaylist object |
| 54 | 54 | mvPlayList.prototype = { |
| | 55 | + instanceOf:'mvPlayList', |
| 55 | 56 | pl_duration:null, |
| 56 | 57 | update_tl_hook:null, |
| 57 | 58 | clip_ready_count:0, |
| — | — | @@ -213,7 +214,10 @@ |
| 214 | 215 | this.loading=false; |
| 215 | 216 | this.getHTML(); |
| 216 | 217 | }, |
| 217 | | - getPlDuration:function(regen){ |
| | 218 | + /* |
| | 219 | + * @@todo getDuration should replace getDuration |
| | 220 | + */ |
| | 221 | + getDuration:function(regen){ |
| 218 | 222 | //js_log("GET PL DURRATION for : "+ this.tracks[this.default_track_id].clips.length + 'clips'); |
| 219 | 223 | if(!regen && this.pl_duration) |
| 220 | 224 | return this.pl_duration; |
| — | — | @@ -232,9 +236,9 @@ |
| 233 | 237 | //js_log("return dur: " + this.pl_duration); |
| 234 | 238 | return this.pl_duration; |
| 235 | 239 | }, |
| 236 | | - getPlDurationNTP:function(){ |
| | 240 | + getDurationNTP:function(){ |
| 237 | 241 | //get duration in ms and return in NTP |
| 238 | | - return seconds2ntp(this.getPlDuration()); |
| | 242 | + return seconds2ntp(this.getDuration()); |
| 239 | 243 | //return 'wtf'; |
| 240 | 244 | }, |
| 241 | 245 | getDataSource:function(){ |
| — | — | @@ -368,6 +372,8 @@ |
| 369 | 373 | '</div>'+ |
| 370 | 374 | '</div>' |
| 371 | 375 | ); |
| | 376 | + //once the contorls are in the DOM add hooks: |
| | 377 | + ctrlBuilder.addControlHooks(this); |
| 372 | 378 | //add the play button: |
| 373 | 379 | $j('#dc_'+plObj.id).append( |
| 374 | 380 | this.cur_clip.embed.getPlayButton() |
| — | — | @@ -399,15 +405,53 @@ |
| 400 | 406 | this.updateBaseStatus(); |
| 401 | 407 | } |
| 402 | 408 | }, |
| | 409 | + updateTimeThumb:function(perc){ |
| | 410 | + //get float seconds: |
| | 411 | + var float_sec = (this.getDuration()*perc) |
| | 412 | + js_log('float sec:' + float_sec); |
| | 413 | + |
| | 414 | + //update display & cur_clip: |
| | 415 | + var pl_sum_time =0; |
| | 416 | + var clip_float_sec=0; |
| | 417 | + for(var i in this.default_track.clips){ |
| | 418 | + var clip = this.default_track.clips[i]; |
| | 419 | + if( (clip.getDuration() + pl_sum_time) > float_sec ){ |
| | 420 | + if(this.cur_clip.id != clip.id){ |
| | 421 | + $j('#clipDesc_'+this.cur_clip.id).hide(); |
| | 422 | + this.cur_clip = clip; |
| | 423 | + $j('#clipDesc_'+this.cur_clip.id).show(); |
| | 424 | + } |
| | 425 | + break; |
| | 426 | + } |
| | 427 | + pl_sum_time+=clip.getDuration(); |
| | 428 | + } |
| | 429 | + //update start offset (@@todo should probably happen somewhere else like in getDuration() ) |
| | 430 | + if(!this.cur_clip.embed.start_offset) |
| | 431 | + this.cur_clip.embed.start_offset=this.cur_clip.embed.media_element.selected_source.start_offset; |
| | 432 | + |
| | 433 | + //render effects ontop: |
| | 434 | + //issue thumbnail update request: (if plugin supports it will render out |
| | 435 | + this.cur_clip.embed.updateTimeThumb(perc); |
| | 436 | + |
| | 437 | + this.cur_clip.embed.currentTime = (float_sec -pl_sum_time)+this.cur_clip.embed.start_offset ; |
| | 438 | + this.cur_clip.embed.seek_time_sec = (float_sec -pl_sum_time ); |
| | 439 | + |
| | 440 | + this.doSmilActions(); |
| | 441 | + |
| | 442 | + }, |
| 403 | 443 | updateBaseStatus:function(){ |
| 404 | 444 | js_log('update title'); |
| 405 | 445 | $j('#ptitle_'+this.id).html(''+ |
| 406 | 446 | '<b>' + this.title + '</b> '+ |
| 407 | 447 | this.getClipCount()+' clips, <i>'+ |
| 408 | | - this.getPlDurationNTP() + '</i>' ); |
| | 448 | + this.getDurationNTP() + '</i>' ); |
| 409 | 449 | //update status: |
| 410 | | - this.cur_clip.embed.setStatus('0:0:00/'+this.getPlDurationNTP()); |
| | 450 | + this.cur_clip.embed.setStatus('0:0:00/'+this.getDurationNTP()); |
| 411 | 451 | }, |
| | 452 | + /*setStatus overide (could call the jquery directly) */ |
| | 453 | + setStatus:function(value){ |
| | 454 | + $j('#mv_time_'+this.id).html(value); |
| | 455 | + }, |
| 412 | 456 | /*gets adds hidden desc to the #dc container*/ |
| 413 | 457 | getAllClipDesc : function(){ |
| 414 | 458 | //js_log("build all clip details pages"); |
| — | — | @@ -444,12 +488,12 @@ |
| 445 | 489 | } |
| 446 | 490 | var track_len = $j('#mv_seeker_'+this.id).css('width').replace(/px/, ''); |
| 447 | 491 | //assume the duration is static and present at .duration during playback |
| 448 | | - var clip_perc = this.cur_clip.embed.duration / this.getPlDuration(); |
| | 492 | + var clip_perc = this.cur_clip.embed.duration / this.getDuration(); |
| 449 | 493 | var perc_offset =time_offset = 0; |
| 450 | 494 | for(var i in this.default_track.clips){ |
| 451 | 495 | var clip = this.default_track.clips[i]; |
| 452 | 496 | if(this.cur_clip.id ==clip.id)break; |
| 453 | | - perc_offset+=(clip.embed.duration / plObj.getPlDuration()); |
| | 497 | + perc_offset+=(clip.embed.duration / plObj.getDuration()); |
| 454 | 498 | time_offset+=clip.embed.duration; |
| 455 | 499 | } |
| 456 | 500 | //run any update time line hooks: |
| — | — | @@ -601,14 +645,13 @@ |
| 602 | 646 | //next prev button and more status display |
| 603 | 647 | getControlsHTML:function(){ |
| 604 | 648 | //get controls from current clip (add some playlist specific controls: |
| 605 | | - this.cur_clip.embed.supports['prev_next']=true; |
| 606 | | - this.cur_clip.embed.supports['options_in_body']=true; |
| | 649 | + this.cur_clip.embed.supports['prev_next']=true; |
| 607 | 650 | return ctrlBuilder.getControls(this.cur_clip.embed); |
| 608 | 651 | }, |
| 609 | 652 | //ads colors/dividers between tracks |
| 610 | 653 | colorPlayHead: function(){ |
| 611 | 654 | //total duration: |
| 612 | | - var pl_duration = this.getPlDuration(); |
| | 655 | + var pl_duration = this.getDuration(); |
| 613 | 656 | var track_len = $j('#slider_'+this.id).css('width').replace(/px/, ''); |
| 614 | 657 | var cur_pixle=0; |
| 615 | 658 | |
| — | — | @@ -943,9 +986,7 @@ |
| 944 | 987 | } |
| 945 | 988 | } |
| 946 | 989 | }, |
| 947 | | - getDuration:function(){ |
| 948 | | - //return duration if clips already has duration |
| 949 | | - if(this.duration)return this.duration; |
| | 990 | + getDuration:function(){ |
| 950 | 991 | if(!this.embed)this.setUpEmbedObj(); |
| 951 | 992 | return this.embed.getDuration(); |
| 952 | 993 | }, |
| — | — | @@ -1202,7 +1243,7 @@ |
| 1203 | 1244 | this.pe_setStatus(value); |
| 1204 | 1245 | }else{ |
| 1205 | 1246 | //js_log("set time via base offset:"+base_dur + ' curTime:'+plObj.cur_clip.embed.currentTime) |
| 1206 | | - this.pe_setStatus(seconds2ntp(plObj.cur_clip.dur_offset + plObj.cur_clip.embed.currentTime) + '/'+ plObj.getPlDurationNTP()); |
| | 1247 | + this.pe_setStatus(seconds2ntp(plObj.cur_clip.dur_offset + plObj.cur_clip.embed.currentTime) + '/'+ plObj.getDurationNTP()); |
| 1207 | 1248 | } |
| 1208 | 1249 | }, |
| 1209 | 1250 | setSliderValue:function(value){ |
| — | — | @@ -1210,10 +1251,10 @@ |
| 1211 | 1252 | //js_log('set slider value:c:'+this.id+' v:'+ value + ' trueVa:'+ sliderVal); |
| 1212 | 1253 | this.pe_setSliderValue(sliderVal); |
| 1213 | 1254 | }, |
| 1214 | | - activateSlider:function(){ |
| | 1255 | + /*activateSlider:function(){ |
| 1215 | 1256 | //map the slider to the parent playlist slider id: |
| 1216 | 1257 | this.pe_activateSlider(this.pc.pp.id); |
| 1217 | | - }, |
| | 1258 | + },*/ |
| 1218 | 1259 | doSeek:function(v){ |
| 1219 | 1260 | var plObj = this.pc.pp; |
| 1220 | 1261 | var prevClip=null; |
| — | — | @@ -1221,7 +1262,7 @@ |
| 1222 | 1263 | var perc_offset=0; |
| 1223 | 1264 | for(var i in plObj.default_track.clips){ |
| 1224 | 1265 | var clip = plObj.default_track.clips[i]; |
| 1225 | | - perc_offset+=(clip.embed.duration / plObj.getPlDuration()); |
| | 1266 | + perc_offset+=(clip.embed.duration / plObj.getDuration()); |
| 1226 | 1267 | if(perc_offset > v ){ |
| 1227 | 1268 | if(this.playMovieAt){ |
| 1228 | 1269 | this.playMovieAt(i); |
| — | — | @@ -1496,13 +1537,14 @@ |
| 1497 | 1538 | //handles the rendering of overlays loaind of future clips (if nessesary) |
| 1498 | 1539 | //@@todo could be lazy loaded if nessesary |
| 1499 | 1540 | mvPlayList.prototype.doSmilActions = function(){ |
| 1500 | | - //js_log('f:doSmilActions'); |
| | 1541 | + //js_log('f:doSmilActions'); |
| 1501 | 1542 | var offSetTime = 0; //offset time should let us start a transition later on if we have to. |
| 1502 | 1543 | _pClip = this.cur_clip; |
| 1503 | 1544 | |
| 1504 | | - //@@todo move some of this out of this loop |
| | 1545 | + |
| | 1546 | + //@@todo move some of this out of this loop (ie init should assure .dur |
| 1505 | 1547 | if(!_pClip.dur) |
| 1506 | | - _pClip.dur = this.duration; |
| | 1548 | + _pClip.dur = _pClip.embed.getDuration(); |
| 1507 | 1549 | |
| 1508 | 1550 | //check for duration actions / clip freze mode |
| 1509 | 1551 | if(_pClip.dur <= _pClip.embed.currentTime && _pClip.order != _pClip.pp.getClipCount()-1 ){ |
| — | — | @@ -1513,7 +1555,7 @@ |
| 1514 | 1556 | } |
| 1515 | 1557 | |
| 1516 | 1558 | if(_pClip.dur >= _pClip.embed.currentTime ){ |
| 1517 | | - //@@todo freeze on onClipStop |
| | 1559 | + //@@todo freeze-frame on onClipStop |
| 1518 | 1560 | } |
| 1519 | 1561 | |
| 1520 | 1562 | if(_pClip.begin){ |
| — | — | @@ -1533,7 +1575,6 @@ |
| 1534 | 1576 | var prev_pClip = _pClip.pp.getClip(-1); |
| 1535 | 1577 | if(prev_pClip.id == this.cur_clip.id) |
| 1536 | 1578 | js_log('Error: transIn crossfade without previus media asset'); |
| 1537 | | - |
| 1538 | 1579 | _pClip.transIn.overlay_selector_id = 'clipDesc_'+prev_pClip.id; |
| 1539 | 1580 | }else{ |
| 1540 | 1581 | _pClip.transIn.overlay_selector_id =this.getOverlaySelector(_pClip, 'transIn_'); |
| — | — | @@ -1545,7 +1586,17 @@ |
| 1546 | 1587 | //start running the transition animation (will stop once pClip time > transition duration |
| 1547 | 1588 | js_log("ABOUT TO RUN transIn"); |
| 1548 | 1589 | js_log("cid: "+_pClip.transIn.pClip.id); |
| | 1590 | + //if user seeking don't start animations just update frame |
| 1549 | 1591 | _pClip.transIn.run_animation(); |
| | 1592 | + }else if(_pClip.transIn.animation_state==1 ){ |
| | 1593 | + //only update if userSlide (otherwise hanndled by internal transition timer) |
| | 1594 | + if(this.userSlide){ |
| | 1595 | + js_log('user slide update transition state:'+ _pClip.embed.currentTime ); |
| | 1596 | + _pClip.transIn.run_animation(); |
| | 1597 | + } |
| | 1598 | + }else if(_pClip.transIn.animation_state==2){ |
| | 1599 | + //close up shop: |
| | 1600 | + $j('#'+_pClip.transIn.overlay_selector_id).remove(); |
| 1550 | 1601 | } |
| 1551 | 1602 | } |
| 1552 | 1603 | } |
| — | — | @@ -1563,8 +1614,10 @@ |
| 1564 | 1615 | if(next_pClip.id == this.cur_clip.id) |
| 1565 | 1616 | js_log('Error: transOut crossfade without subquent asset'); |
| 1566 | 1617 | |
| 1567 | | - //start playing the next clip |
| 1568 | | - next_pClip.embed.play(); |
| | 1618 | + //start playing the next clip (if not user slide) |
| | 1619 | + if(!this.userSlide){ |
| | 1620 | + next_pClip.embed.play(); |
| | 1621 | + } |
| 1569 | 1622 | _pClip.transOut.overlay_selector_id = 'clipDesc_'+next_pClip.id; |
| 1570 | 1623 | //mvTransLib.doTransition(_pClip.transOut, overlay_selector_id, pClip); |
| 1571 | 1624 | |
| — | — | @@ -1641,7 +1694,7 @@ |
| 1642 | 1695 | //types: |
| 1643 | 1696 | fade:{ |
| 1644 | 1697 | fadeFromColor:{ |
| 1645 | | - "init":function(tObj){ |
| | 1698 | + 'init':function(tObj){ |
| 1646 | 1699 | js_log('f:fadeFromColor: '+tObj.overlay_selector_id +' to color: '+ tObj.fadeColor); |
| 1647 | 1700 | if(!tObj.fadeColor) |
| 1648 | 1701 | return js_log('missing fadeColor'); |
| — | — | @@ -1653,9 +1706,10 @@ |
| 1654 | 1707 | 'background-color':tObj.fadeColor, |
| 1655 | 1708 | 'opacity':"1", |
| 1656 | 1709 | }); |
| 1657 | | - }, |
| | 1710 | + }, |
| 1658 | 1711 | 'u':function(tObj, percent){ |
| 1659 | | - //fade from color invert the percent |
| | 1712 | + js_log(':fadeFromColor:update: '+ percent); |
| | 1713 | + //fade from color (invert the percent) |
| 1660 | 1714 | var percent = 1- percent; |
| 1661 | 1715 | $j('#'+tObj.overlay_selector_id).css({ |
| 1662 | 1716 | "opacity" : percent |
| — | — | @@ -1825,11 +1879,9 @@ |
| 1826 | 1880 | */ |
| 1827 | 1881 | getDuration:function(){ |
| 1828 | 1882 | //check for smil dur: |
| 1829 | | - if(this.dur) |
| 1830 | | - return this.dur; |
| 1831 | | - //else get the duration from the embed clip: |
| 1832 | | - if(this.embed.getDuration()) |
| 1833 | | - return this.embed.getDuration(); |
| | 1883 | + if(!this.dur) |
| | 1884 | + this.dur = this.embed.getDuration(); |
| | 1885 | + return this.dur; |
| 1834 | 1886 | }, |
| 1835 | 1887 | setUpEmbedObj:function(){ |
| 1836 | 1888 | js_log('set up embed for smil based clip'); |
| — | — | @@ -1908,7 +1960,8 @@ |
| 1909 | 1961 | |
| 1910 | 1962 | if(percentage >= 1){ |
| 1911 | 1963 | this.animation_state=2; |
| 1912 | | - js_log("transition done"); |
| | 1964 | + js_log("transition done update with percentage "+percentage); |
| | 1965 | + clearInterval(this.timerId); |
| 1913 | 1966 | return true; |
| 1914 | 1967 | } |
| 1915 | 1968 | //js_log('cur percentage: '+percentage); |
| — | — | @@ -1917,8 +1970,8 @@ |
| 1918 | 1971 | |
| 1919 | 1972 | |
| 1920 | 1973 | this.interValCount++; |
| 1921 | | - //setInterval in we are still in running state |
| 1922 | | - if(this.animation_state==1){ |
| | 1974 | + //setInterval in we are still in running state and user is not using the playhead |
| | 1975 | + if(this.animation_state==1 && !this.pClip.pp.userSlide){ |
| 1923 | 1976 | if(!this.timerId){ |
| 1924 | 1977 | this.timerId = setInterval('document.getElementById(\''+this.pClip.pp.id+'\').cur_clip.'+this.transAttrType+'.run_animation()', |
| 1925 | 1978 | MV_ANIMATION_CB_RATE); |