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

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

1,412 lines 36.3 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\RambleCarousel\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 Elementor\Icons_Manager;
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 Ramble_Carousel extends Group_Control_Query {
23
24	use Global_Widget_Controls;
25	use Global_Widget_Functions;
26	use Global_Swiper_Functions;
27
28	private $_query = null;
29
30	public function get_name() {
31	return 'upk-ramble-carousel';
32	}
33
34	public function get_title() {
35	return BDTUPK . esc_html__('Ramble Carousel', 'ultimate-post-kit');
36	}
37
38	public function get_icon() {
39	return 'upk-widget-icon upk-icon-ramble-carousel';
40	}
41
42	public function get_categories() {
43	return ['ultimate-post-kit'];
44	}
45
46	public function get_keywords() {
47	return ['post', 'carousel', 'blog', 'recent', 'news', 'ramble'];
48	}
49
50	public function get_style_depends() {
51	if ($this->upk_is_edit_mode()) {
52	return ['swiper', 'upk-all-styles'];
53	} else {
54	return ['swiper', 'upk-font', 'upk-ramble-carousel'];
55	}
56	}
57
58	public function get_script_depends() {
59	if ($this->upk_is_edit_mode()) {
60	return ['swiper', 'upk-all-scripts'];
61	} else {
62	return ['swiper', 'upk-ramble-carousel'];
63	}
64	}
65
66	public function get_custom_help_url() {
67	return 'https://youtu.be/vv10IM0pCHA';
68	}
69
70	public function on_import($element) {
71	if (!get_post_type_object($element['settings']['posts_post_type'])) {
72	$element['settings']['posts_post_type'] = 'post';
73	}
74
75	return $element;
76	}
77
78	public function get_query() {
79	return $this->_query;
80	}
81
82	public function has_widget_inner_wrapper(): bool {
83	return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
84	}
85
86
87	protected function register_controls() {
88	$this->start_controls_section(
89	'section_content_layout',
90	[
91	'label' => esc_html__('Layout', 'ultimate-post-kit'),
92	]
93	);
94
95	$this->add_responsive_control(
96	'columns',
97	[
98	'label' => __('Columns', 'ultimate-post-kit'),
99	'type' => Controls_Manager::SELECT,
100	'default' => 3,
101	'tablet_default' => 2,
102	'mobile_default' => 1,
103	'options' => [
104	1 => '1',
105	2 => '2',
106	3 => '3',
107	4 => '4',
108	5 => '5',
109	6 => '6',
110	],
111	]
112	);
113
114	$this->add_responsive_control(
115	'item_gap',
116	[
117	'label' => __('Item Gap', 'ultimate-post-kit'),
118	'type' => Controls_Manager::SLIDER,
119	'default' => [
120	'size' => 20,
121	],
122	'tablet_default' => [
123	'size' => 20,
124	],
125	'mobile_default' => [
126	'size' => 20,
127	],
128	'range' => [
129	'px' => [
130	'min' => 0,
131	'max' => 100,
132	],
133	],
134	]
135	);
136
137	$this->add_responsive_control(
138	'item_height',
139	[
140	'label' => esc_html__('Item Height(px)', 'ultimate-post-kit'),
141	'type' => Controls_Manager::SLIDER,
142	'range' => [
143	'px' => [
144	'min' => 200,
145	'max' => 600,
146	],
147	],
148	'selectors' => [
149	'{{WRAPPER}} .upk-ramble-carousel .upk-item' => 'height: {{SIZE}}{{UNIT}};',
150	],
151	]
152	);
153
154	$this->add_group_control(
155	Group_Control_Image_Size::get_type(),
156	[
157	'name' => 'primary_thumbnail',
158	'exclude' => ['custom'],
159	'default' => 'medium',
160	]
161	);
162
163	$this->end_controls_section();
164
165	// Query Settings
166	$this->start_controls_section(
167	'section_post_query_builder',
168	[
169	'label' => __('Query', 'ultimate-post-kit'),
170	'tab' => Controls_Manager::TAB_CONTENT,
171	]
172	);
173
174	$this->add_control(
175	'item_limit',
176	[
177	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
178	'type' => Controls_Manager::SLIDER,
179	'range' => [
180	'px' => [
181	'min' => 1,
182	'max' => 20,
183	],
184	],
185	'default' => [
186	'size' => 6,
187	],
188	'condition' => [
189	'posts_source!' => 'current_query',
190	]
191	]
192	);
193
194	$this->register_query_builder_controls();
195
196	$this->end_controls_section();
197
198	$this->start_controls_section(
199	'section_content_additional',
200	[
201	'label' => esc_html__('Additional Options', 'ultimate-post-kit'),
202	]
203	);
204
205	//Global Title Controls
206	$this->register_title_controls();
207	$this->register_text_controls();
208
209	$this->add_control(
210	'show_author_avatar',
211	[
212	'label' => esc_html__('Author Avatar', 'ultimate-post-kit'),
213	'type' => Controls_Manager::SWITCHER,
214	'default' => 'yes',
215	]
216	);
217
218	$this->add_control(
219	'show_author_name',
220	[
221	'label' => esc_html__('Author Name', 'ultimate-post-kit'),
222	'type' => Controls_Manager::SWITCHER,
223	'default' => 'yes',
224	]
225	);
226
227	//Global Date Controls
228	$this->register_date_controls();
229
230	//Global Reading Time Controls
231	$this->register_reading_time_controls();
232
233	$this->add_control(
234	'meta_separator',
235	[
236	'label' => __('Separator', 'ultimate-post-kit'),
237	'type' => Controls_Manager::TEXT,
238	'default' => '/',
239	'label_block' => false,
240	]
241	);
242
243	$this->add_control(
244	'show_category',
245	[
246	'label' => esc_html__('Category', 'ultimate-post-kit'),
247	'type' => Controls_Manager::SWITCHER,
248	'default' => 'yes',
249	'separator' => 'before'
250	]
251	);
252
253	$this->add_control(
254	'show_comments',
255	[
256	'label' => esc_html__('Show Comments', 'ultimate-post-kit'),
257	'type' => Controls_Manager::SWITCHER,
258	'default' => 'yes',
259	]
260	);
261
262	$this->add_control(
263	'show_readmore',
264	[
265	'label' => esc_html__('Read More', 'ultimate-post-kit'),
266	'type' => Controls_Manager::SWITCHER,
267	'default' => 'yes',
268	'separator' => 'before'
269	]
270	);
271
272	$this->add_control(
273	'readmore_text',
274	[
275	'label' => esc_html__('Read More Text', 'ultimate-post-kit'),
276	'type' => Controls_Manager::TEXT,
277	'dynamic' => [ 'active' => true ],
278	'default' => esc_html__('Read More', 'ultimate-post-kit'),
279	'placeholder' => esc_html__('Read More', 'ultimate-post-kit'),
280	'condition' => [
281	'show_readmore' => 'yes',
282	],
283	]
284	);
285
286	$this->add_control(
287	'readmore_icon',
288	[
289	'label' => esc_html__('Icon', 'ultimate-post-kit'),
290	'type' => Controls_Manager::ICONS,
291	'label_block' => false,
292	'skin' => 'inline',
293	'condition' => [
294	'show_readmore' => 'yes',
295	]
296	]
297	);
298
299	$this->add_control(
300	'icon_align',
301	[
302	'label' => esc_html__('Icon Position', 'ultimate-post-kit'),
303	'type' => Controls_Manager::SELECT,
304	'default' => 'right',
305	'options' => [
306	'left' => esc_html__('Left', 'ultimate-post-kit'),
307	'right' => esc_html__('Right', 'ultimate-post-kit'),
308	],
309	'condition' => [
310	'readmore_icon[value]!' => '',
311	],
312	]
313	);
314
315	$this->add_control(
316	'icon_indent',
317	[
318	'label' => esc_html__('Icon Spacing', 'ultimate-post-kit'),
319	'type' => Controls_Manager::SLIDER,
320	'default' => [
321	'size' => 8,
322	],
323	'range' => [
324	'px' => [
325	'max' => 50,
326	],
327	],
328	'condition' => [
329	'readmore_icon[value]!' => '',
330	],
331	'selectors' => [
332	'{{WRAPPER}} .upk-ramble-carousel .upk-flex-align-right' => is_rtl() ? 'margin-right: {{SIZE}}{{UNIT}};' : 'margin-left: {{SIZE}}{{UNIT}};',
333	'{{WRAPPER}} .upk-ramble-carousel .upk-flex-align-left' => is_rtl() ? 'margin-left: {{SIZE}}{{UNIT}};' : 'margin-right: {{SIZE}}{{UNIT}};',
334	],
335	]
336	);
337
338	$this->add_control(
339	'global_link',
340	[
341	'label' => __('Item Wrapper Link', 'ultimate-post-kit'),
342	'type' => Controls_Manager::SWITCHER,
343	'prefix_class' => 'upk-global-link-',
344	'description' => __('Be aware! When Item Wrapper Link activated then title link and read more link will not work', 'ultimate-post-kit'),
345	'separator' => 'before'
346	]
347	);
348
349	$this->end_controls_section();
350
351	//Navigaiton Global Controls
352	$this->register_navigation_controls('ramble');
353
354	//Style
355	$this->start_controls_section(
356	'upk_section_style',
357	[
358	'label' => esc_html__('Items', 'ultimate-post-kit'),
359	'tab' => Controls_Manager::TAB_STYLE,
360	]
361	);
362
363	$this->add_responsive_control(
364	'content_padding',
365	[
366	'label' => __('Content Padding', 'ultimate-post-kit'),
367	'type' => Controls_Manager::DIMENSIONS,
368	'size_units' => ['px', 'em', '%'],
369	'selectors' => [
370	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-show, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-hide, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
371	],
372	]
373	);
374
375	$this->start_controls_tabs('tabs_item_style');
376
377	$this->start_controls_tab(
378	'tab_item_normal',
379	[
380	'label' => esc_html__('Normal', 'ultimate-post-kit'),
381	]
382	);
383
384	$this->add_control(
385	'overlay_background',
386	[
387	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
388	'type' => Controls_Manager::COLOR,
389	'selectors' => [
390	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-img-wrap:before' => 'background-color: {{VALUE}};'
391	],
392	]
393	);
394
395	$this->add_group_control(
396	Group_Control_Border::get_type(),
397	[
398	'name' => 'item_border',
399	'label' => __('Border', 'ultimate-post-kit'),
400	'placeholder' => '1px',
401	'default' => '1px',
402	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item',
403	]
404	);
405
406	$this->add_responsive_control(
407	'item_border_radius',
408	[
409	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
410	'type' => Controls_Manager::DIMENSIONS,
411	'size_units' => ['px', '%'],
412	'selectors' => [
413	'{{WRAPPER}} .upk-ramble-carousel .upk-item' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
414	],
415	]
416	);
417
418	$this->add_group_control(
419	Group_Control_Box_Shadow::get_type(),
420	[
421	'name' => 'item_box_shadow',
422	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item',
423	]
424	);
425
426	$this->end_controls_tab();
427
428	$this->start_controls_tab(
429	'tab_item_hover',
430	[
431	'label' => esc_html__('Hover', 'ultimate-post-kit'),
432	]
433	);
434
435	$this->add_control(
436	'overlay_background_hover',
437	[
438	'label' => esc_html__('Overlay Color', 'ultimate-post-kit'),
439	'type' => Controls_Manager::COLOR,
440	'selectors' => [
441	'{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-img-wrap:before' => 'background-color: {{VALUE}};'
442	],
443	]
444	);
445
446	$this->add_control(
447	'item_border_color_hover',
448	[
449	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
450	'type' => Controls_Manager::COLOR,
451	'selectors' => [
452	'{{WRAPPER}} .upk-ramble-carousel .upk-item:hover' => 'border-color: {{VALUE}};'
453	],
454	'condition' => [
455	'item_border_border!' => ''
456	]
457	]
458	);
459
460	$this->add_group_control(
461	Group_Control_Box_Shadow::get_type(),
462	[
463	'name' => 'item_box_shadow_hover',
464	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item:hover',
465	]
466	);
467
468	$this->add_responsive_control(
469	'item_shadow_padding',
470	[
471	'label' => __('Match Padding', 'ultimate-post-kit'),
472	'description' => __('You have to add padding for matching overlaping normal/hover box shadow when you used Box Shadow option.', 'ultimate-post-kit'),
473	'type' => Controls_Manager::SLIDER,
474	'range' => [
475	'px' => [
476	'min' => 0,
477	'step' => 1,
478	'max' => 50,
479	]
480	],
481	'default' => [
482	'size' => 10
483	],
484	'selectors' => [
485	'{{WRAPPER}} .swiper-carousel' => 'padding: {{SIZE}}{{UNIT}}; margin: 0 -{{SIZE}}{{UNIT}};'
486	],
487	]
488	);
489
490	$this->end_controls_tab();
491
492	$this->end_controls_tabs();
493
494	$this->end_controls_section();
495
496	$this->start_controls_section(
497	'section_style_title',
498	[
499	'label' => esc_html__('Title', 'ultimate-post-kit'),
500	'tab' => Controls_Manager::TAB_STYLE,
501	'condition' => [
502	'show_title' => 'yes',
503	],
504	]
505	);
506
507	$this->add_control(
508	'title_style',
509	[
510	'type' => Controls_Manager::HIDDEN,
511	]
512	);
513
514	$this->add_control(
515	'title_color',
516	[
517	'label' => esc_html__('Color', 'ultimate-post-kit'),
518	'type' => Controls_Manager::COLOR,
519	'selectors' => [
520	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title a' => 'color: {{VALUE}};',
521	],
522	]
523	);
524
525	$this->add_group_control(
526	Group_Control_Typography::get_type(),
527	[
528	'name' => 'title_typography',
529	'label' => esc_html__('Typography', 'ultimate-post-kit'),
530	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title',
531	]
532	);
533
534	$this->add_control(
535	'title_advanced_style',
536	[
537	'label' => esc_html__('Advanced Style', 'ultimate-post-kit'),
538	'type' => Controls_Manager::SWITCHER,
539	]
540	);
541
542	$this->add_control(
543	'title_background',
544	[
545	'label' => esc_html__('Background', 'ultimate-post-kit'),
546	'type' => Controls_Manager::COLOR,
547	'selectors' => [
548	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title' => 'background-color: {{VALUE}};',
549	],
550	'condition' => [
551	'title_advanced_style' => 'yes'
552	]
553	]
554	);
555
556	$this->add_group_control(
557	Group_Control_Text_Shadow::get_type(),
558	[
559	'name' => 'title_text_shadow',
560	'label' => __('Text Shadow', 'ultimate-post-kit'),
561	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title',
562	'condition' => [
563	'title_advanced_style' => 'yes'
564	]
565	]
566	);
567
568	$this->add_group_control(
569	Group_Control_Border::get_type(),
570	[
571	'name' => 'title_border',
572	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title',
573	'condition' => [
574	'title_advanced_style' => 'yes'
575	]
576	]
577	);
578
579	$this->add_responsive_control(
580	'title_border_radius',
581	[
582	'label' => __('Border Radius', 'ultimate-post-kit'),
583	'type' => Controls_Manager::DIMENSIONS,
584	'size_units' => ['px', '%'],
585	'selectors' => [
586	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
587	],
588	'condition' => [
589	'title_advanced_style' => 'yes'
590	]
591	]
592	);
593
594	$this->add_group_control(
595	Group_Control_Box_Shadow::get_type(),
596	[
597	'name' => 'title_box_shadow',
598	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title',
599	'condition' => [
600	'title_advanced_style' => 'yes'
601	]
602	]
603	);
604
605	$this->add_responsive_control(
606	'title_text_padding',
607	[
608	'label' => __('Padding', 'ultimate-post-kit'),
609	'type' => Controls_Manager::DIMENSIONS,
610	'size_units' => ['px', 'em', '%'],
611	'selectors' => [
612	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
613	],
614	'condition' => [
615	'title_advanced_style' => 'yes'
616	]
617	]
618	);
619
620	$this->add_responsive_control(
621	'title_text_margtin',
622	[
623	'label' => __('Margtin', 'ultimate-post-kit'),
624	'type' => Controls_Manager::DIMENSIONS,
625	'size_units' => ['px', 'em', '%'],
626	'selectors' => [
627	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-title' => 'margtin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
628	],
629	'condition' => [
630	'title_advanced_style' => 'yes'
631	]
632	]
633	);
634
635	$this->end_controls_section();
636
637	$this->start_controls_section(
638	'section_text_style',
639	[
640	'label' => esc_html__('Text', 'ultimate-post-kit'),
641	'tab' => Controls_Manager::TAB_STYLE,
642	'condition' => [
643	'show_excerpt' => 'yes'
644	],
645	]
646	);
647
648	$this->add_control(
649	'text_color',
650	[
651	'label' => esc_html__('Color', 'ultimate-post-kit'),
652	'type' => Controls_Manager::COLOR,
653	'selectors' => [
654	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-text' => 'color: {{VALUE}};',
655	],
656	]
657	);
658
659	$this->add_group_control(
660	Group_Control_Typography::get_type(),
661	[
662	'name' => 'text_typography',
663	'label' => esc_html__('Typography', 'ultimate-post-kit'),
664	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-text',
665	]
666	);
667
668	$this->end_controls_section();
669
670	$this->start_controls_section(
671	'section_style_author_date',
672	[
673	'label' => esc_html__('Author/Date', 'ultimate-post-kit'),
674	'tab' => Controls_Manager::TAB_STYLE,
675	'conditions' => [
676	'relation' => 'or',
677	'terms' => [
678	[
679	'name' => 'show_author_avatar',
680	'value' => 'yes'
681	],
682	[
683	'name' => 'show_author_name',
684	'value' => 'yes'
685	],
686	[
687	'name' => 'show_date',
688	'value' => 'yes'
689	]
690	]
691	],
692	]
693	);
694
695	$this->add_control(
696	'author_image_heading',
697	[
698	'label' => esc_html__('Author Avatar', 'ultimate-post-kit'),
699	'type' => Controls_Manager::HEADING,
700	'condition' => [
701	'show_author_avatar' => 'yes'
702	]
703	]
704	);
705
706	$this->add_group_control(
707	Group_Control_Border::get_type(),
708	[
709	'name' => 'author_iamge_border',
710	'label' => __('Border', 'ultimate-post-kit'),
711	'placeholder' => '1px',
712	'default' => '1px',
713	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-meta .upk-author-image img',
714	'condition' => [
715	'show_author_avatar' => 'yes'
716	]
717	]
718	);
719
720	$this->add_responsive_control(
721	'author_iamge_border_radius',
722	[
723	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
724	'type' => Controls_Manager::DIMENSIONS,
725	'size_units' => ['px', '%'],
726	'selectors' => [
727	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-meta .upk-author-image img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
728	],
729	'condition' => [
730	'show_author_avatar' => 'yes'
731	]
732	]
733	);
734
735	$this->add_responsive_control(
736	'author_iamge_size',
737	[
738	'label' => esc_html__('Size', 'ultimate-post-kit'),
739	'type' => Controls_Manager::SLIDER,
740	'selectors' => [
741	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-meta .upk-author-image img' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};',
742	],
743	'condition' => [
744	'show_author_avatar' => 'yes'
745	]
746	]
747	);
748
749	$this->add_responsive_control(
750	'author_iamge_spacing',
751	[
752	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
753	'type' => Controls_Manager::SLIDER,
754	'selectors' => [
755	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-meta .upk-author-image' => 'margin-right: {{SIZE}}{{UNIT}};',
756	],
757	'condition' => [
758	'show_author_avatar' => 'yes'
759	]
760	]
761	);
762
763	$this->add_control(
764	'author_heading',
765	[
766	'label' => esc_html__('Author Name', 'ultimate-post-kit'),
767	'type' => Controls_Manager::HEADING,
768	'separator' => 'before',
769	'condition' => [
770	'show_author_name' => 'yes'
771	]
772	]
773	);
774
775	$this->add_control(
776	'author_color',
777	[
778	'label' => esc_html__('Color', 'ultimate-post-kit'),
779	'type' => Controls_Manager::COLOR,
780	'selectors' => [
781	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-author-name a' => 'color: {{VALUE}};',
782	],
783	'condition' => [
784	'show_author_name' => 'yes'
785	]
786	]
787	);
788
789	$this->add_control(
790	'author_hover_color',
791	[
792	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
793	'type' => Controls_Manager::COLOR,
794	'selectors' => [
795	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-author-name a:hover' => 'color: {{VALUE}};',
796	],
797	'condition' => [
798	'show_author_name' => 'yes'
799	]
800	]
801	);
802
803	$this->add_group_control(
804	Group_Control_Typography::get_type(),
805	[
806	'name' => 'author_typography',
807	'label' => esc_html__('Typography', 'ultimate-post-kit'),
808	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-author-name a',
809	'condition' => [
810	'show_author_name' => 'yes'
811	]
812	]
813	);
814
815	$this->add_control(
816	'date_heading',
817	[
818	'label' => esc_html__('Date/Time', 'ultimate-post-kit'),
819	'type' => Controls_Manager::HEADING,
820	'separator' => 'before',
821	'conditions' => [
822	'relation' => 'or',
823	'terms' => [
824	[
825	'name' => 'show_date',
826	'value' => 'yes'
827	],
828	[
829	'name' => 'show_reading_time',
830	'value' => 'yes'
831	]
832	]
833	],
834	]
835	);
836
837	$this->add_control(
838	'date_color',
839	[
840	'label' => esc_html__('Color', 'ultimate-post-kit'),
841	'type' => Controls_Manager::COLOR,
842	'selectors' => [
843	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-hide .upk-date, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-hide .upk-post-time, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-reading-time' => 'color: {{VALUE}};',
844	],
845	'conditions' => [
846	'relation' => 'or',
847	'terms' => [
848	[
849	'name' => 'show_date',
850	'value' => 'yes'
851	],
852	[
853	'name' => 'show_reading_time',
854	'value' => 'yes'
855	]
856	]
857	],
858	]
859	);
860
861	$this->add_group_control(
862	Group_Control_Typography::get_type(),
863	[
864	'name' => 'date_typography',
865	'label' => esc_html__('Typography', 'ultimate-post-kit'),
866	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-hide .upk-date, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-hide .upk-post-time, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-reading-time',
867	'conditions' => [
868	'relation' => 'or',
869	'terms' => [
870	[
871	'name' => 'show_date',
872	'value' => 'yes'
873	],
874	[
875	'name' => 'show_reading_time',
876	'value' => 'yes'
877	]
878	]
879	],
880	]
881	);
882
883	$this->add_responsive_control(
884	'date_spacing',
885	[
886	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
887	'type' => Controls_Manager::SLIDER,
888	'selectors' => [
889	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-default-hide .upk-date' => 'margin-top: {{SIZE}}{{UNIT}};',
890	],
891	'condition' => [
892	'show_date' => 'yes'
893	]
894	]
895	);
896
897	$this->add_responsive_control(
898	'meta_space_between',
899	[
900	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
901	'type' => Controls_Manager::SLIDER,
902	'range' => [
903	'px' => [
904	'min' => 0,
905	'max' => 50,
906	],
907	],
908	'selectors' => [
909	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-reading-time > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
910	],
911	'conditions' => [
912	'relation' => 'or',
913	'terms' => [
914	[
915	'name' => 'show_date',
916	'value' => 'yes'
917	],
918	[
919	'name' => 'show_reading_time',
920	'value' => 'yes'
921	]
922	]
923	],
924	]
925	);
926
927	$this->end_controls_section();
928
929	$this->start_controls_section(
930	'section_style_category',
931	[
932	'label' => esc_html__('Category/Date', 'ultimate-post-kit'),
933	'tab' => Controls_Manager::TAB_STYLE,
934	'conditions' => [
935	'relation' => 'or',
936	'terms' => [
937	[
938	'name' => 'show_category',
939	'value' => 'yes'
940	],
941	[
942	'name' => 'show_date',
943	'value' => 'yes'
944	]
945	]
946	],
947	]
948	);
949
950	$this->add_control(
951	'category_date_color',
952	[
953	'label' => esc_html__('Color', 'ultimate-post-kit'),
954	'type' => Controls_Manager::COLOR,
955	'selectors' => [
956	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-date, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-category a, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-post-time' => 'color: {{VALUE}};',
957	],
958	]
959	);
960
961	$this->add_control(
962	'category_date_divider_color',
963	[
964	'label' => esc_html__('Divider Color', 'ultimate-post-kit'),
965	'type' => Controls_Manager::COLOR,
966	'selectors' => [
967	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-category:before' => 'background: {{VALUE}};',
968	],
969	'condition' => [
970	'show_category' => 'yes'
971	]
972	]
973	);
974
975	$this->add_responsive_control(
976	'category_date_spacing',
977	[
978	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
979	'type' => Controls_Manager::SLIDER,
980	'selectors' => [
981	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-category' => 'margin-left: {{SIZE}}{{UNIT}}; padding-left: {{SIZE}}{{UNIT}};',
982	],
983	'condition' => [
984	'show_category' => 'yes'
985	]
986	]
987	);
988
989	$this->add_responsive_control(
990	'category_spacing',
991	[
992	'label' => esc_html__('Category Space Beween', 'ultimate-post-kit'),
993	'type' => Controls_Manager::SLIDER,
994	'range' => [
995	'px' => [
996	'min' => 0,
997	'max' => 50,
998	'step' => 2,
999	],
1000	],
1001	'selectors' => [
1002	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
1003	],
1004	'condition' => [
1005	'show_category' => 'yes'
1006	]
1007	]
1008	);
1009
1010	$this->add_group_control(
1011	Group_Control_Typography::get_type(),
1012	[
1013	'name' => 'category_date_typography',
1014	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1015	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-date, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-category a, {{WRAPPER}} .upk-ramble-carousel .upk-item .upk-date-cetagory-wrap .upk-post-time',
1016	]
1017	);
1018
1019	$this->end_controls_section();
1020
1021	$this->start_controls_section(
1022	'section_style_readmore',
1023	[
1024	'label' => __('Read More', 'ultimate-post-kit'),
1025	'tab' => Controls_Manager::TAB_STYLE,
1026	'condition' => [
1027	'show_readmore' => 'yes',
1028	],
1029	]
1030	);
1031
1032	$this->start_controls_tabs('tabs_readmore_style');
1033
1034	$this->start_controls_tab(
1035	'tab_readmore_normal',
1036	[
1037	'label' => __('Normal', 'ultimate-post-kit'),
1038	]
1039	);
1040
1041	$this->add_control(
1042	'readmore_text_color',
1043	[
1044	'label' => __('Color', 'ultimate-post-kit'),
1045	'type' => Controls_Manager::COLOR,
1046	'selectors' => [
1047	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore' => 'color: {{VALUE}};',
1048	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore svg *' => 'fill: {{VALUE}};',
1049	],
1050	]
1051	);
1052
1053	$this->add_group_control(
1054	Group_Control_Background::get_type(),
1055	[
1056	'name' => 'readmore_background',
1057	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore',
1058	]
1059	);
1060
1061	$this->add_group_control(
1062	Group_Control_Border::get_type(),
1063	[
1064	'name' => 'readmore_border',
1065	'placeholder' => '1px',
1066	'default' => '1px',
1067	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore'
1068	]
1069	);
1070
1071	$this->add_responsive_control(
1072	'readmore_radius',
1073	[
1074	'label' => __('Border Radius', 'ultimate-post-kit'),
1075	'type' => Controls_Manager::DIMENSIONS,
1076	'size_units' => ['px', '%'],
1077	'selectors' => [
1078	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1079	],
1080	]
1081	);
1082
1083	$this->add_responsive_control(
1084	'readmore_padding',
1085	[
1086	'label' => __('Padding', 'ultimate-post-kit'),
1087	'type' => Controls_Manager::DIMENSIONS,
1088	'size_units' => ['px', 'em', '%'],
1089	'selectors' => [
1090	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1091	],
1092	]
1093	);
1094
1095	$this->add_responsive_control(
1096	'readmore_margin',
1097	[
1098	'label' => __('Margin', 'ultimate-post-kit'),
1099	'type' => Controls_Manager::DIMENSIONS,
1100	'size_units' => ['px', 'em', '%'],
1101	'selectors' => [
1102	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1103	],
1104	]
1105	);
1106
1107	$this->add_group_control(
1108	Group_Control_Box_Shadow::get_type(),
1109	[
1110	'name' => 'readmore_shadow',
1111	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore',
1112	]
1113	);
1114
1115	$this->add_group_control(
1116	Group_Control_Typography::get_type(),
1117	[
1118	'name' => 'readmore_typography',
1119	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-readmore',
1120	]
1121	);
1122
1123	$this->end_controls_tab();
1124
1125	$this->start_controls_tab(
1126	'tab_readmore_hover',
1127	[
1128	'label' => __('Hover', 'ultimate-post-kit'),
1129	]
1130	);
1131
1132	$this->add_control(
1133	'readmore_hover_text_color',
1134	[
1135	'label' => __('Color', 'ultimate-post-kit'),
1136	'type' => Controls_Manager::COLOR,
1137	'selectors' => [
1138	'{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-btn-comments-wrap .upk-readmore' => 'color: {{VALUE}};',
1139	'{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-btn-comments-wrap .upk-readmore svg *' => 'fill: {{VALUE}};',
1140	],
1141	]
1142	);
1143
1144	$this->add_group_control(
1145	Group_Control_Background::get_type(),
1146	[
1147	'name' => 'readmore_hover_background',
1148	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-btn-comments-wrap .upk-readmore',
1149	]
1150	);
1151
1152	$this->add_control(
1153	'readmore_hover_border_color',
1154	[
1155	'label' => __('Border Color', 'ultimate-post-kit'),
1156	'type' => Controls_Manager::COLOR,
1157	'selectors' => [
1158	'{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-btn-comments-wrap .upk-readmore' => 'border-color: {{VALUE}};',
1159	],
1160	'condition' => [
1161	'readmore_border_border!' => ''
1162	]
1163	]
1164	);
1165
1166	$this->add_group_control(
1167	Group_Control_Box_Shadow::get_type(),
1168	[
1169	'name' => 'readmore_hover_shadow',
1170	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-btn-comments-wrap .upk-readmore',
1171	]
1172	);
1173
1174	$this->add_control(
1175	'readmore_hover_animation',
1176	[
1177	'label' => __('Hover Animation', 'ultimate-post-kit'),
1178	'type' => Controls_Manager::HOVER_ANIMATION,
1179	]
1180	);
1181
1182	$this->end_controls_tab();
1183
1184	$this->end_controls_tabs();
1185
1186	$this->end_controls_section();
1187
1188	$this->start_controls_section(
1189	'section_comments_style',
1190	[
1191	'label' => esc_html__('Comments', 'ultimate-post-kit'),
1192	'tab' => Controls_Manager::TAB_STYLE,
1193	'condition' => [
1194	'show_comments' => 'yes'
1195	],
1196	]
1197	);
1198
1199	$this->add_control(
1200	'comments_color',
1201	[
1202	'label' => esc_html__('Color', 'ultimate-post-kit'),
1203	'type' => Controls_Manager::COLOR,
1204	'selectors' => [
1205	'{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-comments' => 'color: {{VALUE}};',
1206	],
1207	]
1208	);
1209
1210	$this->add_control(
1211	'comments_hover_color',
1212	[
1213	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
1214	'type' => Controls_Manager::COLOR,
1215	'selectors' => [
1216	'{{WRAPPER}} .upk-ramble-carousel .upk-item:hover .upk-btn-comments-wrap .upk-comments' => 'color: {{VALUE}};',
1217	],
1218	]
1219	);
1220
1221	$this->add_group_control(
1222	Group_Control_Typography::get_type(),
1223	[
1224	'name' => 'comments_typography',
1225	'label' => esc_html__('Typography', 'ultimate-post-kit'),
1226	'selector' => '{{WRAPPER}} .upk-ramble-carousel .upk-item .upk-btn-comments-wrap .upk-comments',
1227	]
1228	);
1229
1230	$this->end_controls_section();
1231
1232	//Navigation Global Controls
1233	$this->register_navigation_style('swiper');
1234	}
1235
1236	/**
1237	* Main query render for this widget
1238	* @param $posts_per_page number item query limit
1239	*/
1240	public function query_posts($posts_per_page) {
1241
1242	$default = $this->getGroupControlQueryArgs();
1243	$args = [];
1244	if ($posts_per_page) {
1245	$args['posts_per_page'] = $posts_per_page;
1246	}
1247	$args = array_merge($default, $args);
1248	$this->_query = new WP_Query($args);
1249	}
1250
1251	public function render_post_meta() {
1252	$settings = $this->get_settings_for_display();
1253
1254	if ($settings['show_author_avatar'] or $settings['show_author_name'] or $settings['show_date']) : ?>
1255	<div class="upk-meta">
1256
1257	<?php if ($settings['show_author_avatar']) : ?>
1258	<div class="upk-author-image">
1259	<?php echo get_avatar(get_the_author_meta('ID'), 48); ?>
1260	</div>
1261	<?php endif; ?>
1262
1263	<div class="upk-author-name-date-wrap">
1264
1265	<?php if ($settings['show_author_name']) : ?>
1266	<div class="upk-author-name">
1267	<a href="<?php echo esc_url( get_author_posts_url(get_the_author_meta('ID')) ); ?>"><?php echo esc_html( get_the_author() ); ?></a>
1268	</div>
1269	<?php endif; ?>
1270
1271	<?php if ($settings['show_date'] or $settings['show_reading_time']) : ?>
1272	<div class="upk-date-reading-time upk-flex upk-flex-middle">
1273	<?php if ($settings['show_date'] == 'yes') : ?>
1274	<div data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1275	<?php $this->render_date(); ?>
1276	</div>
1277	<?php endif; ?>
1278
1279	<?php if (_is_upk_pro_activated()) :
1280	if ('yes' === $settings['show_reading_time']) : ?>
1281	<div class="upk-reading-time" data-separator="<?php echo esc_html($settings['meta_separator']); ?>">
1282	<?php echo esc_html( ultimate_post_kit_reading_time( get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no' ) ); ?>
1283	</div>
1284	<?php endif; ?>
1285	<?php endif; ?>
1286
1287	</div>
1288	<?php endif; ?>
1289
1290	</div>
1291
1292	</div>
1293	<?php endif;
1294	}
1295
1296	public function render_comments($id = 0) {
1297
1298	if (!$this->get_settings('show_comments')) {
1299	return;
1300	}
1301	?>
1302	<div class="upk-comments">
1303	<?php echo esc_html( $this->upk_get_formatted_comments_count( $id ) ); ?>
1304	</div>
1305	<?php
1306	}
1307
1308	public function render_readmore() {
1309	$settings = $this->get_settings_for_display();
1310
1311	if (!$this->get_settings('show_readmore')) {
1312	return;
1313	}
1314
1315	$animation = ($this->get_settings('readmore_hover_animation')) ? ' elementor-animation-' . $this->get_settings('readmore_hover_animation') : '';
1316
1317	?>
1318	<a href="<?php echo esc_url(get_permalink()); ?>" class="upk-readmore <?php echo esc_html($animation); ?>">
1319	<span class="upk-flex upk-flex-middle">
1320	<?php echo esc_html($this->get_settings('readmore_text')); ?>
1321
1322	<?php if ($settings['readmore_icon']['value']) : ?>
1323	<span class="upk-readmore-btn-icon upk-flex-align-<?php echo esc_html($this->get_settings('icon_align')); ?>">
1324
1325	<?php Icons_Manager::render_icon($settings['readmore_icon'], ['aria-hidden' => 'true', 'class' => 'fa-fw']); ?>
1326
1327	</span>
1328	<?php endif; ?>
1329	</span>
1330	</a>
1331	<?php
1332	}
1333
1334	public function render_header() {
1335	//Global Function
1336	$this->render_header_attribute('ramble');
1337
1338	?>
1339	<div <?php $this->print_render_attribute_string('carousel'); ?>>
1340	<div class="upk-wrapper">
1341	<div <?php $this->print_render_attribute_string('swiper'); ?>>
1342	<div class="swiper-wrapper">
1343	<?php
1344	}
1345
1346	public function render_post_grid_item($post_id, $image_size, $excerpt_length) {
1347	$settings = $this->get_settings_for_display();
1348
1349	if ('yes' == $settings['global_link']) {
1350
1351	$this->add_render_attribute('grid-item', 'onclick', "window.open('" . esc_url(get_permalink()) . "', '_self')", true);
1352	}
1353	$this->add_render_attribute('grid-item', 'class', 'upk-item swiper-slide upk-transition-toggle', true);
1354
1355	?>
1356	<div <?php $this->print_render_attribute_string('grid-item'); ?>>
1357	<div class="upk-img-wrap">
1358	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1359
1360	<div class="upk-content">
1361
1362	<div class="upk-default-show">
1363	<div class="upk-date-cetagory-wrap">
1364	<?php $this->render_date(); ?>
1365	<?php $this->render_category(); ?>
1366	</div>
1367
1368	<?php $this->render_title(substr($this->get_name(), 4)); ?>
1369	</div>
1370
1371	<div class="upk-default-hide">
1372	<?php $this->render_post_meta(); ?>
1373	<?php $this->render_excerpt($excerpt_length); ?>
1374	</div>
1375
1376	</div>
1377	<div class="upk-btn-comments-wrap">
1378	<div class="upk-btn-wrap upk-flex">
1379	<?php $this->render_readmore(); ?>
1380	</div>
1381	<?php $this->render_comments($post_id); ?>
1382	</div>
1383	</div>
1384	</div>
1385	<?php
1386	}
1387
1388	public function render() {
1389	$settings = $this->get_settings_for_display();
1390
1391	$this->query_posts($settings['item_limit']['size']);
1392	$wp_query = $this->get_query();
1393
1394	if (!$wp_query->found_posts) {
1395	return;
1396	}
1397
1398	$this->render_header();
1399
1400	while ($wp_query->have_posts()) {
1401	$wp_query->the_post();
1402	$thumbnail_size = $settings['primary_thumbnail_size'];
1403
1404	$this->render_post_grid_item(get_the_ID(), $thumbnail_size, $settings['excerpt_length']);
1405	}
1406
1407	wp_reset_postdata();
1408
1409	$this->render_footer();
1410	}
1411	}
1412