r60110 MediaWiki - Code Review archive

Repository:MediaWiki
Revision:< r60109‎ | r60110 | r60111 >
Date:00:27, 16 December 2009
Author:dale
Status:deferred
Tags:
Comment:
* fixed aspect ratio for credits images
Modified paths:
  • /branches/js2-work/phase3/js2/mwEmbed/example_usage/Player_Themable.html (modified) (history)
  • /branches/js2-work/phase3/js2/mwEmbed/libEmbedPlayer/embedPlayer.js (modified) (history)
  • /branches/js2-work/phase3/js2/mwEmbed/mwEmbed.js (modified) (history)
  • /branches/js2-work/phase3/js2/mwEmbed/skins/kskin/kskinConfig.js (modified) (history)

Diff [purge]

Index: branches/js2-work/phase3/js2/mwEmbed/example_usage/Player_Themable.html
——@@ -15,13 +15,15 @@
1616 <div style="width:450px;float:left">
1717 <video
1818 src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg"
19 - poster="http://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Charles_Lindbergh_flight_to_Brussels.ogg/mid-Charles_Lindbergh_flight_to_Brussels.ogg.jpg"
 19+ poster="http://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Charles_Lindbergh_flight_to_Brussels.ogg/mid-Charles_Lindbergh_flight_to_Brussels.ogg.jpg"
 20+ wikiTitleKey="Charles_Lindbergh_flight_to_Brussels.ogg"
2021 durationHint="15">
2122 </video>
2223
2324 <video
2425 style="width:208px;height:160px;float:left"
25 - src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg"
 26+ src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg"
 27+ wikiTitleKey="Charles_Lindbergh_flight_to_Brussels.ogg"
2628 poster="http://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Charles_Lindbergh_flight_to_Brussels.ogg/mid-Charles_Lindbergh_flight_to_Brussels.ogg.jpg" durationHint="15"></video>
2729 <b>Source Code used:</b><br>
2830 <textarea cols="50" rows="7"><video style="width:400px;height:288px" poster="http://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Charles_Lindbergh_flight_to_Brussels.ogg/mid-Charles_Lindbergh_flight_to_Brussels.ogg.jpg"
——@@ -31,12 +33,14 @@
3234 <div style="width:450px;float:left">
3335 <video
3436 class="kskin"
35 - src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg"
 37+ src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg"
 38+ wikiTitleKey="Charles_Lindbergh_flight_to_Brussels.ogg"
3639 poster="http://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Charles_Lindbergh_flight_to_Brussels.ogg/mid-Charles_Lindbergh_flight_to_Brussels.ogg.jpg"
3740 durationHint="15">
3841 </video>
3942 <video
4043 class="kskin"
 44+ wikiTitleKey="Charles_Lindbergh_flight_to_Brussels.ogg"
4145 style="width:208px;height:160px;float:left;" src="http://upload.wikimedia.org/wikipedia/commons/2/29/Charles_Lindbergh_flight_to_Brussels.ogg"
4246 poster="http://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Charles_Lindbergh_flight_to_Brussels.ogg/mid-Charles_Lindbergh_flight_to_Brussels.ogg.jpg"
4347 durationHint="15">
Index: branches/js2-work/phase3/js2/mwEmbed/libEmbedPlayer/embedPlayer.js
——@@ -272,12 +272,10 @@
273273 if( typeof callback == 'function' )
274274 mw.playerManager.addCallback( callback );
275275
276 - // Pointer to Selector:
277 - var j_selector = this.selector;
278 -
279 - $j( mw.getPlayerTagElements( j_selector ) ).each( function(na, playerElement){
 276+ // Add each selected element to the player manager:
 277+ $j( this.selector ).each( function(na, playerElement){
280278 mw.playerManager.addElement( playerElement, attributes);
281 - } );
 279+ } );
282280
283281 // Once we are done adding new players start to check if players are ready:
284282 mw.playerManager.waitPlayersReadyCallback();
——@@ -1274,10 +1272,9 @@
12751273 if( ! this['height'] && ! this['width'] ){
12761274 this['height'] = parseInt( $j(element).attr( 'height' ) );
12771275 this['width'] = parseInt( $j(element).attr( 'width' ) );
1278 - }
 1276+ }
