Fix broken console.error.call in IE9
[lhc/web/wiklou.git] / resources / mediawiki / mediawiki.debug.js
index 4f4f06b..e631c76 100644 (file)
@@ -1,5 +1,5 @@
 /**
- * JavaScript for the new debug toolbar, enabled with $wgDebugToolbar
+ * JavaScript for the new debug toolbar, enabled through $wgDebugToolbar.
  *
  * @author John Du Hart
  * @since 1.19
@@ -8,6 +8,8 @@
 ( function ( $, mw, undefined ) {
 "use strict";
 
+       var hovzer = $.getFootHovzer();
+
        var debug = mw.Debug = {
                /**
                 * Toolbar container element
                data: {},
 
                /**
-                * Initializes the debugging pane
+                * Initializes the debugging pane.
+                * Shouldn't be called before the document is ready
+                * (since it binds to elements on the page).
                 *
-                * @param {Object} data
+                * @param {Object} data, defaults to 'debugInfo' from mw.config
                 */
                init: function ( data ) {
-                       this.data = data;
+
+                       this.data = data || mw.config.get( 'debugInfo' );
                        this.buildHtml();
 
                        // Insert the container into the DOM
-                       $( 'body' ).append( this.$container );
+                       hovzer.$.append( this.$container );
+                       hovzer.update();
 
                        $( '.mw-debug-panelink' ).click( this.switchPane );
                },
                 */
                switchPane: function ( e ) {
                        var currentPaneId = debug.$container.data( 'currentPane' ),
-                               requestedPaneId = $(this).parent().attr( 'id' ).substr( 9 ),
+                               requestedPaneId = $(this).prop( 'id' ).substr( 9 ),
                                $currentPane = $( '#mw-debug-pane-' + currentPaneId ),
-                               $requestedPane = $( '#mw-debug-pane-' + requestedPaneId );
+                               $requestedPane = $( '#mw-debug-pane-' + requestedPaneId ),
+                               hovDone = false;
+
+                       function updateHov() {
+                               if ( !hovDone ) {
+                                       hovzer.update();
+                                       hovDone = true;
+                               }
+                       }
+
+                       // Skip hash fragment handling. Prevents screen from jumping.
                        e.preventDefault();
 
+                       $( this ).addClass( 'current ');
+                       $( '.mw-debug-panelink' ).not( this ).removeClass( 'current ');
+
                        // Hide the current pane
                        if ( requestedPaneId === currentPaneId ) {
-                               $currentPane.slideUp();
+                               $currentPane.slideUp( updateHov );
                                debug.$container.data( 'currentPane', null );
                                return;
                        }
                        debug.$container.data( 'currentPane', requestedPaneId );
 
                        if ( currentPaneId === undefined || currentPaneId === null ) {
-                               $requestedPane.slideDown();
+                               $requestedPane.slideDown( updateHov );
                        } else {
                                $currentPane.hide();
                                $requestedPane.show();
+                               updateHov();
                        }
                },
 
                 * Constructs the HTML for the debugging toolbar
                 */
                buildHtml: function () {
-                       var $container, panes, id;
+                       var $container, $bits, panes, id;
+
+                       $container = $( '<div id="mw-debug-toolbar" class="mw-debug"></div>' );
 
-                       $container = $( '<div>' )
-                               .attr({
-                                       id: 'mw-debug-container',
-                                       'class': 'mw-debug'
-                               });
+                       $bits = $( '<div class="mw-debug-bits"></div>' );
 
                        /**
                         * Returns a jQuery element for a debug-bit div
                                return $( '<div>' ).attr({
                                        id: 'mw-debug-' + id,
                                        'class': 'mw-debug-bit'
-                               });
+                               })
+                               .appendTo( $bits );
                        }
 
                        /**
                         * @param text
                         * @return {jQuery}
                         */
-                       function paneLink( id, text ) {
+                       function paneLabel( id, text ) {
                                return $( '<a>' )
                                        .attr({
-                                               href: '#',
-                                               'class': 'mw-debug-panelink',
-                                               id: 'mw-debug-' + id + '-link'
+                                               'class': 'mw-debug-panelabel',
+                                               href: '#mw-debug-pane-' + id
                                        })
                                        .text( text );
                        }
 
+                       /**
+                        * Returns a jQuery element for a debug-bit div with a for a pane link
+                        *
+                        * @param id CSS id snippet. Will be prefixed with 'mw-debug-'
+                        * @param text Text to show
+                        * @param count Optional count to show
+                        * @return {jQuery}
+                        */
+                       function paneTriggerBitDiv( id, text, count ) {
+                               if( count ) {
+                                       text = text + ' (' + count + ')';
+                               }
+                               return $( '<div>' ).attr({
+                                       id: 'mw-debug-' + id,
+                                       'class': 'mw-debug-bit mw-debug-panelink'
+                               })
+                               .append( paneLabel( id, text ) )
+                               .appendTo( $bits );
+                       }
+
+                       paneTriggerBitDiv( 'console', 'Console', this.data.log.length );
+
+                       paneTriggerBitDiv( 'querylist', 'Queries', this.data.queries.length );
+
+                       paneTriggerBitDiv( 'debuglog', 'Debug log', this.data.debugLog.length );
+
+                       paneTriggerBitDiv( 'request', 'Request' );
+
+                       paneTriggerBitDiv( 'includes', 'PHP includes', this.data.includes.length );
+
+                       var gitInfo = '';
+                       if ( this.data.gitRevision != false ) {
+                               gitInfo = '(' + this.data.gitRevision.substring( 0, 7 ) + ')';
+                               if ( this.data.gitViewUrl != false ) {
+                                       gitInfo = $( '<a></a>' ).attr( 'href', this.data.gitViewUrl ).text( gitInfo );
+                               }
+                       }
+
                        bitDiv( 'mwversion' )
                                .append( $( '<a href="//www.mediawiki.org/"></a>' ).text( 'MediaWiki' ) )
-                               .append( ': ' + this.data.mwVersion )
-                               .appendTo( $container );
+                               .append( ': ' + this.data.mwVersion + ' ' )
+                               .append( gitInfo );
+
+                       if ( this.data.gitBranch != false ) {
+                               bitDiv( 'gitbranch' ).text( 'Git branch: ' + this.data.gitBranch );
+                       }
 
                        bitDiv( 'phpversion' )
                                .append( $( '<a href="//www.php.net/"></a>' ).text( 'PHP' ) )
-                               .append( ': ' + this.data.phpVersion )
-                               .appendTo( $container );
+                               .append( ': ' + this.data.phpVersion );
 
                        bitDiv( 'time' )
-                               .text( 'Time: ' + this.data.time.toFixed( 5 ) )
-                               .appendTo( $container );
+                               .text( 'Time: ' + this.data.time.toFixed( 5 ) );
+
                        bitDiv( 'memory' )
                                .text( 'Memory: ' + this.data.memory )
-                               .append( $( '<span title="Peak usage"></span>' ).text( ' (' + this.data.memoryPeak + ')' ) )
-                               .appendTo( $container );
-
-                       bitDiv( 'querylist' )
-                               .append( paneLink( 'query', 'Queries: ' + this.data.queries.length ) )
-                               .appendTo( $container );
+                               .append( $( '<span title="Peak usage"></span>' ).text( ' (' + this.data.memoryPeak + ')' ) );
+                               
 
-                       bitDiv( 'debuglog' )
-                               .append( paneLink( 'debuglog', 'Debug Log (' + this.data.debugLog.length + ' lines)' ) )
-                               .appendTo( $container );
-
-                       bitDiv( 'request' )
-                               .append( paneLink( 'request', 'Request' ) )
-                               .appendTo( $container );
-
-                       bitDiv( 'includes' )
-                               .append( paneLink( 'files-includes', this.data.includes.length + ' Files Included' ) )
-                               .appendTo( $container );
+                       $bits.appendTo( $container );
 
                        panes = {
+                               console: this.buildConsoleTable(),
                                querylist: this.buildQueryTable(),
                                debuglog: this.buildDebugLogTable(),
                                request: this.buildRequestPane(),
                        this.$container = $container;
                },
 
+               /**
+                * Builds the console panel
+                */
+               buildConsoleTable: function () {
+                       var $table, entryTypeText, i, length, entry;
+
+                       $table = $( '<table id="mw-debug-console">' );
+
+                       $('<colgroup>').css( 'width', /*padding=*/20 + ( 10*/*fontSize*/11 ) ).appendTo( $table );
+                       $('<colgroup>').appendTo( $table );
+                       $('<colgroup>').css( 'width', 350 ).appendTo( $table );
+
+
+                       entryTypeText = function( entryType ) {
+                               switch ( entryType ) {
+                                       case 'log':
+                                               return 'Log';
+                                       case 'warn':
+                                               return 'Warning';
+                                       case 'deprecated':
+                                               return 'Deprecated';
+                                       default:
+                                               return 'Unknown';
+                               }
+                       };
+
+                       for ( i = 0, length = this.data.log.length; i < length; i += 1 ) {
+                               entry = this.data.log[i];
+                               entry.typeText = entryTypeText( entry.type );
+
+                               $( '<tr>' )
+                                       .append( $( '<td>' )
+                                               .text( entry.typeText )
+                                               .attr( 'class', 'mw-debug-console-' + entry.type )
+                                       )
+                                       .append( $( '<td>' ).html( entry.msg ) )
+                                       .append( $( '<td>' ).text( entry.caller ) )
+                                       .appendTo( $table );
+                       }
+
+                       return $table;
+               },
+
                /**
                 * Query list pane
                 */
 
                        $table = $( '<table id="mw-debug-querylist"></table>' );
 
+                       $( '<tr>' )
+                               .append( $('<th>#</th>').css( 'width', '4em' )    )
+                               .append( $('<th>SQL</th>') )
+                               .append( $('<th>Time</th>').css( 'width', '8em'  ) )
+                               .append( $('<th>Call</th>').css( 'width', '18em' ) )
+                       .appendTo( $table );
+
                        for ( i = 0, length = this.data.queries.length; i < length; i += 1 ) {
                                query = this.data.queries[i];
 
                                $( '<tr>' )
                                        .append( $( '<td>' ).text( i + 1 ) )
                                        .append( $( '<td>' ).text( query.sql ) )
-                                       .append( $( '<td>' )
-                                               .append( $( '<span class="mw-debug-query-time"></span>' ).text( '(' + query.time.toFixed( 4 ) + 'ms) ' ) )
-                                               .append( query['function'] )
-                                       )
-                                       .appendTo( $table );
+                                       .append( $( '<td class="stats">' ).text( ( query.time * 1000 ).toFixed( 4 ) + 'ms' ) )
+                                       .append( $( '<td>' ).text( query['function'] ) )
+                               .appendTo( $table );
                        }
 
+
                        return $table;
                },
 
                 * Included files pane
                 */
                buildIncludesPane: function () {
-                       var $list, i, len, file;
+                       var $table, i, length, file;
 
-                       $list = $( '<ul>' );
+                       $table = $( '<table>' );
 
-                       for ( i = 0, len = this.data.includes.length; i < len; i += 1 ) {
+                       for ( i = 0, length = this.data.includes.length; i < length; i += 1 ) {
                                file = this.data.includes[i];
-                               $( '<li>' )
-                                       .text( file.name )
-                                       .prepend( $( '<span class="mw-debug-right"></span>' ).text( file.size ) )
-                                       .appendTo( $list );
+                               $( '<tr>' )
+                                       .append( $( '<td>' ).text( file.name ) )
+                                       .append( $( '<td class="nr">' ).text( file.size ) )
+                                       .appendTo( $table );
                        }
 
-                       return $list;
+                       return $table;
                }
        };