WordPress.org

Make WordPress Core

Ticket #14890: dynamic custom header image sizes.patch

File dynamic custom header image sizes.patch, 13.5 KB (added by a.hoereth, 8 years ago)

svn patch

  • wp-admin/custom-header.php

     
    368368        }
    369369
    370370        jQuery(document).ready(function() {
    371                 var xinit = <?php echo HEADER_IMAGE_WIDTH; ?>;
    372                 var yinit = <?php echo HEADER_IMAGE_HEIGHT; ?>;
     371                var xinit = <?php header_image_width(); ?>;
     372                var yinit = <?php header_image_height(); ?>;
    373373                var ratio = xinit / yinit;
    374374                var ximg = jQuery('img#upload').width();
    375375                var yimg = jQuery('img#upload').height();
     
    393393                        y1: 0,
    394394                        x2: xinit,
    395395                        y2: yinit,
    396                         maxHeight: <?php echo HEADER_IMAGE_HEIGHT; ?>,
    397                         maxWidth: <?php echo HEADER_IMAGE_WIDTH; ?>,
     396                        maxHeight: <?php echo header_image_height(); ?>,
     397                        maxWidth: <?php echo header_image_width(); ?>,
    398398                        onInit: function () {
    399399                                jQuery('#width').val(xinit);
    400400                                jQuery('#height').val(yinit);
     
    443443          call_user_func( $this->admin_image_div_callback );
    444444        } else {
    445445        ?>
    446         <div id="headimg" style="max-width:<?php echo HEADER_IMAGE_WIDTH; ?>px;height:<?php echo HEADER_IMAGE_HEIGHT; ?>px;background-image:url(<?php esc_url ( header_image() ) ?>);">
     446        <div id="headimg" style="max-width:<?php header_image_width(); ?>px;height:<?php header_image_height(); ?>px;background-image:url(<?php esc_url ( header_image() ) ?>);">
    447447                <?php
    448448                if ( 'blank' == get_theme_mod('header_textcolor', HEADER_TEXTCOLOR) || '' == get_theme_mod('header_textcolor', HEADER_TEXTCOLOR) || ! $this->header_text() )
    449449                        $style = ' style="display:none;"';
     
    461461<th scope="row"><?php _e( 'Upload Image' ); ?></th>
    462462<td>
    463463        <p><?php _e( 'You can upload a custom header image to be shown at the top of your site instead of the default one. On the next screen you will be able to crop the image.' ); ?><br />
    464         <?php printf( __( 'Images of exactly <strong>%1$d &times; %2$d pixels</strong> will be used as-is.' ), HEADER_IMAGE_WIDTH, HEADER_IMAGE_HEIGHT ); ?></p>
     464<?php // need to tell the user about max or auto width / height here!! ?>
     465        <?php printf( __( 'Images of exactly <strong>%1$d &times; %2$d pixels</strong> will be used as-is.' ), get_header_image_width(), get_header_image_height() ); ?></p>
    465466        <form enctype="multipart/form-data" id="upload-form" method="post" action="<?php echo esc_attr( add_query_arg( 'step', 2 ) ) ?>">
    466467        <p>
    467468                <label for="upload"><?php _e( 'Choose an image from your computer:' ); ?></label><br />
     
    590591                $id = wp_insert_attachment($object, $file);
    591592
    592593                list($width, $height, $type, $attr) = getimagesize( $file );
     594               
     595                if ( !is_numeric( HEADER_IMAGE_WIDTH ) ) :
     596                        if ( HEADER_IMAGE_WIDTH == 'auto' ) :
     597                                $width_type = 2;
     598                                $width_con = $width;
     599                        elseif ( strpos ( HEADER_IMAGE_WIDTH, 'max:' ) === 0 ) :
     600                                $width_type = 3;
     601                                $width_con = preg_replace ( '/max:/', '', HEADER_IMAGE_WIDTH ); // remove 'max:'
     602                        else : // HEADER_IMAGE_WIDTH contains something unuseable
     603                                wp_die( 'Image could not be processed. HEADER_IMAGE_WIDTH constant contains an unuseable value. Please contact the template author.', __( 'Image Processing Error' ) ); // translation needed __()
     604                        endif;
     605                else : // HEADER_IMAGE_WIDTH is a number --> fixed width
     606                        $width_type = 1;
     607                        $width_con = HEADER_IMAGE_WIDTH;
     608                endif;
     609               
     610                if ( !is_numeric( HEADER_IMAGE_HEIGHT ) ) :
     611                        if ( HEADER_IMAGE_HEIGHT == 'auto' ) :
     612                                $height_type = 2;
     613                                $height_con = $height;         
     614                        elseif ( strpos ( HEADER_IMAGE_HEIGHT, 'max:' ) === 0 ) :
     615                                $height_type = 3;
     616                                $height_con = preg_replace ( '/max:/', '', HEADER_IMAGE_HEIGHT ); // remove 'max:'
     617                        else : // HEADER_IMAGE_HEIGHT contains something unuseable
     618                                wp_die( 'Image could not be processed. HEADER_IMAGE_HEIGHT constant contains an unuseable value. Please contact the template author.', __( 'Image Processing Error' ) ); // translation needed __()
     619                        endif;
     620                else : // HEADER_IMAGE_HEIGHT is a number --> fixed width
     621                        $height_type = 1;
     622                        $height_con = HEADER_IMAGE_HEIGHT;
     623                endif;
     624               
     625               
     626                // I did not simplified this if clauses!!! this way we can change some states to "manual cropping" (needs some testing first to see when it would be usefull) or even can add a "crop manually"/"crop automatically" button later!
     627                if ( $width_type == 1 ) { // width: fixed
     628                        if ( $height_type == 1 ) { // width: fixed & height: fixed
     629                                if ( $width == $width_con ) {
     630                                        if ( $height == $height_con ) {
     631                                                $direct_upload = true;
     632                                        } else { // $height != $height_con
     633                                                $direct_upload = false;
     634                                                $oitar = 1;
     635                                        }
     636                                } elseif ( $width > $width_con ) {
     637                                        $direct_upload = false;
     638                                        $oitar = $width / $width_con;
     639                                } else { // $width < $width_con
     640                                        $direct_upload = false;
     641                                        $oitar = 1;
     642                                }
     643                        } elseif ( $height_type == 2 ) { // width: fixed & height: auto
     644                                if ( $width == $width_con ) {
     645                                        $direct_upload = true;
     646                                } else { // $width != $width_con
     647                                        $direct_upload = true;
     648                                        $oitar = $width_con / $width;
     649                                }
     650                        } else { // $height_type == 3 // width: fixed & height: max
     651                                if ( $width == $width_con ) {
     652                                        if ( $height <= $height_con ) {
     653                                                $direct_upload = true;
     654                                        } else { // height > $height_con
     655                                                $direct_upload = false;
     656                                                $oitar = 1;
     657                                        }
     658                                }
     659                        }
     660                } elseif ( $width_type == 2 ) { // width: auto
     661                        if ( $height_type == 1 ) { // width: auto & height: fixed
     662                                if ( $height == $height_con ) {
     663                                        $direct_upload = true;
     664                                } else { // $height != $height_con
     665                                        $direct_upload = true;
     666                                        $oitar = $height_con / $height;
     667                                }
     668                        } elseif ( $height_type == 2 ) { // width: auto & height: auto
     669                                $direct_upload = true;
     670                        } else { // $height_type == 3 // width: auto & height: max
     671                                if ( $height <= $height_con ) {
     672                                        $direct_upload = true;
     673                                } else { // $height > $height_con
     674                                        $direct_upload = true;
     675                                        $oitar = $height_con / $height;
     676                                }
     677                        }
     678                } else { // $width_type == 3 // width: max
     679                        if ( $height_type == 1 ) { // width: max && height: fixed
     680                                if ( $width <= $width_con ) {
     681                                        if ( $height == $height_con ) {
     682                                                $direct_upload = true;
     683                                        } else { // $height != $height_con
     684                                                $direct_upload = false;
     685                                                $oitar = $height_con / $height;
     686                                        }
     687                                } else { // $width > $width_con
     688                                        if ( $height == $height_con ) {
     689                                                $direct_upload = true;
     690                                                $oitar = $width_con / $width;
     691                                        } elseif ( $height < $height_con ) {
     692                                                $direct_upload = false;
     693                                                $oitar = $width_con / $width;
     694                                        } else { // $height > $height_con
     695                                                $oitar = $height_con / $height;
     696                                                $width_new = $width * $oitar;
     697                                                if ( $width_new <= $width_con ) {
     698                                                        $direct_upload = true;
     699                                                } else { // $width_new > $width_con
     700                                                        $direct_upload = false;
     701                                                }
     702                                        }
     703                                }
     704                        } elseif ( $height_type == 2 ) { // width: max && height: auto
     705                                if ( $width <= $width_con ) {
     706                                        $direct_upload = true;
     707                                } else { // $width > $width_con
     708                                        $direct_upload = true;
     709                                        $oitar = $width_con / $width;
     710                                }
     711                        } else { // $height_type == 3 // width: max && height: max
     712                                if ( $width <= $width_con ) {
     713                                        if ( $height <= $height_con ) {
     714                                                $direct_upload = true;
     715                                        } else { // $height > $height_con
     716                                                $direct_upload = true;
     717                                                $oitar = $height_con / $height;
     718                                        }
     719                                } else { // $width > $width_con
     720                                        if ( $height <= $height_con ) {
     721                                                $direct_upload = true;
     722                                                $oitar = $width_con / $width;
     723                                        } else { // $height > $height_con
     724                                                $direct_upload = false;
     725                                                $oitar = $width_con / $width;
     726                                        }
     727                                }
     728                        }
     729                }
    593730
    594                 if ( $width == HEADER_IMAGE_WIDTH && $height == HEADER_IMAGE_HEIGHT ) {
    595                         // Add the meta-data
    596                         wp_update_attachment_metadata( $id, wp_generate_attachment_metadata( $id, $file ) );
    597 
     731                if ( ( isset($direct_upload) ) && ( $direct_upload == true ) ) {
     732                        if ( ( isset($oitar) ) && ( $oitar != 1 ) ) {
     733                                $image = wp_crop_image($file, 0, 0, $width, $height, $width * $oitar, $height * $oitar, false, str_replace(basename($file), 'midsize-'.basename($file), $file));
     734                                if ( is_wp_error( $image ) )
     735                                        wp_die( __( 'Image could not be processed.  Please go back and try again.' ), __( 'Image Processing Error' ) );
     736                                $image = apply_filters('wp_create_file_in_uploads', $image, $id); // For replication
     737                                $url = str_replace(basename($url), basename($image), $url);
     738                        }
     739                        wp_update_attachment_metadata( $id, wp_generate_attachment_metadata( $id, $file ) ); // Add the meta-data
    598740                        set_theme_mod('header_image', esc_url($url));
    599741                        do_action('wp_create_file_in_uploads', $file, $id); // For replication
    600742                        return $this->finished();
    601                 } elseif ( $width > HEADER_IMAGE_WIDTH ) {
    602                         $oitar = $width / HEADER_IMAGE_WIDTH;
    603                         $image = wp_crop_image($file, 0, 0, $width, $height, HEADER_IMAGE_WIDTH, $height / $oitar, false, str_replace(basename($file), 'midsize-'.basename($file), $file));
    604                         if ( is_wp_error( $image ) )
    605                                 wp_die( __( 'Image could not be processed.  Please go back and try again.' ), __( 'Image Processing Error' ) );
    606 
    607                         $image = apply_filters('wp_create_file_in_uploads', $image, $id); // For replication
    608 
    609                         $url = str_replace(basename($url), basename($image), $url);
    610                         $width = $width / $oitar;
    611                         $height = $height / $oitar;
    612                 } else {
    613                         $oitar = 1;
    614743                }
    615744                ?>
    616745
     
    648777         */
    649778        function step_3() {
    650779                check_admin_referer('custom-header-crop-image');
    651                 if ( $_POST['oitar'] > 1 ) {
     780                if ( $_POST['oitar'] != 1 ) {
    652781                        $_POST['x1'] = $_POST['x1'] * $_POST['oitar'];
    653782                        $_POST['y1'] = $_POST['y1'] * $_POST['oitar'];
    654783                        $_POST['width'] = $_POST['width'] * $_POST['oitar'];
  • wp-content/themes/twentyten/functions.php

     
    107107
    108108        // The height and width of your custom header. You can hook into the theme's own filters to change these values.
    109109        // Add a filter to twentyten_header_image_width and twentyten_header_image_height to change these values.
     110        // To define a maximum size use "max:" in front of the number. To leave uploaded images in their original size use "auto".  "auto" is not recommended though, because not so edepted end-users could easily break the theme with to big header images.
    110111        define( 'HEADER_IMAGE_WIDTH', apply_filters( 'twentyten_header_image_width', 940 ) );
    111112        define( 'HEADER_IMAGE_HEIGHT', apply_filters( 'twentyten_header_image_height', 198 ) );
    112113
  • wp-content/themes/twentyten/header.php

     
    7070                                        if ( is_singular() &&
    7171                                                        has_post_thumbnail( $post->ID ) &&
    7272                                                        ( /* $src, $width, $height */ $image = wp_get_attachment_image_src( get_post_thumbnail_id( $post->ID ), 'post-thumbnail' ) ) &&
    73                                                         $image[1] >= HEADER_IMAGE_WIDTH ) :
     73                                                        $image[1] >= header_image_width(); ) :
    7474                                                // Houston, we have a new header image!
    7575                                                echo get_the_post_thumbnail( $post->ID, 'post-thumbnail' );
    7676                                        elseif ( get_header_image() ) : ?>
    77                                                 <img src="<?php header_image(); ?>" width="<?php echo HEADER_IMAGE_WIDTH; ?>" height="<?php echo HEADER_IMAGE_HEIGHT; ?>" alt="" />
     77                                                <img src="<?php header_image(); ?>" width="<?php header_image_width(); ?>" height="<?php header_image_height(); ?>" alt="" />
    7878                                        <?php endif; ?>
    7979                        </div><!-- #branding -->
    8080
  • wp-includes/theme.php

     
    13591359}
    13601360
    13611361/**
     1362 * Retrieve custom header image width in digits only
     1363 *
     1364 * @since ???
     1365 * @uses HEADER_IMAGE_WIDTH
     1366 *
     1367 * @return string
     1368 */
     1369 function get_header_image_width() {
     1370        if ( !is_numeric( HEADER_IMAGE_WIDTH ) ) :
     1371                if ( HEADER_IMAGE_WIDTH == 'auto' ) :
     1372                        list( $width ) = getimagesize( str_replace ( get_bloginfo('wpurl'), '..', get_header_image() ) );
     1373                        $width_con = $width;
     1374                elseif ( strpos ( HEADER_IMAGE_WIDTH, 'max:' ) === 0 ) :
     1375                        $width_con = preg_replace ( '/max:/', '', HEADER_IMAGE_WIDTH ); // remove 'max:'
     1376                else : // HEADER_IMAGE_WIDTH contains something unuseable
     1377                        $width_con = HEADER_IMAGE_WIDTH;
     1378                endif;
     1379        else : // HEADER_IMAGE_WIDTH is a number --> fixed width
     1380                $width_con = HEADER_IMAGE_WIDTH;
     1381        endif;
     1382        return $width_con;
     1383}
     1384
     1385/**
     1386 * Display custom header image width in digits only
     1387 *
     1388 * @since ???
     1389 */
     1390function header_image_width() {
     1391        echo get_header_image_width();
     1392}
     1393
     1394/**
     1395 * Retrieve custom header image height in digits only
     1396 *
     1397 * @since ???
     1398 * @uses HEADER_IMAGE_HEIGHT
     1399 *
     1400 * @return string
     1401 */
     1402 function get_header_image_height() {
     1403        if ( !is_numeric( HEADER_IMAGE_HEIGHT ) ) :
     1404                if ( HEADER_IMAGE_HEIGHT == 'auto' ) :
     1405                        list( $width, $height ) = getimagesize( str_replace ( get_bloginfo('wpurl'), '..', get_header_image() ) );
     1406                        $height_con = $height;
     1407                elseif ( strpos ( HEADER_IMAGE_HEIGHT, 'max:' ) === 0 ) :
     1408                        $height_con = preg_replace ( '/max:/', '', HEADER_IMAGE_HEIGHT ); // remove 'max:'
     1409                else : // HEADER_IMAGE_HEIGHT contains something unuseable
     1410                        $height_con = HEADER_IMAGE_HEIGHT;
     1411                endif;
     1412        else : // HEADER_IMAGE_HEIGHT is a number --> fixed height
     1413                $height_con = HEADER_IMAGE_HEIGHT;
     1414        endif;
     1415        return $height_con;
     1416}
     1417
     1418/**
     1419 * Display custom header image height in digits only
     1420 *
     1421 * @since ???
     1422 */
     1423function header_image_height() {
     1424        echo get_header_image_height();
     1425}
     1426
     1427/**
    13621428 * Retrieve header image for custom header.
    13631429 *
    13641430 * @since 2.1.0