<?php
/**
 * Class: Premium_Charts
 * Name: Charts
 * Slug: premium-chart
 */

namespace PremiumAddonsPro\Widgets;

// PremiumAddonsPro Classes.
use PremiumAddonsPro\Includes\PAPRO_Helper;

// Elementor Classes.
use Elementor\Plugin;
use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Core\Kits\Documents\Tabs\Global_Colors;
use Elementor\Core\Kits\Documents\Tabs\Global_Typography;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Typography;
use Elementor\Group_Control_Text_Shadow;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Background;

// PremiumAddons Classes.
use PremiumAddons\Includes\Helper_Functions;

if ( ! defined( 'ABSPATH' ) ) {
	exit; // If this file is called directly, abort.
}

/**
 * Class Premium_Charts
 */
class Premium_Charts extends Widget_Base {

	/**
	 * Retrieve Widget Name.
	 *
	 * @since 1.0.0
	 * @access public
	 */
	public function get_name() {
		return 'premium-chart';
	}

	/**
	 * Retrieve Widget Title.
	 *
	 * @since 1.0.0
	 * @access public
	 */
	public function get_title() {
		return __( 'Charts', 'premium-addons-pro' );
	}

	/**
	 * Retrieve Widget Icon.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string widget icon.
	 */
	public function get_icon() {
		return 'pa-pro-charts';
	}

	/**
	 * Retrieve Widget Keywords.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return string Widget keywords.
	 */
	public function get_keywords() {
		return array( 'pa', 'premium', 'premium charts', 'data', 'graph', 'bar', 'circle', 'dynamic', 'statistic' );
	}

    protected function is_dynamic_content():bool {
        return false;
    }

	/**
	 * Retrieve Widget Categories.
	 *
	 * @since 1.5.1
	 * @access public
	 *
	 * @return array Widget categories.
	 */
	public function get_categories() {
		return array( 'premium-elements' );
	}

	/**
	 * Retrieve Widget Dependent CSS.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return array CSS style handles.
	 */
	public function get_style_depends() {
		return array(
			'premium-pro',
		);
	}

	/**
	 * Retrieve Widget Dependent JS.
	 *
	 * @since 1.0.0
	 * @access public
	 *
	 * @return array JS script handles.
	 */
	public function get_script_depends() {
		return array(
			'pa-charts',
			'premium-pro',
		);
	}

	/**
	 * Widget preview refresh button.
	 *
	 * @since 1.0.0
	 * @access public
	 */
	public function is_reload_preview_required() {
		return true;
	}

	/**
	 * Retrieve Widget Support URL.
	 *
	 * @access public
	 *
	 * @return string support URL.
	 */
	public function get_custom_help_url() {
		return 'https://www.youtube.com/watch?v=lZZvslQ2UYU&list=PLLpZVOYpMtTArB4hrlpSnDJB36D2sdoTv';
	}

    public function has_widget_inner_wrapper(): bool {
        return ! Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
    }

