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.

git-svn-id: http://svn.automattic.com/wordpress/trunk@20319 1a063a9b-81f0-0310-95a4-ce76da25c4cd
This commit is contained in:
koopersmith 2012-03-29 06:35:54 +00:00
parent 7ddbabb3db
commit 79f8b89fbc
5 changed files with 119 additions and 100 deletions

View File

@ -1615,7 +1615,7 @@ function wp_ajax_upload_attachment() {
$post_id = null; $post_id = null;
} }
$post_data = is_array( $_REQUEST['post_data'] ) ? $_REQUEST['post_data'] : array(); $post_data = isset( $_REQUEST['post_data'] ) ? $_REQUEST['post_data'] : array();
$attachment_id = media_handle_upload( 'async-upload', $post_id, $post_data ); $attachment_id = media_handle_upload( 'async-upload', $post_id, $post_data );

View File

@ -17,11 +17,11 @@ class WP_Customize_Control {
public $priority = 10; public $priority = 10;
public $section = ''; public $section = '';
public $label = ''; public $label = '';
// @todo: remove control_params
public $control_params = array();
// @todo: remove choices // @todo: remove choices
public $choices = array(); public $choices = array();
public $json = array();
public $visibility; public $visibility;
public $type = 'text'; public $type = 'text';
@ -35,7 +35,7 @@ class WP_Customize_Control {
* @since 3.4.0 * @since 3.4.0
*/ */
function __construct( $manager, $id, $args = array() ) { function __construct( $manager, $id, $args = array() ) {
$keys = array_keys( get_class_vars( __CLASS__ ) ); $keys = array_keys( get_object_vars( $this ) );
foreach ( $keys as $key ) { foreach ( $keys as $key ) {
if ( isset( $args[ $key ] ) ) if ( isset( $args[ $key ] ) )
$this->$key = $args[ $key ]; $this->$key = $args[ $key ];
@ -90,18 +90,33 @@ class WP_Customize_Control {
return $this->settings[ $setting_key ]->value(); return $this->settings[ $setting_key ]->value();
} }
public function json( $args = array() ) { /**
$settings = array(); * Refresh the parameters passed to the JavaScript via JSON.
*
* @since 3.4.0
*/
public function to_json() {
$this->json['settings'] = array();
foreach ( $this->settings as $key => $setting ) { foreach ( $this->settings as $key => $setting ) {
$settings[ $key ] = $setting->id; $this->json['settings'][ $key ] = $setting->id;
} }
return array( $this->json['type'] = $this->type;
'type' => $this->type,
'params' => wp_parse_args( wp_parse_args( $args, array( if ( $this->visibility ) {
'settings' => $settings, if ( is_string( $this->visibility ) ) {
) ), $this->control_params ), $this->json['visibility'] = array(
); 'id' => $this->visibility,
'value' => true,
);
} else {
$this->json['visibility'] = array(
'id' => $this->visibility[0],
'value' => $this->visibility[1],
);
}
}
} }
/** /**
@ -258,60 +273,6 @@ class WP_Customize_Control {
</label> </label>
<?php <?php
break; break;
case 'upload':
?>
<label>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<div>
<input type="hidden" value="<?php echo esc_attr( $this->value() ); ?>" <?php $this->link(); ?> />
<a href="#" class="button-secondary upload"><?php _e( 'Upload' ); ?></a>
<a href="#" class="remove"><?php _e( 'Remove' ); ?></a>
</div>
</label>
<?php
break;
case 'image':
$value = $this->value();
$image = $value;
if ( isset( $this->control_params['get_url'] ) )
$image = call_user_func( $this->control_params['get_url'], $image );
?>
<label>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<input type="hidden" value="<?php echo esc_attr( $this->value() ); ?>" <?php $this->link(); ?> />
<div class="customize-image-picker">
<div class="thumbnail">
<?php if ( empty( $image ) ): ?>
<img style="display:none;" />
<?php else: ?>
<img src="<?php echo esc_url( $image ); ?>" />
<?php endif; ?>
</div>
<div class="actions">
<a href="#" class="upload"><?php _e( 'Upload New' ); ?></a>
<a href="#" class="change"><?php _e( 'Change Image' ); ?></a>
<a href="#" class="remove"><?php _e( 'Remove Image' ); ?></a>
</div>
<div class="library">
<ul>
<?php foreach ( $this->control_params['tabs'] as $tab ): ?>
<li data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
<?php echo esc_html( $tab[1] ); ?>
</li>
<?php endforeach; ?>
</ul>
<?php foreach ( $this->control_params['tabs'] as $tab ): ?>
<div class="library-content" data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
<?php call_user_func( $tab[2] ); ?>
</div>
<?php endforeach; ?>
</div>
</div>
</label>
<?php
break;
case 'dropdown-pages': case 'dropdown-pages':
$dropdown = wp_dropdown_pages( $dropdown = wp_dropdown_pages(
array( array(
@ -334,4 +295,81 @@ class WP_Customize_Control {
break; break;
} }
} }
}
class WP_Customize_Upload_Control extends WP_Customize_Control {
public $type = 'upload';
public $removed = '';
public $context;
public function enqueue() {
wp_enqueue_script( 'wp-plupload' );
}
public function to_json() {
parent::to_json();
$this->json['removed'] = $this->removed;
if ( $this->context )
$this->json['context'] = $this->context;
}
public function render_content() {
?>
<label>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<div>
<a href="#" class="button-secondary upload"><?php _e( 'Upload' ); ?></a>
<a href="#" class="remove"><?php _e( 'Remove' ); ?></a>
</div>
</label>
<?php
}
}
class WP_Customize_Image_Control extends WP_Customize_Upload_Control {
public $type = 'image';
public $tabs = array();
public $get_url;
public function render_content() {
$src = $this->value();
if ( isset( $this->get_url ) )
$src = call_user_func( $this->get_url, $src );
?>
<label>
<span class="customize-control-title"><?php echo esc_html( $this->label ); ?></span>
<div class="customize-image-picker">
<div class="thumbnail">
<?php if ( empty( $src ) ): ?>
<img style="display:none;" />
<?php else: ?>
<img src="<?php echo esc_url( $src ); ?>" />
<?php endif; ?>
</div>
<div class="actions">
<a href="#" class="upload"><?php _e( 'Upload New' ); ?></a>
<a href="#" class="change"><?php _e( 'Change Image' ); ?></a>
<a href="#" class="remove"><?php _e( 'Remove Image' ); ?></a>
</div>
<div class="library">
<ul>
<?php foreach ( $this->tabs as $tab ): ?>
<li data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
<?php echo esc_html( $tab[1] ); ?>
</li>
<?php endforeach; ?>
</ul>
<?php foreach ( $this->tabs as $tab ): ?>
<div class="library-content" data-customize-tab='<?php echo esc_attr( $tab[0] ); ?>'>
<?php call_user_func( $tab[2] ); ?>
</div>
<?php endforeach; ?>
</div>
</div>
</label>
<?php
}
} }

View File

@ -585,20 +585,17 @@ final class WP_Customize {
'theme_supports' => 'custom-header', 'theme_supports' => 'custom-header',
) ); ) );
$this->add_control( 'header_image', array( $this->add_control( new WP_Customize_Image_Control( $this, 'header_image', array(
'label' => 'Header Image', 'label' => 'Header Image',
'section' => 'header', 'section' => 'header',
'type' => 'image', 'context' => 'custom-header',
'control_params' => array( 'removed' => 'remove-header',
'context' => 'custom-header', 'get_url' => 'get_header_image',
'removed' => 'remove-header', 'tabs' => array(
'get_url' => 'get_header_image', array( 'uploaded', __('Uploaded'), 'wp_customize_print_uploaded_headers' ),
'tabs' => array( array( 'included', __('Included'), 'wp_customize_print_included_headers' ),
array( 'uploaded', __('Uploaded'), 'wp_customize_print_uploaded_headers' ),
array( 'included', __('Included'), 'wp_customize_print_included_headers' ),
),
), ),
) ); ) ) );
/* Custom Background */ /* Custom Background */
@ -627,14 +624,12 @@ final class WP_Customize {
'theme_supports' => 'custom-background', 'theme_supports' => 'custom-background',
) ); ) );
$this->add_control( 'background_image', array( $this->add_control( new WP_Customize_Upload_Control( $this, 'background_image', array(
'label' => __( 'Background Image' ), 'label' => __( 'Background Image' ),
'section' => 'background', 'section' => 'background',
'type' => 'upload', 'type' => 'upload',
'control_params' => array( 'context' => 'custom-background',
'context' => 'custom-background', ) ) );
),
) );
$this->add_setting( 'background_repeat', array( $this->add_setting( 'background_repeat', array(
'default' => 'repeat', 'default' => 'repeat',

View File

@ -107,22 +107,8 @@ do_action( 'customize_controls_print_scripts' );
} }
foreach ( $this->controls as $id => $control ) { foreach ( $this->controls as $id => $control ) {
$settings['controls'][ $id ] = $control->json(); $control->to_json();
$settings['controls'][ $id ] = $control->json;
if ( $control->visibility ) {
if ( is_string( $control->visibility ) ) {
$settings['controls'][ $id ]['visibility'] = array(
'id' => $control->visibility,
'value' => true,
);
} else {
$settings['controls'][ $id ]['visibility'] = array(
'id' => $control->visibility[0],
'value' => $control->visibility[1],
);
}
}
} }
?> ?>

View File

@ -361,7 +361,7 @@
control; control;
control = api.control.add( id, new constructor( id, { control = api.control.add( id, new constructor( id, {
params: data.params, params: data,
previewer: previewer previewer: previewer
} ) ); } ) );