elementor / includes / controls / groups / background.php

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

849 lines 22.3 KB

Raw Download Zip

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