12791277
1280 -
1281 - // Deal with just one height or width being set:
 1278+ // Use default aspect ration to get height or width
12821279 if( this['height'] && !this['width'] && this.videoAspect ){
12831280 var aspect = this.videoAspect.split( ':' );
12841281 this['width'] = parseInt( this.height * ( aspect[0] / aspect[1] ) );
——@@ -1286,7 +1283,7 @@
12871284 if( this['width'] && !this['height'] && this.videoAspect ){
12881285 var aspect = this.videoAspect.split( ':' );
12891286 this['height'] = parseInt( this.width * ( aspect[1] / aspect[0] ) );
1290 - }
 1287+ }
12911288
12921289 // On load sometimes attr is temporally -1 as we don't have video metadata yet.
12931290 // NOTE: this edge case should be handled by waiting for metadata see: "waitForMeta" in addElement
——@@ -1305,7 +1302,8 @@
13061303 }else{
13071304 this['height'] = defaultSize[1];
13081305 }
1309 - }
 1306+ }
 1307+
13101308 },
13111309
13121310 /**
Index: branches/js2-work/phase3/js2/mwEmbed/skins/kskin/kskinConfig.js
——@@ -54,7 +54,7 @@
5555 'top:' + ( embedObj.getPlayerHeight() + ctrlObj.getControlBarHeight() ) + 'px;' : '';
5656
5757 // Special common overflow hack:
58 - // NOTE: should refactor to just append menu to top body when it does not "fit" in the player
 58+ // NOTE: should re-factor to just append menu to top body when it does not "fit" in the player
5959 if( menuOffset != '' )
6060 $j( embedObj ).parents( '.thumbinner' ).css( 'overflow', 'visible' );
6161
——@@ -90,6 +90,7 @@
9191 getOverlayWidth: function(){
9292 return ( this.embedObj.getPlayerWidth() < 200 )? 200 : this.embedObj.getPlayerWidth();
9393 },
 94+
9495 /**
9596 * Get minimal height for interface overlay
9697 */
——@@ -280,7 +281,10 @@
281282 $j('<img/>').attr( {
282283 'border': 0,
283284 'src' : embedObj.thumbnail
284 - } ).css( 'width', imgWidth )
 285+ } ).css( {
 286+ 'width' : imgWidth,
 287+ 'height': parseInt( imgWidth * ( embedObj.height / embedObj.width ) )
 288+ } )
