elementor / includes / controls / groups / background.php

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

845 lines 22.3 KB

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	'condition' => [
613	'background' => [ 'video' ],
614	],
615	'selectors' => [
616	'{{SELECTOR}}' => 'background: url("{{URL}}") 50% 50%; background-size: cover;',
617	],
618	'of_type' => 'video',
619	];
620
621	$fields['slideshow_gallery'] = [
622	'label' => _x( 'Images', 'Background Control', 'elementor' ),
623	'type' => Controls_Manager::GALLERY,
624	'condition' => [
625	'background' => [ 'slideshow' ],
626	],
627	'show_label' => false,
628	'of_type' => 'slideshow',
629	'frontend_available' => true,
630	];
631
632	$fields['slideshow_loop'] = [
633	'label' => __( 'Infinite Loop', 'elementor' ),
634	'type' => Controls_Manager::SWITCHER,
635	'default' => 'yes',
636	'condition' => [
637	'background' => [ 'slideshow' ],
638	],
639	'of_type' => 'slideshow',
640	'frontend_available' => true,
641	];
642
643	$fields['slideshow_slide_duration'] = [
644	'label' => __( 'Duration', 'elementor' ) . ' (ms)',
645	'type' => Controls_Manager::NUMBER,
646	'default' => 5000,
647	'condition' => [
648	'background' => [ 'slideshow' ],
649	],
650	'frontend_available' => true,
651	];
652
653	$fields['slideshow_slide_transition'] = [
654	'label' => __( 'Transition', 'elementor' ),
655	'type' => Controls_Manager::SELECT,
656	'default' => 'fade',
657	'options' => [
658	'fade' => 'Fade',
659	'slide_right' => 'Slide Right',
660	'slide_left' => 'Slide Left',
661	'slide_up' => 'Slide Up',
662	'slide_down' => 'Slide Down',
663	],
664	'condition' => [
665	'background' => [ 'slideshow' ],
666	],
667	'of_type' => 'slideshow',
668	'frontend_available' => true,
669	];
670
671	$fields['slideshow_transition_duration'] = [
672	'label' => __( 'Transition Duration', 'elementor' ) . ' (ms)',
673	'type' => Controls_Manager::NUMBER,
674	'default' => 500,
675	'condition' => [
676	'background' => [ 'slideshow' ],
677	],
678	'frontend_available' => true,
679	];
680
681	$fields['slideshow_background_size'] = [
682	'label' => __( 'Background Size', 'elementor' ),
683	'type' => Controls_Manager::SELECT,
684	'responsive' => true,
685	'default' => '',
686	'options' => [
687	'' => __( 'Default', 'elementor' ),
688	'auto' => __( 'Auto', 'elementor' ),
689	'cover' => __( 'Cover', 'elementor' ),
690	'contain' => __( 'Contain', 'elementor' ),
691	],
692	'selectors' => [
693	'{{WRAPPER}} .elementor-background-slideshow__slide__image' => 'background-size: {{VALUE}};',
694	],
695	'condition' => [
696	'background' => [ 'slideshow' ],
697	],
698	];
699
700	$fields['slideshow_background_position'] = [
701	'label' => __( 'Background Position', 'elementor' ),
702	'type' => Controls_Manager::SELECT,
703	'default' => '',
704	'responsive' => true,
705	'options' => [
706	'' => __( 'Default', 'elementor' ),
707	'center center' => _x( 'Center Center', 'Background Control', 'elementor' ),
708	'center left' => _x( 'Center Left', 'Background Control', 'elementor' ),
709	'center right' => _x( 'Center Right', 'Background Control', 'elementor' ),
710	'top center' => _x( 'Top Center', 'Background Control', 'elementor' ),
711	'top left' => _x( 'Top Left', 'Background Control', 'elementor' ),
712	'top right' => _x( 'Top Right', 'Background Control', 'elementor' ),
713	'bottom center' => _x( 'Bottom Center', 'Background Control', 'elementor' ),
714	'bottom left' => _x( 'Bottom Left', 'Background Control', 'elementor' ),
715	'bottom right' => _x( 'Bottom Right', 'Background Control', 'elementor' ),
716	],
717	'selectors' => [
718	'{{WRAPPER}} .elementor-background-slideshow__slide__image' => 'background-position: {{VALUE}};',
719	],
720	'condition' => [
721	'background' => [ 'slideshow' ],
722	],
723	];
724
725	$fields['slideshow_ken_burns'] = [
726	'label' => __( 'Ken Burns Effect', 'elementor' ),
727	'type' => Controls_Manager::SWITCHER,
728	'separator' => 'before',
729	'condition' => [
730	'background' => [ 'slideshow' ],
731	],
732	'of_type' => 'slideshow',
733	'frontend_available' => true,
734	];
735
736	$fields['slideshow_ken_burns_zoom_direction'] = [
737	'label' => __( 'Direction', 'elementor' ),
738	'type' => Controls_Manager::SELECT,
739	'default' => 'in',
740	'options' => [
741	'in' => __( 'In', 'elementor' ),
742	'out' => __( 'Out', 'elementor' ),
743	],
744	'condition' => [
745	'background' => [ 'slideshow' ],
746	'slideshow_ken_burns!' => '',
747	],
748	'of_type' => 'slideshow',
749	'frontend_available' => true,
750	];
751
752	return $fields;
753	}
754
755	/**
756	* Get child default args.
757	*
758	* Retrieve the default arguments for all the child controls for a specific group
759	* control.
760	*
761	* @since 1.2.2
762	* @access protected
763	*
764	* @return array Default arguments for all the child controls.
765	*/
766	protected function get_child_default_args() {
767	return [
768	'types' => [ 'classic', 'gradient' ],
769	'selector' => '{{WRAPPER}}:not(.elementor-motion-effects-element-type-background), {{WRAPPER}} > .elementor-motion-effects-container > .elementor-motion-effects-layer',
770	];
771	}
772
773	/**
774	* Filter fields.
775	*
776	* Filter which controls to display, using `include`, `exclude`, `condition`
777	* and `of_type` arguments.
778	*
779	* @since 1.2.2
780	* @access protected
781	*
782	* @return array Control fields.
783	*/
784	protected function filter_fields() {
785	$fields = parent::filter_fields();
786
787	$args = $this->get_args();
788
789	foreach ( $fields as &$field ) {
790	if ( isset( $field['of_type'] ) && ! in_array( $field['of_type'], $args['types'] ) ) {
791	unset( $field );
792	}
793	}
794
795	return $fields;
796	}
797
798	/**
799	* Prepare fields.
800	*
801	* Process background control fields before adding them to `add_control()`.
802	*
803	* @since 1.2.2
804	* @access protected
805	*
806	* @param array $fields Background control fields.
807	*
808	* @return array Processed fields.
809	*/
810	protected function prepare_fields( $fields ) {
811	$args = $this->get_args();
812
813	$background_types = self::get_background_types();
814
815	$choose_types = [];
816
817	foreach ( $args['types'] as $type ) {
818	if ( isset( $background_types[ $type ] ) ) {
819	$choose_types[ $type ] = $background_types[ $type ];
820	}
821	}
822
823	$fields['background']['options'] = $choose_types;
824
825	return parent::prepare_fields( $fields );
826	}
827
828	/**
829	* Get default options.
830	*
831	* Retrieve the default options of the background control. Used to return the
832	* default options while initializing the background control.
833	*
834	* @since 1.9.0
835	* @access protected
836	*
837	* @return array Default background control options.
838	*/
839	protected function get_default_options() {
840	return [
841	'popover' => false,
842	];
843	}
844	}
845