elementor / includes / controls / groups / background.php

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

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