r36440 MediaWiki - Code Review archive

Repository:	MediaWiki
Revision:	< r36439‎ \| r36440 \| r36441 >
Date:	05:02, 19 June 2008
Author:	stipe
Status:	old
Tags:
Comment:	adding initial mv_embed SOC changes - experimenting with support for multiple stream types
Modified paths:	/branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/mv_embed.js (modified) (history) /branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/mv_flashEmbed.js (modified) (history) /branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/mv_javaEmbed.js (modified) (history) /branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/sample_page.php (modified) (history)

Diff [purge]

Index: branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/mv_embed.js
—	—	@@ -1,4 +1,4 @@
2		-/*
	2	+/** @fileoverview
3	3	* ~mv_embed~
4	4	* for details see: http://metavid.ucsc.edu/wiki/index.php/Mv_embed
5	5	*
—	—	@@ -75,8 +75,7 @@
76	76	}
77	77	}
78	78
79		-/*
80		~~-* the base video control JSON object with default attributes~~
	79	+/** the base video control JSON object with default attributes
81	80	* for supported attribute details see README
82	81	*/
83	82	var video_attributes = {
—	—	@@ -98,7 +97,7 @@
99	98	//roe url (for xml based metadata)
100	99	"roe":null,
101	100	//if roe includes metadata tracks we can expose a link to metadata
102		~~- "show_meta_link":true,~~
	101	+// "show_meta_link":true,
103	102
104	103	//default state attributes per html5 spec:
105	104	//http://www.whatwg.org/specs/web-apps/current-work/#video)
—	—	@@ -149,7 +148,7 @@
150	149	mvEmbed.libs_loaded=true;
151	150	mvEmbed.init();
152	151	});
153		~~- });~~
	152	+ });
154	153	},
155	154	userSetPlayerType:function(player){
156	155	//callback to the embedType obj to set the cookie/pref:
—	—	@@ -160,7 +159,7 @@
161	160	});
162	161	//@@todo temporarily disable playback or set all to loading...
163	162	//request the new player library:
164		~~- var plugins={};~~
	163	+/* var plugins={};
165	164	plugins[embedTypes.getPlayerLib()+'Embed']='mv_'+embedTypes.getPlayerLib()+'Embed.js';
166	165	mvJsLoader.doLoad(plugins, function(){
167	166	js_log("done loading: " + embedTypes.getPlayerLib());
—	—	@@ -169,7 +168,7 @@
170	169	js_log('selector: '+'#'+global_ogg_list[i]);
171	170	$j('#'+global_ogg_list[i]).get(0).inheritEmbedObj();
172	171	}
173		~~- })~~
	172	+ })*/
174	173	},
175	174	addLoadEvent:function(fn){
176	175	this.flist.push(fn);
—	—	@@ -186,6 +185,146 @@
187	186	}
188	187	}
189	188
	189	+function mediaPlayer(id, supported_types, library)
	190	+{
	191	+ this.id=id;
	192	+ this.supported_types = supported_types;
	193	+ this.library = library;
	194	+ return this;
	195	+}
	196	+
	197	+mediaPlayer.prototype =
	198	+{
	199	+ id:null,
	200	+ supported_types:null,
	201	+ library:null,
	202	+
	203	+ supportsMIMEType : function(type)
	204	+ {
	205	+ for (var i in this.supported_types)
	206	+ if(this.supported_types[i] == type)
	207	+ return true;
	208	+ return false;
	209	+ },
	210	+ getName : function()
	211	+ {
	212	+ return getMsg('ogg-player-' + this.id);
	213	+ },
	214	+ getLibraryFile : function()
	215	+ {
	216	+ return 'mv_'+this.library+'Embed.js';
	217	+ },
	218	+ getLibraryObject : function()
	219	+ {
	220	+ return this.library+'Embed';
	221	+ }
	222	+}
	223	+
	224	+var flowPlayer = new mediaPlayer(
	225	+ 'flowplayer',
	226	+ ['video/x-flv'],
	227	+ 'flash'
	228	+);
	229	+
	230	+var cortadoPlayer = new mediaPlayer(
	231	+ 'cortado',
	232	+ ['video/ogg'],
	233	+ 'java'
	234	+);
	235	+
	236	+var videoElementPlayer = new mediaPlayer(
	237	+ 'videoElement',
	238	+ ['video/ogg'],
	239	+ 'native'
	240	+);
	241	+
	242	+var vlcMozillaPlayer = new mediaPlayer(
	243	+ 'vlc-mozilla',
	244	+ ['video/ogg'],
	245	+ 'vlc'
	246	+);
	247	+
	248	+var vlcActiveXPlayer = new mediaPlayer(
	249	+ 'vlc-activex',
	250	+ ['video/ogg'],
	251	+ 'vlc'
	252	+);
	253	+
	254	+var oggPlayPlayer = new mediaPlayer(
	255	+ 'oggPlay',
	256	+ ['video/ogg'],
	257	+ 'oggplay'
	258	+);
	259	+
	260	+var oggPluginPlayer = new mediaPlayer(
	261	+ 'oggPlugin',
	262	+ ['video/ogg'],
	263	+ 'generic'
	264	+);
	265	+
	266	+var quicktimeMozillaPlayer = new mediaPlayer(
	267	+ 'quicktime-mozilla',
	268	+ ['video/ogg'],
	269	+ 'quicktime'
	270	+);
	271	+
	272	+var quicktimeActiveXPlayer = new mediaPlayer(
	273	+ 'quicktime-activex',
	274	+ ['video/ogg'],
	275	+ 'quicktime'
	276	+);
	277	+
	278	+function mediaPlayers()
	279	+{
	280	+ this.players = new Array();
	281	+}
	282	+
	283	+mediaPlayers.prototype =
	284	+{
	285	+ players : null,
	286	+ selected_player : null,
	287	+
	288	+ addPlayer : function(player)
	289	+ {
	290	+ for (var i in this.players)
	291	+ if (this.players[i].id==player.id)
	292	+ return;
	293	+ js_log('Adding ' + player.id);
	294	+ this.players.push(player);
	295	+ },
	296	+ getMIMETypePlayers : function(mime_type)
	297	+ {
	298	+ var mime_players = new Array();
	299	+
	300	+ for (var i in this.players)
	301	+ if (this.players[i].supportsMIMEType(mime_type))
	302	+ mime_players.push(this.players[i]);
	303	+
	304	+ return mime_players;
	305	+ },
	306	+ autoSelectPlayer : function(mime_type)
	307	+ {
	308	+ js_log('autoselecting player for ' + mime_type);
	309	+ var mime_players = this.getMIMETypePlayers(mime_type);
	310	+ if(mime_players.length)
	311	+ {
	312	+ this.selected_player = mime_players[0];
	313	+ js_log('selected ' + this.selected_player.getName());
	314	+ }
	315	+ else
	316	+ js_log('no player found');
	317	+ },
	318	+ selectPlayer : function(player_id)
	319	+ {
	320	+ for(var i in this.players)
	321	+ if(this.players[i].id == player_id)
	322	+ {
	323	+ this.selected_player = this.players[i];
	324	+ break;
	325	+ }
	326	+ }
	327	+};
	328	+
