← All changes | includes/widgets/gallery-carousel.php +151 -84 1.0.14 → 1.3.18 View file →

		@@ -1,5 +1,6 @@
1	1	<?php
	2	+
2	3	namespace UiCoreElements;
3	4
4	5	use Elementor\Controls_Manager;
5	6	use Elementor\Group_Control_Background;
		@@ -49,12 +50,13 @@
49	50	public function get_styles()
50	51	{
51	52	$styles = [
52	53	'gallery-carousel',
	54	+ 'carousel',
53	55	'animation', // hover animations
54	56	'entrance', // entrance basic style
55	57	];
56		- if(!class_exists('\UiCore\Core') && !class_exists('\UiCoreAnimate\Base')){
	58	+ if (!class_exists('\UiCore\Core') && !class_exists('\UiCoreAnimate\Base')) {
57	59	$styles['e-animations'] = [ // entrance animations
58	60	'external' => true,
59	61	];
60	62	}
		@@ -63,8 +65,13 @@
63	65	public function get_scripts()
64	66	{
65	67	return $this->TRAIT_get_carousel_scripts();
66	68	}
	69	+ public function has_widget_inner_wrapper(): bool
	70	+ {
	71	+ // TODO: remove after Optmized Markup experiment is merged to the core
	72	+ return ! \Elementor\Plugin::$instance->experiments->is_feature_active('e_optimized_markup');
	73	+ }
67	74	protected function register_controls()
68	75	{
69	76	$this->TRAIT_register_gallery_repeater_controls('Content');
70	77	$this->TRAIT_register_additional_controls(true);
		@@ -75,16 +82,16 @@
75	82	'label' => esc_html__('Carousel Settings', 'uicore-elements'),
76	83	'tab' => Controls_Manager::TAB_CONTENT,
77	84	]
78	85	);
79		- $this->TRAIT_register_carousel_additional_controls();
80		- $this->add_control(
81		- 'divider',
82		- [
83		- 'type' => Controls_Manager::DIVIDER,
84		- ]
85		- );
86		- $this->TRAIT_register_carousel_settings_controls();
	86	+ $this->TRAIT_register_carousel_additional_controls();
	87	+ $this->add_control(
	88	+ 'divider',
	89	+ [
	90	+ 'type' => Controls_Manager::DIVIDER,
	91	+ ]
	92	+ );
	93	+ $this->TRAIT_register_carousel_settings_controls();
87	94
88	95	$this->end_controls_section();
89	96
90	97	$this->TRAIT_register_navigation_controls();
		@@ -96,9 +103,9 @@
96	103	'tab' => Controls_Manager::TAB_STYLE,
97	104	]
98	105	);
99	106
100		- $this->TRAIT_register_all_item_style_controls();
	107	+ $this->TRAIT_register_all_item_style_controls();
101	108
102	109	$this->end_controls_section();
103	110
104	111	$this->TRAIT_register_filters_style_controls();
		@@ -116,9 +123,9 @@
