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.0, at modules/pholox-slider/widgets/pholox-slider.php

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