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

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

1,733 lines 43.9 KB

Raw Download Zip

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