ultimate-post-kit / modules / crystal-slider / widgets / crystal-slider.php

crystal-slider.php in Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets 4.2.0, at modules/crystal-slider/widgets/crystal-slider.php

1,774 lines 45.3 KB

Raw Download Zip

1	<?php
2
3	namespace UltimatePostKit\Modules\CrystalSlider\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_Text_Stroke;
11	use Elementor\Group_Control_Image_Size;
12	use Elementor\Group_Control_Background;
13	use Elementor\Plugin;
14
15	use UltimatePostKit\Utils;
16	use UltimatePostKit\Traits\Global_Widget_Controls;
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 Crystal_Slider extends Group_Control_Query {
23
24	use Global_Widget_Controls;
25
26	private $_query = null;
27
28	public function get_name() {
29	return 'upk-crystal-slider';
30	}
31
32	public function get_title() {
33	return BDTUPK . esc_html__('Crystal Slider', 'ultimate-post-kit');
34	}
35
36	public function get_icon() {
37	return 'upk-widget-icon upk-icon-crystal-slider';
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', 'slider', 'crystal'];
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-crystal-slider'];
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-crystal-slider'];
61	}
62	}
63
64	public function get_custom_help_url() {
65	return 'https://youtu.be/wZNw_prt-uI';
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	$this->start_controls_section(
80	'section_content_layout',
81	[
82	'label' => esc_html__('Layout', 'ultimate-post-kit'),
83	]
84	);
85
86	$this->add_responsive_control(
87	'item_height',
88	[
89	'label' => esc_html__('Height', 'ultimate-post-kit'),
90	'type' => Controls_Manager::SLIDER,
91	'size_units' => ['px', 'vh'],
92	'range' => [
93	'px' => [
94	'min' => 200,
95	'max' => 1080,
96	],
97	'vh' => [
98	'min' => 10,
99	'max' => 100,
100	],
101	],
102	'selectors' => [
103	'{{WRAPPER}} .upk-crystal-slider .swiper-carousel' => 'height: {{SIZE}}{{UNIT}};',
104	],
105	]
106	);
107
108	$this->add_responsive_control(
109	'slide_spacing',
110	[
111	'label' => esc_html__('Slide Bottom Spacing', 'ultimate-post-kit'),
112	'type' => Controls_Manager::SLIDER,
113	'range' => [
114	'px' => [
115	'min' => 0,
116	'max' => 200,
117	],
118	],
119	'selectors' => [
120	'{{WRAPPER}} .upk-crystal-slider .swiper-carousel' => 'padding-bottom: {{SIZE}}{{UNIT}};',
121	],
122	]
123	);
124
125	$this->add_responsive_control(
126	'content_alignment',
127	[
128	'label' => esc_html__('Content Alignment', 'ultimate-post-kit'),
129	'type' => Controls_Manager::CHOOSE,
130	'default' => 'center',
131	'options' => [
132	'left' => [
133	'title' => esc_html__('Left', 'ultimate-post-kit'),
134	'icon' => 'eicon-text-align-left',
135	],
136	'center' => [
137	'title' => esc_html__('Center', 'ultimate-post-kit'),
138	'icon' => 'eicon-text-align-center',
139	],
140	'right' => [
141	'title' => esc_html__('Right', 'ultimate-post-kit'),
142	'icon' => 'eicon-text-align-right',
143	],
144	],
145	'selectors' => [
146	'{{WRAPPER}} .upk-crystal-slider .upk-content' => 'text-align: {{VALUE}};',
147	],
148	]
149	);
150
151	$this->add_group_control(
152	Group_Control_Image_Size::get_type(),
153	[
154	'name' => 'primary_thumbnail',
155	'exclude' => ['custom'],
156	'default' => 'full',
157	]
158	);
159
160	$this->add_control(
161	'hr_1',
162	[
163	'type' => Controls_Manager::DIVIDER,
164	]
165	);
166
167	//Global Title Controls
168	$this->register_title_controls();
169
170	$this->add_control(
171	'show_category',
172	[
173	'label' => esc_html__('Show Category', 'ultimate-post-kit'),
174	'type' => Controls_Manager::SWITCHER,
175	'default' => 'yes',
176	]
177	);
178
179	$this->add_control(
180	'strip_shortcode',
181	[
182	'label' => esc_html__('Strip Shortcode', 'ultimate-post-kit'),
183	'type' => Controls_Manager::SWITCHER,
184	'default' => 'yes',
185	'condition' => [
186	'show_excerpt' => 'yes',
187	],
188	]
189	);
190
191	$this->add_control(
192	'show_author',
193	[
194	'label' => esc_html__('Show Author', 'ultimate-post-kit'),
195	'type' => Controls_Manager::SWITCHER,
196	'default' => 'yes',
197	'separator' => 'before'
198	]
199	);
200
201	$this->add_control(
202	'meta_separator',
203	[
204	'label' => __('Separator', 'ultimate-post-kit'),
205	'type' => Controls_Manager::TEXT,
206	'default' => '//',
207	'label_block' => false,
208	]
209	);
210
211	//Global Date Controls
212	$this->register_date_controls();
213
214	//Global Reading Time Controls
215	$this->register_reading_time_controls();
216
217	$this->add_control(
218	'show_readmore',
219	[
220	'label' => esc_html__('Read more', 'ultimate-post-kit'),
221	'type' => Controls_Manager::SWITCHER,
222	'default' => 'no',
223	'separator' => 'before'
224	]
225	);
226
227	$this->end_controls_section();
228
229	// Query Settings
230	$this->start_controls_section(
231	'section_post_query_builder',
232	[
233	'label' => __('Query', 'ultimate-post-kit'),
234	'tab' => Controls_Manager::TAB_CONTENT,
235	]
236	);
237
238	$this->add_control(
239	'item_limit',
240	[
241	'label' => esc_html__('Item Limit', 'ultimate-post-kit'),
242	'type' => Controls_Manager::SLIDER,
243	'range' => [
244	'px' => [
245	'min' => 1,
246	'max' => 20,
247	],
248	],
249	'default' => [
250	'size' => 3,
251	],
252	'condition' => [
253	'posts_source!' => 'current_query',
254	]
255	]
256	);
257
258	$this->register_query_builder_controls();
259
260	$this->end_controls_section();
261
262	$this->start_controls_section(
263	'section_carousel_settings',
264	[
265	'label' => __('Slider Settings', 'ultimate-post-kit'),
266	]
267	);
268
269	$this->add_control(
270	'autoplay',
271	[
272	'label' => __('Autoplay', 'ultimate-post-kit'),
273	'type' => Controls_Manager::SWITCHER,
274	'default' => 'yes',
275
276	]
277	);
278
279	$this->add_control(
280	'autoplay_speed',
281	[
282	'label' => esc_html__('Autoplay Speed', 'ultimate-post-kit'),
283	'type' => Controls_Manager::NUMBER,
284	'default' => 5000,
285	'condition' => [
286	'autoplay' => 'yes',
287	],
288	]
289	);
290
291	$this->add_control(
292	'pauseonhover',
293	[
294	'label' => esc_html__('Pause on Hover', 'ultimate-post-kit'),
295	'type' => Controls_Manager::SWITCHER,
296	'condition' => [
297	'autoplay' => 'yes',
298	],
299	]
300	);
301
302	$this->add_control(
303	'grab_cursor',
304	[
305	'label' => __('Grab Cursor', 'ultimate-post-kit'),
306	'type' => Controls_Manager::SWITCHER,
307	]
308	);
309
310	$this->add_control(
311	'loop',
312	[
313	'label' => __('Loop', 'ultimate-post-kit'),
314	'type' => Controls_Manager::SWITCHER,
315	'default' => 'yes',
316
317	]
318	);
319
320
321	$this->add_control(
322	'speed',
323	[
324	'label' => __('Animation Speed (ms)', 'ultimate-post-kit'),
325	'type' => Controls_Manager::SLIDER,
326	'default' => [
327	'size' => 500,
328	],
329	'range' => [
330	'px' => [
331	'min' => 100,
332	'max' => 5000,
333	'step' => 50,
334	],
335	],
336	]
337	);
338
339	$this->add_control(
340	'observer',
341	[
342	'label' => __('Observer', 'ultimate-post-kit'),
343	'description' => __('When you use carousel in any hidden place (in tabs, accordion etc) keep it yes.', 'ultimate-post-kit'),
344	'type' => Controls_Manager::SWITCHER,
345	]
346	);
347
348	$this->add_control(
349	'show_navigation',
350	[
351	'label' => esc_html__('Show Navigation', 'ultimate-post-kit'),
352	'type' => Controls_Manager::SWITCHER,
353	'default' => 'yes',
354	'separator' => 'before'
355	]
356	);
357
358	$this->add_control(
359	'nav_arrows_icon',
360	[
361	'label' => esc_html__('Arrows Icon', 'ultimate-post-kit'),
362	'type' => Controls_Manager::SELECT,
363	'default' => '0',
364	'options' => [
365	'0' => esc_html__('Default', 'ultimate-post-kit'),
366	'1' => esc_html__('Style 1', 'ultimate-post-kit'),
367	'2' => esc_html__('Style 2', 'ultimate-post-kit'),
368	'3' => esc_html__('Style 3', 'ultimate-post-kit'),
369	'4' => esc_html__('Style 4', 'ultimate-post-kit'),
370	'5' => esc_html__('Style 5', 'ultimate-post-kit'),
371	'6' => esc_html__('Style 6', 'ultimate-post-kit'),
372	'7' => esc_html__('Style 7', 'ultimate-post-kit'),
373	'8' => esc_html__('Style 8', 'ultimate-post-kit'),
374	'9' => esc_html__('Style 9', 'ultimate-post-kit'),
375	'10' => esc_html__('Style 10', 'ultimate-post-kit'),
376	'11' => esc_html__('Style 11', 'ultimate-post-kit'),
377	'12' => esc_html__('Style 12', 'ultimate-post-kit'),
378	'13' => esc_html__('Style 13', 'ultimate-post-kit'),
379	'14' => esc_html__('Style 14', 'ultimate-post-kit'),
380	'15' => esc_html__('Style 15', 'ultimate-post-kit'),
381	'16' => esc_html__('Style 16', 'ultimate-post-kit'),
382	'17' => esc_html__('Style 17', 'ultimate-post-kit'),
383	'18' => esc_html__('Style 18', 'ultimate-post-kit'),
384	'circle-1' => esc_html__('Style 19', 'ultimate-post-kit'),
385	'circle-2' => esc_html__('Style 20', 'ultimate-post-kit'),
386	'circle-3' => esc_html__('Style 21', 'ultimate-post-kit'),
387	'circle-4' => esc_html__('Style 22', 'ultimate-post-kit'),
388	'square-1' => esc_html__('Style 23', 'ultimate-post-kit'),
389	],
390	'condition' => [
391	'show_navigation' => 'yes',
392	],
393	]
394	);
395
396	$this->add_control(
397	'show_pagination',
398	[
399	'label' => esc_html__('Show Pagination', 'ultimate-post-kit'),
400	'type' => Controls_Manager::SWITCHER,
401	'default' => 'yes',
402	'separator' => 'before'
403	]
404	);
405
406	$this->end_controls_section();
407
408	//Style
409	$this->start_controls_section(
410	'section_style_content',
411	[
412	'label' => esc_html__('Content', 'ultimate-post-kit'),
413	'tab' => Controls_Manager::TAB_STYLE,
414	]
415	);
416
417	$this->add_group_control(
418	Group_Control_Background::get_type(),
419	[
420	'name' => 'Content_background',
421	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content',
422	]
423	);
424
425	$this->add_group_control(
426	Group_Control_Border::get_type(),
427	[
428	'name' => 'content_border',
429	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content',
430	]
431	);
432
433	$this->add_responsive_control(
434	'content_border_radius',
435	[
436	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
437	'type' => Controls_Manager::DIMENSIONS,
438	'size_units' => ['px', '%'],
439	'selectors' => [
440	'{{WRAPPER}} .upk-crystal-slider .upk-content' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
441	],
442	]
443	);
444
445	$this->add_responsive_control(
446	'content_padding',
447	[
448	'label' => __('Padding', 'ultimate-post-kit'),
449	'type' => Controls_Manager::DIMENSIONS,
450	'size_units' => ['px', 'em', '%'],
451	'selectors' => [
452	'{{WRAPPER}} .upk-crystal-slider .upk-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
453	],
454	]
455	);
456
457	$this->add_responsive_control(
458	'content_max_width',
459	[
460	'label' => esc_html__('Max Width', 'ultimate-post-kit'),
461	'type' => Controls_Manager::SLIDER,
462	'size_units' => ['px', '%'],
463	'range' => [
464	'px' => [
465	'min' => 0,
466	'max' => 1200,
467	'step' => 5,
468	],
469	'%' => [
470	'min' => 0,
471	'max' => 200,
472	],
473	],
474	'default' => [
475	'unit' => '%',
476	],
477	'selectors' => [
478	'{{WRAPPER}} .upk-crystal-slider .upk-content' => 'max-width: {{SIZE}}{{UNIT}};',
479	],
480	]
481	);
482
483	$this->add_responsive_control(
484	'content_vertical_offset',
485	[
486	'label' => esc_html__('Vertical Offset', 'ultimate-post-kit'),
487	'type' => Controls_Manager::SLIDER,
488	'size_units' => ['px', '%'],
489	'range' => [
490	'px' => [
491	'min' => -500,
492	'max' => 500,
493	],
494	'%' => [
495	'min' => -200,
496	'max' => 200,
497	],
498	],
499	'%' => [
500	'min' => -0,
501	'max' => 100,
502	],
503	'default' => [
504	'unit' => '%',
505	],
506	'selectors' => [
507	'{{WRAPPER}} .upk-crystal-slider .upk-content' => 'bottom: {{SIZE}}{{UNIT}};',
508	],
509	]
510	);
511
512	$this->add_group_control(
513	Group_Control_Box_Shadow::get_type(),
514	[
515	'name' => 'content_shadow',
516	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content',
517	]
518	);
519
520	$this->end_controls_section();
521
522	$this->start_controls_section(
523	'section_style_title',
524	[
525	'label' => esc_html__('Title', 'ultimate-post-kit'),
526	'tab' => Controls_Manager::TAB_STYLE,
527	'condition' => [
528	'show_title' => 'yes',
529	],
530	]
531	);
532
533	$this->add_control(
534	'title_color',
535	[
536	'label' => esc_html__('Color', 'ultimate-post-kit'),
537	'type' => Controls_Manager::COLOR,
538	'selectors' => [
539	'{{WRAPPER}} .upk-crystal-slider .upk-title a' => 'color: {{VALUE}};',
540	],
541	]
542	);
543
544	$this->add_control(
545	'title_hover_color',
546	[
547	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
548	'type' => Controls_Manager::COLOR,
549	'selectors' => [
550	'{{WRAPPER}} .upk-crystal-slider .upk-title a:hover' => 'color: {{VALUE}};',
551	],
552	]
553	);
554
555	$this->add_responsive_control(
556	'title_spacing',
557	[
558	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
559	'type' => Controls_Manager::SLIDER,
560	'range' => [
561	'px' => [
562	'min' => 0,
563	'max' => 100,
564	],
565	],
566	'selectors' => [
567	'{{WRAPPER}} .upk-crystal-slider .upk-title' => 'margin-bottom: {{SIZE}}{{UNIT}};',
568	],
569	]
570	);
571
572	$this->add_group_control(
573	Group_Control_Typography::get_type(),
574	[
575	'name' => 'title_typography',
576	'label' => esc_html__('Typography', 'ultimate-post-kit'),
577	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-title',
578	]
579	);
580
581	$this->add_group_control(
582	Group_Control_Text_Shadow::get_type(),
583	[
584	'name' => 'title_text_shadow',
585	'label' => __('Text Shadow', 'ultimate-post-kit'),
586	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-title a',
587	]
588	);
589
590	$this->add_group_control(
591	Group_Control_Text_Stroke::get_type(),
592	[
593	'name' => 'title_text_stroke',
594	'label' => __('Text Stroke', 'ultimate-post-kit') . BDTUPK_NC,
595	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-title a',
596	]
597	);
598
599	$this->end_controls_section();
600
601	$this->start_controls_section(
602	'section_style_meta',
603	[
604	'label' => esc_html__('Meta', 'ultimate-post-kit'),
605	'tab' => Controls_Manager::TAB_STYLE,
606	'conditions' => [
607	'relation' => 'or',
608	'terms' => [
609	[
610	'name' => 'show_author',
611	'value' => 'yes'
612	],
613	[
614	'name' => 'show_date',
615	'value' => 'yes'
616	],
617	[
618	'name' => 'show_comments',
619	'value' => 'yes'
620	]
621	]
622	],
623	]
624	);
625
626	$this->add_control(
627	'meta_color',
628	[
629	'label' => esc_html__('Color', 'ultimate-post-kit'),
630	'type' => Controls_Manager::COLOR,
631	'selectors' => [
632	'{{WRAPPER}} .upk-crystal-slider .upk-meta,
633	{{WRAPPER}} .upk-crystal-slider .upk-meta .upk-author a' => 'color: {{VALUE}};',
634	],
635	]
636	);
637
638	$this->add_control(
639	'meta_hover_color',
640	[
641	'label' => esc_html__('Hover Color', 'ultimate-post-kit'),
642	'type' => Controls_Manager::COLOR,
643	'selectors' => [
644	'{{WRAPPER}} .upk-crystal-slider .upk-meta .upk-author a:hover' => 'color: {{VALUE}};',
645	],
646	]
647	);
648
649	$this->add_responsive_control(
650	'meta_space_between',
651	[
652	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
653	'type' => Controls_Manager::SLIDER,
654	'range' => [
655	'px' => [
656	'min' => 0,
657	'max' => 50,
658	],
659	],
660	'selectors' => [
661	'{{WRAPPER}} .upk-crystal-slider .upk-meta > div:before' => 'margin: 0 {{SIZE}}{{UNIT}};',
662	],
663	]
664	);
665
666	$this->add_group_control(
667	Group_Control_Typography::get_type(),
668	[
669	'name' => 'meta_typography',
670	'label' => esc_html__('Typography', 'ultimate-post-kit'),
671	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-meta',
672	]
673	);
674
675	$this->end_controls_section();
676
677	$this->start_controls_section(
678	'section_style_category',
679	[
680	'label' => esc_html__('Category', 'ultimate-post-kit'),
681	'tab' => Controls_Manager::TAB_STYLE,
682	'condition' => [
683	'show_category' => 'yes'
684	],
685	]
686	);
687
688	$this->add_responsive_control(
689	'category_bottom_spacing',
690	[
691	'label' => esc_html__('Spacing', 'ultimate-post-kit'),
692	'type' => Controls_Manager::SLIDER,
693	'range' => [
694	'px' => [
695	'min' => 0,
696	'max' => 50,
697	],
698	],
699	'selectors' => [
700	'{{WRAPPER}} .upk-crystal-slider .upk-category' => 'margin-bottom: {{SIZE}}{{UNIT}};',
701	],
702	]
703	);
704
705	$this->start_controls_tabs('tabs_category_style');
706
707	$this->start_controls_tab(
708	'tab_category_normal',
709	[
710	'label' => esc_html__('Normal', 'ultimate-post-kit'),
711	]
712	);
713
714	$this->add_control(
715	'category_color',
716	[
717	'label' => esc_html__('Color', 'ultimate-post-kit'),
718	'type' => Controls_Manager::COLOR,
719	'selectors' => [
720	'{{WRAPPER}} .upk-crystal-slider .upk-category a' => 'color: {{VALUE}};',
721	],
722	]
723	);
724
725	$this->add_group_control(
726	Group_Control_Background::get_type(),
727	[
728	'name' => 'category_background',
729	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
730	]
731	);
732
733	$this->add_group_control(
734	Group_Control_Border::get_type(),
735	[
736	'name' => 'category_border',
737	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
738	]
739	);
740
741	$this->add_responsive_control(
742	'category_border_radius',
743	[
744	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
745	'type' => Controls_Manager::DIMENSIONS,
746	'size_units' => ['px', '%'],
747	'selectors' => [
748	'{{WRAPPER}} .upk-crystal-slider .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
749	],
750	]
751	);
752
753	$this->add_responsive_control(
754	'category_padding',
755	[
756	'label' => esc_html__('Padding', 'ultimate-post-kit'),
757	'type' => Controls_Manager::DIMENSIONS,
758	'size_units' => ['px', 'em', '%'],
759	'selectors' => [
760	'{{WRAPPER}} .upk-crystal-slider .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
761	],
762	]
763	);
764
765	$this->add_responsive_control(
766	'category_spacing',
767	[
768	'label' => esc_html__('Space Between', 'ultimate-post-kit'),
769	'type' => Controls_Manager::SLIDER,
770	'range' => [
771	'px' => [
772	'min' => 0,
773	'max' => 50,
774	],
775	],
776	'selectors' => [
777	'{{WRAPPER}} .upk-crystal-slider .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
778	],
779	]
780	);
781
782	$this->add_group_control(
783	Group_Control_Box_Shadow::get_type(),
784	[
785	'name' => 'category_shadow',
786	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
787	]
788	);
789
790	$this->add_group_control(
791	Group_Control_Typography::get_type(),
792	[
793	'name' => 'category_typography',
794	'label' => esc_html__('Typography', 'ultimate-post-kit'),
795	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a',
796	]
797	);
798
799	$this->end_controls_tab();
800
801	$this->start_controls_tab(
802	'tab_category_hover',
803	[
804	'label' => esc_html__('Hover', 'ultimate-post-kit'),
805	'condition' => [
806	'show_category' => 'yes'
807	]
808	]
809	);
810
811	$this->add_control(
812	'category_hover_color',
813	[
814	'label' => esc_html__('Color', 'ultimate-post-kit'),
815	'type' => Controls_Manager::COLOR,
816	'selectors' => [
817	'{{WRAPPER}} .upk-crystal-slider .upk-category a:hover' => 'color: {{VALUE}};',
818	],
819	]
820	);
821
822	$this->add_group_control(
823	Group_Control_Background::get_type(),
824	[
825	'name' => 'category_hover_background',
826	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-category a:hover',
827	]
828	);
829
830	$this->add_control(
831	'category_hover_border_color',
832	[
833	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
834	'type' => Controls_Manager::COLOR,
835	'condition' => [
836	'category_border_border!' => '',
837	],
838	'selectors' => [
839	'{{WRAPPER}} .upk-crystal-slider .upk-category a:hover' => 'border-color: {{VALUE}};',
840	],
841	]
842	);
843
844	$this->end_controls_tab();
845
846	$this->end_controls_tabs();
847
848	$this->end_controls_section();
849
850	//Read More Css
851	$this->start_controls_section(
852	'section_style_btn',
853	[
854	'label' => __('Read More', 'ultimate-post-kit'),
855	'tab' => Controls_Manager::TAB_STYLE,
856	'condition' => [
857	'show_readmore' => 'yes'
858	]
859	]
860	);
861
862	$this->start_controls_tabs('tabs_read_more_style');
863
864	$this->start_controls_tab(
865	'tabs_read_more_normal',
866	[
867	'label' => __('Normal', 'ultimate-post-kit'),
868	]
869	);
870
871	$this->add_control(
872	'button_icon_color',
873	[
874	'label' => __('Icon Color', 'ultimate-post-kit'),
875	'type' => Controls_Manager::COLOR,
876	'selectors' => [
877	'{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'color: {{VALUE}}',
878	],
879	]
880	);
881
882	$this->add_group_control(
883	Group_Control_Background::get_type(),
884	[
885	'name' => 'button_background',
886	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a',
887	]
888	);
889
890	$this->add_group_control(
891	Group_Control_Border::get_type(),
892	[
893	'name' => 'button_border',
894	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a',
895	]
896	);
897
898	$this->add_responsive_control(
899	'button_border_radius',
900	[
901	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
902	'type' => Controls_Manager::DIMENSIONS,
903	'size_units' => ['px', '%'],
904	'selectors' => [
905	'{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
906	],
907	]
908	);
909
910	$this->add_responsive_control(
911	'read_more_padding',
912	[
913	'label' => __('Padding', 'ultimate-post-kit'),
914	'type' => Controls_Manager::DIMENSIONS,
915	'size_units' => ['px', 'em', '%'],
916	'selectors' => [
917	'{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
918	],
919	]
920	);
921
922	$this->add_responsive_control(
923	'button_icon_size',
924	[
925	'label' => esc_html__('Icon Size', 'ultimate-post-kit'),
926	'type' => Controls_Manager::SLIDER,
927	'selectors' => [
928	'{{WRAPPER}} .upk-crystal-slider .upk-link-btn a' => 'font-size: {{SIZE}}{{UNIT}};',
929	],
930	]
931	);
932
933
934	$this->add_responsive_control(
935	'button_vertical_offset',
936	[
937	'label' => esc_html__('Vertical Offset', 'ultimate-post-kit'),
938	'type' => Controls_Manager::SLIDER,
939	'size_units' => ['px', '%'],
940	'range' => [
941	'px' => [
942	'min' => -1000,
943	'max' => 1000,
944	],
945	'%' => [
946	'min' => -100,
947	'max' => 100,
948	],
949	],
950	'%' => [
951	'min' => -0,
952	'max' => 100,
953	],
954	'default' => [
955	'unit' => '%',
956	],
957	'selectors' => [
958	'{{WRAPPER}} .upk-crystal-slider .upk-link-btn' => 'top: {{SIZE}}{{UNIT}};',
959	],
960	]
961	);
962
963	$this->add_responsive_control(
964	'button_horizontal_offset',
965	[
966	'label' => esc_html__('Horizontal Offset', 'ultimate-post-kit'),
967	'type' => Controls_Manager::SLIDER,
968	'size_units' => ['px', '%'],
969	'range' => [
970	'px' => [
971	'min' => -1000,
972	'max' => 1000,
973	],
974	'%' => [
975	'min' => -100,
976	'max' => 100,
977	],
978	],
979	'%' => [
980	'min' => -0,
981	'max' => 100,
982	],
983	'default' => [
984	'unit' => '%',
985	],
986	'selectors' => [
987	'{{WRAPPER}} .upk-crystal-slider .upk-link-btn' => 'left: {{SIZE}}{{UNIT}};',
988	],
989	]
990	);
991
992	$this->add_group_control(
993	Group_Control_Box_Shadow::get_type(),
994	[
995	'name' => 'button_shadow',
996	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-link-btn a',
997	]
998	);
999
1000	$this->end_controls_tab();
1001
1002	$this->start_controls_tab(
1003	'tabs_button_hover',
1004	[
1005	'label' => __('Hover', 'ultimate-post-kit'),
1006	]
1007	);
1008
1009	$this->add_control(
1010	'button_hover_color',
1011	[
1012	'label' => __('Color', 'ultimate-post-kit'),
1013	'type' => Controls_Manager::COLOR,
1014	'selectors' => [
1015	'{{WRAPPER}} .upk-crystal-slider .upk-content:hover .upk-link-btn a' => 'color: {{VALUE}}',
1016	],
1017	]
1018	);
1019
1020	$this->add_group_control(
1021	Group_Control_Background::get_type(),
1022	[
1023	'name' => 'button_hover_background',
1024	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-content:hover .upk-link-btn a',
1025	]
1026	);
1027
1028	$this->add_control(
1029	'button_hover_border_color',
1030	[
1031	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1032	'type' => Controls_Manager::COLOR,
1033	'condition' => [
1034	'arrows_border_border!' => '',
1035	],
1036	'selectors' => [
1037	'{{WRAPPER}} .upk-crystal-slider .upk-content:hover .upk-link-btn a' => 'border-color: {{VALUE}};',
1038	],
1039	]
1040	);
1041
1042	$this->add_group_control(
1043	Group_Control_Box_Shadow::get_type(),
1044	[
1045	'name' => 'button_hover_shadow',
1046	'selector' => '{{WRAPPER}}.upk-crystal-slider .upk-content:hover .upk-link-btn a',
1047	]
1048	);
1049
1050	$this->end_controls_tab();
1051
1052	$this->end_controls_tabs();
1053
1054	$this->end_controls_section();
1055
1056	//Navigation Css
1057	$this->start_controls_section(
1058	'section_style_navigation',
1059	[
1060	'label' => __('Navigation', 'ultimate-post-kit'),
1061	'tab' => Controls_Manager::TAB_STYLE,
1062	]
1063	);
1064
1065	$this->start_controls_tabs('tabs_navigation_arrows_style');
1066
1067	$this->start_controls_tab(
1068	'tabs_nav_arrows_normal',
1069	[
1070	'label' => __('Normal', 'ultimate-post-kit'),
1071	]
1072	);
1073
1074	$this->add_control(
1075	'arrows_color',
1076	[
1077	'label' => __('Color', 'ultimate-post-kit'),
1078	'type' => Controls_Manager::COLOR,
1079	'selectors' => [
1080	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'color: {{VALUE}}',
1081	],
1082	]
1083	);
1084
1085	$this->add_group_control(
1086	Group_Control_Background::get_type(),
1087	[
1088	'name' => 'arrows_background',
1089	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev',
1090	]
1091	);
1092
1093	$this->add_group_control(
1094	Group_Control_Border::get_type(),
1095	[
1096	'name' => 'arrows_border',
1097	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev',
1098	]
1099	);
1100
1101	$this->add_responsive_control(
1102	'arrows_border_radius',
1103	[
1104	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1105	'type' => Controls_Manager::DIMENSIONS,
1106	'size_units' => ['px', '%'],
1107	'selectors' => [
1108	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1109	],
1110	]
1111	);
1112
1113	$this->add_responsive_control(
1114	'arrows_size',
1115	[
1116	'label' => esc_html__('Size', 'ultimate-post-kit'),
1117	'type' => Controls_Manager::SLIDER,
1118	'selectors' => [
1119	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'font-size: {{SIZE}}{{UNIT}};',
1120	],
1121	]
1122	);
1123
1124	$this->add_responsive_control(
1125	'navigation_padding',
1126	[
1127	'label' => __('Padding', 'ultimate-post-kit'),
1128	'type' => Controls_Manager::DIMENSIONS,
1129	'size_units' => ['px', 'em', '%'],
1130	'selectors' => [
1131	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider
1132	.upk-navigation-wrap .upk-navigation-prev' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1133	],
1134	]
1135	);
1136
1137	$this->add_group_control(
1138	Group_Control_Box_Shadow::get_type(),
1139	[
1140	'name' => 'arrows_shadow',
1141	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev',
1142	]
1143	);
1144
1145	$this->add_responsive_control(
1146	'vertical_offset',
1147	[
1148	'label' => esc_html__('Vertical Offset', 'ultimate-post-kit'),
1149	'type' => Controls_Manager::SLIDER,
1150	'selectors' => [
1151	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'top: {{SIZE}}%;',
1152	],
1153	]
1154	);
1155
1156	$this->add_responsive_control(
1157	'horizontal_offset_next',
1158	[
1159	'label' => esc_html__('Horizontal Offset', 'ultimate-post-kit'),
1160	'type' => Controls_Manager::SLIDER,
1161	'size_units' => ['px', '%'],
1162	'default' => [
1163	'unit' => '%',
1164	],
1165	'selectors' => [
1166	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next' => 'right: {{SIZE}}{{UNIT}}; left: auto;',
1167	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev' => 'left: {{SIZE}}{{UNIT}}; right: auto;',
1168	],
1169	]
1170	);
1171
1172	$this->end_controls_tab();
1173
1174	$this->start_controls_tab(
1175	'tabs_nav_arrows_hover',
1176	[
1177	'label' => __('Hover', 'ultimate-post-kit'),
1178	]
1179	);
1180
1181	$this->add_control(
1182	'arrows_hover_color',
1183	[
1184	'label' => __('Color', 'ultimate-post-kit'),
1185	'type' => Controls_Manager::COLOR,
1186	'selectors' => [
1187	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover' => 'color: {{VALUE}}',
1188	],
1189	]
1190	);
1191
1192	$this->add_group_control(
1193	Group_Control_Background::get_type(),
1194	[
1195	'name' => 'arrows_hover_background',
1196	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover',
1197	]
1198	);
1199
1200	$this->add_control(
1201	'arrows_hover_border_color',
1202	[
1203	'label' => esc_html__('Border Color', 'ultimate-post-kit'),
1204	'type' => Controls_Manager::COLOR,
1205	'condition' => [
1206	'arrows_border_border!' => '',
1207	],
1208	'selectors' => [
1209	'{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover' => 'border-color: {{VALUE}};',
1210	],
1211	]
1212	);
1213
1214	$this->add_group_control(
1215	Group_Control_Box_Shadow::get_type(),
1216	[
1217	'name' => 'arrows_hover_shadow',
1218	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-next:hover, {{WRAPPER}} .upk-crystal-slider .upk-navigation-wrap .upk-navigation-prev:hover',
1219	]
1220	);
1221
1222	$this->end_controls_tab();
1223
1224	$this->end_controls_tabs();
1225
1226	$this->end_controls_section();
1227
1228	//Pagination Css
1229	$this->start_controls_section(
1230	'section_style_pagination',
1231	[
1232	'label' => __('Pagination', 'ultimate-post-kit'),
1233	'tab' => Controls_Manager::TAB_STYLE,
1234	'condition' => [
1235	'show_pagination' => 'yes'
1236	]
1237	]
1238	);
1239
1240	$this->add_responsive_control(
1241	'dots_nny_position',
1242	[
1243	'label' => __('Dots Vertical Offset', 'ultimate-post-kit'),
1244	'type' => Controls_Manager::SLIDER,
1245	'range' => [
1246	'px' => [
1247	'min' => -200,
1248	'max' => 200,
1249	],
1250	],
1251	'selectors' => [
1252	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap' => 'bottom: {{SIZE}}px;'
1253	],
1254	]
1255	);
1256
1257	$this->start_controls_tabs('tabs_navigation_dots_style');
1258
1259	$this->start_controls_tab(
1260	'tabs_nav_dots_normal',
1261	[
1262	'label' => __('Normal', 'ultimate-post-kit'),
1263	]
1264	);
1265
1266	$this->add_control(
1267	'dots_color',
1268	[
1269	'label' => __('Color', 'ultimate-post-kit'),
1270	'type' => Controls_Manager::COLOR,
1271	'selectors' => [
1272	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'background-color: {{VALUE}}',
1273	],
1274	]
1275	);
1276
1277	$this->add_responsive_control(
1278	'dots_space_between',
1279	[
1280	'label' => __('Space Between', 'ultimate-post-kit'),
1281	'type' => Controls_Manager::SLIDER,
1282	'selectors' => [
1283	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .upk-pagination ' => 'grid-column-gap: {{SIZE}}{{UNIT}};',
1284	],
1285	]
1286	);
1287
1288	$this->add_responsive_control(
1289	'dots_size',
1290	[
1291	'label' => __('Size', 'ultimate-post-kit'),
1292	'type' => Controls_Manager::SLIDER,
1293	'range' => [
1294	'px' => [
1295	'min' => 5,
1296	'max' => 20,
1297	],
1298	],
1299	'selectors' => [
1300	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'height: {{SIZE}}{{UNIT}}; width: {{SIZE}}{{UNIT}};',
1301	],
1302	'condition' => [
1303	'advanced_dots_size' => ''
1304	],
1305	]
1306	);
1307
1308	$this->add_control(
1309	'advanced_dots_size',
1310	[
1311	'label' => __('Advanced Size', 'ultimate-post-kit'),
1312	'type' => Controls_Manager::SWITCHER,
1313	]
1314	);
1315
1316	$this->add_responsive_control(
1317	'advanced_dots_width',
1318	[
1319	'label' => __('Width(px)', 'ultimate-post-kit'),
1320	'type' => Controls_Manager::SLIDER,
1321	'range' => [
1322	'px' => [
1323	'min' => 1,
1324	'max' => 50,
1325	],
1326	],
1327	'selectors' => [
1328	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'width: {{SIZE}}{{UNIT}};',
1329	],
1330	'condition' => [
1331	'advanced_dots_size' => 'yes'
1332	],
1333	]
1334	);
1335
1336	$this->add_responsive_control(
1337	'advanced_dots_height',
1338	[
1339	'label' => __('Height(px)', 'ultimate-post-kit'),
1340	'type' => Controls_Manager::SLIDER,
1341	'range' => [
1342	'px' => [
1343	'min' => 1,
1344	'max' => 50,
1345	],
1346	],
1347	'selectors' => [
1348	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'height: {{SIZE}}{{UNIT}};',
1349	],
1350	'condition' => [
1351	'advanced_dots_size' => 'yes'
1352	],
1353	]
1354	);
1355
1356	$this->add_responsive_control(
1357	'advanced_dots_radius',
1358	[
1359	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1360	'type' => Controls_Manager::DIMENSIONS,
1361	'size_units' => ['px', '%'],
1362	'selectors' => [
1363	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1364	],
1365	'condition' => [
1366	'advanced_dots_size' => 'yes'
1367	],
1368	]
1369	);
1370
1371	$this->add_group_control(
1372	Group_Control_Box_Shadow::get_type(),
1373	[
1374	'name' => 'dots_box_shadow',
1375	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet',
1376	]
1377	);
1378
1379	$this->end_controls_tab();
1380
1381	$this->start_controls_tab(
1382	'tabs_nav_dots_active',
1383	[
1384	'label' => __('Active', 'ultimate-post-kit'),
1385	]
1386	);
1387
1388	$this->add_control(
1389	'active_dot_color',
1390	[
1391	'label' => __('Color', 'ultimate-post-kit'),
1392	'type' => Controls_Manager::COLOR,
1393	'selectors' => [
1394	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet' => 'background-color: {{VALUE}}',
1395	],
1396	]
1397	);
1398
1399	$this->add_responsive_control(
1400	'active_dots_size',
1401	[
1402	'label' => __('Size', 'ultimate-post-kit'),
1403	'type' => Controls_Manager::SLIDER,
1404	'range' => [
1405	'px' => [
1406	'min' => 5,
1407	'max' => 20,
1408	],
1409	],
1410	'selectors' => [
1411	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'height: {{SIZE}}{{UNIT}};width: {{SIZE}}{{UNIT}};',
1412	'{{WRAPPER}}' => '--ps-swiper-dots-active-height: {{SIZE}}{{UNIT}};',
1413	],
1414	'condition' => [
1415	'advanced_dots_size' => ''
1416	],
1417	]
1418	);
1419
1420	$this->add_responsive_control(
1421	'active_advanced_dots_width',
1422	[
1423	'label' => __('Width(px)', 'ultimate-post-kit'),
1424	'type' => Controls_Manager::SLIDER,
1425	'range' => [
1426	'px' => [
1427	'min' => 1,
1428	'max' => 50,
1429	],
1430	],
1431	'selectors' => [
1432	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'width: {{SIZE}}{{UNIT}};',
1433	],
1434	'condition' => [
1435	'advanced_dots_size' => 'yes'
1436	],
1437	]
1438	);
1439
1440	$this->add_responsive_control(
1441	'active_advanced_dots_height',
1442	[
1443	'label' => __('Height(px)', 'ultimate-post-kit'),
1444	'type' => Controls_Manager::SLIDER,
1445	'range' => [
1446	'px' => [
1447	'min' => 1,
1448	'max' => 50,
1449	],
1450	],
1451	'selectors' => [
1452	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'height: {{SIZE}}{{UNIT}};',
1453	'{{WRAPPER}}' => '--ps-swiper-dots-active-height: {{SIZE}}{{UNIT}};',
1454	],
1455	'condition' => [
1456	'advanced_dots_size' => 'yes'
1457	],
1458	]
1459	);
1460
1461	$this->add_responsive_control(
1462	'active_advanced_dots_radius',
1463	[
1464	'label' => esc_html__('Border Radius', 'ultimate-post-kit'),
1465	'type' => Controls_Manager::DIMENSIONS,
1466	'size_units' => ['px', '%'],
1467	'selectors' => [
1468	'{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
1469	],
1470	'condition' => [
1471	'advanced_dots_size' => 'yes'
1472	],
1473	]
1474	);
1475
1476	$this->add_responsive_control(
1477	'active_advanced_dots_align',
1478	[
1479	'label' => __('Alignment', 'ultimate-post-kit'),
1480	'type' => Controls_Manager::CHOOSE,
1481	'options' => [
1482	'flex-start' => [
1483	'title' => __('Top', 'ultimate-post-kit'),
1484	'icon' => 'eicon-v-align-top',
1485	],
1486	'center' => [
1487	'title' => __('Center', 'ultimate-post-kit'),
1488	'icon' => 'eicon-v-align-middle',
1489	],
1490	'flex-end' => [
1491	'title' => __('Bottom', 'ultimate-post-kit'),
1492	'icon' => 'eicon-v-align-bottom',
1493	],
1494	],
1495	'selectors' => [
1496	'{{WRAPPER}}' => '--ps-swiper-dots-align: {{VALUE}};',
1497	],
1498	'condition' => [
1499	'advanced_dots_size' => 'yes'
1500	],
1501	]
1502	);
1503
1504	$this->add_group_control(
1505	Group_Control_Box_Shadow::get_type(),
1506	[
1507	'name' => 'dots_active_box_shadow',
1508	'selector' => '{{WRAPPER}} .upk-crystal-slider .upk-pagination-wrap .swiper-pagination-bullet-active',
1509	]
1510	);
1511
1512	$this->end_controls_tab();
1513
1514	$this->end_controls_tabs();
1515
1516	$this->end_controls_section();
1517	}
1518
1519	/**
1520	* Main query render for this widget
1521	* @param $posts_per_page number item query limit
1522	*/
1523	public function query_posts($posts_per_page) {
1524
1525	$default = $this->getGroupControlQueryArgs();
1526	$args = [];
1527	if ($posts_per_page) {
1528	$args['posts_per_page'] = $posts_per_page;
1529	}
1530	$args = array_merge($default, $args);
1531	$this->_query = new WP_Query($args);
1532	}
1533
1534	public function render_image($image_id, $size) {
1535	$placeholder_image_src = Utils::get_placeholder_image_src();
1536
1537	$image_src = wp_get_attachment_image_src($image_id, $size);
1538
1539	if (!$image_src) {
1540	$image_src = $placeholder_image_src;
1541	} else {
1542	$image_src = $image_src[0];
1543	}
1544
1545	?>
1546
1547	<img class="upk-img swiper-lazy" src="<?php echo esc_url($image_src); ?>" alt="<?php echo esc_attr(get_the_title()); ?>">
1548
1549	<?php
1550	}
1551
1552	public function render_title() {
1553	$settings = $this->get_settings_for_display();
1554
1555	if (!$this->get_settings('show_title')) {
1556	return;
1557	}
1558
1559	$title = get_the_title();
1560	printf('<%1$s class="upk-title"><a href="%2$s" title="%4$s">%3$s</a></%1$s>', esc_attr(Utils::get_valid_html_tag($settings['title_tags'])), esc_url( get_permalink() ), esc_html( $title ), esc_attr( $title ));
1561	}
1562
1563	public function render_category() {
1564
1565	if (!$this->get_settings('show_category')) {
1566	return;
1567	}
1568	?>
1569	<div class="upk-category" data-swiper-parallax-x="-150" data-swiper-parallax-duration="1000">
1570	<?php echo wp_kses_post( upk_get_category($this->get_settings('posts_source')) ); ?>
1571	</div>
1572	<?php
1573	}
1574
1575	public function render_date() {
1576	$settings = $this->get_settings_for_display();
1577
1578
1579	if (!$this->get_settings('show_date')) {
1580	return;
1581	}
1582
1583	?>
1584	<div class="upk-date-and-time upk-flex upk-flex-middle">
1585	<div class="upk-date">
1586	<i class="upk-icon-calendar" aria-hidden="true"></i>
1587	<span>
1588	<?php if ($settings['human_diff_time'] == 'yes') {
1589	echo esc_html( ultimate_post_kit_post_time_diff( ( $settings['human_diff_time_short'] == 'yes' ) ? 'short' : '' ) );
1590	} else {
1591	echo get_the_date();
1592	} ?>
1593	</span>
1594
1595	</div>
1596	<?php if ($settings['show_time']) : ?>
1597	<div class="upk-post-time">
1598	<i class="upk-icon-clock" aria-hidden="true"></i>
1599	<?php echo esc_html( get_the_time() ); ?>
1600	</div>
1601	<?php endif; ?>
1602	</div>
1603
1604	<?php
1605	}
1606
1607	public function render_author() {
1608
1609	if (!$this->get_settings('show_author')) {
1610	return;
1611	}
1612	?>
1613	<div class="upk-author">
1614	<i class="upk-icon-user" aria-hidden="true"></i>
1615	<a href="<?php echo esc_url( get_author_posts_url(get_the_author_meta('ID')) ); ?>">
1616	<?php echo esc_html( get_the_author() ) ?>
1617	</a>
1618	</div>
1619	<?php
1620	}
1621
1622	public function render_header() {
1623	$id = 'upk-crystal-slider-' . $this->get_id();
1624	$settings = $this->get_settings_for_display();
1625
1626	$this->add_render_attribute('crystal-slider', 'id', $id);
1627	$this->add_render_attribute('crystal-slider', 'class', ['upk-crystal-slider']);
1628
1629	$this->add_render_attribute(
1630	[
1631	'crystal-slider' => [
1632	'data-settings' => [
1633	wp_json_encode(array_filter([
1634	"autoplay" => ("yes" == $settings["autoplay"]) ? ["delay" => $settings["autoplay_speed"]] : false,
1635	"loop" => ($settings["loop"] == "yes") ? true : false,
1636	"speed" => $settings["speed"]["size"],
1637	"effect" => 'slide',
1638	"lazy" => true,
1639	"parallax" => true,
1640	"grabCursor" => ($settings["grab_cursor"] === "yes") ? true : false,
1641	"pauseOnHover" => ("yes" == $settings["pauseonhover"]) ? true : false,
1642	"slidesPerView" => 1,
1643	"observer" => ($settings["observer"]) ? true : false,
1644	"observeParents" => ($settings["observer"]) ? true : false,
1645	"navigation" => [
1646	"nextEl" => "#" . $id . " .upk-navigation-next",
1647	"prevEl" => "#" . $id . " .upk-navigation-prev",
1648	],
1649	"pagination" => [
1650	"el" => "#" . $id . " .upk-pagination",
1651	"clickable" => "true",
1652	],
1653	"lazy" => [
1654	"loadPrevNext" => "true",
1655	],
1656	]))
1657	]
1658	]
1659	]
1660	);
1661
1662	$this->add_render_attribute('swiper', 'class', 'swiper-carousel swiper');
1663
1664	?>
1665	<div <?php $this->print_render_attribute_string('crystal-slider'); ?>>
1666	<div <?php $this->print_render_attribute_string('swiper'); ?>>
1667	<div class="swiper-wrapper">
1668	<?php
1669	}
1670
1671	public function render_footer() {
1672	$settings = $this->get_settings_for_display();
1673
1674	?>
1675	</div>
1676	<?php if ($settings['show_navigation']) : ?>
1677	<div class="upk-navigation-wrap">
1678	<div class="upk-navigation-prev">
1679	<i class="upk-icon-arrow-left-<?php echo esc_attr($settings['nav_arrows_icon']); ?>" aria-hidden="true"></i>
1680	</div>
1681	<div class="upk-navigation-next">
1682	<i class="upk-icon-arrow-right-<?php echo esc_attr($settings['nav_arrows_icon']); ?>" aria-hidden="true"></i>
1683	</div>
1684	</div>
1685	<?php endif; ?>
1686
1687	<?php if ($settings['show_pagination']) : ?>
1688	<div class="upk-pagination-wrap">
1689	<div class="upk-pagination"></div>
1690	</div>
1691	<?php endif; ?>
1692	</div>
1693	</div>
1694
1695	<?php
1696	}
1697
1698	public function render_post_grid_item($post_id, $image_size) {
1699	$settings = $this->get_settings_for_display();
1700
1701	$this->add_render_attribute('slider-item', 'class', 'upk-item swiper-slide', true);
1702
1703	?>
1704
1705	<div <?php $this->print_render_attribute_string('slider-item'); ?>>
1706	<div class="upk-img-wrap">
1707	<?php $this->render_image(get_post_thumbnail_id($post_id), $image_size); ?>
1708	</div>
1709	<div class="upk-content">
1710	<div class="bdt-inner-content" data-swiper-parallax-x="-250" data-swiper-parallax-duration="1000">
1711	<?php $this->render_category(); ?>
1712
1713	<div data-swiper-parallax-x="-250" data-swiper-parallax-duration="1200">
1714	<?php $this->render_title(substr($this->get_name(), 4)); ?>
1715	</div>
1716
1717	<?php if ($settings['show_author'] or $settings['show_date'] or $settings['show_reading_time']) : ?>
1718	<div class="upk-meta upk-flex upk-flex-middle" data-swiper-parallax-x="-300" data-swiper-parallax-duration="1400">
1719	<?php if ($settings['show_author']) : ?>
1720	<?php $this->render_author(); ?>
1721	<?php endif; ?>
1722	<?php if ($settings['show_date']) : ?>
1723	<div data-separator="<?php echo esc_attr($settings['meta_separator']); ?>">
1724	<?php $this->render_date(); ?>
1725	</div>
1726	<?php endif; ?>
1727	<?php if (_is_upk_pro_activated()) :
1728	if ('yes' === $settings['show_reading_time']) : ?>
1729	<div class="upk-reading-time" data-separator="<?php echo esc_attr($settings['meta_separator']); ?>">
1730	<?php echo esc_html( ultimate_post_kit_reading_time( get_the_content(), $settings['avg_reading_speed'], $settings['hide_seconds'] ?? 'no', $settings['hide_minutes'] ?? 'no' ) ); ?>
1731	</div>
1732	<?php endif; ?>
1733	<?php endif; ?>
1734	</div>
1735	<?php endif; ?>
1736
1737	<?php if ($settings['show_readmore'] === 'yes') : ?>
1738	<div class="upk-link-btn">
1739	<a href="<?php echo esc_url(get_permalink()); ?>">
1740	<i class="upk-icon-plus"></i>
1741	</a>
1742	</div>
1743	<?php endif; ?>
1744	</div>
1745	</div>
1746	</div>
1747	<?php
1748	}
1749
1750	public function render() {
1751	$settings = $this->get_settings_for_display();
1752
1753	$this->query_posts($settings['item_limit']['size']);
1754	$wp_query = $this->get_query();
1755
1756	if (!$wp_query->found_posts) {
1757	return;
1758	}
1759
1760	$this->render_header();
1761
1762	while ($wp_query->have_posts()) {
1763	$wp_query->the_post();
1764	$thumbnail_size = $settings['primary_thumbnail_size'];
1765
1766	$this->render_post_grid_item(get_the_ID(), $thumbnail_size);
1767	}
1768
1769	$this->render_footer();
1770
1771	wp_reset_postdata();
1772	}
1773	}
1774