ultimate-post-kit / modules / category-carousel / widgets / category-carousel.php

category-carousel.php in Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets 4.5.3, at modules/category-carousel/widgets/category-carousel.php

967 lines 27.6 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\CategoryCarousel\Widgets;
4
5	use UltimatePostKit\Base\Module_Base;
6	use Elementor\Controls_Manager;
7	use Elementor\Group_Control_Border;
8	use Elementor\Group_Control_Typography;
9	use Elementor\Group_Control_Box_Shadow;
10	use Elementor\Group_Control_Image_Size;
11	use Elementor\Group_Control_Background;
12	use Elementor\Utils;
13	use Elementor\Plugin;
14	use UltimatePostKit\Traits\Global_Widget_Controls;
15	use UltimatePostKit\Traits\Global_Widget_Functions;
16	use UltimatePostKit\Traits\Global_Swiper_Functions;
17
18	if (!defined('ABSPATH')) {
19	exit;
20	} // Exit if accessed directly
21
22	class Category_Carousel extends Module_Base {
23	use Global_Widget_Controls;
24	use Global_Widget_Functions;
25	use Global_Swiper_Functions;
26	private $_query = null;
27
28	public function get_name() {
29	return 'upk-category-carousel';
30	}
31
32	public function get_title() {
33	return BDTUPK . esc_html__('Category Carousel', 'ultimate-post-kit');
34	}
35
36	public function get_icon() {
37	return 'upk-widget-icon upk-icon-category-carousel';
38	}
39
40	public function get_categories() {
41	return ['ultimate-post-kit'];
42	}
43
44	public function get_keywords() {
45	return ['post', 'carousel', 'blog', 'recent', 'news', 'elite'];
46	}
47
48	public function get_style_depends() {
49	if ($this->upk_is_edit_mode()) {
50	return ['swiper', 'upk-all-styles'];
51	} else {
52	return ['swiper', 'upk-font', 'upk-category-carousel'];
53	}
54	}
55
56	public function get_script_depends() {
57	if ($this->upk_is_edit_mode()) {
58	return ['swiper', 'upk-all-scripts'];
59	} else {
60	return ['swiper', 'upk-category-carousel'];
61	}
62	}
63
64	public function get_custom_help_url() {
65	return 'https://youtu.be/kNA3mYIMkLM';
66	}
67
68
69	public function get_query() {
70	return $this->_query;
71	}
72
73	public function has_widget_inner_wrapper(): bool {
74	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
75	}
76
77
78	protected function register_controls() {
79	$image_settings = ultimate_post_kit_option('category_image', 'ultimate_post_kit_other_settings', 'off');
80	$this->start_controls_section(
81	'section_content_layout',
82	[
83	'label' => esc_html__('Layout', 'ultimate-post-kit'),
84	]
85	);
86
87	$this->add_control(
88	'skin_layout',
89	[
90	'label' => __('Skin', 'ultimate-post-kit'),
91	'type' => Controls_Manager::SELECT,
92	'default' => 'style-1',
93	'options' => [
94	'style-1' => __('Style 1', 'ultimate-post-kit'),
95	'style-2' => __('Style 2', 'ultimate-post-kit'),
96	'style-3' => __('Style 3', 'ultimate-post-kit'),
97	'style-4' => __('Style 4', 'ultimate-post-kit'),
98	'style-5' => __('Style 5', 'ultimate-post-kit'),
99	// 'style-6' => __('Style 6', 'ultimate-post-kit'),
100	],
101	]
102	);
103	$this->add_responsive_control(
104	'columns',
105	[
106	'label' => __('Columns', 'ultimate-post-kit'),
107	'type' => Controls_Manager::SELECT,
108	'default' => 3,
109	'tablet_default' => 2,
110	'mobile_default' => 1,
111	'options' => [
112	1 => '1',
113	2 => '2',
114	3 => '3',
115	4 => '4',
116	5 => '5',
117	6 => '6',
118	],
119	]
120	);
121
122	$this->add_responsive_control(
123	'item_gap',
124	[
125	'label' => __('Item Gap', 'ultimate-post-kit'),
126	'type' => Controls_Manager::SLIDER,
127	'default' => [
128	'size' => 20,
129	],
130	'tablet_default' => [
131	'size' => 20,
132	],
133	'mobile_default' => [
134	'size' => 20,
135	],
136	'range' => [
137	'px' => [
138	'min' => 0,
139	'max' => 100,
140	],
141	],
142	]
143	);
144	$this->add_responsive_control(
145	'item_height',
146	[
147	'label' => esc_html__('Item Height(px)', 'ultimate-post-kit'),
148	'type' => Controls_Manager::SLIDER,
149	'range' => [
150	'px' => [
151	'min' => 0,
152	'max' => 1000,
153	],
154	],
155	'selectors' => [
156	'{{WRAPPER}} .upk-category-carousel .upk-item' => 'height: {{SIZE}}{{UNIT}};',
157	'{{WRAPPER}} .upk-category-carousel .upk-category-carousel-image' => 'height: {{SIZE}}{{UNIT}};'
158	],
159	'condition' => [
160	'skin_layout!' => 'style-3'
161	]
162	]
163	);
164	$this->add_responsive_control(
165	'item_height_skin_3',
166	[
167	'label' => esc_html__('Item Height(px)', 'ultimate-post-kit'),
168	'type' => Controls_Manager::SLIDER,
169	'range' => [
170	'px' => [
171	'min' => 0,
172	'max' => 1000,
173	],
174	],
175	'selectors' => [
176	'{{WRAPPER}} .upk-category-carousel .upk-category-carousel-image' => 'height: {{SIZE}}{{UNIT}};'
177	],
178	'condition' => [
179	'skin_layout' => 'style-3'
180	]
181	]
182	);
183
184	$this->add_group_control(
185	Group_Control_Image_Size::get_type(),
186	[
187	'name' => 'primary_thumbnail',
188	// phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude -- Elementor widget query built from user-configured controls; expected behaviour.
189	'exclude' => ['custom'],
190	'default' => 'medium',
191	]
192	);
193
194	$this->end_controls_section();
195	$this->start_controls_section(
196	'section_post_grid_query',
197	[
198	'label' => esc_html__('Query', 'ultimate-post-kit'),
199	]
200	);
201
202	$this->add_control(
203	'taxonomy',
204	[
205	'label' => esc_html__('Taxonomy', 'ultimate-post-kit'),
206	'type' => Controls_Manager::SELECT,
207	'default' => 'category',
208	'options' => ultimate_post_kit_get_taxonomies(),
209	]
210	);
211
212	$this->add_control(
213	'orderby',
214	[
215	'label' => esc_html__('Order By', 'ultimate-post-kit'),
216	'type' => Controls_Manager::SELECT,
217	'default' => 'name',
218	'options' => [
219	'name' => esc_html__('Name', 'ultimate-post-kit'),
220	'post_date' => esc_html__('Date', 'ultimate-post-kit'),
221	'post_title' => esc_html__('Title', 'ultimate-post-kit'),
222	'menu_order' => esc_html__('Menu Order', 'ultimate-post-kit'),
223	'rand' => esc_html__('Random', 'ultimate-post-kit'),
224	],
225	]
226	);
227
228	$this->add_control(
229	'order',
230	[
231	'label' => esc_html__('Order', 'ultimate-post-kit'),
232	'type' => Controls_Manager::SELECT,
233	'default' => 'asc',
234	'options' => [
235	'asc' => esc_html__('ASC', 'ultimate-post-kit'),
236	'desc' => esc_html__('DESC', 'ultimate-post-kit'),
237	],
238	]
239	);
240	// $this->add_control(
241	// 'include',
242	// [
243	// 'label' => esc_html__('Include', 'ultimate-post-kit'),
244	// 'type' => Controls_Manager::TEXT,
245	// 'placeholder' => __('Category ID: 12,3,1', 'ultimate-post-kit'),
246	// ]
247	// );
248	$this->add_control(
249	'exclude',
250	[
251	'label' => esc_html__('Exclude', 'ultimate-post-kit'),
252	'type' => Controls_Manager::TEXT,
253	'placeholder' => __('Category ID: 12,3,1', 'ultimate-post-kit'),
254	]
255	);
256	$this->add_control(
257	'parent',
258	[
259	'label' => esc_html__('Parent', 'ultimate-post-kit'),
260	'type' => Controls_Manager::TEXT,
261	'placeholder' => __('Category ID: 12', 'ultimate-post-kit'),
262	]
263	);
264	// $this->add_control(
265	// 'hide_empty',
266	// [
267	// 'label' => esc_html__('Hide Empty', 'ultimate-post-kit'),
268	// 'type' => Controls_Manager::SWITCHER,
269	// ]
270	// );
271
272
273	$this->end_controls_section();
274	$this->start_controls_section(
275	'section_content_additional',
276	[
277	'label' => esc_html__('Additional Options', 'ultimate-post-kit'),
278	]
279	);
280
281	$this->add_control(
282	'show_image',
283	[
284	'label' => esc_html__('Show Image', 'ultimate-post-kit'),
285	'type' => Controls_Manager::SWITCHER,
286	'default' => 'yes',
287	]
288	);
289
290	$this->add_control(
291	'show_count',
292	[
293	'label' => esc_html__('Show Count', 'ultimate-post-kit'),
294	'type' => Controls_Manager::SWITCHER,
295	'default' => 'yes',
296	]
297	);
298	$this->add_control(
299	'show_text',
300	[
301	'label' => esc_html__('Show Text', 'ultimate-post-kit'),
302	'type' => Controls_Manager::SWITCHER,
303	'default' => 'yes',
304	]
305	);
306	$this->add_control(
307	'count_text_label',
308	[
309	'label' => esc_html__('Count Label', 'ultimate-post-kit'),
310	'type' => Controls_Manager::TEXT,
311	'placeholder' => esc_html__('Posts', 'ultimate-post-kit'),
312	'default' => esc_html__('Posts', 'ultimate-post-kit'),
313	'condition' => [
314	'show_text' => 'yes'
315	]
316	]
317	);
318	$this->add_control(
319	'item_match_height',
320	[
321	'label' => __('Item Match Height', 'ultimate-post-kit'),
322	'type' => Controls_Manager::SWITCHER,
323	'default' => 'yes',
324	'prefix_class' => 'upk-item-match-height--',
325	'separator' => 'before'
326	]
327	);
328
329	$this->end_controls_section();
330
331	//Navigaation Global Controls
332	$this->register_navigation_controls('category');
333
334	//Style
335	$this->start_controls_section(
336	'section_style_item',
337	[
338	'label' => esc_html__('Item', 'ultimate-post-kit'),
339	'tab' => Controls_Manager::TAB_STYLE,
340	]
341	);
342	$this->start_controls_tabs(
343	'item_tabs'
344	);
345	$this->start_controls_tab(
346	'item_tab_normal',
347	[
348	'label' => esc_html__('Normal', 'ultimate-post-kit'),
349	]
350	);
351	$this->add_group_control(
352	Group_Control_Background::get_type(),
353	[
354	'name' => 'items_background',
355	'label' => esc_html__('Backgrund', 'ultimate-post-kit'),
356	'types' => ['classic', 'gradient'],
357	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-category-carousel-image',
358	]
359	);
360	$this->add_control(
361	'item_overlay',
362	[
363	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
364	'type' => Controls_Manager::COLOR,
365	'selectors' => [
366	'{{WRAPPER}} .upk-category-carousel .upk-item-overlay' => 'background: {{VALUE}}',
367	],
368	'condition' => [
369	'skin_layout!' => ['style-3']
370	]
371	]
372	);
373	$this->add_control(
374	'item_overlay_blur_effect',
375	[
376	'label' => esc_html__('Glassmorphism', 'ultimate-post-kit'),
377	'type' => Controls_Manager::SWITCHER,
378	// translators: %1s: Opening anchor tag with link to MDN backdrop-filter documentation, %2s: Closing anchor tag
379	'description' => sprintf(__('This feature will not work in the Firefox browser untill you enable browser compatibility so please %1$s look here %2$s', 'ultimate-post-kit'), '<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility" target="_blank">', '</a>'),
380	'default' => 'yes',
381	'condition' => [
382	'skin_layout' => [
383	'style-5',
384	]
385	]
386	]
387	);
388
389	$this->add_control(
390	'item_overlay_blur_level',
391	[
392	'label' => __('Blur Level', 'ultimate-post-kit'),
393	'type' => Controls_Manager::SLIDER,
394	'range' => [
395	'px' => [
396	'min' => 0,
397	'step' => 1,
398	'max' => 50,
399	]
400	],
401	'default' => [
402	'size' => 10
403	],
404	'selectors' => [
405	'{{WRAPPER}} .upk-category-carousel.style-5 .upk-category-carousel-image:before' => 'backdrop-filter: blur({{SIZE}}px); -webkit-backdrop-filter: blur({{SIZE}}px);'
406	],
407	'condition' => [
408	'item_overlay_blur_effect' => 'yes',
409	'skin_layout' => [
410	'style-5'
411	]
412	]
413	]
414	);
415
416	$this->add_group_control(
417	Group_Control_Background::get_type(),
418	[
419	'name' => 'item_background',
420	'selector' => '{{WRAPPER}} .upk-category-carousel.style-5 .upk-category-carousel-image:before',
421	'condition' => [
422	'skin_layout' => [
423	'style-5'
424	]
425	]
426	]
427	);
428	$this->add_responsive_control(
429	'item_padding',
430	[
431	'label' => esc_html__('Padding', 'ultimate-post-kit'),
432	'type' => Controls_Manager::DIMENSIONS,
433	'size_units' => ['px', '%', 'em'],
434	'selectors' => [
435	'{{WRAPPER}} .upk-category-carousel .upk-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
436	],
437	]
438	);
439	$this->add_responsive_control(
440	'item_margin',
441	[
442	'label' => esc_html__('Margin', 'ultimate-post-kit'),
443	'type' => Controls_Manager::DIMENSIONS,
444	'size_units' => ['px', '%', 'em'],
445	'selectors' => [
446	'{{WRAPPER}} .upk-category-carousel .upk-item' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
447	],
448	]
449	);
450	$this->add_group_control(
451	Group_Control_Border::get_type(),
452	[
453	'name' => 'item_border',
454	'label' => esc_html__('Border', 'ultimate-post-kit'),
455	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item',
456	]
457	);
458	$this->add_responsive_control(
459	'item_radius',
460	[
461	'label' => esc_html__('Radius', 'ultimate-post-kit'),
462	'type' => Controls_Manager::DIMENSIONS,
463	'size_units' => ['px', '%', 'em'],
464	'selectors' => [
465	'{{WRAPPER}} .upk-category-carousel .upk-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
466	],
467	]
468	);
469
470	// $this->add_group_control(
471	// Group_Control_Box_Shadow::get_type(),
472	// [
473	// 'name' => 'item_shadow',
474	// 'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item',
475	// ]
476	// );
477	$this->end_controls_tab();
478	$this->start_controls_tab(
479	'item_tab_hover',
480	[
481	'label' => esc_html__('Hover', 'ultimate-post-kit'),
482	]
483	);
484	$this->add_group_control(
485	Group_Control_Background::get_type(),
486	[
487	'name' => 'items_hover_background',
488	'label' => esc_html__('Backgrund', 'ultimate-post-kit'),
489	'types' => ['classic', 'gradient'],
490	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-category-carousel-image',
491	'condition' => [
492	'skin_layout!' => 'style-5'
493	]
494	]
495	);
496	$this->add_control(
497	'item_overlay_hover',
498	[
499	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
500	'type' => Controls_Manager::COLOR,
501	'selectors' => [
502	'{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-item-overlay' => 'background: {{VALUE}}',
503	],
504	'condition' => [
505	'skin_layout!' => ['style-3']
506	]
507	]
508	);
509	$this->add_control(
510	'item_hover_border_color',
511	[
512	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
513	'type' => Controls_Manager::COLOR,
514	'selectors' => [
515	'{{WRAPPER}} .upk-category-carousel .upk-item:hover' => 'border-color: {{VALUE}}',
516	],
517	]
518	);
519	$this->end_controls_tab();
520	$this->end_controls_tabs();
521	$this->end_controls_section();
522
523	$this->start_controls_section(
524	'section_style_content',
525	[
526	'label' => esc_html__('Content', 'ultimate-post-kit'),
527	'tab' => Controls_Manager::TAB_STYLE,
528	'condition' => [
529	'skin_layout' => [
530	'style-1'
531	]
532	]
533	]
534	);
535	$this->start_controls_tabs(
536	'content_tabs'
537	);
538	$this->start_controls_tab(
539	'content_tab_normal',
540	[
541	'label' => esc_html__('Normal', 'ultimate-post-kit'),
542	]
543	);
544
545	$this->add_group_control(
546	Group_Control_Background::get_type(),
547	[
548	'name' => 'content_background',
549	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content',
550	'condition' => [
551	'skin_layout' => 'style-1'
552	]
553	]
554	);
555
556	$this->add_responsive_control(
557	'content_padding',
558	[
559	'label' => esc_html__('Padding', 'ultimate-post-kit'),
560	'type' => Controls_Manager::DIMENSIONS,
561	'size_units' => ['px', '%', 'em'],
562	'selectors' => [
563	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
564	],
565	]
566	);
567	$this->add_responsive_control(
568	'content_margin',
569	[
570	'label' => esc_html__('Margin', 'ultimate-post-kit'),
571	'type' => Controls_Manager::DIMENSIONS,
572	'size_units' => ['px', '%', 'em'],
573	'selectors' => [
574	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
575	],
576	]
577	);
578	$this->add_group_control(
579	Group_Control_Border::get_type(),
580	[
581	'name' => 'content_border',
582	'label' => esc_html__('Border', 'ultimate-post-kit'),
583	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content',
584	]
585	);
586	$this->add_responsive_control(
587	'content_radius',
588	[
589	'label' => esc_html__('Radius', 'ultimate-post-kit'),
590	'type' => Controls_Manager::DIMENSIONS,
591	'size_units' => ['px', '%', 'em'],
592	'selectors' => [
593	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
594	],
595	]
596	);
597
598	$this->add_group_control(
599	Group_Control_Box_Shadow::get_type(),
600	[
601	'name' => 'content_shadow',
602	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content',
603	]
604	);
605	$this->end_controls_tab();
606	$this->start_controls_tab(
607	'content_tab_hover',
608	[
609	'label' => esc_html__('Hover', 'ultimate-post-kit'),
610	]
611	);
612	$this->add_control(
613	'content_hover_border_color',
614	[
615	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
616	'type' => Controls_Manager::COLOR,
617	'selectors' => [
618	'{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-content' => 'border-color: {{VALUE}}',
619	],
620	]
621	);
622	$this->add_group_control(
623	Group_Control_Box_Shadow::get_type(),
624	[
625	'name' => 'content_hover_shadow',
626	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-content',
627	]
628	);
629	$this->end_controls_tab();
630	$this->end_controls_tabs();
631	$this->end_controls_section();
632	$this->start_controls_section(
633	'section_style_category',
634	[
635	'label' => esc_html__('Category', 'ultimate-post-kit'),
636	'tab' => Controls_Manager::TAB_STYLE,
637	]
638	);
639	// $this->add_responsive_control(
640	// 'category_title_spacing',
641	// [
642	// 'label' => esc_html__('Bottom Spacing', 'ultimate-post-kit'),
643	// 'type' => Controls_Manager::SLIDER,
644	// 'size_units' => ['px'],
645	// 'selectors' => [
646	// '{{WRAPPER}} .upk-cateogry-carousel .title' => 'margin-bottom: {{SIZE}}{{UNIT}};',
647	// ],
648	// ]
649	// );
650	$this->start_controls_tabs(
651	'category_tabs'
652	);
653	$this->start_controls_tab(
654	'category_tab_normal',
655	[
656	'label' => esc_html__('Normal', 'ultimate-post-kit'),
657	]
658	);
659	$this->add_control(
660	'category_color',
661	[
662	'label' => esc_html__('Color', 'ultimate-post-kit'),
663	'type' => Controls_Manager::COLOR,
664	'selectors' => [
665	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .title' => 'color: {{VALUE}}',
666	],
667	]
668	);
669	$this->add_group_control(
670	Group_Control_Background::get_type(),
671	[
672	'name' => 'style_5_category_bg',
673	'label' => esc_html__('Backgorund', 'ultimate-post-kit'),
674	'types' => ['classic', 'gradient'],
675	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .title',
676	'condition' => [
677	'skin_layout' => [
678	'style-5'
679	]
680	]
681	]
682	);
683	$this->add_group_control(
684	Group_Control_Background::get_type(),
685	[
686	'name' => 'style_6_category_bg',
687	'label' => esc_html__('Background', 'ultimate-post-kit'),
688	'types' => ['classic', 'gradient'],
689	'selector' => '{{WRAPPER}} .upk-category-carousel.style-5 .upk-category-carousel-image:before',
690	'condition' => [
691	'skin_layout' => [
692	'style-6'
693	]
694	]
695	]
696	);
697	$this->add_responsive_control(
698	'category_margin',
699	[
700	'label' => esc_html__('Margin', 'ultimate-post-kit'),
701	'type' => Controls_Manager::DIMENSIONS,
702	'size_units' => ['px', '%'],
703	'selectors' => [
704	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
705	],
706	]
707	);
708	$this->add_responsive_control(
709	'category_padding',
710	[
711	'label' => esc_html__('Padding', 'ultimate-post-kit'),
712	'type' => Controls_Manager::DIMENSIONS,
713	'size_units' => ['px', '%'],
714	'selectors' => [
715	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
716	],
717	'condition' => [
718	'skin_layout' => [
719	'style-4'
720	]
721	]
722	]
723	);
724
725	$this->add_group_control(
726	Group_Control_Typography::get_type(),
727	[
728	'name' => 'category_typography',
729	'label' => esc_html__('Typography', 'ultimate-post-kit'),
730	// phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude -- Elementor widget query built from user-configured controls; expected behaviour.
731	'exclude' => ['line_height'],
732	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .title',
733	]
734	);
735	$this->end_controls_tab();
736	$this->start_controls_tab(
737	'category_tab_hover',
738	[
739	'label' => esc_html__('Hover', 'ultimate-post-kit'),
740	'condition' => [
741	'skin_layout!' => 'style-5'
742	]
743	]
744	);
745	$this->add_control(
746	'hover_category_color',
747	[
748	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
749	'type' => Controls_Manager::COLOR,
750	'selectors' => [
751	'{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-content .title' => 'color: {{VALUE}};',
752	],
753	]
754	);
755	$this->end_controls_tab();
756	$this->end_controls_tabs();
757	$this->end_controls_section();
758	$this->start_controls_section(
759	'section_style_count',
760	[
761	'label' => esc_html__('Count', 'ultimate-post-kit'),
762	'tab' => Controls_Manager::TAB_STYLE,
763	]
764	);
765	$this->start_controls_tabs(
766	'count_tabs'
767	);
768	$this->start_controls_tab(
769	'count_tab_normal',
770	[
771	'label' => esc_html__('Normal', 'ultimate-post-kit'),
772	'condition' => [
773	'skin_layout!' => [
774	'style-5'
775	]
776	]
777	]
778	);
779	$this->add_control(
780	'count_color',
781	[
782	'label' => esc_html__('Color', 'ultimate-post-kit'),
783	'type' => Controls_Manager::COLOR,
784	'selectors' => [
785	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .upk-category-count > *' => 'color: {{VALUE}};',
786	],
787	]
788	);
789	$this->add_group_control(
790	Group_Control_Background::get_type(),
791	[
792	'name' => 'count_background',
793	'label' => esc_html__('Background', 'ultimate-post-kit'),
794	'types' => ['classic', 'gradient'],
795	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .upk-category-count > *',
796	'condition' => [
797	'skin_layout' => [
798	'style-2'
799	]
800	]
801	]
802	);
803	$this->add_responsive_control(
804	'count_number_size',
805	[
806	'label' => esc_html__('Size', 'ultimate-post-kit'),
807	'type' => Controls_Manager::SLIDER,
808	'size_units' => ['px'],
809	'default' => [
810	'unit' => 'px',
811	'size' => 30,
812	],
813	'selectors' => [
814	'{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .upk-category-count > *' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}}; line-height: {{SIZE}}{{UNIT}};',
815	],
816	'condition' => [
817	'skin_layout' => [
818	'style-2'
819	]
820	]
821	]
822	);
823	// $this->add_responsive_control(
824	// 'count_padding',
825	// [
826	// 'label' => __('Padding', 'ultimate-post-kit'),
827	// 'type' => Controls_Manager::DIMENSIONS,
828	// 'size_units' => ['px', 'em', '%'],
829	// 'selectors' => [
830	// '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .upk-category-count > *' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
831	// ],
832	// ]
833	// );
834	$this->add_group_control(
835	Group_Control_Typography::get_type(),
836	[
837	'name' => 'count_typography',
838	'label' => esc_html__('Typography', 'ultimate-post-kit'),
839	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item .upk-content .upk-category-count > *',
840	]
841	);
842	$this->end_controls_tab();
843	$this->start_controls_tab(
844	'count_tab_hover',
845	[
846	'label' => esc_html__('Hover', 'ultimate-post-kit'),
847	]
848	);
849	$this->add_control(
850	'count_color_hover',
851	[
852	'label' => esc_html__('Color', 'ultimate-post-kit'),
853	'type' => Controls_Manager::COLOR,
854	'selectors' => [
855	'{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-content .upk-category-count > *' => 'color: {{VALUE}};',
856	],
857	]
858	);
859	$this->add_group_control(
860	Group_Control_Background::get_type(),
861	[
862	'name' => 'count_hover_background',
863	'label' => esc_html__('Background', 'ultimate-post-kit'),
864	'types' => ['classic', 'gradient'],
865	'selector' => '{{WRAPPER}} .upk-category-carousel .upk-item:hover .upk-content .upk-category-count > *',
866	'condition' => [
867	'skin_layout' => [
868	'style-2'
869	]
870	]
871	]
872	);
873	$this->end_controls_tab();
874	$this->end_controls_tabs();
875	$this->end_controls_section();
876	$this->register_navigation_style('swiper');
877	}
878
879	public function get_taxonomies() {
880	$taxonomies = get_taxonomies(['show_in_nav_menus' => true], 'objects');
881
882	$options = ['' => ''];
883
884	foreach ($taxonomies as $taxonomy) {
885	$options[$taxonomy->name] = $taxonomy->label;
886	}
887
888	return $options;
889	}
890
891	public function render_image($image_id, $size) {
892	$placeholder_image_src = Utils::get_placeholder_image_src();
893	$image_src = wp_get_attachment_image_src($image_id, $size);
894	if (!$image_src) {
895	return;
896	} else {
897	$image_src = $image_src[0];
898	}
899
900	?>
901	<img class="upk-category-carousel-img" src="<?php echo esc_url($image_src); ?>" alt="<?php echo esc_attr(get_the_title()); ?>">
902	<?php
903	}
904
905	public function render_header() {
906	$id = 'upk-category-carousel-' . $this->get_id();
907	$settings = $this->get_settings_for_display();
908	$this->add_render_attribute('carousel', 'class', ['upk-category-carousel', $settings['skin_layout']]);
909	$this->render_header_attribute('category');
910
911	$skin_layout = $settings['skin_layout'];
912	$this->add_render_attribute('swiper', 'class', 'swiper-carousel swiper upk-category-carousel-wrap upk-category-carousel-' . $skin_layout );
913	?>
914	<div <?php $this->print_render_attribute_string('carousel'); ?>>
915	<div class="upk-category-carousel-wrapper">
916	<div <?php $this->print_render_attribute_string('swiper'); ?>>
917	<div class="swiper-wrapper">
918	<?php
919	}
920
921	public function render_carousel_category_item() {
922	$settings = $this->get_settings_for_display();
923	$categories = get_categories(
924	[
925	'taxonomy' => $settings["taxonomy"],
926	'orderby' => $settings["orderby"],
927	'order' => $settings["order"],
928	// 'include' => explode(',', esc_attr($settings["include"])),
929	// phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude -- Elementor widget query built from user-configured controls; expected behaviour.
930	'exclude' => explode(',', esc_attr($settings["exclude"])),
931	'parent' => $settings["parent"],
932	'hide_empty' => 0,
933	]
934	);
935	if (!empty($categories)) :
936	foreach ($categories as $item_index => $cat) :
937	$this->add_render_attribute('category-item', 'class', ['swiper-slide', 'upk-item', 'category-link'], true);
938	$this->add_render_attribute('category-item', 'href', get_category_link($cat->cat_ID), true);
939	$category_image_id = get_term_meta($cat->cat_ID, 'upk-category-image-id', true); ?>
940	<a <?php $this->print_render_attribute_string('category-item'); ?>>
941	<div class="upk-category-carousel-image">
942	<?php $this->render_image($category_image_id, $settings['primary_thumbnail_size']); ?>
943	</div>
944	<div class="upk-content">
945	<h3 class="title"><?php echo esc_html($cat->cat_name); ?></h3>
946	<?php if ($settings['show_count'] === 'yes') : ?>
947	<p class="upk-category-count">
948	<?php printf('<span class="upk-count-number">%s</span>', esc_html($cat->category_count));
949	if ($settings['show_text'] === 'yes') :
950	printf('<span class="upk-count-text">%s</span>', esc_html($settings['count_text_label']));
951	endif;
952	endif; ?>
953	</p>
954	</div>
955	<div class="upk-item-overlay"></div>
956	</a>
957	<?php
958	endforeach;
959	endif;
960	}
961	public function render() {
962	$this->render_header();
963	$this->render_carousel_category_item();
964	$this->render_footer();
965	}
966	}
967