<?php
/**
 * The template for displaying the front page
 *
 * @package Zentorone
 */

get_header();
?>

<!-- Homepage Slider (Bootstrap Carousel) -->
<section id="hero-slider" class="carousel slide" data-bs-ride="carousel">
	<div class="carousel-indicators">
		<?php
		$slides_count = 0;
		for ( $i = 1; $i <= 5; $i++ ) {
			if ( zentorone_get_option( 'zentorone_slider_image_' . $i ) ) {
				echo '<button type="button" data-bs-target="#hero-slider" data-bs-slide-to="' . esc_attr( $slides_count ) . '" class="' . ( 0 === $slides_count ? 'active' : '' ) . '" aria-current="' . ( 0 === $slides_count ? 'true' : 'false' ) . '" aria-label="' . esc_attr( sprintf( __( 'Slide %d', 'zentorone' ), $i ) ) . '"></button>';
				$slides_count++;
			}
		}
		?>
	</div>
	<div class="carousel-inner">
		<?php
		$active_class = 'active';
		$has_slides = false;
		for ( $i = 1; $i <= 5; $i++ ) {
			$image = zentorone_get_option( 'zentorone_slider_image_' . $i );
			if ( $image ) {
				$has_slides = true;
				$title = zentorone_get_option( 'zentorone_slider_title_' . $i );
				$desc  = zentorone_get_option( 'zentorone_slider_desc_' . $i );
				$link  = zentorone_get_option( 'zentorone_slider_link_' . $i );
				?>
				<div class="carousel-item <?php echo esc_attr( $active_class ); ?>" style="min-height: 500px; background: url('<?php echo esc_url( $image ); ?>') center/cover no-repeat; background-color: #333;">
					<?php if ( $title || $desc || $link ) : ?>
						<div class="carousel-caption" style="background: rgba(0,0,0,0.5); padding: 20px; border-radius: 10px;">
							<?php if ( $title ) : ?><h5><?php echo esc_html( $title ); ?></h5><?php endif; ?>
							<?php if ( $desc ) : ?><p><?php echo esc_html( $desc ); ?></p><?php endif; ?>
							<?php if ( $link ) : ?><a href="<?php echo esc_url( $link ); ?>" class="btn btn-primary"><?php esc_html_e( 'Learn More', 'zentorone' ); ?></a><?php endif; ?>
						</div>
					<?php endif; ?>
				</div>
				<?php
				$active_class = '';
			}
		}

		if ( ! $has_slides ) : ?>
			<div class="carousel-item active" style="min-height: 500px; background: url('<?php echo esc_url( get_template_directory_uri() . '/assets/images/slide-vector-bw.svg' ); ?>') center/cover no-repeat; background-color: #333;">
				<div class="carousel-caption">
					<h5><?php esc_html_e( 'Welcome to Zentorone', 'zentorone' ); ?></h5>
					<p class="mb-0"><?php esc_html_e( 'Please configure your slides in the Customizer.', 'zentorone' ); ?></p>
				</div>
			</div>
		<?php endif; ?>
	</div>
	<button class="carousel-control-prev" type="button" data-bs-target="#hero-slider" data-bs-slide="prev">
		<span class="carousel-control-prev-icon" aria-hidden="true"></span>
		<span class="visually-hidden"><?php esc_html_e( 'Previous', 'zentorone' ); ?></span>
	</button>
	<button class="carousel-control-next" type="button" data-bs-target="#hero-slider" data-bs-slide="next">
		<span class="carousel-control-next-icon" aria-hidden="true"></span>
		<span class="visually-hidden"><?php esc_html_e( 'Next', 'zentorone' ); ?></span>
	</button>
</section>

<div class="container">
	<div class="row">
		<div class="<?php echo esc_attr( zentorone_column_classes( 'main' ) ); ?>">
			<main id="primary" class="site-main">
				<?php
				if ( have_posts() ) :
					while ( have_posts() ) :
						the_post();
						get_template_part( 'template-parts/content/content', 'page' );
					endwhile;
				else :
					get_template_part( 'template-parts/content/content', 'none' );
				endif;
				?>
			</main><!-- #main -->
		</div><!-- .col -->

		<?php if ( zentorone_get_option( 'zentorone_global_layout', 'right-sidebar' ) !== 'full-width' && zentorone_get_option( 'zentorone_global_layout', 'right-sidebar' ) !== 'no-sidebar' ) : ?>
			<div class="<?php echo esc_attr( zentorone_column_classes( 'sidebar' ) . ( zentorone_get_option( 'zentorone_global_layout', 'right-sidebar' ) === 'left-sidebar' ? ' order-first' : '' ) ); ?>">
				<?php get_sidebar(); ?>
			</div>
		<?php endif; ?>
	</div><!-- .row -->
</div><!-- .container -->

<?php
get_footer();