WordPress.org
Get WordPress

Make WordPress Core

Ticket #29211: 29211.2.diff

File 29211.2.diff, 13.9 KB (added by markoheijnen, 10 years ago)

Revert part of JS so it's easier to find all HeaderTool cases

  • src/wp-admin/js/customize-controls.js

     
    18401840         * @augments wp.customize.Control
    18411841         * @augments wp.customize.Class
    18421842         */
    1843         api.HeaderControl = api.Control.extend({
     1843        api.CropControl = api.Control.extend({
    18441844                ready: function() {
    1845                         this.btnRemove = $('#customize-control-header_image .actions .remove');
    1846                         this.btnNew    = $('#customize-control-header_image .actions .new');
     1845                        var control = this
    18471846
     1847                        this.btnRemove = control.container.find('.actions .remove');
     1848                        this.btnNew    = control.container.find('.actions .new');
     1849
    18481850                        _.bindAll(this, 'openMedia', 'removeImage');
    18491851
    18501852                        this.btnNew.on( 'click', this.openMedia );
    … …  
    18541856
    18551857                        new api.HeaderTool.CurrentView({
    18561858                                model: api.HeaderTool.currentHeader,
    1857                                 el: '#customize-control-header_image .current .container'
     1859                                el: control.container.find('.current .container')
    18581860                        });
    18591861
    18601862                        new api.HeaderTool.ChoiceListView({
    18611863                                collection: api.HeaderTool.UploadsList = new api.HeaderTool.ChoiceList(),
    1862                                 el: '#customize-control-header_image .choices .uploaded .list'
     1864                                el: control.container.find('.choices .uploaded .list')
    18631865                        });
    18641866
    18651867                        new api.HeaderTool.ChoiceListView({
    18661868                                collection: api.HeaderTool.DefaultsList = new api.HeaderTool.DefaultsList(),
    1867                                 el: '#customize-control-header_image .choices .default .list'
     1869                                el: control.container.find('.choices .default .list')
    18681870                        });
    18691871
    18701872                        api.HeaderTool.combinedList = api.HeaderTool.CombinedList = new api.HeaderTool.CombinedList([
    … …  
    20962098                        api.HeaderTool.currentHeader.trigger('hide');
    20972099                        api.HeaderTool.CombinedList.trigger('control:removeImage');
    20982100                }
     2101        });
    20992102
     2103        /**
     2104         * @class
     2105         * @augments wp.customize.Control
     2106         * @augments wp.customize.Class
     2107         */
     2108        api.HeaderControl = api.CropControl.extend({
     2109
    21002110        });
    21012111
    21022112        /**
    … …  
    26992709                media:      api.MediaControl,
    27002710                upload:     api.UploadControl,
    27012711                image:      api.ImageControl,
     2712                cropimage:  api.CropControl,
    27022713                header:     api.HeaderControl,
    27032714                background: api.BackgroundControl,
    27042715                theme:      api.ThemeControl

  • src/wp-includes/class-wp-customize-control.php

     
    997997}
    998998
    999999/**
    1000  * Customize Header Image Control class.
     1000 * Customize Cropped Image Control class.
    10011001 *
    1002  * @since 3.4.0
     1002 * @since 4.3.0
    10031003 *
    10041004 * @see WP_Customize_Image_Control
    10051005 */
    1006 class WP_Customize_Header_Image_Control extends WP_Customize_Image_Control {
    1007         public $type = 'header';
    1008         public $uploaded_headers;
    1009         public $default_headers;
     1006abstract class WP_Customize_Cropped_Image_Control extends WP_Customize_Image_Control {
     1007        public $type = 'cropimage';
    10101008
     1009        protected $width  = 150;
     1010        protected $height = 150;
     1011        protected $flex_width  = false;
     1012        protected $flex_height = false;
     1013        protected $localized_name;
     1014        protected $current_title = '';
     1015
     1016        protected $uploaded_images = array();
     1017        protected $default_images  = array();
     1018
    10111019        /**
     1020         * Constructor.
     1021         *
     1022         * @since 3.4.0
     1023         * @uses WP_Customize_Image_Control::__construct()
     1024         *
    10121025         * @param WP_Customize_Manager $manager
    10131026         */
    1014         public function __construct( $manager ) {
    1015                 parent::__construct( $manager, 'header_image', array(
    1016                         'label'    => __( 'Header Image' ),
    1017                         'settings' => array(
    1018                                 'default' => 'header_image',
    1019                                 'data'    => 'header_image_data',
    1020                         ),
    1021                         'section'  => 'header_image',
    1022                         'removed'  => 'remove-header',
    1023                         'get_url'  => 'get_header_image',
    1024                 ) );
     1027        public function __construct( $manager, $id, $args ) {
     1028                $defaults = array(
     1029                        'localized_name' => '_cropped_image_' . $id
     1030                );
    10251031
     1032                $args = wp_parse_args( $args, $defaults );
     1033
     1034                parent::__construct( $manager, $id, $args );
    10261035        }
    10271036
    10281037        /**
    … …  
    10341043
    10351044                $this->prepare_control();
    10361045
    1037                 wp_localize_script( 'customize-views', '_wpCustomizeHeader', array(
     1046                wp_localize_script( 'customize-views', $this->localized_name, array(
    10381047                        'data' => array(
    1039                                 'width' => absint( get_theme_support( 'custom-header', 'width' ) ),
    1040                                 'height' => absint( get_theme_support( 'custom-header', 'height' ) ),
    1041                                 'flex-width' => absint( get_theme_support( 'custom-header', 'flex-width' ) ),
    1042                                 'flex-height' => absint( get_theme_support( 'custom-header', 'flex-height' ) ),
    1043                                 'currentImgSrc' => $this->get_current_image_src(),
     1048                                'width' => absint( $this->width ),
     1049                                'height' => absint( $this->height ),
     1050                                'flex-width' => absint( $this->flex_width ),
     1051                                'flex-height' => absint( $this->flex_height ),
    10441052                        ),
    10451053                        'nonces' => array(
    10461054                                'add' => wp_create_nonce( 'header-add' ),
    10471055                                'remove' => wp_create_nonce( 'header-remove' ),
    10481056                        ),
    1049                         'uploads' => $this->uploaded_headers,
    1050                         'defaults' => $this->default_headers
     1057                        'uploads'  => $this->uploaded_images,
     1058                        'defaults' => $this->default_images
    10511059                ) );
    10521060
    10531061                parent::enqueue();
    … …  
    10541062        }
    10551063
    10561064        /**
    1057          *
    1058          * @global Custom_Image_Header $custom_image_header
    1059          */
    1060         public function prepare_control() {
    1061                 global $custom_image_header;
    1062                 if ( empty( $custom_image_header ) ) {
    1063                         return;
    1064                 }
    1065 
    1066                 // Process default headers and uploaded headers.
    1067                 $custom_image_header->process_default_headers();
    1068                 $this->default_headers = $custom_image_header->get_default_header_images();
    1069                 $this->uploaded_headers = $custom_image_header->get_uploaded_header_images();
    1070         }
    1071 
    1072         /**
    10731065         * @access public
    10741066         */
    1075         public function print_header_image_template() {
     1067        public function print_crop_image_template() {
    10761068                ?>
    1077                 <script type="text/template" id="tmpl-header-choice">
    1078                         <# if (data.random) { #>
    1079                         <button type="button" class="button display-options random">
    1080                                 <span class="dashicons dashicons-randomize dice"></span>
    1081                                 <# if ( data.type === 'uploaded' ) { #>
    1082                                         <?php _e( 'Randomize uploaded headers' ); ?>
    1083                                 <# } else if ( data.type === 'default' ) { #>
    1084                                         <?php _e( 'Randomize suggested headers' ); ?>
    1085                                 <# } #>
    1086                         </button>
    1087 
    1088                         <# } else { #>
    1089 
    1090                         <# if (data.type === 'uploaded') { #>
    1091                                 <button type="button" class="dashicons dashicons-no close"><span class="screen-reader-text"><?php _e( 'Remove image' ); ?></span></button>
    1092                         <# } #>
    1093 
    1094                         <button type="button" class="choice thumbnail"
    1095                                 data-customize-image-value="{{{data.header.url}}}"
    1096                                 data-customize-header-image-data="{{JSON.stringify(data.header)}}">
    1097                                 <span class="screen-reader-text"><?php _e( 'Set image' ); ?></span>
    1098                                 <img src="{{{data.header.thumbnail_url}}}" alt="{{{data.header.alt_text || data.header.description}}}">
    1099                         </button>
    1100 
    1101                         <# } #>
    1102                 </script>
    1103 
    1104                 <script type="text/template" id="tmpl-header-current">
     1069                <script type="text/template" id="tmpl-cropped-current">
    11051070                        <# if (data.choice) { #>
    11061071                                <# if (data.random) { #>
    11071072
    … …  
    11381103        }
    11391104
    11401105        /**
    1141          * @return string|void
    1142          */
    1143         public function get_current_image_src() {
    1144                 $src = $this->value();
    1145                 if ( isset( $this->get_url ) ) {
    1146                         $src = call_user_func( $this->get_url, $src );
    1147                         return $src;
    1148                 }
    1149         }
    1150 
    1151         /**
    11521106         * @access public
    11531107         */
    11541108        public function render_content() {
    1155                 $this->print_header_image_template();
    1156                 $visibility = $this->get_current_image_src() ? '' : ' style="display:none" ';
    1157                 $width = absint( get_theme_support( 'custom-header', 'width' ) );
    1158                 $height = absint( get_theme_support( 'custom-header', 'height' ) );
     1109                $this->print_crop_image_template();
     1110
     1111                $width = absint( $this->width );
     1112                $height = absint( $this->height );
    11591113                ?>
    11601114
    1161 
    11621115                <div class="customize-control-content">
    11631116                        <p class="customizer-section-intro">
    11641117                                <?php
    11651118                                if ( $width && $height ) {
    1166                                         printf( __( 'While you can crop images to your liking after clicking <strong>Add new image</strong>, your theme recommends a header size of <strong>%s &times; %s</strong> pixels.' ), $width, $height );
     1119                                        printf( __( 'While you can crop images to your liking after clicking <strong>Add new image</strong>, your theme recommends a size of <strong>%s &times; %s</strong> pixels.' ), $width, $height );
    11671120                                } elseif ( $width ) {
    1168                                         printf( __( 'While you can crop images to your liking after clicking <strong>Add new image</strong>, your theme recommends a header width of <strong>%s</strong> pixels.' ), $width );
     1121                                        printf( __( 'While you can crop images to your liking after clicking <strong>Add new image</strong>, your theme recommends a width of <strong>%s</strong> pixels.' ), $width );
    11691122                                } else {
    1170                                         printf( __( 'While you can crop images to your liking after clicking <strong>Add new image</strong>, your theme recommends a header height of <strong>%s</strong> pixels.' ), $height );
     1123                                        printf( __( 'While you can crop images to your liking after clicking <strong>Add new image</strong>, your theme recommends a height of <strong>%s</strong> pixels.' ), $height );
    11711124                                }
    11721125                                ?>
    11731126                        </p>
    11741127                        <div class="current">
    11751128                                <span class="customize-control-title">
    1176                                         <?php _e( 'Current header' ); ?>
     1129                                        <?php echo $this->current_title ? $this->current_title : _x( 'Current', 'cropped image' ); ?>
    11771130                                </span>
    11781131                                <div class="container">
    11791132                                </div>
    11801133                        </div>
    11811134                        <div class="actions">
    1182                                 <?php /* translators: Hide as in hide header image via the Customizer */ ?>
    1183                                 <button type="button"<?php echo $visibility ?> class="button remove"><?php _ex( 'Hide image', 'custom header' ); ?></button>
    1184                                 <?php /* translators: New as in add new header image via the Customizer */ ?>
    1185                                 <button type="button" class="button new"><?php _ex( 'Add new image', 'header image' ); ?></button>
     1135                                <?php /* translators: Hide as in hide cropped image via the Customizer */ ?>
     1136                                <button type="button" class="button remove"><?php _ex( 'Hide image', 'crop image' ); ?></button>
     1137                                <?php /* translators: New as in add new cropped image via the Customizer */ ?>
     1138                                <button type="button" class="button new"><?php _ex( 'Add new image', 'cropped image' ); ?></button>
    11861139                                <div style="clear:both"></div>
    11871140                        </div>
    11881141                        <div class="choices">
    1189                                 <span class="customize-control-title header-previously-uploaded">
    1190                                         <?php _ex( 'Previously uploaded', 'custom headers' ); ?>
     1142                                <span class="customize-control-title cropped-image-previously-uploaded">
     1143                                        <?php _ex( 'Previously uploaded', 'cropped images' ); ?>
    11911144                                </span>
    11921145                                <div class="uploaded">
    11931146                                        <div class="list">
    11941147                                        </div>
    11951148                                </div>
    1196                                 <span class="customize-control-title header-default">
    1197                                         <?php _ex( 'Suggested', 'custom headers' ); ?>
     1149                                <span class="customize-control-title cropped-image-default">
     1150                                        <?php _ex( 'Suggested', 'cropped images' ); ?>
    11981151                                </span>
    11991152                                <div class="default">
    12001153                                        <div class="list">
    … …  
    12071160}
    12081161
    12091162/**
     1163 * Customize Header Image Control class.
     1164 *
     1165 * @since 3.4.0
     1166 *
     1167 * @see WP_Customize_Cropped_Image_Control
     1168 */
     1169class WP_Customize_Header_Image_Control extends WP_Customize_Cropped_Image_Control {
     1170        public $type = 'header';
     1171
     1172        /**
     1173         * @param WP_Customize_Manager $manager
     1174         */
     1175        public function __construct( $manager ) {
     1176                parent::__construct( $manager, 'header_image', array(
     1177                        'label'         => __( 'Header Image' ),
     1178                        'current_title' => __( 'Current header' ),
     1179                        'settings' => array(
     1180                                'default' => 'header_image',
     1181                                'data'    => 'header_image_data',
     1182                        ),
     1183                        'section'       => 'header_image',
     1184                        'removed'       => 'remove-header',
     1185                ) );
     1186
     1187                $this->width  = get_theme_support( 'custom-header', 'width' );
     1188                $this->height = get_theme_support( 'custom-header', 'height' );
     1189                $this->flex_width  = get_theme_support( 'custom-header', 'flex-width' );
     1190                $this->flex_height = get_theme_support( 'custom-header', 'flex-height' );
     1191                $this->localized_name = '_wpCustomizeHeader';
     1192        }
     1193
     1194        /**
     1195         *
     1196         * @global Custom_Image_Header $custom_image_header
     1197         */
     1198        public function prepare_control() {
     1199                global $custom_image_header;
     1200
     1201                if ( empty( $custom_image_header ) ) {
     1202                        return;
     1203                }
     1204
     1205                // Process default headers and uploaded headers.
     1206                $custom_image_header->process_default_headers();
     1207                $this->default_images  = $custom_image_header->get_default_header_images();
     1208                $this->uploaded_images = $custom_image_header->get_uploaded_header_images();
     1209        }
     1210
     1211        /**
     1212         * @access public
     1213         */
     1214        public function print_header_image_template() {
     1215                ?>
     1216                <script type="text/template" id="tmpl-header-choice">
     1217                        <# if (data.random) { #>
     1218                        <button type="button" class="button display-options random">
     1219                                <span class="dashicons dashicons-randomize dice"></span>
     1220                                <# if ( data.type === 'uploaded' ) { #>
     1221                                        <?php _e( 'Randomize uploaded headers' ); ?>
     1222                                <# } else if ( data.type === 'default' ) { #>
     1223                                        <?php _e( 'Randomize suggested headers' ); ?>
     1224                                <# } #>
     1225                        </button>
     1226
     1227                        <# } else { #>
     1228
     1229                        <# if (data.type === 'uploaded') { #>
     1230                                <button type="button" class="dashicons dashicons-no close"><span class="screen-reader-text"><?php _e( 'Remove image' ); ?></span></button>
     1231                        <# } #>
     1232
     1233                        <button type="button" class="choice thumbnail"
     1234                                data-customize-image-value="{{{data.header.url}}}"
     1235                                data-customize-header-image-data="{{JSON.stringify(data.header)}}">
     1236                                <span class="screen-reader-text"><?php _e( 'Set image' ); ?></span>
     1237                                <img src="{{{data.header.thumbnail_url}}}" alt="{{{data.header.alt_text || data.header.description}}}">
     1238                        </button>
     1239
     1240                        <# } #>
     1241                </script>
     1242                <?php
     1243        }
     1244
     1245        /**
     1246         * @access public
     1247         */
     1248        public function render_content() {
     1249                $this->print_header_image_template();
     1250
     1251                parent::render_content();
     1252        }
     1253}
     1254
     1255/**
    12101256 * Customize Theme Control class.
    12111257 *
    12121258 * @since 4.2.0

  • src/wp-includes/js/customize-views.js

     
    1616         * @augments wp.Backbone.View
    1717         */
    1818        api.HeaderTool.CurrentView = wp.Backbone.View.extend({
    19                 template: wp.template('header-current'),
     19                template: wp.template('cropped-current'),
    2020
    2121                initialize: function() {
    2222                        this.listenTo(this.model, 'change', this.render);