802 lines
27 KiB
PHP
802 lines
27 KiB
PHP
|
<?php
|
||
|
|
|
||
|
|
namespace Essential_Addons_Elementor\Elements;
|
||
|
|
|
||
|
|
// If this file is called directly, abort.
|
||
|
|
if (!defined('ABSPATH')) {
|
||
|
|
exit;
|
||
|
|
}
|
||
|
|
|
||
|
|
use \Elementor\Controls_Manager;
|
||
|
|
use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
|
||
|
|
use Elementor\Group_Control_Box_Shadow;
|
||
|
|
use \Elementor\Group_Control_Typography;
|
||
|
|
use \Elementor\Widget_Base;
|
||
|
|
use \Essential_Addons_Elementor\Classes\Helper as HelperClass;
|
||
|
|
use Essential_Addons_Elementor\Traits\Helper;
|
||
|
|
|
||
|
|
class Post_Timeline extends Widget_Base
|
||
|
|
{
|
||
|
|
use Helper;
|
||
|
|
|
||
|
|
protected $page_id;
|
||
|
|
|
||
|
|
public function get_name()
|
||
|
|
{
|
||
|
|
return 'eael-post-timeline';
|
||
|
|
}
|
||
|
|
|
||
|
|
public function get_title()
|
||
|
|
{
|
||
|
|
return __('Post Timeline', 'essential-addons-for-elementor-lite');
|
||
|
|
}
|
||
|
|
|
||
|
|
public function get_icon()
|
||
|
|
{
|
||
|
|
return 'eaicon-post-timeline';
|
||
|
|
}
|
||
|
|
|
||
|
|
public function get_categories()
|
||
|
|
{
|
||
|
|
return ['essential-addons-for-elementor-lite'];
|
||
|
|
}
|
||
|
|
|
||
|
|
public function get_keywords()
|
||
|
|
{
|
||
|
|
return [
|
||
|
|
'post',
|
||
|
|
'posts',
|
||
|
|
'timeline',
|
||
|
|
'ea post timeline',
|
||
|
|
'ea posts timeline',
|
||
|
|
'blog posts',
|
||
|
|
'content marketing',
|
||
|
|
'blogger',
|
||
|
|
'ea',
|
||
|
|
'essential addons',
|
||
|
|
];
|
||
|
|
}
|
||
|
|
|
||
|
|
public function get_custom_help_url()
|
||
|
|
{
|
||
|
|
return 'https://essential-addons.com/elementor/docs/post-timeline/';
|
||
|
|
}
|
||
|
|
|
||
|
|
protected function register_controls()
|
||
|
|
{
|
||
|
|
|
||
|
|
/**
|
||
|
|
* Query And Layout Controls!
|
||
|
|
* @source includes/elementor-helper.php
|
||
|
|
*/
|
||
|
|
do_action('eael/controls/query', $this);
|
||
|
|
do_action('eael/controls/layout', $this);
|
||
|
|
|
||
|
|
$this->start_controls_section(
|
||
|
|
'section_post_timeline_links',
|
||
|
|
[
|
||
|
|
'label' => __('Links', 'essential-addons-for-elementor-lite'),
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'timeline_link_nofollow',
|
||
|
|
[
|
||
|
|
'label' => __('No Follow', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SWITCHER,
|
||
|
|
'label_on' => __('Yes', 'essential-addons-for-elementor-lite'),
|
||
|
|
'label_off' => __('No', 'essential-addons-for-elementor-lite'),
|
||
|
|
'return_value' => 'true',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'timeline_link_target_blank',
|
||
|
|
[
|
||
|
|
'label' => __('Target Blank', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SWITCHER,
|
||
|
|
'label_on' => __('Yes', 'essential-addons-for-elementor-lite'),
|
||
|
|
'label_off' => __('No', 'essential-addons-for-elementor-lite'),
|
||
|
|
'return_value' => 'true',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->end_controls_section();
|
||
|
|
|
||
|
|
if (!apply_filters('eael/pro_enabled', false)) {
|
||
|
|
HelperClass::go_premium($this);
|
||
|
|
}
|
||
|
|
|
||
|
|
$this->start_controls_section(
|
||
|
|
'eael_section_post_timeline_style',
|
||
|
|
[
|
||
|
|
'label' => __('Timeline Style', 'essential-addons-for-elementor-lite'),
|
||
|
|
'tab' => Controls_Manager::TAB_STYLE,
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_display_overlay',
|
||
|
|
[
|
||
|
|
'label' => __('Show Overlay', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SWITCHER,
|
||
|
|
'label_on' => __('Show', 'essential-addons-for-elementor-lite'),
|
||
|
|
'label_off' => __('Hide', 'essential-addons-for-elementor-lite'),
|
||
|
|
'return_value' => 'yes',
|
||
|
|
'default' => 'yes',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-image' => 'opacity: .6',
|
||
|
|
],
|
||
|
|
'condition'=> [
|
||
|
|
'eael_dynamic_template_Layout!' => 'card',
|
||
|
|
]
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_overlay_color',
|
||
|
|
[
|
||
|
|
'label' => __('Overlay Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'description' => __('Leave blank or Clear to use default gradient overlay', 'essential-addons-for-elementor-lite'),
|
||
|
|
'default' => 'linear-gradient(45deg, #3f3f46 0%, #05abe0 100%) repeat scroll 0 0 rgba(0, 0, 0, 0)',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner' => 'background: {{VALUE}}',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_timeline_display_overlay' => 'yes',
|
||
|
|
'eael_dynamic_template_Layout!' => 'card',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_bg_color',
|
||
|
|
[
|
||
|
|
'label' => __('Background Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#3DB1C0',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner' => 'background: {{VALUE}}',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'card',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_responsive_control(
|
||
|
|
'eael_post_grid_spacing',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Padding', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::DIMENSIONS,
|
||
|
|
'size_units' => ['px', '%', 'em'],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'card',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_post_timeline_border_radius',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Border Radius', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::DIMENSIONS,
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner' => 'border-radius: {{TOP}}px {{RIGHT}}px {{BOTTOM}}px {{LEFT}}px;',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'card',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_group_control(
|
||
|
|
Group_Control_Box_Shadow::get_type(),
|
||
|
|
[
|
||
|
|
'name' => 'eael_post_timeline_box_shadow',
|
||
|
|
'selector' => '{{WRAPPER}} .eael-timeline-post-inner',
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'card',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_post_timeline_content_heading',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Content', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::HEADING,
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'card',
|
||
|
|
],
|
||
|
|
'separator' => 'before',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_responsive_control(
|
||
|
|
'eael_post_timeline_content_spacing',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Spacing', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::DIMENSIONS,
|
||
|
|
'size_units' => ['px', '%', 'em'],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-content' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'card',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_post_timeline_image_heading',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Image', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::HEADING,
|
||
|
|
'separator' => 'before',
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout!' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_responsive_control(
|
||
|
|
'eael_timeline_image_height',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Height', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'max' => 500,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-image' => 'height: {{SIZE}}PX;',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout!' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_img_border_radius',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Border Radius', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::DIMENSIONS,
|
||
|
|
'size_units' => ['px', '%'],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-image' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout!' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->end_controls_section();
|
||
|
|
|
||
|
|
$this->start_controls_section(
|
||
|
|
'eael_section_typography',
|
||
|
|
[
|
||
|
|
'label' => __('Typography', 'essential-addons-for-elementor-lite'),
|
||
|
|
'tab' => Controls_Manager::TAB_STYLE,
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_title_style',
|
||
|
|
[
|
||
|
|
'label' => __('Title Style', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::HEADING,
|
||
|
|
'separator' => 'before',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_title_color',
|
||
|
|
[
|
||
|
|
'label' => __('Title Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#fff',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-title .eael-timeline-post-title-text' => 'color: {{VALUE}};',
|
||
|
|
'{{WRAPPER}} .timeline-layout-card .eael-timeline-post-title .eael-timeline-post-title-text-card' => 'color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_responsive_control(
|
||
|
|
'eael_timeline_title_alignment',
|
||
|
|
[
|
||
|
|
'label' => __('Title Alignment', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::CHOOSE,
|
||
|
|
'options' => [
|
||
|
|
'left' => [
|
||
|
|
'title' => __('Left', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-left',
|
||
|
|
],
|
||
|
|
'center' => [
|
||
|
|
'title' => __('Center', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-center',
|
||
|
|
],
|
||
|
|
'right' => [
|
||
|
|
'title' => __('Right', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-right',
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-title .eael-timeline-post-title-text' => 'text-align: {{VALUE}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_group_control(
|
||
|
|
Group_Control_Typography::get_type(),
|
||
|
|
[
|
||
|
|
'name' => 'eael_timeline_title_typography',
|
||
|
|
'label' => __('Title Typography', 'essential-addons-for-elementor-lite'),
|
||
|
|
'global' => [
|
||
|
|
'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
|
||
|
|
],
|
||
|
|
'selector' => '{{WRAPPER}} .eael-timeline-post-title .eael-timeline-post-title-text',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_excerpt_style',
|
||
|
|
[
|
||
|
|
'label' => __('Excerpt Style', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::HEADING,
|
||
|
|
'separator' => 'before',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_excerpt_color',
|
||
|
|
[
|
||
|
|
'label' => __('Excerpt Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#ffffff',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-excerpt p' => 'color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_responsive_control(
|
||
|
|
'eael_timeline_excerpt_alignment',
|
||
|
|
[
|
||
|
|
'label' => __('Excerpt Alignment', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::CHOOSE,
|
||
|
|
'options' => [
|
||
|
|
'left' => [
|
||
|
|
'title' => __('Left', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-left',
|
||
|
|
],
|
||
|
|
'center' => [
|
||
|
|
'title' => __('Center', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-center',
|
||
|
|
],
|
||
|
|
'right' => [
|
||
|
|
'title' => __('Right', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-right',
|
||
|
|
],
|
||
|
|
'justify' => [
|
||
|
|
'title' => __('Justified', 'essential-addons-for-elementor-lite'),
|
||
|
|
'icon' => 'eicon-text-align-justify',
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-excerpt p' => 'text-align: {{VALUE}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_group_control(
|
||
|
|
Group_Control_Typography::get_type(),
|
||
|
|
[
|
||
|
|
'name' => 'eael_timeline_excerpt_typography',
|
||
|
|
'label' => __('Excerpt Typography', 'essential-addons-for-elementor-lite'),
|
||
|
|
'global' => [
|
||
|
|
'default' => Global_Typography::TYPOGRAPHY_TEXT,
|
||
|
|
],
|
||
|
|
'selector' => '{{WRAPPER}} .eael-timeline-post-excerpt p',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->end_controls_section();
|
||
|
|
|
||
|
|
// Start Arrow Styling
|
||
|
|
|
||
|
|
$this->start_controls_section(
|
||
|
|
'eael_section_arrow',
|
||
|
|
[
|
||
|
|
'label' => __('Arrow', 'essential-addons-for-elementor-lite'),
|
||
|
|
'tab' => Controls_Manager::TAB_STYLE,
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_border_color',
|
||
|
|
[
|
||
|
|
'label' => __('Border & Arrow Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#e5eaed',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner' => 'border-color: {{VALUE}};',
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner::after' => 'border-left-color: {{VALUE}};',
|
||
|
|
'{{WRAPPER}} .eael-timeline-post:nth-child(2n) .eael-timeline-post-inner::after' => 'border-right-color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_arrow_color',
|
||
|
|
[
|
||
|
|
'label' => __('Arrow Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#3DB1C0',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner' => 'border-color: {{VALUE}};',
|
||
|
|
'{{WRAPPER}} .eael-timeline-post-inner::after' => 'border-left-color: {{VALUE}}; border-right-color: {{VALUE}}',
|
||
|
|
// '{{WRAPPER}} .eael-timeline-post:nth-child(2n) .eael-timeline-post-inner::after' => 'border-right-color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout!' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_responsive_control(
|
||
|
|
'eael_timeline_arrow_size',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Size', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'max' => 20,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-post-timeline.timeline-layout-card .eael-timeline-post-inner:after' => 'border-width: {{SIZE}}px; right: -{{SIZE}}px; left: -{{SIZE}}px',
|
||
|
|
'{{WRAPPER}} .eael-post-timeline.timeline-layout-card .eael-timeline-post:nth-child(2n) .eael-timeline-post-inner:after' => 'left: -{{SIZE}}px;',
|
||
|
|
],
|
||
|
|
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout!' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_arrow_alignment',
|
||
|
|
[
|
||
|
|
'label' => __('Alignment', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::CHOOSE,
|
||
|
|
'options' => [
|
||
|
|
'top' => [
|
||
|
|
'title' => __( 'Top', 'essential-addons-for-elementor-lite' ),
|
||
|
|
'icon' => 'eicon-v-align-top',
|
||
|
|
],
|
||
|
|
'middle' => [
|
||
|
|
'title' => __( 'Middle', 'essential-addons-for-elementor-lite' ),
|
||
|
|
'icon' => 'eicon-v-align-middle',
|
||
|
|
],
|
||
|
|
'bottom' => [
|
||
|
|
'title' => __( 'Bottom', 'essential-addons-for-elementor-lite' ),
|
||
|
|
'icon' => 'eicon-v-align-bottom',
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'default' => 'top',
|
||
|
|
'condition' => [
|
||
|
|
'eael_dynamic_template_Layout!' => 'default',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->end_controls_section();
|
||
|
|
|
||
|
|
// Start Time Styling
|
||
|
|
|
||
|
|
$this->start_controls_section(
|
||
|
|
'eael_section_time',
|
||
|
|
[
|
||
|
|
'label' => __('Time', 'essential-addons-for-elementor-lite'),
|
||
|
|
'tab' => Controls_Manager::TAB_STYLE,
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_date_background_color',
|
||
|
|
[
|
||
|
|
'label' => __('Date Background Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => 'rgba(0, 0, 0, 0.7)',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post time' => 'background-color: {{VALUE}};',
|
||
|
|
'{{WRAPPER}} .eael-timeline-post time::before' => 'border-bottom-color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_date_color',
|
||
|
|
[
|
||
|
|
'label' => __('Date Text Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#fff',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post time' => 'color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_group_control(
|
||
|
|
Group_Control_Typography::get_type(),
|
||
|
|
[
|
||
|
|
'name' => 'eael_timeline_time_typography',
|
||
|
|
'label' => __('Typography', 'essential-addons-for-elementor-lite'),
|
||
|
|
'selector' => '{{WRAPPER}} time',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_time_padding',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Padding', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::DIMENSIONS,
|
||
|
|
'size_units' => ['px', '%'],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} time' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_time_border_radius',
|
||
|
|
[
|
||
|
|
'label' => esc_html__('Border Radius', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::DIMENSIONS,
|
||
|
|
'size_units' => ['px', '%'],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} time' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->end_controls_section();
|
||
|
|
|
||
|
|
$this->start_controls_section(
|
||
|
|
'eael_section_line',
|
||
|
|
[
|
||
|
|
'label' => __('Line & Bullet', 'essential-addons-for-elementor-lite'),
|
||
|
|
'tab' => Controls_Manager::TAB_STYLE,
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_section_post_timeline_line_heading',
|
||
|
|
[
|
||
|
|
'label' => __('Line', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::HEADING,
|
||
|
|
'separator' => 'before',
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_section_post_timeline_line_size',
|
||
|
|
[
|
||
|
|
'label' => __('Line Width', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'size_units' => ['px', '%'],
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'min' => 0,
|
||
|
|
'max' => 20,
|
||
|
|
'step' => 1,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post:after' => 'width: {{SIZE}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
$this->add_control(
|
||
|
|
'eael_section_post_timeline_line_position_from_right',
|
||
|
|
[
|
||
|
|
'label' => __('Line Position From Right', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'size_units' => ['px'],
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'min' => 0,
|
||
|
|
'max' => 20,
|
||
|
|
'step' => 1,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post:after' => 'right: -{{SIZE}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
'condition'=> [
|
||
|
|
'eael_dynamic_template_Layout!' => 'card',
|
||
|
|
]
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_section_post_timeline_bullet_size',
|
||
|
|
[
|
||
|
|
'label' => __('Bullet Size', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'size_units' => ['px', '%'],
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'min' => 0,
|
||
|
|
'max' => 100,
|
||
|
|
'step' => 1,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-bullet' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
$this->add_control(
|
||
|
|
'eael_section_post_timeline_bullet_position_from_left',
|
||
|
|
[
|
||
|
|
'label' => __('Left-sided Bullet Positon', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'size_units' => ['px'],
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'min' => 0,
|
||
|
|
'max' => 50,
|
||
|
|
'step' => 1,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-bullet' => 'right: -{{SIZE}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
'condition'=> [
|
||
|
|
'eael_dynamic_template_Layout!' => 'card',
|
||
|
|
]
|
||
|
|
]
|
||
|
|
);
|
||
|
|
$this->add_control(
|
||
|
|
'eael_section_post_timeline_bullet_position_from_right',
|
||
|
|
[
|
||
|
|
'label' => __('Right-sided Bullet Position', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::SLIDER,
|
||
|
|
'size_units' => ['px'],
|
||
|
|
'range' => [
|
||
|
|
'px' => [
|
||
|
|
'min' => 0,
|
||
|
|
'max' => 50,
|
||
|
|
'step' => 1,
|
||
|
|
],
|
||
|
|
],
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post:nth-child(2n) .eael-timeline-bullet' => 'left: -{{SIZE}}{{UNIT}};',
|
||
|
|
],
|
||
|
|
'condition'=> [
|
||
|
|
'eael_dynamic_template_Layout!' => 'card',
|
||
|
|
]
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_bullet_color',
|
||
|
|
[
|
||
|
|
'label' => __('Timeline Bullet Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#9fa9af',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-bullet' => 'background-color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_bullet_border_color',
|
||
|
|
[
|
||
|
|
'label' => __('Timeline Bullet Border Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => '#fff',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-bullet' => 'border-color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_control(
|
||
|
|
'eael_timeline_vertical_line_color',
|
||
|
|
[
|
||
|
|
'label' => __('Timeline Vertical Line Color', 'essential-addons-for-elementor-lite'),
|
||
|
|
'type' => Controls_Manager::COLOR,
|
||
|
|
'default' => 'rgba(83, 85, 86, .2)',
|
||
|
|
'selectors' => [
|
||
|
|
'{{WRAPPER}} .eael-timeline-post:after' => 'background-color: {{VALUE}};',
|
||
|
|
],
|
||
|
|
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->end_controls_section();
|
||
|
|
|
||
|
|
do_action('eael/controls/load_more_button_style', $this);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
protected function render()
|
||
|
|
{
|
||
|
|
$settings = $this->get_settings_for_display();
|
||
|
|
$settings = HelperClass::fix_old_query($settings);
|
||
|
|
$args = HelperClass::get_query_args($settings);
|
||
|
|
$args = HelperClass::get_dynamic_args($settings, $args);
|
||
|
|
|
||
|
|
$settings ['expanison_indicator'] = $settings['excerpt_expanison_indicator'];
|
||
|
|
|
||
|
|
$this->add_render_attribute(
|
||
|
|
'eael_post_timeline_wrapper',
|
||
|
|
[
|
||
|
|
'id' => "eael-post-timeline-{$this->get_id()}",
|
||
|
|
'class' => ["eael-post-timeline", "timeline-layout-{$settings['eael_dynamic_template_Layout']}", "eael-post-timeline-arrow-{$settings['eael_timeline_arrow_alignment']}"],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
$this->add_render_attribute(
|
||
|
|
'eael_post_timeline',
|
||
|
|
[
|
||
|
|
'class' => ['eael-post-timeline', 'eael-post-appender', "eael-post-appender-{$this->get_id()}"],
|
||
|
|
]
|
||
|
|
);
|
||
|
|
|
||
|
|
echo '<div ' . $this->get_render_attribute_string('eael_post_timeline_wrapper') . '>
|
||
|
|
<div ' . $this->get_render_attribute_string('eael_post_timeline') . '>';
|
||
|
|
|
||
|
|
$template = $this->get_template($this->get_settings('eael_dynamic_template_Layout'));
|
||
|
|
$settings['loadable_file_name'] = $this->get_filename_only($template);
|
||
|
|
$dir_name = $this->get_temp_dir_name($settings['loadable_file_name']);
|
||
|
|
$found_posts = 0;
|
||
|
|
|
||
|
|
if(file_exists($template)){
|
||
|
|
$query = new \WP_Query($args);
|
||
|
|
if ($query->have_posts()) {
|
||
|
|
$found_posts = $query->found_posts;
|
||
|
|
$ppp = empty( $args['posts_per_page'] ) ? get_option( 'posts_per_page' ) : $args['posts_per_page'];
|
||
|
|
$max_page = ceil( $found_posts / absint( $ppp ) );
|
||
|
|
$args['max_page'] = $max_page;
|
||
|
|
while ($query->have_posts()) {
|
||
|
|
$query->the_post();
|
||
|
|
include($template);
|
||
|
|
}
|
||
|
|
} else {
|
||
|
|
_e('<p class="no-posts-found">No posts found!</p>', 'essential-addons-for-elementor-lite');
|
||
|
|
}
|
||
|
|
wp_reset_postdata();
|
||
|
|
} else {
|
||
|
|
_e('<p class="no-posts-found">No layout found!</p>', 'essential-addons-for-elementor-lite');
|
||
|
|
}
|
||
|
|
echo '</div>
|
||
|
|
</div>';
|
||
|
|
|
||
|
|
if ( $found_posts > $args['posts_per_page'] ) {
|
||
|
|
$this->print_load_more_button( $settings, $args, $dir_name );
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|