1 //set the dismissNativeWarn flag:
2 _global['dismissNativeWarn'] = false;
14 getControls:function( embedObj ){
15 js_log('f:controlsBuilder:: opt:' + this.options);
16 this.id = (embedObj.pc)?embedObj.pc.pp.id:embedObj.id;
17 this.available_width = embedObj.playerPixelWidth();
18 //make pointer to the embedObj
19 this.embedObj =embedObj;
21 for(var i in embedObj.supports){
22 _this.supports[i] = embedObj.supports[i];
27 (embedObj.media_element.timedTextSources &&
28 embedObj.media_element.timedTextSources() )
29 ) && embedObj.show_meta_link )
30 this.supports['closed_captions']=true;
33 //append options to body (if not already there)
34 if($j('#mv_vid_options_'+ctrlBuilder.id).length==0)
35 $j('body').append( this.components['mv_embedded_options'].o() );
38 for( var i in this.components ){
39 if( this.supports[i] ){
40 if( this.available_width > this.components[i].w ){
41 //special case with playhead don't add unless we have 60px
42 if( i == 'play_head' && ctrlBuilder.available_width < 60 )
44 o+=this.components[i].o();
45 this.available_width -= this.components[i].w;
47 js_log('not enough space for control component:' + i);
55 * to be run once controls are attached to the dom
57 addControlHooks:function(embedObj){
58 //add in drag/seek hooks:
59 if(!embedObj.base_seeker_slider_offset && $j('#mv_seeker_slider_'+embedObj.id).get(0))
60 embedObj.base_seeker_slider_offset = $j('#mv_seeker_slider_'+embedObj.id).get(0).offsetLeft;
62 //js_log('looking for: #mv_seeker_slider_'+embedObj.id + "\n " +
63 // 'start sec: '+embedObj.start_time_sec + ' base offset: '+embedObj.base_seeker_slider_offset);
66 $j('#mv_play_pause_button_' + embedObj.id).unbind().btnBind().click(function(){
67 $j('#' + embedObj.id).get(0).play();
70 //big_play_link_ play binding:
71 $j('#big_play_link_' + embedObj.id).unbind().click(function(){
72 $j('#' + embedObj.id).get(0).play();
75 //add recomend firefox if non-native playback:
76 if( embedObj.doNativeWarningCheck() ){
77 $j('#dc_'+ embedObj.id).hover(
79 if($j('#gnp_' + embedObj.id).length==0){
80 $j(this).append('<div id="gnp_' + embedObj.id + '" class="ui-state-highlight ui-corner-all" ' +
81 'style="position:absolute;display:none;background:#FFF;top:10px;left:10px;right:10px;">' +
82 gM('mwe-for_best_experience') +
83 '<br><input id="ffwarn_'+embedObj.id+'" type=\"checkbox\">' +
84 gM('mwe-do_not_warn_again') +
86 $j('#ffwarn_'+embedObj.id).click(function(){
87 if( $j(this).is(':checked') ){
88 //set up a cookie for 7 days:
89 $j.cookie('dismissNativeWarn', true, { expires: 5 });
90 //set the current instance
91 _global['dismissNativeWarn'] = true;
92 $j('#gnp_' + embedObj.id).fadeOut('slow');
94 _global['adismissNativeWarn'] = false;
95 $j.cookie('dismissNativeWarn', false);
100 if( ($j.cookie('dismissNativeWarn') !== true) &&
101 _global['dismissNativeWarn'] === false ){
102 $j('#gnp_' + embedObj.id).fadeIn('slow');
106 $j('#gnp_' + embedObj.id).fadeOut('slow');
111 if( $j.browser.msie && $j.browser.version <= 6){
112 $j('#big_play_link_' + embedObj.id).pngFix();
117 $j('#timed_text_' + embedObj.id).unbind().btnBind().click(function(){
118 $j('#' + embedObj.id).get(0).showTextInterface();
122 $j('#options_button_' + embedObj.id).unbind().btnBind().click(function(){
123 $j('#' +embedObj.id).get(0).doOptionsHTML();
126 //fullscreen binding:
127 $j('#fullscreen_'+embedObj.id).unbind().btnBind().click(function(){
128 $j('#' +embedObj.id).get(0).fullscreen();
131 js_log(" should add slider binding: " + $j('#mv_play_head_'+embedObj.id).length) ;
132 $j('#mv_play_head_'+embedObj.id).slider({
137 start: function(event, ui){
138 var id = (embedObj.pc!=null)?embedObj.pc.pp.id:embedObj.id;
139 embedObj.userSlide=true;
140 $j('#big_play_link_'+id).fadeOut('fast');
141 //if playlist always start at 0
142 embedObj.start_time_sec = (embedObj.instanceOf == 'mvPlayList')?0:
143 npt2seconds(embedObj.getTimeReq().split('/')[0]);
145 slide: function(event, ui) {
146 var perc = ui.value/1000;
147 embedObj.jump_time = seconds2npt( parseFloat( parseFloat(embedObj.getDuration()) * perc ) + embedObj.start_time_sec);
148 //js_log('perc:' + perc + ' * ' + embedObj.getDuration() + ' jt:'+ this.jump_time);
149 embedObj.setStatus( gM('mwe-seek_to')+' '+embedObj.jump_time );
150 //update the thumbnail / frame
151 if(embedObj.isPlaying==false){
152 embedObj.updateThumbPerc( perc );
155 change:function(event, ui){
156 //only run the onChange event if done by a user slide:
157 if(embedObj.userSlide){
158 embedObj.userSlide=false;
159 embedObj.seeking=true;
160 //stop the monitor timer (if we can)
161 if(embedObj.stopMonitor)
162 embedObj.stopMonitor();
164 var perc = ui.value/1000;
165 //set seek time (in case we have to do a url seek)
166 embedObj.seek_time_sec = npt2seconds( embedObj.jump_time, true );
167 js_log('do jump to: '+embedObj.jump_time + ' perc:' +perc + ' sts:' + embedObj.seek_time_sec);
168 embedObj.doSeek(perc);
172 //up the z-index of the default status indicator:
173 $j('#mv_play_head_'+embedObj.id + ' .ui-slider-handle').css('z-index', 4);
174 $j('#mv_play_head_'+embedObj.id + ' .ui-slider-range').addClass('ui-corner-all').css('z-index', 2);
175 //extended class list for jQuery ui themeing (we can probably refactor this with custom buffering highliter)
176 $j('#mv_play_head_'+embedObj.id).append( ctrlBuilder.getMvBufferHtml() );
179 $j('#mv_vid_options_'+ctrlBuilder.id+' .vo_selection').click(function(){
180 embedObj.selectPlaybackMethod();
181 $j('#mv_vid_options_'+ctrlBuilder.id).hide();
184 $j('#mv_vid_options_'+ctrlBuilder.id+' .vo_download').click(function(){
185 embedObj.showVideoDownload();
186 $j('#mv_vid_options_'+ctrlBuilder.id).hide();
189 $j('#mv_vid_options_'+ctrlBuilder.id+' .vo_showcode').click(function(){
190 embedObj.showEmbedCode();
191 $j('#mv_vid_options_'+ctrlBuilder.id).hide();
196 var hoverOverDelay=false;
197 $j('#volume_control_'+embedObj.id).unbind().btnBind().click(function(){
198 $j('#' +embedObj.id).get(0).toggleMute();
201 $j('#vol_container_' + embedObj.id).addClass('vol_container_top');
202 //set to "below" if playing and embedType != native
203 if(embedObj && embedObj.isPlaying && embedObj.isPlaying() && !embedObj.supports['overlays']){
204 $j('#vol_container_' + embedObj.id).removeClass('vol_container_top').addClass('vol_container_below');
207 $j('#vol_container_' + embedObj.id).fadeIn('fast');
208 hoverOverDelay = true;
211 hoverOverDelay= false;
212 setTimeout(function doHideVolume(){
214 $j('#vol_container_' + embedObj.id).fadeOut('fast');
220 $j('#volume_bar_'+embedObj.id).slider({
221 orientation: "vertical",
226 slide: function(event, ui) {
227 var perc = ui.value/100;
228 //js_log('update volume:' + perc);
229 embedObj.updateVolumen(perc);
231 change:function(event, ui){
232 var perc = ui.value/100;
234 $j('#volume_control_'+embedObj.id + ' span').removeClass('ui-icon-volume-on').addClass('ui-icon-volume-off');
236 $j('#volume_control_'+embedObj.id + ' span').removeClass('ui-icon-volume-off').addClass('ui-icon-volume-on');
238 //only run the onChange event if done by a user slide:
239 if(embedObj.userSlide){
240 embedObj.userSlide=false;
241 embedObj.seeking=true;
242 var perc = ui.value/100;
243 embedObj.updateVolumen(perc);
249 getMvBufferHtml:function(){
250 return '<div class="ui-slider-range ui-slider-range-min ui-widget-header ' +
251 'ui-state-highlight ui-corner-all '+
252 'mv_buffer" style="width:0px;height:100%;z-index:1;top:0px" />';
261 'mv_embedded_options':{
264 var o= '<div id="mv_vid_options_'+ctrlBuilder.id+'" class="videoOptions">'+
265 '<div class="videoOptionsTop"></div>'+
266 '<div class="videoOptionsBox">'+
267 '<div class="block">'+
268 '<h6>Video Options</h6>'+
270 '<div class="block">'+
271 '<p class="short_match vo_selection"><a href="#"><span>'+gM('mwe-chose_player')+'</span></a></p>'+
272 '<p class="short_match vo_download"><a href="#"><span>'+gM('mwe-download')+'</span></a></p>'+
273 '<p class="short_match vo_showcode"><a href="#"><span>'+gM('mwe-share')+'</span></a></p>';
275 //link to the stream page if we are not already there:
276 if( ctrlBuilder.embedObj.roe && typeof mv_stream_interface == 'undefined' )
277 o+='<p class="short_match"><a href="javascript:$j(\'#'+ctrlBuilder.id+'\').get(0).doLinkBack()"><span><strong>Source Page</strong></span></a></p>';
280 '</div><!--videoOptionsInner-->' +
281 '<div class="videoOptionsBot"></div>' +
282 '</div><!--videoOptions-->';
289 return '<div title="' + gM('mwe-player_fullscreen') + '" id="fullscreen_'+ctrlBuilder.id+'" class="ui-state-default ui-corner-all ui-icon_link rButton"><span class="ui-icon ui-icon-arrow-4-diag"></span></div>'
295 return '<div title="'+ gM('mwe-player_options') + '" id="options_button_'+ctrlBuilder.id+'" class="ui-state-default ui-corner-all ui-icon_link rButton"><span class="ui-icon ui-icon-wrench"></span></div>';
301 return '<div title="' + gM('mwe-play_clip') + '" id="mv_play_pause_button_' + ctrlBuilder.id + '" class="ui-state-default ui-corner-all ui-icon_link lButton"><span class="ui-icon ui-icon-play"/></div>';
307 return '<div title="' + gM('mwe-closed_captions') + '" id="timed_text_'+ctrlBuilder.id+'" class="ui-state-default ui-corner-all ui-icon_link rButton"><span class="ui-icon ui-icon-comment"></span></div>'
313 return '<div title="' + gM('mwe-volume_control') + '" id="volume_control_'+ctrlBuilder.id+'" class="ui-state-default ui-corner-all ui-icon_link rButton">' +
314 '<span class="ui-icon ui-icon-volume-on"></span>' +
315 '<div style="position:absolute;display:none;" id="vol_container_'+ctrlBuilder.id+'" class="vol_container ui-corner-all">' +
316 '<div class="volume_bar" id="volume_bar_' + ctrlBuilder.id + '"></div>' +
324 return '<div id="mv_time_'+ctrlBuilder.id+'" class="ui-widget time">' + ctrlBuilder.embedObj.getTimeReq() + '</div>';
328 'w':0, //special case (takes up remaining space)
330 return '<div class="play_head" id="mv_play_head_' + ctrlBuilder.id + '" style="width: ' + ( ctrlBuilder.available_width - 30 ) + 'px;"></div>';