WordPress.org
Get WordPress

Making WordPress.org

Changeset 677


Ignore:
Timestamp:
06/05/2014 09:46:52 PM (12 years ago)
Author:
coffee2code
Message:

Code Reference: Improvements to inline source code display. Fixes #176

  • More efficient implementation of get_source_code()
  • Add get_source_code_root_dir() which gets 'wp_parser_root_import_dir' option value if set by parser, else ABSPATH
  • Add post_type_has_source_code()
  • Use 'wporg' as the text domain
  • Slight tweak to JS height comparison to ensure functions that just fit don't trigger expansion handling
  • Allow x scrollbar for .source-code-container and adjust heights to account for its possible display
  • Add extra height to collapsed state of .source-code-container to partially show the first hidden line to better indicate there is more code
  • Add right border to .source-code-container so it is easier to tell if code is being clipped
  • Change 'View source' link to 'View source code:' label with explicit links to inline source and/or WP Trac code browser
  • Source code is stored in post meta; parse and store it as requested if it isn't
  • Sanity check to ensure proper conditions exist for parsing
  • Add optional 'force_parse' arg to get_source_code() to force reparsing of source file
Location:
sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer
Files:
7 edited

Legend:

Unmodified
Added
Removed

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/content-reference.php

    r676 r677  
    2929                ?>
    3030                <section class="source">
    31                         <p><strong><?php _e( 'Source file:', 'wporg' ); ?> </strong><a href="<?php echo get_source_file_archive_link( $source_file ); ?>"><?php echo esc_html( $source_file ); ?></a></p>
    32                         <p><a href="<?php echo get_source_file_link(); ?>"><?php _e( 'View source&hellip;', 'wporg' ); ?></a></p>
     31                        <p>
     32                                <strong><?php _e( 'Source file:', 'wporg' ); ?></strong>
     33                                <a href="<?php echo get_source_file_archive_link( $source_file ); ?>"><?php echo esc_html( $source_file ); ?></a><br />
     34                                <strong><?php _e( 'View source code:', 'wporg' ); ?></strong>
     35                                <?php if ( post_type_has_source_code() ) { ?>
     36                                <a href="#source-code"><?php _e( 'below', 'wporg' ); ?></a> or
     37                                <?php } ?>
     38                                <a href="<?php echo get_source_file_link(); ?>"><?php _e( 'on the WP Trac code browser&hellip;', 'wporg' ); ?></a>
     39                        </p>
    3340                </section>
    3441        <?php endif; ?>
    … …  
    117124        endif; ?>
    118125
    119         <?php if ( 'wp-parser-function' === get_post_type() || 'wp-parser-method' === get_post_type() ) : ?>
     126        <?php if ( post_type_has_source_code() ) : ?>
    120127                <hr />
     128                <a id="source-code"></a>
    121129                <section class="source-content">
    122130                        <h2><?php _e( 'Source', 'wporg' ); ?></h2>
    … …  
    124132                                <pre class="brush: php; toolbar: false;"><?php echo esc_html( get_source_code() ); ?></pre>
    125133                        </div>
    126                         <p><a href="#" class="show-complete-source"><?php _e( 'View full source code&hellip;', 'wporg-developer' ); ?></a></p>
     134                        <p><a href="#" class="show-complete-source"><?php _e( 'View full source code&hellip;', 'wporg' ); ?></a></p>
    127135                </section>
    128136        <?php endif; ?>

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/content-wp-parser-hook.php

    r657 r677  
    2727                ?>
    2828                <section class="source">
    29                         <p><strong><?php _e( 'Source file:', 'wporg' ); ?> </strong><a href="<?php echo get_source_file_archive_link( $source_file ); ?>"><?php echo esc_html( $source_file ); ?></a></p>
    30                         <p><a href="<?php echo get_source_file_link(); ?>"><?php _e( 'View source&hellip;', 'wporg' ); ?></a></p>
     29                        <p>
     30                                <strong><?php _e( 'Source file:', 'wporg' ); ?></strong>
     31                                <a href="<?php echo get_source_file_archive_link( $source_file ); ?>"><?php echo esc_html( $source_file ); ?></a><br />
     32                                <strong><?php _e( 'View source code:', 'wporg' ); ?></strong>
     33                                <a href="<?php echo get_source_file_link(); ?>"><?php _e( 'on the WP Trac code browser&hellip;', 'wporg' ); ?></a>
     34                        </p>
    3135                </section>
    3236        <?php endif; ?>

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/functions.php

    r676 r677  
    344344        wp_enqueue_script( 'wporg-developer-skip-link-focus-fix', get_template_directory_uri() . '/js/skip-link-focus-fix.js', array(), '20130115', true );
    345345
    346         if ( 'wp-parser-function' === get_post_type() || 'wp-parser-method' === get_post_type() ) {
     346        if ( post_type_has_source_code() ) {
    347347                wp_enqueue_script( 'wporg-developer-function-reference', get_template_directory_uri() . '/js/function-reference.js', array( 'jquery', 'syntaxhighlighter-core', 'syntaxhighlighter-brush-php' ), '20140515', true );
    348348                wp_enqueue_style( 'syntaxhighlighter-core' );

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/inc/template-tags.php

    r676 r677  
    640640
    641641        /**
    642          * Retrieve source code for a function
    643          *
    644          * @param int $post_id
    645          *
    646          * @return string The sourc
    647          */
    648         function get_source_code( $post_id = null ) {
     642         * Does the post type have source code?
     643         *
     644         * @param  string  Optional. The post type name. If blank, assumes current post type.
     645         *
     646         * @return boolean
     647         */
     648        function post_type_has_source_code( $post_type = null ) {
     649                $post_type                   = $post_type ? $post_type : get_post_type();
     650                $post_types_with_source_code = array( 'wp-parser-method', 'wp-parser-function' );
     651
     652                return in_array( $post_type, $post_types_with_source_code );
     653        }
     654
     655        /**
     656         * Retrieve the root directory of the parsed WP code.
     657         *
     658         * If the option 'wp_parser_root_import_dir' (as set by the parser) is not
     659         * set, then assume ABSPATH.
     660         *
     661         * @return string
     662         */
     663        function get_source_code_root_dir() {
     664                $root_dir = get_option( 'wp_parser_root_import_dir' );
     665
     666                return $root_dir ? trailingslashit( $root_dir ) : ABSPATH;
     667        }
     668
     669        /**
     670         * Retrieve source code for a function or method.
     671         *
     672         * @param int  $post_id     Optional. The post ID.
     673         * @param bool $force_parse Optional. Ignore potential value in post meta and reparse source file for source code?
     674         *
     675         * @return string The source code.
     676         */
     677        function get_source_code( $post_id = null, $force_parse = false ) {
    649678
    650679                if ( empty( $post_id ) ) {
    … …  
    652681                }
    653682
    654                 // Get the total file sourcecode.
     683                // Get the source code stored in post meta.
     684                $meta_key = '_wp-parser_source_code';
     685                if ( ! $force_parse && $source_code = get_post_meta( $post_id, $meta_key, true ) ) {
     686                        return $source_code;
     687                }
     688
     689                /* Source code hasn't been stored in post meta, so parse source file to get it. */
     690
     691                // Get the name of the source file.
    655692                $source_file = get_source_file( $post_id );
    656693
    657                 // Put the total source code in an array.
    658                 $total_source_code = file_get_contents( ABSPATH . $source_file );
    659                 $total_source_code = explode( "\n", $total_source_code );
    660 
    661694                // Get the start and end lines.
    662                 $start_line = get_post_meta( $post_id, '_wp-parser_line_num', true ) - 1;
    663                 $end_line =   get_post_meta( $post_id, '_wp-parser_end_line_num', true );
    664 
    665                 // Get the correct source code.
    666                 $source_code = array_slice( $total_source_code, $start_line, $end_line - $start_line );
    667 
    668                 return implode( "\n", $source_code );
     695                $start_line = intval( get_post_meta( $post_id, '_wp-parser_line_num', true ) ) - 1;
     696                $end_line   = intval( get_post_meta( $post_id, '_wp-parser_end_line_num', true ) );
     697
     698                // Sanity check to ensure proper conditions exist for parsing
     699                if ( ! $source_file || ! $start_line || ! $end_line || ( $start_line > $end_line ) ) {
     700                        return '';
     701                }
     702
     703                // Find just the relevant source code
     704                $source_code = '';
     705                $handle = @fopen( get_source_code_root_dir() . $source_file, 'r' );
     706                if ( $handle ) {
     707                        $line = -1;
     708                        while ( ! feof( $handle ) ) {
     709                                $line++;
     710                                $source_line = fgets( $handle );
     711                                if ( $line > $end_line ) {
     712                                        break;
     713                                }
     714                                if ( $line < $start_line ) {
     715                                        continue;
     716                                }
     717                                $source_code .= $source_line;
     718                        }
     719                        fclose( $handle );
     720                }
     721
     722                update_post_meta( $post_id, $meta_key, $source_code );
     723
     724                return $source_code;
    669725        }
    670726

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/js/function-reference.js

    r676 r677  
    1010                e.preventDefault();
    1111
    12                 var heightGoal = $sourceCodeTable.height() + 17;
     12                var heightGoal = $sourceCodeTable.height() + 47; // takes into consideration potential x-scrollbar
    1313
    1414                $sourceCodeContainer.animate( { height: heightGoal + 'px' } );
    … …  
    2828                $sourceCodeTable = $sourceContent.find( 'table' );
    2929
    30                 if ( 186 < $sourceCodeTable.height() ) {
     30                if ( 188 < $sourceCodeTable.height() ) {
    3131
    3232                        // Do this with javascript so javascript-less can enjoy the total sourcecode
    33                         // 1em (margin) + 10 * 17px. Lines are 1.1em which rounds to 17px: calc( 1em + 17px * 10 ).
    34                         $sourceCodeContainer.css( { height: '186px' } );
     33                        // 1em (margin) + 20 * 17px. Lines are 1.1em which rounds to 17px: calc( 1em + 17px * 20 ).
     34                        // Extra 10px added to partially show next line so it's clear there is more.
     35                        $( '.source-code-container' ).css( { height: '196px' } );
    3536
    3637                        $showCompleteSource = $( '.show-complete-source' );
    … …  
    3940                        $showCompleteSource.on( 'click', showCompleteSource );
    4041                }
     42
    4143        }
    4244

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/scss/main.scss

    r676 r677  
    857857
    858858        .source-code-container {
    859                 overflow: hidden;
     859                border-right: 1px solid #dfdfdf;
     860                overflow-x: auto;
     861                overflow-y: hidden;
    860862        }
    861863

  • sites/trunk/wordpress.org/public_html/wp-content/themes/pub/wporg-developer/stylesheets/main.css

    r676 r677  
    10691069}
    10701070.devhub-wrap .source-code-container {
    1071   overflow: hidden;
     1071  border-right: 1px solid #dfdfdf;
     1072  overflow-x: auto;
     1073  overflow-y: hidden;
    10721074}
    10731075.devhub-wrap .show-complete-source {
Note: See TracChangeset for help on using the changeset viewer.