116	123	[
117	124	'default' => 'none'
118	125	]
119	126	);
120		- $this->update_control(
	127	+ $this->update_responsive_control(
121	128	'item_padding',
122	129	[
123	130	'default' => [
124	131	'top' => 10,
		@@ -126,10 +133,10 @@
126	133	'bottom' => 10,
127	134	'left' => 10,
128	135	],
129	136	'selectors' => [
130		- '{{WRAPPER}} .ui-e-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
131		- ],
	137	+ '{{WRAPPER}} .ui-e-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
	138	+ ],
132	139	]
133	140	);
134	141	$this->update_control(
135	142	'item_border_radius',
		@@ -143,13 +150,69 @@
143	150	]
144	151	]
145	152	);
146	153	$this->update_control(
147		- 'match_height', [
	154	+ 'match_height',
	155	+ [
148	156	'render_type' => 'template',
149	157	]
150	158	);
151	159
	160	+ $image_conditions = [
	161	+ 'relation' => 'or',
	162	+ 'terms' => [
	163	+ [
	164	+ 'relation' => 'and',
	165	+ 'terms' => [
	166	+ [
	167	+ 'name' => 'layout',
	168	+ 'operator' => '==',
	169	+ 'value' => '',
	170	+ ],
	171	+ [
	172	+ 'name' => 'vertical',
	173	+ 'operator' => '!=',
	174	+ 'value' => 'true',
	175	+ ],
	176	+ ]
	177	+ ],
	178	+ [
	179	+ 'relation' => 'and',
	180	+ 'terms' => [
	181	+ [
	182	+ 'name' => 'layout',
	183	+ 'operator' => '==',
	184	+ 'value' => 'ui-e-overlay',
	185	+ ],
	186	+ [
	187	+ 'name' => 'match_height',
	188	+ 'operator' => '==',
	189	+ 'value' => 'yes',
	190	+ ],
	191	+ [
	192	+ 'name' => 'vertical',
	193	+ 'operator' => '!=',
	194	+ 'value' => 'true',
	195	+ ],
	196	+ ],
	197	+ ]
	198	+ ],
	199	+ ];
	200	+
	201	+ $this->update_control(
	202	+ 'style_image_section',
	203	+ [
	204	+ 'conditions' => $image_conditions
	205	+ ]
	206	+ );
	207	+ $this->update_responsive_control(
	208	+ 'image_height',
	209	+ [
	210	+ 'conditions' => $image_conditions
	211	+ ]
	212	+ );
	213	+
	214	+
152	215	// Remove some useless component controls or group controls that can't be properly updated
153	216	$this->remove_control('item_background_background');
154	217	$this->remove_control('item_hover_background_background');
155	218	$this->remove_control('item_background_color');
		@@ -156,33 +219,36 @@
156	219	$this->remove_control('item_background_image');
157	220	$this->remove_control('item_background_gradient');
158	221
159	222	// Inject new controls
160		- // TODO: release this feature after fixing compatibility issues with `fade_blur` and `circular`
161		- // $this->start_injection([
162		- // 'of' => 'animation_style',
163		- // 'at' => 'after',
164		- // ]);
	223	+ $this->start_injection([
	224	+ 'of' => 'animation_style',
	225	+ 'at' => 'after',
	226	+ ]);
165	227
166		- // $this->add_control(
167		- // 'main_image',
168		- // [
169		- // 'label' => __('Main image', 'uicore-elements'),
170		- // 'type' => Controls_Manager::SELECT,
171		- // 'default' => '',
172		- // 'options' => [
173		- // '' => esc_html__('Default', 'uicore-elements'),
174		- // 'ui-e-main-image-scale' => esc_html__('Scale', 'uicore-elements'),
175		- // 'ui-e-main-image-show' => esc_html__('Show Info', 'uicore-elements'),
176		- // 'ui-e-main-image-show_scale' => esc_html__('Show Info & Scale', 'uicore-elements'),
177		- // ],
178		- // 'prefix_class' => '',
179		- // 'render_type' => 'template',
180		- // 'frontend_available' => true,
181		- // ]
182		- // );
	228	+ $this->add_control(
	229	+ 'main_image',
	230	+ [
	231	+ 'label' => __('Main image', 'uicore-elements'),
	232	+ 'type' => Controls_Manager::SELECT,
	233	+ 'default' => '',
	234	+ 'options' => [
	235	+ '' => esc_html__('Default', 'uicore-elements'),
	236	+ 'ui-e-main-image-scale' => esc_html__('Scale', 'uicore-elements'),
	237	+ 'ui-e-main-image-show' => esc_html__('Show Info', 'uicore-elements'),
	238	+ 'ui-e-main-image-show_scale' => esc_html__('Show Info & Scale', 'uicore-elements'),
	239	+ ],
	240	+ 'description' => __('Works best with centered slides.', 'uicore-elements'),
	241	+ 'prefix_class' => '',
	242	+ 'render_type' => 'template',
	243	+ 'frontend_available' => true,
	244	+ 'condition' => [
	245	+ 'animation_style!' => 'marquee',
	246	+ ]
	247	+ ]
	248	+ );
183	249
184		- // $this->end_injection();
	250	+ $this->end_injection();
185	251
186	252	$this->start_injection([
187	253	'of' => 'item_border_border',
188	254	'at' => 'before',
		@@ -187,29 +253,29 @@
187	253	'of' => 'item_border_border',
188	254	'at' => 'before',
189	255	]);
190	256
191		- // normal background controls
192		- $this->add_group_control(
193		- Group_Control_Background::get_type(),
194		- [
195		- 'name' => 'item_gallery_background',
196		- 'selector' => '{{WRAPPER}} .ui-e-item',
197		- 'condition' => [
198		- 'layout' => '',
199		- ]
	257	+ // normal background controls
	258	+ $this->add_group_control(
	259	+ Group_Control_Background::get_type(),
	260	+ [
	261	+ 'name' => 'item_gallery_background',
	262	+ 'selector' => '{{WRAPPER}} .ui-e-item',
	263	+ 'condition' => [
	264	+ 'layout' => '',
200	265	]
201		- );
202		- $this->add_group_control(
203		- Group_Control_Background::get_type(),
204		- [
205		- 'name' => 'item_content_background',
206		- 'selector' => '{{WRAPPER}} .ui-e-content',
207		- 'condition' => [
208		- 'layout' => 'ui-e-overlay',
209		- ]
	266	+ ]
	267	+ );
	268	+ $this->add_group_control(
	269	+ Group_Control_Background::get_type(),
	270	+ [
	271	+ 'name' => 'item_content_background',
	272	+ 'selector' => '{{WRAPPER}} .ui-e-content',
	273	+ 'condition' => [
	274	+ 'layout' => 'ui-e-overlay',
210	275	]
211		- );
	276	+ ]
	277	+ );
212	278
213	279	$this->end_injection();
214	280
215	281	$this->start_injection([
		@@ -216,29 +282,29 @@
216	282	'of' => 'item_hover_border_color',
217	283	'at' => 'before',
218	284	]);
219	285
220		- // hover background controls
221		- $this->add_group_control(
222		- Group_Control_Background::get_type(),
223		- [
224		- 'name' => 'item_gallery_hover_background',
225		- 'selector' => '{{WRAPPER}} .ui-e-item:hover',
226		- 'condition' => [
227		- 'layout' => '',
228		- ]
	286	+ // hover background controls
	287	+ $this->add_group_control(
	288	+ Group_Control_Background::get_type(),
	289	+ [
	290	+ 'name' => 'item_gallery_hover_background',
	291	+ 'selector' => '{{WRAPPER}} .ui-e-item:hover',
	292	+ 'condition' => [
	293	+ 'layout' => '',
229	294	]
230		- );
231		- $this->add_group_control(
232		- Group_Control_Background::get_type(),
233		- [
234		- 'name' => 'item_content_hover_background',
235		- 'selector' => '{{WRAPPER}} .ui-e-item:hover .ui-e-content',
236		- 'condition' => [
237		- 'layout' => 'ui-e-overlay',
238		- ]
	295	+ ]
	296	+ );
	297	+ $this->add_group_control(
	298	+ Group_Control_Background::get_type(),
	299	+ [
	300	+ 'name' => 'item_content_hover_background',
	301	+ 'selector' => '{{WRAPPER}} .ui-e-item:hover .ui-e-content',
	302	+ 'condition' => [
	303	+ 'layout' => 'ui-e-overlay',
239	304	]
240		- );
	305	+ ]
	306	+ );
241	307
242	308	$this->end_injection();
243	309	}
244	310
		@@ -244,16 +310,17 @@
244	310
245	311	public function render()
246	312	{
247	313	$settings = $this->get_settings_for_display();
248		- ?>
249		- <div class="ui-e-carousel swiper">
250		- <div class='swiper-wrapper'>
251		- <?php $this->TRAIT_render_gallery($settings, true); ?>
252		- </div>
253		- <?php $this->TRAIT_render_carousel_navigations(); ?>
	314	+ $total_slides = count($settings['gallery_items']);
	315	+ $this->TRAIT_render_center_loop_warning($total_slides);
	316	+?>
	317	+ <div class="ui-e-carousel swiper">
	318	+ <div class='swiper-wrapper'>
	319	+ <?php $this->TRAIT_render_gallery($settings, true); ?>
254	320	</div>
255		- <?php
	321	+ </div>
	322	+ <?php $this->TRAIT_render_carousel_navigations($total_slides); ?>
	323	+<?php
256	324	}
257		-
258	325	}
259		-\Elementor\Plugin::instance()->widgets_manager->register(new GalleryCarousel());
	326	+\Elementor\Plugin::instance()->widgets_manager->register(new GalleryCarousel());