trAvis - MANAGER
Edit File: tp_page_scroll.php
<?php /* Widget Name: Page Scroll Description: Page Scroll Author: Theplus Author URI: https://posimyth.com */ namespace TheplusAddons\Widgets; use Elementor\Widget_Base; use Elementor\Controls_Manager; use Elementor\Repeater; use Elementor\Core\Responsive\Responsive; use Elementor\Group_Control_Typography; use Elementor\Core\Schemes\Color; use Elementor\Group_Control_Text_Shadow; use Elementor\Group_Control_Box_Shadow; use Elementor\Group_Control_Border; use Elementor\Group_Control_Background; use Elementor\Core\Schemes\Typography; use TheplusAddons\Theplus_Element_Load; if (!defined('ABSPATH')) exit; // Exit if accessed directly class ThePlus_Page_Scroll extends Widget_Base { public function get_name() { return 'tp-page-scroll'; } public function get_title() { return esc_html__('Page Scroll', 'theplus'); } public function get_icon() { return 'fa fa-rocket theplus_backend_icon'; } public function get_categories() { return array('plus-creatives'); } public function get_keywords() { return ['one page scroll', 'full page js', 'page piling', 'page pilling', 'multi scroll', 'page scroll', 'scroll']; } protected function _register_controls() { $this->start_controls_section( 'section_page_scroll', [ 'label' => esc_html__( 'Page Scroll', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, ] ); $this->add_control( 'page_scroll_opt', [ 'label' => esc_html__( 'Option', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'tp_full_page', 'options' => [ 'tp_full_page' => esc_html__( 'Full Page', 'theplus' ), 'tp_page_pilling' => esc_html__( 'Page Piling', 'theplus' ), 'tp_multi_scroll' => esc_html__( 'Multi Scroll', 'theplus' ), 'tp_horizontal_scroll' => esc_html__( 'Horizontal Scroll', 'theplus' ), ], ] ); $this->end_controls_section(); /*full page & page pilling content start*/ $this->start_controls_section( 'full_pagepilling_content_templates', [ 'label' => esc_html__( 'Content', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'page_scroll_opt' => ['tp_page_pilling','tp_full_page'], ], ] ); $this->add_control( 'fit_screen_note', [ 'label' => esc_html__( 'Make sure your templates have full width On and It will suitable to screen height.', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, ] ); $repeater = new \Elementor\Repeater(); $repeater->add_control( 'fp_content_template', [ 'label' => esc_html__( 'Elementor Templates', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '0', 'options' => theplus_get_templates(), 'label_block' => 'true', ] ); $repeater->add_control( 'fp-slideid', [ 'label' => esc_html__( 'Slide Id', 'theplus' ), 'type' => Controls_Manager::TEXT, 'dynamic' => [ 'active' => true, ], 'placeholder' => esc_html__( 'slideid', 'theplus' ), ] ); $this->add_control( 'fp_content', [ 'label' => '', 'type' => Controls_Manager::REPEATER, 'fields' => $repeater->get_controls(), ] ); $this->end_controls_section(); /*full page & page pilling content end*/ /*Horizontal Scroll content end*/ $this->start_controls_section( 'hscroll_content_template', [ 'label' => esc_html__( 'Content', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'page_scroll_opt' => 'tp_horizontal_scroll', ], ] ); $this->add_control( 'hscroll_screen_note', [ 'label' => esc_html__( 'We recommend you to make "Full height" from elementor template to have proper look in all screens.', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, ] ); $hscroll_repeater = new \Elementor\Repeater(); $hscroll_repeater->add_control( 'hslide_template', [ 'label' => esc_html__( 'Elementor Templates', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '0', 'options' => theplus_get_templates(), 'label_block' => 'true', ] ); $hscroll_repeater->add_control( 'hslide_id', [ 'label' => esc_html__('Slide/Anchor ID', 'theplus'), 'type' => Controls_Manager::TEXT, 'label_block' => true, ] ); $hscroll_repeater->add_control( 'hslide_width', [ 'label' => esc_html__('Slide Width', 'theplus'), 'type' => Controls_Manager::SLIDER, 'size_units' => ['px', 'em', 'rem', 'vw'], 'range' => [ 'px' => [ 'min' => 0, 'max' => 2000, 'step' => 10, ], 'vw' => [ 'min' => 0, 'max' => 100, ], 'em' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], 'rem' => [ 'min' => 0, 'max' => 100, 'step' => 1, ], ], 'default' => [ 'unit' => 'vw', 'size' => 100, ], 'separator' => 'before', ] ); $hscroll_repeater->add_control( 'hslide_align', [ 'label' => esc_html__('Slide Align', 'theplus'), 'type' => \Elementor\Controls_Manager::CHOOSE, 'options' => [ 'top' => [ 'title' => esc_html__('Top', 'theplus'), 'icon' => 'eicon-v-align-top', ], 'center' => [ 'title' => esc_html__('Middle', 'theplus'), 'icon' => 'eicon-v-align-middle', ], 'bottom' => [ 'title' => esc_html__('Bottom', 'theplus'), 'icon' => 'eicon-v-align-bottom', ], ], 'default' => 'center', 'toggle' => false, ] ); $hscroll_repeater->add_control( 'hslide_padding', [ 'label' => esc_html__('Slide Padding', 'theplus'), 'type' => Controls_Manager::DIMENSIONS, 'default' => [ 'isLinked' => true, ], 'selectors' => [ '{{WRAPPER}}.tp-page-scroll-wrapper .tp_hscroll_slide{{CURRENT_ITEM}}' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}', ], ] ); $hscroll_repeater->add_control( 'hslide_margin', [ 'label' => esc_html__('Slide Margin', 'theplus'), 'type' => Controls_Manager::DIMENSIONS, 'default' => [ 'top' => 'auto', 'right' => '', 'bottom' => 'auto', 'left' => '', 'isLinked' => true, ], 'allowed_dimensions' => 'horizontal', 'selectors' => [ '{{WRAPPER}}.tp-page-scroll-wrapper .tp_hscroll_slide{{CURRENT_ITEM}}' => 'margin: auto {{RIGHT}}{{UNIT}} auto {{LEFT}}{{UNIT}}', ], ] ); $hscroll_repeater->add_control( 'hscroll_bg_scrolling', [ 'label' => esc_html__( 'Scroll page section change background on view section', 'theplus' ), 'type' => Controls_Manager::HEADING, 'separator' => 'before', ] ); $hscroll_repeater->add_control( 'scroll_bg_color', [ 'label' => esc_html__('Background Color', 'theplus'), 'type' => Controls_Manager::COLOR, 'default' => '', ] ); $hscroll_repeater->add_control( 'scroll_bg_image', [ 'label' => 'Background Image <b>(Works only in On Scroll Background Animation)</b>', 'type' => Controls_Manager::MEDIA, 'dynamic' => ['active' => true,], 'default' => [ 'url' => '', ], 'separator' => 'before', ] ); $hscroll_repeater->add_control( 'hscroll_overlay_bg_scrolling', [ 'label' => esc_html__( 'Overlay Background Scroll Bg Image', 'theplus' ), 'type' => Controls_Manager::HEADING, 'separator' => 'before', ] ); $hscroll_repeater->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'scroll_bg_overlay', 'label' => esc_html__( 'Overlay Color On Image', 'theplus' ), 'types' => [ 'classic', 'gradient' ], 'selector' => '.scroll{{ID}} {{CURRENT_ITEM}}.plus-section-bg-scrolling:after', 'description' => 'Overlay Color On Image <b>(Works only in On Scroll Background Animation)</b>', ] ); $this->add_control( 'hscroll_content', [ 'label' => '', 'type' => Controls_Manager::REPEATER, 'fields' => $hscroll_repeater->get_controls(), 'title_field' => '{{{ hslide_id }}}', ] ); $this->add_control( 'hscroll_bg', [ 'label' => esc_html__('Horizontal Scroll Background', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => '', 'label_on' => esc_html__('On', 'theplus'), 'label_off' => esc_html__('Off', 'theplus'), 'separator' => 'before', ] ); $this->add_control( 'hscroll_page_full', [ 'label' => esc_html__( 'Position', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'inherit', 'options' => [ 'inherit' => esc_html__( 'Inherit', 'theplus' ), 'relative' => esc_html__( 'Relative', 'theplus' ), ], 'description' => esc_html__( 'Note : Use this field, If your background isn\'t work the way it should be.', 'theplus' ), 'condition' => [ 'hscroll_bg' => 'yes', ], ] ); $this->add_control( 'hscroll_bg_duration', [ 'label' => esc_html__( 'Background Transition Duration', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 's' ], 'range' => [ 's' => [ 'min' => 0, 'max' => 2, 'step' => 0.1, ], ], 'default' => [ 'unit' => 's', 'size' => 0.7, ], 'condition' => [ 'hscroll_bg' => 'yes', ], ] ); $this->end_controls_section(); /*Horizontal Scroll content end*/ $this->start_controls_section( 'settings_section', [ 'label' => esc_html__('Extra Options', 'theplus'), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'page_scroll_opt' => 'tp_horizontal_scroll', ], ] ); $this->add_control( 'hscroll_speed', [ 'label' => esc_html__('Horizontal Scroll Speed', 'theplus'), 'type' => Controls_Manager::SLIDER, 'range' => [ 'px' => [ 'min' => 0.1, 'max' => 3.5, 'step' => 0.01, ], ], 'default' => [ 'unit' => 'px', 'size' => 0.8, ], ] ); $this->add_control( 'hscroll_sec_id_transition', [ 'label' => esc_html__('Section Id/Anchor Transition Duration (ms)', 'theplus'), 'type' => Controls_Manager::SLIDER, 'range' => [ 'px' => [ 'min' => 0, 'max' => 5000, 'step' => 10, ], ], 'default' => [ 'unit' => 'px', 'size' => 700, ], ] ); $this->add_control( 'hscroll_draggable', [ 'label' => esc_html__('Mouse Draggable Scrollbar', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => '', 'label_on' => esc_html__('On', 'theplus'), 'label_off' => esc_html__('Off', 'theplus'), 'separator' => 'before', ] ); $this->add_control( 'hscroll_scrollbar', [ 'label' => esc_html__('Scrollbar Rail', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => 'yes', 'label_on' => esc_html__('On', 'theplus'), 'label_off' => esc_html__('Off', 'theplus'), 'separator' => 'before', ] ); $this->add_control( 'hscroll_footer', [ 'label' => esc_html__('Horizontal Scroll Footer', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => 'no', 'label_on' => esc_html__('On', 'theplus'), 'label_off' => esc_html__('Off', 'theplus'), 'separator' => 'before', ] ); $this->add_control( 'hscroll_footer_height', [ 'label' => esc_html__( 'Footer Height', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 500, 'step' => 1, ], '%' => [ 'min' => 0, 'max' => 100, ], ], 'condition' => [ 'hscroll_footer' => 'yes', ], ] ); $this->add_control( 'hscroll_responsive', [ 'label' => esc_html__('Horizontal Scroll Responsive', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => '', 'label_on' => esc_html__('On', 'theplus'), 'label_off' => esc_html__('Off', 'theplus'), 'separator' => 'before', ] ); $this->add_control( 'hscroll_res_minwidth', [ 'label' => esc_html__('Min Width', 'theplus'), 'type' => Controls_Manager::SLIDER, 'description' => esc_html__('Enter Minimum Screen Width(px) from which you want to turn off Horizontal Scroll.', 'theplus'), 'size_units' => ['px'], 'range' => [ 'px' => [ 'min' => 0, 'max' => 2000, 'step' => 10, ], ], 'default' => [ 'unit' => 'px', 'size' => '767', ], 'condition' => [ 'hscroll_responsive' => 'yes', ] ] ); $this->end_controls_section(); /*multi scroll content start*/ $this->start_controls_section( 'multi_scroll_content_templates', [ 'label' => esc_html__( 'Multi Scroll Content', 'theplus' ), 'tab' => Controls_Manager::TAB_CONTENT, 'condition' => [ 'page_scroll_opt' => 'tp_multi_scroll', ], ] ); $this->add_control( 'template_full_height_text', [ 'label' => esc_html__( 'Make sure your templates have full width On and It will suitable to screen height.', 'theplus' ), 'type' => Controls_Manager::RAW_HTML, ] ); $multiscroll_repeater = new REPEATER(); $multiscroll_repeater->add_control( 'fp-slideid', [ 'label' => esc_html__( 'Slide Id', 'theplus' ), 'type' => Controls_Manager::TEXT, 'dynamic' => [ 'active' => true, ], 'placeholder' => esc_html__( 'Enter Slide Id', 'theplus' ), ] ); $multiscroll_repeater->add_control( 'multi_left_template', [ 'label' => esc_html__( 'Left Template', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => '0', 'options' => theplus_get_templates(), 'label_block' => false, ] ); $multiscroll_repeater->add_control( 'multi_right_template', [ 'label' => esc_html__( 'Right Template', 'theplus' ), 'type' => Controls_Manager::SELECT2, 'options' => theplus_get_templates(), 'label_block' => false, ] ); $this->add_control( 'multi_left_right_repeater', [ 'label' => esc_html__( 'Sections', 'theplus' ), 'type' => Controls_Manager::REPEATER, 'fields' => $repeater->get_controls(), ] ); $this->end_controls_section(); /*full page dots settings start*/ $this->start_controls_section('dots_settings', [ 'label' => esc_html__('Dots', 'theplus'), 'condition' => [ 'page_scroll_opt!' => 'tp_horizontal_scroll', ], ] ); $this->add_control( 'show_dots', [ 'label' => esc_html__( 'Dots', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'yes', 'description' => esc_html__('Works only on the frontend', 'theplus'), 'condition' => [ 'page_scroll_opt!' => 'tp_multi_scroll', ], ] ); $this->add_control('nav_postion', [ 'label' => esc_html__('Dots Positions', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'right' => esc_html__('Right', 'theplus'), 'left' => esc_html__('Left', 'theplus'), ], 'default' => 'right', 'condition' => [ 'show_dots' => 'yes', 'page_scroll_opt!' => 'tp_multi_scroll', ], ] ); $this->add_control('nav_dots_tooltips', [ 'label' => esc_html__('Dots Tooltips Text', 'theplus'), 'type' => Controls_Manager::TEXT, 'description' => esc_html__('Add Multiple text separated by comma \',\'','theplus'), 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling'], 'show_dots' => 'yes' ] ] ); /*navigation multi scroll*/ $this->add_control( 'multi_navigation_dots', [ 'label' => esc_html__('Navigation Dots', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => 'yes', 'condition' => [ 'page_scroll_opt' => 'tp_multi_scroll', ], ] ); $this->add_control( 'multi_navigation_dots_pos', [ 'label' => esc_html__('Dots Horizontal Position', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'left' => esc_html__('Left', 'theplus'), 'right' => esc_html__('Right', 'theplus'), ], 'default' => 'right', 'condition' => [ 'page_scroll_opt' => 'tp_multi_scroll', 'multi_navigation_dots' => 'yes' ] ] ); $this->add_control('multi_navigation_verti_dots_pos', [ 'label' => esc_html__('Dots Vertical Position', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'top' => esc_html__('Top', 'theplus'), 'middle'=> esc_html__('Middle', 'theplus'), 'bottom'=> esc_html__('Bottom', 'theplus'), ], 'default' => 'middle', 'condition' => [ 'page_scroll_opt' => 'tp_multi_scroll', 'multi_navigation_dots' => 'yes' ] ] ); $this->add_control( 'multi_dots_tooltips', [ 'label' => esc_html__('Dots Tooltip\'s Text', 'theplus'), 'type' => Controls_Manager::TEXT, 'description' => esc_html__('Add Multiple text separated by comma \',\'','theplus'), 'condition' => [ 'page_scroll_opt' => 'tp_multi_scroll', 'multi_navigation_dots' => 'yes' ] ] ); /*navigation multi scroll*/ $this->add_control( 'scroll_nav_connection', [ 'label' => esc_html__( 'Scroll Navigation Connection', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', ] ); $this->add_control( 'scrollnav_connect_id', [ 'label' => esc_html__( 'Scroll Navigation Connect ID', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => '', 'condition' => [ 'scroll_nav_connection' => 'yes', ], ] ); $this->end_controls_section(); /*full page dots settings end*/ /*Next previous settings end*/ $this->start_controls_section('next_previous_settings', [ 'label' => esc_html__('Next Previous Button', 'theplus'), 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling','tp_multi_scroll'], ], ] ); $this->add_control( 'show_next_prev', [ 'label' => esc_html__( 'Next Previous Button', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'yes', ] ); $this->add_control('next_prev_style', [ 'label' => esc_html__('Style', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'style-1' => esc_html__('Style 1', 'theplus'), 'style-2' => esc_html__('Style 2', 'theplus'), 'style-3' => esc_html__('Style 3', 'theplus'), 'custom' => esc_html__('Custom', 'theplus'), ], 'default' => 'style-1', 'condition' => [ 'show_next_prev' => 'yes', ], ] ); $this->add_control( 'nav_prev_image', [ 'label' => esc_html__( 'Previous Icon', 'theplus' ), 'type' => \Elementor\Controls_Manager::MEDIA, 'condition' => [ 'next_prev_style' => 'custom', ], ] ); $this->add_control( 'nav_next_image', [ 'label' => esc_html__( 'Next Icon', 'theplus' ), 'type' => \Elementor\Controls_Manager::MEDIA, 'condition' => [ 'next_prev_style' => 'custom', ], ] ); $this->add_control( 'np_gap', [ 'label' => esc_html__( 'Gap', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 200, 'step' => 1, ], '%' => [ 'min' => 0, 'max' => 100, ], ], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev .fp-nav-btn.fp-nav-next' => 'margin-left: {{SIZE}}{{UNIT}};', ], 'condition' => [ 'show_next_prev' => 'yes', ], ] ); $this->add_control('next_prev_direction', [ 'label' => esc_html__('Direction', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'horizontal' => esc_html__('Horizontal', 'theplus'), 'vertical' => esc_html__('Vertical', 'theplus'), ], 'default' => 'horizontal', 'condition' => [ 'show_next_prev' => 'yes', ], ] ); $this->add_control('fp_nav_position', [ 'label' => esc_html__('Position', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'bottom-center' => esc_html__('bottom-center', 'theplus'), 'bottom-left' => esc_html__('bottom-left', 'theplus'), 'bottom-right' => esc_html__('bottom-right', 'theplus'), 'left-top' => esc_html__('left-top', 'theplus'), 'left-center' => esc_html__('left-center', 'theplus'), 'right-top' => esc_html__('right-top', 'theplus'), 'right-center' => esc_html__('right-center', 'theplus'), ], 'default' => 'bottom-center', 'condition' => [ 'show_next_prev' => 'yes', ], ] ); $this->add_responsive_control( 'fp_offset_left', [ 'label' => esc_html__( 'Offset Left', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 5,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.bottom-left,{{WRAPPER}} .fp-nxt-prev.left-top,{{WRAPPER}} .fp-nxt-prev.left-center' => 'left: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_next_prev' => 'yes','fp_nav_position' => ['bottom-left','left-top','left-center'],], ] ); $this->add_responsive_control( 'fp_offset_right', [ 'label' => esc_html__( 'Offset Right', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 1,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.bottom-right,{{WRAPPER}} .fp-nxt-prev.right-top,{{WRAPPER}} .fp-nxt-prev.right-center' => 'right: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_next_prev' => 'yes','fp_nav_position' => ['bottom-right','right-top','right-center'],], ] ); $this->add_responsive_control( 'fp_offset_bottom', [ 'label' => esc_html__( 'Offset Bottom', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 1,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.bottom-left,{{WRAPPER}} .fp-nxt-prev.bottom-right,{{WRAPPER}} .fp-nxt-prev.bottom-center' => 'bottom: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_next_prev' => 'yes','fp_nav_position' => ['bottom-left','bottom-center','bottom-right'],], ] ); $this->add_responsive_control( 'fp_offset_top', [ 'label' => esc_html__( 'Offset Top', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 1,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.left-top,{{WRAPPER}} .fp-nxt-prev.right-top' => 'top: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_next_prev' => 'yes','fp_nav_position' => ['left-top','right-top'],], ] ); $this->add_control( 'next_size', [ 'label' => esc_html__('Next Icon Size', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'small' => esc_html__('Small', 'theplus'), 'medium' => esc_html__('Medium', 'theplus'), 'large' => esc_html__('Large', 'theplus'), ], 'default' => 'medium', 'separator' => 'before', 'condition' => [ 'show_next_prev' => 'yes', 'next_prev_style!' => ['style-3','custom'], ], ] ); $this->add_control( 'prev_size', [ 'label' => esc_html__('Prev Icon Size', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'small' => esc_html__('Small', 'theplus'), 'medium' => esc_html__('Medium', 'theplus'), 'large' => esc_html__('Large', 'theplus'), ], 'default' => 'medium', 'condition' => [ 'show_next_prev' => 'yes', 'next_prev_style!' => ['style-3','custom'], ], ] ); $this->add_control( 'nxt_txt', [ 'label' => esc_html__( 'Next Button Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => 'Next', 'placeholder' => esc_html__( 'Next', 'theplus' ), 'condition' => [ 'show_next_prev' => 'yes', 'next_prev_style' => 'style-3', ], ] ); $this->add_control( 'prev_txt', [ 'label' => esc_html__( 'Previous Button Text', 'theplus' ), 'type' => Controls_Manager::TEXT, 'default' => 'Prev', 'placeholder' => esc_html__( 'Prev', 'theplus' ), 'condition' => [ 'show_next_prev' => 'yes', 'next_prev_style' => 'style-3', ], ] ); $this->end_controls_section(); /*Next previous settings end*/ /*paginate settings start*/ $this->start_controls_section('section_show_paginate', [ 'label' => esc_html__('Paginate', 'theplus'), 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling','tp_multi_scroll'], ], ] ); $this->add_control( 'show_paginate', [ 'label' => esc_html__( 'Show Paginate', 'theplus' ), 'type' => \Elementor\Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', ] ); $this->add_control('paginate_style', [ 'label' => esc_html__('Pagination Styles', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'fadeIn' => esc_html__('FadeIn', 'theplus'), 'fadeInDown' => esc_html__('FadeInDown', 'theplus'), 'fadeInUp' => esc_html__('FadeInUp', 'theplus'), 'flipInX' => esc_html__('FlipInX', 'theplus'), 'flipInY' => esc_html__('FlipInY', 'theplus'), 'rotateInDownRight' => esc_html__('RotateInDownRight', 'theplus'), 'rotateInUpRight' => esc_html__('RotateInUpRight', 'theplus'), 'zoomIn' => esc_html__('ZoomIn', 'theplus'), 'rollIn' => esc_html__('RollIn', 'theplus'), 'bounceIn' => esc_html__('BounceIn', 'theplus'), ], 'default' => 'fadeIn', 'condition' => [ 'show_paginate' => 'yes', ], ] ); $this->add_control('paginate_position', [ 'label' => esc_html__('Pagination Position', 'theplus'), 'type' => Controls_Manager::SELECT, 'options' => [ 'bottom-center' => esc_html__('Bottom Center', 'theplus'), 'bottom-left' => esc_html__('Bottom Left', 'theplus'), 'bottom-right' => esc_html__('Bottom Right', 'theplus'), 'left-top' => esc_html__('Left Top', 'theplus'), 'left-center' => esc_html__('Left Center', 'theplus'), 'right-top' => esc_html__('Right Top', 'theplus'), 'right-center' => esc_html__('Right Center', 'theplus'), ], 'default' => 'bottom-left', 'condition' => [ 'show_paginate' => 'yes', ], ] ); $this->add_responsive_control( 'paginate_offset_left', [ 'label' => esc_html__( 'Offset Left', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 5,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '.ps{{ID}}.fullpage-nav-paginate.bottom-left,.ps{{ID}}.fullpage-nav-paginate.left-top,.ps{{ID}}.fullpage-nav-paginate.left-center' => 'left: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_paginate' => 'yes','paginate_position' => ['bottom-left','left-top','left-center'],], ] ); $this->add_responsive_control( 'paginate_offset_right', [ 'label' => esc_html__( 'Offset Right', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 1,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '.ps{{ID}}.fullpage-nav-paginate.bottom-right,.ps{{ID}}.fullpage-nav-paginate.right-top,.ps{{ID}}.fullpage-nav-paginate.right-center' => 'right: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_paginate' => 'yes','paginate_position' => ['bottom-right','right-top','right-center'],], ] ); $this->add_responsive_control( 'paginate_offset_bottom', [ 'label' => esc_html__( 'Offset Bottom', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 1,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '.ps{{ID}}.fullpage-nav-paginate.bottom-left,.ps{{ID}}.fullpage-nav-paginate.bottom-right,.ps{{ID}}.fullpage-nav-paginate.bottom-center' => 'bottom: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_paginate' => 'yes','paginate_position' => ['bottom-left','bottom-center','bottom-right'],], ] ); $this->add_responsive_control( 'paginate_offset_top', [ 'label' => esc_html__( 'Offset Top', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => ['min' => 0,'max' => 1000,'step' => 1,], '%' => ['min' => 0,'max' => 100,], ], 'default' => ['unit' => '%','size' => 7,], 'selectors' => [ '.ps{{ID}}.fullpage-nav-paginate.left-top,.ps{{ID}}.fullpage-nav-paginate.right-top' => 'top: {{SIZE}}{{UNIT}};', ], 'condition' => ['show_paginate' => 'yes','paginate_position' => ['left-top','right-top'],], ] ); $this->end_controls_section(); /*paginate settings end*/ /*header footer selection start*/ $this->start_controls_section('section_show_header_footer_opt', [ 'label' => esc_html__('Footer Options', 'theplus'), 'condition' => [ 'page_scroll_opt' => ['tp_full_page'], ], ] ); $this->add_control( 'tp_show_header_footer_note', [ 'label' => esc_html__( 'Footer template count in Paginate.', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, ] ); $this->add_control( 'tp_show_footer', [ 'label' => esc_html__( 'Footer', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', ] ); $this->end_controls_section(); /*header footer selection end*/ /*extra option start*/ $this->start_controls_section('section_show_extra_opt', [ 'label' => esc_html__('Extra Option', 'theplus'), 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling'], ], ] ); $this->add_control( 'tp_direction', [ 'label' => esc_html__( 'Direction', 'theplus' ), 'type' => Controls_Manager::SELECT, 'default' => 'vertical', 'options' => [ 'vertical' => esc_html__( 'Vertical', 'theplus' ), 'horizontal' => esc_html__( 'Horizontal', 'theplus' ), ], 'separator' => 'after', 'condition' => [ 'page_scroll_opt!' => ['tp_full_page'], ], ] ); $this->add_control( 'tp_fp_hide_hash_id', [ 'label' => esc_html__( 'Hide Hash/id in URL', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'after', 'condition' => [ 'page_scroll_opt!' => ['tp_page_pilling'], ], ] ); $this->add_control( 'tp_keyboard_scrolling', [ 'label' => esc_html__( 'Keyboard Scrolling', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'yes', ] ); $this->add_control( 'tp_scrolling_speed', [ 'label' => esc_html__( 'Scrolling Speed', 'theplus' ), 'type' => \Elementor\Controls_Manager::NUMBER, 'min' => 5, 'max' => 5000, 'step' => 5, 'default' => 700, 'separator' => 'before', ] ); $this->add_control( 'tp_loop_bottom', [ 'label' => esc_html__( 'Loop Bottom', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'description' => esc_html__('Scrolling down in the last section should scroll to the first one or not.','theplus'), 'separator' => 'before', ] ); $this->add_control( 'tp_loop_top', [ 'label' => esc_html__( 'Loop Top', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'description' => esc_html__('Scrolling up in the first section should scroll to the last one or not.','theplus'), 'default' => 'no', ] ); $this->add_control( 'tp_tablet_off', [ 'label' => esc_html__( 'Page Pilling in Tablet', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', 'condition' => [ 'page_scroll_opt!' => ['tp_full_page'], ], ] ); $this->add_control( 'tp_mobile_off', [ 'label' => esc_html__( 'Page Pilling in Mobile', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'condition' => [ 'page_scroll_opt!' => ['tp_full_page'], ], ] ); $this->add_control( 'tp_continuous_vertical', [ 'label' => esc_html__( 'Continuous Vertical', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'separator' => 'before', 'condition' => [ 'page_scroll_opt!' => ['tp_page_pilling'], ], ] ); $this->add_control( 'tp_responsive_width', [ 'label' => esc_html__( 'Responsive Width', 'theplus' ), 'type' => Controls_Manager::SWITCHER, 'label_on' => esc_html__( 'Enable', 'theplus' ), 'label_off' => esc_html__( 'Disable', 'theplus' ), 'default' => 'no', 'condition' => [ 'page_scroll_opt!' => ['tp_page_pilling'], ], ] ); $this->add_control( 'res_width_value', [ 'label' => esc_html__( 'Responsive Width', 'theplus' ), 'type' => \Elementor\Controls_Manager::NUMBER, 'min' => 300, 'max' => 2000, 'step' => 5, 'default' => 0, 'description' => esc_html__('ex. 900 < Scroll Normal Site','theplus'), 'condition' => [ 'page_scroll_opt!' => ['tp_page_pilling'], 'tp_responsive_width' => 'yes', ], ] ); $this->end_controls_section(); /*extra option end*/ /*extra option multi scroll start*/ $this->start_controls_section( 'section_multi_extra_opt', [ 'label' => esc_html__('Extra Option', 'theplus'), 'condition' => [ 'page_scroll_opt' => 'tp_multi_scroll', ], ] ); $this->add_control( 'multi_left_width', [ 'label' => esc_html__('Left Section Width', 'theplus'), 'type' => Controls_Manager::SLIDER, 'size_units' => '%', 'default' => [ 'size' => 50 ] ] ); $this->add_control( 'multi_right_width', [ 'label' => esc_html__('Right Section Width', 'theplus'), 'type' => Controls_Manager::SLIDER, 'size_units' => '%', 'default' => [ 'size' => 50 ] ] ); $this->add_control( 'multi_keyboard_scrolling', [ 'label' => esc_html__('Keyboard Scrolling', 'theplus'), 'type' => Controls_Manager::SWITCHER, ] ); $this->add_control( 'multi_loop_top', [ 'label' => esc_html__('Loop Top', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'description' => esc_html__('Scrolling up in the first section should scroll to the last one or not.','theplus') ] ); $this->add_control( 'multi_loop_bottom', [ 'label' => esc_html__('Loop Bottom', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'description' => esc_html__('Scrolling down in the last section should scroll to the first one or not.','theplus') ] ); $this->add_control( 'multi_scrolling_speed', [ 'label' => esc_html__('Scroll Speed', 'theplus'), 'type' => Controls_Manager::NUMBER, 'title' => esc_html__('Set scrolling speed in seconds, default: 700', 'theplus'), 'default' => 700, ] ); $this->add_control( 'multi_scroll_responsive_tabs', [ 'label' => esc_html__('Disable on Tablet', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => 'no' ] ); $this->add_control('multi_scroll_responsive_mobile', [ 'label' => esc_html__('Disable on Mobiles', 'theplus'), 'type' => Controls_Manager::SWITCHER, 'default' => 'no' ] ); $this->end_controls_section(); /*extra option multi scroll end*/ /************** style tag start*****************/ /*hscroll style*/ $this->start_controls_section( 'section_hscroll_styling', [ 'label' => esc_html__('Horizontal Scroll Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'page_scroll_opt' => 'tp_horizontal_scroll', ], ] ); $this->add_group_control( Group_Control_Background::get_type(), [ 'name' => 'hscroll_normal_background', 'label' => __( 'Background', 'theplus' ), 'types' => [ 'classic', 'gradient' ], 'selector' => '{{WRAPPER}} .tp_horizontal_scroll .tp_hscroll_root', 'fields_options' => [ 'hscroll_normal_background_position' => 'center center', ], ] ); $this->end_controls_section(); /*hscroll style*/ /*dot style start*/ $this->start_controls_section( 'section_dot_styling', [ 'label' => esc_html__('Dot Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling','tp_multi_scroll'], ], ] ); $this->start_controls_tabs( 'tabs_dot_style' ); $this->start_controls_tab( 'tab_dot_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_control( 'dots_color_n', [ 'label' => esc_html__( 'Dots Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#fp-nav ul li a span' => 'background: {{VALUE}}', '#pp-nav ul li a span,#multiscroll-nav ul li a span' => 'border:1px solid {{VALUE}} !important', ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_dot_active', [ 'label' => esc_html__( 'Active', 'theplus' ), 'condition' => [ 'page_scroll_opt!' => ['tp_full_page'], ], ] ); $this->add_control( 'dots_color_h', [ 'label' => esc_html__( 'Dots Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#pp-nav ul li .active span,#multiscroll-nav ul li .active span' => 'background: {{VALUE}}', ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->add_control( 'dots_tt_head', [ 'label' => esc_html__( 'Tooltip Text Option', 'theplus' ), 'type' => \Elementor\Controls_Manager::HEADING, 'separator' => 'before', ] ); $this->add_responsive_control( 'dots_text_padding', [ 'label' => esc_html__( 'Padding', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px'], 'selectors' => [ '#fp-nav ul li .fp-tooltip,#pp-nav ul li .pp-tooltip,#multiscroll-nav ul li .multiscroll-tooltip' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'dots_text_typo_n', 'label' => esc_html__( 'Typography', 'theplus' ), 'scheme' => Typography::TYPOGRAPHY_1, 'selector' => '#fp-nav ul li .fp-tooltip,#pp-nav ul li .pp-tooltip,#multiscroll-nav ul li .multiscroll-tooltip', ] ); $this->add_control( 'dots_text_color_n', [ 'label' => esc_html__( 'Tooltip Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#fp-nav ul li .fp-tooltip,#pp-nav ul li .pp-tooltip,#multiscroll-nav ul li .multiscroll-tooltip' => 'color: {{VALUE}}', ], ] ); $this->add_control( 'dots_text_bg_color_n', [ 'label' => esc_html__( 'Tooltip Background', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#fp-nav ul li .fp-tooltip,#pp-nav ul li .pp-tooltip,#multiscroll-nav ul li .multiscroll-tooltip' => 'background: {{VALUE}}', ], ] ); $this->add_responsive_control( 'dots_tt_border', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '#fp-nav ul li .fp-tooltip,#pp-nav ul li .pp-tooltip,#multiscroll-nav ul li .multiscroll-tooltip' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], ] ); $this->end_controls_section(); /*dot style end*/ /*next previous buton start*/ $this->start_controls_section( 'section_nxt_prv_styling', [ 'label' => esc_html__('Next Previous Button Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling','tp_multi_scroll'], 'next_prev_style!' => ['custom'], ], ] ); $this->start_controls_tabs( 'tabs_nxt_prv_style' ); $this->start_controls_tab( 'tab_np_normal', [ 'label' => esc_html__( 'Normal', 'theplus' ), ] ); $this->add_control( 'np_icon_color_n', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#ps{{ID}}.fp-nxt-prev.style-1 .fp-nav-btn, #ps{{ID}}.fp-nxt-prev.style-2 .fp-nav-btn, #ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn' => 'color: {{VALUE}}', ], 'condition' => [ 'next_prev_style!' => ['style-3'], ], ] ); $this->add_control( 'np_st3_n_color_n', [ 'label' => esc_html__( 'Next Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn.fp-nav-next' => 'color: {{VALUE}}', ], 'condition' => [ 'next_prev_style' => ['style-3'], ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'np_st3_n_size_n', 'selector' => '#ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn.fp-nav-next', 'condition' => [ 'next_prev_style' => ['style-3'], ], ] ); $this->add_control( 'np_st3_p_color_n', [ 'label' => esc_html__( 'Previous Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn.fp-nav-prev' => 'color: {{VALUE}}', ], 'separator' => 'before', 'condition' => [ 'next_prev_style' => ['style-3'], ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'np_st3_p_size_n', 'selector' => '#ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn.fp-nav-prev', 'condition' => [ 'next_prev_style' => ['style-3'], ], ] ); $this->add_control( 'np_icon_bg_n', [ 'label' => esc_html__( 'Background', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{wrapper}} .fp-nxt-prev.style-1 .fp-nav-btn, {{wrapper}} .fp-nxt-prev.style-2 .fp-nav-btn' => 'background: {{VALUE}}', ], 'condition' => [ 'next_prev_style!' => ['style-3'], ], ] ); $this->add_responsive_control( 'np_icon_n_br', [ 'label' => esc_html__( 'Border Radius', 'theplus' ), 'type' => Controls_Manager::DIMENSIONS, 'size_units' => [ 'px', '%' ], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.style-1 .fp-nav-btn,{{WRAPPER}} .fp-nxt-prev.style-2 .fp-nav-btn' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};', ], 'condition' => [ 'next_prev_style!' => ['style-3'], ], ] ); $this->add_group_control( Group_Control_Box_Shadow::get_type(), [ 'name' => 'np_icon_n_bx_sdw', 'selector' => '{{WRAPPER}} .fp-nxt-prev.style-1 .fp-nav-btn,{{WRAPPER}} .fp-nxt-prev.style-2 .fp-nav-btn', 'condition' => [ 'next_prev_style!' => ['style-3'], ], ] ); $this->end_controls_tab(); $this->start_controls_tab( 'tab_np_hover', [ 'label' => esc_html__( 'Hover', 'theplus' ), ] ); $this->add_control( 'np_icon_color_h', [ 'label' => esc_html__( 'Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{wrapper}} .fp-nxt-prev.style-1 .fp-nav-btn:hover, {{wrapper}} .fp-nxt-prev.style-2 .fp-nav-btn:hover' => 'color: {{VALUE}}', ], 'condition' => [ 'next_prev_style!' => ['style-3'], ], ] ); $this->add_control( 'np_st3_n_color_h', [ 'label' => esc_html__( 'Next Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn:hover.fp-nav-next' => 'color: {{VALUE}}', ], 'condition' => [ 'next_prev_style' => ['style-3'], ], ] ); $this->add_control( 'np_st3_p_color_h', [ 'label' => esc_html__( 'Previous Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '#ps{{ID}}.fp-nxt-prev.style-3 .fp-nav-btn:hover.fp-nav-prev' => 'color: {{VALUE}}', ], 'condition' => [ 'next_prev_style' => ['style-3'], ], ] ); $this->add_control( 'np_icon_bg_h', [ 'label' => esc_html__( 'Background', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '{{wrapper}} .fp-nxt-prev.style-1 .fp-nav-btn:hover, {{wrapper}} .fp-nxt-prev.style-2 .fp-nav-btn:hover' => 'background: {{VALUE}}', ], 'condition' => [ 'next_prev_style!' => ['style-3'], ], ] ); $this->end_controls_tab(); $this->end_controls_tabs(); $this->end_controls_section(); $this->start_controls_section( 'section_nxt_prv_custom', [ 'label' => esc_html__('Next Previous Custom Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling'], 'next_prev_style' => ['custom'], ], ] ); $this->add_control( 'fp_nxt_btn', [ 'label' => esc_html__( 'Next Button Size', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1000, 'step' => 1, ], '%' => [ 'min' => 0, 'max' => 100, ], ], 'default' => [ 'unit' => 'px', 'size' => 50, ], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.custom .fp-nav-btn.fp-nav-next' => 'max-width: {{SIZE}}{{UNIT}};', ], ] ); $this->add_control( 'fp_prev_btn', [ 'label' => esc_html__( 'Preview Button Size', 'theplus' ), 'type' => Controls_Manager::SLIDER, 'size_units' => [ 'px', '%' ], 'range' => [ 'px' => [ 'min' => 0, 'max' => 1000, 'step' => 1, ], '%' => [ 'min' => 0, 'max' => 100, ], ], 'default' => [ 'unit' => 'px', 'size' => 35, ], 'selectors' => [ '{{WRAPPER}} .fp-nxt-prev.custom .fp-nav-btn.fp-nav-prev' => 'max-width: {{SIZE}}{{UNIT}};', ], ] ); $this->end_controls_section(); /*next previous buton end*/ $this->start_controls_section( 'section_paginate_custom', [ 'label' => esc_html__('Paginate Style', 'theplus'), 'tab' => Controls_Manager::TAB_STYLE, 'condition' => [ 'page_scroll_opt' => ['tp_full_page','tp_page_pilling','tp_multi_scroll'], 'show_paginate' => 'yes', ], ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'paginate_typography', 'label' => esc_html__( 'Typography', 'theplus' ), 'scheme' => Typography::TYPOGRAPHY_1, 'selector' => '.ps{{ID}}.fullpage-nav-paginate .slide-nav', ] ); $this->add_control( 'paginate_color', [ 'label' => esc_html__( 'Current Paginate Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'default' => '', 'selectors' => [ '.ps{{ID}}.fullpage-nav-paginate .slide-nav' => 'color: {{VALUE}}', ], 'separator' => 'after', ] ); $this->add_group_control( Group_Control_Typography::get_type(), [ 'name' => 'paginate_last_typography', 'label' => esc_html__( 'Typography', 'theplus' ), 'scheme' => Typography::TYPOGRAPHY_1, 'selector' => '.ps{{ID}}.fullpage-nav-paginate .total-page-nav', ] ); $this->add_control( 'paginate_last_color', [ 'label' => esc_html__( 'Total Paginate Color', 'theplus' ), 'type' => Controls_Manager::COLOR, 'selectors' => [ '.ps{{ID}}.fullpage-nav-paginate .total-page-nav' => 'color: {{VALUE}}', ], ] ); $this->end_controls_section(); /*next previous buton end*/ /************** style tag end*****************/ } protected function render() { $settings = $this->get_settings_for_display(); $page_scroll_opt = $settings['page_scroll_opt']; $uid_widget=uniqid("ps"); $id = $this->get_id(); $data_attr=''; $widget_id = 'ps'.$this->get_id(); $multi_navigation_dots = ( 'yes' == $settings['multi_navigation_dots'] ) ? true : false; $dots_text = explode(',', $settings['multi_dots_tooltips'] ); $nav_dots_text = explode(',', $settings['nav_dots_tooltips'] ); $top_loop = ( 'yes' == $settings['multi_loop_top'] ) ? true : false; $bottom_loop = ( 'yes' == $settings['multi_loop_bottom'] ) ? true : false; if((($settings['show_paginate']=='yes' && $page_scroll_opt=='tp_full_page') || ($settings['show_paginate']=='yes' && $page_scroll_opt=='tp_page_pilling') || ($settings['show_paginate']=='yes' && $page_scroll_opt=='tp_multi_scroll')) && ((!empty($settings['show_paginate']) && $page_scroll_opt=='tp_full_page') || (!empty($settings['show_paginate']) && $page_scroll_opt=='tp_page_pilling') || (!empty($settings['show_paginate']) && $page_scroll_opt=='tp_multi_scroll') )){ $data_attr .=' data-show_paginate="on"'; $data_attr .=' data-paginate_style="'.$settings['paginate_style'].'"'; $data_attr .=' data-paginate_position="'.$widget_id.' '.$settings['paginate_position'].'"'; }else{ $data_attr .=' data-show_paginate="off"'; } if((!empty($page_scroll_opt) && $page_scroll_opt=='tp_full_page') && (!empty($settings['tp_show_footer']) && $settings['tp_show_footer']=='yes')){ $data_attr .=' data-show_footer="yes"'; }else{ $data_attr .=' data-show_footer="no"'; } $show_next_prev = $settings['show_next_prev']; $next_prev_style = $settings['next_prev_style']; $fp_nav_position = $settings['fp_nav_position']; $next_prev_direction = $settings['next_prev_direction']; $nav_prev_image = (!empty($settings['nav_prev_image']['url'])) ? $settings['nav_prev_image']['url'] : ''; $nav_next_image = (!empty($settings['nav_next_image']['url'])) ? $settings['nav_next_image']['url'] : ''; $prev_size = (!empty($settings['prev_size']) && $settings['prev_size']) ? $settings['prev_size'] : ''; $nxt_txt = (!empty($settings['nxt_txt'])) ? $settings['nxt_txt'] : ''; $prev_txt = (!empty($settings['prev_txt'])) ? $settings['prev_txt'] : ''; $next_size = $settings['next_size']; $multi_scroll_options = [ 'multi_id' => esc_attr( $id ), 'dots' => $multi_navigation_dots, 'dotsTooltips' => $dots_text, 'dotsPosition' => $settings['multi_navigation_dots_pos'], 'dotsVertical' => $settings['multi_navigation_verti_dots_pos'], 'loopTop' => $top_loop, 'loopBottom' => $bottom_loop, 'disable_tablet' => ( $settings['multi_scroll_responsive_tabs'] == 'yes' ) ? 'yes' : 'no', 'disable_mobile' => ( $settings['multi_scroll_responsive_mobile'] == 'yes' ) ? 'yes' : 'no', 'keyboardScrolling' => ( $settings['multi_keyboard_scrolling'] == 'yes' ) ? true : false, 'scrollingSpeed' => ($settings["multi_scrolling_speed"]) ? $settings["multi_scrolling_speed"] : 700, 'leftSide' => !empty( $settings['multi_left_width']['size'] ) ? $settings['multi_left_width']['size'] : 50, 'rightSide' => !empty( $settings['multi_right_width']['size'] ) ? $settings['multi_right_width']['size'] : 50, ]; $this->add_render_attribute( 'multi_scroll_wrapper', 'class', 'theplus-multiscroll-wrap' ); $this->add_render_attribute( 'multi_scroll_inner', 'class', array( 'theplus-multiscroll-inner' ) ); $this->add_render_attribute( 'multi_scroll_inner', 'id', 'theplus-multiscroll-' . $id ); $this->add_render_attribute('multi_right_template', 'class', [ 'theplus-multiscroll-temp', 'theplus-multiscroll-right-temp', 'theplus-multiscroll-temp-' . $id ] ); $this->add_render_attribute('multi_left_template', 'class', [ 'theplus-multiscroll-temp', 'theplus-multiscroll-left-temp', 'theplus-multiscroll-temp-' . $id ] ); $this->add_inline_editing_attributes('left_side_text', 'advanced'); $this->add_inline_editing_attributes('right_side_text', 'advanced'); $this->add_render_attribute('left_side_text', 'class', 'theplus-multiscroll-left-text'); $this->add_render_attribute('right_side_text', 'class', 'theplus-multiscroll-right-text'); $templates = $settings['multi_left_right_repeater']; /*Full Page*/ $full_page_content=''; $full_page_anchors=array(); $fullpage_opt=array(); if($page_scroll_opt=='tp_full_page'){ if(!empty($settings["fp_content"])) { $i=1; foreach($settings["fp_content"] as $item) { if(!empty($item["fp_content_template"])){ $slideid =(!empty($item['fp-slideid'])) ? $item['fp-slideid'] : 'fp_'.$id.'_'.$i; $full_page_anchors[] = $slideid; $full_page_content .='<div class="section">'; $full_page_content .=Theplus_Element_Load::elementor()->frontend->get_builder_content_for_display($item["fp_content_template"]); $full_page_content .='</div>'; $i++; } } } if(!empty($full_page_anchors)){ $fullpage_opt['anchors']=$full_page_anchors; } $fullpage_opt["navigationTooltips"] = false; $fullpage_opt["scrollingSpeed"] = ($settings["tp_scrolling_speed"]!='') ? $settings["tp_scrolling_speed"]: 700; $fullpage_opt["responsiveWidth"] = ($settings["res_width_value"]!='') ? $settings["res_width_value"]: 0; $fullpage_opt["loopBottom"] = ( 'yes' == $settings['tp_loop_bottom'] ) ? true : false; $fullpage_opt["lockAnchors"] = ( 'yes' == $settings['tp_fp_hide_hash_id'] ) ? true : false; $fullpage_opt["loopTop"] = ( 'yes' == $settings['tp_loop_top'] ) ? true : false; $fullpage_opt["continuousVertical"] = ( 'yes' == $settings['tp_continuous_vertical'] ) ? true : false; $fullpage_opt["keyboardScrolling"] = ( 'yes' == $settings['tp_keyboard_scrolling'] ) ? true : false; if(($settings['show_dots']=='yes' && $page_scroll_opt=='tp_full_page') && (!empty($settings['show_dots']) && $page_scroll_opt=='tp_full_page')){ //$data_attr .=' data-nav="true"'; $fullpage_opt["navigation"] = true; $fullpage_opt["navigationPosition"] = (!empty($settings['nav_postion']) && $settings['nav_postion']=='left') ? 'left' : 'right'; $fullpage_opt['navigationTooltips']=$nav_dots_text; }else{ $fullpage_opt["navigation"] = false; } $data_fullpage=json_encode($fullpage_opt); $data_attr .= ' data-full-page-opt=\'' . $data_fullpage . '\''; if(!empty($settings['scroll_nav_connection']) && $settings['scroll_nav_connection']=='yes' && !empty($settings['scrollnav_connect_id'])){ $data_attr .= ' data-scroll-nav-id="tp-sc-'.esc_attr($settings['scrollnav_connect_id']).'"'; } } /*Page Piling*/ $page_piling_content=''; $page_piling_anchors=array(); $page_piling_opt=array(); if($page_scroll_opt=='tp_page_pilling'){ $i=1; if(!empty($settings["fp_content"])) { $page_piling_content .= '<div id="pagepiling">'; foreach($settings["fp_content"] as $item) { if(!empty($item["fp_content_template"])){ $slideid =(!empty($item['fp-slideid'])) ? $item['fp-slideid'] : 'fp_'.$id.'_'.$i; $page_piling_anchors[] = $slideid; $page_piling_content .= '<div class="section pp_section">'; $page_piling_content .= Theplus_Element_Load::elementor()->frontend->get_builder_content_for_display($item["fp_content_template"]); $page_piling_content .='</div>'; } $i++; } $page_piling_content .='</div>'; } if(!empty($page_piling_anchors)){ $page_piling_opt['anchors']=$page_piling_anchors; } $page_piling_opt["scrollingSpeed"] = ($settings["tp_scrolling_speed"]!='') ? $settings["tp_scrolling_speed"]: 700; $page_piling_opt["loopBottom"] = ( 'yes' == $settings['tp_loop_bottom'] ) ? true : false; $page_piling_opt["loopTop"] = ( 'yes' == $settings['tp_loop_top'] ) ? true : false; $page_piling_opt["pp_tablet_off"] = ( 'yes' == $settings['tp_tablet_off'] ) ? 'yes' : 'no'; $page_piling_opt["pp_mobile_off"] = ( 'yes' == $settings['tp_mobile_off'] ) ? 'yes' : 'no'; $page_piling_opt["keyboardScrolling"] = ( 'yes' == $settings['tp_keyboard_scrolling'] ) ? true : false; $page_piling_opt['direction']=(!empty($settings["tp_direction"])) ? $settings["tp_direction"] : 'vertical'; if(($settings['show_dots']=='yes' && $page_scroll_opt=='tp_page_pilling') && (!empty($settings['show_dots']) && $page_scroll_opt=='tp_page_pilling')){ $page_piling_opt["navigation"]["display"] = true; $page_piling_opt["navigation"]["position"] = (!empty($settings['nav_postion']) && $settings['nav_postion']=='left') ? 'left' : 'right'; $page_piling_opt["navigation"]["tooltips"]=$nav_dots_text; }else{ $page_piling_opt["navigation"]["display"] = false; $page_piling_opt["navigation"]["position"] =''; $page_piling_opt["navigation"]["tooltips"]=''; } $pagepiling_opt=json_encode($page_piling_opt); $data_attr .= ' data-page-piling-opt=\'' . $pagepiling_opt . '\''; if(!empty($settings['scroll_nav_connection']) && $settings['scroll_nav_connection']=='yes' && !empty($settings['scrollnav_connect_id'])){ $data_attr .= ' data-scroll-nav-id="tp-sc-'.esc_attr($settings['scrollnav_connect_id']).'"'; } } //Multiscroll $multiscroll_anchors = array(); $multi_scroll_opt=array(); if($page_scroll_opt=='tp_multi_scroll'){ if(!empty($settings["multi_left_right_repeater"])) { $i=1; foreach($settings["multi_left_right_repeater"] as $item) { if(!empty($item["multi_left_template"]) && !empty($item["multi_right_template"])){ $slideid =(!empty($item['fp-slideid'])) ? $item['fp-slideid'] : 'fp_'.$id.'_'.$i; $multiscroll_anchors[] = $slideid; } $i++; } } if(!empty($multiscroll_anchors)){ $multi_scroll_opt['anchors']=$multiscroll_anchors; } $multiscroll_opt=json_encode($multi_scroll_opt); $data_attr .= ' data-multi-scroll-opt=\'' . $multiscroll_opt . '\''; if(!empty($settings['scroll_nav_connection']) && $settings['scroll_nav_connection']=='yes' && !empty($settings['scrollnav_connect_id'])){ $data_attr .= ' data-scroll-nav-id="tp-sc-'.esc_attr($settings['scrollnav_connect_id']).'"'; } } $pp_tab_off=$pp_mob_off=''; if((!empty($settings['tp_tablet_off']) && $settings['tp_tablet_off']=='yes') || (!empty($settings['multi_scroll_responsive_tabs']) && $settings['multi_scroll_responsive_tabs']=='yes')){ $pp_tab_off = 'tp_tablet_off'; } if((!empty($settings['tp_mobile_off']) && $settings['tp_mobile_off']=='yes') || (!empty($settings['multi_scroll_responsive_mobile']) && $settings['multi_scroll_responsive_mobile']=='yes')){ $pp_mob_off = 'tp_mobile_off'; } //Horizontal Scroll HScroll $hslides = array(); $hslide_width = array(); $hslide_loop = $hslide_id = ''; if($page_scroll_opt=='tp_horizontal_scroll'){ $i=0; if(!empty($settings["hscroll_content"])) { foreach($settings["hscroll_content"] as $slide){ $slide_template = $slide['hslide_template']; $slide_id = $i; $slide_id2 = $slide_id; if ($slide_id == 0) { $slide_id2 = 'first'; } if ($slide_id == count($settings['hscroll_content']) - 1) { $slide_id2 = 'last'; } $margin_style =''; if($slide["hslide_align"]== 'top'){ $margin_style = 'margin-top:0; margin-bottom:0;'; } if($slide["hslide_align"]== 'bottom'){ $margin_style = 'margin-bottom:0;'; } if(!empty($slide_template)){ $width = $slide['hslide_width']['size'].$slide['hslide_width']['unit']; $hslide_margin_l = ($slide["hslide_margin"]['left']) ? $slide["hslide_margin"]['left'] : 0; $hslide_margin_r = ($slide["hslide_margin"]['right']) ? $slide["hslide_margin"]['right'] : 0; $hslide_width[] = $width.' + '.($hslide_margin_l + $hslide_margin_r).$slide["hslide_margin"]['unit']; if (isset($slide['hslide_id']) && $slide['hslide_id'] != '') { $hslide_id .= "'#$slide[hslide_id]': 'tp_hscroll_slide_$slide_id', "; } $slide_html = Theplus_Element_Load::elementor()->frontend->get_builder_content_for_display($slide_template); $hslide_loop .='<div id="tp_hscroll_slide_'.esc_attr($slide_id).'" class="tp_hscroll_slide tp_hscroll_slide_'.esc_attr($slide_id2).' elementor-repeater-item-' . esc_attr($slide['_id']) . '" data-slide-width="'.esc_attr($width).'" style="width: '.esc_attr($width).';'.$margin_style.'" >'; $hslide_loop .= $slide_html; $hslide_loop .='</div>'; $i++; } } } $hscroll_speed = $settings['hscroll_speed']['size']; $hscroll_sec_id_transition = $settings['hscroll_sec_id_transition']['size']; $hscroll_responsive = $settings['hscroll_responsive'] === 'yes'; $hscroll_scrollbar = $settings['hscroll_scrollbar'] === 'yes'; $hscroll_draggable = $settings['hscroll_draggable'] === 'yes'; $hscroll_res_minwidth = 0; $hscroll_footer_height = $settings['hscroll_footer_height']['size'].$settings['hscroll_footer_height']['unit']; if (!empty($hscroll_responsive)) { $hscroll_res_minwidth = $settings['hscroll_res_minwidth']['size']; } $style_script_rules = ''; $style_script_rules .= '<style>.tp_hscroll_root{width: calc('.implode(' + ', $hslide_width).');} .tp_hscroll_footer { display: flex; background: transparent; border: 0; top: 0; z-index: 0; position: absolute; } </style>'; $style_script_rules .= '<script type="text/javascript"> (function($) { $(document).ready(function() { if($(".tp_hscroll_scrollable").length){ $("body").addClass("tp-horizontal-scroll"); var scrollbar = "'.$hscroll_scrollbar.'"; if(scrollbar!=true){ $("body").addClass("tp-scroll-bar"); } } var hscroll_elem = $.jInvertScroll([".tp_hscroll_scrollable"], { height: ($(".tp_hscroll_root").width() / '.$hscroll_speed.'), footer_height: $(".tp_hscroll_footer").height(), onScroll: function(percent) { var pageWrapper = $(".plus-scroll-sections-bg"); if(pageWrapper.length){ var parent_id=pageWrapper.parent().data("elementor-id"); var windowidth = $(window).width(); var arry_index = []; if($(".elementor .elementor-inner").length){ var abc = ".elementor-"+parent_id+"> .elementor-inner > .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide"; }else{ var abc = ".elementor-"+parent_id+"> .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide"; } $(abc).each(function(){ var el = $(this); var el_begin = el.offset().left; var el_end = el.outerWidth(); var animationEndpos = el_begin + el_end - windowidth; arry_index[el.index()] = animationEndpos; }); if($("body").hasClass("rtl")){ arry_index=arry_index.reverse(); } $.each( arry_index, function( key, value ) { if( 0<=(value+300)){ if($(".elementor .elementor-inner").length){ var index = $(".elementor-"+parent_id+"> .elementor-inner > .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide.active-sec:nth-child("+(key+1)+")"); }else{ var index = $(".elementor-"+parent_id+"> .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide.active-sec:nth-child("+(key+1)+")"); } index = index.index(); if( index != key ){ if($(".elementor .elementor-inner").length){ $(".elementor-"+parent_id+"> .elementor-inner > .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide").removeClass("active-sec"); $(".elementor-"+parent_id+"> .elementor-inner > .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide").eq(key).addClass("active-sec"); }else{ $(".elementor-"+parent_id+"> .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide").removeClass("active-sec"); $(".elementor-"+parent_id+"> .elementor-section-wrap > .elementor-element .tp_horizontal_scroll .tp_hscroll_slide").eq(key).addClass("active-sec"); } pageWrapper.find(".plus-section-bg-scrolling").removeClass("active_sec"); pageWrapper.find(".plus-section-bg-scrolling:nth-child("+(key+1)+")").addClass("active_sec"); } return false; } }); } } }); var draggable = "'.$hscroll_draggable.'"; if(draggable!=undefined && draggable=="1"){ var mouseclicked = false, clickX; $(document).on({ "mousemove": function(e) { mouseclicked && dragHscrollPos(e); }, "touchmove": function(e) { mouseclicked && dragHscrollPos(e); }, "mousedown": function(e) { mouseclicked = true; clickX = e.pageX; }, "touchstart": function(e) { var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; mouseclicked = true; clickX = touch.pageX; }, "touchend": function(e) { var touch = e.originalEvent.touches[0] || e.originalEvent.changedTouches[0]; mouseclicked = false; clickX = touch.pageX; }, "mouseup": function() { mouseclicked = false; $("html").css("cursor", "auto"); } }); var dragHscrollPos = function(e) { $("html").css("cursor", "grabbing"); var curr = (e.pageX!=undefined) ? e.pageX : e.originalEvent.touches[0].pageX; $(window).scrollTop($(window).scrollTop() + ((clickX - curr)/30)); } $("head").append("<style>body{-webkit-touch-callout: none;-webkit-user-select: none;-khtml-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}</style>"); } var hscroll_Animation = function(e){ let window_height = $(window).height(); let window_width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; let sec_id = $(this); let hscroll_section_id = { '.$hslide_id.' }; if (!$(sec_id.attr("href")).selector in hscroll_section_id){ return true; } //let checkID = hscroll_section_id[$(sec_id.attr("href")).selector]; let checkID = hscroll_section_id[$(this).attr("href")]; let hscroll_width = $(".tp_hscroll_root").width(); let check_width = hscroll_width - window_width; if (check_width < 0) { check_width = 0; } if($("#"+checkID).length){ var hscroll_calc = (hscroll_width / '.$hscroll_speed.') - $(".tp_hscroll_footer").height() - window_height; $("html, body").stop().animate({ scrollTop: ($("#"+checkID).position().left * hscroll_calc)/check_width, }, '.$hscroll_sec_id_transition.'); e.preventDefault(); } return false; }; var closeAnimation = function(e) { return true; }; '.($hscroll_responsive ? ' var hscroll_checkresponsive = function(){ window_width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; if (window_width > '.$hscroll_res_minwidth.') { hscroll_elem.reinitialize(); $("a[href*=\'#\']").off("click", closeAnimation); $("a[href*=\'#\']").on("click", hscroll_Animation); $(".tp_hscroll_root,.tp-page-scroll-wrapper").css({"height":"100vh","overflow":"hidden"}); $(".tp_hscroll_root").css({"width": "","display": "flex","position": "fixed","height": "100vh","z-index": "1000"}); $(".tp_hscroll_slide").css({"display":"inline-block"}); $(".tp_hscroll_slide").each(function(){ var width = $(this).data("slide-width"); $(this).css({"width": width}); }); }else { hscroll_elem.destroy(); $("body").removeClass("tp-horizontal-scroll"); $("a[href*=\'#\']").off("click", hscroll_Animation); $("a[href*=\'#\']").on("click", closeAnimation); $(".tp_hscroll_root,.tp-page-scroll-wrapper").css({"height":"auto","overflow":"visible"}); $(".tp_hscroll_slide").css({"display":"block","width":"100%"}); $(".tp_hscroll_root").css({"width": "auto","display": "block","position": "relative","height": "auto","z-index": "auto"}); } } hscroll_checkresponsive(); $(window).on("resize",function() { hscroll_checkresponsive(); });' : 'var hscroll_checkresponsive = function(){ hscroll_elem.reinitialize(); $("a[href*=\'#\']").off("click", closeAnimation); $("a[href*=\'#\']").on("click", hscroll_Animation); } hscroll_checkresponsive(); $(window).on("resize",function() { hscroll_checkresponsive(); });').' }); }(jQuery));</script>'; //Hscroll Bg Scrolling if(!empty($settings["hscroll_bg"]) && $settings["hscroll_bg"]=='yes'){ $widget_id = 'scroll'.$this->get_id(); $bgs =array(); $sec_colors=''; $i=0; $hscroll_loop=''; $hscroll_bg_duration = (!empty($settings["hscroll_bg_duration"]["size"])) ? 'transition-duration:'.$settings["hscroll_bg_duration"]["size"].$settings["hscroll_bg_duration"]["unit"].';' : ''; if(!empty($settings['hscroll_content'])){ foreach($settings['hscroll_content'] as $item) { if(!empty($slide['hslide_template'])){ $active_sec=''; if(!empty($item['scroll_bg_color']) && empty($item['scroll_bg_image']['url'])) { $bgs[]=$item['scroll_bg_color']; if($i==0){ $active_sec='active_sec'; } $hscroll_loop .= '<div class="elementor-repeater-item-' . $item['_id'] . ' plus-section-bg-scrolling '.esc_attr($active_sec).'" style="background:'.esc_attr($item['scroll_bg_color']).';'.$hscroll_bg_duration.'"></div>'; } if(!empty($item['scroll_bg_image']['url'])) { $bgs[]=$item['scroll_bg_image']['url']; if($i==0){ $active_sec='active_sec'; } $hscroll_loop .= '<div class="elementor-repeater-item-' . $item['_id'] . ' plus-section-bg-scrolling '.esc_attr($active_sec).'" style="background:url('.esc_url($item['scroll_bg_image']['url']).');'.$hscroll_bg_duration.'"></div>'; } $i++; } } $sec_colors=htmlspecialchars(json_encode($bgs), ENT_QUOTES, 'UTF-8'); $sec_colors ='data-bg-colors="'.$sec_colors.'"'; } if(!empty($settings["hscroll_page_full"]) && $settings["hscroll_page_full"]=='relative'){ $sec_colors .=' data-position="relative"'; }else{ $sec_colors .=' data-position="inherit"'; } $style_script_rules .='<div class="plus-scroll-sections-bg '.esc_attr($widget_id).'" data-id="'.esc_attr($widget_id).'" '.$sec_colors.' style="'.$hscroll_bg_duration.'">'.$hscroll_loop.'</div>'; } } echo '<div id="'.$uid_widget.'" class="tp-page-scroll-wrapper '.$uid_widget.' '.$page_scroll_opt.' '.$pp_tab_off.' '.$pp_mob_off.'" data-id="'.$uid_widget.'" data-option="'.esc_attr($page_scroll_opt).'" '.$data_attr.'>'; if($page_scroll_opt=='tp_full_page'){ echo $full_page_content; } if($page_scroll_opt=='tp_page_pilling'){ echo $page_piling_content; } if($page_scroll_opt=='tp_horizontal_scroll'){ ?> <div class="tp_hscroll_footer" style="height: <?php echo $hscroll_footer_height; ?> "></div> <div class="tp_hscroll_full_background tp_hscroll_scrollable tp_hscroll_root" style="z-index: 0"></div> <div class='tp_hscroll_scrollable tp_hscroll_root'> <?php echo $hslide_loop; ?> <?php echo $style_script_rules; ?> </div> <?php } if($page_scroll_opt=='tp_multi_scroll'){ ?> <div <?php echo $this->get_render_attribute_string('multi_scroll_wrapper'); ?> data-settings='<?php echo wp_json_encode($multi_scroll_options); ?>'> <div <?php echo $this->get_render_attribute_string('multi_scroll_inner'); ?>> <div class="<?php echo 'theplus-multiscroll-left-' . esc_attr($id); ?>"> <?php foreach( $templates as $index => $section ) : ?> <div <?php echo $this->get_render_attribute_string('multi_left_template'); ?>> <?php if(!empty($section['multi_left_template']) ){ echo Theplus_Element_Load::elementor()->frontend->get_builder_content_for_display($section['multi_left_template']); } ?> </div> <?php endforeach; ?> </div> <div class="<?php echo 'theplus-multiscroll-right-' . esc_attr($id); ?>"> <?php foreach( $templates as $index => $section ) : ?> <div <?php echo $this->get_render_attribute_string('multi_right_template'); ?>> <?php if(!empty($section['multi_right_template'])){ echo Theplus_Element_Load::elementor()->frontend->get_builder_content_for_display($section['multi_right_template']); } ?> </div> <?php endforeach; ?> </div> </div> </div> <?php } echo '</div>'; $mob_hidden_class = ''; if($settings['multi_scroll_responsive_mobile']=='yes'){ $mob_hidden_class = 'ms-mobs-hidd'; } $tabs_hidden_class = ''; if($settings['multi_scroll_responsive_tabs']=='yes'){ $tabs_hidden_class = 'ms-tabs-hidd'; } if(!empty($show_next_prev) && $show_next_prev=='yes'){ echo '<div id="ps'.$id.'" class="fp-nxt-prev '.esc_attr($mob_hidden_class).' '.esc_attr($tabs_hidden_class).' '.esc_attr($next_prev_style).' '.esc_attr($fp_nav_position).' '.esc_attr($next_prev_direction).'">'; if($next_prev_style=='style-1' || $next_prev_style=='style-2'){ echo '<div class="fp-nav-btn fp-nav-prev '.esc_attr($prev_size).'"><i class="fa fa-angle-left" aria-hidden="true"></i></div>'; echo '<div class="fp-nav-btn fp-nav-next '.esc_attr($next_size).'"><i class="fa fa-angle-right" aria-hidden="true"></i></div>'; }elseif($next_prev_style=='style-3'){ echo '<div class="fp-nav-btn fp-nav-prev">'.esc_attr($prev_txt).'</div>'; echo '<div class="fp-nav-btn fp-nav-next">'.esc_attr($nxt_txt).'</div>'; }elseif($next_prev_style=='custom' && !empty($nav_prev_image) && !empty($nav_next_image)){ echo '<div class="fp-nav-btn fp-nav-prev"><img src="'.esc_url($nav_prev_image).'"></div>'; echo '<div class="fp-nav-btn fp-nav-next"><img src="'.esc_url($nav_next_image).'"></div>'; } echo '</div>'; } } }