PluginProbe
Elementor Website Builder – more than just a page builder / 3.1.0-dev2
Elementor Website Builder – more than just a page builder v3.1.0-dev2
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
elementor / includes / controls / groups / background.php

background.php in Elementor Website Builder – more than just a page builder 3.1.0-dev2, at includes/controls/groups/background.php

848 lines 22.3 KB
No matching file
Up and down to move Enter to open Esc to close
Raw Download Zip
1 <?php
2 namespace Elementor;
3
4 if ( ! defined( 'ABSPATH' ) ) {
5 exit; // Exit if accessed directly.
6 }
7
8 /**
9 * Elementor background control.
10 *
11 * A base control for creating background control. Displays input fields to define
12 * the background color, background image, background gradient or background video.
13 *
14 * @since 1.2.2
15 */
16 class Group_Control_Background extends Group_Control_Base {
17
18 /**
19 * Fields.
20 *
21 * Holds all the background control fields.
22 *
23 * @since 1.2.2
24 * @access protected
25 * @static
26 *
27 * @var array Background control fields.
28 */
29 protected static $fields;
30
31 /**
32 * Background Types.
33 *
34 * Holds all the available background types.
35 *
36 * @since 1.2.2
37 * @access private
38 * @static
39 *
40 * @var array
41 */
42 private static $background_types;
43
44 /**
45 * Get background control type.
46 *
47 * Retrieve the control type, in this case `background`.
48 *
49 * @since 1.0.0
50 * @access public
51 * @static
52 *
53 * @return string Control type.
54 */
55 public static function get_type() {
56 return 'background';
57 }
58
59 /**
60 * Get background control types.
61 *
62 * Retrieve available background types.
63 *
64 * @since 1.2.2
65 * @access public
66 * @static
67 *
68 * @return array Available background types.
69 */
70 public static function get_background_types() {
71 if ( null === self::$background_types ) {
72 self::$background_types = self::get_default_background_types();
73 }
74
75 return self::$background_types;
76 }
77
78 /**
79 * Get Default background types.
80 *
81 * Retrieve background control initial types.
82 *
83 * @since 2.0.0
84 * @access private
85 * @static
86 *
87 * @return array Default background types.
88 */
89 private static function get_default_background_types() {
90 return [
91 'classic' => [
92 'title' => _x( 'Classic', 'Background Control', 'elementor' ),
93 'icon' => 'eicon-paint-brush',
94 ],
95 'gradient' => [
96 'title' => _x( 'Gradient', 'Background Control', 'elementor' ),
97 'icon' => 'eicon-barcode',
98 ],
99 'video' => [
100 'title' => _x( 'Video', 'Background Control', 'elementor' ),
101 'icon' => 'eicon-video-camera',
102 ],
103 'slideshow' => [
104 'title' => _x( 'Slideshow', 'Background Control', 'elementor' ),
105 'icon' => 'eicon-slideshow',
106 ],
107 ];
108 }
109
110 /**
111 * Init fields.
112 *
113 * Initialize background control fields.
114 *
115 * @since 1.2.2
116 * @access public
117 *
118 * @return array Control fields.
119 */
120 public function init_fields() {
121 $fields = [];
122
123 $fields['background'] = [
124 'label' => _x( 'Background Type', 'Background Control', 'elementor' ),
125 'type' => Controls_Manager::CHOOSE,
126 'render_type' => 'ui',
127 ];
128
129 $fields['color'] = [
130 'label' => _x( 'Color', 'Background Control', 'elementor' ),
131 'type' => Controls_Manager::COLOR,
132 'default' => '',
133 'title' => _x( 'Background Color', 'Background Control', 'elementor' ),
134 'selectors' => [
135 '{{SELECTOR}}' => 'background-color: {{VALUE}};',
136 ],
137 'condition' => [
138 'background' => [ 'classic', 'gradient' ],
139 ],
140 ];
141
142 $fields['color_stop'] = [
143 'label' => _x( 'Location', 'Background Control', 'elementor' ),
144 'type' => Controls_Manager::SLIDER,
145 'size_units' => [ '%' ],
146 'default' => [
147 'unit' => '%',
148 'size' => 0,
149 ],
150 'render_type' => 'ui',
151 'condition' => [
152 'background' => [ 'gradient' ],
153 ],
154 'of_type' => 'gradient',
155 ];
156
157 $fields['color_b'] = [
158 'label' => _x( 'Second Color', 'Background Control', 'elementor' ),
159 'type' => Controls_Manager::COLOR,
160 'default' => '#f2295b',
161 'render_type' => 'ui',
162 'condition' => [
163 'background' => [ 'gradient' ],
164 ],
165 'of_type' => 'gradient',
166 ];
167
168 $fields['color_b_stop'] = [
169 'label' => _x( 'Location', 'Background Control', 'elementor' ),
170 'type' => Controls_Manager::SLIDER,
171 'size_units' => [ '%' ],
172 'default' => [
173 'unit' => '%',
174 'size' => 100,
175 ],
176 'render_type' => 'ui',
177 'condition' => [
178 'background' => [ 'gradient' ],
179 ],
180 'of_type' => 'gradient',
181 ];
182
183 $fields['gradient_type'] = [
184 'label' => _x( 'Type', 'Background Control', 'elementor' ),
185 'type' => Controls_Manager::SELECT,
186 'options' => [
187 'linear' => _x( 'Linear', 'Background Control', 'elementor' ),
188 'radial' => _x( 'Radial', 'Background Control', 'elementor' ),
189 ],
190 'default' => 'linear',
191 'render_type' => 'ui',
192 'condition' => [
193 'background' => [ 'gradient' ],
194 ],
195 'of_type' => 'gradient',
196 ];
197
198 $fields['gradient_angle'] = [
199 'label' => _x( 'Angle', 'Background Control', 'elementor' ),
200 'type' => Controls_Manager::SLIDER,
201 'size_units' => [ 'deg' ],
202 'default' => [
203 'unit' => 'deg',
204 'size' => 180,
205 ],
206 'range' => [
207 'deg' => [
208 'step' => 10,
209 ],
210 ],
211 'selectors' => [
212 '{{SELECTOR}}' => 'background-color: transparent; background-image: linear-gradient({{SIZE}}{{UNIT}}, {{color.VALUE}} {{color_stop.SIZE}}{{color_stop.UNIT}}, {{color_b.VALUE}} {{color_b_stop.SIZE}}{{color_b_stop.UNIT}})',
213 ],
214 'condition' => [
215 'background' => [ 'gradient' ],
216 'gradient_type' => 'linear',
217 ],
218 'of_type' => 'gradient',
219 ];
220
221 $fields['gradient_position'] = [
222 'label' => _x( 'Position', 'Background Control', 'elementor' ),
223 'type' => Controls_Manager::SELECT,
224 'options' => [
225 'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
226 'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
227 'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
228 'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
229 'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
230 'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
231 'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
232 'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
233 'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
234 ],
235 'default' => 'center center',
236 'selectors' => [
237 '{{SELECTOR}}' => 'background-color: transparent; background-image: radial-gradient(at {{VALUE}}, {{color.VALUE}} {{color_stop.SIZE}}{{color_stop.UNIT}}, {{color_b.VALUE}} {{color_b_stop.SIZE}}{{color_b_stop.UNIT}})',
238 ],
239 'condition' => [
240 'background' => [ 'gradient' ],
241 'gradient_type' => 'radial',
242 ],
243 'of_type' => 'gradient',
244 ];
245
246 $fields['image'] = [
247 'label' => _x( 'Image', 'Background Control', 'elementor' ),
248 'type' => Controls_Manager::MEDIA,
249 'dynamic' => [
250 'active' => true,
251 ],
252 'responsive' => true,
253 'title' => _x( 'Background Image', 'Background Control', 'elementor' ),
254 'selectors' => [
255 '{{SELECTOR}}' => 'background-image: url("{{URL}}");',
256 ],
257 'render_type' => 'template',
258 'condition' => [
259 'background' => [ 'classic' ],
260 ],
261 ];
262
263 $fields['position'] = [
264 'label' => _x( 'Position', 'Background Control', 'elementor' ),
265 'type' => Controls_Manager::SELECT,
266 'default' => '',
267 'responsive' => true,
268 'options' => [
269 '' => _x( 'Default', 'Background Control', 'elementor' ),
270 'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
271 'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
272 'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
273 'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
274 'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
275 'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
276 'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
277 'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
278 'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
279 'initial' => _x( 'Custom', 'Background Control', 'elementor' ),
280
281 ],
282 'selectors' => [
283 '{{SELECTOR}}' => 'background-position: {{VALUE}};',
284 ],
285 'condition' => [
286 'background' => [ 'classic' ],
287 'image[url]!' => '',
288 ],
289 ];
290
291 $fields['xpos'] = [
292 'label' => _x( 'X Position', 'Background Control', 'elementor' ),
293 'type' => Controls_Manager::SLIDER,
294 'responsive' => true,
295 'size_units' => [ 'px', 'em', '%', 'vw' ],
296 'default' => [
297 'unit' => 'px',
298 'size' => 0,
299 ],
300 'tablet_default' => [
301 'unit' => 'px',
302 'size' => 0,
303 ],
304 'mobile_default' => [
305 'unit' => 'px',
306 'size' => 0,
307 ],
308 'range' => [
309 'px' => [
310 'min' => -800,
311 'max' => 800,
312 ],
313 'em' => [
314 'min' => -100,
315 'max' => 100,
316 ],
317 '%' => [
318 'min' => -100,
319 'max' => 100,
320 ],
321 'vw' => [
322 'min' => -100,
323 'max' => 100,
324 ],
325 ],
326 'selectors' => [
327 '{{SELECTOR}}' => 'background-position: {{SIZE}}{{UNIT}} {{ypos.SIZE}}{{ypos.UNIT}}',
328 ],
329 'condition' => [
330 'background' => [ 'classic' ],
331 'position' => [ 'initial' ],
332 'image[url]!' => '',
333 ],
334 'required' => true,
335 'device_args' => [
336 Controls_Stack::RESPONSIVE_TABLET => [
337 'selectors' => [
338 '{{SELECTOR}}' => 'background-position: {{SIZE}}{{UNIT}} {{ypos_tablet.SIZE}}{{ypos_tablet.UNIT}}',
339 ],
340 'condition' => [
341 'background' => [ 'classic' ],
342 'position_tablet' => [ 'initial' ],
343 ],
344 ],
345 Controls_Stack::RESPONSIVE_MOBILE => [
346 'selectors' => [
347 '{{SELECTOR}}' => 'background-position: {{SIZE}}{{UNIT}} {{ypos_mobile.SIZE}}{{ypos_mobile.UNIT}}',
348 ],
349 'condition' => [
350 'background' => [ 'classic' ],
351 'position_mobile' => [ 'initial' ],
352 ],
353 ],
354 ],
355 ];
356
357 $fields['ypos'] = [
358 'label' => _x( 'Y Position', 'Background Control', 'elementor' ),
359 'type' => Controls_Manager::SLIDER,
360 'responsive' => true,
361 'size_units' => [ 'px', 'em', '%', 'vh' ],
362 'default' => [
363 'unit' => 'px',
364 'size' => 0,
365 ],
366 'tablet_default' => [
367 'unit' => 'px',
368 'size' => 0,
369 ],
370 'mobile_default' => [
371 'unit' => 'px',
372 'size' => 0,
373 ],
374 'range' => [
375 'px' => [
376 'min' => -800,
377 'max' => 800,
378 ],
379 'em' => [
380 'min' => -100,
381 'max' => 100,
382 ],
383 '%' => [
384 'min' => -100,
385 'max' => 100,
386 ],
387 'vh' => [
388 'min' => -100,
389 'max' => 100,
390 ],
391 ],
392 'selectors' => [
393 '{{SELECTOR}}' => 'background-position: {{xpos.SIZE}}{{xpos.UNIT}} {{SIZE}}{{UNIT}}',
394 ],
395 'condition' => [
396 'background' => [ 'classic' ],
397 'position' => [ 'initial' ],
398 'image[url]!' => '',
399 ],
400 'required' => true,
401 'device_args' => [
402 Controls_Stack::RESPONSIVE_TABLET => [
403 'selectors' => [
404 '{{SELECTOR}}' => 'background-position: {{xpos_tablet.SIZE}}{{xpos_tablet.UNIT}} {{SIZE}}{{UNIT}}',
405 ],
406 'condition' => [
407 'background' => [ 'classic' ],
408 'position_tablet' => [ 'initial' ],
409 ],
410 ],
411 Controls_Stack::RESPONSIVE_MOBILE => [
412 'selectors' => [
413 '{{SELECTOR}}' => 'background-position: {{xpos_mobile.SIZE}}{{xpos_mobile.UNIT}} {{SIZE}}{{UNIT}}',
414 ],
415 'condition' => [
416 'background' => [ 'classic' ],
417 'position_mobile' => [ 'initial' ],
418 ],
419 ],
420 ],
421 ];
422
423 $fields['attachment'] = [
424 'label' => _x( 'Attachment', 'Background Control', 'elementor' ),
425 'type' => Controls_Manager::SELECT,
426 'default' => '',
427 'options' => [
428 '' => _x( 'Default', 'Background Control', 'elementor' ),
429 'scroll' => _x( 'Scroll', 'Background Control', 'elementor' ),
430 'fixed' => _x( 'Fixed', 'Background Control', 'elementor' ),
431 ],
432 'selectors' => [
433 '(desktop+){{SELECTOR}}' => 'background-attachment: {{VALUE}};',
434 ],
435 'condition' => [
436 'background' => [ 'classic' ],
437 'image[url]!' => '',
438 ],
439 ];
440
441 $fields['attachment_alert'] = [
442 'type' => Controls_Manager::RAW_HTML,
443 'content_classes' => 'elementor-control-field-description',
444 'raw' => __( 'Note: Attachment Fixed works only on desktop.', 'elementor' ),
445 'separator' => 'none',
446 'condition' => [
447 'background' => [ 'classic' ],
448 'image[url]!' => '',
449 'attachment' => 'fixed',
450 ],
451 ];
452
453 $fields['repeat'] = [
454 'label' => _x( 'Repeat', 'Background Control', 'elementor' ),
455 'type' => Controls_Manager::SELECT,
456 'default' => '',
457 'responsive' => true,
458 'options' => [
459 '' => _x( 'Default', 'Background Control', 'elementor' ),
460 'no-repeat' => _x( 'No-repeat', 'Background Control', 'elementor' ),
461 'repeat' => _x( 'Repeat', 'Background Control', 'elementor' ),
462 'repeat-x' => _x( 'Repeat-x', 'Background Control', 'elementor' ),
463 'repeat-y' => _x( 'Repeat-y', 'Background Control', 'elementor' ),
464 ],
465 'selectors' => [
466 '{{SELECTOR}}' => 'background-repeat: {{VALUE}};',
467 ],
468 'condition' => [
469 'background' => [ 'classic' ],
470 'image[url]!' => '',
471 ],
472 ];
473
474 $fields['size'] = [
475 'label' => _x( 'Size', 'Background Control', 'elementor' ),
476 'type' => Controls_Manager::SELECT,
477 'responsive' => true,
478 'default' => '',
479 'options' => [
480 '' => _x( 'Default', 'Background Control', 'elementor' ),
481 'auto' => _x( 'Auto', 'Background Control', 'elementor' ),
482 'cover' => _x( 'Cover', 'Background Control', 'elementor' ),
483 'contain' => _x( 'Contain', 'Background Control', 'elementor' ),
484 'initial' => _x( 'Custom', 'Background Control', 'elementor' ),
485 ],
486 'selectors' => [
487 '{{SELECTOR}}' => 'background-size: {{VALUE}};',
488 ],
489 'condition' => [
490 'background' => [ 'classic' ],
491 'image[url]!' => '',
492 ],
493 ];
494
495 $fields['bg_width'] = [
496 'label' => _x( 'Width', 'Background Control', 'elementor' ),
497 'type' => Controls_Manager::SLIDER,
498 'responsive' => true,
499 'size_units' => [ 'px', 'em', '%', 'vw' ],
500 'range' => [
501 'px' => [
502 'min' => 0,
503 'max' => 1000,
504 ],
505 '%' => [
506 'min' => 0,
507 'max' => 100,
508 ],
509 'vw' => [
510 'min' => 0,
511 'max' => 100,
512 ],
513 ],
514 'default' => [
515 'size' => 100,
516 'unit' => '%',
517 ],
518 'required' => true,
519 'selectors' => [
520 '{{SELECTOR}}' => 'background-size: {{SIZE}}{{UNIT}} auto',
521
522 ],
523 'condition' => [
524 'background' => [ 'classic' ],
525 'size' => [ 'initial' ],
526 'image[url]!' => '',
527 ],
528 'device_args' => [
529 Controls_Stack::RESPONSIVE_TABLET => [
530 'selectors' => [
531 '{{SELECTOR}}' => 'background-size: {{SIZE}}{{UNIT}} auto',
532 ],
533 'condition' => [
534 'background' => [ 'classic' ],
535 'size_tablet' => [ 'initial' ],
536 ],
537 ],
538 Controls_Stack::RESPONSIVE_MOBILE => [
539 'selectors' => [
540 '{{SELECTOR}}' => 'background-size: {{SIZE}}{{UNIT}} auto',
541 ],
542 'condition' => [
543 'background' => [ 'classic' ],
544 'size_mobile' => [ 'initial' ],
545 ],
546 ],
547 ],
548 ];
549
550 $fields['video_link'] = [
551 'label' => _x( 'Video Link', 'Background Control', 'elementor' ),
552 'type' => Controls_Manager::TEXT,
553 'placeholder' => 'https://www.youtube.com/watch?v=XHOmBV4js_E',
554 'description' => __( 'YouTube/Vimeo link, or link to video file (mp4 is recommended).', 'elementor' ),
555 'label_block' => true,
556 'default' => '',
557 'condition' => [
558 'background' => [ 'video' ],
559 ],
560 'of_type' => 'video',
561 'frontend_available' => true,
562 ];
563
564 $fields['video_start'] = [
565 'label' => __( 'Start Time', 'elementor' ),
566 'type' => Controls_Manager::NUMBER,
567 'description' => __( 'Specify a start time (in seconds)', 'elementor' ),
568 'placeholder' => 10,
569 'condition' => [
570 'background' => [ 'video' ],
571 ],
572 'of_type' => 'video',
573 'frontend_available' => true,
574 ];
575
576 $fields['video_end'] = [
577 'label' => __( 'End Time', 'elementor' ),
578 'type' => Controls_Manager::NUMBER,
579 'description' => __( 'Specify an end time (in seconds)', 'elementor' ),
580 'placeholder' => 70,
581 'condition' => [
582 'background' => [ 'video' ],
583 ],
584 'of_type' => 'video',
585 'frontend_available' => true,
586 ];
587
588 $fields['play_once'] = [
589 'label' => __( 'Play Once', 'elementor' ),
590 'type' => Controls_Manager::SWITCHER,
591 'condition' => [
592 'background' => [ 'video' ],
593 ],
594 'of_type' => 'video',
595 'frontend_available' => true,
596 ];
597
598 $fields['play_on_mobile'] = [
599 'label' => __( 'Play On Mobile', 'elementor' ),
600 'type' => Controls_Manager::SWITCHER,
601 'condition' => [
602 'background' => [ 'video' ],
603 ],
604 'of_type' => 'video',
605 'frontend_available' => true,
606 ];
607
608 $fields['video_fallback'] = [
609 'label' => _x( 'Background Fallback', 'Background Control', 'elementor' ),
610 'description' => __( 'This cover image will replace the background video in case that the video could not be loaded.', 'elementor' ),
611 'type' => Controls_Manager::MEDIA,
612 'dynamic' => [
613 'active' => true,
614 ],
615 'condition' => [
616 'background' => [ 'video' ],
617 ],
618 'selectors' => [
619 '{{SELECTOR}}' => 'background: url("{{URL}}") 50% 50%; background-size: cover;',
620 ],
621 'of_type' => 'video',
622 ];
623
624 $fields['slideshow_gallery'] = [
625 'label' => _x( 'Images', 'Background Control', 'elementor' ),
626 'type' => Controls_Manager::GALLERY,
627 'condition' => [
628 'background' => [ 'slideshow' ],
629 ],
630 'show_label' => false,
631 'of_type' => 'slideshow',
632 'frontend_available' => true,
633 ];
634
635 $fields['slideshow_loop'] = [
636 'label' => __( 'Infinite Loop', 'elementor' ),
637 'type' => Controls_Manager::SWITCHER,
638 'default' => 'yes',
639 'condition' => [
640 'background' => [ 'slideshow' ],
641 ],
642 'of_type' => 'slideshow',
643 'frontend_available' => true,
644 ];
645
646 $fields['slideshow_slide_duration'] = [
647 'label' => __( 'Duration', 'elementor' ) . ' (ms)',
648 'type' => Controls_Manager::NUMBER,
649 'default' => 5000,
650 'condition' => [
651 'background' => [ 'slideshow' ],
652 ],
653 'frontend_available' => true,
654 ];
655
656 $fields['slideshow_slide_transition'] = [
657 'label' => __( 'Transition', 'elementor' ),
658 'type' => Controls_Manager::SELECT,
659 'default' => 'fade',
660 'options' => [
661 'fade' => 'Fade',
662 'slide_right' => 'Slide Right',
663 'slide_left' => 'Slide Left',
664 'slide_up' => 'Slide Up',
665 'slide_down' => 'Slide Down',
666 ],
667 'condition' => [
668 'background' => [ 'slideshow' ],
669 ],
670 'of_type' => 'slideshow',
671 'frontend_available' => true,
672 ];
673
674 $fields['slideshow_transition_duration'] = [
675 'label' => __( 'Transition Duration', 'elementor' ) . ' (ms)',
676 'type' => Controls_Manager::NUMBER,
677 'default' => 500,
678 'condition' => [
679 'background' => [ 'slideshow' ],
680 ],
681 'frontend_available' => true,
682 ];
683
684 $fields['slideshow_background_size'] = [
685 'label' => __( 'Background Size', 'elementor' ),
686 'type' => Controls_Manager::SELECT,
687 'responsive' => true,
688 'default' => '',
689 'options' => [
690 '' => __( 'Default', 'elementor' ),
691 'auto' => __( 'Auto', 'elementor' ),
692 'cover' => __( 'Cover', 'elementor' ),
693 'contain' => __( 'Contain', 'elementor' ),
694 ],
695 'selectors' => [
696 '{{WRAPPER}} .elementor-background-slideshow__slide__image' => 'background-size: {{VALUE}};',
697 ],
698 'condition' => [
699 'background' => [ 'slideshow' ],
700 ],
701 ];
702
703 $fields['slideshow_background_position'] = [
704 'label' => __( 'Background Position', 'elementor' ),
705 'type' => Controls_Manager::SELECT,
706 'default' => '',
707 'responsive' => true,
708 'options' => [
709 '' => __( 'Default', 'elementor' ),
710 'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
711 'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
712 'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
713 'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
714 'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
715 'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
716 'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
717 'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
718 'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
719 ],
720 'selectors' => [
721 '{{WRAPPER}} .elementor-background-slideshow__slide__image' => 'background-position: {{VALUE}};',
722 ],
723 'condition' => [
724 'background' => [ 'slideshow' ],
725 ],
726 ];
727
728 $fields['slideshow_ken_burns'] = [
729 'label' => __( 'Ken Burns Effect', 'elementor' ),
730 'type' => Controls_Manager::SWITCHER,
731 'separator' => 'before',
732 'condition' => [
733 'background' => [ 'slideshow' ],
734 ],
735 'of_type' => 'slideshow',
736 'frontend_available' => true,
737 ];
738
739 $fields['slideshow_ken_burns_zoom_direction'] = [
740 'label' => __( 'Direction', 'elementor' ),
741 'type' => Controls_Manager::SELECT,
742 'default' => 'in',
743 'options' => [
744 'in' => __( 'In', 'elementor' ),
745 'out' => __( 'Out', 'elementor' ),
746 ],
747 'condition' => [
748 'background' => [ 'slideshow' ],
749 'slideshow_ken_burns!' => '',
750 ],
751 'of_type' => 'slideshow',
752 'frontend_available' => true,
753 ];
754
755 return $fields;
756 }
757
758 /**
759 * Get child default args.
760 *
761 * Retrieve the default arguments for all the child controls for a specific group
762 * control.
763 *
764 * @since 1.2.2
765 * @access protected
766 *
767 * @return array Default arguments for all the child controls.
768 */
769 protected function get_child_default_args() {
770 return [
771 'types' => [ 'classic', 'gradient' ],
772 'selector' => '{{WRAPPER}}:not(.elementor-motion-effects-element-type-background), {{WRAPPER}} > .elementor-motion-effects-container > .elementor-motion-effects-layer',
773 ];
774 }
775
776 /**
777 * Filter fields.
778 *
779 * Filter which controls to display, using `include`, `exclude`, `condition`
780 * and `of_type` arguments.
781 *
782 * @since 1.2.2
783 * @access protected
784 *
785 * @return array Control fields.
786 */
787 protected function filter_fields() {
788 $fields = parent::filter_fields();
789
790 $args = $this->get_args();
791
792 foreach ( $fields as &$field ) {
793 if ( isset( $field['of_type'] ) && ! in_array( $field['of_type'], $args['types'] ) ) {
794 unset( $field );
795 }
796 }
797
798 return $fields;
799 }
800
801 /**
802 * Prepare fields.
803 *
804 * Process background control fields before adding them to `add_control()`.
805 *
806 * @since 1.2.2
807 * @access protected
808 *
809 * @param array $fields Background control fields.
810 *
811 * @return array Processed fields.
812 */
813 protected function prepare_fields( $fields ) {
814 $args = $this->get_args();
815
816 $background_types = self::get_background_types();
817
818 $choose_types = [];
819
820 foreach ( $args['types'] as $type ) {
821 if ( isset( $background_types[ $type ] ) ) {
822 $choose_types[ $type ] = $background_types[ $type ];
823 }
824 }
825
826 $fields['background']['options'] = $choose_types;
827
828 return parent::prepare_fields( $fields );
829 }
830
831 /**
832 * Get default options.
833 *
834 * Retrieve the default options of the background control. Used to return the
835 * default options while initializing the background control.
836 *
837 * @since 1.9.0
838 * @access protected
839 *
840 * @return array Default background control options.
841 */
842 protected function get_default_options() {
843 return [
844 'popover' => false,
845 ];
846 }
847 }
848