WordPress.org

Make WordPress Core

Changeset 20319


Ignore:
Timestamp:
03/29/2012 06:35:54 AM (8 years ago)
Author:
koopersmith
Message:

Theme Customizer: Move upload and image controls to subclasses. see #19910.

Instead of grouping together every control parameter into a single array and passing them all to the JS, use subclasses with custom parameters to implement additional PHP functionality and the parameter to send only the necessary variables to the JavaScript control.

Replaces WP_Customize_Control->control_params with WP_Customize_Control->json and WP_Customize_Control->to_json(). The to_json() method refreshes the json array passed to the JavaScript control (set to control.param by default).

Creates WP_Customize_Upload_Control and WP_Customize_Image_Control.

Location:
trunk
Files:
5 edited

Legend:

Unmodified
Added
Removed
  • trunk/wp-admin/includes/ajax-actions.php

    r20279 r20319  
    16161616    }
    16171617
    1618     $post_data = is_array( $_REQUEST['post_data'] ) ? $_REQUEST['post_data'] : array();
     1618    $post_data = isset( $_REQUEST['post_data'] ) ? $_REQUEST['post_data'] : array();
    16191619
    16201620    $attachment_id = media_handle_upload( 'async-upload', $post_id, $post_data );
  • trunk/wp-includes/class-wp-customize-control.php

    r20302 r20319  
    1818    public $section           = '';
    1919    public $label             = '';
    20     // @todo: remove control_params
    21     public $control_params    = array();
    2220    // @todo: remove choices
    2321    public $choices           = array();
    2422
     23    public $json = array();
     24
    2525    public $visibility;
    2626
     
    3636     */
    3737    function __construct( $manager, $id, $args = array() ) {
    38         $keys = array_keys( get_class_vars( __CLASS__ ) );
     38        $keys = array_keys( get_object_vars( $this ) );
    3939        foreach ( $keys as $key ) {
    4040            if ( isset( $args[ $key ] ) )
     
    9191    }
    9292
    93     public function json( $args = array() ) {
    94         $settings = array();
     93    /**
     94     * Refresh the parameters passed to the JavaScript via JSON.
     95     *
     96     * @since 3.4.0
     97     */
     98    public function to_json() {
     99        $this->json['settings'] = array();
    95100        foreach ( $this->settings as $key => $setting ) {
    96             $settings[ $key ] = $setting->id;
    97         }
    98 
    99         return array(
    100             'type'   => $this->type,
    101             'params' => wp_parse_args( wp_parse_args( $args, array(
    102                 'settings' => $settings,
    103             ) ), $this->control_params ),
    104         );
     101            $this->json['settings'][ $key ] = $setting->id;
     102        }
     103
     104        $this->json['type'] = $this->type;
     105
     106        if ( $this->visibility ) {
     107            if ( is_string( $this->visibility ) ) {
     108                $this->json['visibility'] = array(
     109                    'id'    => $this->visibility,
     110                    'value' => true,
     111                );
     112            } else {
     113                $this->json['visibility'] = array(
     114                    'id'    => $this->visibility[0],
     115                    'value' => $this->visibility[1],
     116                );
     117            }
     118
     119        }
    105120    }
    106121
     
    259274                <?php
    260275                break;
    261             case 'upload':
    262                 ?>
    263                 <label>
    264                     <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
    265                     <div>
    266                         <input type="hidden" value="<?php echo esc_attr( $this->value() ); ?>" <?php $this->link(); ?> />
    267                         <a href="#" class="button-secondary upload"><?php _e( 'Upload' ); ?></a>
    268                         <a href="#" class="remove"><?php _e( 'Remove' ); ?></a>
    269                     </div>
    270                 </label>
    271                 <?php
    272                 break;
    273             case 'image':
    274                 $value = $this->value();
    275 
    276                 $image = $value;
    277                 if ( isset( $this->control_params['get_url'] ) )
    278                     $image = call_user_func( $this->control_params['get_url'], $image );
    279 
    280                 ?>
    281                 <label>
    282                     <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
    283                     <input type="hidden" value="<?php echo esc_attr( $this->value() ); ?>" <?php $this->link(); ?> />
    284                     <div class="customize-image-picker">
    285                         <div class="thumbnail">
    286                             <?php if ( empty( $image ) ): ?>
    287                                 <img style="display:none;" />
    288                             <?php else: ?>
    289                                 <img src="<?php echo esc_url( $image ); ?>" />
    290                             <?php endif; ?>
    291                         </div>
    292                         <div class="actions">
    293                             <a href="#" class="upload"><?php _e( 'Upload New' ); ?></a>
    294                             <a href="#" class="change"><?php _e( 'Change Image' ); ?></a>
    295                             <a href="#" class="remove"><?php _e( 'Remove Image' ); ?></a>
    296                         </div>
    297                         <div class="library">
    298                             <ul>
    299                                 <?php foreach ( $this->control_params['tabs'] as $tab ): ?>
    300                                     <li data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
    301                                         <?php echo esc_html( $tab[1] ); ?>
    302                                     </li>
    303                                 <?php endforeach; ?>
    304                             </ul>
    305                             <?php foreach ( $this->control_params['tabs'] as $tab ): ?>
    306                                 <div class="library-content" data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
    307                                     <?php call_user_func( $tab[2] ); ?>
    308                                 </div>
    309                             <?php endforeach; ?>
    310                         </div>
    311                     </div>
    312                 </label>
    313                 <?php
    314                 break;
    315276            case 'dropdown-pages':
    316277                $dropdown = wp_dropdown_pages(
     
    336297    }
    337298}
     299
     300class WP_Customize_Upload_Control extends WP_Customize_Control {
     301    public $type    = 'upload';
     302    public $removed = '';
     303    public $context;
     304
     305    public function enqueue() {
     306        wp_enqueue_script( 'wp-plupload' );
     307    }
     308
     309    public function to_json() {
     310        parent::to_json();
     311
     312        $this->json['removed'] = $this->removed;
     313
     314        if ( $this->context )
     315            $this->json['context'] = $this->context;
     316    }
     317
     318    public function render_content() {
     319        ?>
     320        <label>
     321            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
     322            <div>
     323                <a href="#" class="button-secondary upload"><?php _e( 'Upload' ); ?></a>
     324                <a href="#" class="remove"><?php _e( 'Remove' ); ?></a>
     325            </div>
     326        </label>
     327        <?php
     328    }
     329}
     330
     331class WP_Customize_Image_Control extends WP_Customize_Upload_Control {
     332    public $type = 'image';
     333    public $tabs = array();
     334    public $get_url;
     335
     336    public function render_content() {
     337        $src = $this->value();
     338        if ( isset( $this->get_url ) )
     339            $src = call_user_func( $this->get_url, $src );
     340
     341        ?>
     342        <label>
     343            <span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
     344            <div class="customize-image-picker">
     345                <div class="thumbnail">
     346                    <?php if ( empty( $src ) ): ?>
     347                        <img style="display:none;" />
     348                    <?php else: ?>
     349                        <img src="<?php echo esc_url( $src ); ?>" />
     350                    <?php endif; ?>
     351                </div>
     352                <div class="actions">
     353                    <a href="#" class="upload"><?php _e( 'Upload New' ); ?></a>
     354                    <a href="#" class="change"><?php _e( 'Change Image' ); ?></a>
     355                    <a href="#" class="remove"><?php _e( 'Remove Image' ); ?></a>
     356                </div>
     357                <div class="library">
     358                    <ul>
     359                        <?php foreach ( $this->tabs as $tab ): ?>
     360                            <li data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
     361                                <?php echo esc_html( $tab[1] ); ?>
     362                            </li>
     363                        <?php endforeach; ?>
     364                    </ul>
     365                    <?php foreach ( $this->tabs as $tab ): ?>
     366                        <div class="library-content" data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
     367                            <?php call_user_func( $tab[2] ); ?>
     368                        </div>
     369                    <?php endforeach; ?>
     370                </div>
     371            </div>
     372        </label>
     373        <?php
     374    }
     375}
  • trunk/wp-includes/class-wp-customize.php

    r20306 r20319  
    586586        ) );
    587587
    588         $this->add_control( 'header_image', array(
     588        $this->add_control( new WP_Customize_Image_Control( $this, 'header_image', array(
    589589            'label'          => 'Header Image',
    590590            'section'        => 'header',
    591             'type'           => 'image',
    592             'control_params' => array(
    593                 'context'        => 'custom-header',
    594                 'removed'        => 'remove-header',
    595                 'get_url'        => 'get_header_image',
    596                 'tabs'           => array(
    597                     array( 'uploaded', __('Uploaded'), 'wp_customize_print_uploaded_headers' ),
    598                     array( 'included', __('Included'), 'wp_customize_print_included_headers' ),
    599                 ),
     591            'context'        => 'custom-header',
     592            'removed'        => 'remove-header',
     593            'get_url'        => 'get_header_image',
     594            'tabs'           => array(
     595                array( 'uploaded', __('Uploaded'), 'wp_customize_print_uploaded_headers' ),
     596                array( 'included', __('Included'), 'wp_customize_print_included_headers' ),
    600597            ),
    601         ) );
     598        ) ) );
    602599
    603600        /* Custom Background */
     
    628625        ) );
    629626
    630         $this->add_control( 'background_image', array(
     627        $this->add_control( new WP_Customize_Upload_Control( $this, 'background_image', array(
    631628            'label'          => __( 'Background Image' ),
    632629            'section'        => 'background',
    633630            'type'           => 'upload',
    634             'control_params' => array(
    635                 'context'        => 'custom-background',
    636             ),
    637         ) );
     631            'context'        => 'custom-background',
     632        ) ) );
    638633
    639634        $this->add_setting( 'background_repeat', array(
  • trunk/wp-includes/customize-controls.php

    r20295 r20319  
    108108
    109109    foreach ( $this->controls as $id => $control ) {
    110         $settings['controls'][ $id ] = $control->json();
    111 
    112         if ( $control->visibility ) {
    113             if ( is_string( $control->visibility ) ) {
    114                 $settings['controls'][ $id ]['visibility'] = array(
    115                     'id'    => $control->visibility,
    116                     'value' => true,
    117                 );
    118             } else {
    119                 $settings['controls'][ $id ]['visibility'] = array(
    120                     'id'    => $control->visibility[0],
    121                     'value' => $control->visibility[1],
    122                 );
    123             }
    124 
    125         }
     110        $control->to_json();
     111        $settings['controls'][ $id ] = $control->json;
    126112    }
    127113
  • trunk/wp-includes/js/customize-controls.dev.js

    r20301 r20319  
    362362
    363363            control = api.control.add( id, new constructor( id, {
    364                 params: data.params,
     364                params: data,
    365365                previewer: previewer
    366366            } ) );
Note: See TracChangeset for help on using the changeset viewer.