<?php

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

// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound
$settings = isset( $settings ) && is_array( $settings ) ? $settings : get_option( 'ugcify_review_form_settings', array( 'formVisibility' => 'logged-in' ) );
$about_option_settings = get_option( 'ugcify_review_form_about_settings', array() );

if ( is_array( $about_option_settings ) && ! empty( $about_option_settings ) ) {
	$settings = array_merge( $settings, $about_option_settings );
}

$form_visibility = isset( $settings['formVisibility'] ) ? $settings['formVisibility'] : 'logged-in';
$is_logged_in    = is_user_logged_in();
$hide_user_info  = false;

if (
	( 'logged-in' === $form_visibility && $is_logged_in ) ||
	( 'verified-buyers' === $form_visibility && $is_logged_in ) ||
	( 'anyone' === $form_visibility && $is_logged_in )
) {
	$hide_user_info = true;
}

$show_about_title = ! isset( $settings['showAboutTitle'] ) || (bool) $settings['showAboutTitle'];
$about_title_text = ! empty( $settings['aboutTitleText'] ) ? $settings['aboutTitleText'] : __( 'Tell us about you', 'ugcify' );

$about_title_size_map = array(
	'small'  => 14,
	'medium' => 18,
	'large'  => 24,
);
$about_title_weight_map = array(
	'regular'  => 400,
	'semibold' => 600,
	'bold'     => 700,
);
$about_title_size_key   = $settings['aboutTitleSize'] ?? 'medium';
$about_title_weight_key = $settings['aboutTitleWeight'] ?? 'semibold';

$about_title_size   = isset( $about_title_size_map[ $about_title_size_key ] ) ? $about_title_size_map[ $about_title_size_key ] : $about_title_size_map['medium'];
$about_title_weight = isset( $about_title_weight_map[ $about_title_weight_key ] ) ? $about_title_weight_map[ $about_title_weight_key ] : $about_title_weight_map['semibold'];

$about_title_color = sanitize_hex_color( $settings['aboutTitleColor'] ?? '' );
$about_title_color = $about_title_color ? $about_title_color : '#000000';

$about_next_text = ! empty( $settings['aboutNextButtonText'] ) ? $settings['aboutNextButtonText'] : __( 'Next', 'ugcify' );
$about_back_text = ! empty( $settings['aboutBackButtonText'] ) ? $settings['aboutBackButtonText'] : __( 'Back', 'ugcify' );

$about_next_fill_color   = sanitize_hex_color( $settings['aboutNextButtonFillColor'] ?? '' );
$about_next_stroke_color = sanitize_hex_color( $settings['aboutNextButtonStrokeColor'] ?? '' );
$about_next_font_color   = sanitize_hex_color( $settings['aboutNextButtonFontColor'] ?? '' );
$about_back_fill_color   = sanitize_hex_color( $settings['aboutBackButtonFillColor'] ?? '' );
$about_back_stroke_color = sanitize_hex_color( $settings['aboutBackButtonStrokeColor'] ?? '' );
$about_back_font_color   = sanitize_hex_color( $settings['aboutBackButtonFontColor'] ?? '' );

$about_next_fill_color   = $about_next_fill_color ? $about_next_fill_color : '#201CFE';
$about_next_stroke_color = $about_next_stroke_color ? $about_next_stroke_color : '#201CFE';
$about_next_font_color   = $about_next_font_color ? $about_next_font_color : '#FFFFFF';
$about_back_fill_color   = $about_back_fill_color ? $about_back_fill_color : '#FFFFFF';
$about_back_stroke_color = $about_back_stroke_color ? $about_back_stroke_color : '#201CFE';
$about_back_font_color   = $about_back_font_color ? $about_back_font_color : '#000000';

