From e3e38856ae70c43328c816f34a09f7bf2e36401e Mon Sep 17 00:00:00 2001
From: Michael Dale <dale@users.mediawiki.org>
Date: Tue, 4 Aug 2009 18:51:34 +0000
Subject: [PATCH] some sequence / playlist / add-media bug fixes * improved
 abstraction of embedVideo class for playlist object

---
 .../example_usage/Firefogg_Make_Advanced.html |   6 +-
 .../libAddMedia/seqRemoteSearchDriver.js      |  15 ++-
 js2/mwEmbed/libEmbedVideo/embedVideo.js       |  34 +++---
 js2/mwEmbed/libEmbedVideo/htmlEmbed.js        |  16 ++-
 js2/mwEmbed/libSequencer/mvPlayList.js        | 106 +++++++++++++-----
 5 files changed, 115 insertions(+), 62 deletions(-)
diff --git a/js2/mwEmbed/example_usage/Firefogg_Make_Advanced.html b/js2/mwEmbed/example_usage/Firefogg_Make_Advanced.html
index 110024eef2..97746f5469 100644
--- a/js2/mwEmbed/example_usage/Firefogg_Make_Advanced.html
+++ b/js2/mwEmbed/example_usage/Firefogg_Make_Advanced.html
@@ -1,8 +1,8 @@
 <!DOCTYPE HTML>
 <html><head>
 <meta http-equiv="content-type" content="text/html; charset=UTF-8">
