<?php
/**
 * Settings tab - Floating Sidebar.
 *
 * Variable: $options (Options instance)
 *
 * @package Relatedly
 * @since   2.0.0
 * @since   2.3.0 Rebuilt with native form rows.
 */

// phpcs:disable WordPress.NamingConventions.PrefixAllGlobals.NonPrefixedVariableFound
defined( 'ABSPATH' ) || exit;

use Relatedly\Premium\FeatureGate;
use Relatedly\Premium\LicenseManager;

if ( ! FeatureGate::can_use_floating_sidebar() ) :
	$upgrade_url = LicenseManager::checkout_url();
	?>
	<div class="relatedly-settings-panel">
		<div class="relatedly-settings-panel-header">
			<h2 class="relatedly-settings-panel-title"><?php esc_html_e( 'Floating Sidebar', 'relatedly' ); ?></h2>
			<p class="relatedly-settings-panel-desc"><?php esc_html_e( 'A sticky sidebar widget that follows visitors as they scroll.', 'relatedly' ); ?></p>
		</div>
		<div class="relatedly-settings-panel-body">
			<div class="relatedly-upgrade-panel">
				<h3><?php esc_html_e( 'Floating Sidebar is available in Pro', 'relatedly' ); ?></h3>
				<p><?php esc_html_e( 'Unlock sticky recommendations, scroll triggers, dismiss controls, and rotating posts.', 'relatedly' ); ?></p>
				<a class="button button-primary" href="<?php echo esc_url( $upgrade_url ); ?>" target="_blank" rel="noopener noreferrer">
					<?php esc_html_e( 'View Plans', 'relatedly' ); ?>
				</a>
			</div>
		</div>
	</div>
	<?php
	return;
endif;