190	329	/parseUri class:/
191	330	var parseUri=function(d){var o=parseUri.options,value=o.parser[o.strictMode?"strict":"loose"].exec(d);for(var i=0,uri={};i<14;i++){uri[o.key[i]]=value[i]\|\|""}uri[o.q.name]={};uri[o.key[12]].replace(o.q.parser,function(a,b,c){if(b)uri[o.q.name][b]=c});return uri};parseUri.options={strictMode:false,key:["source","protocol","authority","userInfo","user","password","host","port","relative","path","directory","file","query","anchor"],q:{name:"queryKey",parser:/(?:^\|&)([^&=])=?([^&])/g},parser:{strict:/^(?:([^:\/?#]+):)?(?:\/\/((?:(([^:@]):?([^:@]))?@)?([^:\/?#])(?::(\d))?))?((((?:[^?#\/]\/))([^?#]))(?:\?([^#]))?(?:#(.))?)/,loose:/^(?:(?![^:@]+:[^:@\/]@)([^:\/?#.]+):)?(?:\/\/)?((?:(([^:@]):?([^:@]))?@)?([^:\/?#])(?::(\d))?)(((\/(?:[^?#](?![^?#\/]\.[^?#\/.]+(?:[?#]\|$)))\/?)?([^?#\/]))(?:\?([^#]))?(?:#(.*))?)/}};
192	331
—	—	@@ -202,15 +341,13 @@
203	342	* http://svn.wikimedia.org/viewvc/mediawiki/trunk/extensions/OggHandler/OggPlayer.js
204	343	*/
205	344	var embedTypes = {
206		~~- // List of players in order of preference~~
207		~~- playerType:false,~~
208		~~- // List of players in order of preference (vlc is pretty good on linux (but should not be installed in OSX)~~
209		~~- players: ['videoElement','vlc-mozilla', 'vlc-activex', 'oggPlay', 'cortado', 'oggPlugin', 'quicktime-mozilla', 'quicktime-activex', 'flowplayer'],~~
	345	+ // List of players
	346	+ players: null,
210	347	init: function(){
211	348	//detect supported types
212	349	this.detect();
213	350	//see if we have a cookie set to a clientSupported type:
214		~~- var cookieVal = this.getCookie( 'ogg_player' );~~
	351	+/* var cookieVal = this.getCookie( 'ogg_player' );
215	352	if ( cookieVal && cookieVal != 'thumbnail' ) {
216	353	if(this.clientSupports[cookieVal]){
217	354	this.playerType = cookieVal;
—	—	@@ -223,8 +360,8 @@
224	361	break;
225	362	}
226	363	}
227		~~- }~~
228		~~- js_log('selected:' + this.playerType);~~
	364	+ }*/
	365	+/* js_log('selected:' + this.playerType);
229	366	js_log( this.clientSupports);
230	367
231	368	//add the detected plugin playback type to the plugins :
—	—	@@ -234,57 +371,31 @@
235	372	mvEmbed.lib_plugins[this.getPlayerLib()+'Embed']='mv_'+this.getPlayerLib()+'Embed.js';
236	373	}
237	374	js_log('set lib: ' +mvEmbed.lib_plugins[this.getPlayerLib()+'Embed']);
238		~~- }~~
	375	+ }*/
	376	+ // set to load all the supported libraries
	377	+ for (var i in this.players.players)
	378	+ mvEmbed.lib_plugins[this.players.players[i].getLibraryObject()]=this.players.players[i].getLibraryFile();
239	379	},
240		~~- getPlayerType:function(){~~
241		~~- if(!this.playerType)return false;~~
242		~~- return this.playerType;~~
243		~~- },~~
244		~~- //provide the name of the javscript library supporting the given request: (group activeX and plugin Controls)~~
245		~~- getPlayerLib:function(){~~
246		~~- switch(this.playerType){~~
247		~~- case 'videoElement':~~
248		~~- return 'native';break;~~
249		~~- case 'vlc-mozilla':~~
250		~~- case 'vlc-activex':~~
251		~~- return 'vlc';break;~~
252		~~- case 'quicktime-mozilla':~~
253		~~- case 'quicktime-activex':~~
254		~~- return 'quicktime'; break;~~
255		~~- case 'oggPlay':~~
256		~~- return 'oggplay'; break;~~
257		~~- case 'cortado':~~
258		~~- return 'java';break;~~
259		~~- case 'flowplayer':~~
260		~~- return 'flash';~~
261		~~- case 'oggPlugin':~~
262		~~- return 'generic'; break;~~
263		~~- default:~~
264		~~- return null;~~
265		~~- }~~
266		~~- },~~
267		~~- getPlayerSelectList:function(){~~
	380	+ getPlayerSelectList:function(mime_type, file_select_code){
	381	+ var supporting_players = this.players.getMIMETypePlayers(mime_type);
	382	+
268	383	var select_html='<ul style="color:white">';
269		~~- for(i in this.players){~~
270		~~- //don't list unsuported players~~
271		~~- if(!this.clientSupports[this.players[i]]){~~
272		~~- continue;~~
273		~~- }~~
274		~~- //list if its the current put a colored plugin icon than name~~
	384	+ for(i in supporting_players){
	385	+/* //list if its the current put a colored plugin icon than name
275	386	if(this.playerType==this.players[i]){
276	387	select_html+='<li>'+
277	388	'<img width="16" height="16" src="'+mv_embed_path+'images/plugin.png">'+
278	389	getMsg('ogg-player-'+this.players[i])+getMsg('ogg-player-selected')+
279	390	'</li>';
280		~~- }else{~~
	391	+ }else{*/
281	392	//else gray plugin and the plugin with link to select
282	393	select_html+='<li>'+
283		~~- '<a style="color:white" href="#" onClick="mvEmbed.userSetPlayerType(\''+this.players[i]+'\');return false;">'+~~
	394	+ '<a style="color:white" href="#" onClick="'+ file_select_code + 'mvEmbed.userSetPlayerType(\''+supporting_players[i].id+'\');return false;">'+
284	395	'<img border="0" width="16" height="16" src="'+mv_embed_path+'images/plugin_disabled.png">'+
285		~~- getMsg('ogg-player-'+this.players[i]) +~~
	396	+ supporting_players[i].getName() +
286	397	'</a>'+
287	398	'</li>';
288		~~- }~~
	399	+// }
289	400	}
290	401	select_html+='</ul>';
291	402	return select_html;
—	—	@@ -294,11 +405,13 @@
295	406	var week = 7864001000;
296	407	this.setCookie( 'ogg_player', player, week, false, false, false, false );
297	408	}
298		~~- this.playerType=player;~~
	409	+ this.players.selectPlayer(player);
299	410	js_log('embedTypes: player set to: '+ player);
300	411	},
301	412	clientSupports: { 'thumbnail' : true },
302	413	detect: function() {
	414	+ this.players = new mediaPlayers();
	415	+
303	416	// First some browser detection
304	417	this.msie = ( navigator.appName == "Microsoft Internet Explorer" );
305	418	this.msie6 = ( navigator.userAgent.indexOf("MSIE 6")===false);
—	—	@@ -314,34 +427,27 @@
315	428	var uniqueMimesOnly = this.opera \|\| this.safari;
316	429	// Opera will switch off javaEnabled in preferences if java can't be found.
317	430	// And it doesn't register an application/x-java-applet mime type like Mozilla does.
318		~~- if ( invisibleJava && javaEnabled ) {~~
319		~~- this.clientSupports['cortado'] = true;~~
320		~~- }~~
	431	+ if ( invisibleJava && javaEnabled )
	432	+ this.players.addPlayer(cortadoPlayer);
	433	+
321	434	// ActiveX plugins
322	435	if(this.msie){
323	436	// VLC
324		~~- if ( this.testActiveX( 'VideoLAN.VLCPlugin.2' ) ) {~~
325		~~- this.clientSupports['vlc-activex'] = true;~~
326		~~- }~~
	437	+ if ( this.testActiveX( 'VideoLAN.VLCPlugin.2' ) )
	438	+ this.players.addPlayer(vlcActiveXPlayer);
327	439	// Java
328		~~- if ( javaEnabled && this.testActiveX( 'JavaWebStart.isInstalled' ) ) {~~
329		~~- this.clientSupports['cortado'] = true;~~
330		~~- }~~
	440	+ if ( javaEnabled && this.testActiveX( 'JavaWebStart.isInstalled' ) )
	441	+ this.players.addPlayer(cortadoPlayer);
331	442	//temporary disable QuickTime check
332		~~- if ( this.testActiveX( 'QuickTimeCheckObject.QuickTimeCheck.1' ) ) {~~
333		~~- this.clientSupports['quicktime-activex'] = true;~~
334		~~- }~~
	443	+ if ( this.testActiveX( 'QuickTimeCheckObject.QuickTimeCheck.1' ) )
	444	+ this.players.addPlayer(quicktimeActiveXPlayer);
335	445	}
	446	+
336	447	// <video> element (should not need to be attached to the dom to test)(
337	448	var v = document.createElement("video");
338		~~- if(v.play){~~
339		~~- this.clientSupports['videoElement'] = true;~~
340		~~- }~~
341		~~- /*elt.innerHTML = '<video id="testvideo"></video>\n';~~
342		~~- var testvideo = document.getElementById('testvideo');~~
343		~~- if (testvideo && testvideo.play) {~~
344		~~- this.clientSupports['videoElement'] = true;~~
345		~~- }*/~~
	449	+ if(v.play)
	450	+ this.players.addPlayer(videoElementPlayer);
	451	+
346	452	// Mozilla plugins
347	453	if(navigator.mimeTypes && navigator.mimeTypes.length > 0) {
348	454	for ( var i = 0; i < navigator.mimeTypes.length; i++) {
—	—	@@ -357,38 +463,41 @@
358	464	pluginName = '';
359	465	}
360	466	if ( javaEnabled && type == 'application/x-java-applet' ) {
361		~~- this.clientSupports['cortado'] = true;~~
	467	+ this.players.addPlayer(cortadoPlayer);
362	468	continue;
363	469	}
364	470	if(type=='application/liboggplay'){
365		~~- this.clientSupports['oggPlay']= true;~~
	471	+ this.players.addPlayer(oggPlayPlayer);
366	472	continue;
367	473	}
368	474
369	475	if ( type == 'application/ogg' ) {
370		~~- if ( pluginName.toLowerCase() == 'vlc multimedia plugin' ) {~~
371		~~- this.clientSupports['vlc-mozilla'] = true;~~
372		~~- } else if ( pluginName.indexOf( 'QuickTime' ) > -1 ) {~~
373		~~- this.clientSupports['quicktime-mozilla'] = true;~~
374		~~- } else {~~
375		~~- this.clientSupports['oggPlugin'] = true;~~
376		~~- }~~
	476	+ if ( pluginName.toLowerCase() == 'vlc multimedia plugin' )
	477	+ this.players.addPlayer(vlcMozillaPlayer);
	478	+ else if ( pluginName.indexOf( 'QuickTime' ) > -1 )
	479	+ this.players.addPlayer(quicktimeMozillaPlayer);
	480	+ else
	481	+ this.players.addPlayer(oggPluginPlayer);
377	482	continue;
378	483	} else if ( uniqueMimesOnly ) {
379	484	if ( type == 'application/x-vlc-player' ) {
380		~~- this.clientSupports['vlc-mozilla'] = true;~~
	485	+ this.players.addPlayer(vlcMozillaPlayer);
381	486	continue;
382	487	} else if ( type == 'video/quicktime' ) {
383		~~- this.clientSupports['quicktime-mozilla'] = true;~~
	488	+ this.players.addPlayer(quicktimeMozillaPlayer);
384	489	continue;
385	490	}
386	491	}
387	492
388	493	if ( type == 'video/quicktime' ) {
389		~~- this.clientSupports['quicktime-mozilla'] = true;~~
	494	+ this.players.addPlayer(vlcMozillaPlayer);
390	495	continue;
391	496	}
392	497	if(type=='application/x-shockwave-flash'){
	498	+ this.players.addPlayer(flowPlayer);
	499	+ continue;
	500	+ }
	501	+ if(type=='application/x-shockwave-flash'){
393	502	//@@temporary disabled flash player (not fully functional yet)
394	503	//this.clientSupports['flowplayer']= true;
395	504	continue;
—	—	@@ -396,8 +505,8 @@
397	506	}
398	507	}
399	508	//@@The xiph quicktime component does not work well with annodex streams (temporarly disable)
400		~~- this.clientSupports['quicktime-mozilla'] = false;~~
401		~~- this.clientSupports['quicktime-activex'] = false;~~
	509	+ //this.clientSupports['quicktime-mozilla'] = false;
	510	+ //this.clientSupports['quicktime-activex'] = false;
402	511	//js_log(this.clientSupports);
403	512	},
404	513	setCookie : function ( name, value, expiry, path, domain, secure ) {
—	—	@@ -576,7 +685,7 @@
577	686	//get mv_embed location if it has not been set
578	687	js_log('mv_embed ' + mvEmbed.Version);
579	688	//send a request to load the given type
580		~~- js_log('detected: '+ embedTypes.getPlayerType() );~~
	689	+ //js_log('detected: '+ embedTypes.getPlayerType() );
581	690	video_elements = document.getElementsByTagName("video");
582	691	//js_log('found video '+ video_elements.length);
583	692	if( video_elements.length > 0) {
—	—	@@ -991,11 +1100,277 @@
992	1101	}
993	1102
994	1103
	1104	+/**
	1105	+ * mediaSource class represents a source for a media element.
	1106	+ * @param {String} type MIME type of the source.
	1107	+ * @param {String} uri URI of the source.
	1108	+ * @constructor
	1109	+ */
	1110	+function mediaSource(mime_type, uri, title, marked_default)
	1111	+{
	1112	+ js_log('Adding mediaSource of type ' + mime_type + ' and uri ' + uri + ' and title ' + title);
	1113	+ this.mime_type = mime_type;
	1114	+ this.uri = uri;
	1115	+ this.title = title;
	1116	+ this.marked_default = marked_default;
	1117	+ this.parseURLDuration();
	1118	+ return this;
	1119	+}
	1120	+
	1121	+mediaSource.prototype =
	1122	+{
	1123	+ /** MIME type of the source. */
	1124	+ mime_type:null,
	1125	+ /** URI of the source. */
	1126	+ uri:null,
	1127	+ /** Title of the source. */
	1128	+ title:null,
	1129	+ /** True if the source has been marked as the default. */
	1130	+ marked_default:null,
	1131	+ /** Start offset of the requested segment */
	1132	+ start_offset:null,
	1133	+ /** Duration of the requested segment (null if not known) */
	1134	+ duration:null,
	1135	+
	1136	+ start_ntp:null,
	1137	+ end_ntp:null,
	1138	+
	1139	+
	1140	+ /** MIME type accessor function.
	1141	+ @return the MIME type of the source.
	1142	+ @type String
	1143	+ */
	1144	+ getMIMEType : function()
	1145	+ {
	1146	+ return this.mime_type;
	1147	+ },
	1148	+ /** URI accessor function.
	1149	+ @return the URI of the source.
	1150	+ @type String
	1151	+ */
	1152	+ getURI : function()
	1153	+ {
	1154	+ return this.uri;
	1155	+ },
	1156	+ /** Title accessor function.
	1157	+ @return the title of the source.
	1158	+ @type String
	1159	+ */
	1160	+ getTitle : function()
	1161	+ {
	1162	+ return this.title;
	1163	+ },
	1164	+ /** Index accessor function.
	1165	+ @return the source's index within the enclosing mediaElement container.
	1166	+ @type Integer
	1167	+ */
	1168	+ getIndex : function()
	1169	+ {
	1170	+ return this.index;
	1171	+ },
	1172	+ /*
	1173	+ * function getDuration in milliseconds
	1174	+ * special case derive duration from request url (in float seconds) @@todo should be float seconds
	1175	+ * (for media_url?t=ntp_start/ntp_end url request format
	1176	+ */
	1177	+ parseURLDuration : function(){
	1178	+ //js_log('get duration for:' + this.src);
	1179	+ var index_time_val = false;
	1180	+ if(this.uri.indexOf('?t=')!=-1)index_time_val='?t=';
	1181	+ if(this.uri.indexOf('&t=')!=-1)index_time_val='&t=';
	1182	+ if(index_time_val){
	1183	+ var end_index = (this.uri.indexOf('&', this.uri.indexOf(index_time_val))==-1)?
	1184	+ this.uri.length:
	1185	+ this.uri.indexOf('&', this.uri.indexOf(index_time_val));
	1186	+ this.start_ntp = this.uri.substring(
	1187	+ this.uri.indexOf(index_time_val)+index_time_val.length,
	1188	+ this.uri.indexOf('/', this.uri.indexOf(index_time_val) ));
	1189	+ this.end_ntp = this.uri.substring(
	1190	+ this.uri.indexOf('/', this.uri.indexOf(index_time_val))+1, end_index);
	1191	+ this.start_offset = ntp2seconds(this.start_ntp);
	1192	+ this.duration = ntp2seconds( this.end_ntp ) - this.start_offset;
	1193	+ //put values into ms:
	1194	+ this.start_offset = this.start_offset*1000
	1195	+ this.duration = this.duration*1000;
	1196	+ }else{
	1197	+ //else normal media request (can't predict the duration without the plugin reading it)
	1198	+ this.duration=null;
	1199	+ this.start_offset=0;
	1200	+ }
	1201	+ },
	1202	+ /* get the duration in ntp format */
	1203	+ getDurationNTP:function(){
	1204	+ return seconds2ntp(this.getDuration()/1000);
	1205	+ },
	1206	+
	1207	+};
	1208	+
	1209	+/** A media element corresponding to a <video> element.
	1210	+ It is implemented as a collection of mediaSource objects. The media sources
	1211	+ will be initialized from the <video> element, its child <source> elements,
	1212	+ and/or the ROE file referenced by the <video> element.
	1213	+ @param {element} video_element <video> element used for initialization.
	1214	+ @constructor
	1215	+*/
	1216	+function mediaElement(video_element)
	1217	+{
	1218	+ this.init(video_element);
	1219	+};
	1220	+
	1221	+mediaElement.prototype =
	1222	+{
	1223	+ /** The array of mediaSource elements. */
	1224	+ sources:null,
	1225	+ /** Selected mediaSource element. */
	1226	+ selected_source:null,
	1227	+
	1228	+ /** @private */
	1229	+ init:function(video_element)
	1230	+ {
	1231	+ var _this = this;
	1232	+
	1233	+ js_log('Initializing mediaElement...');
	1234	+ this.sources = new Array();
	1235	+ // Process the <video> element
	1236	+ this.tryAddSource(video_element);
	1237	+ // Process all inner <source> elements
	1238	+ inner_source_elements = video_element.getElementsByTagName('source');
	1239	+ $j.each(inner_source_elements, function(inx, inner_source)
	1240	+ {
	1241	+ _this.tryAddSource(inner_source);
	1242	+ });
	1243	+ // Process the provided ROE file if any
	1244	+ if(video_element.hasAttribute('roe'))
	1245	+ do_request(video_element.getAttribute('roe'), function(data)
	1246	+ {
	1247	+ _this.addROE(data);
	1248	+ });
	1249	+ // Select the default source
	1250	+ for (var source in this.sources)
	1251	+ if(this.sources[source].marked_default)
	1252	+ this.selected_source = this.sources[source];
	1253	+ // or the first source
	1254	+ if (!this.selected_source)
	1255	+ this.selected_source = this.sources[0];
	1256	+ },
	1257	+ /** Returns the array of mediaSources of this element.
	1258	+ \returns {Array} Array of mediaSource elements.
	1259	+ */
	1260	+ getSources:function()
	1261	+ {
	1262	+ return this.sources;
	1263	+ },
	1264	+ /** Selects a particular source for playback.
	1265	+ */
	1266	+ selectSource:function(index)
	1267	+ {
	1268	+ js_log("selected source " + this.sources[index].getTitle());
	1269	+ this.selected_source = this.sources[index];
	1270	+ },
	1271	+ /** Returns the thumbnail URL for the media element.
	1272	+ \returns {String} thumbnail URL
	1273	+ */
	1274	+ getThumbnailURL:function()
	1275	+ {
	1276	+ return mv_default_thumb_url;
	1277	+/* //set the thumbnail:
	1278	+ $j.each(_this.roe_data.getElementsByTagName('img'), function(inx, n){
	1279	+ if(n.getAttribute("id")=="stream_thumb"){
	1280	+ js_log('set thumb to '+n.getAttribute("src"));
	1281	+ _this['thumbnail'] = n.getAttribute("src");
	1282	+ }*/
	1283	+ },
	1284	+/* //set the linkback:
	1285	+ $j.each(_this.roe_data.getElementsByTagName('link'), function(inx, n){
	1286	+ if(n.getAttribute('id')=='html_linkback'){
	1287	+ js_log('set linkback to '+n.getAttribute("href"));
	1288	+ _this['linkback'] = n.getAttribute('href');
	1289	+ }*/
	1290	+ /** Checks whether there is a stream of a specified MIME type.
	1291	+ @param {String} mime_type MIME type to check.
	1292	+ @type {BooleanPrimitive}.
	1293	+ */
	1294	+ hasStreamOfMIMEType:function(mime_type)
	1295	+ {
	1296	+ for(source in this.sources)
	1297	+ {
	1298	+ if(this.sources[source].getMIMEType() == mime_type)
	1299	+ return true;
	1300	+ }
	1301	+ return false;
	1302	+ },
	1303	+ /** Adds a single mediaSource using the provided element if
	1304	+ the element has a 'src' attribute.
	1305	+ @param element {element} <video>, <source> or <mediaSource> element.
	1306	+ */
	1307	+ tryAddSource:function(element)
	1308	+ {
	1309	+ if (!element.hasAttribute('src'))
	1310	+ return;
	1311	+
	1312	+ var src = element.getAttribute('src');
	1313	+ var title = null;
	1314	+ var type = null;
	1315	+ var marked_default = false;
	1316	+
	1317	+ var tag = element.tagName.toLowerCase();
	1318	+
	1319	+ if (tag == 'src')
	1320	+ marked_default = true;
	1321	+
	1322	+ if (element.hasAttribute("title"))
	1323	+ title = element.getAttribute("title");
	1324	+ else
	1325	+ title = src;
	1326	+
	1327	+ if (element.hasAttribute('type'))
	1328	+ type = element.getAttribute('type');
	1329	+ else if (element.hasAttribute('content-type'))
	1330	+ type = element.getAttribute('content-type');
	1331	+ else
	1332	+ type = this.detectType(src);
	1333	+
	1334	+ this.sources.push(new mediaSource(type, src, title, this.sources.length));
	1335	+ },
	1336	+ /** Imports media sources from ROE data.
	1337	+ @param roe_data ROE data.
	1338	+ */
	1339	+ addROE:function(roe_data)
	1340	+ {
	1341	+ var _this = this;
	1342	+ $j.each(roe_data.getElementsByTagName('mediaSource'), function(inx, source)
	1343	+ {
	1344	+ _this.tryAddSource(source);
	1345	+ });
	1346	+ },
	1347	+ /** Attempts to detect the type of a media file based on the URI.
	1348	+ @param {String} uri URI of the media file.
	1349	+ @returns The guessed MIME type of the file.
	1350	+ @type String
	1351	+ */
	1352	+ detectType:function(uri)
	1353	+ {
	1354	+ if(endsWith(uri, '.flv'))
	1355	+ return 'video/x-flv';
	1356	+ }
	1357	+};
	1358	+
	1359	+function endsWith(str, suffix)
	1360	+{
	1361	+ return str.substr(str.length-suffix.length, suffix.length)==suffix;
	1362	+}
	1363	+
	1364	+/** base embedVideo object
	1365	+ @param element <video> tag used for initialization.
	1366	+ @constructor
	1367	+*/
995	1368	var embedVideo = function(element) {
996	1369	return this.init(element);
997	1370	};
998		~~-//base embedVideo object~~
	1371	+
999	1372	embedVideo.prototype = {
	1373	+ /** The mediaElement object containing all mediaSource objects */
	1374	+ media_element:null,
1000	1375	slider:null,
1001	1376	roe_xml:null,
1002	1377	load_external_data:false,
—	—	@@ -1022,20 +1397,12 @@
1023	1398	this[attr]=video_attributes[attr];
1024	1399	//js_log('attr:' + attr + ' val: ' + video_attributes[attr] +" "+ 'elm_val:' + element.getAttribute(attr) + "\n (set by attr)");
1025	1400	}
1026		~~- }~~
1027		~~- //if roe set & (src is not) ... load settings from xml (where not already set)~~
1028		~~- if(this.roe!=null && this.src==null){~~
1029		~~- this.loading_external_data=true;~~
1030		~~- }~~
1031		~~- if(this.roe==null){~~
1032		~~- this['show_meta_link']=false;~~
1033		~~- }~~
	1401	+ }
	1402	+ // load all of the specified sources
	1403	+ this.media_element = new mediaElement(element);
1034	1404	js_log('continue_thumb:'+ this['thumbnail']);
1035	1405	js_log('continue_src:'+ this['src']);
1036		~~- //if the thumbnail is null replace with default thumb:~~
1037		~~- if(!this['thumbnail']){~~
1038		~~- this['thumbnail'] = mv_default_thumb_url;~~
1039		~~- }~~
	1406	+
1040	1407	//if style is set override width and height
1041	1408	if(element.style.width)this.width = element.style.width.replace('px','');
1042	1409	if(element.style.height)this.height = element.style.height.replace('px','');
—	—	@@ -1044,20 +1411,31 @@
1045	1412
1046	1413	//grab any innerHTML and set it to missing_plugin_html
1047	1414	if(element.innerHTML!=''){
	1415	+ js_log('innerHTML: ' + element.innerHTML);
1048	1416	this.user_missing_plugin_html=element.innerHTML;
1049	1417	}
1050	1418	/*
1051	1419	* override all relevant exported functions with the {embed_type} Object
1052	1420	* place the base functions in parent.{function name}
1053	1421	*/
1054		~~- js_log("PLAYBACK TYPE: "+embedTypes.getPlayerLib());~~
1055		~~- if(embedTypes.getPlayerType()){~~
1056		~~- this.inheritEmbedObj();~~
1057		~~- }~~
	1422	+ embedTypes.players.autoSelectPlayer(this.media_element.selected_source.mime_type);
	1423	+
	1424	+ if(embedTypes.players.selected_player){
	1425	+ js_log("PLAYBACK TYPE: "+embedTypes.players.selected_player.library);
	1426	+ }
1058	1427	//js_log('HTML FROM IN OBJECT' + this.getHTML());
1059	1428	//return this object:
1060	1429	return this;
1061		~~- },~~
	1430	+ },
	1431	+ doEmbedHTML:function()
	1432	+ {
	1433	+ this.inheritEmbedObj();
	1434	+ var embed_code = this.getEmbedHTML();
	1435	+ js_log(embed_code);
	1436	+ this.innerHTML = embed_code;
	1437	+ this.paused = false;
	1438	+ this.thumbnail_disp=false;
	1439	+ },
1062	1440	inheritEmbedObj:function(){
1063	1441	js_log("inheritEmbedObj");
1064	1442	//@@note: tricky cuz direct overwrite is not so ideal.. since the extended object is already tied to the dom
—	—	@@ -1073,7 +1451,7 @@
1074	1452	}
1075	1453	}
1076	1454	//set up the new embedObj
1077		~~- eval('embedObj = ' +embedTypes.getPlayerLib() +'Embed;');~~
	1455	+ eval('embedObj = ' +embedTypes.players.selected_player.library +'Embed;');
1078	1456	for(method in embedObj){
1079	1457	//parent method preservation for local overwritten methods
1080	1458	if(this[method])this['parent_' + method] = this[method];
—	—	@@ -1084,134 +1462,17 @@
1085	1463	this.inheritEmbedOverride();
1086	1464	}
1087	1465	},
1088		~~- //parse roe file and store data in this object~~
1089		~~- getParseROE: function(callback){~~
1090		~~- var _this = this;~~
1091		~~- do_request(this.roe, function(data){~~
1092		~~- js_log('got DATA!!!!!!!' + typeof data);~~
1093		~~- // alert('found mediaSource');~~
1094		~~- //});~~
1095		~~- //elm = xml.getElementById('html_linkback');~~
1096		~~- //js_log("on: "+_this.id + " got xml "+ xml.length + ' test elm:' + elm.getAttribute('rel'));~~
1097		~~- if(typeof data == 'object' ){~~
1098		~~- _this.roe_xml = data;~~
1099		~~- var cmml_available=false;~~
1100		~~- $j.each(_this.roe_xml.getElementsByTagName('mediaSource'), function(inx, n){~~
1101		~~- js_log(' on element: ' + n.getAttribute('content-type'));~~
1102		~~- if(n.getAttribute('content-type')=='video/ogg' && n.getAttribute("default")=="true"){~~
1103		~~- js_log('set src to '+n.getAttribute("src"));~~
1104		~~- _this['src'] = n.getAttribute("src");~~
1105		~~- }~~
1106		~~- if(n.getAttribute('content-type')=='text/cmml'){~~
1107		~~- js_log('cmml available');~~
1108		~~- cmml_available=true;~~
1109		~~- }~~
1110		~~- });~~
1111		~~- //overide show_meta_link if cmml is not available~~
1112		~~- if(!cmml_available){~~
1113		~~- _this['show_meta_link']=false;~~
1114		~~- }~~
1115		- /*
1116		~~- //set the src to video tag with "default" attribute:~~
1117		~~- //var rVids = _this.roe_xml.getElementsByTagName('video');~~
1118		~~- js_log('found '+ rVids.length + ' video tags');~~
1119		~~- $j.each(_this.roe_xml.getElementsByTagName('video'), function(inx,n){~~
1120		~~- if(n.getAttribute("default")=="true"){~~
1121		~~- js_log('set src to '+n.getAttribute("src"));~~
1122		~~- _this['src'] = n.getAttribute("src");~~
1123		~~- }~~
1124		~~- });~~
1125		~~- */~~
1126		~~- //set the thumbnail:~~
1127		~~- $j.each(_this.roe_xml.getElementsByTagName('img'), function(inx, n){~~
1128		~~- if(n.getAttribute("id")=="stream_thumb"){~~
1129		~~- js_log('set thumb to '+n.getAttribute("src"));~~
1130		~~- _this['thumbnail'] = n.getAttribute("src");~~
1131		~~- }~~
1132		~~- });~~
1133		~~- //set the linkback:~~
1134		~~- $j.each(_this.roe_xml.getElementsByTagName('link'), function(inx, n){~~
1135		~~- if(n.getAttribute('id')=='html_linkback'){~~
1136		~~- js_log('set linkback to '+n.getAttribute("href"));~~
1137		~~- _this['linkback'] = n.getAttribute('href');~~
1138		~~- }~~
1139		~~- });~~
1140		~~- }~~
1141		~~- if(!_this['src']){~~
1142		~~- //could not find default video src for playback~~
1143		~~- $j(_this).html(getMsg('missing_video_stream'));~~
1144		~~- }else{~~
1145		~~- //js_log("do callback roe data:"+_this['roe_xml']+' '+ _this['src'] +' '+ _this['thumbnail'] + 'cb: '+ callback);~~
1146		~~- callback(_this.id);~~
1147		~~- }~~
1148		~~- });~~
1149		~~- },~~
1150		- /*
1151		~~- * function getDuration in milliseconds~~
1152		~~- * special case derive duration from request url (in float seconds) @@todo should be float seconds~~
1153		~~- * (for media_url?t=ntp_start/ntp_end url request format~~
1154		~~- */~~
1155		~~- getDuration : function(){~~
1156		~~- //js_log('get duration for:' + this.src);~~
1157		~~- var index_time_val = false;~~
1158		~~- if(this.src.indexOf('?t=')!=-1)index_time_val='?t=';~~
1159		~~- if(this.src.indexOf('&t=')!=-1)index_time_val='&t=';~~
1160		~~- if(index_time_val){~~
1161		~~- var end_index = (this.src.indexOf('&', this.src.indexOf(index_time_val))==-1)?~~
1162		~~- this.src.length:~~
1163		~~- this.src.indexOf('&', this.src.indexOf(index_time_val));~~
1164		~~- this.start_ntp = this.src.substring(~~
1165		~~- this.src.indexOf(index_time_val)+index_time_val.length,~~
1166		~~- this.src.indexOf('/', this.src.indexOf(index_time_val) ));~~
1167		~~- this.end_ntp = this.src.substring(~~
1168		~~- this.src.indexOf('/', this.src.indexOf(index_time_val))+1, end_index);~~
1169		~~- this.start_offset = ntp2seconds(this.start_ntp);~~
1170		~~- this.duration = ntp2seconds( this.end_ntp ) - this.start_offset;~~
1171		~~- //put values into ms:~~
1172		~~- this.start_offset = this.start_offset*1000~~
1173		~~- this.duration = this.duration*1000;~~
1174		~~- }else{~~
1175		~~- //else normal media request (can't predict the duration without the plugin reading it)~~
1176		~~- this.duration=null;~~
1177		~~- this.start_offset=0;~~
1178		~~- }~~
1179		~~- //return duration in ms:~~
1180		~~- return this.duration;~~
1181		~~- },~~
1182		~~- /* get the duration in ntp format */~~
1183		~~- getDurationNTP:function(){~~
1184		~~- return seconds2ntp(this.getDuration()/1000);~~
1185		~~- },~~
1186	1466	getHTML : function (){
1187		~~- if(this.loading_external_data){~~
1188		~~- this.innerHTML = getMsg('loading_txt');~~
1189		~~- /*this.getThumbnailHTML();~~
1190		~~- $j('#big_play_link_'+this.id).replaceWith('<span style="background:#fff;color:#000;' +~~
1191		~~- 'filter:alpha(opacity=65);-moz-opacity:.65;opacity:.65;">'+getMsg('loading_txt')+'</span>');*/~~
1192		~~- var _this= this;~~
1193		~~- //js_log('before req id: '+ _this.id)~~
1194		~~- this.getParseROE( function(_this_id){~~
1195		~~- //set cur obj by callback id if present:~~
1196		~~- if(_this_id)~~
1197		~~- _this = $j('#'+_this_id).get(0);~~
1198		~~- _this.loading_external_data=false;~~
1199		~~- _this.getHTML();~~
1200		~~- });~~
1201		~~- }else{~~
1202		~~- //make sure we have duration info:~~
1203		~~- this.getDuration();~~
1204		~~- //js_log('get html: ' + $j('#'+this.id).html() );~~
1205		~~- //returns the innerHTML based on auto play option and global_embed_type~~
1206		~~- //if auto play==true directly embed the plugin~~
1207		~~- if(this.autoplay){~~
1208		~~- this.thumbnail_disp = false;~~
1209		~~- this.innerHTML = this.getEmbedHTML();~~
1210		~~- }else{~~
1211		~~- //if autoplay=false or render out a thumbnail with link to embed html~~
1212		~~- this.thumbnail_disp = true;~~
1213		~~- this.innerHTML = this.getThumbnailHTML();~~
1214		~~- }~~
1215		~~- }~~
	1467	+ //returns the innerHTML based on auto play option and global_embed_type
	1468	+ //if auto play==true directly embed the plugin
	1469	+ if(this.autoplay){
	1470	+ this.thumbnail_disp = false;
	1471	+ this.innerHTML = this.getEmbedHTML();
	1472	+ }else{
	1473	+ //if autoplay=false or render out a thumbnail with link to embed html
	1474	+ this.thumbnail_disp = true;
	1475	+ this.innerHTML = this.getThumbnailHTML();
	1476	+ }
1216	1477	},
1217	1478	/*
1218	1479	* get missing plugin html (check for user included code)
—	—	@@ -1250,39 +1511,11 @@
1251	1512	}
1252	1513	}
1253	1514	},
1254		~~- selectPlaybackMethod:function(){~~
1255		~~- //put select list on-top~~
1256		~~- //make sure the parent is relatively positioned:~~
1257		~~- $j('#'+this.id).css('position', 'relative');~~
1258		~~- //set height width (check for playlist container)~~
1259		~~- var width = (this.pc)?this.pc.pp.width:this.width;~~
1260		~~- var height = (this.pc)?this.pc.pp.height:this.height;~~
1261		~~- if(width<320)width=320;~~
1262		~~- if(height<240)height=240;~~
1263		-
1264		~~- var sel_id = (this.pc!=null)?this.pc.pp.id:this.id;~~
1265		~~- //fade in a black bg div ontop of everything~~
1266		~~- var select_code = '<div class="set_ogg_player_pref" id="blackbg_'+sel_id+'" ' +~~
1267		~~- 'style="position:absolute;display:none;z-index:2;background:black;top:0px;left:0px;' +~~
1268		~~- 'height:'+parseInt(height)+'px;width:'+parseInt(width)+'px;">' +~~
1269		~~- '<span style="position:relative;top:20px;left:20px">' +~~
1270		~~- '<b style="color:white;">'+getMsg('select_playback')+':</b><br>'+~~
1271		~~- embedTypes.getPlayerSelectList()+~~
1272		~~- '<a href="#" style="color:white" onClick="document.getElementById(\''+this.id+'\').closeSelectPlayback();return false;">close</a>'+~~
1273		~~- '</span>'+~~
1274		~~- '</div>';~~
1275		~~- //js_log('appending to: ' + sel_id +' sc: '+ select_code );~~
1276		~~- $j('#'+sel_id).append(select_code);~~
1277		~~- $j('#blackbg_'+sel_id).fadeIn("slow");~~
1278		~~- return false; //onclick action return false~~
1279		~~- },~~
1280		~~- closeSelectPlayback:function(){~~
1281		~~- var sel_id = (this.pc!=null)?this.pc.pp.id:this.id;~~
1282		~~- $j('#blackbg_'+sel_id).fadeOut("slow", function(){~~
1283		~~- $j('#blackbg_'+sel_id).remove();~~
1284		~~- });~~
1285		~~- return false;//onclick action return false~~
1286		~~- },~~
	1515	+ /** Returns the HTML code for the video when it is in thumbnail mode.
	1516	+ This includes the specified thumbnail as well as buttons for
	1517	+ playing, configuring the player, inline cmml display, HTML linkback,
	1518	+ download, and embed code.
	1519	+ */
1287	1520	getThumbnailHTML : function (){
1288	1521	var thumb_html = '';
1289	1522	var class_atr='';
—	—	@@ -1295,7 +1528,7 @@
1296	1529	thumb_html+= '<div id="dc_'+this.id+'" style="position:relative;'+
1297	1530	' overflow:hidden; top:0px; left:0px; width:'+this.width+'px; height:'+this.height+'px; z-index:0;">'+
1298	1531	'<img width="'+this.width+'" height="'+this.height+'" style="position:relative;width:'+this.width+';height:'+this.height+'"' +
1299		~~- ' id="img_thumb_'+this.id+'" src="' + this.thumbnail + '">';~~
	1532	+ ' id="img_thumb_'+this.id+'" src="' + this.media_element.getThumbnailURL() + '">';
1300	1533
1301	1534	js_log("PLAY BUTTON: " + this.play_button);
1302	1535	if(this.play_button==true)
—	—	@@ -1309,9 +1542,10 @@
1310	1543	'</a>'+
1311	1544	'</div>';
1312	1545	}
	1546	+
1313	1547	//add in cmml inline dispaly if roe descption avaliable
1314		~~- //not to be displayed in stream interface.~~
1315		~~- if(this.show_meta_link){~~
	1548	+ //not to be displayed in stream interface.
	1549	+ if(this.media_element.hasStreamOfMIMEType('text/cmml')){
1316	1550	thumb_html+='<div style="border:none;position:absolute;top:2px;right:2px;z-index:1">'+
1317	1551	'<a title="'+getMsg('select_transcript_set')+'" href="javascript:document.getElementById(\''+this.id+'\').showTextInterface();">';
1318	1552	thumb_html+=getTransparentPng({id:'metaButton_'+this.id, width:"40", height:"27", border:"0",
—	—	@@ -1347,13 +1581,13 @@
1348	1582	src:mv_embed_path + 'images/vid_embed_sm.png' }));
1349	1583	thumb_html+='</a></div>';
1350	1584	//make link absolute (if it was not already)
1351		~~- js_log('looking at thumb:'+ this.thumbnail);~~
1352		~~- if(this.thumbnail.substring(0,1)=='/'){~~
	1585	+ var thumbnail = this.media_element.getThumbnailURL();
	1586	+ if(thumbnail.substring(0,1)=='/'){
1353	1587	eURL = parseUri(mv_embed_path);
1354		~~- embed_thumb_html = eURL.protocol + '://' + eURL.host + this.thumbnail;~~
	1588	+ embed_thumb_html = eURL.protocol + '://' + eURL.host + thumbnail;
1355	1589	//js_log('set from mv_embed_path:'+embed_thumb_html);
1356	1590	}else{
1357		~~- embed_thumb_html = (this.thumbnail.indexOf('http://')!=-1)?this.thumbnail:mv_embed_path + this.thumbnail;~~
	1591	+ embed_thumb_html = (thumbnail.indexOf('http://')!=-1)?thumbnail:mv_embed_path + thumbnail;
1358	1592	}
1359	1593	var embed_code_html = '<script type="text/javascript" ' +
1360	1594	'src="'+mv_embed_path+'mv_embed.js"></script&gt' +
—	—	@@ -1411,8 +1645,8 @@
1412	1646	$j(this).fadeOut("slow");
1413	1647	} );
1414	1648	*
1415		~~- */~~
1416		~~- },~~
	1649	+ */
	1650	+ },
