<?php

namespace ThimPress\ThimBlocks\Gutenberg\Blocks\ProgressBar;

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

use ThimPress\ThimBlocks\Gutenberg\Blocks\AbstractBlockType;
use Throwable;

/**
 * Class ProgressBarBlockType
 *
 * Handle register, render block template
 */
class ProgressBarBlockType extends AbstractBlockType {


	public $block_name = 'progress-bar';

	public function get_supports(): array {
		return array(
			'align'   => array( 'wide', 'full' ),
			'spacing' => array(
				'margin'  => true,
				'padding' => true,
			),
		);
	}

	/**
	 * Render content of block tag
	 *
	 * @param array $attributes | Attributes of block tag.
	 *
	 * @return false|string
	 */
	public function render_content_block_template( array $attributes, $content, $block ): string {
		$html = '';

		try {
			$handle = 'thim-blocks-view-' . $this->block_name;
			wp_enqueue_script( $handle );

			$title           = isset( $attributes['title'] ) ? esc_html( $attributes['title'] ) : '';
			$title_position  = isset( $attributes['titlePosition'] ) ? $attributes['titlePosition'] : 'outside';
			$percent_display = isset( $attributes['percentDisplay'] ) ? $attributes['percentDisplay'] : 'outside';

			$percentage = isset( $attributes['percentage'] ) ? (int) $attributes['percentage'] : 50;
			$percentage = max( 0, min( 100, $percentage ) );

			// colors
			$title_color   = ! empty( $attributes['titleColor'] ) ? $attributes['titleColor'] : '';
			$track_color   = ! empty( $attributes['trackColor'] ) ? $attributes['trackColor'] : '';
			$fill_color    = ! empty( $attributes['fillColor'] ) ? $attributes['fillColor'] : '';
			$percent_color = ! empty( $attributes['percentColor'] ) ? $attributes['percentColor'] : '';
			$track_height  = ! empty( $attributes['trackHeight'] ) ? (int) $attributes['trackHeight'] : 20;

			ob_start();
			?>
			<div class="thim-blocks-progress-bar">
				<?php if ( $title && $title_position === 'outside' ) : ?>
					<span class="thim-progress-title"
						<?php if ( $title_color ) : ?>
							style="color:<?php echo esc_attr( $title_color ); ?>"
						<?php endif; ?>>
						<?php echo $title; ?>
					</span>
				<?php endif; ?>

				<div class="thim-progress-track"
					<?php
						$track_style = array();
					if ( $track_color ) {
						$track_style[] = 'background-color:' . esc_attr( $track_color );
					}
					if ( $track_height ) {
						$track_style[] = 'height:' . esc_attr( $track_height ) . 'px';
					}
					if ( $track_style ) {
						echo 'style="' . implode( ';', $track_style ) . '"';
					}
					?>
					>
					<?php if ( $title && $title_position === 'inside' ) : ?>
						<span class="thim-progress-title inside"
							<?php if ( $title_color ) : ?>
								style="color:<?php echo esc_attr( $title_color ); ?>"
							<?php endif; ?>>
							<?php echo $title; ?>
						</span>
					<?php endif; ?>
					<div
						class="thim-progress-fill"
						data-percentage="<?php echo esc_attr( $percentage ); ?>"
						style="width:0%<?php echo $fill_color ? ';background-color:' . esc_attr( $fill_color ) : ''; ?>">

						<?php if ( in_array( $percent_display, array( 'append', 'tooltip' ), true ) ) : ?>
							<span class="thim-progress-percent <?php echo esc_attr( $percent_display ); ?>"
								<?php if ( $percent_color ) : ?>
									style="color:<?php echo esc_attr( $percent_color ); ?>"
								<?php endif; ?>>
								0%
							</span>
						<?php endif; ?>
					</div>
					<?php if ( $percent_display === 'inside' ) : ?>
						<span class="thim-progress-percent inside"
							<?php if ( $percent_color ) : ?>
								style="color:<?php echo esc_attr( $percent_color ); ?>"
							<?php endif; ?>>
							0%
						</span>
					<?php endif; ?>
				</div>

				<?php if ( $percent_display === 'outside' ) : ?>
					<span class="thim-progress-percent outside"
						<?php if ( $percent_color ) : ?>
							style="color:<?php echo esc_attr( $percent_color ); ?>"
						<?php endif; ?>>
						0%
					</span>
				<?php endif; ?>
			</div>
			<?php
			$html = ob_get_clean();
		} catch ( \Throwable $e ) {
			return $html;
		}

		return $html;
	}

}
