|
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 public $type = 'header'; |
|
19 public $uploaded_headers; |
|
20 public $default_headers; |
|
21 |
|
22 /** |
|
23 * Constructor. |
|
24 * |
|
25 * @since 3.4.0 |
|
26 * |
|
27 * @param WP_Customize_Manager $manager Customizer bootstrap instance. |
|
28 */ |
|
29 public function __construct( $manager ) { |
|
30 parent::__construct( $manager, 'header_image', array( |
|
31 'label' => __( 'Header Image' ), |
|
32 'settings' => array( |
|
33 'default' => 'header_image', |
|
34 'data' => 'header_image_data', |
|
35 ), |
|
36 'section' => 'header_image', |
|
37 'removed' => 'remove-header', |
|
38 'get_url' => 'get_header_image', |
|
39 ) ); |
|
40 |
|
41 } |
|
42 |
|
43 /** |
|
44 */ |
|
45 public function enqueue() { |
|
46 wp_enqueue_media(); |
|
47 wp_enqueue_script( 'customize-views' ); |
|
48 |
|
49 $this->prepare_control(); |
|
50 |
|
51 wp_localize_script( 'customize-views', '_wpCustomizeHeader', array( |
|
52 'data' => array( |
|
53 'width' => absint( get_theme_support( 'custom-header', 'width' ) ), |
|
54 'height' => absint( get_theme_support( 'custom-header', 'height' ) ), |
|
55 'flex-width' => absint( get_theme_support( 'custom-header', 'flex-width' ) ), |
|
56 'flex-height' => absint( get_theme_support( 'custom-header', 'flex-height' ) ), |
|
57 'currentImgSrc' => $this->get_current_image_src(), |
|
58 ), |
|
59 'nonces' => array( |
|
60 'add' => wp_create_nonce( 'header-add' ), |
|
61 'remove' => wp_create_nonce( 'header-remove' ), |
|
62 ), |
|
63 'uploads' => $this->uploaded_headers, |
|
64 'defaults' => $this->default_headers |
|
65 ) ); |
|
66 |
|
67 parent::enqueue(); |
|
68 } |
|
69 |
|
70 /** |
|
71 * |
|
72 * @global Custom_Image_Header $custom_image_header |
|
73 */ |
|
74 public function prepare_control() { |
|
75 global $custom_image_header; |
|
76 if ( empty( $custom_image_header ) ) { |
|
77 return; |
|
78 } |
|
79 |
|
80 add_action( 'customize_controls_print_footer_scripts', array( $this, 'print_header_image_template' ) ); |
|
81 |
|
82 // Process default headers and uploaded headers. |
|
83 $custom_image_header->process_default_headers(); |
|
84 $this->default_headers = $custom_image_header->get_default_header_images(); |
|
85 $this->uploaded_headers = $custom_image_header->get_uploaded_header_images(); |
|
86 } |
|
87 |
|
88 /** |
|
89 */ |
|
90 public function print_header_image_template() { |
|
91 ?> |
|
92 <script type="text/template" id="tmpl-header-choice"> |
|
93 <# if (data.random) { #> |
|
94 <button type="button" class="button display-options random"> |
|
95 <span class="dashicons dashicons-randomize dice"></span> |
|
96 <# if ( data.type === 'uploaded' ) { #> |
|
97 <?php _e( 'Randomize uploaded headers' ); ?> |
|
98 <# } else if ( data.type === 'default' ) { #> |
|
99 <?php _e( 'Randomize suggested headers' ); ?> |
|
100 <# } #> |
|
101 </button> |
|
102 |
|
103 <# } else { #> |
|
104 |
|
105 <button type="button" class="choice thumbnail" |
|
106 data-customize-image-value="{{{data.header.url}}}" |
|
107 data-customize-header-image-data="{{JSON.stringify(data.header)}}"> |
|
108 <span class="screen-reader-text"><?php _e( 'Set image' ); ?></span> |
|
109 <img src="{{{data.header.thumbnail_url}}}" alt="{{{data.header.alt_text || data.header.description}}}"> |
|
110 </button> |
|
111 |
|
112 <# if ( data.type === 'uploaded' ) { #> |
|
113 <button type="button" class="dashicons dashicons-no close"><span class="screen-reader-text"><?php _e( 'Remove image' ); ?></span></button> |
|
114 <# } #> |
|
115 |
|
116 <# } #> |
|
117 </script> |
|
118 |
|
119 <script type="text/template" id="tmpl-header-current"> |
|
120 <# if (data.choice) { #> |
|
121 <# if (data.random) { #> |
|
122 |
|
123 <div class="placeholder"> |
|
124 <span class="dashicons dashicons-randomize dice"></span> |
|
125 <# if ( data.type === 'uploaded' ) { #> |
|
126 <?php _e( 'Randomizing uploaded headers' ); ?> |
|
127 <# } else if ( data.type === 'default' ) { #> |
|
128 <?php _e( 'Randomizing suggested headers' ); ?> |
|
129 <# } #> |
|
130 </div> |
|
131 |
|
132 <# } else { #> |
|
133 |
|
134 <img src="{{{data.header.thumbnail_url}}}" alt="{{{data.header.alt_text || data.header.description}}}" /> |
|
135 |
|
136 <# } #> |
|
137 <# } else { #> |
|
138 |
|
139 <div class="placeholder"> |
|
140 <?php _e( 'No image set' ); ?> |
|
141 </div> |
|
142 |
|
143 <# } #> |
|
144 </script> |
|
145 <?php |
|
146 } |
|
147 |
|
148 /** |
|
149 * @return string|void |
|
150 */ |
|
151 public function get_current_image_src() { |
|
152 $src = $this->value(); |
|
153 if ( isset( $this->get_url ) ) { |
|
154 $src = call_user_func( $this->get_url, $src ); |
|
155 return $src; |
|
156 } |
|
157 } |
|
158 |
|
159 /** |
|
160 */ |
|
161 public function render_content() { |
|
162 $visibility = $this->get_current_image_src() ? '' : ' style="display:none" '; |
|
163 $width = absint( get_theme_support( 'custom-header', 'width' ) ); |
|
164 $height = absint( get_theme_support( 'custom-header', 'height' ) ); |
|
165 ?> |
|
166 <div class="customize-control-content"> |
|
167 <?php if ( current_theme_supports( 'custom-header', 'video' ) ) { |
|
168 echo '<span class="customize-control-title">' . $this->label . '</span>'; |
|
169 } ?> |
|
170 <div class="customize-control-notifications-container"></div> |
|
171 <p class="customizer-section-intro customize-control-description"> |
|
172 <?php |
|
173 if ( current_theme_supports( 'custom-header', 'video' ) ) { |
|
174 _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.' ); |
|
175 } elseif ( $width && $height ) { |
|
176 /* translators: %s: header size in pixels */ |
|
177 printf( __( '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.' ), |
|
178 sprintf( '<strong>%s × %s</strong>', $width, $height ) |
|
179 ); |
|
180 } elseif ( $width ) { |
|
181 /* translators: %s: header width in pixels */ |
|
182 printf( __( '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.' ), |
|
183 sprintf( '<strong>%s</strong>', $width ) |
|
184 ); |
|
185 } else { |
|
186 /* translators: %s: header height in pixels */ |
|
187 printf( __( '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.' ), |
|
188 sprintf( '<strong>%s</strong>', $height ) |
|
189 ); |
|
190 } |
|
191 ?> |
|
192 </p> |
|
193 <div class="current"> |
|
194 <label for="header_image-button"> |
|
195 <span class="customize-control-title"> |
|
196 <?php _e( 'Current header' ); ?> |
|
197 </span> |
|
198 </label> |
|
199 <div class="container"> |
|
200 </div> |
|
201 </div> |
|
202 <div class="actions"> |
|
203 <?php if ( current_user_can( 'upload_files' ) ): ?> |
|
204 <button type="button"<?php echo $visibility; ?> class="button remove" aria-label="<?php esc_attr_e( 'Hide header image' ); ?>"><?php _e( 'Hide image' ); ?></button> |
|
205 <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> |
|
206 <?php endif; ?> |
|
207 </div> |
|
208 <div class="choices"> |
|
209 <span class="customize-control-title header-previously-uploaded"> |
|
210 <?php _ex( 'Previously uploaded', 'custom headers' ); ?> |
|
211 </span> |
|
212 <div class="uploaded"> |
|
213 <div class="list"> |
|
214 </div> |
|
215 </div> |
|
216 <span class="customize-control-title header-default"> |
|
217 <?php _ex( 'Suggested', 'custom headers' ); ?> |
|
218 </span> |
|
219 <div class="default"> |
|
220 <div class="list"> |
|
221 </div> |
|
222 </div> |
|
223 </div> |
|
224 </div> |
|
225 <?php |
|
226 } |
|
227 } |