-    <title>Firefogg - Make Ogg Video in your Browser</title>    
-	<script type="text/javascript" src="../jsScriptLoader.php?debug=true&class=mv_embed,window.jQuery,mvBaseUploadInterface,mvFirefogg,mvAdvFirefogg,$j.ui,$j.ui.progressbar,$j.ui.dialog,$j.cookie,$j.ui.accordion,$j.ui.slider,$j.ui.datepicker"></script>		 
+    <title>Firefogg - Make Ogg Video in your Browser</title>      
+	<script type="text/javascript" src="../jsScriptLoader.php?&class=mv_embed,window.jQuery,mvBaseUploadInterface,mvFirefogg,mvAdvFirefogg,$j.ui,$j.ui.progressbar,$j.ui.dialog,$j.cookie,$j.ui.accordion,$j.ui.slider,$j.ui.datepicker"></script>
 <style type="text/css" media="all">body {
   margin: 0;
   padding: 0;
@@ -91,7 +91,7 @@ Make Ogg Video</h1>
 	<div style="margin-right:auto;margin-left:auto;width:500px;" id="loadFogg">Loading firefogg<blink>...</blink></div>	
 	<div style="margin-right:auto;margin-left:auto;width:500px;height:230px"  id="firefogg_app"></div>
 	
-	<div style="height:265px"></div>
+	<div style="height:295px"></div>
 	<center><span style="font:size:80%">Built using <a href="http://firefogg.org">firefogg</a>, <a href="http://www.mediawiki.org/wiki/Media_Projects_Overview#MwEmbed">MwEmbed</a> and <a href="http://jqueryui.com/">jquery.ui</a>. Supports  
 		<a href="#" id="doThemeRoller">...</a>
 	</span>
diff --git a/js2/mwEmbed/libAddMedia/seqRemoteSearchDriver.js b/js2/mwEmbed/libAddMedia/seqRemoteSearchDriver.js
index 7597d354e5..8563087cd7 100644
--- a/js2/mwEmbed/libAddMedia/seqRemoteSearchDriver.js
+++ b/js2/mwEmbed/libAddMedia/seqRemoteSearchDriver.js
@@ -89,7 +89,7 @@ seqRemoteSearchDriver.prototype = {
 	},
 	insertResource:function(rObj){
 		var _this = this;
-		js_log("SEQ insert resource after:" + _this.sequence_add_target );
+		js_log("SEQ insert resource after:" + _this.sequence_add_target  + ' of type: ' + rObj.mime);
 		if(_this.sequence_add_target ){
 			var tClip = _this.pSeq.getClipFromSeqID( _this.sequence_add_target );		
 			var target_order = false;
@@ -102,26 +102,25 @@ seqRemoteSearchDriver.prototype = {
 		var cat = rObj;			
 		//check for target insert path
 		this.checkImportResource( rObj, function(){	
-														
+										
 			var clipConfig = {					
 				'type' 	 : rObj.mime,
 				'uri' 	 : _this.cFileNS + ':' + rObj.target_resource_title,				
 				'title'	 : rObj.title								
 			};																
-			//set via local properites if avaliable
+			//set via local properites if avaliable			
 			clipConfig['src'] = (rObj.local_src) ? rObj.local_src : rObj.src;
-			clipConfig['poster'] = (rObj.local_poster) ? rObj.local_poster : rObj.poster;
+			clipConfig['poster'] = ( rObj.local_poster ) ? rObj.local_poster : rObj.poster;
 			
 			if(rObj.start_time && rObj.end_time){
 				clipConfig['dur'] = npt2seconds( rObj.end_time ) - npt2seconds( rObj.start_time );
 			}else{
-				//provide a default duration 
+				//provide a default duration if none set 
 				clipConfig['dur'] = 4;
-			}
-			
+			}			
 			
 			//create the media element (target order+1 (since we insert (after) 		
-			_this.pSeq.plObj.tryAddMediaObj(clipConfig, target_order+1 );		
+			_this.pSeq.plObj.tryAddMediaObj( clipConfig, (parseInt(target_order) + 1) );		
 			//refresh the timeline: 
 			_this.pSeq.do_refresh_timeline();
 			js_log("run close all: ");						
diff --git a/js2/mwEmbed/libEmbedVideo/embedVideo.js b/js2/mwEmbed/libEmbedVideo/embedVideo.js
index 3fdb0e0cc8..bd9e9a358d 100644
--- a/js2/mwEmbed/libEmbedVideo/embedVideo.js
+++ b/js2/mwEmbed/libEmbedVideo/embedVideo.js
@@ -284,13 +284,15 @@ var ctrlBuilder = {
 		//make pointer to the embedObj
 		this.embedObj =embedObj;
 		var _this = this;		
-		$j.each( embedObj.supports, function( i, sup ){
+		for(var i in embedObj.supports){			
 			_this.supports[i] = embedObj.supports[i];
-		});
+		};
 					
 		//special case vars: 
-		if( ( embedObj.roe || embedObj.media_element.timedTextSources() )  
-				&& embedObj.show_meta_link  )
+		if( ( embedObj.roe || 
+				(embedObj.media_element.timedTextSources && 
+				embedObj.media_element.timedTextSources() ) 
+			)  && embedObj.show_meta_link  )
 			this.supports['closed_captions']=true;   
 		
 			
@@ -464,7 +466,7 @@ var ctrlBuilder = {
 			function(){			
 				$j('#vol_container_' + embedObj.id).addClass('vol_container_top');
 				//set to "below" if playing and embedType != native
-				if(embedObj && embedObj.isPlaying() && !embedObj.supports['overlays']){
+				if(embedObj && embedObj.isPlaying && embedObj.isPlaying() && !embedObj.supports['overlays']){
 					$j('#vol_container_' + embedObj.id).removeClass('vol_container_top').addClass('vol_container_below');
 				}
 				
@@ -1314,8 +1316,7 @@ embedVideo.prototype = {
 		return true;	
 	},
 	getTimeReq:function(){
-		//js_log('f:getTimeReq:'+ this.getDurationNTP());
-		var default_time_req = '0:00:00/' + this.getDurationNTP() ;
+		var default_time_req = '0:00:00/' + seconds2npt(this.getDuration());
 		if(!this.media_element)
 			return default_time_req;
 		if(!this.media_element.selected_source)
@@ -1339,10 +1340,6 @@ embedVideo.prototype = {
 			this.end_ntp = seconds2npt( this.duration );		
 		//return the duration
 		return this.duration;
-	},
-	  /* get the duration in ntp format */
-	getDurationNTP:function(){
-		return seconds2npt(this.getDuration());
 	},
 	/*
 	 * wrapEmebedContainer
@@ -1654,7 +1651,7 @@ embedVideo.prototype = {
 	},	
 	getHTML : function (){		
 		//@@todo check if we have sources avaliable	
-		js_log('f:getHTML : ' + this.id );			
+		js_log('embedVideo:getHTML : ' + this.id );			
 		var _this = this;				 
 		var html_code = '';		
 		html_code = '<div id="videoPlayer_'+this.id+'" style="width:'+this.width+'px;" class="videoPlayer">';		
@@ -1811,7 +1808,8 @@ embedVideo.prototype = {
 		download, and embed code.
 	*/
 	getThumbnailHTML : function ()
-	{
+	{		
+		js_log('embedVideo:getThumbnailHTML::' + this.id);
 		var thumb_html = '';
 		var class_atr='';
 		var style_atr='';
@@ -2387,11 +2385,13 @@ embedVideo.prototype = {
 		//do head request if on the same domain
 		return this.media_element.selected_source.URLTimeEncoding;
 	},
-	setSliderValue: function(perc, hide_progress){
+	setSliderValue: function(perc, hide_progress){		
 		if(this.controls){		
 			var this_id = (this.pc)?this.pc.pp.id:this.id;
 			var val = parseInt( perc*1000 ); 
 			$j('#mv_play_head_'+this_id).slider('value', val);
+			
+			js_log("embed video set: " + '#mv_play_head_'+this_id + ' to ' + val);
 		}
 		//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) );
 		//js_log('op:' + offset_perc + ' *('+perc+' * ' + $j('#slider_'+id).width() + ')');
@@ -2558,6 +2558,8 @@ mediaPlayers.prototype =
 		
 		this.default_players['text/html'] = ['html'];
 		this.default_players['image/jpeg'] = ['html'];
+		this.default_players['image/png'] = ['html'];
+		this.default_players['image/svg'] = ['html'];
 		
 	},
 	addPlayer : function(player, mime_type)
@@ -2606,8 +2608,8 @@ mediaPlayers.prototype =
 	},
 	defaultPlayer : function(mime_type)
 	{				
-		js_log("f:defaultPlayer: " + mime_type);
-		var mime_players = this.getMIMETypePlayers(mime_type);		
+		js_log("get defaultPlayer for " + mime_type);		
+		var mime_players = this.getMIMETypePlayers(mime_type);				
 		if( mime_players.length > 0)
 		{
 			// check for prior preference for this mime type
diff --git a/js2/mwEmbed/libEmbedVideo/htmlEmbed.js b/js2/mwEmbed/libEmbedVideo/htmlEmbed.js
index 70d1af8b2b..cc654d650d 100644
--- a/js2/mwEmbed/libEmbedVideo/htmlEmbed.js
+++ b/js2/mwEmbed/libEmbedVideo/htmlEmbed.js
@@ -130,20 +130,24 @@ var htmlEmbed ={
 	getEmbedHTML:function(){
 		js_log('f:html:getEmbedHTML: ' + this.id);
 		//set up the css for our parent div:		 
-		$j(this).css({'width':this.pc.pp.width, 'height':this.pc.pp.height, 'overflow':"hidden"});
+		$j(this).css({
+			'width':this.pc.pp.width, 
+			'height':this.pc.pp.height, 
+			'overflow':"hidden"
+		});
 		//@@todo support more smil animation layout stuff: 
 		
 		//wrap output in videoPlayer_ div:
 		$j(this).html('<div id="videoPlayer_'+ this.id+'">'+this.getThumbnailHTML()+'</div>');
-	},
-	getThumbnailHTML:function( opt ){
+	},	
+	getThumbnailHTML:function( opt ){				
 		var out='';
 		if(!opt)
 			opt = {};			
 		var height = (opt.height)?opt.height:this.pc.pp.height;
 		var width = (opt.width)?opt.width: this.pc.pp.width;	
 		js_log('1req '+ opt.height + ' but got: ' + height);	
-		if( this.pc.type =='image/jpeg'){
+		if( this.pc.type =='image/jpeg' ||  this.pc.type == 'image/png' ){
 			js_log('should put src: '+this.pc.src);
 			out = '<img style="width:'+width+'px;height:'+height+'px" src="'+this.pc.src+'">';
 		}else{
@@ -153,12 +157,12 @@ var htmlEmbed ={
 		return out;
 	},
 	doThumbnailHTML:function(){
-		js_log('f:htmlEmbed:doThumbnailHTML');
+		js_log('htmlEmbed:doThumbnailHTML()');
 		this.getEmbedHTML();
 	},
 	/* since its just html display get the "embed" right away */
 	getHTML:function(){
-		js_log('getHTML: htmlEmbed');
+		js_log('htmlEmbed::getHTML() ' + this.id);
 		this.getEmbedHTML();
 	},
 	getDuration:function(){
diff --git a/js2/mwEmbed/libSequencer/mvPlayList.js b/js2/mwEmbed/libSequencer/mvPlayList.js
index 4c1d8fcd42..cb5ca8cbd3 100644
--- a/js2/mwEmbed/libSequencer/mvPlayList.js
+++ b/js2/mwEmbed/libSequencer/mvPlayList.js
@@ -33,7 +33,10 @@ if(typeof wgServer=='undefined'){
 }else{
 	var defaultMetaDataProvider = wgServer + wgScript + '?title=Special:MvExportStream&feed_format=roe&stream_name=';
 }
-
+/*
+ * The playlist Object implements ~most~ of embedVideo but we don't inherit (other than to use the control builder)  
+ * because pretty much every function has to be changed for the playlist context
+ */
 var mvPlayList = function(element) {		
 	return this.init(element);
 };
@@ -69,6 +72,17 @@ mvPlayList.prototype = {
 		title_bar_height:17,
 		control_height:29
 	},
+	//embed object type support system; 
+	supports: {
+		'play_head':true, 
+		'pause':true,		 
+		'fullscreen':false, 
+		'time_display':true, 
+		'volume_control':true,
+		
+		'overlays':true,
+		'playlist_swap_loader':true //if the object supports playlist functions		
+  	},
 	init : function(element){
 		js_log('mvPlayList:init:');		
 		this.tracks={};		
@@ -80,7 +94,7 @@ mvPlayList.prototype = {
 		this.default_track = this.tracks[0];				
 		
 		//get all the attributes:
-		  for(var attr in mv_default_playlist_attributes){	   
+		 for(var attr in mv_default_playlist_attributes){	   
 			if( element.getAttribute(attr) ){
 				this[attr]=element.getAttribute(attr);
 				//js_log('attr:' + attr + ' val: ' + video_attributes[attr] +" "+'elm_val:' + element.getAttribute(attr) + "\n (set by elm)");  
@@ -230,8 +244,11 @@ mvPlayList.prototype = {
 			this.doWhenClipLoadDone();
 		}else{
 			js_log("only "+ _this.clip_ready_count +" clips done, scheduling callback:");
+			var doParseDoneCheck = function(){				
+				_this.doWhenParseDone();
+			}
 			if( !mvJsLoader.load_error )	//re-issue request if no load error:
-				setTimeout('document.getElementById(\''+this.id+'\').doWhenParseDone()', 250);
+				setTimeout(doParseDoneCheck, 100);
 		}								
 	},
 	doWhenClipLoadDone:function(){		
@@ -264,6 +281,10 @@ mvPlayList.prototype = {
 		//js_log("return dur: " + this.pl_duration);
 		return this.pl_duration;
 	},
+	getTimeReq:function(){
+		//playlist does not really support time request atm ( in theory in the future we could embed playlists with temporal urls)
+		return '0:0:0/' +  seconds2npt( this.getDuration() ); 
+	},
 	getDataSource:function(){	
 		js_log("f:getDataSource "+ this.src);
 		//determine the type / first is it m3u or xml?	 
@@ -518,13 +539,11 @@ mvPlayList.prototype = {
 	setStatus:function(value){
 		$j('#mv_time_'+this.id).html( value );
 	},
-	setSliderValue:function(value){
+	setSliderValue:function(value){		
 		if( this.controls ){
-			if(this.cur_clip.embed){
-				//js_log('calling original embed slider with val: '+value);
-				this.cur_clip.embed.pe_setSliderValue( value );
-				//call seq playline update here
-			}
+			//slider is on 1000 scale: 
+			var val = parseInt( value *1000 ); 			
+			$j('#mv_play_head_' + this.id).slider('value', val);
 		}
 	},	
 	getPlayHeadPos: function(prec_done){
@@ -718,7 +737,7 @@ mvPlayList.prototype = {
 			//play cur_clip			
 			this.cur_clip.embed.play();		
 		}		
-		//start up the playlist monitor	
+		//start up the playlist monitor			
 		this.monitor();		
 	},
 	/*
@@ -742,6 +761,25 @@ mvPlayList.prototype = {
 			clip.embed.pause();		
 		});
 	},
+	//@@todo mute across all child clips: 
+	toggleMute:function(){
+		var this_id = (this.pc!=null)?this.pc.pp.id:this.id;	
+		if(this.muted){
+			this.muted=false;
+			$j('#volume_control_'+this_id + ' span').removeClass('ui-icon-volume-off').addClass('ui-icon-volume-on');
+			$j('#volume_bar_'+this_id).slider('value', 100); 
+			this.updateVolumen(1);
+		}else{
+			this.muted=true;
+			$j('#volume_control_'+this_id + ' span').removeClass('ui-icon-volume-on').addClass('ui-icon-volume-off');
+			$j('#volume_bar_'+this_id).slider('value', 0);
+			this.updateVolumen(0); 
+		}
+		js_log('f:toggleMute::' + this.muted);		
+	},
+	updateVolumen:function(perc){
+		js_log('update volume not supported with current playback type');
+	},
 	fullscreen:function(){
 		this.cur_clip.embed.fullscreen();
 	},
@@ -785,11 +823,15 @@ mvPlayList.prototype = {
 			this.cur_clip = this.start_clip;		
 			//display the first clip thumb: 
 			this.cur_clip.embed.stop();
-			//make sure the current clip is vissable:
+			//hide other clips:
+			$j('#'+this.id+' .clip_container').hide();
+			//show the first/current clip:
 			$j('#clipDesc_'+this.cur_clip.id).show();
 		}
 		//reset the currentTime: 
 		this.currentTime = 0;
+		//rest the sldier
+		this.setSliderValue( 0 );
 		//FIXME still some issues with "stoping" and reseting the playlist	
 	},	
 	doSeek:function(v){
@@ -849,9 +891,8 @@ mvPlayList.prototype = {
 	//gets playlist controls large control height for sporting 
 	//next prev button and more status display
 	getControlsHTML:function(){
-		//get controls from current clip  (add some playlist specific controls:		  
-		this.cur_clip.embed.supports['prev_next']=true;		
-		return ctrlBuilder.getControls(this.cur_clip.embed);
+		//get controls from current clip  (add some playlist specific controls:		  			
+		return ctrlBuilder.getControls( this );
 	},	
 	//ads colors/dividers between tracks
 	colorPlayHead: function(){
@@ -874,7 +915,7 @@ mvPlayList.prototype = {
 			//(use getSoloDuration to not include transitions and such)	 
 			var perc = ( clip.getSoloDuration() / pl_duration );
 			var pwidth = Math.round( perc * _this.track_len);
-			js_log('pstatus:c:'+ clip.getDuration() + ' of '+ pl_duration+' %:' + perc + ' width: '+ pwidth + ' of total: ' + _this.track_len);
+			//js_log('pstatus:c:'+ clip.getDuration() + ' of '+ pl_duration+' %:' + perc + ' width: '+ pwidth + ' of total: ' + _this.track_len);
 			//var pwidth = Math.round( perc  * _this.track_len - (_this.mv_seeker_width*perc) );
 			
 			//add the buffer child indicator:						 
@@ -1002,6 +1043,22 @@ mvPlayList.prototype = {
 			clearInterval( this.default_track.clips[ clip_inx ].timerId );
 		else
 			this.default_track.clips[ clip_inx ][ trans_type ].run_transition();		
+	},
+	playerPixelWidth : function()
+	{
+		var player = $j('#mv_embedded_player_'+this.id).get(0);
+		if(typeof player!='undefined' && player['offsetWidth'])
+			return player.offsetWidth;
+		else
+			return parseInt(this.width);
+	},
+	playerPixelHeight : function()
+	{
+		var player = $j('#mv_embedded_player_'+this.id).get(0);
+		if(typeof player!='undefined' && player['offsetHeight'])
+			return player.offsetHeight;
+		else
+			return parseInt(this.height);
 	}
 }
 
@@ -1140,7 +1197,7 @@ mvClip.prototype = {
 			'<div id="pl_desc_txt_'+this.id+'" class="pl_desc" style="position:absolute;left:'+(tw+2)+'px;width:'+twDesc+'px;height:'+th+'px;overflow:auto;">'+
 					'<b>'+this.title+'</b><br>'+			
 					this.desc + '<br>' + 
-					'<b>clip length:</b> '+ this.embed.getDurationNTP()+ 
+					'<b>clip length:</b> '+ seconds2npt( this.embed.getDuration() ); 
 			'</div>');		
 		}
 	},*/
@@ -1279,7 +1336,7 @@ PlMvEmbed.prototype = {
 		//status updates handled by playlist obj
 	},
 	setSliderValue:function(value){
-		//setSlider value handled by playlist obj		
+		//setSlider value handled by playlist obj	
 	}	
 }
 
@@ -1437,21 +1494,12 @@ mvPlayList.prototype.monitor = function(){
 	
 	//update the playlist current time: 
 	//check for a trsnOut from the previus clip to subtract
-	/*var prev_clip =  this.getPrevClip();
-	var transOffset = 0;
-	if( prev_clip.id != this.cur_clip.id ){
-		if( prev_clip.transOut ){
-			transOffset = prev_clip.transOut.getDuration();
-			js_log("should add: " + transOffset + " off:" + this.cur_clip.dur_offset+  " to " +this.cur_clip.embed.currentTime +
-				 ' = ' + ( this.cur_clip.dur_offset + this.cur_clip.embed.currentTime + transOffset) );
-		}
-	}*/
 	this.currentTime = this.cur_clip.dur_offset + this.cur_clip.embed.relativeCurrentTime();	
 		
 	//update slider: 
 	if(!this.userSlide){
-		this.setStatus(seconds2npt(this.currentTime) + '/' + seconds2npt(this.getDuration()) );				
-		this.setSliderValue(this.currentTime / this.getDuration());
+		this.setStatus(seconds2npt(this.currentTime) + '/' + seconds2npt(this.getDuration()) );					
+		this.setSliderValue( this.currentTime / this.getDuration() );
 	}
 	//pre-load any future clips:
 	this.loadFutureClips();
@@ -2032,7 +2080,7 @@ mvSMILClip.prototype = {
 		if(this.transOut)
 			fulldur -= this.transOut.getDuration();
 
-		js_log("getSoloDuration:: td: " + this.getDuration() + ' sd:' + fulldur);
+		//js_log("getSoloDuration:: td: " + this.getDuration() + ' sd:' + fulldur);
 		return fulldur;
 	}
 }
-- 
2.20.1

