GoTrek - Show Room Information

functions.php

	function gotrek_room_info( $id ) {
		$product = wc_get_product( $id );

		if ( ! $product ) {
			return;
		}

		$product_name = $product->get_name(); // Get the product/room name.
		$price_html   = $product->get_price_html(); // Get the formatted price HTML.

		// Get the room field for each room.
		$room_field     = gotrek_get_field( 'room_group', $id );
		$attachment_ids = $product->get_gallery_image_ids();
		$main_images    = '';
		$thumbnails     = '';
		$main_image_id  = $product->get_image_id();

		if ( $main_image_id ) {
			array_unshift( $attachment_ids, $main_image_id );
		}

		$modal_id = 'modal_' . uniqid(); // Generate a unique modal ID.
		?>
			<a class="room-info-text" href="#<?php echo esc_attr( $modal_id ); ?>"
				data-modal-target="#<?php echo esc_attr( $modal_id ); ?>"
				data-modal-effect="fadein">
					<?php esc_html_e( 'Show Room Information', 'gotrek' ); ?>
			</a>

			<div id="modal-overlay" class="modal-overlay"></div>
			<div id="<?php echo esc_attr( $modal_id ); ?>" class="js-modal-window overflow-hidden">
				<div class="room-info">
					<button type="button" class="js-modal-close" aria-label="Close"></button>
					<div class="room-info-left-column overflow-hidden">
						<h2 class="room-title"><?php echo esc_html( $product_name ); // Display the product/room name. ?></h2>
						<?php if ( $price_html ) : ?>
							<p class="room-price"><?php echo wp_kses_post( $product->get_price_html() ); ?></p>
						<?php endif; ?>
						<?php
						if ( isset( $room_field['room_amenities'] ) && is_array( $room_field['room_amenities'] ) && ! empty( $room_field['room_amenities'] ) ) :
							?>
						<ul class="amenities flex flex-column">
							<?php
							foreach ( $room_field['room_amenities'] as $amenity ) :
								if ( ! is_wp_error( $amenity ) && $amenity ) {
									$term_id  = $amenity->term_id;
									$taxonomy = $amenity->taxonomy;

									$image = gotrek_get_field( 'amenities_image', $taxonomy . '_' . $term_id );

									?>
									<li class="amenities-list">
										<div class="flex align-center">
											<?php
											if ( isset( $image['url'] ) ) {
												echo '<img src="' . esc_url( $image['url'] ) . '" alt="Image" />';
											}
											?>
											<span><?php echo esc_html( $amenity->name ); ?></span>
										</div>
									</li>
									<?php
								}
							endforeach;
							?>
						</ul>
							<?php
						endif;
						?>
				</div>
				<div class="room-info-right-column overflow-hidden">
						<?php
						if ( ! empty( $attachment_ids ) ) {
							echo '<div class="gt-slick-single overflow-hidden gallery-thumbnails">';
							// Display the rest of the gallery images.
							foreach ( $attachment_ids as $attachment_id ) {
								echo wp_get_attachment_image( $attachment_id, 'full' );
							}
							echo '</div>';
						} elseif ( $main_image_id ) {
							echo '<div class="gallery-thumbnails">';
							echo wp_get_attachment_image( $main_image_id, 'full' );
							echo '</div>';
						} else {
							echo '<div class="gallery-thumbnails">';
							echo '<img src="' . esc_url( wc_placeholder_img_src() ) . '" alt="Placeholder Image" class="attachment-thumbnail size-thumbnail" />';
							echo '</div>';
						}
						?>
				</div>
			</div><!-- /.row -->
			</div><!-- /.js-modal-window -->
		<?php
	}