<?php
/**
 * Customizer Control: iconpicker.
 *
 * @package   kirki-framework/control-iconpicker
 * @copyright Copyright (c) 2023, Themeum
 * @license   https://opensource.org/licenses/MIT
 * @since     1.0
 */

namespace Kirki\Control;

use Kirki\URL;
use Kirki\Control\Base;

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

/**
 * IconPicker control - a more focused version of FontAwesome control.
 *
 * @since 1.0
 */
class IconPicker extends Base {

	/**
	 * The control type.
	 *
	 * @access public
	 * @since 1.0
	 * @var string
	 */
	public $type = 'kirki-iconpicker';

	/**
	 * The version. Used in scripts & styles for cache-busting.
	 *
	 * @static
	 * @access public
	 * @since 1.0
	 * @var string
	 */
	public static $control_ver = '1.0';

	/**
	 * Enqueue control related scripts/styles.
	 *
	 * @access public
	 * @since 1.0
	 * @return void
	 */
	public function enqueue() {
		parent::enqueue();

		// Enqueue the script.
		wp_enqueue_script(
			'kirki-control-iconpicker',
			URL::get_from_path( dirname( __DIR__ ) . '/control.js' ),
			array( 'jquery', 'customize-base', 'kirki-control-base' ),
			self::$control_ver,
			false
		);

		// Enqueue the style.
		wp_enqueue_style(
			'kirki-control-iconpicker-style',
			URL::get_from_path( dirname( __DIR__ ) . '/control.scss' ),
			array(),
			self::$control_ver
		);

		// Make sure FontAwesome is enqueued
		wp_enqueue_style(
			'font-awesome',
			get_template_directory_uri() . '/inc/fontawesome/css/all.css',
			array(),
			self::$control_ver
		);
	}

	/**
	 * Get the icons for different categories.
	 *
	 * @access protected
	 * @since 1.0
	 * @return array
	 */
	protected function get_icons() {
		// Get common icons from the utility class
		$common_icons = \Kirki\Control\IconPicker\Util\CommonIcons::get_common_icons();

		// Get the rest of the icons by category from FontAwesome
		$solid_icons = array();
		$brand_icons = array();

		// If FontAwesome control exists, we can reuse its methods
		if ( class_exists( '\Kirki\Control\FontAwesome' ) ) {
			$fa       = new \Kirki\Control\FontAwesome( $this->manager, 'temp-id', array() );
			$fa_icons = $fa->get_fontawesome_icons();

			$solid_icons = $fa_icons['solid'] ?? array();
			$brand_icons = $fa_icons['brands'] ?? array();
		}

		return array(
			'common' => $common_icons,
			'solid'  => $solid_icons,
			'brands' => $brand_icons,
		);
	}

	/**
	 * Refresh the parameters passed to the JavaScript via JSON.
	 *
	 * @access public
	 * @since 1.0
	 * @return void
	 */
	public function to_json() {
		parent::to_json();

		$this->json['icons']      = $this->get_icons();
		$this->json['categories'] = array(
			'common' => esc_html__( 'Common', 'blog-over' ),
			'solid'  => esc_html__( 'Solid', 'blog-over' ),
			'brands' => esc_html__( 'Brands', 'blog-over' ),
		);
	}

	/**
	 * An Underscore (JS) template for this control's content (but not its container).
	 *
	 * @access protected
	 * @since 1.0
	 * @return void
	 */
	protected function content_template() {
		?>
		<# if ( data.label ) { #><span class="customize-control-title">{{{ data.label }}}</span><# } #>
		<# if ( data.description ) { #><span class="description customize-control-description">{{{ data.description }}}</span><# } #>
		
		<div class="kirki-iconpicker-control">
			<div class="input-group">
				<input 
					type="text" 
					class="kirki-iconpicker-input" 
					value="{{ data.value }}" 
					{{{ data.link }}}
					placeholder="<?php esc_attr_e( 'Select an icon...', 'blog-over' ); ?>"
				/>
				<span class="input-group-addon kirki-iconpicker-preview">
					<i class="fa {{ data.value }}"></i>
				</span>
				<button type="button" class="kirki-iconpicker-picker-btn">
					<span class="dashicons dashicons-search"></span>
				</button>
			</div>
			
			<div class="kirki-iconpicker-picker-popover">
				<div class="kirki-iconpicker-picker-header">
					<input type="search" class="kirki-iconpicker-search" placeholder="<?php esc_attr_e( 'Search icons...', 'blog-over' ); ?>">
				</div>
				
				<div class="kirki-iconpicker-picker-content">
					<div class="kirki-iconpicker-picker-tabs">
						<# _.each( data.categories, function( label, id ) { #>
							<button type="button" class="kirki-iconpicker-tab <# if (id === 'common') { #>active<# } #>" data-tab="{{ id }}">{{ label }}</button>
						<# }); #>
					</div>
					
					<div class="kirki-iconpicker-icons-container">
						<# _.each( data.icons, function( icons, category ) { #>
							<div class="kirki-iconpicker-icons-tab kirki-iconpicker-icons-{{ category }} <# if (category === 'common') { #>active<# } #>">
								<# _.each( icons, function( icon ) { #>
									<# if (category === 'common') { #>
										<i class="fa {{ icon.class }}" data-icon="{{ icon.class }}" title="{{ icon.name }}"></i>
									<# } else { #>
										<i class="fa fa-{{ category }} fa-{{ icon }}" data-icon="fa-{{ icon }}" title="{{ icon }}"></i>
									<# } #>
								<# }); #>
							</div>
						<# }); #>
					</div>
				</div>
			</div>
		</div>
		<?php
	}
}

