PluginProbe
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets / 4.5.6
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets v4.5.6
4.5.6 4.5.5 4.5.4 4.2.1 4.2.2 4.2.3 4.5.0 4.5.2 4.5.3 4.2.0 4.1.18 4.1.17 4.1.16 4.1.15 4.1.14 4.1.13 4.1.12 4.1.11 4.1.10 4.1.9 4.1.8 4.0.9 4.1.0 4.1.1 4.1.2 All 148 releases
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.5.6, at modules/pholox-slider/widgets/pholox-slider.php

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