PluginProbe
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets / 4.1.18
Ultimate Post Kit – Elementor Post Grid, Post Carousel, Post Slider & Blog Layout Widgets v4.1.18
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.1.18, at modules/pholox-slider/widgets/pholox-slider.php

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