285289 )
286290 )
287291 .append(
Index: branches/js2-work/phase3/js2/mwEmbed/mwEmbed.js
——@@ -1512,170 +1512,6 @@
15131513 }
15141514
15151515 /**
1516 - * One time "setup" for mwEmbed
1517 - * run onDomReady ( so calls to setConfg apply to setup )
1518 - */
1519 -
1520 - // Flag to ensure setup is only run once:
1521 - var mwSetupFlag = false;
1522 -
1523 - $.setupMwEmbed = function ( ) {
1524 - // Only run the setup once:
1525 - if( mwSetupFlag )
1526 - return ;
1527 - mwSetupFlag = true;
1528 -
1529 - mw.log( 'mw:setupMwEmbed' );
1530 -
1531 - // Make sure jQuery is loaded:
1532 - $.load( 'window.jQuery', function(){
1533 - if ( !window['$j'] ) {
1534 - window['$j'] = jQuery.noConflict();
1535 - }
1536 -
1537 - // Set up the skin paths configuration
1538 - $.setConfig( 'jquery_skin_path', mw.getMwEmbedPath() + 'jquery/jquery.ui/themes/' + mw.getConfig( 'jui_skin' ) + '/' );
1539 - $.setConfig( 'skin_img_path', mw.getMwEmbedPath() + 'skins/' + mw.getConfig( 'skin_name' ) + '/images/' );
1540 - $.setConfig( 'default_video_thumb', mw.getConfig( 'skin_img_path' ) + 'vid_default_thumb.jpg' );
1541 -
1542 - // Make Core skin/style sheets are always available:
1543 - mw.getStyleSheet( mw.getConfig( 'jquery_skin_path' ) + 'jquery-ui-1.7.1.custom.css' );
1544 - mw.getStyleSheet( mw.getMwEmbedPath() + 'skins/' + mw.getConfig( 'skin_name' ) + '/styles.css' );
1545 -
1546 - // Set up AJAX to not send dynamic URLs for loading scripts
1547 - $j.ajaxSetup( {
1548 - cache: true
1549 - } );
1550 -
1551 - //Update the magic keywords
1552 - $.lang.magicSetup();
1553 -
1554 - // Set up mvEmbed jQuery bindings
1555 - mwDojQueryBindings();
1556 -
1557 - // Check for tag-rewrites ( sometimes checked twice but ensures fresh dom check )
1558 - if( $.documentHasPlayerTags() ){
1559 - // Load the embedPlayer module ( then run queued hooks )
1560 - mw.load( 'player', function ( ) {
1561 - // Rewrite the rewritePlayerTags with the
1562 - $j( $.getConfig( 'rewritePlayerTags' ) ).embedPlayer()
1563 - // Run mw hooks:
1564 - mw.log("SetupDone ( player ) run hooks:" ) ;
1565 - mw.runLoadHooks();
1566 - } );
1567 - }else{
1568 - mw.log("SetupDone run hooks ( no rewrite players found ):" ) ;
1569 - // Set ready state and run the callback
1570 - mw.runLoadHooks();
1571 - }
1572 - } );
1573 - }
1574 -
1575 - // Flag to register the domReady has been called
1576 - var mwDomReadyFlag = false;
1577 -
1578 - /**
1579 - * This will get called when the DOM is ready
1580 - * Will check configuration and issue a mw.setupMwEmbed call if needed
1581 - */
1582 - $.domReady = function ( ) {
1583 - if( mwDomReadyFlag )
1584 - return ;
1585 - mw.log( 'run:domReady' );
1586 - // Set the onDomReady Flag
1587 - mwDomReadyFlag = true;
1588 -
1589 - // Check for the force setup flag:
1590 - if ( $.getConfig( 'runSetupMwEmbed' ) ){
1591 - $.setupMwEmbed();
1592 - return ;
1593 - }
1594 -
1595 - // Check for rewrite tags:
1596 - if ( $.documentHasPlayerTags() ) {
1597 - $.setupMwEmbed();
1598 - return ;
1599 - }
1600 -
1601 - // Check for queued functions that use mw interfaces:
1602 - if ( mwOnLoadFuncitons.length ){
1603 - $.setupMwEmbed();
1604 - return ;
1605 - }
1606 - }
1607 -
1608 - /**
1609 - * Check the current DOM for any tags in "rewritePlayerTags"
1610 - */
1611 - $.documentHasPlayerTags = function(){
1612 - var tagElm = $.getPlayerTagElements( $.getConfig( 'rewritePlayerTags' ), true );
1613 - if( tagElm && tagElm.length )
1614 - return true;
1615 - return false;
1616 - }
1617 -
1618 - /**
1619 - * Get page elements that match the rewritePlayerTags config
1620 - *
1621 - * @@NOTE we should probably exclud "video" that have already be rewritten
1622 - *
1623 - * @param {Boolean} getOne Flag to retrieve only one tag ( faster for simple has tag checks )
1624 - */
1625 - $.getPlayerTagElements = function( selector, getOneFlag ){
1626 -
1627 - if( ! selector ){
1628 - selector = $.getConfig( 'rewritePlayerTags' );
1629 - }
1630 -
1631 - if( ! selector ){
1632 - return false;
1633 - }
1634 - var tagsInDOM = [ ];
1635 - // Check for tags:
1636 - // IE8 does not play well with the jQuery video,audio,playlist selector use native:
1637 - // NOTE: we should re-confirm this bug in-case IE pushes out an update
1638 - if ( $j.browser.msie && $j.browser.version >= 8 ) {
1639 - var ie_compatible_selector = '';
1640 - var jtags = selector.split( ',' );
1641 - var coma = '';
1642 - for ( var i = 0; i < jtags.length; i++ ) {
1643 - if ( jtags[i] === 'video' ||
1644 - jtags[i] === 'audio' ||
1645 - jtags[i] === 'playlist' ) {
1646 - // Use native ElementsByTagName selector
1647 - $( document.getElementsByTagName( jtags[i] ) ).each( function() {
1648 - tagsInDOM.push( this );
1649 - if( getOneFlag )
1650 - return false;
1651 - } );
1652 -
1653 - //If only returning the first found element return:
1654 - if( tagsInDOM.length != 0 && getOneFlag )
1655 - return tagsInDOM[0]
1656 - }else{
1657 - ie_compatible_selector += coma + jtags[i]
1658 - coma = ',';
1659 - }
1660 - }
1661 - //Set the selector to IE compatible set and continue processing
1662 - selector = ie_compatible_selector;
1663 - }
1664 - // Run the selector
1665 - $j( selector ).each( function() {
1666 - tagsInDOM.push( this );
1667 - if( getOneFlag )
1668 - return false;
1669 - } );
1670 -
1671 - //If only returning the first found element return:
1672 - if( tagsInDOM.length != 0 && getOneFlag )
1673 - return tagsInDOM
1674 -
1675 - // Return all the player tags:
1676 - return tagsInDOM;
1677 - }
1678 -
1679 - /**
16801516 * Wrapper for jQuery getScript,
16811517 * Uses the scriptLoader if enabled
16821518 *
——@@ -2117,9 +1953,125 @@
21181954 return false;
21191955 }
21201956 return xmldata;
 1957+ }
 1958+
 1959+
 1960+/**
 1961+* mwEmbed Setup functions.
 1962+* jQuery is not necessarily available
 1963+*/
 1964+
 1965+ /**
 1966+ * Check the current DOM for any tags in "rewritePlayerTags"
 1967+ *
 1968+ * NOTE: this function and setup can run prior to jQuery being ready
 1969+ */
 1970+ $.documentHasPlayerTags = function(){
 1971+ var rewriteTags = $.getConfig( 'rewritePlayerTags' );
 1972+ if( rewriteTags ){
 1973+ var jtags = rewriteTags.split( ',' );
 1974+ for ( var i = 0; i < jtags.length; i++ ) {
 1975+ if( document.getElementsByTagName( jtags[i] )[0] )
 1976+ return true;
 1977+ };
 1978+ }
 1979+ return false;
21211980 }
 1981+
 1982+ /**
 1983+ * One time "setup" for mwEmbed
 1984+ * run onDomReady ( so calls to setConfg apply to setup )
 1985+ */
 1986+ // Flag to ensure setup is only run once:
 1987+ var mwSetupFlag = false;
 1988+ $.setupMwEmbed = function ( ) {
 1989+ // Only run the setup once:
 1990+ if( mwSetupFlag )
 1991+ return ;
 1992+ mwSetupFlag = true;
 1993+
 1994+ mw.log( 'mw:setupMwEmbed' );
 1995+
 1996+ // Make sure jQuery is loaded
 1997+ $.load( 'window.jQuery', function(){
 1998+ if ( !window['$j'] ) {
 1999+ window['$j'] = jQuery.noConflict();
 2000+ }
 2001+
 2002+ // Set up the skin paths configuration
 2003+ $.setConfig( 'jquery_skin_path', mw.getMwEmbedPath() + 'jquery/jquery.ui/themes/' + mw.getConfig( 'jui_skin' ) + '/' );
 2004+ $.setConfig( 'skin_img_path', mw.getMwEmbedPath() + 'skins/' + mw.getConfig( 'skin_name' ) + '/images/' );
 2005+ $.setConfig( 'default_video_thumb', mw.getConfig( 'skin_img_path' ) + 'vid_default_thumb.jpg' );
 2006+
 2007+ // Make Core skin/style sheets are always available:
 2008+ mw.getStyleSheet( mw.getConfig( 'jquery_skin_path' ) + 'jquery-ui-1.7.1.custom.css' );
 2009+ mw.getStyleSheet( mw.getMwEmbedPath() + 'skins/' + mw.getConfig( 'skin_name' ) + '/styles.css' );
 2010+
 2011+ // Set up AJAX to not send dynamic URLs for loading scripts
 2012+ $j.ajaxSetup( {
 2013+ cache: true
 2014+ } );
 2015+
 2016+ //Update the magic keywords
 2017+ $.lang.magicSetup();
 2018+
 2019+ // Set up mvEmbed jQuery bindings
 2020+ mwDojQueryBindings();
 2021+
 2022+ // Check for tag-rewrites ( sometimes checked twice but ensures fresh dom check )
 2023+ if( $.documentHasPlayerTags() ){
 2024+ // Load the embedPlayer module ( then run queued hooks )
 2025+ mw.load( 'player', function ( ) {
 2026+ // Rewrite the rewritePlayerTags with the
 2027+ $j( $.getConfig( 'rewritePlayerTags' ) ).embedPlayer()
 2028+ // Run mw hooks:
 2029+ mw.runLoadHooks();
 2030+ } );
 2031+ }else{
 2032+ // Set ready state and run the callback
 2033+ mw.runLoadHooks();
 2034+ }
 2035+ } );
 2036+ }
 2037+
 2038+ // Flag to register the domReady has been called
 2039+ var mwDomReadyFlag = false;
 2040+
 2041+ /**
 2042+ * This will get called when the DOM is ready
 2043+ * Will check configuration and issue a mw.setupMwEmbed call if needed
 2044+ */
 2045+ $.domReady = function ( ) {
 2046+ if( mwDomReadyFlag )
 2047+ return ;
 2048+ mw.log( 'run:domReady' );
 2049+ // Set the onDomReady Flag
 2050+ mwDomReadyFlag = true;
 2051+
 2052+ // Check for the force setup flag:
 2053+ if ( $.getConfig( 'runSetupMwEmbed' ) ){
 2054+ $.setupMwEmbed();
 2055+ return ;
 2056+ }
 2057+
 2058+ // Check for rewrite tags:
 2059+ if ( $.documentHasPlayerTags() ) {
 2060+ $.setupMwEmbed();
 2061+ return ;
 2062+ }
 2063+
 2064+ // Check for queued functions that use mw interfaces:
 2065+ if ( mwOnLoadFuncitons.length ){
 2066+ $.setupMwEmbed();
 2067+ return ;
 2068+ }
 2069+ }
 2070+
