diff options
Diffstat (limited to 'wp-includes/customize/class-wp-customize-header-image-control.php')
-rw-r--r-- | wp-includes/customize/class-wp-customize-header-image-control.php | 271 |
1 files changed, 271 insertions, 0 deletions
diff --git a/wp-includes/customize/class-wp-customize-header-image-control.php b/wp-includes/customize/class-wp-customize-header-image-control.php new file mode 100644 index 0000000..ecb134a --- /dev/null +++ b/wp-includes/customize/class-wp-customize-header-image-control.php @@ -0,0 +1,271 @@ +<?php +/** + * Customize API: WP_Customize_Header_Image_Control class + * + * @package WordPress + * @subpackage Customize + * @since 4.4.0 + */ + +/** + * Customize Header Image Control class. + * + * @since 3.4.0 + * + * @see WP_Customize_Image_Control + */ +class WP_Customize_Header_Image_Control extends WP_Customize_Image_Control { + + /** + * Customize control type. + * + * @since 4.2.0 + * @var string + */ + public $type = 'header'; + + /** + * Uploaded header images. + * + * @since 3.9.0 + * @var string + */ + public $uploaded_headers; + + /** + * Default header images. + * + * @since 3.9.0 + * @var string + */ + public $default_headers; + + /** + * Constructor. + * + * @since 3.4.0 + * + * @param WP_Customize_Manager $manager Customizer bootstrap instance. + */ + public function __construct( $manager ) { + parent::__construct( + $manager, + 'header_image', + array( + 'label' => __( 'Header Image' ), + 'settings' => array( + 'default' => 'header_image', + 'data' => 'header_image_data', + ), + 'section' => 'header_image', + 'removed' => 'remove-header', + 'get_url' => 'get_header_image', + ) + ); + } + + /** + */ + public function enqueue() { + wp_enqueue_media(); + wp_enqueue_script( 'customize-views' ); + + $this->prepare_control(); + + wp_localize_script( + 'customize-views', + '_wpCustomizeHeader', + array( + 'data' => array( + 'width' => absint( get_theme_support( 'custom-header', 'width' ) ), + 'height' => absint( get_theme_support( 'custom-header', 'height' ) ), + 'flex-width' => absint( get_theme_support( 'custom-header', 'flex-width' ) ), + 'flex-height' => absint( get_theme_support( 'custom-header', 'flex-height' ) ), + 'currentImgSrc' => $this->get_current_image_src(), + ), + 'nonces' => array( + 'add' => wp_create_nonce( 'header-add' ), + 'remove' => wp_create_nonce( 'header-remove' ), + ), + 'uploads' => $this->uploaded_headers, + 'defaults' => $this->default_headers, + ) + ); + + parent::enqueue(); + } + + /** + * @global Custom_Image_Header $custom_image_header + */ + public function prepare_control() { + global $custom_image_header; + if ( empty( $custom_image_header ) ) { + return; + } + + add_action( 'customize_controls_print_footer_scripts', array( $this, 'print_header_image_template' ) ); + + // Process default headers and uploaded headers. + $custom_image_header->process_default_headers(); + $this->default_headers = $custom_image_header->get_default_header_images(); + $this->uploaded_headers = $custom_image_header->get_uploaded_header_images(); + } + + /** + */ + public function print_header_image_template() { + ?> + <script type="text/template" id="tmpl-header-choice"> + <# if (data.random) { #> + <button type="button" class="button display-options random"> + <span class="dashicons dashicons-randomize dice"></span> + <# if ( data.type === 'uploaded' ) { #> + <?php _e( 'Randomize uploaded headers' ); ?> + <# } else if ( data.type === 'default' ) { #> + <?php _e( 'Randomize suggested headers' ); ?> + <# } #> + </button> + + <# } else { #> + + <button type="button" class="choice thumbnail" + data-customize-image-value="{{data.header.url}}" + data-customize-header-image-data="{{JSON.stringify(data.header)}}"> + <span class="screen-reader-text"> + <?php + /* translators: Hidden accessibility text. */ + _e( 'Set image' ); + ?> + </span> + <img src="{{data.header.thumbnail_url}}" alt="{{data.header.alt_text || data.header.description}}" /> + </button> + + <# if ( data.type === 'uploaded' ) { #> + <button type="button" class="dashicons dashicons-no close"> + <span class="screen-reader-text"> + <?php + /* translators: Hidden accessibility text. */ + _e( 'Remove image' ); + ?> + </span> + </button> + <# } #> + + <# } #> + </script> + + <script type="text/template" id="tmpl-header-current"> + <# if (data.choice) { #> + <# if (data.random) { #> + + <div class="placeholder"> + <span class="dashicons dashicons-randomize dice"></span> + <# if ( data.type === 'uploaded' ) { #> + <?php _e( 'Randomizing uploaded headers' ); ?> + <# } else if ( data.type === 'default' ) { #> + <?php _e( 'Randomizing suggested headers' ); ?> + <# } #> + </div> + + <# } else { #> + + <img src="{{data.header.thumbnail_url}}" alt="{{data.header.alt_text || data.header.description}}" /> + + <# } #> + <# } else { #> + + <div class="placeholder"> + <?php _e( 'No image set' ); ?> + </div> + + <# } #> + </script> + <?php + } + + /** + * @return string|void + */ + public function get_current_image_src() { + $src = $this->value(); + if ( isset( $this->get_url ) ) { + $src = call_user_func( $this->get_url, $src ); + return $src; + } + } + + /** + */ + public function render_content() { + $visibility = $this->get_current_image_src() ? '' : ' style="display:none" '; + $width = absint( get_theme_support( 'custom-header', 'width' ) ); + $height = absint( get_theme_support( 'custom-header', 'height' ) ); + ?> + <div class="customize-control-content"> + <?php + if ( current_theme_supports( 'custom-header', 'video' ) ) { + echo '<span class="customize-control-title">' . $this->label . '</span>'; + } + ?> + <div class="customize-control-notifications-container"></div> + <p class="customizer-section-intro customize-control-description"> + <?php + if ( current_theme_supports( 'custom-header', 'video' ) ) { + _e( 'Click “Add New Image” to upload an image file from your computer. Your theme works best with an image that matches the size of your video — you’ll be able to crop your image once you upload it for a perfect fit.' ); + } elseif ( $width && $height ) { + printf( + /* translators: %s: Header size in pixels. */ + __( 'Click “Add New Image” to upload an image file from your computer. Your theme works best with an image with a header size of %s pixels — you’ll be able to crop your image once you upload it for a perfect fit.' ), + sprintf( '<strong>%s × %s</strong>', $width, $height ) + ); + } elseif ( $width ) { + printf( + /* translators: %s: Header width in pixels. */ + __( 'Click “Add New Image” to upload an image file from your computer. Your theme works best with an image with a header width of %s pixels — you’ll be able to crop your image once you upload it for a perfect fit.' ), + sprintf( '<strong>%s</strong>', $width ) + ); + } else { + printf( + /* translators: %s: Header height in pixels. */ + __( 'Click “Add New Image” to upload an image file from your computer. Your theme works best with an image with a header height of %s pixels — you’ll be able to crop your image once you upload it for a perfect fit.' ), + sprintf( '<strong>%s</strong>', $height ) + ); + } + ?> + </p> + <div class="current"> + <label for="header_image-button"> + <span class="customize-control-title"> + <?php _e( 'Current header' ); ?> + </span> + </label> + <div class="container"> + </div> + </div> + <div class="actions"> + <?php if ( current_user_can( 'upload_files' ) ) : ?> + <button type="button"<?php echo $visibility; ?> class="button remove" aria-label="<?php esc_attr_e( 'Hide header image' ); ?>"><?php _e( 'Hide image' ); ?></button> + <button type="button" class="button new" id="header_image-button" aria-label="<?php esc_attr_e( 'Add New Header Image' ); ?>"><?php _e( 'Add New Image' ); ?></button> + <?php endif; ?> + </div> + <div class="choices"> + <span class="customize-control-title header-previously-uploaded"> + <?php _ex( 'Previously uploaded', 'custom headers' ); ?> + </span> + <div class="uploaded"> + <div class="list"> + </div> + </div> + <span class="customize-control-title header-default"> + <?php _ex( 'Suggested', 'custom headers' ); ?> + </span> + <div class="default"> + <div class="list"> + </div> + </div> + </div> + </div> + <?php + } +} |