<!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;
<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>
},
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;
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: ");
//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;
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');
}
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)
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
},
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">';
download, and embed code.
*/
getThumbnailHTML : function ()
- {
+ {
+ js_log('embedVideo:getThumbnailHTML::' + this.id);
var thumb_html = '';
var class_atr='';
var style_atr='';
//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() + ')');
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)
},
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
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{
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(){
}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);
};
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={};
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)");
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(){
//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?
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){
//play cur_clip
this.cur_clip.embed.play();
}
- //start up the playlist monitor
+ //start up the playlist monitor
this.monitor();
},
/*
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();
},
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){
//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(){
//(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:
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);
}
}
'<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>');
}
},*/
//status updates handled by playlist obj
},
setSliderValue:function(value){
- //setSlider value handled by playlist obj
+ //setSlider value handled by playlist obj
}
}
//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();
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;
}
}