PluginProbe
Ultimate Post Kit / trunk
Ultimate Post Kit vtrunk
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 4.1.3 4.1.4 4.1.5 All 145 releases
ultimate-post-kit / modules / timeline / widgets / timeline.php

timeline.php in Ultimate Post Kit trunk, at modules/timeline/widgets/timeline.php

1,186 lines 30.6 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\Timeline\Widgets;
4
5 use Elementor\Controls_Manager;
6 use Elementor\Group_Control_Border;
7 use Elementor\Group_Control_Box_Shadow;
8 use Elementor\Group_Control_Typography;
9 use Elementor\Group_Control_Text_Shadow;
10 use Elementor\Group_Control_Image_Size;
11 use Elementor\Group_Control_Background;
12 use UltimatePostKit\Utils;
13
14 use UltimatePostKit\Traits\Global_Widget_Controls;
15 use UltimatePostKit\Traits\Global_Widget_Functions;
16 use UltimatePostKit\Includes\Controls\GroupQuery\Group_Control_Query;
17 use WP_Query;
18
19 if ( ! defined( 'ABSPATH' ) ) {
20 exit;
21 } // Exit if accessed directly
22
23 class Timeline extends Group_Control_Query {
24
25 use Global_Widget_Controls;
26 use Global_Widget_Functions;
27
28 private $_query = null;
29
30 public function get_name() {
31 return 'upk-timeline';
32 }
33
34 public function get_title() {
35 return BDTUPK . esc_html__( 'Oras Timeline', 'ultimate-post-kit' );
36 }
37
38 public function get_icon() {
39 return 'upk-widget-icon upk-icon-timeline';
40 }
41
42 public function get_categories() {
43 return [ 'ultimate-post-kit' ];
44 }
45
46 public function get_keywords() {
47 return [ 'post', 'grid', 'blog', 'recent', 'news', 'alter', 'oras' ];
48 }
49
50 public function get_style_depends() {
51 if ( $this->upk_is_edit_mode() ) {
52 return [ 'upk-all-styles' ];
53 } else {
54 return [ 'upk-font', 'upk-timeline' ];
55 }
56 }
57
58 public function get_custom_help_url() {
59 return 'https://youtu.be/2iYuNgP4K0A';
60 }
61
62 public function get_query() {
63 return $this->_query;
64 }
65
66 public function has_widget_inner_wrapper(): bool {
67 return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
68 }
69
70
71 protected function register_controls() {
72 $this->start_controls_section(
73 'section_content_layout',
74 [
75 'label' => esc_html__( 'Layout', 'ultimate-post-kit' ),
76 ]
77 );
78
79 $this->add_control(
80 'show_image',
81 [
82 'label' => esc_html__( 'Show Image', 'ultimate-post-kit' ),
83 'type' => Controls_Manager::SWITCHER,
84 'default' => 'yes',
85 ]
86 );
87
88 //Global Title Controls
89 $this->register_title_controls();
90 $this->register_text_controls();
91
92 $this->add_control(
93 'show_author',
94 [
95 'label' => esc_html__( 'Show Author', 'ultimate-post-kit' ),
96 'type' => Controls_Manager::SWITCHER,
97 'default' => 'yes',
98 ]
99 );
100
101 $this->add_control(
102 'show_date',
103 [
104 'label' => esc_html__( 'Show Date', 'ultimate-post-kit' ),
105 'type' => Controls_Manager::SWITCHER,
106 'default' => 'yes',
107 'prefix_class' => 'upk-date-hide--',
108 ]
109 );
110
111 $this->add_control(
112 'day_month_format',
113 [
114 'label' => esc_html__( 'Day & Month Format', 'ultimate-post-kit' ) . BDTUPK_PC,
115 'type' => Controls_Manager::TEXT,
116 'placeholder' => 'm/d',
117 'condition' => [
118 'show_date' => 'yes',
119 ],
120 'classes' => BDTUPK_IS_PC
121 ]
122 );
123 $this->add_control(
124 'year_format',
125 [
126 'label' => esc_html__( 'Year Format', 'ultimate-post-kit' ) . BDTUPK_PC,
127 'type' => Controls_Manager::TEXT,
128 'placeholder' => 'Y',
129 'condition' => [
130 'show_date' => 'yes',
131 ],
132 'classes' => BDTUPK_IS_PC
133 ]
134 );
135
136 $this->add_control(
137 'show_inline_date',
138 [
139 'label' => esc_html__( 'Show Inline Date', 'ultimate-post-kit' ),
140 'type' => Controls_Manager::SWITCHER,
141 'default' => 'yes',
142 'condition' => [
143 'show_date' => '',
144 ],
145 ]
146 );
147
148 $this->add_control(
149 'human_diff_time',
150 [
151 'label' => esc_html__( 'Human Different Time', 'ultimate-post-kit' ),
152 'type' => Controls_Manager::SWITCHER,
153 'condition' => [
154 'show_inline_date' => 'yes',
155 'show_date' => ''
156 ]
157 ]
158 );
159
160 $this->add_control(
161 'human_diff_time_short',
162 [
163 'label' => esc_html__( 'Time Short Format', 'ultimate-post-kit' ),
164 'description' => esc_html__( 'This will work for Hours, Minute and Seconds', 'ultimate-post-kit' ),
165 'type' => Controls_Manager::SWITCHER,
166 'condition' => [
167 'human_diff_time' => 'yes',
168 'show_inline_date' => 'yes'
169 ]
170 ]
171 );
172
173 $this->add_control(
174 'show_time',
175 [
176 'label' => esc_html__( 'Show Time', 'ultimate-post-kit' ),
177 'type' => Controls_Manager::SWITCHER,
178 'condition' => [
179 'human_diff_time' => '',
180 'show_inline_date' => 'yes',
181 'show_date' => ''
182 ]
183 ]
184 );
185
186 $this->add_control(
187 'show_category',
188 [
189 'label' => esc_html__( 'Show Category', 'ultimate-post-kit' ),
190 'type' => Controls_Manager::SWITCHER,
191 'default' => 'yes',
192 ]
193 );
194
195 $this->add_control(
196 'show_comments',
197 [
198 'label' => esc_html__( 'Show Comments', 'ultimate-post-kit' ),
199 'type' => Controls_Manager::SWITCHER,
200 'default' => 'yes',
201 ]
202 );
203
204 $this->add_control(
205 'meta_separator',
206 [
207 'label' => __( 'Separator', 'ultimate-post-kit' ),
208 'type' => Controls_Manager::TEXT,
209 'default' => '|',
210 'label_block' => false,
211 ]
212 );
213
214 $this->add_group_control(
215 Group_Control_Image_Size::get_type(),
216 [
217 'name' => 'primary_thumbnail',
218 // phpcs:ignore WordPressVIPMinimum.Performance.WPQueryParams.PostNotIn_exclude -- Elementor widget query built from user-configured controls; expected behaviour.
219 'exclude' => [ 'custom' ],
220 'default' => 'medium',
221 ]
222 );
223
224 $this->add_control(
225 'show_pagination',
226 [
227 'label' => esc_html__( 'Pagination', 'ultimate-post-kit' ),
228 'type' => Controls_Manager::SWITCHER,
229 'separator' => 'before'
230 ]
231 );
232
233 $this->add_control(
234 'global_link',
235 [
236 'label' => __( 'Item Wrapper Link', 'ultimate-post-kit' ),
237 'type' => Controls_Manager::SWITCHER,
238 'prefix_class' => 'upk-global-link-',
239 'description' => __( 'Be aware! When Item Wrapper Link activated then title link and read more link will not work', 'ultimate-post-kit' ),
240 ]
241 );
242
243 $this->end_controls_section();
244
245 // Query Settings
246 $this->start_controls_section(
247 'section_post_query_builder',
248 [
249 'label' => __( 'Query', 'ultimate-post-kit' ) . BDTUPK_NC,
250 'tab' => Controls_Manager::TAB_CONTENT,
251 ]
252 );
253
254 $this->add_control(
255 'item_limit',
256 [
257 'label' => esc_html__( 'Item Limit', 'ultimate-post-kit' ),
258 'type' => Controls_Manager::SLIDER,
259 'range' => [
260 'px' => [
261 'min' => 1,
262 'max' => 20,
263 ],
264 ],
265 'default' => [
266 'size' => 6,
267 ],
268 'condition' => [
269 'posts_source!' => 'current_query',
270 ]
271 ]
272 );
273
274 $this->register_query_builder_controls();
275
276 $this->end_controls_section();
277
278 //Style
279 $this->start_controls_section(
280 'upk_section_style',
281 [
282 'label' => esc_html__( 'Items', 'ultimate-post-kit' ),
283 'tab' => Controls_Manager::TAB_STYLE,
284 ]
285 );
286
287 $this->add_responsive_control(
288 'item_padding',
289 [
290 'label' => esc_html__( 'Padding', 'ultimate-post-kit' ),
291 'type' => Controls_Manager::SLIDER,
292 'range' => [
293 'px' => [
294 'min' => 20,
295 'max' => 200,
296 ],
297 ],
298 'selectors' => [
299 '{{WRAPPER}} .upk-timeline .upk-item:nth-child(2n+1) .upk-image-and-content-wrapper' => 'padding: {{SIZE}}px {{SIZE}}px {{SIZE}}px 0;',
300 '{{WRAPPER}} .upk-timeline .upk-item:nth-child(2n+2) .upk-image-and-content-wrapper' => 'padding: {{SIZE}}px 0 {{SIZE}}px {{SIZE}}px;',
301 ],
302 ]
303 );
304
305 $this->add_control(
306 'item_line_heading',
307 [
308 'label' => esc_html__( 'Line', 'ultimate-post-kit' ),
309 'type' => Controls_Manager::HEADING,
310 'separator' => 'before'
311 ]
312 );
313
314 $this->add_control(
315 'item_line_color',
316 [
317 'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
318 'type' => Controls_Manager::COLOR,
319 'selectors' => [
320 '{{WRAPPER}}' => '--upk-line-color: {{VALUE}};'
321 ],
322 ]
323 );
324
325 $this->add_responsive_control(
326 'item_border_width',
327 [
328 'label' => esc_html__( 'Border Width', 'ultimate-post-kit' ),
329 'type' => Controls_Manager::SLIDER,
330 'range' => [
331 'px' => [
332 'min' => 0,
333 'max' => 50,
334 'step' => 2
335 ],
336 ],
337 'selectors' => [
338 '{{WRAPPER}}' => '--upk-border-width: {{SIZE}}px;'
339 ],
340 ]
341 );
342
343 $this->add_responsive_control(
344 'item_border_radius',
345 [
346 'label' => esc_html__( 'Border Radius', 'ultimate-post-kit' ),
347 'type' => Controls_Manager::SLIDER,
348 'range' => [
349 'px' => [
350 'min' => 0,
351 'max' => 500,
352 ],
353 ],
354 'selectors' => [
355 '{{WRAPPER}} .upk-timeline .upk-item .upk-line-right' => 'border-radius: 0 {{SIZE}}px {{SIZE}}px 0;',
356 '{{WRAPPER}} .upk-timeline .upk-item .upk-line-left' => 'border-radius: {{SIZE}}px 0 0 {{SIZE}}px',
357 ],
358 ]
359 );
360
361 $this->add_control(
362 'item_start_end_heading',
363 [
364 'label' => esc_html__( 'Start/End/Date', 'ultimate-post-kit' ),
365 'type' => Controls_Manager::HEADING,
366 'separator' => 'before'
367 ]
368 );
369
370 $this->add_control(
371 'item_start_end_color',
372 [
373 'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
374 'type' => Controls_Manager::COLOR,
375 'selectors' => [
376 '{{WRAPPER}} .upk-timeline .upk-item .upk-start-end-wrap, {{WRAPPER}} .upk-timeline .upk-item .upk-date-wrapper' => 'color: {{VALUE}};'
377 ],
378 ]
379 );
380
381 $this->add_control(
382 'item_start_end_bg_color',
383 [
384 'label' => esc_html__( 'Background', 'ultimate-post-kit' ),
385 'type' => Controls_Manager::COLOR,
386 'selectors' => [
387 '{{WRAPPER}} .upk-timeline .upk-item .upk-start-end-wrap, {{WRAPPER}} .upk-timeline .upk-item .upk-date-wrapper' => 'background: {{VALUE}};'
388 ],
389 ]
390 );
391
392 $this->add_responsive_control(
393 'item_start_end_border_radius',
394 [
395 'label' => esc_html__( 'Border Radius', 'ultimate-post-kit' ),
396 'type' => Controls_Manager::DIMENSIONS,
397 'size_units' => [ 'px', '%' ],
398 'selectors' => [
399 '{{WRAPPER}} .upk-timeline .upk-item .upk-start-end-wrap, {{WRAPPER}} .upk-timeline .upk-item .upk-date-wrapper' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
400 ],
401 ]
402 );
403
404 $this->end_controls_section();
405
406 $this->start_controls_section(
407 'section_style_image',
408 [
409 'label' => esc_html__( 'Image', 'ultimate-post-kit' ),
410 'tab' => Controls_Manager::TAB_STYLE,
411 'condition' => [
412 'show_image' => 'yes',
413 ],
414 ]
415 );
416
417 $this->add_group_control(
418 Group_Control_Border::get_type(),
419 [
420 'name' => 'item_image_border',
421 'label' => __( 'Border', 'ultimate-post-kit' ),
422 'fields_options' => [
423 'border' => [
424 'default' => 'solid',
425 ],
426 'width' => [
427 'default' => [
428 'top' => '10',
429 'right' => '10',
430 'bottom' => '10',
431 'left' => '10',
432 'isLinked' => false,
433 ],
434 ],
435 'color' => [
436 'default' => '#e1e7f0',
437 ],
438 ],
439 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-image-wrapper .upk-img',
440 ]
441 );
442
443 $this->add_responsive_control(
444 'item_image_border_radius_odd',
445 [
446 'label' => esc_html__( 'Odd Border Radius', 'ultimate-post-kit' ),
447 'type' => Controls_Manager::DIMENSIONS,
448 'size_units' => [ 'px', '%' ],
449 'selectors' => [
450 '{{WRAPPER}} .upk-timeline .upk-item:nth-child(2n+1) .upk-image-wrapper .upk-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
451 ],
452 ]
453 );
454
455 $this->add_responsive_control(
456 'item_image_border_radius_even',
457 [
458 'label' => esc_html__( 'Even Border Radius', 'ultimate-post-kit' ),
459 'type' => Controls_Manager::DIMENSIONS,
460 'size_units' => [ 'px', '%' ],
461 'selectors' => [
462 '{{WRAPPER}} .upk-timeline .upk-item:nth-child(2n+2) .upk-image-wrapper .upk-img' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
463 ],
464 ]
465 );
466
467 $this->add_responsive_control(
468 'item_image_padding',
469 [
470 'label' => esc_html__( 'Padding', 'ultimate-post-kit' ),
471 'type' => Controls_Manager::DIMENSIONS,
472 'size_units' => [ 'px', 'em', '%' ],
473 'selectors' => [
474 '{{WRAPPER}} .upk-timeline .upk-item .upk-image-wrapper .upk-img' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
475 ],
476 ]
477 );
478
479 $this->add_group_control(
480 Group_Control_Box_Shadow::get_type(),
481 [
482 'name' => 'item_image_shadow',
483 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-image-wrapper .upk-img',
484 ]
485 );
486
487 $this->add_responsive_control(
488 'image_size',
489 [
490 'label' => esc_html__( 'Size', 'ultimate-post-kit' ),
491 'type' => Controls_Manager::SLIDER,
492 'range' => [
493 'px' => [
494 'min' => 200,
495 'max' => 600,
496 ],
497 ],
498 'selectors' => [
499 '{{WRAPPER}}' => '--upk-image-width: {{SIZE}}px;'
500 ],
501 ]
502 );
503
504 $this->add_responsive_control(
505 'image_spacing',
506 [
507 'label' => esc_html__( 'Spacing', 'ultimate-post-kit' ),
508 'type' => Controls_Manager::SLIDER,
509 'selectors' => [
510 '{{WRAPPER}}' => '--upk-image-spacing: {{SIZE}}px;'
511 ],
512 ]
513 );
514
515 $this->end_controls_section();
516
517 $this->start_controls_section(
518 'section_style_title',
519 [
520 'label' => esc_html__( 'Title', 'ultimate-post-kit' ),
521 'tab' => Controls_Manager::TAB_STYLE,
522 'condition' => [
523 'show_title' => 'yes',
524 ],
525 ]
526 );
527
528 $this->add_control(
529 'title_style',
530 [
531 'label' => esc_html__( 'Style', 'ultimate-post-kit' ),
532 'type' => Controls_Manager::SELECT,
533 'default' => 'underline',
534 'options' => [
535 'underline' => esc_html__( 'Underline', 'ultimate-post-kit' ),
536 'middle-underline' => esc_html__( 'Middle Underline', 'ultimate-post-kit' ),
537 'overline' => esc_html__( 'Overline', 'ultimate-post-kit' ),
538 'middle-overline' => esc_html__( 'Middle Overline', 'ultimate-post-kit' ),
539 ],
540 ]
541 );
542
543 $this->add_control(
544 'title_color',
545 [
546 'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
547 'type' => Controls_Manager::COLOR,
548 'selectors' => [
549 '{{WRAPPER}} .upk-timeline .upk-item .upk-title a' => 'color: {{VALUE}};',
550 ],
551 ]
552 );
553
554 $this->add_control(
555 'title_hover_color',
556 [
557 'label' => esc_html__( 'Hover Color', 'ultimate-post-kit' ),
558 'type' => Controls_Manager::COLOR,
559 'selectors' => [
560 '{{WRAPPER}} .upk-timeline .upk-item .upk-title a:hover' => 'color: {{VALUE}};',
561 ],
562 ]
563 );
564
565 $this->add_group_control(
566 Group_Control_Typography::get_type(),
567 [
568 'name' => 'title_typography',
569 'label' => esc_html__( 'Typography', 'ultimate-post-kit' ),
570 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-title',
571 ]
572 );
573
574 $this->add_group_control(
575 Group_Control_Text_Shadow::get_type(),
576 [
577 'name' => 'title_text_shadow',
578 'label' => __( 'Text Shadow', 'ultimate-post-kit' ),
579 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-title',
580 ]
581 );
582
583 $this->add_responsive_control(
584 'title_spacing',
585 [
586 'label' => esc_html__( 'Spacing', 'ultimate-post-kit' ),
587 'type' => Controls_Manager::SLIDER,
588 'range' => [
589 'px' => [
590 'min' => 0,
591 'max' => 50,
592 ],
593 ],
594 'selectors' => [
595 '{{WRAPPER}} .upk-timeline .upk-item .upk-title' => 'padding-bottom: {{SIZE}}{{UNIT}};',
596 ],
597 ]
598 );
599
600 $this->end_controls_section();
601
602 $this->start_controls_section(
603 'section_style_text',
604 [
605 'label' => esc_html__( 'Text', 'ultimate-post-kit' ),
606 'tab' => Controls_Manager::TAB_STYLE,
607 'condition' => [
608 'show_excerpt' => 'yes',
609 ],
610 ]
611 );
612
613 $this->add_control(
614 'text_color',
615 [
616 'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
617 'type' => Controls_Manager::COLOR,
618 'selectors' => [
619 '{{WRAPPER}} .upk-timeline .upk-item .upk-text' => 'color: {{VALUE}};',
620 ],
621 ]
622 );
623
624 $this->add_group_control(
625 Group_Control_Typography::get_type(),
626 [
627 'name' => 'text_typography',
628 'label' => esc_html__( 'Typography', 'ultimate-post-kit' ),
629 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-text',
630 ]
631 );
632
633 $this->add_responsive_control(
634 'text_margin',
635 [
636 'label' => __( 'Margin', 'ultimate-post-kit' ),
637 'type' => Controls_Manager::DIMENSIONS,
638 'size_units' => [ 'px', 'em', '%' ],
639 'selectors' => [
640 '{{WRAPPER}} .upk-timeline .upk-item .upk-text' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
641 ]
642 ]
643 );
644
645 $this->end_controls_section();
646
647 $this->start_controls_section(
648 'section_style_meta',
649 [
650 'label' => esc_html__( 'Meta', 'ultimate-post-kit' ),
651 'tab' => Controls_Manager::TAB_STYLE,
652 'conditions' => [
653 'relation' => 'or',
654 'terms' => [
655 [
656 'name' => 'show_author',
657 'value' => 'yes'
658 ],
659 [
660 'name' => 'show_comments',
661 'value' => 'yes'
662 ]
663 ]
664 ],
665 ]
666 );
667
668 $this->add_control(
669 'meta_color',
670 [
671 'label' => esc_html__( 'Text Color', 'ultimate-post-kit' ),
672 'type' => Controls_Manager::COLOR,
673 'selectors' => [
674 '{{WRAPPER}} .upk-timeline .upk-item .upk-meta, {{WRAPPER}} .upk-timeline .upk-item .upk-meta .upk-author-name-wrap .upk-author-name' => 'color: {{VALUE}};',
675 ],
676 ]
677 );
678
679 $this->add_control(
680 'meta_hover_color',
681 [
682 'label' => esc_html__( 'Text Hover Color', 'ultimate-post-kit' ),
683 'type' => Controls_Manager::COLOR,
684 'selectors' => [
685 '{{WRAPPER}} .upk-timeline .upk-item .upk-meta .upk-author-name-wrap .upk-author-name:hover' => 'color: {{VALUE}};',
686 ],
687 ]
688 );
689
690 $this->add_group_control(
691 Group_Control_Typography::get_type(),
692 [
693 'name' => 'meta_typography',
694 'label' => esc_html__( 'Typography', 'ultimate-post-kit' ),
695 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-meta',
696 ]
697 );
698
699 $this->add_responsive_control(
700 'meta_spacing',
701 [
702 'label' => esc_html__( 'Spacing', 'ultimate-post-kit' ),
703 'type' => Controls_Manager::SLIDER,
704 'range' => [
705 'px' => [
706 'min' => 0,
707 'max' => 50,
708 ],
709 ],
710 'selectors' => [
711 '{{WRAPPER}} .upk-timeline .upk-item .upk-meta .upk-separator' => 'margin: 0 {{SIZE}}{{UNIT}};',
712 ],
713 ]
714 );
715
716 $this->end_controls_section();
717
718 $this->start_controls_section(
719 'section_style_date',
720 [
721 'label' => esc_html__( 'Date', 'ultimate-post-kit' ),
722 'tab' => Controls_Manager::TAB_STYLE,
723 'conditions' => [
724 'relation' => 'or',
725 'terms' => [
726 [
727 'name' => 'show_date',
728 'value' => 'yes'
729 ],
730 [
731 'name' => 'show_inline_date',
732 'value' => 'yes'
733 ]
734 ]
735 ],
736 ]
737 );
738
739 $this->add_control(
740 'date_color',
741 [
742 'label' => esc_html__( 'Text Color', 'ultimate-post-kit' ),
743 'type' => Controls_Manager::COLOR,
744 'selectors' => [
745 '{{WRAPPER}} .upk-timeline .upk-item .upk-responsive-date' => 'color: {{VALUE}};',
746 ],
747 ]
748 );
749
750 $this->add_group_control(
751 Group_Control_Typography::get_type(),
752 [
753 'name' => 'date_typography',
754 'label' => esc_html__( 'Typography', 'ultimate-post-kit' ),
755 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-responsive-date',
756 ]
757 );
758
759 $this->add_responsive_control(
760 'date_space_between',
761 [
762 'label' => esc_html__( 'Space Between', 'ultimate-post-kit' ),
763 'type' => Controls_Manager::SLIDER,
764 'range' => [
765 'px' => [
766 'min' => 0,
767 'max' => 50,
768 ],
769 ],
770 'selectors' => [
771 '{{WRAPPER}} .upk-timeline .upk-item .upk-responsive-date .upk-date' => 'padding-left: {{SIZE}}{{UNIT}};',
772 ],
773 ]
774 );
775
776 $this->add_responsive_control(
777 'date_margin',
778 [
779 'label' => __( 'Margin', 'ultimate-post-kit' ),
780 'type' => Controls_Manager::DIMENSIONS,
781 'size_units' => [ 'px', 'em', '%' ],
782 'selectors' => [
783 '{{WRAPPER}} .upk-timeline .upk-item .upk-responsive-date' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
784 ]
785 ]
786 );
787
788 $this->end_controls_section();
789
790 $this->start_controls_section(
791 'section_style_category',
792 [
793 'label' => esc_html__( 'Category', 'ultimate-post-kit' ),
794 'tab' => Controls_Manager::TAB_STYLE,
795 'condition' => [
796 'show_category' => 'yes',
797 ],
798 ]
799 );
800
801 $this->add_responsive_control(
802 'category_spacing',
803 [
804 'label' => esc_html__( 'Spacing', 'ultimate-post-kit' ),
805 'type' => Controls_Manager::SLIDER,
806 'range' => [
807 'px' => [
808 'min' => 0,
809 'max' => 50,
810 ],
811 ],
812 'selectors' => [
813 '{{WRAPPER}} .upk-timeline .upk-item .upk-category' => 'margin-bottom: {{SIZE}}{{UNIT}};',
814 ],
815 ]
816 );
817
818 $this->start_controls_tabs( 'tabs_category_style' );
819
820 $this->start_controls_tab(
821 'tab_category_normal',
822 [
823 'label' => esc_html__( 'Normal', 'ultimate-post-kit' ),
824 ]
825 );
826
827 $this->add_control(
828 'category_color',
829 [
830 'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
831 'type' => Controls_Manager::COLOR,
832 'selectors' => [
833 '{{WRAPPER}} .upk-timeline .upk-item .upk-category a' => 'color: {{VALUE}};',
834 ],
835 ]
836 );
837
838 $this->add_group_control(
839 Group_Control_Background::get_type(),
840 [
841 'name' => 'category_background',
842 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-category a',
843 ]
844 );
845
846 $this->add_group_control(
847 Group_Control_Border::get_type(),
848 [
849 'name' => 'category_border',
850 'label' => __( 'Border', 'ultimate-post-kit' ),
851 'fields_options' => [
852 'border' => [
853 'default' => 'solid',
854 ],
855 'width' => [
856 'default' => [
857 'top' => '1',
858 'right' => '1',
859 'bottom' => '1',
860 'left' => '1',
861 'isLinked' => false,
862 ],
863 ],
864 'color' => [
865 'default' => '#EF233C',
866 ],
867 ],
868 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-category a',
869 ]
870 );
871
872 $this->add_responsive_control(
873 'category_border_radius',
874 [
875 'label' => esc_html__( 'Border Radius', 'ultimate-post-kit' ),
876 'type' => Controls_Manager::DIMENSIONS,
877 'size_units' => [ 'px', '%' ],
878 'selectors' => [
879 '{{WRAPPER}} .upk-timeline .upk-item .upk-category a' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
880 ],
881 ]
882 );
883
884 $this->add_responsive_control(
885 'category_padding',
886 [
887 'label' => esc_html__( 'Padding', 'ultimate-post-kit' ),
888 'type' => Controls_Manager::DIMENSIONS,
889 'size_units' => [ 'px', 'em', '%' ],
890 'selectors' => [
891 '{{WRAPPER}} .upk-timeline .upk-item .upk-category a' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
892 ],
893 ]
894 );
895
896 $this->add_responsive_control(
897 'category_spacing_between',
898 [
899 'label' => esc_html__( 'Space Between', 'ultimate-post-kit' ),
900 'type' => Controls_Manager::SLIDER,
901 'range' => [
902 'px' => [
903 'min' => 0,
904 'max' => 50,
905 ],
906 ],
907 'selectors' => [
908 '{{WRAPPER}} .upk-timeline .upk-item .upk-category a+a' => 'margin-left: {{SIZE}}{{UNIT}};',
909 ],
910 ]
911 );
912
913
914 $this->add_group_control(
915 Group_Control_Box_Shadow::get_type(),
916 [
917 'name' => 'category_shadow',
918 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-category a',
919 ]
920 );
921
922 $this->add_group_control(
923 Group_Control_Typography::get_type(),
924 [
925 'name' => 'category_typography',
926 'label' => esc_html__( 'Typography', 'ultimate-post-kit' ),
927 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-category a',
928 ]
929 );
930
931 $this->end_controls_tab();
932
933 $this->start_controls_tab(
934 'tab_category_hover',
935 [
936 'label' => esc_html__( 'Hover', 'ultimate-post-kit' ),
937 ]
938 );
939
940 $this->add_control(
941 'category_hover_color',
942 [
943 'label' => esc_html__( 'Color', 'ultimate-post-kit' ),
944 'type' => Controls_Manager::COLOR,
945 'selectors' => [
946 '{{WRAPPER}} .upk-timeline .upk-item .upk-category a:hover' => 'color: {{VALUE}};',
947 ],
948 ]
949 );
950
951 $this->add_group_control(
952 Group_Control_Background::get_type(),
953 [
954 'name' => 'category_hover_background',
955 'selector' => '{{WRAPPER}} .upk-timeline .upk-item .upk-category a:hover',
956 ]
957 );
958
959 $this->add_control(
960 'category_hover_border_color',
961 [
962 'label' => esc_html__( 'Border Color', 'ultimate-post-kit' ),
963 'type' => Controls_Manager::COLOR,
964 'condition' => [
965 'category_border_border!' => '',
966 ],
967 'selectors' => [
968 '{{WRAPPER}} .upk-timeline .upk-item .upk-category a:hover' => 'border-color: {{VALUE}};',
969 ],
970 ]
971 );
972
973 $this->end_controls_tab();
974
975 $this->end_controls_tabs();
976
977 $this->end_controls_section();
978
979 //Global Pagination Controls
980 $this->register_pagination_controls();
981 }
982
983 /**
984 * Get post query builder arguments
985 */
986 public function query_posts( $posts_per_page ) {
987 $settings = $this->get_settings();
988 $posts_per_page = isset( $posts_per_page ) ? (int) $posts_per_page : 0;
989 $args = $this->getGroupControlQueryArgs();
990 $is_current_query = ( ! empty( $settings['posts_source'] ) && $settings['posts_source'] === 'current_query' );
991
992 if ( $is_current_query ) {
993 unset( $args['offset'] );
994 unset( $args['no_found_rows'] );
995 $posts_per_page = 0;
996 }
997
998 if ( $posts_per_page > 0 ) {
999 $args['posts_per_page'] = $posts_per_page;
1000 } else {
1001 $args['posts_per_page'] = (int) get_option( 'posts_per_page', 10 );
1002 }
1003
1004 if ( $settings['show_pagination'] ) {
1005 $args['paged'] = max( 1, (int) get_query_var( 'paged' ), (int) get_query_var( 'page' ) );
1006 }
1007
1008 $this->_query = new \WP_Query( $args );
1009 }
1010
1011 public function render_author() {
1012
1013 if ( ! $this->get_settings( 'show_author' ) ) {
1014 return;
1015 }
1016 ?>
1017 <div class="upk-author-name-wrap">
1018 <span class="upk-by"><?php echo esc_html_x( 'by', 'Frontend', 'ultimate-post-kit' ) ?></span>
1019 <a class="upk-author-name" href="<?php echo esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ) ?>">
1020 <?php echo esc_html( get_the_author() ); ?>
1021 </a>
1022 </div>
1023 <?php
1024 }
1025
1026 public function render_comments( $id = 0 ) {
1027
1028 if ( ! $this->get_settings( 'show_comments' ) ) {
1029 return;
1030 }
1031 ?>
1032
1033 <div class="upk-comments">
1034 <?php echo esc_html( $this->upk_get_formatted_comments_count( $id ) ); ?>
1035 </div>
1036
1037 <?php
1038 }
1039
1040 public function render_date() {
1041 $settings = $this->get_settings_for_display();
1042
1043 if ( ! $this->get_settings( 'show_inline_date' ) ) {
1044 return;
1045 }
1046
1047 if ( $settings['human_diff_time'] == 'yes' ) {
1048 echo esc_html( ultimate_post_kit_post_time_diff( ( $settings['human_diff_time_short'] == 'yes' ) ? 'short' : '' ) );
1049 } else {
1050 echo esc_html( get_the_date() );
1051 }
1052 }
1053
1054 public function render_post_grid_item( $post_id, $image_size, $excerpt_length, $class ) {
1055 $settings = $this->get_settings_for_display();
1056
1057 if ( 'yes' == $settings['global_link'] ) {
1058
1059 $this->add_render_attribute( 'timeline-item', 'onclick', "window.open('" . esc_url( get_permalink() ) . "', '_self')", true );
1060 }
1061 $this->add_render_attribute( 'timeline-item', 'class', 'upk-item', true );
1062 $this->add_render_attribute( 'timeline-item', 'class', $class );
1063
1064 ?>
1065
1066 <div <?php $this->print_render_attribute_string( 'timeline-item' ); ?>>
1067 <div class="upk-item-box">
1068 <span class="upk-start-end-wrap">
1069 <span class="upk-start"><?php echo esc_html__( 'start', 'ultimate-post-kit' ) ?></span>
1070 <span class="upk-end"><?php echo esc_html__( 'end', 'ultimate-post-kit' ) ?></span>
1071 </span>
1072 <?php if ( _is_upk_pro_activated() ) : ?>
1073 <div class="upk-date-wrapper">
1074 <div class="upk-date-inner">
1075 <?php
1076 $day_month_format = isset( $settings['day_month_format'] ) && ! empty( $settings['day_month_format'] ) ? $settings['day_month_format'] : 'm/d';
1077 $year_format = isset( $settings['year_format'] ) && ! empty( $settings['year_format'] ) ? $settings['year_format'] : 'Y';
1078 ?>
1079 <span class="upk-month"><?php echo esc_html( get_the_date( $day_month_format ) ); ?></span>
1080 <span class="upk-year"><?php echo esc_html( get_the_date( $year_format ) ); ?></span>
1081 </div>
1082 </div>
1083 <?php else : ?>
1084 <div class="upk-date-wrapper">
1085 <div class="upk-date-inner">
1086 <span class="upk-month"><?php echo esc_html( get_the_date( 'm/d' ) ); ?></span>
1087 <span class="upk-year"><?php echo esc_html( get_the_date( 'Y' ) ); ?></span>
1088 </div>
1089 </div>
1090 <?php endif; ?>
1091
1092 <div class="upk-image-and-content-wrapper">
1093 <?php if( 'yes' === $settings['show_image'] ) : ?>
1094 <div class="upk-image-wrapper">
1095 <?php $this->render_image( get_post_thumbnail_id( $post_id ), $image_size ); ?>
1096 </div>
1097 <?php endif; ?>
1098 <div class="upk-content-wrap">
1099
1100 <?php $this->render_category(); ?>
1101 <?php $this->render_title( substr( $this->get_name(), 4 ) ); ?>
1102
1103 <?php if ( $settings['show_date'] == 'yes' or $settings['show_inline_date'] == 'yes' ) : ?>
1104 <div class="upk-responsive-date">
1105 <span class="upk-publish"><?php echo esc_html__( 'publish on', 'ultimate-post-kit' ) ?></span>
1106 <span class="upk-date">
1107 <?php $this->render_date(); ?>
1108 </span>
1109 <?php if ( $settings['show_time'] ) : ?>
1110 <span class="upk-post-time">
1111 <i class="upk-icon-clock" aria-hidden="true"></i>
1112 <?php echo esc_html( get_the_time() ); ?>
1113 </span>
1114 <?php endif; ?>
1115 </div>
1116 <?php endif; ?>
1117
1118 <?php $this->render_excerpt( $excerpt_length ); ?>
1119
1120 <div class="upk-meta">
1121 <?php $this->render_author(); ?>
1122 <?php if( 'yes' === $settings['show_comments'] && 'yes' === $settings['show_author'] ) : ?>
1123 <span class="upk-separator"><?php echo esc_html( $settings['meta_separator'] ); ?></span>
1124 <?php endif; ?>
1125 <?php $this->render_comments( $post_id ); ?>
1126 </div>
1127 </div>
1128 </div>
1129
1130 <div class="upk-line-right"></div>
1131 <div class="upk-line-left"></div>
1132 </div>
1133 </div>
1134 <?php
1135 }
1136
1137 protected function render() {
1138 $settings = $this->get_settings_for_display();
1139
1140 $limit = $settings['item_limit']['size'];
1141
1142 $this->query_posts( $limit );
1143
1144 $wp_query = $this->get_query();
1145
1146 if ( ! $wp_query->found_posts ) {
1147 return;
1148 }
1149
1150 ?>
1151
1152 <div class="upk-timeline">
1153 <div class="upk-wrapper">
1154
1155 <?php
1156
1157 while ( $wp_query->have_posts() ) :
1158 $limit--;
1159 $class = '';
1160 $wp_query->the_post();
1161 $thumbnail_size = $settings['primary_thumbnail_size'];
1162
1163 if ( $limit == 0 ) {
1164 $class = 'upk-last-even-item upk-last-odd-item';
1165 }
1166
1167 ?>
1168
1169 <?php $this->render_post_grid_item( get_the_ID(), $thumbnail_size, $settings['excerpt_length'], $class ); ?>
1170
1171 <?php endwhile; ?>
1172 </div>
1173 </div>
1174
1175 <?php
1176
1177 if ( $settings['show_pagination'] ) { ?>
1178 <div class="ep-pagination">
1179 <?php ultimate_post_kit_post_pagination( $wp_query, $this->get_id() ); ?>
1180 </div>
1181 <?php
1182 }
1183 wp_reset_postdata();
1184 }
1185 }
1186