/**
 * Common Icons utility class.
 *
 * @package   kirki-framework/control-iconpicker
 * @copyright Copyright (c) 2023, Themeum
 * @license   https://opensource.org/licenses/MIT
 * @since     1.0
 */

namespace Kirki\Control\IconPicker\Util;

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

/**
 * Common Icons utility.
 *
 * @since 1.0
 */
class CommonIcons {

	/**
	 * Get commonly used icons.
	 *
	 * @access public
	 * @since 1.0
	 * @return array
	 */
	public static function get_common_icons() {
		return array(
			// Interface icons
			array(
				'class' => 'fa-search',
				'name'  => 'Search',
			),
			array(
				'class' => 'fa-home',
				'name'  => 'Home',
			),
			array(
				'class' => 'fa-bars',
				'name'  => 'Menu',
			),
			array(
				'class' => 'fa-times',
				'name'  => 'Close',
			),
			array(
				'class' => 'fa-cog',
				'name'  => 'Settings',
			),
			array(
				'class' => 'fa-user',
				'name'  => 'User',
			),
			array(
				'class' => 'fa-users',
				'name'  => 'Users',
			),

			// Actions
			array(
				'class' => 'fa-plus',
				'name'  => 'Add',
			),
			array(
				'class' => 'fa-minus',
				'name'  => 'Remove',
			),
			array(
				'class' => 'fa-edit',
				'name'  => 'Edit',
			),
			array(
				'class' => 'fa-trash',
				'name'  => 'Delete',
			),
			array(
				'class' => 'fa-download',
				'name'  => 'Download',
			),
			array(
				'class' => 'fa-upload',
				'name'  => 'Upload',
			),

			// Navigation
			array(
				'class' => 'fa-chevron-left',
				'name'  => 'Chevron Left',
			),
			array(
				'class' => 'fa-chevron-right',
				'name'  => 'Chevron Right',
			),
			array(
				'class' => 'fa-chevron-up',
				'name'  => 'Chevron Up',
			),
			array(
				'class' => 'fa-chevron-down',
				'name'  => 'Chevron Down',
			),
			array(
				'class' => 'fa-arrow-left',
				'name'  => 'Arrow Left',
			),
			array(
				'class' => 'fa-arrow-right',
				'name'  => 'Arrow Right',
			),

			// Communication
			array(
				'class' => 'fa-envelope',
				'name'  => 'Email',
			),
			array(
				'class' => 'fa-phone',
				'name'  => 'Phone',
			),
			array(
				'class' => 'fa-comment',
				'name'  => 'Comment',
			),
			array(
				'class' => 'fa-bell',
				'name'  => 'Notification',
			),
			array(
				'class' => 'fa-share',
				'name'  => 'Share',
			),

			// Status and feedback
			array(
				'class' => 'fa-check',
				'name'  => 'Check',
			),
			array(
				'class' => 'fa-exclamation-circle',
				'name'  => 'Warning',
			),
			array(
				'class' => 'fa-info-circle',
				'name'  => 'Info',
			),
			array(
				'class' => 'fa-question-circle',
				'name'  => 'Help',
			),
			array(
				'class' => 'fa-thumbs-up',
				'name'  => 'Like',
			),
			array(
				'class' => 'fa-heart',
				'name'  => 'Heart',
			),
			array(
				'class' => 'fa-star',
				'name'  => 'Star',
			),

			// E-commerce
			array(
				'class' => 'fa-shopping-cart',
				'name'  => 'Shopping Cart',
			),
			array(
				'class' => 'fa-credit-card',
				'name'  => 'Credit Card',
			),
			array(
				'class' => 'fa-tag',
				'name'  => 'Tag',
			),
			array(
				'class' => 'fa-gift',
				'name'  => 'Gift',
			),

			// Content
			array(
				'class' => 'fa-file',
				'name'  => 'File',
			),
			array(
				'class' => 'fa-image',
				'name'  => 'Image',
			),
			array(
				'class' => 'fa-video',
				'name'  => 'Video',
			),
			array(
				'class' => 'fa-calendar',
				'name'  => 'Calendar',
			),
			array(
				'class' => 'fa-map-marker-alt',
				'name'  => 'Location',
			),
			array(
				'class' => 'fa-link',
				'name'  => 'Link',
			),
			array(
				'class' => 'fa-eye',
				'name'  => 'View',
			),
			array(
				'class' => 'fa-eye-slash',
				'name'  => 'Hide',
			),
		);
	}

	/**
	 * Load icons from inc/fontawesome directory if available.
	 *
	 * @access public
	 * @since 1.0
	 * @return array
	 */
	public static function load_from_inc_fontawesome() {
		$icons            = array();
		$fontawesome_path = get_template_directory() . '/inc/fontawesome/';

		if ( is_dir( $fontawesome_path ) ) {
			// Look for icon files in inc/fontawesome
			$files = glob( $fontawesome_path . '*.php' );

			foreach ( $files as $file ) {
				$icon_data = include $file;
				if ( is_array( $icon_data ) ) {
					$icons = array_merge( $icons, $icon_data );
				}
			}
		}

		return $icons;
	}
}
