| Index: branches/js2-work/phase3/js/mwEmbed/tests/Player_Themable.html |
| — | — | @@ -31,7 +31,6 @@ |
| 32 | 32 | durationHint="60" > |
| 33 | 33 | </video> |
| 34 | 34 | |
| 35 | | - |
| 36 | 35 | <video |
| 37 | 36 | style="width:208px;height:160px;float:left" |
| 38 | 37 | src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg" |
| Index: branches/js2-work/phase3/js/mwEmbed/skins/ctrlBuilder.js |
| — | — | @@ -117,9 +117,10 @@ |
| 118 | 118 | 'height' : parseInt( embedPlayer.height ) + parseInt( this.height ) + 2 |
| 119 | 119 | } ); |
| 120 | 120 | // update the control bar display to "block" |
| 121 | | - $controlBar.css('display', 'block') |
| | 121 | + $controlBar.css( 'display', 'block' ); |
| 122 | 122 | } |
| 123 | | - // add the controls to the interface |
| | 123 | + |
| | 124 | + // Add the controls to the interface |
| 124 | 125 | embedPlayer.$interface.append( $controlBar ); |
| 125 | 126 | |
| 126 | 127 | // Add the Controls with their bindings |
| — | — | @@ -131,7 +132,7 @@ |
| 132 | 133 | |
| 133 | 134 | /** |
| 134 | 135 | * Builds the interface controls |
| 135 | | - * @returns the interface html string |
| | 136 | + * @return the interface html string |
| 136 | 137 | */ |
| 137 | 138 | addControlComponents: function( ) { |
| 138 | 139 | var _this = this; |
| — | — | @@ -162,7 +163,7 @@ |
| 163 | 164 | |
| 164 | 165 | // Output components |
| 165 | 166 | for ( var component_id in this.components ) { |
| 166 | | - |
| | 167 | + mw.log(' on componet: ' + component_id ); |
| 167 | 168 | // Check for (component === false ) and skip |
| 168 | 169 | if( this.components[ component_id ] === false ){ |
| 169 | 170 | continue; |
| — | — | @@ -357,21 +358,23 @@ |
| 358 | 359 | |
| 359 | 360 | // Bind resize resize window to resize window |
| 360 | 361 | $j( window ).resize( function() { |
| 361 | | - // UPdate interface container: |
| 362 | | - $interface.css( { |
| 363 | | - 'top' : '0px', |
| 364 | | - 'left' : '0px', |
| 365 | | - 'width' : $j( window ).width(), |
| 366 | | - 'height' : $j( window ).height() |
| 367 | | - } ) |
| 368 | | - // Update player size |
| 369 | | - $j( embedPlayer ).css( _this.getFullscreenPlayerCss() ); |
| 370 | | - |
| 371 | | - // Update play button pos |
| 372 | | - $interface.find('.play-btn-large').css( _this.getFullscreenPlayButtonCss() ); |
| 373 | | - |
| 374 | | - // Update the timed text size |
| 375 | | - $interface.find( '.itext' ).css( _this.getFullscreenTextCss() ); |
| | 362 | + if( _this.fullscreenMode ){ |
| | 363 | + // Update interface container: |
| | 364 | + $interface.css( { |
| | 365 | + 'top' : '0px', |
| | 366 | + 'left' : '0px', |
| | 367 | + 'width' : $j( window ).width(), |
| | 368 | + 'height' : $j( window ).height() |
| | 369 | + } ) |
| | 370 | + // Update player size |
| | 371 | + $j( embedPlayer ).css( _this.getFullscreenPlayerCss() ); |
| | 372 | + |
| | 373 | + // Update play button pos |
| | 374 | + $interface.find('.play-btn-large').css( _this.getFullscreenPlayButtonCss() ); |
| | 375 | + |
| | 376 | + // Update the timed text size |
| | 377 | + $interface.find( '.itext' ).css( _this.getFullscreenTextCss() ); |
| | 378 | + } |
| 376 | 379 | }); |
| 377 | 380 | |
| 378 | 381 | // Bind escape to restore clip resolution |
| — | — | @@ -859,7 +862,8 @@ |
| 860 | 863 | .addClass( 'ui-widget-overlay' ) |
| 861 | 864 | .css( { |
| 862 | 865 | 'height' : '100%', |
| 863 | | - 'width' : '100%' |
| | 866 | + 'width' : '100%', |
| | 867 | + 'z-index' : 2 |
| 864 | 868 | } ) |
| 865 | 869 | ); |
| 866 | 870 | |
| — | — | @@ -885,7 +889,7 @@ |
| 886 | 890 | 'top': '15px', |
| 887 | 891 | 'overflow' : 'auto', |
| 888 | 892 | 'padding' : '4px', |
| 889 | | - 'z-index' : 2 |
| | 893 | + 'z-index' : 3 |
| 890 | 894 | }; |
| 891 | 895 | $overlayMenu = $j('<div />') |
| 892 | 896 | .addClass( 'overlay-win ui-state-default ui-widget-header ui-corner-all' ) |
| — | — | @@ -901,7 +905,7 @@ |
| 902 | 906 | var shadowCss = jQuery.extend( true, {}, overlayMenuCss ); |
| 903 | 907 | shadowCss['height' ] = 210; |
| 904 | 908 | shadowCss['width' ] = 260; |
| 905 | | - shadowCss[ 'z-index' ] = 1; |
| | 909 | + shadowCss[ 'z-index' ] = 2; |
| 906 | 910 | $overlayShadow = $j( '<div />' ) |
| 907 | 911 | .addClass('ui-widget-shadow ui-corner-all') |
| 908 | 912 | .css( shadowCss ); |
| — | — | @@ -1296,7 +1300,7 @@ |
| 1297 | 1301 | 'zindex' : mw.getConfig( 'fullScreenIndex' ), |
| 1298 | 1302 | 'positionOpts': { |
| 1299 | 1303 | 'directionV' : 'up', |
| 1300 | | - 'offsetY' : 32, |
| | 1304 | + 'offsetY' : 30, |
| 1301 | 1305 | 'directionH' : 'left', |
| 1302 | 1306 | 'offsetX' : -28 |
| 1303 | 1307 | } |
| — | — | @@ -1385,6 +1389,7 @@ |
| 1386 | 1390 | 'volumeControl': { |
| 1387 | 1391 | 'w' : 28, |
| 1388 | 1392 | 'o' : function( ctrlObj ) { |
| | 1393 | + mw.log(' set up volume out'); |
| 1389 | 1394 | $volumeOut = $j( '<span />' ); |
| 1390 | 1395 | if ( ctrlObj.volume_layout == 'horizontal' ) { |
| 1391 | 1396 | $volumeOut.append( |
| — | — | @@ -1392,6 +1397,7 @@ |
| 1393 | 1398 | .addClass( "ui-slider ui-slider-horizontal rButton volume-slider" ) |
| 1394 | 1399 | ); |
| 1395 | 1400 | } |
| | 1401 | + mw.log(' add up volume control icon'); |
| 1396 | 1402 | // Add the volume control icon |
| 1397 | 1403 | $volumeOut.append( |
| 1398 | 1404 | $j('<div />') |
| — | — | @@ -1402,22 +1408,23 @@ |
| 1403 | 1409 | .addClass( "ui-icon ui-icon-volume-on" ) |
| 1404 | 1410 | ) |
| 1405 | 1411 | ); |
| 1406 | | - |
| | 1412 | + mw.log(' if verticle add container '); |
| 1407 | 1413 | if ( ctrlObj.volume_layout == 'vertical' ) { |
| 1408 | 1414 | $volumeOut.find('.volume_control').append( |
| 1409 | 1415 | $j( '<div />' ) |
| 1410 | 1416 | .css( { |
| 1411 | | - 'position' : 'absolute', |
| 1412 | | - 'display' : 'none', |
| 1413 | | - 'left' : '0px;' |
| | 1417 | + 'position' : 'absolute', |
| | 1418 | + 'left' : '0px' |
| 1414 | 1419 | }) |
| | 1420 | + .hide() |
| 1415 | 1421 | .addClass( "vol_container ui-corner-all" ) |
| 1416 | 1422 | .append( |
| 1417 | 1423 | $j( '<div />' ) |
| 1418 | 1424 | .addClass ( "volume-slider" ) |
| 1419 | 1425 | ) |
| 1420 | 1426 | ); |
| 1421 | | - } |
| | 1427 | + } |
| | 1428 | + mw.log('get inner volume html'); |
| 1422 | 1429 | //Return the inner html |
| 1423 | 1430 | return $volumeOut.html(); |
| 1424 | 1431 | } |
| Index: branches/js2-work/phase3/js/mwEmbed/skins/common/common.css |
| — | — | @@ -495,4 +495,9 @@ |
| 496 | 496 | -moz-background-clip: border; |
| 497 | 497 | -moz-background-origin: padding; |
| 498 | 498 | -moz-background-inline-policy: continuous; |
| | 499 | +} |
| | 500 | + |
| | 501 | +.fg-menu .ui-icon{ |
| | 502 | + position:relative; |
| | 503 | + top:-1px; |
| 499 | 504 | } |
| \ No newline at end of file |
| Index: branches/js2-work/phase3/js/mwEmbed/skins/mvpcf/EmbedPlayer.css |
| — | — | @@ -195,5 +195,3 @@ |
| 196 | 196 | .mv-player .overlay-win ul{ |
| 197 | 197 | padding-left: 15px; |
| 198 | 198 | } |
| 199 | | - |
| 200 | | - |
| Index: branches/js2-work/phase3/js/mwEmbed/modules/EmbedPlayer/kplayerEmbed.js |
| — | — | @@ -23,26 +23,33 @@ |
| 24 | 24 | doEmbedHTML : function () { |
| 25 | 25 | var _this = this; |
| 26 | 26 | var playerPath = mw.getMwEmbedPath() + 'modules/EmbedPlayer/binPlayers/kaltura-player'; |
| | 27 | + |
| | 28 | + |
| 27 | 29 | $j( this ).html( |
| 28 | | - '<object width="' + this.getWidth() + '" height="' + this.getHeight() + '" '+ |
| 29 | | - 'data="' + playerPath + '/wrapper.swf" allowfullscreen="true" '+ |
| 30 | | - 'allownetworking="all" allowscriptaccess="always" '+ |
| 31 | | - 'type="application/x-shockwave-flash" '+ |
| 32 | | - 'id="' + this.pid + '" name="' + this.pid + '">'+ |
| 33 | | - '<param value="always" name="allowScriptAccess"/>'+ |
| 34 | | - '<param value="all" name="allowNetworking"/>'+ |
| 35 | | - '<param value="true" name="allowFullScreen"/>'+ |
| 36 | | - '<param value="#000000" name="bgcolor"/>'+ |
| 37 | | - '<param value="wrapper.swf" name="movie"/>'+ |
| 38 | | - '<param value="' + |
| | 30 | + '<object width="' + this.getWidth() + '" height="' + this.getHeight() + '" ' + |
| | 31 | + 'data="' + playerPath + '/wrapper.swf" allowfullscreen="true" ' + |
| | 32 | + 'allownetworking="all" allowscriptaccess="always" ' + |
| | 33 | + 'type="application/x-shockwave-flash" ' + |
| | 34 | + 'flashVars="kdpUrl=' + playerPath + '/kdp.swf' + |
| | 35 | + '&ks=dummy&partner_id=0&subp_id=0' + |
| | 36 | + '&uid=0&emptyF=onKdpEmpty&readyF=onKdpReady' + |
| | 37 | + '" '+ |
| | 38 | + 'wmode="opaque" ' + |
| | 39 | + 'id="' + this.pid + '" name="' + this.pid + '">' + |
| | 40 | + '<param value="always" name="allowScriptAccess"/>' + |
| | 41 | + '<param value="all" name="allowNetworking"/>' + |
| | 42 | + '<param value="true" name="allowFullScreen"/>' + |
| | 43 | + '<param value="#000000" name="bgcolor"/>' + |
| | 44 | + '<param value="wrapper.swf" name="movie"/>' + |
| | 45 | + '<param value="' + |
| 39 | 46 | 'kdpUrl=' + playerPath + '/kdp.swf' + |
| 40 | 47 | '&ks=dummy&partner_id=0&subp_id=0' + |
| 41 | 48 | '&uid=0&emptyF=onKdpEmpty&readyF=onKdpReady' + |
| 42 | | - '" ' + |
| 43 | | - 'name="flashVars"/>'+ |
| 44 | | - '<param value="opaque" name="wmode"/>'+ |
| | 49 | + '" ' + |
| | 50 | + 'name="flashVars"/>' + |
| | 51 | + '<param value="opaque" name="wmode"/>' + |
| 45 | 52 | '</object>' |
| 46 | | - ) |
| | 53 | + ) |
| 47 | 54 | setTimeout(function() { |
| 48 | 55 | _this.postEmbedJS(); |
| 49 | 56 | }, 50); |
| Index: branches/js2-work/phase3/js/mwEmbed/modules/EmbedPlayer/mw.EmbedPlayer.js |
| — | — | @@ -672,7 +672,7 @@ |
| 673 | 673 | }, |
| 674 | 674 | |
| 675 | 675 | /** |
| 676 | | - * MIME type accessor function. |
| | 676 | + * MIME type accessors function. |
| 677 | 677 | * @return {String} the MIME type of the source. |
| 678 | 678 | */ |
| 679 | 679 | getMIMEType: function() { |
| — | — | @@ -871,19 +871,38 @@ |
| 872 | 872 | } |
| 873 | 873 | |
| 874 | 874 | // Set by default thumb value if not found |
| 875 | | - if( ! this.thumbnail ) |
| | 875 | + if( ! this.thumbnail ){ |
| 876 | 876 | this.thumbnail = mw.getConfig( 'images_path' ) + 'vid_default_thumb.jpg' ; |
| | 877 | + } |
| 877 | 878 | |
| 878 | 879 | // Process the video_element as a source element: |
| 879 | 880 | if ( $j( video_element ).attr( "src" ) ) { |
| 880 | 881 | this.tryAddSource( video_element ); |
| 881 | 882 | } |
| 882 | 883 | |
| 883 | | - // Process all inner <source>, & <itext> elements |
| 884 | | - $j( video_element ).find( 'source,itext' ).each( function( ) { |
| 885 | | - mw.log( 'pcat: ' + $j(this).parent().attr( 'category' ) + ' tagName:' + $j(this).parent().get(0).tagName ); |
| 886 | | - _this.tryAddSource( this ); |
| 887 | | - } ); |
| | 884 | + if( ! $j.browser.msie ){ |
| | 885 | + // Most browsers are oky with inner unknown element selectors: |
| | 886 | + $j( video_element ).find( 'source,itext' ).each( function( ) { |
| | 887 | + _this.tryAddSource( this ); |
| | 888 | + } ); |
| | 889 | + } else { |
| | 890 | + // IE on the other hand is not. |
| | 891 | + |
| | 892 | + // IE apperntly has the source tags floating in DOM space but not |
| | 893 | + // as child of the unknown video tag element rather as its "sibling" |
| | 894 | + |
| | 895 | + // Add the video element with an identifiable div |
| | 896 | + |
| | 897 | + // NOTE this fails for multiple video tags in a given div |
| | 898 | + // but if we $j( video_element ).wrap ( $j('<div />' ) ) it fails all together |
| | 899 | + $j( $j( video_element ).parent().get(0).getElementsByTagName('source') ).each( function(){ |
| | 900 | + _this.tryAddSource( this ); |
| | 901 | + }); |
| | 902 | + |
| | 903 | + $j( $j( video_element ).parent().get(0).getElementsByTagName( 'itext' ) ).each( function(){ |
| | 904 | + _this.tryAddSource( this ); |
| | 905 | + }); |
| | 906 | + } |
| 888 | 907 | }, |
| 889 | 908 | |
| 890 | 909 | /** |
| — | — | @@ -908,9 +927,11 @@ |
| 909 | 928 | textSourceExists: function() { |
| 910 | 929 | for ( var i = 0; i < this.sources.length; i++ ) { |
| 911 | 930 | mw.log( this.sources[i].mime_type ); |
| 912 | | - if ( this.sources[i].mime_type == 'text/cmml' || |
| 913 | | - this.sources[i].mime_type == 'text/x-srt' ) |
| | 931 | + if ( this.sources[i].mime_type == 'text/cmml' |
| | 932 | + || this.sources[i].mime_type == 'text/x-srt' ) |
| | 933 | + { |
| 914 | 934 | return true; |
| | 935 | + } |
| 915 | 936 | }; |
| 916 | 937 | return false; |
| 917 | 938 | }, |
| — | — | @@ -923,9 +944,10 @@ |
| 924 | 945 | * @type Array |
| 925 | 946 | */ |
| 926 | 947 | getSources: function( mime_filter ) { |
| 927 | | - if ( !mime_filter ) |
| | 948 | + if ( !mime_filter ) { |
| 928 | 949 | return this.sources; |
| 929 | | - // apply mime filter: |
| | 950 | + } |
| | 951 | + // Apply mime filter: |
| 930 | 952 | var source_set = new Array(); |
| 931 | 953 | for ( var i = 0; i < this.sources.length ; i++ ) { |
| 932 | 954 | if ( this.sources[i].mime_type && |
| — | — | @@ -1451,9 +1473,8 @@ |
| 1452 | 1474 | return ; |
| 1453 | 1475 | } |
| 1454 | 1476 | _this.setupSourcePlayer(); |
| 1455 | | - }, |
| | 1477 | + }, |
| 1456 | 1478 | |
| 1457 | | - |
| 1458 | 1479 | /** |
| 1459 | 1480 | * Set up the select source player |
| 1460 | 1481 | * |
| — | — | @@ -1463,8 +1484,8 @@ |
| 1464 | 1485 | */ |
| 1465 | 1486 | setupSourcePlayer: function() { |
| 1466 | 1487 | mw.log("setupSourcePlayer: " + this.id ); |
| 1467 | | - // Autoseletct the media source |
| 1468 | | - this.mediaElement.autoSelectSource(); |
| | 1488 | + // Autoseletct the media source |
| | 1489 | + this.mediaElement.autoSelectSource(); |
| 1469 | 1490 | // Auto select player based on default order |
| 1470 | 1491 | if ( !this.mediaElement.selected_source ) { |
| 1471 | 1492 | // check for parent clip: |
| — | — | @@ -1480,6 +1501,7 @@ |
| 1481 | 1502 | } else { |
| 1482 | 1503 | this.selected_player = mw.EmbedTypes.players.defaultPlayer( this.mediaElement.selected_source.mime_type ); |
| 1483 | 1504 | } |
| | 1505 | + |
| 1484 | 1506 | if ( this.selected_player ) { |
| 1485 | 1507 | mw.log( "Playback system: " + this.selected_player.library ); |
| 1486 | 1508 | |
| — | — | @@ -1487,18 +1509,19 @@ |
| 1488 | 1510 | this.inheritEmbedPlayer(); |
| 1489 | 1511 | } else { |
| 1490 | 1512 | // No source's playable |
| 1491 | | - var missing_type = ''; |
| | 1513 | + var missingType = ''; |
| 1492 | 1514 | var or = ''; |
| 1493 | 1515 | for ( var i = 0; i < this.mediaElement.sources.length; i++ ) { |
| 1494 | 1516 | missing_type += or + this.mediaElement.sources[i].mime_type; |
| 1495 | 1517 | or = ' or '; |
| 1496 | 1518 | } |
| 1497 | 1519 | // Get from parent playlist if set: |
| 1498 | | - if ( this.pc ) |
| 1499 | | - var missing_type = this.pc.type; |
| | 1520 | + if ( this.pc ){ |
| | 1521 | + missingType = this.pc.type; |
| | 1522 | + } |
| 1500 | 1523 | |
| 1501 | | - mw.log( 'No player found for given source type ' + missing_type ); |
| 1502 | | - this.showPluginMissingHTML( missing_type ); |
| | 1524 | + mw.log( 'No player found for given source type ' + missingType ); |
| | 1525 | + this.showPluginMissingHTML( missingType ); |
| 1503 | 1526 | } |
| 1504 | 1527 | }, |
| 1505 | 1528 | |
| — | — | @@ -2058,10 +2081,10 @@ |
| 2059 | 2082 | $j( this ) |
| 2060 | 2083 | .wrap( |
| 2061 | 2084 | $j('<div>') |
| 2062 | | - .addClass('interface_wrap ' + this.ctrlBuilder.playerClass) |
| | 2085 | + .addClass( 'interface_wrap ' + this.ctrlBuilder.playerClass ) |
| 2063 | 2086 | .css({ |
| 2064 | | - 'width' : parseInt( this.width ), |
| 2065 | | - 'height' : parseInt( this.height ), |
| | 2087 | + 'width' : parseInt( this.width ) + 'px', |
| | 2088 | + 'height' : parseInt( this.height ) + 'px', |
| 2066 | 2089 | 'position' : 'relative', |
| 2067 | 2090 | 'overflow' : 'hidden' |
| 2068 | 2091 | }) |
| — | — | @@ -2101,7 +2124,7 @@ |
| 2102 | 2125 | } |
| 2103 | 2126 | $j( this ).html( |
| 2104 | 2127 | $j('<div />').append( |
| 2105 | | - gM( 'mwe-generic_missing_plugin', missing_type ), |
| | 2128 | + gM( 'mwe-generic_missing_plugin', misssingType ), |
| 2106 | 2129 | $j( '<br />' ), |
| 2107 | 2130 | $j( '<a />' ) |
| 2108 | 2131 | .attr( { |
| — | — | @@ -2844,7 +2867,10 @@ |
| 2845 | 2868 | * @return src url |
| 2846 | 2869 | */ |
| 2847 | 2870 | getSrc: function() { |
| 2848 | | - return this.mediaElement.selected_source.getSrc( this.seek_time_sec ); |
| | 2871 | + if( this.mediaElement.selected_source ){ |
| | 2872 | + return this.mediaElement.selected_source.getSrc( this.seek_time_sec ); |
| | 2873 | + } |
| | 2874 | + return false; |
| 2849 | 2875 | }, |
| 2850 | 2876 | |
| 2851 | 2877 | /** |
| Index: branches/js2-work/phase3/js/mwEmbed/mwEmbed.js |
| — | — | @@ -1820,7 +1820,7 @@ |
| 1821 | 1821 | * In debug mode inject the script instead of doing an XHR eval |
| 1822 | 1822 | */ |
| 1823 | 1823 | // Load and bind manually: ( copied from jQuery ajax function ) |
| 1824 | | - var head = document.getElementsByTagName("head")[0]; |
| | 1824 | + var head = document.getElementsByTagName("head")[ 0 ]; |
| 1825 | 1825 | var script = document.createElement("script"); |
| 1826 | 1826 | script.setAttribute( 'src', url ); |
| 1827 | 1827 | |