PluginProbe
Elementor Website Builder – more than just a page builder / 3.1.2
Elementor Website Builder – more than just a page builder v3.1.2
4.3.0-beta2 4.3.0-beta1 4.2.4 4.2.3 4.2.2 4.2.1 4.2.0 4.1.5 4.2.0-beta2 4.2.0-dev2 4.2.0-beta1 4.1.4 4.1.3 4.1.2 4.1.1 4.1.0 4.1.0-beta3 4.1.0-dev3 4.0.9 4.1.0-beta2 4.1.0-dev2 4.0.8 4.1.0-beta1 4.1.0-dev1 4.0.7 All 451 releases
← All changes | includes/controls/media.php +52 -298 4.1.03.1.2 View file →
@@ -1,8 +1,7 @@
1 1 <?php
2 2 namespace Elementor;
3 3
4 -use Elementor\Core\Utils\Hints;
5 4 use Elementor\Modules\DynamicTags\Module as TagsModule;
6 5
7 6 if ( ! defined( 'ABSPATH' ) ) {
8 7 exit; // Exit if accessed directly.
@@ -46,20 +45,11 @@
46 45 public function get_default_value() {
47 46 return [
48 47 'url' => '',
49 48 'id' => '',
50 - 'size' => '',
51 49 ];
52 50 }
53 51
54 - public function on_export( $settings ) {
55 - if ( ! empty( $settings['url'] ) ) {
56 - do_action( 'elementor/templates/collect_media_url', $settings['url'], $settings );
57 - }
58 -
59 - return $settings;
60 - }
61 -
62 52 /**
63 53 * Import media images.
64 54 *
65 55 * Used to import media control files from external sites while importing
@@ -67,9 +57,9 @@
67 57 *
68 58 * @since 1.0.0
69 59 * @access public
70 60 *
71 - * @param array $settings Control settings.
61 + * @param array $settings Control settings
72 62 *
73 63 * @return array Control settings.
74 64 */
75 65 public function on_import( $settings ) {
@@ -76,19 +66,8 @@
76 66 if ( empty( $settings['url'] ) ) {
77 67 return $settings;
78 68 }
79 69
80 - $local_file_path = \Elementor\TemplateLibrary\Classes\Media_Mapper::get_local_file_path( $settings['url'] );
81 - $imported_attachment = false;
82 -
83 - if ( $local_file_path !== $settings['url'] && file_exists( $local_file_path ) ) {
84 - $imported_attachment = Plugin::$instance->templates_manager->get_import_images_instance()->import_local_file( $local_file_path );
85 - }
86 -
87 - if ( $imported_attachment ) {
88 - return $imported_attachment;
89 - }
90 -
91 70 $settings = Plugin::$instance->templates_manager->get_import_images_instance()->import( $settings );
92 71
93 72 if ( ! $settings ) {
94 73 $settings = [
@@ -100,25 +79,8 @@
100 79 return $settings;
101 80 }
102 81
103 82 /**
104 - * Support SVG and JSON Import
105 - *
106 - * Called by the 'upload_mimes' filter. Adds SVG and JSON mime types to the list of WordPress' allowed mime types.
107 - *
108 - * @since 3.4.6
109 - * @deprecated 3.5.0
110 - *
111 - * @param mixed $mimes
112 - * @return mixed
113 - */
114 - public function support_svg_and_json_import( $mimes ) {
115 - Plugin::$instance->modules_manager->get_modules( 'dev-tools' )->deprecation->deprecated_function( __METHOD__, '3.5.0' );
116 -
117 - return $mimes;
118 - }
119 -
120 - /**
121 83 * Enqueue media control scripts and styles.
122 84 *
123 85 * Used to register and enqueue custom scripts and styles used by the media
124 86 * control.
@@ -128,9 +90,9 @@
128 90 */
129 91 public function enqueue() {
130 92 global $wp_version;
131 93
132 - $suffix = Utils::is_script_debug() ? '' : '.min';
94 + $suffix = defined( 'SCRIPT_DEBUG' ) && SCRIPT_DEBUG ? '' : '.min';
133 95 wp_enqueue_media();
134 96
135 97 wp_enqueue_style(
136 98 'media',
@@ -165,254 +127,74 @@
165 127 * @access public
166 128 */
167 129 public function content_template() {
168 130 ?>
169 - <#
170 - // For BC.
171 - if ( data.media_type ) {
172 - data.media_types = [ data.media_type ];
173 - }
174 -
175 - if ( data.should_include_svg_inline_option ) {
176 - data.media_types.push( 'svg' );
177 - }
178 -
179 - // Determine if the current media type is viewable.
180 - const isViewable = () => {
181 - const viewable = [
182 - 'image',
183 - 'video',
184 - 'svg',
185 - ];
186 -
187 - // Make sure that all media types are viewable.
188 - return data.media_types.every( ( type ) => viewable.includes( type ) );
189 - };
190 -
191 - // Get the preview type for the current media type.
192 - const getPreviewType = () => {
193 - if ( data.media_types.includes( 'video' ) ) {
194 - return 'video';
195 - }
196 -
197 - if ( data.media_types.includes( 'image' ) || data.media_types.includes( 'svg' ) ) {
198 - return 'image';
199 - }
200 -
201 - return 'none';
202 - }
203 -
204 - // Retrieve a button label by media type.
205 - const getButtonLabel = ( mediaType ) => {
206 - switch( mediaType ) {
207 - case 'image':
208 - return '<?php esc_html_e( 'Choose Image', 'elementor' ); ?>';
209 -
210 - case 'video':
211 - return '<?php esc_html_e( 'Choose Video', 'elementor' ); ?>';
212 -
213 - case 'svg':
214 - return '<?php esc_html_e( 'Choose SVG', 'elementor' ); ?>';
215 -
216 - default:
217 - return '<?php esc_html_e( 'Choose File', 'elementor' ); ?>';
218 - }
219 - }
220 - #>
221 131 <div class="elementor-control-field elementor-control-media">
222 132 <label class="elementor-control-title">{{{ data.label }}}</label>
223 - <#
224 - if ( isViewable() ) {
225 - let inputWrapperClasses = 'elementor-control-input-wrapper';
133 + <# if ( 'image' === data.media_type || 'video' === data.media_type ) {
134 + var inputWrapperClasses = 'elementor-control-input-wrapper elementor-aspect-ratio-219';
226 135
227 - if ( ! data.label_block ) {
228 - inputWrapperClasses += ' elementor-control-unit-5';
229 - }
136 + if ( ! data.label_block ) {
137 + inputWrapperClasses += ' elementor-control-unit-5';
138 + }
230 139 #>
231 - <div class="{{{ inputWrapperClasses }}}">
232 - <div class="elementor-control-media__content elementor-control-tag-area elementor-control-preview-area">
233 - <div class="elementor-control-media-area">
234 - <div class="elementor-control-media__remove elementor-control-media__content__remove" data-tooltip="<?php echo esc_attr__( 'Remove', 'elementor' ); ?>">
235 - <i class="eicon-trash-o" aria-hidden="true"></i>
236 - <span class="elementor-screen-only"><?php echo esc_html__( 'Remove', 'elementor' ); ?></span>
237 - </div>
238 - <#
239 - switch( getPreviewType() ) {
240 - case 'image':
241 - #>
242 - <div class="elementor-control-media__preview"></div>
243 - <#
244 - break;
245 -
246 - case 'video':
247 - #>
248 - <video class="elementor-control-media-video" preload="metadata"></video>
249 - <i class="eicon-video-camera" aria-hidden="true"></i>
250 - <#
251 - break;
252 - }
253 - #>
140 + <div class="{{{ inputWrapperClasses }}}">
141 + <div class="elementor-control-media__content elementor-control-tag-area elementor-control-preview-area elementor-fit-aspect-ratio">
142 + <div class="elementor-control-media-upload-button elementor-control-media__content__upload-button elementor-fit-aspect-ratio">
143 + <i class="eicon-plus-circle" aria-hidden="true"></i>
144 + </div>
145 + <div class="elementor-control-media-area elementor-fit-aspect-ratio">
146 + <div class="elementor-control-media__remove elementor-control-media__content__remove" title="<?php echo __( 'Remove', 'elementor' ); ?>">
147 + <i class="eicon-trash-o"></i>
254 148 </div>
255 - <div class="elementor-control-media-upload-button elementor-control-media__content__upload-button">
256 - <i class="eicon-plus-circle" aria-hidden="true"></i>
257 - <span class="elementor-screen-only"><?php echo esc_html__( 'Add', 'elementor' ); ?></span>
258 - </div>
259 - <div class="elementor-control-media__tools elementor-control-dynamic-switcher-wrapper">
260 - <#
261 - data.media_types.forEach( ( type ) => {
262 - #>
263 - <div class="elementor-control-media__tool elementor-control-media__replace" data-media-type="{{{ type }}}">{{{ getButtonLabel( type ) }}}</div>
264 - <#
265 - } );
266 - #>
267 - </div>
149 + <# if( 'image' === data.media_type ) { #>
150 + <div class="elementor-control-media__preview elementor-fit-aspect-ratio"></div>
151 + <# } else if( 'video' === data.media_type ) { #>
152 + <video class="elementor-control-media-video" preload="metadata"></video>
153 + <i class="eicon-video-camera"></i>
154 + <# } #>
268 155 </div>
269 -
270 - <?php
271 - /*
272 - ?>
273 - <div class="elementor-control-media__warnings" role="alert" style="display: none;">
274 - <?php
275 - Hints::get_notice_template( [
276 - 'type' => 'warning',
277 - 'content' => esc_html__( 'This image doesn’t contain ALT text - which is necessary for accessibility and SEO.', 'elementor' ),
278 - 'icon' => true,
279 - ] );
280 - ?>
156 + <div class="elementor-control-media__tools elementor-control-dynamic-switcher-wrapper">
157 + <# if( 'image' === data.media_type ) { #>
158 + <div class="elementor-control-media__tool elementor-control-media__replace" data-media-type="image"><?php echo __( 'Choose Image', 'elementor' ); ?></div>
159 + <# if ( data.should_include_svg_inline_option) { #>
160 + <div class="elementor-control-media__tool elementor-control-media__replace" data-media-type="svg"><?php echo __( 'Choose Svg', 'elementor' ); ?></div>
161 + <# } #>
162 + <# } else if( 'video' === data.media_type ) { #>
163 + <div class="elementor-control-media__tool elementor-control-media__replace" data-media-type="video"><?php echo __( 'Choose Video', 'elementor' ); ?></div>
164 + <# } #>
281 165 </div>
282 - <?php
283 - */ ?>
284 - <?php $this->maybe_display_io_hints(); ?>
285 166 </div>
286 - <# } /* endif isViewable() */ else { #>
287 - <div class="elementor-control-media__file elementor-control-preview-area">
288 - <div class="elementor-control-media__file__content">
289 - <div class="elementor-control-media__file__content__label"><?php echo esc_html__( 'Click the media icon to upload file', 'elementor' ); ?></div>
290 - <div class="elementor-control-media__file__content__info">
291 - <div class="elementor-control-media__file__content__info__icon">
292 - <i class="eicon-document-file"></i>
293 - </div>
294 - <div class="elementor-control-media__file__content__info__name"></div>
167 + </div>
168 + <# } else { #>
169 + <div class="elementor-control-media__file elementor-control-preview-area">
170 + <div class="elementor-control-media__file__content">
171 + <div class="elementor-control-media__file__content__label"><?php echo __( 'Click the media icon to upload file', 'elementor' ); ?></div>
172 + <div class="elementor-control-media__file__content__info">
173 + <div class="elementor-control-media__file__content__info__icon">
174 + <i class="eicon-document-file"></i>
295 175 </div>
176 + <div class="elementor-control-media__file__content__info__name"></div>
296 177 </div>
297 - <div class="elementor-control-media__file__controls">
298 - <div class="elementor-control-media__remove elementor-control-media__file__controls__remove" data-tooltip="<?php echo esc_attr__( 'Remove', 'elementor' ); ?>">
299 - <i class="eicon-trash-o" aria-hidden="true"></i>
300 - <span class="elementor-screen-only"><?php echo esc_html__( 'Remove', 'elementor' ); ?></span>
301 - </div>
302 - <div class="elementor-control-media__file__controls__upload-button elementor-control-media-upload-button" data-tooltip="<?php echo esc_attr__( 'Upload', 'elementor' ); ?>">
303 - <i class="eicon-upload" aria-hidden="true"></i>
304 - <span class="elementor-screen-only"><?php echo esc_html__( 'Upload', 'elementor' ); ?></span>
305 - </div>
178 + </div>
179 + <div class="elementor-control-media__file__controls">
180 + <div class="elementor-control-media__remove elementor-control-media__file__controls__remove" title="<?php echo __( 'Remove', 'elementor' ); ?>">
181 + <i class="eicon-trash-o"></i>
306 182 </div>
183 + <div class="elementor-control-media__file__controls__upload-button elementor-control-media-upload-button" title="<?php echo __( 'Upload', 'elementor' ); ?>">
184 + <i class="eicon-upload"></i>
185 + </div>
307 186 </div>
187 + </div>
308 188 <# } #>
309 189 <# if ( data.description ) { #>
310 - <div class="elementor-control-field-description">{{{ data.description }}}</div>
190 + <div class="elementor-control-field-description">{{{ data.description }}}</div>
311 191 <# } #>
312 -
313 - <# if ( data.has_sizes ) { #>
314 - <div class="elementor-control-type-select e-control-image-size">
315 - <div class="elementor-control-field">
316 - <label class="elementor-control-title" data-e-responsive-switcher-sibling="false" for="<?php $this->print_control_uid( 'size' ); ?>"><?php echo esc_html__( 'Image Resolution', 'elementor' ); ?></label>
317 - <div class="elementor-control-input-wrapper elementor-control-unit-5">
318 - <select class="e-image-size-select" id="<?php $this->print_control_uid( 'size' ); ?>" data-setting="size">
319 - <?php foreach ( $this->get_image_sizes() as $size_key => $size_title ) : ?>
320 - <option value="<?php echo esc_attr( $size_key ); ?>"><?php echo esc_html( $size_title ); ?></option>
321 - <?php endforeach; ?>
322 - </select>
323 - </div>
324 - </div>
325 -
326 - <div class="elementor-control-field-description"><?php echo esc_html__( 'Image size settings don’t apply to Dynamic Images.', 'elementor' ); ?></div>
327 - </div>
328 - <# } #>
329 -
330 192 <input type="hidden" data-setting="{{ data.name }}"/>
331 193 </div>
332 194 <?php
333 195 }
334 196
335 - private function maybe_display_io_hints() {
336 - $plugin_slug = 'image-optimization';
337 -
338 - if ( ! Hints::should_display_hint( $plugin_slug ) ) {
339 - return;
340 - }
341 -
342 - $one_subscription = Hints::is_plugin_connected_to_one_subscription();
343 - $is_installed = Hints::is_plugin_installed( $plugin_slug );
344 - $is_active = Hints::is_plugin_active( $plugin_slug );
345 -
346 - if ( $is_active ) {
347 - return;
348 - }
349 -
350 - if ( $one_subscription ) {
351 - if ( ! $is_installed ) {
352 - $content = esc_html__( 'Optimize your images to improve site speed and performance. Image Optimizer is included in your ONE subscription.', 'elementor' );
353 - $button_text = esc_html__( 'Install now', 'elementor' );
354 - $button_url = Hints::get_plugin_install_url( $plugin_slug );
355 - $source = 'io-editor-image-one-install';
356 - } elseif ( ! $is_active ) {
357 - $content = esc_html__( 'Your ONE subscription includes Image Optimizer. Activate it to optimize images and improve site performance.', 'elementor' );
358 - $button_text = esc_html__( 'Activate now', 'elementor' );
359 - $button_url = Hints::get_plugin_activate_url( $plugin_slug );
360 - $source = 'io-editor-image-one-activate';
361 - }
362 - } else {
363 - $content = esc_html__( 'Optimize your images to enhance site performance by using Image Optimizer.', 'elementor' );
364 - if ( ! $is_installed ) {
365 - $button_text = esc_html__( 'Install now', 'elementor' );
366 - $button_url = Hints::get_plugin_install_url( $plugin_slug );
367 - $source = 'io-editor-image-install';
368 - } elseif ( ! $is_active ) {
369 - $button_text = esc_html__( 'Activate now', 'elementor' );
370 - $button_url = Hints::get_plugin_activate_url( $plugin_slug );
371 - $source = 'io-editor-image-activate';
372 - }
373 - }
374 - ?>
375 - <div class="elementor-control-media__promotions" role="alert">
376 - <?php
377 - Hints::get_notice_template( [
378 - 'display' => ! Hints::is_dismissed( $plugin_slug ),
379 - 'type' => 'info',
380 - 'icon' => true,
381 - 'heading' => '',
382 - 'content' => $content,
383 - 'dismissible' => 'image_optimizer_hint',
384 - 'button_text' => $button_text,
385 - 'button_event' => 'image_optimizer_hint',
386 - 'button_data' => [
387 - 'action_url' => $button_url,
388 - 'source' => $source,
389 - ],
390 - ] );
391 - ?>
392 - </div>
393 - <?php
394 - }
395 -
396 - private function get_image_sizes(): array {
397 - $wp_image_sizes = Group_Control_Image_Size::get_all_image_sizes();
398 -
399 - $image_sizes = [];
400 -
401 - foreach ( $wp_image_sizes as $size_key => $size_attributes ) {
402 - $control_title = ucwords( str_replace( '_', ' ', $size_key ) );
403 - if ( is_array( $size_attributes ) ) {
404 - $control_title .= sprintf( ' - %d x %d', $size_attributes['width'], $size_attributes['height'] );
405 - }
406 -
407 - $image_sizes[ $size_key ] = $control_title;
408 - }
409 -
410 - $image_sizes[''] = esc_html_x( 'Full', 'Image Size Control', 'elementor' );
411 -
412 - return $image_sizes;
413 - }
414 -
415 197 /**
416 198 * Get media control default settings.
417 199 *
418 200 * Retrieve the default settings of the media control. Used to return the default
@@ -425,17 +207,10 @@
425 207 */
426 208 protected function get_default_settings() {
427 209 return [
428 210 'label_block' => true,
429 - 'has_sizes' => false,
430 - 'ai' => [
431 - 'active' => true,
432 - 'type' => 'media',
433 - 'category' => 'photographic',
434 - ],
435 - 'media_types' => [
436 - 'image',
437 - ],
211 + 'media_type' => 'image',
212 + 'should_include_svg_inline_option' => false,
438 213 'dynamic' => [
439 214 'categories' => [ TagsModule::IMAGE_CATEGORY ],
440 215 'returnType' => 'object',
441 216 ],
@@ -477,10 +252,9 @@
477 252 * @return string Image alt.
478 253 */
479 254 public static function get_image_alt( $instance ) {
480 255 if ( empty( $instance['id'] ) ) {
481 - // For `Insert From URL` images.
482 - return isset( $instance['alt'] ) ? trim( self::sanitise_text( $instance['alt'] ) ) : '';
256 + return '';
483 257 }
484 258
485 259 $attachment_id = $instance['id'];
486 260 if ( ! $attachment_id ) {
@@ -493,32 +267,12 @@
493 267 }
494 268
495 269 $alt = get_post_meta( $attachment_id, '_wp_attachment_image_alt', true );
496 270 if ( ! $alt ) {
497 - if ( Utils::has_invalid_post_permissions( $attachment ) ) {
498 - return '';
499 - }
500 -
501 271 $alt = $attachment->post_excerpt;
502 272 if ( ! $alt ) {
503 273 $alt = $attachment->post_title;
504 274 }
505 275 }
506 - return trim( self::sanitise_text( $alt ) );
507 - }
508 -
509 - public function get_style_value( $css_property, $control_value, array $control_data ) {
510 - if ( 'URL' !== $css_property || empty( $control_value['id'] ) ) {
511 - return parent::get_style_value( $css_property, $control_value, $control_data );
512 - }
513 -
514 - if ( empty( $control_value['size'] ) ) {
515 - $control_value['size'] = 'full';
516 - }
517 -
518 - return wp_get_attachment_image_url( $control_value['id'], $control_value['size'] );
519 - }
520 -
521 - public static function sanitise_text( $text ) {
522 - return esc_attr( strip_tags( $text ) );
276 + return trim( strip_tags( $alt ) );
523 277 }
524 278 }