<?php
namespace EcafeAddons\Widgets;

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Utils;
use Elementor\Group_Control_Typography;
use Elementor\Core\Schemes\Typography;
use Elementor\Scheme_Color;
use Elementor\Group_Control_Background;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;

use EcafeAddons\EcafeElementLoad;

if ( ! defined( 'ABSPATH' ) ) {
	exit; // Exit if accessed directly.
}

class Ecafe_Darkmode_Styling extends Widget_Base {

	public function get_name() {
		return 'ecafe-darkmode-styling';
	}

	public function get_title() {
		return esc_html__( 'Darkmode Styling', 'essential-classy-addons-for-elementor' );
	}

	public function get_icon() {
		return 'ecafe-ele-back-icon ecafe-darkmode-styling';
	}

	public function get_categories() {
		return array( 'essential' );
	}

	public function get_keywords() {
		return array( 'darkmode', 'dark mode', 'mode', 'light', 'dark theme toggle', 'night shift', 'cosmic dark' );
	}

	public function get_custom_help_url() {
		return 'https://store.kapasias.com/helpdesk/';
	}
	public function has_widget_inner_wrapper(): bool {
		return ! \Elementor\Plugin::$instance->experiments->is_feature_active( 'e_optimized_markup' );
	}
	protected function register_controls() {

		$this->start_controls_section(
			'content_section',
			array(
				'label' => esc_html__( 'Darkmode Styling', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_CONTENT,
			)
		);
		$this->add_control(
			'buttonText',
			array(
				'label'       => esc_html__( 'Text', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'dynamic'     => array( 'active' => true ),
				'default'     => esc_html__( '🌛', 'essential-classy-addons-for-elementor' ),
				'placeholder' => esc_html__( 'Enter Text', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'buttonTextDark',
			array(
				'label'       => esc_html__( 'Dark Text', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'dynamic'     => array( 'active' => true ),
				'default'     => esc_html__( '🌜', 'essential-classy-addons-for-elementor' ),
				'placeholder' => esc_html__( 'Enter Text', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'ecBodyColor',
			array(
				'label'     => esc_html__( 'Body Background', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'body.ec-darkmode-active' => 'background: {{VALUE}} !important;',
				),
				'separator' => 'before',
			)
		);
		$this->add_control(
			'ecContentClass',
			array(
				'label'       => esc_html__( 'Content Class/ID', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::TEXT,
				'dynamic'     => array( 'active' => true ),
				'label_block' => true,
			)
		);
		$this->add_control(
			'ecContentColor',
			array(
				'label'     => esc_html__( 'Content Background', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'condition' => array(
					'ecContentClass!' => '',
				),
			)
		);

		$repeater = new \Elementor\Repeater();
		$repeater->add_control(
			'ecRepeaterLabel',
			array(
				'label'   => esc_html__( 'Label', 'essential-classy-addons-for-elementor' ),
				'type'    => Controls_Manager::TEXT,
				'default' => esc_html__( 'Label', 'essential-classy-addons-for-elementor' ),
				'dynamic' => array( 'active' => true ),
			)
		);
		$repeater->add_control(
			'ecRepeaterColor',
			array(
				'label' => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'  => Controls_Manager::COLOR,
			)
		);
		$this->add_control(
			'ecRepeaterContent',
			array(
				'label'       => esc_html__( 'Global Colors', 'essential-classy-addons-for-elementor' ),
				'type'        => Controls_Manager::REPEATER,
				'default'     => array(
					array(
						'ecRepeaterLabel' => 'primary',
					),
					array(
						'ecRepeaterLabel' => 'secondary',
					),
					array(
						'ecRepeaterLabel' => 'text',
					),
					array(
						'ecRepeaterLabel' => 'accent',
					),
				),
				'separator'   => 'before',
				'fields'      => $repeater->get_controls(),
				'title_field' => '{{{ ecRepeaterLabel }}}',
			)
		);
		$this->end_controls_section();

		/*Notice panel*/
		$ecwidgetdemolink = esc_url( 'https://ecaddons.com/elements/dark-mode-styling/' );
		include ECAFE_PATH . 'element/widgets/ecafe-widgetpanel-help.php';

		/*button start*/
		$this->start_controls_section(
			'buttonStyling',
			array(
				'label' => esc_html__( 'Button', 'essential-classy-addons-for-elementor' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);
		$this->add_responsive_control(
			'buttonPadding',
			array(
				'label'      => esc_html__( 'Padding', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%', 'em' ),
				'selectors'  => array(
					'{{WRAPPER}} button.ec-darkmode-wrap' => 'padding: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->start_controls_tabs( 'tabsButtontyle' );
		$this->start_controls_tab(
			'tabButtonN',
			array(
				'label' => esc_html__( 'Normal', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'buttonColorN',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} button.ec-darkmode-wrap' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'buttonBackgroundN',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} button.ec-darkmode-wrap',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'buttonBorderN',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} button.ec-darkmode-wrap',
			)
		);
		$this->add_responsive_control(
			'buttonBrN',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} button.ec-darkmode-wrap' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'buttonShadowN',
				'selector' => '{{WRAPPER}} button.ec-darkmode-wrap',
			)
		);
		$this->end_controls_tab();
		$this->start_controls_tab(
			'tabButtonA',
			array(
				'label' => esc_html__( 'Active/Dark', 'essential-classy-addons-for-elementor' ),
			)
		);
		$this->add_control(
			'buttonColorA',
			array(
				'label'     => esc_html__( 'Color', 'essential-classy-addons-for-elementor' ),
				'type'      => Controls_Manager::COLOR,
				'selectors' => array(
					'{{WRAPPER}} button.ec-darkmode-wrap:hover,.ec-darkmode-active {{WRAPPER}} button.ec-darkmode-wrap' => 'color: {{VALUE}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Background::get_type(),
			array(
				'name'     => 'buttonBackgroundA',
				'types'    => array( 'classic', 'gradient' ),
				'selector' => '{{WRAPPER}} button.ec-darkmode-wrap:hover,.ec-darkmode-active {{WRAPPER}} button.ec-darkmode-wrap',
			)
		);
		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'     => 'buttonBorderA',
				'label'    => esc_html__( 'Border', 'essential-classy-addons-for-elementor' ),
				'selector' => '{{WRAPPER}} button.ec-darkmode-wrap:hover,.ec-darkmode-active {{WRAPPER}} button.ec-darkmode-wrap',
			)
		);
		$this->add_responsive_control(
			'buttonBrA',
			array(
				'label'      => esc_html__( 'Border Radius', 'essential-classy-addons-for-elementor' ),
				'type'       => Controls_Manager::DIMENSIONS,
				'size_units' => array( 'px', '%' ),
				'selectors'  => array(
					'{{WRAPPER}} button.ec-darkmode-wrap:hover,.ec-darkmode-active {{WRAPPER}} button.ec-darkmode-wrap' => 'border-radius: {{TOP}}{{UNIT}} {{RIGHT}}{{UNIT}} {{BOTTOM}}{{UNIT}} {{LEFT}}{{UNIT}};',
				),
			)
		);
		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'buttonShadowA',
				'selector' => '{{WRAPPER}} button.ec-darkmode-wrap:hover,.ec-darkmode-active {{WRAPPER}} button.ec-darkmode-wrap',
			)
		);
		$this->end_controls_tab();
		$this->end_controls_tabs();

		$this->end_controls_section();
		/*button end*/
	}

	protected function render() {
		$settings          = $this->get_settings_for_display();
		$ecContentClass    = ! empty( $settings['ecContentClass'] ) ? $settings['ecContentClass'] : '';
		$buttonText        = ! empty( $settings['buttonText'] ) ? $settings['buttonText'] : '';
		$buttonTextDark    = ! empty( $settings['buttonTextDark'] ) ? $settings['buttonTextDark'] : '';
		$ecContentColor    = ! empty( $settings['ecContentColor'] ) ? $settings['ecContentColor'] : '';
		$ecRepeaterContent = $settings['ecRepeaterContent'];
		$kitFrontend       = \Elementor\Plugin::$instance->kits_manager->get_active_kit_for_frontend();
		$kitFrontendId     = $kitFrontend->get_id();

		if ( ! empty( intval( $kitFrontendId ) ) ) {
			$elementorDefaultsItem = $kitFrontend->get_settings_for_display( 'system_colors' );
			$elementorNewAddedItem = $kitFrontend->get_settings_for_display( 'custom_colors' );

			if ( ! $elementorDefaultsItem ) {
				$elementorDefaultsItem = array();
			}

			if ( ! $elementorNewAddedItem ) {
				$elementorNewAddedItem = array();
			}

			$mergeItems    = array_merge( $elementorDefaultsItem, $elementorNewAddedItem );
			$sort          = 0;
			$mergeItemName = $mergeItemColor = array();

			foreach ( $mergeItems as $sort => $mergeItemsNew ) {
				$mergeItemName[] = esc_attr( $mergeItemsNew['_id'] );
			}

			foreach ( $ecRepeaterContent as $sort => $mergeItemColorCheck ) {
				if ( ! empty( $mergeItemColorCheck['ecRepeaterColor'] ) ) {
					$mergeItemColor[] = $mergeItemColorCheck['ecRepeaterColor'];
				}
				++$sort;
			}

			$array1 = array_values( $mergeItemName );
			$array2 = array_values( $mergeItemColor );

			echo '<style>';
			if ( isset( $array1 ) && ! empty( $array1 ) && isset( $array2 ) && ! empty( $array2 ) ) {
				echo '.elementor-kit-' . intval( $kitFrontendId ) . '.ec-darkmode-active{';
				foreach ( $array1 as $sort => $sortArray ) {
					if ( ! empty( $sortArray ) && isset( $array2[ $sort ] ) && ! empty( $array2[ $sort ] ) ) {
						echo '--e-global-color-' . $sortArray . ' : ' . $array2[ $sort ] . ';';
					}
				}
				echo '}';

				if ( ! empty( $ecContentClass ) && ! empty( $ecContentColor ) ) {
					echo '.elementor-kit-' . intval( $kitFrontendId ) . '.ec-darkmode-active ' . esc_attr( $ecContentClass ) . '{background-color:' . $ecContentColor . ' !important;}';
				}
			}
			echo '.ec-darkmode-active button.ec-darkmode-wrap span.ec-dmw-lite,button.ec-darkmode-wrap span.ec-dmw-dark{opacity:0}.ec-darkmode-active button.ec-darkmode-wrap span.ec-dmw-dark{opacity:1}button.ec-darkmode-wrap>span{position:absolute}button.ec-darkmode-wrap{position:relative;display:flex;align-items:center;justify-content:center;padding:15px;border:1px solid #000;color:#000;transition: all 0.3s linear;overflow:hidden;    background:transparent;}button.ec-darkmode-wrap:hover,.ec-darkmode-active button.ec-darkmode-wrap{background: #000;}}</style>';

			echo '<button type="button" class="ec-darkmode-wrap"><span class="ec-dmw-lite">' . esc_attr( $buttonText ) . '</span><span class="ec-dmw-dark">' . esc_attr( $buttonTextDark ) . '</span></button>';

			$inlineJS = 'jQuery("button.ec-darkmode-wrap").on("click", function() {
							if(jQuery("body").hasClass("ec-darkmode-active")){
								jQuery("body").removeClass("ec-darkmode-active");
							}else{
								jQuery("body").addClass("ec-darkmode-active");
							}
						});';

			echo wp_print_inline_script_tag( $inlineJS );
		}
	}
}
