<?php
/**
 * View: Widget Appearance metabox.
 *
 * @package Ilabs\Firevert\Modules\PowerWidget
 *
 * @var WP_Post $post Post instance.
 * @var string $firevert_power_widget_text
 * @var string $firevert_power_widget_type
 * @var int    $firevert_power_widget_image
 * @var string $firevert_power_widget_toggle_close
 * @var string $firevert_power_widget_toggle_open
 * @var bool   $firevert_power_widget_shadow
 * @var string $firevert_power_widget_bg_color
 * @var string $firevert_power_widget_primary_color
 * @var string $firevert_power_widget_primary_text_color
 * @var string $firevert_power_widget_counter_bg
 * @var string $firevert_power_widget_counter_text
 * @var string $firevert_power_widget_image_url
 * @var int $firevert_power_widget_border_radius
 */

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

use Ilabs\Firevert\Modules\PowerWidget\Services\Type\SectionType;
use Ilabs\Firevert\Core\Services\Helper\Integration\LanguageHelper;

firevert_view(
	'_partials/language-switcher.view.php',
	array(
		'languages' => LanguageHelper::get_available_languages(),
		'current'   => LanguageHelper::get_active_region_code(),
	)
);
?>

<form method='post' action="<?php echo esc_url( admin_url( 'admin-post.php' ) ); ?>" class='firevert-form'>
	<?php wp_nonce_field( 'firevert_power_widget_save', 'firevert_power_widget_nonce' ); ?>
	<input type="hidden" name="action" value="firevert_save_power_widget">
	<input type="hidden" name="section" value="<?php echo esc_attr( SectionType::APPEARANCE ); ?>">
	<input type="hidden" name="post_ID" value="<?php echo esc_attr( $post->ID ); ?>">

	<div class="metabox-holder woocommerce">

		<div class="postbox wc-metabox">
			<div class="postbox-header">
				<h2 class="hndle"><span><?php esc_html_e( 'Widget Type', 'firevert' ); ?></span></h2>
			</div>
			<div class="inside">
				<p>
					<label>
						<input type="radio" name="firevert_power_widget_type" value="text"
							<?php checked( $firevert_power_widget_type, 'text' ); ?> />
						<?php esc_html_e( 'Text', 'firevert' ); ?>
					</label>
					&nbsp;
					<label>
						<input type="radio" name="firevert_power_widget_type" value="image"
							<?php checked( $firevert_power_widget_type, 'image' ); ?> />
						<?php esc_html_e( 'Image', 'firevert' ); ?>
					</label>
				</p>

				<div id='widget-type-text' class='widget-type-block'
					style="<?php echo 'text' === $firevert_power_widget_type ? '' : 'display:none'; ?>">
					<p>
						<label for='firevert_power_widget_text'>
							<?php echo esc_html( firevert_label_with_lang( __( 'Text', 'firevert' ) ) ); ?>
						</label>
					</p>

					<?php
					wp_editor(
						$firevert_power_widget_text,
						'firevert_power_widget_text',
						array(
							'textarea_name' => 'firevert_power_widget_text',
							'textarea_rows' => 2,
							'media_buttons' => false,
							'teeny'         => true,
							'editor_class'  => '',
						)
					);
					?>
				</div>

				<div id="widget-type-image" class="widget-type-block"
					style="<?php echo 'image' === $firevert_power_widget_type ? '' : 'display:none'; ?>">
					<label><?php esc_html_e( 'Widget image', 'firevert' ); ?></label><br/>
					<div id="widget-image-preview">
						<?php if ( $firevert_power_widget_image_url ) : ?>
							<img src="<?php echo esc_url( $firevert_power_widget_image_url ); ?>"
								style="max-width:100%; height:auto;"/>
						<?php endif; ?>
					</div>
					<input type="hidden" name="firevert_power_widget_image" id="firevert_power_widget_image"
						value="<?php echo esc_attr( $firevert_power_widget_image ); ?>"/>
					<button type="button" class="button" id="select-widget-image">
						<?php esc_html_e( 'Select image', 'firevert' ); ?>
					</button>
				</div>

				<p>
					<label for='firevert_power_widget_border_radius'>
						<?php esc_html_e( 'Border radius (px)', 'firevert' ); ?>
					</label><br/>
					<input type="number" name="firevert_power_widget_border_radius"
						id="firevert_power_widget_border_radius"
						value="<?php echo esc_attr( $firevert_power_widget_border_radius ?? 20 ); ?>"
						min="0" step="1"/>
				</p>

				<p>
					<label for='firevert_power_widget_toggle_open'>
						<?php echo esc_html( firevert_label_with_lang( __( 'Text when widget is collapsed (open button)', 'firevert' ) ) ); ?>
					</label><br/>
					<input type="text" name="firevert_power_widget_toggle_open"
						id="firevert_power_widget_toggle_open"
						value="<?php echo esc_attr( $firevert_power_widget_toggle_open ?? '' ); ?>"
						style="width:100%;"/>
				</p>

				<p>
					<label for='firevert_power_widget_toggle_close'>
						<?php echo esc_html( firevert_label_with_lang( __( 'Text when widget is expanded (close button)', 'firevert' ) ) ); ?>
					</label><br/>
					<input type="text" name="firevert_power_widget_toggle_close" id="firevert_power_widget_toggle_close"
						value="<?php echo esc_attr( $firevert_power_widget_toggle_close ?? '' ); ?>"
						style="width:100%;"/>
				</p>
			</div>
		</div>

		<div class="postbox wc-metabox">
			<div class="postbox-header">
				<h2 class="hndle"><span><?php esc_html_e( 'Color Scheme', 'firevert' ); ?></span></h2>
			</div>
			<div class="inside">
				<?php
				$colors = array(
					'bg_color'           => __( 'Background', 'firevert' ),
					'primary_color'      => __( 'Primary color', 'firevert' ),
					'primary_text_color' => __( 'Primary text color', 'firevert' ),
					'counter_bg'         => __( 'Counter background', 'firevert' ),
					'counter_text'       => __( 'Counter text color', 'firevert' ),
				);

				foreach ( $colors as $suffix => $label ) :
					$key   = "firevert_power_widget_$suffix";
					$value = $$key ?? '';
					?>
					<p>
						<label for="<?php echo esc_attr( $key ); ?>">
							<?php echo esc_html( $label ); ?>
						</label><br/>
						<input type="color" name="<?php echo esc_attr( $key ); ?>"
							id="<?php echo esc_attr( $key ); ?>"
							value="<?php echo esc_attr( $value ); ?>"/>
					</p>
				<?php endforeach; ?>

				<p>
					<label>
						<input type="checkbox" name="firevert_power_widget_shadow"
							value="1" <?php checked( $firevert_power_widget_shadow ); ?> />
						<?php esc_html_e( 'Add shadow to widget', 'firevert' ); ?>
					</label>
				</p>
			</div>
		</div>
	</div>

	<?php submit_button( __( 'Save', 'firevert' ) ); ?>
</form>