21222071 } )( window.mw );
21232072
 2073+
 2074+
 2075+
21242076 // Load in js2 stopgap into proper location:
21252077 if ( typeof gMsg != 'undefined' ) {
21262078 mw.addMessages( gMsg )
——@@ -2132,16 +2084,17 @@
21332085 var loadRS = mw.lang.loadRS;
21342086
21352087 /**
2136 - * -- Load Class Paths --
2137 - *
2138 - * MUST BE VALID JSON (NOT JS)
2139 - * This is used by the script loader to auto-load classes (so we only define
2140 - * this once for PHP & JavaScript)
2141 - *
2142 - * Right now the PHP AutoLoader only reads this mwEmbed.js file.
2143 - * In the future we could have multiple "loader" files
2144 - *
2145 - */
 2088+* -- Load Class Paths --
 2089+*
 2090+* MUST BE VALID JSON (NOT JS)
 2091+* This is used by the script loader to auto-load classes (so we only define
 2092+* this once for PHP & JavaScript)
 2093+*
 2094+* Right now the PHP AutoLoader only reads this mwEmbed.js file.
 2095+* In the future we could have multiple "loader" files
 2096+* where addClassFilePaths JSON is read in each "loader"
 2097+*
 2098+*/
21462099
21472100 mw.addClassFilePaths( {
21482101 "mwEmbed" : "mwEmbed.js",
——@@ -2318,9 +2271,9 @@
23192272 checkForTimedText = true;
23202273 break;
23212274 }
2322 -
2323 - var playerElements = mw.getPlayerTagElements();
2324 - $j.each( playerElements, function(na, playerElement ){
 2275+
 2276+ $j( mw.getConfig( 'rewritePlayerTags' ) ).each( function(){
 2277+ var playerElement = this;
23252278 var cName = $j( playerElement ).attr( 'class' );
23262279 for( var n=0; n < mw.valid_skins.length ; n++ ){
23272280 // Get any other skins that we need to load

Status & tagging log