$current_variant = (string) $options->get( 'floating_sidebar_variant', 'variant1' );
?>
<div class="relatedly-settings-panel">
	<div class="relatedly-settings-panel-header">
		<h2 class="relatedly-settings-panel-title"><?php esc_html_e( 'Floating Sidebar', 'relatedly' ); ?></h2>
		<p class="relatedly-settings-panel-desc"><?php esc_html_e( 'Configure the paid floating related-post widget.', 'relatedly' ); ?></p>
	</div>

	<div class="relatedly-settings-panel-body">
		<table class="form-table relatedly-settings-table">
			<tbody>
				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="relatedly-floating-enabled"><?php esc_html_e( 'Sidebar Display', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Show the floating sidebar on supported post types.', 'relatedly' ); ?></p>
					</th>
					<td>
						<div class="relatedly-toggle-row">
							<div class="relatedly-toggle-switch">
								<input type="checkbox" name="floating_sidebar_enabled" id="relatedly-floating-enabled" value="1" <?php checked( $options->get( 'floating_sidebar_enabled', false ) ); ?>>
								<label for="relatedly-floating-enabled"></label>
							</div>
						</div>
					</td>
				</tr>

				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="floating_sidebar_variant"><?php esc_html_e( 'Variant', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Choose the floating widget design.', 'relatedly' ); ?></p>
					</th>
					<td>
						<select name="floating_sidebar_variant" id="floating_sidebar_variant" class="relatedly-control">
							<?php for ( $i = 1; $i <= 5; $i++ ) : ?>
								<option value="variant<?php echo esc_attr( (string) $i ); ?>" <?php selected( $current_variant, 'variant' . $i ); ?>>
									<?php
									printf(
										/* translators: %d: floating sidebar variant number. */
										esc_html__( 'Variant %d', 'relatedly' ),
										absint( $i )
									);
									?>
								</option>
							<?php endfor; ?>
						</select>
					</td>
				</tr>

				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="relatedly-floating-position"><?php esc_html_e( 'Position', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Choose which side of the screen the widget uses.', 'relatedly' ); ?></p>
					</th>
					<td>
						<select name="floating_sidebar_position" id="relatedly-floating-position" class="relatedly-control">
							<option value="right" <?php selected( $options->get( 'floating_sidebar_position', 'right' ), 'right' ); ?>><?php esc_html_e( 'Right', 'relatedly' ); ?></option>
							<option value="left" <?php selected( $options->get( 'floating_sidebar_position', 'right' ), 'left' ); ?>><?php esc_html_e( 'Left', 'relatedly' ); ?></option>
						</select>
					</td>
				</tr>

				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="relatedly-floating-count"><?php esc_html_e( 'Post Count', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Maximum posts shown in the floating widget.', 'relatedly' ); ?></p>
					</th>
					<td>
						<input type="number" name="floating_sidebar_num_posts" id="relatedly-floating-count" class="relatedly-control" min="1" max="5" value="<?php echo esc_attr( $options->get( 'floating_sidebar_num_posts', 1 ) ); ?>">
					</td>
				</tr>

				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="relatedly-floating-trigger"><?php esc_html_e( 'Display Trigger', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Show immediately or after the reader scrolls.', 'relatedly' ); ?></p>
					</th>
					<td>
						<select name="floating_sidebar_display_trigger" id="relatedly-floating-trigger" class="relatedly-control">
							<option value="always" <?php selected( $options->get( 'floating_sidebar_display_trigger', 'always' ), 'always' ); ?>><?php esc_html_e( 'Always', 'relatedly' ); ?></option>
							<option value="scroll" <?php selected( $options->get( 'floating_sidebar_display_trigger', 'always' ), 'scroll' ); ?>><?php esc_html_e( 'After scroll percentage', 'relatedly' ); ?></option>
						</select>
					</td>
				</tr>

				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="relatedly-floating-scroll"><?php esc_html_e( 'Scroll Percentage', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Percentage of page scroll before the widget appears.', 'relatedly' ); ?></p>
					</th>
					<td>
						<input type="number" name="floating_sidebar_scroll_percentage" id="relatedly-floating-scroll" class="relatedly-control" min="0" max="100" value="<?php echo esc_attr( $options->get( 'floating_sidebar_scroll_percentage', 25 ) ); ?>">
					</td>
				</tr>

				<tr>
					<th scope="row">
						<label class="relatedly-field-label" for="relatedly-floating-dismiss"><?php esc_html_e( 'Dismiss Behavior', 'relatedly' ); ?></label>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Choose how long a visitor dismissal lasts.', 'relatedly' ); ?></p>
					</th>
					<td>
						<select name="floating_sidebar_dismiss_behavior" id="relatedly-floating-dismiss" class="relatedly-control">
							<option value="per_page" <?php selected( $options->get( 'floating_sidebar_dismiss_behavior', 'per_page' ), 'per_page' ); ?>><?php esc_html_e( 'Per page', 'relatedly' ); ?></option>
							<option value="per_session" <?php selected( $options->get( 'floating_sidebar_dismiss_behavior', 'per_page' ), 'per_session' ); ?>><?php esc_html_e( 'Per session', 'relatedly' ); ?></option>
						</select>
					</td>
				</tr>

				<tr>
					<th scope="row">
						<span class="relatedly-field-label"><?php esc_html_e( 'Auto Refresh', 'relatedly' ); ?></span>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Rotate posts automatically while the widget is visible.', 'relatedly' ); ?></p>
					</th>
					<td>
						<label class="relatedly-checkbox-item" for="relatedly-floating-refresh">
							<input type="checkbox" name="floating_sidebar_auto_refresh_enabled" id="relatedly-floating-refresh" value="1" <?php checked( $options->get( 'floating_sidebar_auto_refresh_enabled', false ) ); ?>>
							<?php esc_html_e( 'Rotate posts automatically', 'relatedly' ); ?>
						</label>
						<input type="number" name="floating_sidebar_auto_refresh_seconds" class="relatedly-control relatedly-control-small" min="5" max="60" value="<?php echo esc_attr( $options->get( 'floating_sidebar_auto_refresh_seconds', 10 ) ); ?>">
					</td>
				</tr>

				<tr>
					<th scope="row">
						<span class="relatedly-field-label"><?php esc_html_e( 'Floating Preview', 'relatedly' ); ?></span>
						<p class="relatedly-field-hint"><?php esc_html_e( 'Preview the selected floating variant in context.', 'relatedly' ); ?></p>
					</th>
					<td>
						<div class="relatedly-preview-frame" id="relatedly-floating-preview">
							<div class="relatedly-preview-placeholder">
								<strong><?php esc_html_e( 'Related Posts', 'relatedly' ); ?></strong>
								<span><?php esc_html_e( 'A floating sidebar preview will load here.', 'relatedly' ); ?></span>
							</div>
						</div>
					</td>
				</tr>
			</tbody>
		</table>
	</div>

	<div class="relatedly-save-bar">
		<?php submit_button( __( 'Save Changes', 'relatedly' ), 'primary', 'submit', false ); ?>
	</div>
</div>
