<?php
namespace Cool_FormKit_Pro\Widgets\Addons;

use Cool_FormKit_Pro\Modules\Forms\Fields\Field_Base;
if ( ! defined( 'ABSPATH' ) ) {
	exit; // Exit if accessed directly.
}

	/**
	 * Elementor Form Field - WYSIWYG
	 *
	 * Add a new "WYSIWYG" field to Elementor form widget.
	 *
	 * @since 1.0.0
	 */
if(!class_exists('CoolForm_WYSIWYG_Editor_Field_Register')) { 
class CoolForm_WYSIWYG_Editor_Field_Register extends Field_Base {

		public $depended_scripts = array( 'coolform-wysiwyg-frontend' );
		public $depended_styles = array( 'coolform-wysiwyg-css' );

		/**
		 * Get field type.
		 *
		 * Retrieve WYSIWYG Field unique ID.
		 *
		 * @since 1.0.0
		 * @access public
		 * @return string Field type.
		 */
		public function get_type() {
			return 'WYSIWYG';
		}

		/**
		 * Get field name.
		 *
		 * Retrieve WYSIWYG Field label.
		 *
		 * @since 1.0.0
		 * @access public
		 * @return string Field name.
		 */
		public function get_name() {
			return esc_html__( 'WYSIWYG', 'cool-formkit' );
		}

		/**
		 * Render field output on the frontend.
		 *
		 * @since 1.0.0
		 * @access public
		 * @param mixed $item
		 * @param mixed $item_index
		 * @param mixed $form
		 * @return void
		 */
		public function render( $item, $item_index, $form ) {
			$form_settings = $form->get_settings_for_display();

			//Retrieve border settings
			$border_color = !empty($form_settings['field_border_color']) ? esc_attr($form_settings['field_border_color']) : '#646060';
			$border_width = !empty($form_settings['field_border_width']['top']) ? esc_attr($form_settings['field_border_width']['top']) : '1';
			$border_unit = !empty($form_settings['field_border_width']['unit']) ? esc_attr($form_settings['field_border_width']['unit']) : 'px';
			$radius_width = !empty($form_settings['field_border_radius']['top']) ? esc_attr($form_settings['field_border_radius']['top']) : '0';
			$radius_unit = !empty($form_settings['field_border_radius']['unit']) ? esc_attr($form_settings['field_border_radius']['unit']) : 'px';

			$editor_id = $form->get_attribute_id($item);
			echo "<div class='cfkef-wysiwyg-wrapper' style='width: 100%'>";
			echo '<textarea id="' . esc_attr($editor_id) . '" class="cfkef-wysiwyg-field border_' . esc_attr($border_width) . esc_attr($border_unit) . '_solid_' . esc_attr($border_color).' radius_'.esc_attr($radius_width) . esc_attr($radius_unit).'" name=' . esc_attr($form->get_attribute_name($item)) . '"></textarea>';
			echo '</div>';	  
		}

		public function __construct() {
			parent::__construct();
		
			// Register required scripts and styles
			add_action('wp_enqueue_scripts', array($this, 'enqueue_scripts'));
			add_action( 'wp_enqueue_scripts', array( $this, 'add_assets_files' ) );
			add_action( 'elementor/preview/init', array( $this, 'editor_preview_footer' ) );
			add_action('elementor/preview/init', array($this, 'enqueue_scripts'));
		}
		
		public function add_assets_files() {
			$js_common_dep = array( 'jquery','elementor-frontend');
			if ( ! \Elementor\Plugin::$instance->preview->is_preview_mode() && is_user_logged_in() ) {
				$js_common_dep = array_merge(array( 'elementor-common' ), $js_common_dep);
			}
	
			wp_register_script('coolform-wysiwyg-frontend', CFKEF_PLUGIN_URL . 'assets/addons/js/coolform-wysiwyg_frontend.js', $js_common_dep, CFKEF_PLUGIN_VERSION, true);
			wp_register_style('coolform-wysiwyg-css', CFKEF_PLUGIN_URL . 'assets/css/wysiwyg.css', null, CFKEF_PLUGIN_VERSION);

		}


		/**
		 * Get script dependencies for this field.
		 *
		 * @return array
		 */
		public function get_script_depends() : array {
			return $this->depended_scripts;
		}

		/**
		 * Get style dependencies for this field.
		 *
		 * @return array
		 */
		public function get_style_depends() : array {
			return $this->depended_styles;
		}
    
		/**
		 * Elementor editor preview.
		 *
		 * @since 1.0.0
		 * @return void
		 */
		public function editor_preview_footer() {
			add_action( 'wp_footer', array( $this, 'content_template_script' ) );
		}

		/**
		 * Content template script.
		 *
		 * @since 1.0.0
		 * @return void
		 */
		public function content_template_script() {
			?>
			<script>
			jQuery(document).ready(() => {
				elementor.hooks.addFilter(
					'cool_formkit/forms/content_template/field/<?php echo esc_attr( $this->get_type() ); ?>',
					function (inputField, item, i, settings) {
						// Dynamically set ID and name based on item properties
					   // Access settings safely and correctly
					    const border_color = settings['field_border_color'] ?? '#646060';
						const border_width = settings['field_border_width']['top']?.trim() 
											? settings['field_border_width']['top'] 
											: '1';
						
						const border_unit = settings['field_border_width']['unit'] ?? 'px';
							
						
						// Generate field ID, name, and class
						const fieldId = `form_field_${i}`;
						const fieldName = `form_fields[${item.custom_id}]`;
						const fieldClass = `cfkef-wysiwyg-field`;
		
						// Generate the WYSIWYG field template with dynamic values
						return `<div class='cfkef-wysiwyg-wrapper' style='width: 100%'>
							<textarea id="${fieldId}" name="${fieldName}" class="${fieldClass} border_${border_width}${border_unit}_solid_${border_color}"></textarea>
						</div>`;	
					},
					10, 3
				);
			});
			</script>
			<?php
		}

		public function validation( $field, $record, $ajax_handler ) {
			if ( empty( $field['value'] ) ) {
				return;
			}

		if($field['type'] == "WYSIWYG"){
			$record->update_field($field['id'], 'value', wp_kses_post($field['raw_value']));
		  }
		}

		public function enqueue_scripts(){
			if ( ! did_action( 'wp_enqueue_media' ) ){
				wp_enqueue_media();
			}
			wp_enqueue_editor(); 
		}
	}
}