1417	1651	showTextInterface:function(){
1418	1652	//check if textObj present:
1419	1653	if(typeof this.textInterface == 'undefined' ){
—	—	@@ -1427,66 +1661,93 @@
1428	1662	this.textInterface.close();
1429	1663	}
1430	1664	},
1431		~~- //@@todo we should group/abstract hide show video and set playback preference~~
1432		~~- showVideoDownload:function(){~~
1433		~~- $j('#'+this.id).css('position', 'relative');~~
1434		~~- //set height width (check for playlist container)~~
1435		~~- var width = (this.pc)?this.pc.pp.width:this.width;~~
1436		~~- var height = (this.pc)?this.pc.pp.height:this.height;~~
1437		~~- if(width<320)width=320;~~
1438		~~- if(height<240)height=240;~~
	1665	+ /** Generic function to display custom HTML inside the mv_embed element.
	1666	+ The code should call the closeDisplayedHTML function to close the
	1667	+ display of the custom HTML and restore the regular mv_embed display.
	1668	+ @param {String} HTML code for the selection list.
	1669	+ */
	1670	+ displayHTML:function(html_code)
	1671	+ {
	1672	+ //put select list on-top
	1673	+ //make sure the parent is relatively positioned:
	1674	+ $j('#'+this.id).css('position', 'relative');
	1675	+ //set height width (check for playlist container)
	1676	+ var width = (this.pc)?this.pc.pp.width:this.width;
	1677	+ var height = (this.pc)?this.pc.pp.height:this.height;
	1678	+ if(width<320)width=320;
	1679	+ if(height<240)height=240;
	1680	+
	1681	+ var sel_id = (this.pc!=null)?this.pc.pp.id:this.id;
	1682	+ //fade in a black bg div ontop of everything
	1683	+ var div_code = '<div id="blackbg_'+sel_id+'" ' +
	1684	+ 'style="overflow:auto;position:absolute;display:none;z-index:2;background:black;top:0px;left:0px;' +
	1685	+ 'height:'+parseInt(height)+'px;width:'+parseInt(width)+'px;">'+
	1686	+ html_code +
	1687	+ '</div>';
	1688	+
	1689	+ $j('#'+sel_id).append(div_code);
	1690	+ $j('#blackbg_'+sel_id).fadeIn("slow");
	1691	+ return false; //onclick action return false
	1692	+ },
	1693	+ /** Close the custom HTML displayed using displayHTML and restores the
	1694	+ regular mv_embed display.
	1695	+ */
	1696	+ closeDisplayedHTML:function(){
1439	1697	var sel_id = (this.pc!=null)?this.pc.pp.id:this.id;
1440		~~- var close_link ='<a href="#" style="color:white" onClick="document.getElementById(\''+this.id+'\').closeSelectPlayback();return false;">close</a>';~~
1441		~~- //fade in a black bg div ontop of everything~~
1442		~~- var select_code = '<div id="blackbg_'+sel_id+'" ' +~~
1443		~~- 'style="overflow:auto;position:absolute;display:none;z-index:2;background:black;top:0px;left:0px;' +~~
1444		~~- 'height:'+parseInt(height)+'px;width:'+parseInt(width)+'px;">'+~~
1445		~~- '<span id="close_vl'+this.id+'" style="position:absolute:top:2px;left:2px;color:white;">'+close_link+'</span>'+~~
	1698	+ $j('#blackbg_'+sel_id).fadeOut("slow", function(){
	1699	+ $j('#blackbg_'+sel_id).remove();
	1700	+ });
	1701	+ return false;//onclick action return false
	1702	+ },
	1703	+ selectPlaybackMethod:function(){
	1704	+ var close_link ='<a href="#" style="color:white" onClick="document.getElementById(\''+this.id+'\').closeDisplayedHTML();return false;">close</a>';
	1705	+ var select_code =
	1706	+ '<span id="close_vl'+this.id+'" style="position:absolute:top:2px;left:2px;color:white;">'+close_link+'</span>'+
1446	1707	'<span id="con_vl_'+this.id+'" style="position:absolute;top:20px;left:20px;color:white;">';
1447		~~- var dl_list='';~~
1448		~~- //set to loading if we don't have the roe data yet:~~
1449		~~- if(!this.roe_xml && this.roe){~~
1450		~~- select_code+=getMsg('loading_txt');~~
1451		~~- var _this = this;~~
1452		~~- this.getParseROE(function(){~~
1453		~~- $j('#con_vl_'+_this.id).html(_this.getDLlist());~~
1454		~~- });~~
1455		~~- }else{~~
1456		~~- js_log('get dl list');~~
1457		~~- select_code+=this.getDLlist();~~
1458		~~- }~~
1459		~~- select_code+=close_link+'</span>'+~~
1460		~~- '</div>';~~
1461		~~- //js_log('appending to: ' + sel_id +' sc: '+ select_code );~~
1462		~~- $j('#'+sel_id).append(select_code);~~
1463		~~- $j('#blackbg_'+sel_id).fadeIn("slow");~~
	1708	+ var dl_list='';
	1709	+ var _this=this;
	1710	+ select_code+=this.getDLlist(function(index, source)
	1711	+ {
	1712	+ var player_code = embedTypes.getPlayerSelectList(source.getMIMEType(), 'document.getElementById(\''+_this.id+'\').closeDisplayedHTML(); document.getElementById(\''+_this.id+'\').media_element.selectSource(\''+index+'\');');
	1713	+ return '<a href="#" style="color:white" onClick="document.getElementById(\''+_this.id+'\').closeDisplayedHTML(); document.getElementById(\''+_this.id+'\').media_element.selectSource(\''+index+'\'); return false;">'
	1714	+ + source.getTitle()+'</a>' + player_code;
	1715	+ });
	1716	+ select_code+=close_link+'</span>';
	1717	+ this.displayHTML(select_code);
	1718	+ },
	1719	+ showVideoDownload:function(){
	1720	+ var close_link ='<a href="#" style="color:white" onClick="document.getElementById(\''+this.id+'\').closeDisplayedHTML();return false;">close</a>';
	1721	+ var select_code =
	1722	+ '<span id="close_vl'+this.id+'" style="position:absolute:top:2px;left:2px;color:white;">'+close_link+'</span>'+
	1723	+ '<span id="con_vl_'+this.id+'" style="position:absolute;top:20px;left:20px;color:white;">';
	1724	+ var dl_list='';
	1725	+ select_code+=this.getDLlist(function(index, source)
	1726	+ {
	1727	+ return '<a style="color:white" href="' + source.getURI() +'"> '
	1728	+ + source.getTitle()+'</a>';
	1729	+ });
	1730	+ select_code+=close_link+'</span>';
	1731	+ this.displayHTML(select_code);
1464	1732	},
1465		~~- getDLlist:function(){~~
	1733	+ getDLlist:function(transform_function){
1466	1734	var out='<b style="color:white;">'+getMsg('download_from')+' '+parseUri(this.src).queryKey['t']+'</b><br>';
1467	1735	out+='<span style="color:white"><blockquote>';
1468	1736	var dl_list=dl_txt_list='';
1469		~~- $j.each(this.roe_xml.getElementsByTagName('mediaSource'), function(inx,n){~~
1470		~~- var dl_line = '<li><a style="color:white" href="' + n.getAttribute("src") +'"> '+~~
1471		~~- n.getAttribute("title")+'</a></li>'+"\n";~~
1472		~~- if(n.getAttribute("content-type")=="video/ogg"){~~
	1737	+ $j.each(this.media_element.getSources(), function(index, source)
	1738	+ {
	1739	+ var dl_line = '<li>' + transform_function(index, source) + '</li>'+"\n";
	1740	+ if(this.getMIMEType()=="video/ogg"){
1473	1741	out+=dl_line;
1474		~~- }if(n.getAttribute("content-type")=="text/cmml"){~~
	1742	+ }else if(this.getMIMEType()=="text/cmml"){
1475	1743	dl_txt_list+=dl_line;
1476	1744	}else{
1477	1745	dl_list+=dl_line;
1478	1746	}
1479		~~- });~~
	1747	+ });
1480	1748	out+='</blockquote>'+getMsg('download_full')+"<blockquote>"+dl_list+'</blockquote>';
1481	1749	out+='</blockquote>'+getMsg('download_text')+"<blockquote>"+dl_txt_list+'</blockquote></span>';
1482	1750	return out;
1483	1751	},
1484		~~- closeVideoDownload:function(){~~
1485		~~- var sel_id = (this.pc!=null)?this.pc.pp.id:this.id;~~
1486		~~- $j('#blackbg_'+sel_id).fadeOut("slow", function(){~~
1487		~~- $j('#blackbg_'+sel_id).remove();~~
1488		~~- });~~
1489		~~- return false;//onclick action return false~~
1490		~~- },~~
1491	1752	/*
1492	1753	* base embed controls
1493	1754	* the play button calls
—	—	@@ -1496,16 +1757,12 @@
1497	1758	//check if thumbnail is being displayed and embed html
1498	1759	if(this.thumbnail_disp){
1499	1760	//js_log('rewrite embed');
1500		~~- if(!embedTypes.getPlayerType()){~~
	1761	+ if(!embedTypes.players.selected_player){
1501	1762	//this.innerHTML = this.getPluginMissingHTML();
1502	1763	//$j('#'+this.id).html(this.getPluginMissingHTML());
1503	1764	this.innerHTML = this.getPluginMissingHTML();
1504		~~- }else{~~
1505		~~- //$j('#'+this.id).html(this.getEmbedHTML());~~
1506		~~- this.innerHTML = this.getEmbedHTML();~~
1507		~~- }~~
1508		~~- this.paused = false;~~
1509		~~- this.thumbnail_disp=false;~~
	1765	+ }else
	1766	+ this.doEmbedHTML();
1510	1767	}else{
1511	1768	//the plugin is already being displayed
1512	1769	}
—	—	@@ -1800,6 +2057,7 @@
1801	2058	$j.ajax({
1802	2059	type: "GET",
1803	2060	url:req_url,
	2061	+ async: false,
1804	2062	success:function(data){
1805	2063	callback(data);
1806	2064	}
—	—	@@ -1813,7 +2071,9 @@
1814	2072	type: "POST",
1815	2073	url:mv_embed_path + 'mv_data_proxy.php',
1816	2074	data:{url:req_url},
1817		~~- success:function(data){~~
	2075	+ async: false,
	2076	+ success:function(data){
	2077	+ js_log("did ajax req:"+ typeof data);
1818	2078	callback(data);
1819	2079	}
1820	2080	});
Index: branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/mv_javaEmbed.js
—	—	@@ -20,27 +20,28 @@
21	21	if(mv_java_iframe){
22	22	//make sure iframe and embed path match (java security model)
23	23	var iframe_src='';
	24	+ var src = this.media_element.selected_source.uri;
24	25	//if the src is relative add in current_url as path:
25		~~- if(this.src[0]=='/'){~~
	26	+ if(src[0]=='/'){
26	27	js_log('java: media relative path');
27	28	var pURL=parseUri(document.URL);
28		~~- this.src= pURL.protocol + '://' + pURL.authority + this.src;~~
29		~~- }else if(parseUri(this.src).host==this.src){~~
	29	+ src= pURL.protocol + '://' + pURL.authority + src;
	30	+ }else if(parseUri(src).host==src){
30	31	js_log('java: media relative file');
31	32	var pURL=parseUri(document.URL);
32		~~- this.src= pURL.protocol + '://' + pURL.authority + pURL.directory + this.src;~~
	33	+ src= pURL.protocol + '://' + pURL.authority + pURL.directory + src;
33	34	}
34	35	var parent_domain='';
35		~~- if(parseUri(mv_embed_path).host != parseUri(this.src).host){~~
36		~~- iframe_src = parseUri(this.src).protocol + '://'+~~
37		~~- parseUri(this.src).authority +~~
	36	+ if(parseUri(mv_embed_path).host != parseUri(src).host){
	37	+ iframe_src = parseUri(src).protocol + '://'+
	38	+ parseUri(src).authority +
38	39	mv_media_iframe_path + 'cortado_iframe.php';
39	40	parent_domain = '&parent_domain='+parseUri(mv_embed_path).host;
40	41	}else{
41	42	iframe_src = mv_embed_path + 'cortado_iframe.php';
42	43	}
43	44	//js_log('base iframe src:'+ iframe_src);
44		~~- iframe_src+= "?media_url=" + this.src + '&id=' + this.pid;~~
	45	+ iframe_src+= "?media_url=" + src + '&id=' + this.pid;
45	46	iframe_src+= "&width=" + this.width + "&height=" + this.height;
46	47	iframe_src+= "&duration=" + this.duration;
47	48	iframe_src+=parent_domain;
—	—	@@ -52,7 +53,7 @@
53	54	// (media must be on the same server or applet must be signed)
54	55	return ''+
55	56	'<applet id="'+this.pid+'" code="com.fluendo.player.Cortado.class" archive="cortado-ovt-stripped_r34336.jar" width="'+this.width+'" height="'+this.height+'"> '+ "\n"+
56		~~- '<param name="url" value="'+this.src+'" /> ' + "\n"+~~
	57	+ '<param name="url" value="'+this.media_element.selected_source.uri+'" /> ' + "\n"+
57	58	'<param name="local" value="false"/>'+ "\n"+
58	59	'<param name="keepaspect" value="true" />'+ "\n"+
59	60	'<param name="video" value="true" />'+"\n"+
Index: branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/sample_page.php
—	—	@@ -36,11 +36,19 @@
37	37	//$sample_embed[1]['desc'] = '<b>RSS</b> a podcast like dynamic feed for "peace"<br />'.
38	38	// '<iframe width="500" height="200" src="'.$plurl.'">rss feed here</iframe>';
39	39
	40	+$sample_embed[1]['tag']='<video id="vflash" src="http://www.archive.org/download/mv_senate_proceeding_12-23-07/senate_proceeding_12-23-07.flv"></video>';
	41	+$sample_embed[1]['desc']='flash video usage with manual controls:<br />'.
	42	+ '<a href="javascript:document.getElementById(\'vflash\').play();">Play</a> \| '.
	43	+ '<a href="javascript:document.getElementById(\'vflash\').stop();">Stop</a> <br />';
	44	+
	45	+$sample_embed[2]['tag']='<video><source type="video/ogg" src="http://128.114.20.64/media/senate_proceeding_05-15-08.ogg.anx?t=0:00:00/0:20:00" title="annodex ogg"/><source src="http://www.archive.org/download/mv_senate_proceeding_05-15-08/senate_proceeding_05-15-08.flv" title="flash"/></video>';
	46	+$sample_embed[2]['desc']='';
	47	+
40	48	//$sample_embed[1]['tag'] = '<video roe="http://192.168.0.104/mvWiki/index.php?title=Special:MvExportStream&feed_format=roe&stream_name=Senate_proceeding_08-01-07&t=0:00:00/0:05:00">';
41	49	//$sample_embed[1]['desc'] = 'Demo of json ROE attribute';
42	50
43		~~-$sample_embed[2]['tag'] = '<video roe="http://metavid.ucsc.edu/wiki/index.php?title=Special:MvExportStream&feed_format=roe&stream_name=Senate_proceeding_08-01-07&t=0:06:00/0:07:00">';~~
44		~~-$sample_embed[2]['desc'] = 'Demo2 of json ROE attribute';~~
	51	+$sample_embed[3]['tag'] = '<video roe="http://metavid.ucsc.edu/wiki/index.php?title=Special:MvExportStream&feed_format=roe&stream_name=Senate_proceeding_08-01-07&t=0:06:00/0:07:00">';
	52	+$sample_embed[3]['desc'] = 'Demo2 of json ROE attribute';
45	53
46	54
47	55	//$sample_embed[2]['tag'] = '<video id="v2" controls="true" roe="http://mammoth.dnip.net/mvWiki/index.php?title=Special:MvExportStream&feed_format=roe&stream_name=senate_11-14-05&t=0:42:14/0:42:56"/>';
—	—	@@ -48,22 +56,22 @@
49	57
50	58
51	59	//playlist tags:
52		~~-$sample_embed[3]['tag'] = '<playlist id="playlist1" width="400" height="300"~~
	60	+$sample_embed[4]['tag'] = '<playlist id="playlist1" width="400" height="300"
53	61	src="sample_xspf.xml" controls="true" embed_link="true"/>';
54		~~-$sample_embed[3]['desc'] = '<b>xspf</b> static xiph playlist <a href="http://metavid.ucsc.edu/wiki/index.php/Dorganisms">Dorganisms</a> <br /> <iframe width="500" height="200"~~
	62	+$sample_embed[4]['desc'] = '<b>xspf</b> static xiph playlist <a href="http://metavid.ucsc.edu/wiki/index.php/Dorganisms">Dorganisms</a> <br /> <iframe width="500" height="200"
55	63	src="sample_xspf.xml">xiph playlist disp here</iframe>';
56	64
57	65	$plurl = 'http://metavid.ucsc.edu/overlay/archive_browser/rss_filter_view?filters[0][type]=match&filters[0][val]=peace&start=0&rpp=10';
58		~~-$sample_embed[4]['tag'] = '<playlist id="playlist2"~~
	66	+$sample_embed[5]['tag'] = '<playlist id="playlist2"
59	67	src="'.$plurl.'"/>';
60		~~-$sample_embed[4]['desc'] = '<b>RSS</b> a podcast like dynamic feed for "peace"<br />'.~~
	68	+$sample_embed[5]['desc'] = '<b>RSS</b> a podcast like dynamic feed for "peace"<br />'.
61	69	'<iframe width="500" height="200" src="'.$plurl.'">rss feed here</iframe>';
62	70
63	71	$plurl ='http://metavid.ucsc.edu/m3u/filters/filter_seq?filters[0][type]=match&filters[0][val]=war&start=0&rpp=10';
64		~~-$sample_embed[5]['tag'] = '<playlist id="warplaylist" src="'.$plurl.'"/>';~~
65		~~-//$sample_embed[5]['desc'] = '<b>m3u</b> dynamic playlist search for "war"<br /> <textarea cols="70" rows="9">'.file_get_contents($plurl).'</textarea>';~~
	72	+$sample_embed[6]['tag'] = '<playlist id="warplaylist" src="'.$plurl.'"/>';
	73	+//$sample_embed[6]['desc'] = '<b>m3u</b> dynamic playlist search for "war"<br /> <textarea cols="70" rows="9">'.file_get_contents($plurl).'</textarea>';
66	74
67		~~-$sample_embed[6]['tag'] ='<playlist id="inline_pl">~~
	75	+$sample_embed[7]['tag'] ='<playlist id="inline_pl">
68	76	<!-- (hide from html rendering)
69	77	#playlist attr:
70	78	\|title=Inline Playlist
—	—	@@ -87,7 +95,7 @@
88	96
89	97	-->
90	98	</playlist>';
91		~~-$sample_embed[6]['desc'] = '<b>Inline Playlist:</b> for more info see <a href="http://metavid.ucsc.edu/wiki/index.php/Mv_embed">mv_embed wiki</a> page';~~
	99	+$sample_embed[7]['desc'] = '<b>Inline Playlist:</b> for more info see <a href="http://metavid.ucsc.edu/wiki/index.php/Mv_embed">mv_embed wiki</a> page';
92	100
93	101	//empty sample embed (to only do one:)
94	102	//$sample_embed = array();
—	—	@@ -97,14 +105,14 @@
98	106	?>
99	107	<table border="1" cellpadding="6" width="600">
100	108	<? foreach($sample_embed as $key=>$aval){
101		~~- if($key>=3)continue;~~
	109	+ if($key!=2)continue;
102	110	?>
103	111	<tr>
104		~~- <td><?php echo $aval['tag']?></td>~~
105		~~- <td valign="top"><b>Sample Embed <?php echo $key?></b><br />~~
106		~~- <?php echo $aval['desc']?><br />~~
	112	+ <td><?=$aval['tag']?></td>
	113	+ <td valign="top"><b>Sample Embed <?=$key?></b><br />
	114	+ <?=$aval['desc']?><br />
107	115	<-- code used: <br />
108		~~- <pre> <?php echo htmlentities($aval['tag'])?></pre>~~
	116	+ <pre> <?= htmlentities($aval['tag'])?></pre>
109	117	</td>
110	118	</tr>
111	119	<? //oput a seperator between video and playlist
Index: branches/MetavidWiki-exp/MetavidWiki/skins/mv_embed/mv_flashEmbed.js
—	—	@@ -24,12 +24,9 @@
25	25	},
26	26	doFlashEmbed : function()
27	27	{
28		~~- var video_file = this.src;~~
29		~~- video_file = video_file.substring(0, video_file.search(".anx"));~~
30		-
31	28	new flashembed("FlowPlayerAnnotationHolder",
32	29	{ src: mv_embed_path + 'FlowPlayerDark.swf', width: this.width, height: this.height, id: this.pid },
33		~~- { config: { autoPlay: false, showStopButton: false, showPlayButton: false,~~
34		~~- videoFile: video_file } });~~
	30	+ { config: { autoPlay: true, showStopButton: false, showPlayButton: false,
	31	+ videoFile: this.media_element.selected_source.uri } });
35	32	}
36	33	}

Status & tagging log

15:28, 12 September 2011 Meno25 (talk | contribs) changed the status of r36440 [removed: ok added: old]