<?php
/**
 * The main template file.
 *
 * This is the most generic template file in a WordPress theme
 * and one of the two required files for a theme (the other being style.css).
 * It is used to display a page when nothing more specific matches a query.
 * E.g., it puts together the home page when no home.php file exists.
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package bestel
 */
get_header();
?>

<div class="page-content">
	<div class="section-booking">
		<?php get_template_part( 'wp-hotel-booking/search/search-form-page' ); ?>
	</div>
	<div class="section">
		<div class="container">
			<?php
			while ( have_posts() ) :
				the_post();
				$post_id = get_the_ID();
				?>
				<div class="title-wrap text-center">
					<h1><?php the_title(); ?></h1>
					<div class="h-decor"></div>
				</div>
				<div class="slider-gallery">
					<ul class="slider-room-gallery-main list-unstyled js-slider-gallery-room-main">
						<?php
						$gallery_image = get_post_meta( $post_id, 'framework-room-gallery', false );
						if ( isset( $gallery_image[0] ) && ! empty( $gallery_image[0] ) ) {
							foreach ( $gallery_image as $image ) {
								?>
								<li>
									<?php echo wp_get_attachment_image( $image, 'bestel-rooms-gallery-full' ); ?>
								</li>
								<?php
							}
						}
						?>
					</ul>
				</div>
				<div class="row row-for-single-room">
					<div class="col-lg-8">
						<div class="slider-gallery">
							<ul class="slider-room-gallery-thumbs list-unstyled js-slider-gallery-room-thumbs">
								<?php
								$gallery_image = get_post_meta( $post_id, 'framework-room-gallery', false );
								if ( isset( $gallery_image[0] ) && ! empty( $gallery_image[0] ) ) {
									foreach ( $gallery_image as $image ) {
										?>
										<li>
											<?php echo wp_get_attachment_image( $image, 'bestel-rooms-gallery' ); ?>
										</li>
										<?php
									}
								}
								?>
							</ul>
						</div>
						<?php
						$room_size     = get_post_meta( $post_id, 'framework-room-size', true );
						$room_sleeps   = get_post_meta( $post_id, 'framework-room-sleeps', true );
						$room_bed      = get_post_meta( $post_id, 'framework-room-bed', true );
						$room_bathroom = get_post_meta( $post_id, 'framework-room-bathroom', true );
						?>
						<div class="info-grid">
							<div class="row align-items-center">

								<div class="col-6 col-sm">
									<div class="info-grid-label"><?php echo esc_html__( 'Room size', 'bestel' ); ?></div>
									<div class="info-grid-text"><?php echo wp_kses_post( $room_size ); ?> <?php echo esc_html__( 'm', 'bestel' ); ?><sup><?php echo esc_html__( '2', 'bestel' ); ?></sup></div>
								</div>
								<div class="col-6 col-sm">
									<div class="info-grid-label"><?php echo esc_html__( 'Sleeps', 'bestel' ); ?></div>
									<div class="info-grid-text"><?php echo wp_kses_post( $room_sleeps ); ?></div>
								</div>
								<div class="col-6 col-sm">
									<div class="info-grid-label"><?php echo esc_html__( 'Bed types', 'bestel' ); ?></div>
									<div class="info-grid-text"><?php echo wp_kses_post( $room_bed ); ?></div>
								</div>
								<div class="col-6 col-sm">
									<div class="info-grid-label"><?php echo esc_html__( 'Bathroom', 'bestel' ); ?></div>
									<div class="info-grid-text"><?php echo wp_kses_post( $room_bathroom ); ?></div>
								</div>
							</div>
						</div>
						<div class="mt-3 mt-md-7"></div>
						<h2><?php echo esc_html__( 'Room Details', 'bestel' ); ?></h2>
						<p>
							<?php the_content(); ?>
						</p>
						<div class="mt-3 mt-md-5"></div>
						<h2><?php echo esc_html__( 'Room Features', 'bestel' ); ?></h2>

						<?php
						$room_breakfast       = get_post_meta( $post_id, 'framework-room-breakfast', true );
						$room_safe            = get_post_meta( $post_id, 'framework-room-safe', true );
						$room_lift            = get_post_meta( $post_id, 'framework-room-lift', true );
						$room_tv              = get_post_meta( $post_id, 'framework-room-tv', true );
						$room_view            = get_post_meta( $post_id, 'framework-room-view', true );
						$room_wifi            = get_post_meta( $post_id, 'framework-room-free-wifi', true );
						$room_hair_dryer      = get_post_meta( $post_id, 'framework-room-hair-dryer', true );
						$room_air_conditioner = get_post_meta( $post_id, 'framework-room-air-conditioner', true );
						$room_air_minibar     = get_post_meta( $post_id, 'framework-room-air-minibar', true );
						$room_widget_info     = get_post_meta( $post_id, 'framework-room-widget-info', true );
						$room_price           = get_post_meta( $post_id, 'framework-room-price', true );
						?>

						<div class="row">
							<div class="col-md-4">
								<ul class="marker-list">
									<li><?php echo esc_html__( 'Breakfast', 'bestel' ); ?> : <span><?php echo wp_kses_post( $room_breakfast ); ?></span></li>
									<li><?php echo esc_html__( 'Safe', 'bestel' ); ?>: <span><?php echo wp_kses_post( $room_safe ); ?></span></li>
									<li><?php echo esc_html__( 'Lift', 'bestel' ); ?>: <span><?php echo wp_kses_post( $room_lift ); ?></span></li>
									<li><?php echo esc_html__( 'TV', 'bestel' ); ?>: <span><?php echo wp_kses_post( $room_tv ); ?></span></li>
									<li><?php echo esc_html__( 'View', 'bestel' ); ?>: <span><?php echo wp_kses_post( $room_view ); ?></span></li>
								</ul>
							</div>
							<div class="col-md-8 mt-4 mt-md-0">
								<div class="d-flex justify-content-between flex-wrap">
									<div class="icn-text-sm">
										<div class="icn-text-circle"><i class="icon-wifi"></i></div>
										<div><?php echo esc_html__( 'Free WiFi', 'bestel' ); ?> :
											<br><span><?php echo wp_kses_post( $room_wifi ); ?></span></div>
									</div>
									<div class="icn-text-sm">
										<div class="icn-text-circle"><i class="icon-hair-dryer"></i></div>
										<div><?php echo esc_html__( 'Hair dryer', 'bestel' ); ?>:
											<br><span><?php echo wp_kses_post( $room_hair_dryer ); ?></span></div>
									</div>
									<div class="icn-text-sm">
										<div class="icn-text-circle"><i class="icon-air-conditioner"></i></div>
										<div><?php echo esc_html__( 'Air conditioner', 'bestel' ); ?>:
											<br><span><?php echo wp_kses_post( $room_air_conditioner ); ?></span></div>
									</div>
									<div class="icn-text-sm">
										<div class="icn-text-circle"><i class="icon-cocktail"></i></div>
										<div><?php echo esc_html__( 'Minibar', 'bestel' ); ?>:
											<br><span><?php echo wp_kses_post( $room_air_minibar ); ?></span></div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="col-lg-4 mt-5 mt-lg-0">
						<div class="row">
							<div class="col-sm col-lg-12">
								<div class="info-box-color">
									<?php echo wp_kses_post( $room_widget_info ); ?>
									<div class="text-center mt-2">
										<div class="info-box-price"><span><?php bestel_conver_Currency_To_Symble( bestel_get_option( 'bestel_currency_select' ) ); ?></span><?php echo wp_kses_post( $room_price ); ?></div>
										<div class="mt-2"><a href="<?php echo esc_js( 'javascript:void(0)' ); ?>" class="btn btn-primary btn-white btn-block" data-toggle="modal" data-target="#modalBooking"><?php echo esc_html__( 'BOOK NOW3', 'bestel' ); ?></a></div>
										<p class="p-sm mt-2"><?php echo esc_html__( 'Best Choice - Low Price Guarantee', 'bestel' ); ?></p>
									</div>
								</div>
							</div>
							<div class="col-sm col-lg-12 mt-3 mt-sm-0 mt-lg-3">
								<div class="info-box-grey">
									<?php
									if ( is_active_sidebar( 'rooms_sevices' ) ) {
										dynamic_sidebar( 'rooms_sevices' );
									}
									?>
								</div>
							</div>
						</div>
					</div>
				</div>
			<?php endwhile; ?>
		</div>
	</div>
	<div class="section">
		<div class="container">
			<div class="title-wrap text-center">
				<h2><?php echo esc_html__( 'Other Rooms', 'bestel' ); ?></h2>
				<div class="h-decor"></div>
			</div>
		</div>
		<?php
		$orig_post = $post;
		$args      = array(
			'post_type'      => 'rooms',
			'post__not_in'   => array( $post->ID ),
			'posts_per_page' => -1,
		);
		?>
		<div class="container">
			<div class="row d-flex room-carousel js-room-carousel">
				<?php
				$query = new WP_Query( $args );
				if ( $query->have_posts() ) :
					while ( $query->have_posts() ) :
						$query->the_post();
						$post_id        = get_the_ID();
						$room_size      = get_post_meta( get_the_ID(), 'framework-room-size', true );
						$room_price     = get_post_meta( get_the_ID(), 'framework-room-price', true );
						$room_sleeps    = get_post_meta( get_the_ID(), 'framework-room-sleeps', true );
						$room_bed_size  = get_post_meta( get_the_ID(), 'framework-room-bed', true );
						$room_bathroom  = get_post_meta( get_the_ID(), 'framework-room-bathroom', true );
						$room_know_more = get_post_meta( get_the_ID(), 'framework-room-know-more', true );
						?>
						<div class="col-4">
							<div class="room-card">
								<div class="room-card-photo">
									<?php echo get_the_post_thumbnail( $post_id, 'bestel-rooms-thumb', array( 'class' => 'img-fluid' ) ); ?></a>
									<div class="flex-wrap-center">
										<a href="<?php echo esc_js( 'javascript:void(0)' ); ?>" class="btn btn-primary room-qview" data-toggle="modal" data-target="#modalBooking"><?php echo esc_html__( 'Book Now', 'bestel' ); ?></a>
									</div>
								</div>
								<div class="room-card-info">
									<div class="row">
										<div class="col">
											<h3 class="room-type"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
										</div>
										<div class="col-auto ml-auto">
											<div class="room-card-attr">
												<span data-toggle="popover" data-trigger="hover" data-placement="top" data-content="<?php echo esc_attr( $room_sleeps ); ?>"><i class="icon-two-man"></i></span>
												<span data-toggle="popover" data-trigger="hover" data-placement="top" data-content="<?php echo esc_attr( $room_bed_size ); ?>"><i class="icon-double-size-bed"></i></span>
												<span data-toggle="popover" data-trigger="hover" data-placement="top" data-content="<?php echo esc_attr( $room_bathroom ); ?>"><i class="icon-bathtub"></i></span>
											</div>
										</div>
									</div>
									<div class="room-size mt-0"><?php echo esc_html__( 'Room size:', 'bestel' ); ?> <?php echo wp_kses_post( $room_size ); ?> <?php echo esc_html__( 'm', 'bestel' ); ?><sup><?php echo esc_html__( '2', 'bestel' ); ?></sup></div>
									<div class="row">
										<div class="col">
											<div class="room-price"><span><?php bestel_conver_Currency_To_Symble( bestel_get_option( 'bestel_currency_select' ) ); ?></span><?php echo wp_kses_post( $room_price ); ?></div>
										</div>
										<div class="col-auto ml-auto">
											<a href="<?php echo esc_js( 'javascript:void(0)' ); ?>" class="room-information" data-toggle="popover" data-trigger="hover" data-placement="bottom"><i class="icon-information"></i><?php echo esc_html__( 'Know more', 'bestel' ); ?></a>
											<div class="popover-content d-none">
												<?php
												echo wp_kses(
													$room_know_more,
													array(
														'ul' => array( '' ),
														'li' => array( '' ),
														'a'  => array( 'href' ),
													)
												);
												?>
											</div>
										</div>
									</div>
								</div>
							</div>
						</div>
						<?php
					endwhile;
				endif;
				?>
			</div>
		</div>
	</div>
</div>
<?php get_footer(); ?>