	/**
	 * Register Charts controls.
	 *
	 * @since 1.0.0
	 * @access protected
	 */
	protected function register_controls() { // phpcs:ignore PSR2.Methods.MethodDeclaration.Underscore

		$this->start_controls_section(
			'general_settings',
			array(
				'label' => __( 'Premium Charts', 'premium-addons-pro' ),
			)
		);

		$this->add_control(
			'data_source',
			array(
				'label'              => __( 'Data Source', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'default'            => 'custom',
				'options'            => array(
					'custom' => __( 'Custom', 'premium-addons-pro' ),
					'csv'    => 'CSV' . __( ' File', 'premium-addons-pro' ),
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'type',
			array(
				'label'              => __( 'Layout', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'line'          => __( 'Line', 'premium-addons-pro' ),
					'bar'           => __( 'Bar', 'premium-addons-pro' ),
					'horizontalBar' => __( 'Horizontal Bar', 'premium-addons-pro' ),
					'pie'           => __( 'Pie', 'premium-addons-pro' ),
					'radar'         => __( 'Radar', 'premium-addons-pro' ),
					'doughnut'      => __( 'Doughnut', 'premium-addons-pro' ),
					'polarArea'     => __( 'Polar Area', 'premium-addons-pro' ),

				),
				'default'            => 'bar',
				'label_block'        => true,
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'csv_type',
			array(
				'label'     => __( 'File Type', 'premium-addons-pro' ),
				'type'      => Controls_Manager::SELECT,
				'options'   => array(
					'file' => __( 'Upload FIle', 'premium-addons-pro' ),
					'url'  => __( 'Remote File', 'premium-addons-pro' ),
				),
				'condition' => array(
					'data_source' => 'csv',
				),
				'default'   => 'file',
			)
		);

		$this->add_control(
			'premium_chart_separator',
			array(
				'label'       => __( 'Data Separator', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'description' => __( 'Separator between cells data', 'premium-addons-pro' ),
				'label_block' => true,
				'default'     => ',',
				'condition'   => array(
					'data_source' => 'csv',
				),
			)
		);

		$this->add_control(
			'csv_file',
			array(
				'label'      => __( 'Upload CSV File', 'premium-addons-pro' ),
				'type'       => Controls_Manager::MEDIA,
				'dynamic'    => array( 'active' => true ),
				'media_type' => array(),
				'condition'  => array(
					'data_source' => 'csv',
					'csv_type'    => 'file',
				),
			)
		);

		$this->add_control(
			'csv_url',
			array(
				'label'       => __( 'File URL', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'dynamic'     => array( 'active' => true ),
				'label_block' => true,
				'condition'   => array(
					'data_source' => 'csv',
					'csv_type'    => 'url',
				),
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'x_axis',
			array(
				'label' => __( 'X-Axis', 'premium-addons-pro' ),
			)
		);

		$this->add_control(
			'x_axis_label_switch',
			array(
				'label'              => __( 'Show Axis Label', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'description'        => __( 'Show or Hide X-Axis Label', 'premium-addons-pro' ),
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_label',
			array(
				'label'              => __( 'Label', 'premium-addons-pro' ),
				'type'               => Controls_Manager::TEXT,
				'dynamic'            => array( 'active' => true ),
				'default'            => 'X-Axis',
				'label_block'        => true,
				'condition'          => array(
					'x_axis_label_switch' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_labels',
			array(
				'label'              => __( 'Data Labels', 'premium-addons-pro' ),
				'type'               => Controls_Manager::TEXT,
				'dynamic'            => array( 'active' => true ),
				'default'            => 'Jan,Feb,Mar,Apr,May',
				'description'        => __( 'Enter labels for X-Axis separated with \' , \' ', 'premium-addons-pro' ),
				'label_block'        => true,
				'condition'          => array(
					'data_source' => 'custom',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_grid',
			array(
				'label'              => __( 'Show Grid Lines', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'default'            => 'true',
				'description'        => __( 'Show or Hide X-Axis Grid Lines', 'premium-addons-pro' ),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_begin',
			array(
				'label'              => __( 'Begin at Zero', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'return_value'       => 'true',
				'description'        => __( 'Start X-Axis Labels at zero', 'premium-addons-pro' ),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_label_rotation',
			array(
				'label'              => __( 'Labels\' Rotation ', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 0,
				'max'                => 360,
				'default'            => 0,
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_column_width',
			array(
				'label'              => __( 'Column Width', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SLIDER,
				'range'              => array(
					'px' => array(
						'min'  => 0,
						'max'  => 1,
						'step' => 0.1,
					),
				),
				'condition'          => array(
					'type' => 'bar',
				),
				'frontend_available' => true,
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'y_axis',
			array(
				'label' => __( 'Y-Axis', 'premium-addons-pro' ),
			)
		);

		$this->add_control(
			'y_axis_label_switch',
			array(
				'label'              => __( 'Show Axis Label', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'description'        => __( 'Show or Hide Y-Axis Label', 'premium-addons-pro' ),
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_label',
			array(
				'label'              => __( 'Label', 'premium-addons-pro' ),
				'type'               => Controls_Manager::TEXT,
				'dynamic'            => array( 'active' => true ),
				'default'            => 'Y-Axis',
				'label_block'        => true,
				'condition'          => array(
					'y_axis_label_switch' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$data_repeater = new REPEATER();

		$data_repeater->add_control(
			'y_axis_column_title',
			array(
				'label'   => __( 'Title', 'premium-addons-pro' ),
				'type'    => Controls_Manager::TEXT,
				'dynamic' => array( 'active' => true ),
			)
		);

		$data_repeater->add_control(
			'y_axis_column_data',
			array(
				'label'       => __( 'Data', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'description' => __( 'Enter Data Numbers for Y-Axis separated with \' , \' ', 'premium-addons-pro' ),
				'dynamic'     => array( 'active' => true ),

			)
		);

		$data_repeater->add_control(
			'y_axis_urls',
			array(
				'label'       => __( 'URLs', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'description' => __( 'Enter URLs for each Dataset separated with \' , \' ', 'premium-addons-pro' ),
				'label_block' => true,
			)
		);

		$data_repeater->add_control(
			'fill_colors_notice',
			array(
				'raw'             => '<strong>' . __( 'Please note!', 'premium-addons-pro' ) . '</strong> ' . __( 'First/Second Fill Color options used together to add a gradient for all charts except Pie, Dounut and Polar Area, Fill Colors option used to add multiple colors, but please make sure First/Second Color options are cleared.', 'premium-addons-pro' ),
				'type'            => Controls_Manager::RAW_HTML,
				'content_classes' => 'elementor-panel-alert elementor-panel-alert-warning',
			)
		);

		$data_repeater->add_control(
			'y_axis_column_color',
			array(
				'label' => __( 'First Fill Color', 'premium-addons-pro' ),
				'type'  => Controls_Manager::COLOR,
			)
		);

		$data_repeater->add_control(
			'y_axis_column_second_color',
			array(
				'label' => __( 'Second Fill Color', 'premium-addons-pro' ),
				'type'  => Controls_Manager::COLOR,
			)
		);

		$data_repeater->add_control(
			'y_axis_circle_color',
			array(
				'label'       => __( 'Fill Colors', 'premium-addons-pro' ),
				'description' => __( 'Enter Colors separated with \' , \', this will work only for pie, doughnut and polar area charts ', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => '#ff6384,#4bc0c0,#ffcd56,#c9cbcf,#36a2eb',
				'dynamic'     => array( 'active' => true ),
				'label_block' => true,
			)
		);

		$data_repeater->add_control(
			'y_axis_column_border_width',
			array(
				'label'   => __( 'Border Width', 'premium-addons-pro' ),
				'default' => 1,
				'type'    => Controls_Manager::NUMBER,
			)
		);

		$data_repeater->add_control(
			'y_axis_column_border_color',
			array(
				'label'   => __( 'Border Color', 'premium-addons-pro' ),
				'type'    => Controls_Manager::COLOR,
				'default' => '#fff',
			)
		);

		$this->add_control(
			'y_axis_data',
			array(
				'label'     => __( 'Data', 'premium-addons-pro' ),
				'type'      => Controls_Manager::REPEATER,
				'default'   => array(
					array(
						'y_axis_column_title' => __( 'Dataset #1', 'premium-addons-pro' ),
						'y_axis_column_data'  => '1,5,2,3,7',
						'y_axis_column_color' => '#6ec1e4',
					),
					array(
						'y_axis_column_title' => __( 'Dataset #2', 'premium-addons-pro' ),
						'y_axis_column_data'  => '2,10,1,5,4',
						'y_axis_column_color' => '#54595F',

					),
				),
				'fields'    => $data_repeater->get_controls(),
				'condition' => array(
					'data_source' => 'custom',
				),
			)
		);

		$csv_repeater = new REPEATER();

		$csv_repeater->add_control(
			'dataset_title',
			array(
				'label'   => __( 'Title', 'premium-addons-pro' ),
				'type'    => Controls_Manager::TEXT,
				'dynamic' => array( 'active' => true ),
			)
		);

		$csv_repeater->add_control(
			'dataset_color',
			array(
				'label' => __( 'Fill Color', 'premium-addons-pro' ),
				'type'  => Controls_Manager::COLOR,
			)
		);

		$csv_repeater->add_control(
			'circle_color',
			array(
				'label'       => __( 'Fill Colors', 'premium-addons-pro' ),
				'description' => __( 'Enter Colors separated with \' , \', this will work only for pie, doughnut and polar area charts ', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => '#ff6384,#4bc0c0,#ffcd56,#c9cbcf,#36a2eb',
				'dynamic'     => array( 'active' => true ),
				'label_block' => true,
			)
		);

		$csv_repeater->add_control(
			'border_width',
			array(
				'label'   => __( 'Border Width', 'premium-addons-pro' ),
				'default' => 1,
				'type'    => Controls_Manager::NUMBER,
			)
		);

		$csv_repeater->add_control(
			'dataset_border_color',
			array(
				'label'   => __( 'Border Color', 'premium-addons-pro' ),
				'type'    => Controls_Manager::COLOR,
				'default' => '#fff',
			)
		);

		$this->add_control(
			'dataset_repeater',
			array(
				'label'     => __( 'Data', 'premium-addons-pro' ),
				'type'      => Controls_Manager::REPEATER,
				'default'   => array(
					array(
						'dataset_title' => __( 'Dataset #1', 'premium-addons-pro' ),
						'dataset_color' => '#6ec1e4',
					),
					array(
						'dataset_title' => __( 'Dataset #2', 'premium-addons-pro' ),
						'dataset_color' => '#54595F',

					),
				),
				'fields'    => $csv_repeater->get_controls(),
				'condition' => array(
					'data_source' => 'csv',
				),
			)
		);

		$this->add_control(
			'data_type',
			array(
				'label'              => __( 'Data Type', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'linear'      => __( 'Linear', 'premium-addons-pro' ),
					'logarithmic' => __( 'Logarithmic', 'premium-addons-pro' ),
				),
				'default'            => 'linear',
				'condition'          => array(
					'type!' => 'horizontalBar',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_grid',
			array(
				'label'              => __( 'Show Grid Lines', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'default'            => 'true',
				'description'        => __( 'Show or Hide Y-Axis Grid Lines', 'premium-addons-pro' ),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_begin',
			array(
				'label'              => __( 'Begin at Zero', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'default'            => 'true',
				'return_value'       => 'true',
				'description'        => __( 'Start Y-Axis Data at zero', 'premium-addons-pro' ),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_urls_target',
			array(
				'label'              => __( 'Open Links in new tab', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'default'            => 'true',
				'condition'          => array(
					'data_source' => 'custom',
				),
				'frontend_available' => true,
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'title_content',
			array(
				'label' => __( 'Title', 'premium-addons-pro' ),
			)
		);

		$this->add_control(
			'title_switcher',
			array(
				'label'        => __( 'Title', 'premium-addons-pro' ),
				'type'         => Controls_Manager::SWITCHER,
				'return_value' => 'true',
			)
		);

		$this->add_control(
			'title',
			array(
				'label'       => __( 'Title', 'premium-addons-pro' ),
				'type'        => Controls_Manager::TEXT,
				'description' => __( 'Enter a Title for the Chart', 'premium-addons-pro' ),
				'label_block' => true,
				'dynamic'     => array( 'active' => true ),
				'condition'   => array(
					'title_switcher' => 'true',
				),
			)
		);

		$this->add_control(
			'title_tag',
			array(
				'label'       => __( 'HTML Tag', 'premium-addons-pro' ),
				'type'        => Controls_Manager::SELECT,
				'default'     => 'h3',
				'options'     => array(
					'h1' => 'H1',
					'h2' => 'H2',
					'h3' => 'H3',
					'h4' => 'H4',
					'h5' => 'H5',
					'h6' => 'H6',
				),
				'label_block' => true,
				'condition'   => array(
					'title_switcher' => 'true',
				),
			)
		);

		$this->add_control(
			'title_position',
			array(
				'label'     => __( 'Position', 'premium-addons-pro' ),
				'type'      => Controls_Manager::SELECT,
				'options'   => array(
					'top'    => __( 'Top', 'premium-addons-pro' ),
					'bottom' => __( 'Bottom', 'premium-addons-pro' ),
				),
				'default'   => 'top',
				'condition' => array(
					'title_switcher' => 'true',
				),
			)
		);

		$this->add_responsive_control(
			'title_align',
			array(
				'label'     => __( 'Alignment', 'premium-addons-pro' ),
				'type'      => Controls_Manager::CHOOSE,
				'options'   => array(
					'left'   => array(
						'title' => __( 'Left', 'premium-addons-pro' ),
						'icon'  => 'eicon-text-align-left',
					),
					'center' => array(
						'title' => __( 'Center', 'premium-addons-pro' ),
						'icon'  => 'eicon-text-align-center',
					),
					'right'  => array(
						'title' => __( 'Right', 'premium-addons-pro' ),
						'icon'  => 'eicon-text-align-right',
					),
				),
				'selectors' => array(
					'{{WRAPPER}} .premium-chart-title' => 'text-align: {{VALUE}}',
				),
				'default'   => 'center',
				'condition' => array(
					'title_switcher' => 'true',
				),
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'advanced',
			array(
				'label' => __( 'Advanced Settings', 'premium-addons-pro' ),
			)
		);

		$this->add_control(
			'y_axis_min',
			array(
				'label'              => __( 'Minimum Value', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'description'        => __( 'Set Y-axis minimum value, this will be overriden if data has a smaller value or Begin At Zero option is enabled', 'premium-addons-pro' ),
				'condition'          => array(
					'type!' => array( 'pie', 'doughnut', 'radar', 'polarArea' ),
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_max',
			array(
				'label'              => __( 'Maximum Value', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'description'        => __( 'Set Y-axis maximum value, this will be overriden if data has a larger value', 'premium-addons-pro' ),
				'min'                => 0,
				'default'            => 1,
				'condition'          => array(
					'type!' => array( 'pie', 'doughnut' ),
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'step_size',
			array(
				'label'              => __( 'Step Size', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'condition'          => array(
					'type!' => array( 'pie', 'doughnut' ),
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'legend_display',
			array(
				'label'              => __( 'Show Legend', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'description'        => __( 'Show or Hide chart legend', 'premium-addons-pro' ),
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'legend_circle',
			array(
				'label'              => __( 'Change Legend to Circles', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'return_value'       => 'true',
				'condition'          => array(
					'legend_display' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'legend_hide',
			array(
				'label'              => __( 'Hide Legend on Tablet/Mobile Devices', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'description'        => __( 'Show or Hide chart legend', 'premium-addons-pro' ),
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'condition'          => array(
					'legend_display' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_responsive_control(
			'legend_position',
			array(
				'label'              => __( 'Legend Position', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'top'    => __( 'Top', 'premium-addons-pro' ),
					'right'  => __( 'Right', 'premium-addons-pro' ),
					'bottom' => __( 'Bottom', 'premium-addons-pro' ),
					'left'   => __( 'Left', 'premium-addons-pro' ),
				),
				'default'            => 'top',
				'tablet_default'     => 'top',
				'mobile_default'     => 'top',
				'condition'          => array(
					'legend_display' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'legend_reverse',
			array(
				'label'              => __( 'Reverse', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'description'        => __( 'Enable or Disable legend data reverse', 'premium-addons-pro' ),
				'return_value'       => 'true',
				'condition'          => array(
					'legend_display' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'tool_tips',
			array(
				'label'              => __( 'Show Values on Hover', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'tool_tips_percent',
			array(
				'label'              => __( 'Convert Values to percent', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'return_value'       => 'true',
				'condition'          => array(
					'tool_tips' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'tool_tips_mode',
			array(
				'label'              => __( 'Mode', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'point'   => __( 'Point', 'premium-addons-pro' ),
					'nearest' => __( 'Nearest', 'premium-addons-pro' ),
					'dataset' => __( 'Dataset', 'premium-addons-pro' ),
					'x'       => __( 'X', 'premium-addons-pro' ),
					'y'       => __( 'Y', 'premium-addons-pro' ),
				),
				'default'            => 'nearest',
				'condition'          => array(
					'tool_tips' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'value_on_chart',
			array(
				'label'              => __( 'Show Values on Chart', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SWITCHER,
				'description'        => __( 'This option works only with Pie and Douhnut Charts', 'premium-addons-pro' ),
				'label_on'           => 'Show',
				'label_off'          => 'Hide',
				'return_value'       => 'true',
				'condition'          => array(
					'type'       => array( 'pie', 'doughnut' ),
					'tool_tips!' => 'true',
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'duration',
			array(
				'label'              => __( 'Animation Duration (msec)', 'premium-addons-pro' ),
				'description'        => __( 'Set the animation duration in milliseconds', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'start_animation',
			array(
				'label'              => __( 'Animation', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'linear'           => __( 'Linear', 'premium-addons-pro' ),
					'easeInQuad'       => __( 'Ease in Quad', 'premium-addons-pro' ),
					'easeOutQuad'      => __( 'Ease out Quad', 'premium-addons-pro' ),
					'easeInOutQuad'    => __( 'Ease in out Quad', 'premium-addons-pro' ),
					'easeInCubic'      => __( 'Ease in Cubic', 'premium-addons-pro' ),
					'easeOutCubic'     => __( 'Ease out Cubic', 'premium-addons-pro' ),
					'easeInOutCubic'   => __( 'Ease in out Cubic', 'premium-addons-pro' ),
					'easeInQuart'      => __( 'Ease in Quart', 'premium-addons-pro' ),
					'easeOutQuart'     => __( 'Ease out Quart', 'premium-addons-pro' ),
					'easeInOutQuart'   => __( 'Ease in out Quart', 'premium-addons-pro' ),
					'easeInQuint'      => __( 'Ease in Quint', 'premium-addons-pro' ),
					'easeOutQuint'     => __( 'Ease out Quint', 'premium-addons-pro' ),
					'easeInOutQuint'   => __( 'Ease in out Quint', 'premium-addons-pro' ),
					'easeInSine'       => __( 'Ease in Sine', 'premium-addons-pro' ),
					'easeOutSine'      => __( 'Ease out Sine', 'premium-addons-pro' ),
					'easeInOutSine'    => __( 'Ease in out Sine', 'premium-addons-pro' ),
					'easeInExpo'       => __( 'Ease in Expo', 'premium-addons-pro' ),
					'easeOutExpo'      => __( 'Ease out Expo', 'premium-addons-pro' ),
					'easeInOutExpo'    => __( 'Ease in out Cubic', 'premium-addons-pro' ),
					'easeInCirc'       => __( 'Ease in Circle', 'premium-addons-pro' ),
					'easeOutCirc'      => __( 'Ease out Circle', 'premium-addons-pro' ),
					'easeInOutCirc'    => __( 'Ease in out Circle', 'premium-addons-pro' ),
					'easeInElastic'    => __( 'Ease in Elastic', 'premium-addons-pro' ),
					'easeOutElastic'   => __( 'Ease out Elastic', 'premium-addons-pro' ),
					'easeInOutElastic' => __( 'Ease in out Elastic', 'premium-addons-pro' ),
					'easeInBack'       => __( 'Ease in Back', 'premium-addons-pro' ),
					'easeOutBack'      => __( 'Ease out Back', 'premium-addons-pro' ),
					'easeInOutBack'    => __( 'Ease in Out Back', 'premium-addons-pro' ),
					'easeInBounce'     => __( 'Ease in Bounce', 'premium-addons-pro' ),
					'easeOutBounce'    => __( 'Ease out Bounce', 'premium-addons-pro' ),
					'easeInOutBounce'  => __( 'Ease in out Bounce', 'premium-addons-pro' ),
				),
				'default'            => 'easeInQuad',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'render_event',
			array(
				'label'              => __( 'Load Chart On', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'options'            => array(
					'scroll' => __( 'Scroll', 'premium-addons-pro' ),
					'load'   => __( 'Page Load', 'premium-addons-pro' ),
				),
				'default'            => 'scroll',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'format_locale',
			array(
				'label'              => __( 'Data Format Locale', 'premium-addons-pro' ),
				'type'               => Controls_Manager::SELECT,
				'description'        => __( 'Use this to format strings into specific locale format. For example, use de to format numbers according to German formatting.', 'premium-addons-pro' ),
				'default'            => '',
				'options'            => array(
					''   => __( 'Default', 'premium-addons-pro' ),
					'en' => __( 'English', 'premium-addons-pro' ),
					'fr' => __( 'French', 'premium-addons-pro' ),
					'da' => __( 'Danish', 'premium-addons-pro' ),
					'de' => __( 'German', 'premium-addons-pro' ),
					'ar' => __( 'Arabic', 'premium-addons-pro' ),
				),
				'label_block'        => true,
				'frontend_available' => true,
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'general_style',
			array(
				'label' => __( 'General', 'premium-addons-pro' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_responsive_control(
			'height',
			array(
				'label'       => __( 'Height', 'premium-addons-pro' ),
				'type'        => Controls_Manager::NUMBER,
				'description' => __( 'Set the height of the graph in pixels', 'premium-addons-pro' ),
				'selectors'   => array(
					'{{WRAPPER}} .premium-chart-canvas-container'   => 'height: {{VALUE}}px',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'general_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .premium-chart-container',
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'general_border',
				'selector' => '{{WRAPPER}} .premium-chart-container',
			)
		);

		$this->add_control(
			'general_border_radius',
			array(
				'label'      => __( 'Border Radius', 'premium-addons-pro' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .premium-chart-container' => 'border-radius: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'general_box_shadow',
				'selector' => '{{WRAPPER}} .premium-chart-container',
			)
		);

		$this->add_responsive_control(
			'general_margin',
			array(
				'label'      => __( 'Margin', 'premium-addons-pro' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', 'em', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .premium-chart-container' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
				),
			)
		);

		$this->add_responsive_control(
			'general_padding',
			array(
				'label'      => __( 'Padding', 'premium-addons-pro' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', 'em', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .premium-chart-container' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
				),
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'title_style',
			array(
				'label'     => __( 'Title', 'premium-addons-pro' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array(
					'title_switcher' => 'true',
				),
			)
		);

		$this->add_control(
			'title_color',
			array(
				'label'     => __( 'Color', 'premium-addons-pro' ),
				'type'      => Controls_Manager::COLOR,
				'global'    => array(
					'default' => Global_Colors::COLOR_SECONDARY,
				),
				'selectors' => array(
					'{{WRAPPER}} .premium-chart-title' => 'color: {{VALUE}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'title_typo',
				'global'   => array(
					'default' => Global_Typography::TYPOGRAPHY_PRIMARY,
				),
				'selector' => '{{WRAPPER}} .premium-chart-title',
			)
		);

		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'title_background',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} .premium-chart-title-container',
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'title_border',
				'selector' => '{{WRAPPER}} .premium-chart-title-container',
			)
		);

		$this->add_control(
			'title_border_radius',
			array(
				'label'      => __( 'Border Radius', 'premium-addons-pro' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} .premium-chart-title-container' => 'border-radius: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Text_Shadow::get_type(),
			array(
				'name'     => 'title_box_shadow',
				'selector' => '{{WRAPPER}} .premium-chart-title',
			)
		);

		$this->add_responsive_control(
			'title_margin',
			array(
				'label'      => __( 'Margin', 'premium-addons-pro' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', 'em', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .premium-chart-title-container .premium-chart-title' => 'margin: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
				),
			)
		);

		$this->add_responsive_control(
			'title_padding',
			array(
				'label'      => __( 'Padding', 'premium-addons-pro' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', 'em', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} .premium-chart-title-container' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}}',
				),
			)
		);

		$this->end_controls_section();

		$this->start_controls_section(
			'x_axis_style',
			array(
				'label' => __( 'X-Axis', 'premium-addons-pro' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_control(
			'x_axis_label_pop',
			array(
				'label'     => __( 'Axis Label', 'premium-addons-pro' ),
				'type'      => Controls_Manager::POPOVER_TOGGLE,
				'condition' => array(
					'x_axis_label_switch' => 'true',
				),
			)
		);

		$this->start_popover();

		$this->add_control(
			'x_axis_label_color',
			array(
				'label'              => __( 'Color', 'premium-addons-pro' ),
				'type'               => Controls_Manager::COLOR,
				'global'             => array(
					'default' => Global_Colors::COLOR_SECONDARY,
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_label_size',
			array(
				'label'              => __( 'Size', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 0,
				'max'                => 50,
				'default'            => 12,
				'frontend_available' => true,
			)
		);

		$this->end_popover();

		$this->add_control(
			'x_axis_labels_pop',
			array(
				'label' => __( 'Data Labels', 'premium-addons-pro' ),
				'type'  => Controls_Manager::POPOVER_TOGGLE,
			)
		);

		$this->start_popover();

		$this->add_control(
			'x_axis_labels_color',
			array(
				'label'              => __( 'Color', 'premium-addons-pro' ),
				'type'               => Controls_Manager::COLOR,
				'global'             => array(
					'default' => Global_Colors::COLOR_SECONDARY,
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_labels_size',
			array(
				'label'              => __( 'Size', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 0,
				'max'                => 50,
				'default'            => 12,
				'frontend_available' => true,
			)
		);

		$this->end_popover();

		$this->add_control(
			'x_axis_grid_pop',
			array(
				'label' => __( 'Grid', 'premium-addons-pro' ),
				'type'  => Controls_Manager::POPOVER_TOGGLE,
			)
		);

		$this->start_popover();

		$this->add_control(
			'x_axis_grid_color',
			array(
				'label'              => __( 'Color', 'premium-addons-pro' ),
				'type'               => Controls_Manager::COLOR,
				'default'            => '#6ec1e4',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'x_axis_grid_width',
			array(
				'label'              => __( 'Width', 'premium-charts' ),
				'type'               => Controls_Manager::SLIDER,
				'range'              => array(
					'px' => array(
						'min'  => 0,
						'max'  => 10,
						'step' => 0.1,
					),
				),
				'default'            => array(
					'unit' => 'px',
					'size' => 1,
				),
				'frontend_available' => true,
			)
		);

		$this->end_popover();

		$this->end_controls_section();

		$this->start_controls_section(
			'y_axis_style',
			array(
				'label' => __( 'Y-Axis', 'premium-addons-pro' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_control(
			'y_axis_label_pop',
			array(
				'label'     => __( 'Axis Label', 'premium-addons-pro' ),
				'type'      => Controls_Manager::POPOVER_TOGGLE,
				'condition' => array(
					'y_axis_label_switch' => 'true',
				),
			)
		);

		$this->start_popover();

		$this->add_control(
			'y_axis_label_color',
			array(
				'label'              => __( 'Color', 'premium-addons-pro' ),
				'type'               => Controls_Manager::COLOR,
				'global'             => array(
					'default' => Global_Colors::COLOR_SECONDARY,
				),
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_label_size',
			array(
				'label'              => __( 'Size', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 0,
				'max'                => 50,
				'default'            => 12,
				'frontend_available' => true,
			)
		);

		$this->end_popover();

		$this->add_control(
			'y_axis_data_pop',
			array(
				'label' => __( 'Data', 'premium-addons-pro' ),
				'type'  => Controls_Manager::POPOVER_TOGGLE,
			)
		);

		$this->start_popover();

		$this->add_control(
			'y_axis_labels_color',
			array(
				'label'              => __( 'Color', 'premium-addons-pro' ),
				'type'               => Controls_Manager::COLOR,
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_labels_size',
			array(
				'label'              => __( 'Size', 'premium-addons-pro' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 0,
				'max'                => 50,
				'default'            => 12,
				'frontend_available' => true,
			)
		);

		$this->end_popover();

		$this->add_control(
			'y_axis_grid_pop',
			array(
				'label' => __( 'Grid', 'premium-addons-pro' ),
				'type'  => Controls_Manager::POPOVER_TOGGLE,
			)
		);

		$this->start_popover();

		$this->add_control(
			'y_axis_grid_color',
			array(
				'label'              => __( 'Color', 'premium-addons-pro' ),
				'type'               => Controls_Manager::COLOR,
				'default'            => '#54595f',
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'y_axis_grid_width',
			array(
				'label'              => __( 'Width', 'premium-charts' ),
				'type'               => Controls_Manager::SLIDER,
				'range'              => array(
					'px' => array(
						'min'  => 0,
						'max'  => 10,
						'step' => 0.1,
					),
				),
				'default'            => array(
					'unit' => 'px',
					'size' => 1,
				),
				'frontend_available' => true,
			)
		);

		$this->end_popover();

		$this->end_controls_section();

		$this->start_controls_section(
			'legend_style',
			array(
				'label'     => __( 'Legend', 'premium-charts' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array(
					'legend_display' => 'true',
				),
			)
		);

		$this->add_control(
			'legend_text_color',
			array(
				'label'              => __( 'Color', 'premium-charts' ),
				'type'               => Controls_Manager::COLOR,
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'legend_text_size',
			array(
				'label'              => __( 'Size', 'premium-charts' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 0,
				'max'                => 50,
				'default'            => 12,
				'frontend_available' => true,
			)
		);

		$this->add_control(
			'legend_item_width',
			array(
				'label'              => __( 'Item Width', 'premium-charts' ),
				'type'               => Controls_Manager::NUMBER,
				'min'                => 1,
				'default'            => 40,
				'frontend_available' => true,
			)
		);

		$this->end_controls_section();
	}

	/**
	 * Render Charts widget output on the frontend.
	 *
	 * Written in PHP and used to generate the final HTML.
	 *
	 * @since 1.0.0
	 * @access protected
	 */
	protected function render() {

		$settings = $this->get_settings_for_display();

		$id = $this->get_id();

		$title_tag = PAPRO_Helper::validate_html_tag( $settings['title_tag'] );
		if ( ! empty( $settings['title'] ) && $settings['title_switcher'] ) {
			$title = '<' . $title_tag . ' class="premium-chart-title">' . $settings['title'] . '</' . $title_tag . '>';
		}

		$data_source   = $settings['data_source'];
		$columns_array = array();

		if ( 'csv' === $data_source ) {
			$props = array();
			foreach ( $settings['dataset_repeater'] as $repeater_ele ) {
				if ( 'pie' === $settings['type'] || 'doughnut' === $settings['type'] || 'polarArea' === $settings['type'] ) {
					$bg_color = explode( ',', $repeater_ele['circle_color'] );
				} else {
					$bg_color = $repeater_ele['dataset_color'];
				}

				$prop = array(
					'backgroundColor' => $bg_color,
					'borderColor'     => $repeater_ele['dataset_border_color'],
					'borderWidth'     => $repeater_ele['border_width'],
					'title'           => $repeater_ele['dataset_title'],
				);

				array_push( $props, $prop );
			}

			$col_settings = array(
				'separator' => $settings['premium_chart_separator'],
				'url'       => 'file' === $settings['csv_type'] ? $settings['csv_file']['url'] : $settings['csv_url'],
				'props'     => $props,
			);

			$columns_array = array_merge( $columns_array, $col_settings );
		} else {

			foreach ( $settings['y_axis_data'] as $column_data ) {

				if ( 'pie' !== $settings['type'] && 'doughnut' !== $settings['type'] && 'polarArea' !== $settings['type'] ) {
					if ( empty( $column_data['y_axis_column_color'] ) && empty( $column_data['y_axis_column_second_color'] ) ) {
						$background = explode( ',', $column_data['y_axis_circle_color'] );
						array_push( $background, 'empty' );
					} elseif ( ! empty( $column_data['y_axis_column_second_color'] ) ) {
						$background = array( $column_data['y_axis_column_color'], $column_data['y_axis_column_second_color'] );
					} else {
						$background = $column_data['y_axis_column_color'];
					}
				} else {
					$background = explode( ',', $column_data['y_axis_circle_color'] );
				}

				$col_settings = array(
					'label'           => $column_data['y_axis_column_title'],
					'data'            => explode( ',', $column_data['y_axis_column_data'] ),
					'links'           => explode( ',', $column_data['y_axis_urls'] ),
					'backgroundColor' => $background,
					'borderColor'     => $column_data['y_axis_column_border_color'],
					'borderWidth'     => $column_data['y_axis_column_border_width'],
				);

				array_push( $columns_array, $col_settings );
			}
		}

		$chart_id = 'premium-chart-canvas-' . $id;

		$chart_settings = array(
			'chartId' => $chart_id,
			'height'  => ! empty( $settings['height'] ) ? $settings['height'] : 400,
		);

		$this->add_render_attribute(
			'charts',
			array(
				'id'            => 'premium-chart-container-' . $id,
				'class'         => 'premium-chart-container',
				'data-chart'    => wp_json_encode( $columns_array ),
				'data-settings' => wp_json_encode( $chart_settings ),
			)
		);

		$this->add_render_attribute(
			'canvas',
			array(
				'id'     => 'premium-chart-canvas-' . $id,
				'class'  => 'premium-chart-canvas',
				'width'  => 400,
				'height' => 400,
			)
		);

		?>

	<div <?php echo wp_kses_post( $this->get_render_attribute_string( 'charts' ) ); ?>>
		<?php if ( ! empty( $settings['title'] ) && $settings['title_switcher'] && 'top' === $settings['title_position'] ) : ?>
			<div class="premium-chart-title-container"><?php echo wp_kses_post( $title ); ?></div>
		<?php endif; ?>
		<div class="premium-chart-canvas-container">
			<canvas <?php echo wp_kses_post( $this->get_render_attribute_string( 'canvas' ) ); ?>></canvas>
		</div>
		<?php if ( ! empty( $settings['title'] ) && $settings['title_switcher'] && 'bottom' === $settings['title_position'] ) : ?>
			<div class="premium-chart-title-container"><?php echo wp_kses_post( $title ); ?></div>
		<?php endif; ?>
	</div>

		<?php
	}
}