| Index: branches/js2-work/phase3/js2/mwEmbed/example_usage/Player_Themable.html |
| — | — | @@ -3,8 +3,8 @@ |
| 4 | 4 | <html> |
| 5 | 5 | <head> |
| 6 | 6 | <title>Sample Themed Player</title> |
| 7 | | - <script type="text/javascript" src="../jsScriptLoader.php?class=mwEmbed&debug=true"></script> |
| 8 | | - <!-- <script type="text/javascript" src="../mwEmbed.js?debug=true"></script> --> |
| | 7 | + <!--<script type="text/javascript" src="../jsScriptLoader.php?class=mwEmbed&debug=true"></script> --> |
| | 8 | + <script type="text/javascript" src="../mwEmbed.js?debug=true"></script> |
| 9 | 9 | </head> |
| 10 | 10 | <script type="text/javascript"> |
| 11 | 11 | </script> |
| Index: branches/js2-work/phase3/js2/mwEmbed/libEmbedPlayer/embedPlayer.js |
| — | — | @@ -370,16 +370,19 @@ |
| 371 | 371 | } |
| 372 | 372 | } |
| 373 | 373 | |
| 374 | | - // Firefox gives bogus css values if video has not loaded metadata yet: |
| 375 | | - // But it does set attr to -1 so we check that and delay |
| 376 | | - // swaping in the player interface which calls playerSize |
| | 374 | + // Firefox gives 300x150 css values OR -1 if video has not loaded metadata yet: |
| | 375 | + // We check that and delay swaping in the player interface |
| 377 | 376 | var waitForMeta = ( |
| 378 | 377 | ( |
| 379 | | - $j(element).attr('width') == -1 || |
| 380 | | - $j(element).attr('height') == -1 |
| 381 | | - ) |
| | 378 | + ( |
| | 379 | + $j(element).attr('width') == -1 || |
| | 380 | + $j(element).attr('height') == -1 |
| | 381 | + ) |
| | 382 | + || |
| | 383 | + ( this.height == 150 && this.width == 300 ) |
| | 384 | + ) |
| 382 | 385 | && |
| 383 | | - // If media has video/audio "sources" wait for meta |
| | 386 | + // If media has video/audio "sources" wait for meta: |
| 384 | 387 | ( |
| 385 | 388 | $j(element).attr('src') || |
| 386 | 389 | $j(element).find("source[src]").filter('[type^=video],[type^=audio]').length != 0 |
| — | — | @@ -619,9 +622,9 @@ |
| 620 | 623 | |
| 621 | 624 | /** |
| 622 | 625 | * Update Source title via Element |
| 623 | | - * @param Element: |
| | 626 | + * @param {Element} element Source element to update attributes from |
| 624 | 627 | */ |
| 625 | | - updateSource:function( element ) { |
| | 628 | + updateSource: function( element ) { |
| 626 | 629 | // for now just update the title: |
| 627 | 630 | if ( $j( element ).attr( "title" ) ) |
| 628 | 631 | this.title = $j( element ).attr( "title" ); |
| — | — | @@ -632,7 +635,7 @@ |
| 633 | 636 | * @param {String} start_time: in NPT format |
| 634 | 637 | * @param {String} end_time: in NPT format |
| 635 | 638 | */ |
| 636 | | - updateSrcTime:function ( start_npt, end_npt ) { |
| | 639 | + updateSrcTime: function ( start_npt, end_npt ) { |
| 637 | 640 | // mw.log("f:updateSrcTime: "+ start_npt+'/'+ end_npt + ' from org: ' + this.start_npt+ '/'+this.end_npt); |
| 638 | 641 | // mw.log("pre uri:" + this.src); |
| 639 | 642 | // if we have time we can use: |
| — | — | @@ -722,8 +725,8 @@ |
| 723 | 726 | }, |
| 724 | 727 | |
| 725 | 728 | /** Index accessor function. |
| 726 | | - @return the source's index within the enclosing mediaElement container. |
| 727 | | - @type Integer |
| | 729 | + * @return the source's index within the enclosing mediaElement container. |
| | 730 | + * @type Integer |
| 728 | 731 | */ |
| 729 | 732 | getIndex : function() { |
| 730 | 733 | return this.index; |
| — | — | @@ -803,8 +806,7 @@ |
| 804 | 807 | * @param {element} video_element <video> element used for initialization. |
| 805 | 808 | * @constructor |
| 806 | 809 | */ |
| 807 | | -function mediaElement( element ) |
| 808 | | -{ |
| | 810 | +function mediaElement( element ){ |
| 809 | 811 | this.init( element ); |
| 810 | 812 | }; |
| 811 | 813 | |
| — | — | @@ -1277,16 +1279,10 @@ |
| 1278 | 1280 | * |
| 1279 | 1281 | * @param {Element} element Source element to grab size from |
| 1280 | 1282 | */ |
| 1281 | | - setPlayerSize:function( element ){ |
| | 1283 | + setPlayerSize:function( element ){ |
| 1282 | 1284 | this['height'] = parseInt( $j(element).css( 'height' ).replace( 'px' , '' ) ); |
| 1283 | | - this['width'] = parseInt( $j(element).css( 'width' ).replace( 'px' , '' ) ); |
| | 1285 | + this['width'] = parseInt( $j(element).css( 'width' ).replace( 'px' , '' ) ); |
| 1284 | 1286 | |
| 1285 | | - // Special case of default mozilla video tag size (use our default instead of 150x300 ) |
| 1286 | | - if( this.height == 150 && this.width == 300 ){ |
| 1287 | | - this.height = null; |
| 1288 | | - this.width = null; |
| 1289 | | - } |
| 1290 | | - |
| 1291 | 1287 | if( ! this['height'] && ! this['width'] ){ |
| 1292 | 1288 | this['height'] = parseInt( $j(element).attr( 'height' ) ); |
| 1293 | 1289 | this['width'] = parseInt( $j(element).attr( 'width' ) ); |
| — | — | @@ -1304,9 +1300,9 @@ |
| 1305 | 1301 | } |
| 1306 | 1302 | |
| 1307 | 1303 | // On load sometimes attr is temporally -1 as we don't have video metadata yet. |
| 1308 | | - // NOTE: this edge case should be hanndled by waiting for metadata |
| 1309 | | - // in browsers that support metadata for the selected video type. |
| 1310 | | - if( this['height'] == -1 || this['width'] == -1 ){ |
| | 1304 | + // NOTE: this edge case should be handled by waiting for metadata see: "waitForMeta" in addElement |
| | 1305 | + if( ( !this['height'] || !this['width'] ) || |
| | 1306 | + ( this['height'] == -1 || this['width'] == -1 ) ){ |
| 1311 | 1307 | var defaultSize = mw.getConfig( 'video_size' ).split( 'x' ); |
| 1312 | 1308 | this['width'] = defaultSize[0]; |
| 1313 | 1309 | // Special height default for audio tag ( if not set ) |
| — | — | @@ -2327,7 +2323,7 @@ |
| 2328 | 2324 | 'top' : ( loc.top + playerHeight + 4) + 'px', |
| 2329 | 2325 | 'left' : ( parseInt( loc.left ) + parseInt( _this.width ) - 200) + 'px', |
| 2330 | 2326 | 'height' : '200px', |
| 2331 | | - 'width' : '200px', |
| | 2327 | + 'width' : '200px' |
| 2332 | 2328 | } ).hide() |
| 2333 | 2329 | ); |
| 2334 | 2330 | } |
| — | — | @@ -2575,8 +2571,9 @@ |
| 2576 | 2572 | * seeking =false |
| 2577 | 2573 | * paused = false |
| 2578 | 2574 | * Updates pause button |
| | 2575 | + * Starts the "monitor" |
| 2579 | 2576 | */ |
| 2580 | | - play : function() { |
| | 2577 | + play: function() { |
| 2581 | 2578 | var eid = ( this.pc != null ) ? this.pc.pp.id:this.id; |
| 2582 | 2579 | |
| 2583 | 2580 | // check if thumbnail is being displayed and embed html |
| — | — | @@ -2599,8 +2596,7 @@ |
| 2600 | 2597 | $j( '#' + eid + ' .play-btn span' ).removeClass( 'ui-icon-play' ).addClass( 'ui-icon-pause' ); |
| 2601 | 2598 | $j( '#' + eid + ' .play-btn' ).unbind().btnBind().click( function() { |
| 2602 | 2599 | $j( '#' + eid ).get( 0 ).pause(); |
| 2603 | | - } ).attr( 'title', gM( 'mwe-pause_clip' ) ); |
| 2604 | | - |
| | 2600 | + } ).attr( 'title', gM( 'mwe-pause_clip' ) ); |
| 2605 | 2601 | }, |
| 2606 | 2602 | |
| 2607 | 2603 | /** |
| Index: branches/js2-work/phase3/js2/mwEmbed/libEmbedPlayer/vlcEmbed.js |
| — | — | @@ -4,7 +4,11 @@ |
| 5 | 5 | * assume version > 0.8.5.1 |
| 6 | 6 | */ |
| 7 | 7 | var vlcEmbed = { |
| | 8 | + |
| | 9 | + //Instance Name: |
| 8 | 10 | instanceOf : 'vlcEmbed', |
| | 11 | + |
| | 12 | + //What the vlc player / plug-in supports: |
| 9 | 13 | supports : { |
| 10 | 14 | 'play_head':true, |
| 11 | 15 | 'pause':true, |
| — | — | @@ -16,18 +20,30 @@ |
| 17 | 21 | 'playlist_driver':true, // if the object supports playlist functions |
| 18 | 22 | 'overlay':false |
| 19 | 23 | }, |
| 20 | | - // init vars: |
| 21 | | - monitorTimerId : 0, |
| | 24 | + |
| | 25 | + // The previus state of the player instance |
| 22 | 26 | prevState : 0, |
| 23 | | - pejs_count:0, // post embed js count |
| 24 | | - |
| | 27 | + |
| | 28 | + // Counter for waiting for vlc embed to be ready |
| | 29 | + waitForVlcCount:0, |
| | 30 | + |
| | 31 | + /** |
| | 32 | + * Get embed HTML |
| | 33 | + */ |
| 25 | 34 | getEmbedHTML: function() { |
| | 35 | + var _this = this; |
| 26 | 36 | // give VLC 150ms to initialize before we start playback |
| 27 | 37 | // @@todo should be able to do this as an ready event |
| 28 | | - this.pejs_count = 0; |
| 29 | | - setTimeout( 'document.getElementById(\'' + this.id + '\').postEmbedJS()', 150 ); |
| | 38 | + this.waitForVlcCount = 0; |
| | 39 | + setTimeout( function(){ |
| | 40 | + _this.postEmbedJS(); |
| | 41 | + }, 150 ); |
| 30 | 42 | return this.getEmbedObj(); |
| 31 | 43 | }, |
| | 44 | + |
| | 45 | + /** |
| | 46 | + * Function to get embed object code |
| | 47 | + */ |
| 32 | 48 | getEmbedObj:function() { |
| 33 | 49 | var embed_code = '<object classid="clsid:9BE31822-FDAD-461B-AD51-BE1D1C159921" ' + |
| 34 | 50 | 'codebase="http://downloads.videolan.org/pub/videolan/vlc/latest/win32/axvlc.cab#Version=0,8,6,0" ' + |
| — | — | @@ -50,73 +66,84 @@ |
| 51 | 67 | return embed_code; |
| 52 | 68 | }, |
| 53 | 69 | |
| 54 | | - /* |
| 55 | | - * some java script to start vlc playback after the embed: |
| | 70 | + /** |
| | 71 | + * Javascript to run post vlc embedding |
| | 72 | + * Inserts the requested src to the embed instance |
| 56 | 73 | */ |
| 57 | 74 | postEmbedJS: function() { |
| 58 | | - // load a pointer to the vlc into the object (this.vlc) |
| 59 | | - this.getVLC(); |
| 60 | | - if ( this.vlc.log ) { |
| | 75 | + var _this = this; |
| | 76 | + // load a pointer to the vlc into the object (this.playerElement) |
| | 77 | + this.getPlayerElement(); |
| | 78 | + if ( this.playerElement.log ) { |
| 61 | 79 | // manipulate the dom object to make sure vlc has the correct size: |
| 62 | | - this.vlc.style.width = this.width; |
| 63 | | - this.vlc.style.height = this.height; |
| 64 | | - this.vlc.playlist.items.clear(); |
| | 80 | + this.playerElement.style.width = this.width; |
| | 81 | + this.playerElement.style.height = this.height; |
| | 82 | + this.playerElement.playlist.items.clear(); |
| 65 | 83 | var src = mw.absoluteUrl( this.getSrc() ) ; |
| 66 | 84 | // @@todo if client supports seeking no need to send seek_offset to URI |
| 67 | 85 | mw.log( 'vlc play::' + src ); |
| 68 | | - var itemId = this.vlc.playlist.add( src ); |
| | 86 | + var itemId = this.playerElement.playlist.add( src ); |
| 69 | 87 | if ( itemId != -1 ) { |
| 70 | | - // play |
| 71 | | - this.vlc.playlist.playItem( itemId ); |
| | 88 | + // Play |
| | 89 | + this.playerElement.playlist.playItem( itemId ); |
| 72 | 90 | } else { |
| 73 | 91 | mw.log( "error:cannot play at the moment !" ); |
| 74 | | - } |
| 75 | | - // if controls enabled start up javascript interface and monitor: |
| 76 | | - if ( this.controls ) { |
| 77 | | - // activate the slider: scriptaculus based) |
| 78 | | - // this.activateSlider(); |
| 79 | | - // start doing status updates every 1/10th of a second |
| 80 | | - } |
| 81 | | - setTimeout( '$j(\'#' + this.id + '\').get(0).monitor()', 100 ); |
| | 92 | + } |
| | 93 | + setTimeout( function(){ |
| | 94 | + _this.monitor(); |
| | 95 | + }, 100 ); |
| 82 | 96 | } else { |
| 83 | 97 | mw.log( 'postEmbedJS:vlc not ready' ); |
| 84 | | - this.pejs_count++; |
| 85 | | - if ( this.pejs_count < 10 ) { |
| 86 | | - setTimeout( 'document.getElementById(\'' + this.id + '\').postEmbedJS()', 100 ); |
| | 98 | + this.waitForVlcCount++; |
| | 99 | + if ( this.waitForVlcCount < 10 ) { |
| | 100 | + setTimeout( function(){ |
| | 101 | + _this.postEmbedJS(); |
| | 102 | + }, 100 ); |
| 87 | 103 | } else { |
| 88 | 104 | mw.log( 'vlc never ready' ); |
| 89 | 105 | } |
| 90 | 106 | } |
| 91 | 107 | }, |
| 92 | | - // disable local seeking (while we don't know what we have avaliable) |
| 93 | | - doSeek : function( perc ) { |
| 94 | | - this.getVLC(); |
| | 108 | + |
| | 109 | + /** |
| | 110 | + * Handles seek requests based on temporal media source type support |
| | 111 | + * |
| | 112 | + * @param {Float} percent Seek to this percent of the stream |
| | 113 | + */ |
| | 114 | + doSeek : function( percent ) { |
| | 115 | + this.getPlayerElement(); |
| 95 | 116 | if ( this.supportsURLTimeEncoding() ) { |
| 96 | | - this.parent_doSeek( perc ); |
| 97 | | - } else if ( this.vlc ) { |
| | 117 | + this.parent_doSeek( percent ); |
| | 118 | + } else if ( this.playerElement ) { |
| 98 | 119 | this.seeking = true; |
| 99 | | - mw.log( "do vlc http seek to: " + perc ) |
| 100 | | - if ( ( this.vlc.input.state == 3 ) && ( this.vlc.input.position != perc ) ) |
| | 120 | + mw.log( "do vlc http seek to: " + percent ) |
| | 121 | + if ( ( this.playerElement.input.state == 3 ) && ( this.playerElement.input.position != percent ) ) |
| 101 | 122 | { |
| 102 | | - this.vlc.input.position = perc; |
| | 123 | + this.playerElement.input.position = percent; |
| 103 | 124 | this.setStatus( 'seeking...' ); |
| 104 | 125 | } |
| 105 | 126 | } else { |
| 106 | | - this.doPlayThenSeek( perc ); |
| | 127 | + this.doPlayThenSeek( percent ); |
| 107 | 128 | } |
| 108 | 129 | this.parent_monitor(); |
| 109 | 130 | }, |
| 110 | | - doPlayThenSeek:function( perc ) { |
| | 131 | + |
| | 132 | + /** |
| | 133 | + * Issues a play request then seeks to a given time |
| | 134 | + * |
| | 135 | + * @param {Float} percent Seek to this percent of the stream after playing |
| | 136 | + */ |
| | 137 | + doPlayThenSeek:function( percent ) { |
| 111 | 138 | mw.log( 'doPlayThenSeekHack' ); |
| 112 | 139 | var _this = this; |
| 113 | 140 | this.play(); |
| 114 | 141 | var rfsCount = 0; |
| 115 | 142 | var readyForSeek = function() { |
| 116 | | - _this.getVLC(); |
| 117 | | - var newState = _this.vlc.input.state; |
| | 143 | + _this.getPlayerElement(); |
| | 144 | + var newState = _this.playerElement.input.state; |
| 118 | 145 | // if playing we are ready to do the |
| 119 | 146 | if ( newState == 3 ) { |
| 120 | | - _this.doSeek( perc ); |
| | 147 | + _this.doSeek( percent ); |
| 121 | 148 | } else { |
| 122 | 149 | // try to get player for 10 seconds: |
| 123 | 150 | if ( rfsCount < 200 ) { |
| — | — | @@ -128,25 +155,22 @@ |
| 129 | 156 | } |
| 130 | 157 | } |
| 131 | 158 | readyForSeek(); |
| 132 | | - }, |
| 133 | | - playMovieAt: function ( order ) { |
| 134 | | - // @@todo add clips to playlist after (order) and then play |
| 135 | | - this.play(); |
| 136 | | - }, |
| 137 | | - /* |
| 138 | | - * updates the status time |
| | 159 | + }, |
| | 160 | + |
| | 161 | + /** |
| | 162 | + * Updates the status time and player state |
| 139 | 163 | */ |
| 140 | 164 | monitor: function() { |
| 141 | | - this.getVLC(); |
| 142 | | - if ( !this.vlc ) |
| | 165 | + this.getPlayerElement(); |
| | 166 | + if ( !this.playerElement ) |
| 143 | 167 | return ; |
| 144 | | - if ( this.vlc.log ) { |
| 145 | | - // mw.log( 'state:' + this.vlc.input.state); |
| 146 | | - // mw.log('time: ' + this.vlc.input.time); |
| 147 | | - // mw.log('pos: ' + this.vlc.input.position); |
| 148 | | - if ( this.vlc.log.messages.count > 0 ) { |
| | 168 | + if ( this.playerElement.log ) { |
| | 169 | + // mw.log( 'state:' + this.playerElement.input.state); |
| | 170 | + // mw.log('time: ' + this.playerElement.input.time); |
| | 171 | + // mw.log('pos: ' + this.playerElement.input.position); |
| | 172 | + if ( this.playerElement.log.messages.count > 0 ) { |
| 149 | 173 | // there is one or more messages in the log |
| 150 | | - var iter = this.vlc.log.messages.iterator(); |
| | 174 | + var iter = this.playerElement.log.messages.iterator(); |
| 151 | 175 | while ( iter.hasNext ) { |
| 152 | 176 | var msg = iter.next(); |
| 153 | 177 | var msgtype = msg.type.toString(); |
| — | — | @@ -156,9 +180,9 @@ |
| 157 | 181 | } |
| 158 | 182 | } |
| 159 | 183 | // clear the log once finished to avoid clogging |
| 160 | | - this.vlc.log.messages.clear(); |
| | 184 | + this.playerElement.log.messages.clear(); |
| 161 | 185 | } |
| 162 | | - var newState = this.vlc.input.state; |
| | 186 | + var newState = this.playerElement.input.state; |
| 163 | 187 | if ( this.prevState != newState ) { |
| 164 | 188 | if ( newState == 0 ) |
| 165 | 189 | { |
| — | — | @@ -180,8 +204,7 @@ |
| 181 | 205 | // current media is now playing |
| 182 | 206 | this.onPlay(); |
| 183 | 207 | } |
| 184 | | - else if ( this.vlc.input.state == 4 ) |
| 185 | | - { |
| | 208 | + else if ( this.playerElement.input.state == 4 ){ |
| 186 | 209 | // current media is now paused |
| 187 | 210 | this.onPause(); |
| 188 | 211 | } |
| — | — | @@ -194,7 +217,11 @@ |
| 195 | 218 | // update the status and check timmer via universal parent monitor |
| 196 | 219 | this.parent_monitor(); |
| 197 | 220 | }, |
| 198 | | - /* events */ |
| | 221 | + |
| | 222 | + /** |
| | 223 | + * Events: |
| | 224 | + * @@note: should be localized: |
| | 225 | + */ |
| 199 | 226 | onOpen: function() { |
| 200 | 227 | this.setStatus( "Opening..." ); |
| 201 | 228 | }, |
| — | — | @@ -203,17 +230,16 @@ |
| 204 | 231 | }, |
| 205 | 232 | onPlay: function() { |
| 206 | 233 | this.onPlaying(); |
| 207 | | - }, |
| 208 | | - liveFeedRoll: 0, |
| | 234 | + }, |
| 209 | 235 | onPlaying: function() { |
| 210 | 236 | this.seeking = false; |
| 211 | 237 | // for now trust the duration from url over vlc input.length |
| 212 | | - if ( !this.getDuration() && this.vlc.input.length > 0 ) |
| | 238 | + if ( !this.getDuration() && this.playerElement.input.length > 0 ) |
| 213 | 239 | { |
| 214 | | - // mw.log('setting duration to ' + this.vlc.input.length /1000); |
| 215 | | - this.duration = this.vlc.input.length / 1000; |
| | 240 | + // mw.log('setting duration to ' + this.playerElement.input.length /1000); |
| | 241 | + this.duration = this.playerElement.input.length / 1000; |
| 216 | 242 | } |
| 217 | | - this.currentTime = this.vlc.input.time / 1000; |
| | 243 | + this.currentTime = this.playerElement.input.time / 1000; |
| 218 | 244 | }, |
| 219 | 245 | onPause: function() { |
| 220 | 246 | this.parent_pause(); // update the inteface if paused via native control |
| — | — | @@ -223,75 +249,91 @@ |
| 224 | 250 | if ( !this.seeking ) |
| 225 | 251 | this.onClipDone(); |
| 226 | 252 | }, |
| 227 | | - /* js hooks/controls */ |
| | 253 | + |
| | 254 | + /** |
| | 255 | + * Handles play requests |
| | 256 | + */ |
| 228 | 257 | play : function() { |
| 229 | | - mw.log( 'f:vlcPlay' ); |
| 230 | | - this.getVLC(); |
| 231 | | - // call the parent |
| | 258 | + mw.log( 'f:vlcPlay' ); |
| | 259 | + // Call the parent |
| 232 | 260 | this.parent_play(); |
| 233 | | - if ( this.vlc ) { |
| | 261 | + if ( this.getPlayerElement() ) { |
| 234 | 262 | // plugin is already being present send play call: |
| 235 | 263 | // clear the message log and enable error logging |
| 236 | | - if ( this.vlc.log ) { |
| 237 | | - this.vlc.log.messages.clear(); |
| | 264 | + if ( this.playerElement.log ) { |
| | 265 | + this.playerElement.log.messages.clear(); |
| 238 | 266 | } |
| 239 | | - if ( this.vlc.playlist ) |
| 240 | | - this.vlc.playlist.play(); |
| | 267 | + if ( this.playerElement.playlist && typeof this.playerElement.playlist.play == 'function') |
| | 268 | + this.playerElement.playlist.play(); |
| 241 | 269 | |
| | 270 | + if( typeof this.playerElement.play == 'function' ) |
| | 271 | + this.playerElement.play(); |
| | 272 | + |
| | 273 | + this.paused = false; |
| | 274 | + |
| | 275 | + // re-start the monitor: |
| 242 | 276 | this.monitor(); |
| 243 | | - this.paused = false; |
| 244 | 277 | } |
| 245 | 278 | }, |
| 246 | | - stop : function() { |
| 247 | | - if ( this.vlc ) { |
| 248 | | - if ( typeof this.vlc != 'undefined' ) { |
| 249 | | - if ( typeof this.vlc.playlist != 'undefined' ) { |
| 250 | | - // dont' stop (issues all the plugin-stop actions) |
| 251 | | - // this.vlc.playlist.stop(); |
| 252 | | - if ( this.monitorTimerId != 0 ) |
| 253 | | - { |
| 254 | | - clearInterval( this.monitorTimerId ); |
| 255 | | - this.monitorTimerId = 0; |
| 256 | | - } |
| 257 | | - } |
| 258 | | - } |
| 259 | | - } |
| 260 | | - // this.onStop(); |
| 261 | | - // do parent stop |
| 262 | | - this.parent_stop(); |
| 263 | | - }, |
| | 279 | + |
| | 280 | + /** |
| | 281 | + * Passes the Pause request to the plugin. |
| | 282 | + * calls parent "pause" to update interface |
| | 283 | + */ |
| 264 | 284 | pause : function() { |
| 265 | 285 | this.parent_pause(); // update the interface if paused via native control |
| 266 | | - if ( this.vlc ) { |
| 267 | | - this.vlc.playlist.togglePause(); |
| | 286 | + if ( this.getPlayerElement() ) { |
| | 287 | + this.playerElement.playlist.togglePause(); |
| 268 | 288 | } |
| 269 | 289 | }, |
| | 290 | + |
| | 291 | + /** |
| | 292 | + * Mutes the video |
| | 293 | + * calls parent "toggleMute" to update interface |
| | 294 | + */ |
| 270 | 295 | toggleMute:function() { |
| 271 | 296 | this.parent_toggleMute(); |
| 272 | | - this.getVLC(); |
| 273 | | - if ( this.vlc ) |
| 274 | | - this.vlc.audio.toggleMute(); |
| | 297 | + if ( this.getPlayerElement() ) |
| | 298 | + this.playerElement.audio.toggleMute(); |
| 275 | 299 | }, |
| 276 | | - // @@ Support UpDateVolumen |
| 277 | | - updateVolumen:function( perc ) { |
| 278 | | - this.getVLC(); |
| 279 | | - if ( this.vlc ) |
| 280 | | - this.vlc.audio.volume = perc * 100; |
| | 300 | + |
| | 301 | + /** |
| | 302 | + * Update the player volume |
| | 303 | + * @pram {Float} percent Percet of total volume |
| | 304 | + */ |
| | 305 | + updateVolumen:function( percent ) { |
| | 306 | + if ( this.getPlayerElement() ) |
| | 307 | + this.playerElement.audio.volume = percent * 100; |
| 281 | 308 | }, |
| 282 | | - // @@ Get Volumen |
| 283 | | - getVolumen:function() { |
| 284 | | - this.getVLC(); |
| 285 | | - if ( this.vlc ) |
| 286 | | - return this.vlc.audio.volume / 100; |
| | 309 | + |
| | 310 | + /** |
| | 311 | + * Gets the current volume |
| | 312 | + * @return percent Percet of total volume |
| | 313 | + * @type {Float} |
| | 314 | + */ |
| | 315 | + getVolumen:function() { |
| | 316 | + if ( this.getPlayerElement() ) |
| | 317 | + return this.playerElement.audio.volume / 100; |
| 287 | 318 | }, |
| | 319 | + |
| | 320 | + /** |
| | 321 | + * Passes fullscreen request to plugin |
| | 322 | + */ |
| 288 | 323 | fullscreen : function() { |
| 289 | | - if ( this.vlc ) { |
| 290 | | - if ( this.vlc.video ) |
| 291 | | - this.vlc.video.toggleFullscreen(); |
| | 324 | + if ( this.playerElement ) { |
| | 325 | + if ( this.playerElement.video ) |
| | 326 | + this.playerElement.video.toggleFullscreen(); |
| 292 | 327 | } |
| 293 | | - }, |
| 294 | | - // get the embed vlc object |
| 295 | | - getVLC : function() { |
| 296 | | - this.vlc = $j('#' + this.pid ).get(0); |
| | 328 | + }, |
| | 329 | + |
| | 330 | + /** |
| | 331 | + * Get the embed vlc object |
| | 332 | + */ |
| | 333 | + getPlayerElement : function() { |
| | 334 | + this.playerElement = $j('#' + this.pid ).get(0); |
| | 335 | + if( this.playerElement ) |
| | 336 | + return true; |
| | 337 | + else |
| | 338 | + return false; |
| 297 | 339 | } |
| 298 | 340 | }; |
| Index: branches/js2-work/phase3/js2/mwEmbed/libEmbedPlayer/nativeEmbed.js |
| — | — | @@ -21,7 +21,7 @@ |
| 22 | 22 | // NOTE: this bug workaround may no longer be applicable |
| 23 | 23 | urlAppend:'', |
| 24 | 24 | |
| 25 | | - // The previus "currentTime" to snif seek actions |
| | 25 | + // The previous "currentTime" to sniff seek actions |
| 26 | 26 | // NOTE the bug where onSeeked does not seem fire consistently may no longer be applicable |
| 27 | 27 | prevCurrentTime: -1, |
| 28 | 28 | |
| — | — | @@ -36,6 +36,7 @@ |
| 37 | 37 | 'overlays':true, |
| 38 | 38 | 'playlist_swap_loader':true // if the object supports playlist functions |
| 39 | 39 | }, |
| | 40 | + |
| 40 | 41 | /** |
| 41 | 42 | * Wraps the embed object and returns the output |
| 42 | 43 | */ |
| — | — | @@ -47,7 +48,7 @@ |
| 48 | 49 | }, |
| 49 | 50 | |
| 50 | 51 | /** |
| 51 | | - * Get the native embeed code |
| | 52 | + * Get the native embed code |
| 52 | 53 | */ |
| 53 | 54 | getEmbedObj:function() { |
| 54 | 55 | // We want to let mwEmbed handle the controls so notice the absence of control attribute |
| Index: branches/js2-work/phase3/js2/mwEmbed/php/languages/mwEmbed.i18n.php |
| — | — | @@ -340,6 +340,7 @@ |
| 341 | 341 | * js file: /skins/kskin/kskin.js |
| 342 | 342 | */ |
| 343 | 343 | 'mwe-credit-title' => 'Title: $1', |
| | 344 | + 'mwe-kaltura-platform-title' => 'Kaltura open source video platform', |
| 344 | 345 | |
| 345 | 346 | /* |
| 346 | 347 | * js file: /libEmbedPlayer/embedPlayer.js |
| Index: branches/js2-work/phase3/js2/mwEmbed/skins/kskin/kskinConfig.js |
| — | — | @@ -53,6 +53,11 @@ |
| 54 | 54 | var menuOffset = ( embedObj.getPlayerHeight() < ctrlObj.getOverlayHeight() ) ? |
| 55 | 55 | 'top:' + ( embedObj.getPlayerHeight() + ctrlObj.getControlBarHeight() ) + 'px;' : ''; |
| 56 | 56 | |
| | 57 | + // Special common overflow hack: |
| | 58 | + // NOTE: should refactor to just append menu to top body when it does not "fit" in the player |
| | 59 | + if( menuOffset != '' ) |
| | 60 | + $j( embedObj ).parents( '.thumbinner' ).css( 'overflow', 'visible' ); |
| | 61 | + |
| 57 | 62 | var o = '' + |
| 58 | 63 | '<div class="k-menu ui-widget-content" ' + |
| 59 | 64 | 'style="width:' + ctrlObj.getOverlayWidth() + 'px; height:' + ctrlObj.getOverlayHeight() + 'px;' + menuOffset + '">' + |
| — | — | @@ -126,8 +131,8 @@ |
| 127 | 132 | } ); |
| 128 | 133 | $tp.find( '.play-btn-large' ).fadeOut( 'fast' ); |
| 129 | 134 | } |
| 130 | | - } ); |
| 131 | | - |
| | 135 | + } ); |
| | 136 | + |
| 132 | 137 | }, |
| 133 | 138 | |
| 134 | 139 | /** |
| — | — | @@ -140,11 +145,13 @@ |
| 141 | 146 | var embedObj = this.embedObj; |
| 142 | 147 | if ( $j( '#' + embedObj.id + ' .k-menu' ).length != 0 ) |
| 143 | 148 | return false; |
| 144 | | - |
| | 149 | + |
| | 150 | + |
| 145 | 151 | $tp.find( '.' + _this.parentClass ).prepend( |
| 146 | 152 | _this.components[ 'options_menu' ].o( _this ) |
| 147 | | - ); |
| | 153 | + ); |
| 148 | 154 | |
| | 155 | + |
| 149 | 156 | // By default its hidden: |
| 150 | 157 | $tp.find( '.k-menu' ).hide(); |
| 151 | 158 | |
| Index: branches/js2-work/phase3/js2/mwEmbed/skins/kskin/playerSkin.css |
| — | — | @@ -60,8 +60,10 @@ |
| 61 | 61 | background-position: -16px -17px; |
| 62 | 62 | } |
| 63 | 63 | |
| 64 | | -.k-player .control-bar { |
| 65 | | - border: 0px; |
| | 64 | +.k-player .control-bar { |
| | 65 | + border:1px solid #c8c8c8; |
| | 66 | + border-top: 0px; |
| | 67 | + border-right: 0px; |
| 66 | 68 | height: 21px; |
| 67 | 69 | padding: 2px 0 0 6px; |
| 68 | 70 | margin-top: 0px; |
| — | — | @@ -123,7 +125,7 @@ |
| 124 | 126 | cursor: pointer; |
| 125 | 127 | float: right; |
| 126 | 128 | list-style: none outside none; |
| 127 | | - margin: 2px; |
| | 129 | + margin: 1px; |
| 128 | 130 | padding: 0px 0; |
| 129 | 131 | width: 23px; |
| 130 | 132 | height: 16px; |
| Index: branches/js2-work/phase3/js2/mwEmbed/skins/ctrlBuilder.js |
| — | — | @@ -19,7 +19,7 @@ |
| 20 | 20 | // Parent css Class name |
| 21 | 21 | parentClass : 'mv-player', |
| 22 | 22 | |
| 23 | | - // Long string dsipaly of time value |
| | 23 | + // Long string display of time value |
| 24 | 24 | long_time_disp: true, |
| 25 | 25 | |
| 26 | 26 | // If the options menu outside of player |
| — | — | @@ -303,7 +303,7 @@ |
| 304 | 304 | } |
| 305 | 305 | |
| 306 | 306 | // If the resolution is too small don't display the warning |
| 307 | | - if( this.embedObj.getPlayerHeight < 199 ) |
| | 307 | + if( this.embedObj.getPlayerHeight() < 199 ) |
| 308 | 308 | return false; |
| 309 | 309 | |
| 310 | 310 | // See if we have native support for ogg: |
| — | — | @@ -484,6 +484,18 @@ |
| 485 | 485 | }, |
| 486 | 486 | |
| 487 | 487 | /** |
| | 488 | + * The options button, invokes display of the options menu |
| | 489 | + */ |
| | 490 | + 'options': { |
| | 491 | + 'w':26, |
| | 492 | + 'o':function( ctrlObj ) { |
| | 493 | + return '<div title="' + gM( 'mwe-player_options' ) + '" class="ui-state-default ui-corner-all ui-icon_link rButton options-btn">' + |
| | 494 | + '<span class="ui-icon ui-icon-wrench"></span>' + |
| | 495 | + '</div>'; |
| | 496 | + } |
| | 497 | + }, |
| | 498 | + |
| | 499 | + /** |
| 488 | 500 | * The fullscreen button for displaying the video fullscreen |
| 489 | 501 | */ |
| 490 | 502 | 'fullscreen': { |
| — | — | @@ -495,17 +507,6 @@ |
| 496 | 508 | } |
| 497 | 509 | }, |
| 498 | 510 | |
| 499 | | - /** |
| 500 | | - * The options button, invokes display of the options menu |
| 501 | | - */ |
| 502 | | - 'options': { |
| 503 | | - 'w':26, |
| 504 | | - 'o':function( ctrlObj ) { |
| 505 | | - return '<div title="' + gM( 'mwe-player_options' ) + '" class="ui-state-default ui-corner-all ui-icon_link rButton options-btn">' + |
| 506 | | - '<span class="ui-icon ui-icon-wrench"></span>' + |
| 507 | | - '</div>'; |
| 508 | | - } |
| 509 | | - }, |
| 510 | 511 | |
| 511 | 512 | /** |
| 512 | 513 | * The pause button |
| Index: branches/js2-work/phase3/js2/mwEmbed/mwEmbed.js |
| — | — | @@ -2222,8 +2222,10 @@ |
| 2223 | 2223 | } |
| 2224 | 2224 | // Preserve any existing window.onload binding: |
| 2225 | 2225 | var mwOriginalOnLoad; |
| 2226 | | -if ( window.onload && typeof window.onload == 'function' ) { |
| | 2226 | +var mwOrgLoadCheck = false; |
| | 2227 | +if ( window.onload && typeof window.onload == 'function' && !mwOrgLoadCheck) { |
| 2227 | 2228 | mwOriginalOnLoad = window.onload; |
| | 2229 | + mwOrgLoadCheck = true; |
| 2228 | 2230 | } |
| 2229 | 2231 | // Use the onload method as a backup: |
| 2230 | 2232 | window.onload = function () { |
| Index: branches/js2-work/phase3/js2/mwEmbed/libTimedText/mw.timedText.js |
| — | — | @@ -44,8 +44,8 @@ |
| 45 | 45 | mw.log("TimedText:ShowMenu"); |
| 46 | 46 | // Get local refrence to all timed text sources |
| 47 | 47 | var cat = this.embedPlayer; |
| 48 | | - //var sources = this.embedPlayer.mediaElement.getSources( 'text' ); |
| 49 | | - // |
| | 48 | + var sources = this.embedPlayer.mediaElement.getSources( 'text' ); |
| | 49 | + debugger; |
| 50 | 50 | } |
| 51 | 51 | |
| 52 | 52 | } |