$email_required        = ! isset( $settings['aboutEmailRequired'] ) || (bool) $settings['aboutEmailRequired'];
$display_name_required = ! isset( $settings['aboutDisplayNameRequired'] ) || (bool) $settings['aboutDisplayNameRequired'];
$show_anonymous        = ! isset( $settings['aboutShowAnonymous'] ) || (bool) $settings['aboutShowAnonymous'];
?>
<?php if ( ! $hide_user_info ) : ?>
<!-- Step 3: User Info -->
<div class="ugcify-form-step ugcify-step-user-info" data-step="3" style="display: none;">
	<?php if ( $show_about_title ) : ?>
		<h2
			class="ugcify-step-subtitle"
			style="color: <?php echo esc_attr( $about_title_color ); ?>; font-size: <?php echo esc_attr( $about_title_size ); ?>px; font-weight: <?php echo esc_attr( $about_title_weight ); ?>;"
		>
			<?php echo esc_html( $about_title_text ); ?>
		</h2>
	<?php endif; ?>

	<div class="ugcify-form-fields">
		<div class="ugcify-form-field">
			<label for="ugcify-email" class="ugcify-form-label">
				<?php esc_html_e( 'Email', 'ugcify' ); ?>
				<?php if ( $email_required ) : ?>
					<span class="ugcify-required">*</span>
				<?php endif; ?>
			</label>
			<input type="email" id="ugcify-email" name="email" class="ugcify-form-input" placeholder="Email" <?php echo $email_required ? 'required' : ''; ?> />
		</div>

		<div class="ugcify-form-field">
			<label for="ugcify-display-name" class="ugcify-form-label">
				<?php esc_html_e( 'Display Name', 'ugcify' ); ?>
				<?php if ( $display_name_required ) : ?>
					<span class="ugcify-required">*</span>
				<?php endif; ?>
			</label>
			<input type="text" id="ugcify-display-name" name="displayName" class="ugcify-form-input" placeholder="Your name" <?php echo $display_name_required ? 'required' : ''; ?> />
			<div class="ugcify-form-hint">
				<?php esc_html_e( 'Name will not appear on the review if you choose to post anonymously.', 'ugcify' ); ?>
			</div>
		</div>

		<?php if ( $show_anonymous ) : ?>
			<label class="ugcify-terms-checkbox ugcify-checkbox-group">
				<label class="ugcify-checkbox">
					<input type="checkbox" id="ugcify-anonymous" name="anonymous" />
					<span class="ugcify-checkbox-ui"></span>
				</label>

				<span>
					<span><?php esc_html_e( 'Post review as anonymous', 'ugcify' ); ?></span>
				</span>
			</label>
		<?php endif; ?>
	</div>
	<div class="ugcify-step-actions">
		<button
			type="button"
			class="ugcify-button ugcify-button-outline ugcify-step-back"
			style="background: <?php echo esc_attr( $about_back_fill_color ); ?>; border-color: <?php echo esc_attr( $about_back_stroke_color ); ?>; color: <?php echo esc_attr( $about_back_font_color ); ?>;"
		>
			<?php echo esc_html( $about_back_text ); ?>
		</button>
		<svg xmlns="http://www.w3.org/2000/svg" width="131" height="27" viewBox="0 0 131 27" fill="none">
			<circle cx="13.5" cy="13.5" r="12.5" stroke="#201CFE" stroke-width="2"/>
			<path d="M8.1333 14.7506L11.1761 17.7934L19.3027 9.66669" stroke="#201CFE" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"/>
			<circle cx="47.5" cy="13.5" r="12.5" stroke="#201CFE" stroke-width="2"/>
			<path d="M42.1333 14.7506L45.1761 17.7934L53.3027 9.66669" stroke="#201CFE" stroke-width="2.4" stroke-linecap="round" stroke-linejoin="round"/>
			<circle cx="81.5" cy="13.5" r="12.5" stroke="#E0DFFF" stroke-width="2"/>
			<circle cx="117.5" cy="13.5" r="12.5" stroke="#E0DFFF" stroke-width="2"/>
		</svg>
		<button
			type="button"
			class="ugcify-button ugcify-button-primary ugcify-step-next"
			style="background: <?php echo esc_attr( $about_next_fill_color ); ?>; border-color: <?php echo esc_attr( $about_next_stroke_color ); ?>; color: <?php echo esc_attr( $about_next_font_color ); ?>;"
			disabled
		>
			<?php echo esc_html( $about_next_text ); ?>
		</button>
	</div>
</div>
<?php endif; ?>
