<?php
/**
 * Widget Name: Captwiki Social Icons
 * Description: Stylish social icon links with 4 design styles — filled, outlined, icon+text, and tooltip.
 *              Hover animations, alignment, size, SEO-friendly markup, and ARIA support.
 *
 * @package captain-widgets-kit
 */

use Elementor\Widget_Base;
use Elementor\Controls_Manager;
use Elementor\Repeater;
use Elementor\Group_Control_Border;
use Elementor\Group_Control_Box_Shadow;
use Elementor\Group_Control_Typography;

if ( ! defined( 'ABSPATH' ) ) {
	exit;
}

class Captwiki_Social_Icon extends Widget_Base {

	public function get_name() {
		return 'captwiki-social-icons';
	}

	public function get_title() {
		return esc_html__( 'Social Icons', 'captain-widgets-kit' );
	}

	public function get_icon() {
		return 'eicon-social-icons captwiki-el-logo';
	}

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

	public function get_style_depends() {
		return array( 'captwiki-social-icons' );
	}

	protected function register_controls() {

		/* ─────────────────────────────────────────
		 * SECTION: Icons List (Repeater)
		 * ───────────────────────────────────────── */
		$this->start_controls_section(
			'section_content',
			array( 'label' => esc_html__( 'Social Icons', 'captain-widgets-kit' ) )
		);

		$repeater = new Repeater();

		$repeater->add_control(
			'icon',
			array(
				'label'   => esc_html__( 'Icon', 'captain-widgets-kit' ),
				'type'    => Controls_Manager::ICONS,
				'default' => array(
					'value'   => 'fab fa-facebook-f',
					'library' => 'fa-brands',
				),
			)
		);

		$repeater->add_control(
			'label',
			array(
				'label'       => esc_html__( 'Label', 'captain-widgets-kit' ),
				'type'        => Controls_Manager::TEXT,
				'default'     => '',
				'placeholder' => esc_html__( 'e.g. Facebook', 'captain-widgets-kit' ),
				'description' => esc_html__( 'Used as button label (Icon+Text style) and tooltip text.', 'captain-widgets-kit' ),
			)
		);

		$repeater->add_control(
			'link',
			array(
				'label'         => esc_html__( 'Link', 'captain-widgets-kit' ),
				'type'          => Controls_Manager::URL,
				'placeholder'   => 'https://',
				'show_external' => true,
				'default'       => array(
					'url'         => '#',
					'is_external' => true,
					'nofollow'    => true,
				),
			)
		);

		$repeater->add_control(
			'custom_color',
			array(
				'label'       => esc_html__( 'Custom Color', 'captain-widgets-kit' ),
				'type'        => Controls_Manager::COLOR,
				'description' => esc_html__( 'Override global icon color for this icon only.', 'captain-widgets-kit' ),
			)
		);

		$this->add_control(
			'social_list',
			array(
				'label'       => esc_html__( 'Icons List', 'captain-widgets-kit' ),
				'type'        => Controls_Manager::REPEATER,
				'fields'      => $repeater->get_controls(),
				'default'     => array(
					array(
						'icon'  => array( 'value' => 'fab fa-facebook-f', 'library' => 'fa-brands' ),
						'label' => 'Facebook',
					),
					array(
						'icon'  => array( 'value' => 'fab fa-twitter', 'library' => 'fa-brands' ),
						'label' => 'Twitter',
					),
					array(
						'icon'  => array( 'value' => 'fab fa-instagram', 'library' => 'fa-brands' ),
						'label' => 'Instagram',
					),
					array(
						'icon'  => array( 'value' => 'fab fa-youtube', 'library' => 'fa-brands' ),
						'label' => 'YouTube',
					),
				),
				'title_field' => '<i class="{{ icon.value }}"></i> {{ label || link.url }}',
			)
		);

		$this->end_controls_section();

		/* ─────────────────────────────────────────
		 * SECTION: Layout
		 * ───────────────────────────────────────── */
		$this->start_controls_section(
			'section_layout',
			array( 'label' => esc_html__( 'Layout', 'captain-widgets-kit' ) )
		);

		$this->add_control(
			'icon_style_preset',
			array(
				'label'   => esc_html__( 'Style', 'captain-widgets-kit' ),
				'type'    => Controls_Manager::CHOOSE,
				'default' => 'style-1',
				'options' => array(
					'style-1' => array(
						'title' => esc_html__( 'Style 1 — Circle', 'captain-widgets-kit' ),
						'icon'  => 'eicon-circle',
					),
					'style-2' => array(
						'title' => esc_html__( 'Style 2 — Rounded Square', 'captain-widgets-kit' ),
						'icon'  => 'eicon-square',
					),
				),
				'toggle' => false,
			)
		);

		$this->add_control(
			'display_style',
			array(
				'label'   => esc_html__( 'Display Style', 'captain-widgets-kit' ),
				'type'    => Controls_Manager::SELECT,
				'default' => 'filled',
				'options' => array(
					'filled'   => esc_html__( '● Filled Circle', 'captain-widgets-kit' ),
					'outlined' => esc_html__( '○ Outlined Ghost', 'captain-widgets-kit' ),
					'text'     => esc_html__( 'A Icon + Text Pill', 'captain-widgets-kit' ),
					'tooltip'  => esc_html__( '◎ Icon with Tooltip', 'captain-widgets-kit' ),
				),
			)
		);

		$this->add_control(
			'tooltip_position',
			array(
				'label'     => esc_html__( 'Tooltip Position', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'top',
				'options'   => array(
					'top'    => esc_html__( 'Top', 'captain-widgets-kit' ),
					'bottom' => esc_html__( 'Bottom', 'captain-widgets-kit' ),
					'left'   => esc_html__( 'Left', 'captain-widgets-kit' ),
					'right'  => esc_html__( 'Right', 'captain-widgets-kit' ),
				),
				'condition' => array( 'display_style' => 'tooltip' ),
			)
		);

		$this->add_responsive_control(
			'alignment',
			array(
				'label'     => esc_html__( 'Alignment', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::CHOOSE,
				'options'   => array(
					'flex-start' => array( 'title' => 'Left',   'icon' => 'eicon-text-align-left' ),
					'center'     => array( 'title' => 'Center', 'icon' => 'eicon-text-align-center' ),
					'flex-end'   => array( 'title' => 'Right',  'icon' => 'eicon-text-align-right' ),
				),
				'default'   => 'center',
				'selectors' => array(
					'{{WRAPPER}} .captwiki-social-icons' => 'justify-content: {{VALUE}};',
				),
			)
		);

		$this->add_responsive_control(
			'icon_spacing',
			array(
				'label'     => esc_html__( 'Icon Spacing', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::SLIDER,
				'default'   => array( 'size' => 8 ),
				'range'     => array( 'px' => array( 'min' => 0, 'max' => 60 ) ),
				'selectors' => array(
					'{{WRAPPER}} .captwiki-social-icons' => 'gap: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->end_controls_section();

		/* ─────────────────────────────────────────
		 * SECTION: Style — Icon
		 * ───────────────────────────────────────── */
		$this->start_controls_section(
			'section_style',
			array(
				'label' => esc_html__( 'Icon Style', 'captain-widgets-kit' ),
				'tab'   => Controls_Manager::TAB_STYLE,
			)
		);

		$this->add_responsive_control(
			'icon_size',
			array(
				'label'      => esc_html__( 'Icon Size', 'captain-widgets-kit' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'default'    => array( 'size' => 18 ),
				'range'      => array( 'px' => array( 'min' => 10, 'max' => 80 ) ),
				'selectors'  => array(
					'{{WRAPPER}} .captwiki-social-icons a i'   => 'font-size: {{SIZE}}{{UNIT}};',
					'{{WRAPPER}} .captwiki-social-icons a svg' => 'width: {{SIZE}}{{UNIT}}; height: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_responsive_control(
			'icon_padding',
			array(
				'label'      => esc_html__( 'Icon Box Size (Padding)', 'captain-widgets-kit' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px' ),
				'default'    => array( 'size' => 12 ),
				'range'      => array( 'px' => array( 'min' => 0, 'max' => 60 ) ),
				'selectors'  => array(
					'{{WRAPPER}} .captwiki-social-icons a' => 'padding: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->add_responsive_control(
			'border_radius',
			array(
				'label'      => esc_html__( 'Border Radius', 'captain-widgets-kit' ),
				'type'       => Controls_Manager::SLIDER,
				'size_units' => array( 'px', '%' ),
				'default'    => array( 'size' => 10, 'unit' => 'px' ),
				'range'      => array(
					'px' => array( 'min' => 0, 'max' => 40 ),
					'%'  => array( 'min' => 0, 'max' => 50 ),
				),
				'condition'  => array( 'icon_style_preset' => 'style-2' ),
				'selectors'  => array(
					'{{WRAPPER}} .captwiki-social-icons a' => 'border-radius: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->start_controls_tabs( 'icon_colors_tabs' );

			$this->start_controls_tab(
				'tab_normal',
				array( 'label' => esc_html__( 'Normal', 'captain-widgets-kit' ) )
			);

				$this->add_control(
					'icon_color',
					array(
						'label'     => esc_html__( 'Icon Color', 'captain-widgets-kit' ),
						'type'      => Controls_Manager::COLOR,
						'default'   => '#ffffff',
						'selectors' => array(
							'{{WRAPPER}} .captwiki-social-icons a'     => 'color: {{VALUE}};',
							'{{WRAPPER}} .captwiki-social-icons a svg' => 'fill: {{VALUE}};',
						),
					)
				);

				$this->add_control(
					'icon_bg',
					array(
						'label'     => esc_html__( 'Background', 'captain-widgets-kit' ),
						'type'      => Controls_Manager::COLOR,
						'default'   => '#1877f2',
						'selectors' => array(
							'{{WRAPPER}} .captwiki-social-icons a' => 'background-color: {{VALUE}};',
						),
					)
				);

			$this->end_controls_tab();

			$this->start_controls_tab(
				'tab_hover',
				array( 'label' => esc_html__( 'Hover', 'captain-widgets-kit' ) )
			);

				$this->add_control(
					'icon_hover_color',
					array(
						'label'     => esc_html__( 'Icon Color', 'captain-widgets-kit' ),
						'type'      => Controls_Manager::COLOR,
						'selectors' => array(
							'{{WRAPPER}} .captwiki-social-icons a:hover'     => 'color: {{VALUE}};',
							'{{WRAPPER}} .captwiki-social-icons a:hover svg' => 'fill: {{VALUE}};',
						),
					)
				);

				$this->add_control(
					'icon_hover_bg',
					array(
						'label'     => esc_html__( 'Background', 'captain-widgets-kit' ),
						'type'      => Controls_Manager::COLOR,
						'selectors' => array(
							'{{WRAPPER}} .captwiki-social-icons a:hover' => 'background-color: {{VALUE}};',
						),
					)
				);

			$this->end_controls_tab();

		$this->end_controls_tabs();

		$this->add_control(
			'hover_animation',
			array(
				'label'     => esc_html__( 'Hover Animation', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::SELECT,
				'default'   => 'scale',
				'separator' => 'before',
				'options'   => array(
					'none'       => esc_html__( 'None', 'captain-widgets-kit' ),
					'scale'      => esc_html__( 'Scale Up', 'captain-widgets-kit' ),
					'rotate'     => esc_html__( 'Rotate', 'captain-widgets-kit' ),
					'bounce'     => esc_html__( 'Bounce', 'captain-widgets-kit' ),
					'float'      => esc_html__( 'Float', 'captain-widgets-kit' ),
					'pulse'      => esc_html__( 'Pulse Ring', 'captain-widgets-kit' ),
					'shake'      => esc_html__( 'Shake', 'captain-widgets-kit' ),
					'flip'       => esc_html__( 'Flip', 'captain-widgets-kit' ),
				),
			)
		);

		$this->add_group_control(
			Group_Control_Border::get_type(),
			array(
				'name'      => 'icon_border',
				'selector'  => '{{WRAPPER}} .captwiki-social-icons a',
				'separator' => 'before',
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'icon_shadow',
				'selector' => '{{WRAPPER}} .captwiki-social-icons a',
			)
		);

		$this->end_controls_section();

		/* ─────────────────────────────────────────
		 * SECTION: Style — Label Text (Icon+Text style)
		 * ───────────────────────────────────────── */
		$this->start_controls_section(
			'section_style_label',
			array(
				'label'     => esc_html__( 'Label Text', 'captain-widgets-kit' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array( 'display_style' => 'text' ),
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'label_typography',
				'selector' => '{{WRAPPER}} .captwiki-social-icons a .captwiki-si-label',
			)
		);

		$this->add_responsive_control(
			'label_gap',
			array(
				'label'     => esc_html__( 'Gap (Icon ↔ Label)', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::SLIDER,
				'default'   => array( 'size' => 8 ),
				'range'     => array( 'px' => array( 'min' => 0, 'max' => 30 ) ),
				'selectors' => array(
					'{{WRAPPER}} .captwiki-social-icons a' => 'gap: {{SIZE}}{{UNIT}};',
				),
			)
		);

		$this->end_controls_section();

		/* ─────────────────────────────────────────
		 * SECTION: Style — Tooltip
		 * ───────────────────────────────────────── */
		$this->start_controls_section(
			'section_style_tooltip',
			array(
				'label'     => esc_html__( 'Tooltip', 'captain-widgets-kit' ),
				'tab'       => Controls_Manager::TAB_STYLE,
				'condition' => array( 'display_style' => 'tooltip' ),
			)
		);

		$this->add_control(
			'tooltip_bg',
			array(
				'label'     => esc_html__( 'Background', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#1a1a2e',
				'selectors' => array(
					'{{WRAPPER}} .captwiki-si-tooltip'        => 'background: {{VALUE}};',
					'{{WRAPPER}} .captwiki-si-tooltip::after' => 'border-top-color: {{VALUE}};',
				),
			)
		);

		$this->add_control(
			'tooltip_text_color',
			array(
				'label'     => esc_html__( 'Text Color', 'captain-widgets-kit' ),
				'type'      => Controls_Manager::COLOR,
				'default'   => '#ffffff',
				'selectors' => array(
					'{{WRAPPER}} .captwiki-si-tooltip' => 'color: {{VALUE}};',
				),
			)
		);

		$this->add_group_control(
			Group_Control_Typography::get_type(),
			array(
				'name'     => 'tooltip_typography',
				'selector' => '{{WRAPPER}} .captwiki-si-tooltip',
			)
		);

		$this->add_group_control(
			Group_Control_Box_Shadow::get_type(),
			array(
				'name'     => 'tooltip_shadow',
				'selector' => '{{WRAPPER}} .captwiki-si-tooltip',
			)
		);

		$this->end_controls_section();
	}

	protected function render() {
		$settings = $this->get_settings_for_display();
		if ( empty( $settings['social_list'] ) ) {
			return;
		}

		$display_style   = isset( $settings['display_style'] ) ? $settings['display_style'] : 'filled';
		$hover_animation = isset( $settings['hover_animation'] ) ? $settings['hover_animation'] : 'scale';
		$tooltip_pos     = isset( $settings['tooltip_position'] ) ? $settings['tooltip_position'] : 'top';

		$icon_style_preset = isset( $settings['icon_style_preset'] ) ? $settings['icon_style_preset'] : 'style-1';

		$wrapper_classes = implode( ' ', array(
			'captwiki-social-icons',
			'captwiki-si-style-' . esc_attr( $display_style ),
			'captwiki-si-hover-' . esc_attr( $hover_animation ),
			'captwiki-si-' . esc_attr( $icon_style_preset ),
			'tooltip' === $display_style ? 'captwiki-si-tooltip-' . esc_attr( $tooltip_pos ) : '',
		) );

		echo '<div class="' . trim( $wrapper_classes ) . '" role="list">';

		foreach ( $settings['social_list'] as $item ) {
			$url          = isset( $item['link']['url'] ) ? $item['link']['url'] : '#';
			$is_external  = ! empty( $item['link']['is_external'] );
			$nofollow     = ! empty( $item['link']['nofollow'] );
			$label        = ! empty( $item['label'] ) ? $item['label'] : '';
			$custom_color = ! empty( $item['custom_color'] ) ? $item['custom_color'] : '';

			// Build anchor attributes
			$a_attrs = array(
				'href' => esc_url( $url ),
				'role' => 'listitem',
			);
			if ( $label ) {
				$a_attrs['aria-label'] = esc_attr( $label );
				$a_attrs['title']      = esc_attr( $label ); // SEO-friendly title
			}
			if ( $is_external ) {
				$a_attrs['target']   = '_blank';
				$a_attrs['rel']      = $nofollow ? 'nofollow noopener noreferrer' : 'noopener noreferrer';
			} elseif ( $nofollow ) {
				$a_attrs['rel'] = 'nofollow';
			}
			if ( $custom_color ) {
				$a_attrs['style'] = 'background-color:' . esc_attr( $custom_color ) . '; border-color:' . esc_attr( $custom_color ) . ';';
			}

			// Render anchor open tag
			echo '<a';
			foreach ( $a_attrs as $attr => $val ) {
				echo ' ' . esc_attr( $attr ) . '="' . esc_attr( $val ) . '"';
			}
			echo '>';

			// Icon
			\Elementor\Icons_Manager::render_icon( $item['icon'], array( 'aria-hidden' => 'true' ) );

			// Label (icon+text style only)
			if ( 'text' === $display_style && $label ) {
				echo '<span class="captwiki-si-label">' . esc_html( $label ) . '</span>';
			}

			// Tooltip markup (tooltip style only)
			if ( 'tooltip' === $display_style && $label ) {
				echo '<span class="captwiki-si-tooltip" role="tooltip">' . esc_html( $label ) . '</span>';
			}

			echo '</a>';
		}

		echo '</div>';
	}
}
