[Summary view] [Print] [Text view]

   1  <?php
   2  /**
   3   * Customize API: WP_Customize_Header_Image_Control class
   4   *
   5   * @package WordPress
   6   * @subpackage Customize
   7   * @since 4.4.0
   8   */
   9  
  10  /**
  11   * Customize Header Image Control class.
  12   *
  13   * @since 3.4.0
  14   *
  15   * @see WP_Customize_Image_Control
  16   */
  17  class WP_Customize_Header_Image_Control extends WP_Customize_Image_Control {
  18      /**
  19       * Customize control type.
  20       *
  21       * @since 4.2.0
  22       * @var string
  23       */
  24      public $type = 'header';
  25  
  26      /**
  27       * Uploaded header images.
  28       *
  29       * @since 3.9.0
  30       * @var string
  31       */
  32      public $uploaded_headers;
  33  
  34      /**
  35       * Default header images.
  36       *
  37       * @since 3.9.0
  38       * @var string
  39       */
  40      public $default_headers;
  41  
  42      /**
  43       * Constructor.
  44       *
  45       * @since 3.4.0
  46       *
  47       * @param WP_Customize_Manager $manager Customizer bootstrap instance.
  48       */
  49  	public function __construct( $manager ) {
  50          parent::__construct(
  51              $manager,
  52              'header_image',
  53              array(
  54                  'label'    => __( 'Header Image' ),
  55                  'settings' => array(
  56                      'default' => 'header_image',
  57                      'data'    => 'header_image_data',
  58                  ),
  59                  'section'  => 'header_image',
  60                  'removed'  => 'remove-header',
  61                  'get_url'  => 'get_header_image',
  62              )
  63          );
  64  
  65      }
  66  
  67      /**
  68       */
  69  	public function enqueue() {
  70          wp_enqueue_media();
  71          wp_enqueue_script( 'customize-views' );
  72  
  73          $this->prepare_control();
  74  
  75          wp_localize_script(
  76              'customize-views',
  77              '_wpCustomizeHeader',
  78              array(
  79                  'data'     => array(
  80                      'width'         => absint( get_theme_support( 'custom-header', 'width' ) ),
  81                      'height'        => absint( get_theme_support( 'custom-header', 'height' ) ),
  82                      'flex-width'    => absint( get_theme_support( 'custom-header', 'flex-width' ) ),
  83                      'flex-height'   => absint( get_theme_support( 'custom-header', 'flex-height' ) ),
  84                      'currentImgSrc' => $this->get_current_image_src(),
  85                  ),
  86                  'nonces'   => array(
  87                      'add'    => wp_create_nonce( 'header-add' ),
  88                      'remove' => wp_create_nonce( 'header-remove' ),
  89                  ),
  90                  'uploads'  => $this->uploaded_headers,
  91                  'defaults' => $this->default_headers,
  92              )
  93          );
  94  
  95          parent::enqueue();
  96      }
  97  
  98      /**
  99       * @global Custom_Image_Header $custom_image_header
 100       */
 101  	public function prepare_control() {
 102          global $custom_image_header;
 103          if ( empty( $custom_image_header ) ) {
 104              return;
 105          }
 106  
 107          add_action( 'customize_controls_print_footer_scripts', array( $this, 'print_header_image_template' ) );
 108  
 109          // Process default headers and uploaded headers.
 110          $custom_image_header->process_default_headers();
 111          $this->default_headers  = $custom_image_header->get_default_header_images();
 112          $this->uploaded_headers = $custom_image_header->get_uploaded_header_images();
 113      }
 114  
 115      /**
 116       */
 117  	public function print_header_image_template() {
 118          ?>
 119          <script type="text/template" id="tmpl-header-choice">
 120              <# if (data.random) { #>
 121              <button type="button" class="button display-options random">
 122                  <span class="dashicons dashicons-randomize dice"></span>
 123                  <# if ( data.type === 'uploaded' ) { #>
 124                      <?php _e( 'Randomize uploaded headers' ); ?>
 125                  <# } else if ( data.type === 'default' ) { #>
 126                      <?php _e( 'Randomize suggested headers' ); ?>
 127                  <# } #>
 128              </button>
 129  
 130              <# } else { #>
 131  
 132              <button type="button" class="choice thumbnail"
 133                  data-customize-image-value="{{{data.header.url}}}"
 134                  data-customize-header-image-data="{{JSON.stringify(data.header)}}">
 135                  <span class="screen-reader-text"><?php _e( 'Set image' ); ?></span>
 136                  <img src="{{{data.header.thumbnail_url}}}" alt="{{{data.header.alt_text || data.header.description}}}" />
 137              </button>
 138  
 139              <# if ( data.type === 'uploaded' ) { #>
 140                  <button type="button" class="dashicons dashicons-no close"><span class="screen-reader-text"><?php _e( 'Remove image' ); ?></span></button>
 141              <# } #>
 142  
 143              <# } #>
 144          </script>
 145  
 146          <script type="text/template" id="tmpl-header-current">
 147              <# if (data.choice) { #>
 148                  <# if (data.random) { #>
 149  
 150              <div class="placeholder">
 151                  <span class="dashicons dashicons-randomize dice"></span>
 152                  <# if ( data.type === 'uploaded' ) { #>
 153                      <?php _e( 'Randomizing uploaded headers' ); ?>
 154                  <# } else if ( data.type === 'default' ) { #>
 155                      <?php _e( 'Randomizing suggested headers' ); ?>
 156                  <# } #>
 157              </div>
 158  
 159                  <# } else { #>
 160  
 161              <img src="{{{data.header.thumbnail_url}}}" alt="{{{data.header.alt_text || data.header.description}}}" />
 162  
 163                  <# } #>
 164              <# } else { #>
 165  
 166              <div class="placeholder">
 167                  <?php _e( 'No image set' ); ?>
 168              </div>
 169  
 170              <# } #>
 171          </script>
 172          <?php
 173      }
 174  
 175      /**
 176       * @return string|void
 177       */
 178  	public function get_current_image_src() {
 179          $src = $this->value();
 180          if ( isset( $this->get_url ) ) {
 181              $src = call_user_func( $this->get_url, $src );
 182              return $src;
 183          }
 184      }
 185  
 186      /**
 187       */
 188  	public function render_content() {
 189          $visibility = $this->get_current_image_src() ? '' : ' style="display:none" ';
 190          $width      = absint( get_theme_support( 'custom-header', 'width' ) );
 191          $height     = absint( get_theme_support( 'custom-header', 'height' ) );
 192          ?>
 193          <div class="customize-control-content">
 194              <?php
 195              if ( current_theme_supports( 'custom-header', 'video' ) ) {
 196                  echo '<span class="customize-control-title">' . $this->label . '</span>';
 197              }
 198              ?>
 199              <div class="customize-control-notifications-container"></div>
 200              <p class="customizer-section-intro customize-control-description">
 201                  <?php
 202                  if ( current_theme_supports( 'custom-header', 'video' ) ) {
 203                      _e( 'Click &#8220;Add new image&#8221; to upload an image file from your computer. Your theme works best with an image that matches the size of your video &#8212; you&#8217;ll be able to crop your image once you upload it for a perfect fit.' );
 204                  } elseif ( $width && $height ) {
 205                      printf(
 206                          /* translators: %s: Header size in pixels. */
 207                          __( 'Click &#8220;Add new image&#8221; to upload an image file from your computer. Your theme works best with an image with a header size of %s pixels &#8212; you&#8217;ll be able to crop your image once you upload it for a perfect fit.' ),
 208                          sprintf( '<strong>%s &times; %s</strong>', $width, $height )
 209                      );
 210                  } elseif ( $width ) {
 211                      printf(
 212                          /* translators: %s: Header width in pixels. */
 213                          __( 'Click &#8220;Add new image&#8221; to upload an image file from your computer. Your theme works best with an image with a header width of %s pixels &#8212; you&#8217;ll be able to crop your image once you upload it for a perfect fit.' ),
 214                          sprintf( '<strong>%s</strong>', $width )
 215                      );
 216                  } else {
 217                      printf(
 218                          /* translators: %s: Header height in pixels. */
 219                          __( 'Click &#8220;Add new image&#8221; to upload an image file from your computer. Your theme works best with an image with a header height of %s pixels &#8212; you&#8217;ll be able to crop your image once you upload it for a perfect fit.' ),
 220                          sprintf( '<strong>%s</strong>', $height )
 221                      );
 222                  }
 223                  ?>
 224              </p>
 225              <div class="current">
 226                  <label for="header_image-button">
 227                      <span class="customize-control-title">
 228                          <?php _e( 'Current header' ); ?>
 229                      </span>
 230                  </label>
 231                  <div class="container">
 232                  </div>
 233              </div>
 234              <div class="actions">
 235                  <?php if ( current_user_can( 'upload_files' ) ) : ?>
 236                  <button type="button"<?php echo $visibility; ?> class="button remove" aria-label="<?php esc_attr_e( 'Hide header image' ); ?>"><?php _e( 'Hide image' ); ?></button>
 237                  <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>
 238                  <?php endif; ?>
 239              </div>
 240              <div class="choices">
 241                  <span class="customize-control-title header-previously-uploaded">
 242                      <?php _ex( 'Previously uploaded', 'custom headers' ); ?>
 243                  </span>
 244                  <div class="uploaded">
 245                      <div class="list">
 246                      </div>
 247                  </div>
 248                  <span class="customize-control-title header-default">
 249                      <?php _ex( 'Suggested', 'custom headers' ); ?>
 250                  </span>
 251                  <div class="default">
 252                      <div class="list">
 253                      </div>
 254                  </div>
 255              </div>
 256          </div>
 257          <?php
 258      }
 259  }