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

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

951 lines 24.1 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\AliceCarousel\Widgets;
4
5	use Elementor\Controls_Manager;
6	use Elementor\Group_Control_Border;
7	use Elementor\Group_Control_Box_Shadow;
8	use Elementor\Group_Control_Typography;
9	use Elementor\Group_Control_Text_Shadow;
10	use Elementor\Group_Control_Image_Size;
11	use Elementor\Group_Control_Background;
12	use UltimatePostKit\Utils;
13
14	use UltimatePostKit\Traits\Global_Widget_Controls;
15	use UltimatePostKit\Traits\Global_Widget_Functions;
16	use UltimatePostKit\Traits\Global_Swiper_Functions;
17	use UltimatePostKit\Includes\Controls\GroupQuery\Group_Control_Query;
18	use WP_Query;
19
20	if (!defined('ABSPATH')) exit; // Exit if accessed directly
21
22	class Alice_Carousel extends Group_Control_Query {
23	use Global_Widget_Controls;
24	use Global_Swiper_Functions;
25	use Global_Widget_Functions;
26
27	private $_query = null;
28
29	public function get_name() {
30	return 'upk-alice-carousel';
31	}
32
33	public function get_title() {
34	return BDTUPK . esc_html__('Alice Carousel', 'ultimate-post-kit');
35	}
36
37	public function get_icon() {
38	return 'upk-widget-icon upk-icon-alice-carousel';
39	}
40
41	public function get_categories() {
42	return ['ultimate-post-kit'];
43	}
44
45	public function get_keywords() {
46	return ['post', 'carousel', 'blog', 'recent', 'news', 'alice'];
47	}
48
49	public function get_style_depends() {
50	if ($this->upk_is_edit_mode()) {
51	return ['swiper', 'upk-all-styles'];
52	} else {
53	return ['swiper', 'upk-font', 'upk-alice-carousel'];
54	}
55	}
56
57	public function get_script_depends() {
58	if ($this->upk_is_edit_mode()) {
59	return ['swiper', 'upk-all-scripts'];
60	} else {
61	return ['swiper', 'upk-alice-carousel'];
62	}
63	}
64
65	public function get_custom_help_url() {
66	return 'https://youtu.be/I0i6q45j6Ps';
67	}
68
69
70	public function get_query() {
71	return $this->_query;
72	}
73
74	public function has_widget_inner_wrapper(): bool {
75	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
76	}
77
78
79	protected function register_controls() {
80	$this->start_controls_section(
81	'section_content_layout',
82	[
83	'label' => esc_html__('Layout', 'ultimate-post-kit'),
84	]
85	);
86
87	$this->add_responsive_control(
88	'columns',
89	[
90	'label' => esc_html__('Columns', 'ultimate-post-kit'),
91	'type' => Controls_Manager::SELECT,
92	'default' => 3,
93	'tablet_default' => 2,
94	'mobile_default' => 1,
95	'options' => [
96	1 => esc_html__('1', 'ultimate-post-kit'),
97	2 => esc_html__('2', 'ultimate-post-kit'),
98	3 => esc_html__('3', 'ultimate-post-kit'),
99	4 => esc_html__('4', 'ultimate-post-kit'),
100	5 => esc_html__('5', 'ultimate-post-kit'),
101	6 => esc_html__('6', 'ultimate-post-kit'),
102	],
103	]
104	);
105
106	$this->add_responsive_control(
107	'item_gap',
108	[
109	'label' => esc_html__('Item Gap', 'ultimate-post-kit'),
110	'type' => Controls_Manager::SLIDER,
111	'default' => [
112	'size' => 20,
113	],
114	'tablet_default' => [
115	'size' => 20,
116	],
117	'mobile_default' => [
118	'size' => 20,
119	],
120	'range' => [
121	'px' => [
122	'min' => 0,
123	'max' => 100,
124	],
125	],
126	]
127	);
128
129	$this->add_responsive_control(
130	'item_height',
131	[
132	'label' => esc_html__('Item Height(px)', 'ultimate-post-kit'),
133	'type' => Controls_Manager::SLIDER,
134	'range' => [
135	'px' => [
136	'min' => 200,
137	'max' => 800,
138	],
139	],
140	'selectors' => [
141	'{{WRAPPER}} .upk-alice-carousel .upk-item' => 'height: {{SIZE}}{{UNIT}};',
142	],
143	]
144	);
145
146	$this->add_control(
147	'content_position',
148	[
149	'label' => esc_html__('Content Position', 'ultimate-post-kit'),
150	'type' => Controls_Manager::CHOOSE,
151	'toggle' => false,
152	'default' => 'bottom-center',
153	'options' => [
154	'bottom-left' => [
155	'title' => esc_html__('Left', 'ultimate-post-kit'),
156	'icon' => 'eicon-text-align-left',
157	],
158	'bottom-center' => [
159	'title' => esc_html__('Center', 'ultimate-post-kit'),
160	'icon' => 'eicon-text-align-center',
161	],
162	'bottom-right' => [
163	'title' => esc_html__('Right', 'ultimate-post-kit'),
164	'icon' => 'eicon-text-align-right',
165	],
166	],
167	]
168	);
169
170	$this->add_group_control(
171	Group_Control_Image_Size::get_type(),
172	[
173	'name' => 'primary_thumbnail',
174	'exclude' => ['custom'],
175	'default' => 'medium',
176	]
177	);
178
179	$this->end_controls_section();
180
181	// Query Settings
182	$this->start_controls_section(
183	'section_post_query_builder',
184	[
185	'label' => esc_html__('Query', 'ultimate-post-kit'),
186	'tab' => Controls_Manager::TAB_CONTENT,
187	]
188	);
189
190	$this->add_control(
191	'item_limit',
192	[
193	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
194	'type' => Controls_Manager::SLIDER,
195	'range' => [
196	'px' => [
197	'min' => 1,
198	'max' => 20,
199	],
200	],
201	'default' => [
202	'size' => 5,
203	],
204	]
205	);
206
207	$this->register_query_builder_controls();
208
209	$this->end_controls_section();
210
211	$this->start_controls_section(
212	'section_content_additional',
213	[
214	'label' => esc_html__('Additional Options', 'ultimate-post-kit'),
215	]
216	);
217
218	//Global Title Controls
219	$this->register_title_controls();
220
221	$this->add_control(
222	'show_category',
223	[
224	'label' => esc_html__('Category', 'ultimate-post-kit'),
225	'type' => Controls_Manager::SWITCHER,
226	'default' => 'yes',
227	]
228	);
229
230	$this->add_control(
231	'show_author',
232	[
233	'label' => esc_html__('Author', 'ultimate-post-kit'),
234	'type' => Controls_Manager::SWITCHER,
235	'default' => 'yes',
236	]
237	);
238
239	//Global Date Controls
240	$this->register_date_controls();
241
242	//Global Reading Time Controls
243	$this->register_reading_time_controls();
244
245	$this->add_control(
246	'meta_separator',
247	[
248	'label' => esc_html__('Separator', 'ultimate-post-kit'),
249	'type' => Controls_Manager::TEXT,
250	'default' => '.',
251	'label_block' => false,
252	]
253	);
254
255	$this->add_control(
256	'global_link',
257	[
258	'label' => esc_html__('Item Wrapper Link', 'ultimate-post-kit'),
259	'type' => Controls_Manager::SWITCHER,
260	'prefix_class' => 'upk-global-link-',
261	'description' => esc_html__('Be aware! When Item Wrapper Link activated then title link and read more link will not work', 'ultimate-post-kit'),
262	'separator' => 'before'
263	]
264	);
265
266	$this->end_controls_section();
267
268	//Navigaiton Global Controls
269	$this->register_navigation_controls('alice');
270
271	//Style
272	$this->start_controls_section(
273	'upk_section_style',
274	[
275	'label' => esc_html__('Items', 'ultimate-post-kit'),
276	'tab' => Controls_Manager::TAB_STYLE,
277	]
278	);
279
280	$this->add_responsive_control(
281	'content_padding',
282	[
283	'label' => esc_html__('Content Padding', 'ultimate-post-kit'),
284	'type' => Controls_Manager::DIMENSIONS,
285	'size_units' => ['px', 'em', '%'],
286	'selectors' => [
287	'{{WRAPPER}} .upk-alice-carousel .upk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
288	],
289	]
290	);
291
292	$this->start_controls_tabs('tabs_item_style');
293
294	$this->start_controls_tab(
295	'tab_item_normal',
296	[
297	'label' => esc_html__('Normal', 'ultimate-post-kit'),
298	]
299	);
300
301	$this->add_control(
302	'overlay_blur_effect',
303	[
304	'label' => esc_html__('Glassmorphism', 'ultimate-post-kit'),
305	'type' => Controls_Manager::SWITCHER,
306	// translators: %1s: Opening anchor tag with link to MDN backdrop-filter documentation, %2s: Closing anchor tag
307	'description' => sprintf(__('This feature will not work in the Firefox browser untill you enable browser compatibility so please %1s look here %2s', 'ultimate-post-kit'), '<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility" target="_blank">', '</a>'),
308	]
309	);
310
311	$this->add_control(
312	'overlay_blur_level',
313	[
314	'label' => esc_html__('Blur Level', 'ultimate-post-kit'),
315	'type' => Controls_Manager::SLIDER,
316	'range' => [
317	'px' => [
318	'min' => 0,
319	'step' => 1,
320	'max' => 50,
321	]
322	],
323	'default' => [
324	'size' => 5
325	],
326	'selectors' => [
327	'{{WRAPPER}} .upk-alice-carousel .upk-item-box::before' => 'backdrop-filter: blur({{SIZE}}px); -webkit-backdrop-filter: blur({{SIZE}}px);'
328	],
329	'condition' => [
330	'overlay_blur_effect' => 'yes'
331	]
332	]
333	);
334
335	$this->add_control(
336	'item_overlay_color',
337	[
338	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
339	'type' => Controls_Manager::COLOR,
340	'selectors' => [
341	'{{WRAPPER}} .upk-alice-carousel .upk-item-box::before' => 'background: {{VALUE}};',
342	],
343	]
344	);
345
346	$this->add_group_control(
347	Group_Control_Border::get_type(),
348	[
349	'name' => 'item_border',
350	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-item',
351	]
352	);
353
354	$this->add_responsive_control(
355	'item_border_radius',
356	[
357	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
358	'type' => Controls_Manager::DIMENSIONS,
359	'size_units' => ['px', '%'],
360	'selectors' => [
361	'{{WRAPPER}} .upk-alice-carousel .upk-item-box' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
362	],
363	]
364	);
365
366	$this->add_responsive_control(
367	'item_padding',
368	[
369	'label' => esc_html__('Padding', 'ultimate-post-kit'),
370	'type' => Controls_Manager::DIMENSIONS,
371	'size_units' => ['px', 'em', '%'],
372	'selectors' => [
373	'{{WRAPPER}} .upk-alice-carousel .upk-item' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
374	],
375	]
376	);
377
378	$this->add_group_control(
379	Group_Control_Box_Shadow::get_type(),
380	[
381	'name' => 'item_box_shadow',
382	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-item',
383	]
384	);
385
386	$this->end_controls_tab();
387
388	$this->start_controls_tab(
389	'tab_item_hover',
390	[
391	'label' => esc_html__('Hover', 'ultimate-post-kit'),
392	]
393	);
394
395	$this->add_control(
396	'overlay_blur_level_hover',
397	[
398	'label' => esc_html__('Blur Level', 'ultimate-post-kit'),
399	'type' => Controls_Manager::SLIDER,
400	'range' => [
401	'px' => [
402	'min' => 0,
403	'step' => 1,
404	'max' => 50,
405	]
406	],
407	'default' => [
408	'size' => 0
409	],
410	'selectors' => [
411	'{{WRAPPER}} .upk-alice-carousel .upk-item:hover .upk-item-box::before' => 'backdrop-filter: blur({{SIZE}}px); -webkit-backdrop-filter: blur({{SIZE}}px);'
412	],
413	'condition' => [
414	'overlay_blur_effect' => 'yes'
415	]
416	]
417	);
418
419	$this->add_control(
420	'item_overlay_hover_color',
421	[
422	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
423	'type' => Controls_Manager::COLOR,
424	'selectors' => [
425	'{{WRAPPER}} .upk-alice-carousel .upk-item:hover .upk-item-box::before' => 'background: {{VALUE}};',
426	],
427	]
428	);
429
430	$this->add_control(
431	'item_hover_border_color',
432	[
433	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
434	'type' => Controls_Manager::COLOR,
435	'condition' => [
436	'item_border_border!' => '',
437	],
438	'selectors' => [
439	'{{WRAPPER}} .upk-alice-carousel .upk-item:hover' => 'border-color: {{VALUE}};',
440	],
441	]
442	);
443
444	$this->add_group_control(
445	Group_Control_Box_Shadow::get_type(),
446	[
447	'name' => 'item_hover_box_shadow',
448	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-item:hover',
449	]
450	);
451
452	$this->add_responsive_control(
453	'item_shadow_padding',
454	[
455	'label' => esc_html__('Match Padding', 'ultimate-post-kit'),
456	'description' => esc_html__('You have to add padding for matching overlaping normal/hover box shadow when you used Box Shadow option.', 'ultimate-post-kit'),
457	'type' => Controls_Manager::SLIDER,
458	'range' => [
459	'px' => [
460	'min' => 0,
461	'step' => 1,
462	'max' => 50,
463	]
464	],
465	'selectors' => [
466	'{{WRAPPER}} .swiper-carousel' => 'padding: {{SIZE}}{{UNIT}}; margin: 0 -{{SIZE}}{{UNIT}};'
467	],
468	]
469	);
470
471	$this->end_controls_tab();
472
473	$this->end_controls_tabs();
474
475	$this->end_controls_section();
476
477	$this->start_controls_section(
478	'section_style_title',
479	[
480	'label' => esc_html__('Title', 'ultimate-post-kit'),
481	'tab' => Controls_Manager::TAB_STYLE,
482	'condition' => [
483	'show_title' => 'yes',
484	],
485	]
486	);
487
488	$this->add_control(
489	'title_style',
490	[
491	'label' => esc_html__('Style', 'ultimate-post-kit'),
492	'type' => Controls_Manager::SELECT,
493	'default' => 'underline',
494	'options' => [
495	'underline' => esc_html__('Underline', 'ultimate-post-kit'),
496	'middle-underline' => esc_html__('Middle Underline', 'ultimate-post-kit'),
497	'overline' => esc_html__('Overline', 'ultimate-post-kit'),
498	'middle-overline' => esc_html__('Middle Overline', 'ultimate-post-kit'),
499	],
500	]
501	);
502
503	$this->add_control(
504	'title_color',
505	[
506	'label' => esc_html__('Color', 'ultimate-post-kit'),
507	'type' => Controls_Manager::COLOR,
508	'selectors' => [
509	'{{WRAPPER}} .upk-alice-carousel .upk-title a' => 'color: {{VALUE}};',
510	],
511	]
512	);
513
514	$this->add_control(
515	'title_hover_color',
516	[
517	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
518	'type' => Controls_Manager::COLOR,
519	'selectors' => [
520	'{{WRAPPER}} .upk-alice-carousel .upk-title a:hover' => 'color: {{VALUE}};',
521	],
522	]
523	);
524
525	$this->add_responsive_control(
526	'title_spacing',
527	[
528	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
529	'type' => Controls_Manager::SLIDER,
530	'range' => [
531	'px' => [
532	'min' => 0,
533	'max' => 50,
534	],
535	],
536	'selectors' => [
537	'{{WRAPPER}} .upk-alice-carousel .upk-title' => 'padding-bottom: {{SIZE}}{{UNIT}};',
538	],
539	]
540	);
541
542	$this->add_group_control(
543	Group_Control_Typography::get_type(),
544	[
545	'name' => 'title_typography',
546	'label' => esc_html__('Typography', 'ultimate-post-kit'),
547	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-title',
548	]
549	);
550
551	$this->add_group_control(
552	Group_Control_Text_Shadow::get_type(),
553	[
554	'name' => 'title_text_shadow',
555	'label' => esc_html__('Text Shadow', 'ultimate-post-kit'),
556	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-title a',
557	]
558	);
559
560	$this->end_controls_section();
561
562	$this->start_controls_section(
563	'section_style_author',
564	[
565	'label' => esc_html__('Meta', 'ultimate-post-kit'),
566	'tab' => Controls_Manager::TAB_STYLE,
567	'conditions' => [
568	'relation' => 'or',
569	'terms' => [
570	[
571	'name' => 'show_author',
572	'value' => 'yes'
573	],
574	[
575	'name' => 'show_date',
576	'value' => 'yes'
577	]
578	]
579	],
580	]
581	);
582
583	$this->add_control(
584	'author_color',
585	[
586	'label' => esc_html__('Color', 'ultimate-post-kit'),
587	'type' => Controls_Manager::COLOR,
588	'selectors' => [
589	'{{WRAPPER}} .upk-alice-carousel .upk-meta *' => 'color: {{VALUE}};',
590	],
591	]
592	);
593
594	$this->add_control(
595	'author_hover_color',
596	[
597	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
598	'type' => Controls_Manager::COLOR,
599	'selectors' => [
600	'{{WRAPPER}} .upk-alice-carousel .upk-meta .upk-author a:hover' => 'color: {{VALUE}};',
601	],
602	]
603	);
604
605
606	// $this->add_control(
607	// 'date_divider_color',
608	// [
609	// 'label' => esc_html__('Divider Color', 'ultimate-post-kit'),
610	// 'type' => Controls_Manager::COLOR,
611	// 'selectors' => [
612	// '{{WRAPPER}} .upk-alice-carousel .upk-meta .upk-date:before' => 'background: {{VALUE}};',
613	// ],
614	// ]
615	// );
616
617	// $this->add_responsive_control(
618	// 'date_spacing',
619	// [
620	// 'label' => esc_html__('Spacing', 'ultimate-post-kit'),
621	// 'type' => Controls_Manager::SLIDER,
622	// 'range' => [
623	// 'px' => [
624	// 'min' => 0,
625	// 'max' => 50,
626	// 'step' => 2,
627	// ],
628	// ],
629	// 'selectors' => [
630	// '{{WRAPPER}} .upk-alice-carousel .upk-meta .upk-date' => 'margin-left: {{SIZE}}{{UNIT}}; padding-left: {{SIZE}}{{UNIT}};',
631	// ],
632	// ]
633	// );
634
635	$this->add_responsive_control(
636	'date_spacing',
637	[
638	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
639	'type' => Controls_Manager::SLIDER,
640	'range' => [
641	'px' => [
642	'min' => 0,
643	'max' => 50,
644	],
645	],
646	'selectors' => [
647	'{{WRAPPER}} .upk-alice-carousel .upk-meta > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
648	],
649	]
650	);
651
652	$this->add_group_control(
653	Group_Control_Typography::get_type(),
654	[
655	'name' => 'author_typography',
656	'label' => esc_html__('Typography', 'ultimate-post-kit'),
657	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-meta *',
658	]
659	);
660
661	$this->end_controls_section();
662
663	$this->start_controls_section(
664	'section_style_category',
665	[
666	'label' => esc_html__('Category', 'ultimate-post-kit'),
667	'tab' => Controls_Manager::TAB_STYLE,
668	'condition' => [
669	'show_category' => 'yes',
670	],
671	]
672	);
673
674	$this->add_responsive_control(
675	'category_bottom_spacing',
676	[
677	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
678	'type' => Controls_Manager::SLIDER,
679	'range' => [
680	'px' => [
681	'min' => 0,
682	'max' => 50,
683	],
684	],
685	'selectors' => [
686	'{{WRAPPER}} .upk-alice-carousel .upk-category' => 'margin: {{SIZE}}{{UNIT}};',
687	],
688	]
689	);
690
691	$this->start_controls_tabs('tabs_category_style');
692
693	$this->start_controls_tab(
694	'tab_category_normal',
695	[
696	'label' => esc_html__('Normal', 'ultimate-post-kit'),
697	]
698	);
699
700	$this->add_control(
701	'category_color',
702	[
703	'label' => esc_html__('Color', 'ultimate-post-kit'),
704	'type' => Controls_Manager::COLOR,
705	'selectors' => [
706	'{{WRAPPER}} .upk-alice-carousel .upk-category a' => 'color: {{VALUE}};',
707	],
708	]
709	);
710
711	$this->add_group_control(
712	Group_Control_Background::get_type(),
713	[
714	'name' => 'category_background',
715	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-category a',
716	]
717	);
718
719	$this->add_group_control(
720	Group_Control_Border::get_type(),
721	[
722	'name' => 'category_border',
723	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-category a',
724	]
725	);
726
727	$this->add_responsive_control(
728	'category_border_radius',
729	[
730	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
731	'type' => Controls_Manager::DIMENSIONS,
732	'size_units' => ['px', '%'],
733	'selectors' => [
734	'{{WRAPPER}} .upk-alice-carousel .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
735	],
736	]
737	);
738
739	$this->add_responsive_control(
740	'category_padding',
741	[
742	'label' => esc_html__('Padding', 'ultimate-post-kit'),
743	'type' => Controls_Manager::DIMENSIONS,
744	'size_units' => ['px', 'em', '%'],
745	'selectors' => [
746	'{{WRAPPER}} .upk-alice-carousel .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
747	],
748	]
749	);
750
751	$this->add_responsive_control(
752	'category_spacing',
753	[
754	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
755	'type' => Controls_Manager::SLIDER,
756	'range' => [
757	'px' => [
758	'min' => 0,
759	'max' => 50,
760	'step' => 2,
761	],
762	],
763	'selectors' => [
764	'{{WRAPPER}} .upk-alice-carousel .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
765	],
766	]
767	);
768
769
770	$this->add_group_control(
771	Group_Control_Box_Shadow::get_type(),
772	[
773	'name' => 'category_shadow',
774	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-category a',
775	]
776	);
777
778	$this->add_group_control(
779	Group_Control_Typography::get_type(),
780	[
781	'name' => 'category_typography',
782	'label' => esc_html__('Typography', 'ultimate-post-kit'),
783	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-category a',
784	]
785	);
786
787	$this->end_controls_tab();
788
789	$this->start_controls_tab(
790	'tab_category_hover',
791	[
792	'label' => esc_html__('Hover', 'ultimate-post-kit'),
793	]
794	);
795
796	$this->add_control(
797	'category_hover_color',
798	[
799	'label' => esc_html__('Color', 'ultimate-post-kit'),
800	'type' => Controls_Manager::COLOR,
801	'selectors' => [
802	'{{WRAPPER}} .upk-alice-carousel .upk-category a:hover' => 'color: {{VALUE}};',
803	],
804	]
805	);
806
807	$this->add_group_control(
808	Group_Control_Background::get_type(),
809	[
810	'name' => 'category_hover_background',
811	'selector' => '{{WRAPPER}} .upk-alice-carousel .upk-category a:hover',
812	]
813	);
814
815	$this->add_control(
816	'category_hover_border_color',
817	[
818	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
819	'type' => Controls_Manager::COLOR,
820	'condition' => [
821	'category_border_border!' => '',
822	],
823	'selectors' => [
824	'{{WRAPPER}} .upk-alice-carousel .upk-category a:hover' => 'border-color: {{VALUE}};',
825	],
826	]
827	);
828
829	$this->end_controls_tab();
830
831	$this->end_controls_tabs();
832
833	$this->end_controls_section();
834
835	//Navigation Global Controls
836	$this->register_navigation_style('swiper');
837	}
838
839	/**
840	* Main query render for this widget
841	* @param $posts_per_page number item query limit
842	*/
843	public function query_posts($posts_per_page) {
844
845	$default = $this->getGroupControlQueryArgs();
846	$args = [];
847	if ($posts_per_page) {
848	$args['posts_per_page'] = $posts_per_page;
849	// $args['paged'] = max(1, get_query_var('paged'), get_query_var('page'));
850	}
851	$args = array_merge($default, $args);
852	$this->_query = new WP_Query($args);
853	}
854
855	public function render_author() {
856
857	if (!$this->get_settings('show_author')) {
858	return;
859	}
860
861	?>
862	<div class="upk-author">
863	<span><?php echo esc_html_x('by', 'Frontend', 'ultimate-post-kit') ?></span>
864	<a
865	href="<?php echo esc_url( get_author_posts_url(get_the_author_meta('ID')) ); ?>"
866	aria-label="<?php echo esc_attr( 'View all posts by ' . get_the_author() ); ?>"
867	>
868	<?php echo esc_html( get_the_author() ) ?>
869	</a>
870	</div>
871	<?php
872	}
873
874	public function render_header() {
875	$settings = $this->get_settings_for_display();
876
877	//Global Function
878	$this->render_header_attribute('alice');
879
880	?>
881	<div <?php $this->print_render_attribute_string('carousel'); ?>>
882	<div class="upk-content-<?php echo esc_html($settings['content_position']) ?>">
883	<div <?php $this->print_render_attribute_string('swiper'); ?>>
884	<div class="swiper-wrapper">
885	<?php
886	}
887
888	public function render_post_grid_item($post_id, $image_size) {
889	$settings = $this->get_settings_for_display();
890
891	if ('yes' == $settings['global_link']) {
892	$this->add_render_attribute('carousel-item', 'onclick', "window.open('" . esc_url(get_permalink()) . "', '_self')", true);
893	}
894
895	$this->add_render_attribute('carousel-item', 'class', 'upk-item swiper-slide', true);
896
897	?>
898	<div <?php $this->print_render_attribute_string('carousel-item'); ?>>
899	<div class="upk-item-box">
900	<div class="upk-img-wrap">
901	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
902	</div>
903	<?php $this->render_category(); ?>
904	<div class="upk-content">
905	<?php $this->render_title(substr($this->get_name(), 4)); ?>
906	<?php if ($settings['show_author'] or $settings['show_date'] or $settings['show_reading_time']) : ?>
907	<div class="upk-meta">
908	<?php $this->render_author(); ?>
909	<div data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
910	<?php $this->render_date(); ?>
911	</div>
912	<?php if (_is_upk_pro_activated()) :
913	if ('yes' === $settings['show_reading_time']) : ?>
914	<div class="upk-reading-time" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
915	<?php echo esc_html( ultimate_post_kit_reading_time( get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no' ) ); ?>
916	</div>
917	<?php endif; ?>
918	<?php endif; ?>
919	</div>
920	<?php endif; ?>
921	</div>
922	</div>
923	</div>
924	<?php
925	}
926
927	public function render() {
928	$settings = $this->get_settings_for_display();
929
930	$this->query_posts($settings['item_limit']['size']);
931	$wp_query = $this->get_query();
932
933	if (!$wp_query->found_posts) {
934	return;
935	}
936
937	$this->render_header();
938
939	while ($wp_query->have_posts()) {
940	$wp_query->the_post();
941	$thumbnail_size = $settings['primary_thumbnail_size'];
942
943	$this->render_post_grid_item(get_the_ID(), $thumbnail_size);
944	}
945
946	wp_reset_postdata();
947
948	$this->render_footer();
949	}
950	}
951