<?php
get_header();
?>

<main id="primary" class="site-main portfolio-single-main" role="main">

<?php
while ( have_posts() ) :
	the_post();
	$details   = vista_get_portfolio_details( get_the_ID() );
	$tax_terms = get_the_terms( get_the_ID(), 'portfolio_category' );
	$all_images = array();
	$gallery_raw = get_post_meta( get_the_ID(), '_portfolio_gallery', true );
	if ( $gallery_raw ) {
		$img_ids = array_filter( array_map( 'intval', explode( ',', $gallery_raw ) ) );
		foreach ( $img_ids as $img_id ) {
			$src    = wp_get_attachment_image_url( $img_id, 'full' );
			$alt    = get_post_meta( $img_id, '_wp_attachment_image_alt', true ) ?: get_the_title();
			$srcset = wp_get_attachment_image_srcset( $img_id, 'large' );
			if ( $src ) {
				$all_images[] = array( 'src' => $src, 'alt' => $alt, 'srcset' => $srcset );
			}
		}
	}
?>
<section class="ps-hero">
	<div class="container">
		<?php if ( ! function_exists("vista_show") || vista_show("portfolio_breadcrumb", true) ) { vista_breadcrumbs(); } ?>

	</div>
</section>
<?php if ( ! empty( $all_images ) ) : ?>
<section class="ps-slider-section">
	<div class="container">
		<div class="ps-slider-wrap" id="psSlider">
			<div class="ps-slider-main">
				<div class="ps-slider-track" id="psSliderTrack">
					<?php foreach ( $all_images as $i => $img ) : ?>
						<div class="ps-slide" data-index="<?php echo (int) $i; ?>">
							<img
								src="<?php echo esc_url( $img['src'] ); ?>"
								<?php if ( $img['srcset'] ) : ?>
								srcset="<?php echo esc_attr( $img['srcset'] ); ?>"
								sizes="(max-width:768px) 100vw, 860px"
								<?php endif; ?>
								alt="<?php echo esc_attr( $img['alt'] ); ?>"
								loading="<?php echo 0 === $i ? 'eager' : 'lazy'; ?>"
							>
						</div>
					<?php endforeach; ?>
				</div>

				<?php if ( count( $all_images ) > 1 ) : ?>
					<button class="ps-slide-btn ps-slide-prev" aria-label="<?php esc_attr_e( 'قبلی', 'vista' ); ?>">
						<i class="fa-solid fa-chevron-<?php echo is_rtl() ? esc_attr( 'right' ) : esc_attr( 'left' ); ?>"></i>
					</button>
					<button class="ps-slide-btn ps-slide-next" aria-label="<?php esc_attr_e( 'بعدی', 'vista' ); ?>">
						<i class="fa-solid fa-chevron-<?php echo is_rtl() ? esc_attr( 'left' ) : esc_attr( 'right' ); ?>"></i>
					</button>
					<div class="ps-slide-counter">
						<span id="psSlideCurrentNum">1</span> / <span><?php echo count( $all_images ); ?></span>
					</div>
				<?php endif; ?>
			</div>
			<?php if ( count( $all_images ) > 1 ) : ?>
				<div class="ps-thumb-strip" id="psThumbStrip" role="list">
					<?php
					$img_ids_arr = $gallery_raw ? array_values( array_filter( array_map( 'intval', explode( ',', $gallery_raw ) ) ) ) : array();
					foreach ( $all_images as $i => $img ) :
						$thumb_src = isset( $img_ids_arr[ $i ] )
							? wp_get_attachment_image_url( $img_ids_arr[ $i ], 'thumbnail' )
							: '';
						if ( ! $thumb_src ) $thumb_src = $img['src'];
					?>
						<button
							class="ps-thumb <?php echo 0 === $i ? 'active' : ''; ?>"
							data-index="<?php echo (int) $i; ?>"
							role="listitem"
							aria-label="<?php printf( esc_attr__( 'تصویر %d', 'vista' ), $i + 1 ); ?>"
							aria-current="<?php echo 0 === $i ? 'true' : 'false'; ?>">
							<img src="<?php echo esc_url( $thumb_src ); ?>" alt="" loading="lazy">
						</button>
					<?php endforeach; ?>
				</div>
			<?php endif; ?>

		</div>
	</div>
</section>
<?php endif; ?>

<div class="container">
		<h1 class="post-header-title ps-single-title ps-single-header"><?php the_title(); ?></h1>		
	</div>	
		
<?php if ( has_excerpt() ) : ?>
<div class="container">
	<div class="ps-title-wrap">
		<p class="ps-excerpt"><?php the_excerpt(); ?></p>
	</div>
</div>
<?php endif; ?>
<?php
$has_details = ! empty( $details['client'] ) || ! empty( $details['date'] ) || ! empty( $details['category'] ) || ! empty( $details['live_link'] );
if ( $has_details ) :
?>
<section class="ps-details-section">
	<div class="container">
		<div class="ps-details-bar">

			<?php if ( ! empty( $details['client'] ) ) : ?>
				<div class="ps-detail-item">
					<span class="ps-detail-icon"><i class="fa-solid fa-building" aria-hidden="true"></i></span>
					<div>
						<div class="ps-detail-label"><?php esc_html_e( 'کارفرما', 'vista' ); ?></div>
						<div class="ps-detail-val"><?php echo esc_html( $details['client'] ); ?></div>
					</div>
				</div>
			<?php endif; ?>

			<?php if ( ! empty( $details['date'] ) ) : ?>
				<div class="ps-detail-item">
					<span class="ps-detail-icon"><i class="fa-regular fa-calendar" aria-hidden="true"></i></span>
					<div>
						<div class="ps-detail-label"><?php esc_html_e( 'زمان اجرا', 'vista' ); ?></div>
						<div class="ps-detail-val"><?php echo esc_html( $details['date'] ); ?></div>
					</div>
				</div>
			<?php endif; ?>

			<?php if ( ! empty( $details['category'] ) ) : ?>
				<div class="ps-detail-item">
					<span class="ps-detail-icon"><i class="fa-solid fa-tag" aria-hidden="true"></i></span>
					<div>
						<div class="ps-detail-label"><?php esc_html_e( 'نوع پروژه', 'vista' ); ?></div>
						<div class="ps-detail-val"><?php echo esc_html( $details['category'] ); ?></div>
					</div>
				</div>
			<?php endif; ?>

			<?php if ( ! empty( $details['live_link'] ) ) : ?>
				<div class="ps-detail-item">
					<a href="<?php echo esc_url( $details['live_link'] ); ?>"
						class="portfolio-live-btn"
						target="_blank"
						rel="noopener noreferrer">
						<i class="fa-solid fa-arrow-up-right-from-square" aria-hidden="true"></i>
						<?php esc_html_e( 'مشاهده زنده', 'vista' ); ?>
					</a>
				</div>
			<?php endif; ?>

		</div>
	</div>
</section>
<?php endif; ?>
<section class="ps-content-section">
	<div class="container">
		<div class="ps-content-box">
			<div class="post-content">
				<?php
				the_content();
				wp_link_pages( array(
					'before' => '<div class="page-links">' . esc_html__( 'صفحات:', 'vista' ),
					'after'  => '</div>',
				) );
				?>
			</div>
		</div>
	</div>
</section>
<?php
$related_args = array(
	'post_type'           => 'portfolio',
	'posts_per_page'      => ( function_exists('vista_opt') ? (int) vista_opt('portfolio_related_count', 3) : 3 ),
	'post__not_in'        => array( get_the_ID() ),
	'orderby'             => 'rand',
	'ignore_sticky_posts' => true,
);

if ( $tax_terms && ! is_wp_error( $tax_terms ) ) {
	$related_args['tax_query'] = array( 
		array(
			'taxonomy' => 'portfolio_category',
			'field'    => 'term_id',
			'terms'    => wp_list_pluck( $tax_terms, 'term_id' ),
		),
	);
}

$related_query = new WP_Query( $related_args );

if ( $related_query->have_posts() ) :
?>
<section class="ps-related-section">
	<div class="container">
		<h2 class="section-title"><?php esc_html_e( 'بیشتر ببینید', 'vista' ); ?></h2>

		<div class="pf-archive-grid ps-related-grid">
			<?php
			while ( $related_query->have_posts() ) :
				$related_query->the_post();
				$rt       = get_the_terms( get_the_ID(), 'portfolio_category' );
				$rt_name  = '';
				if ( $rt && ! is_wp_error( $rt ) ) {
					$rt_name = $rt[0]->name;
				}
			?>
				<div class="pf-card">
					<div class="pf-card-image">

						<?php if ( has_post_thumbnail() ) : ?>
							<a href="<?php the_permalink(); ?>">
								<?php the_post_thumbnail( 'vista-portfolio-thumb', array(
									'loading' => 'lazy',
									'alt'     => the_title_attribute( array( 'echo' => false ) ),
								) ); ?>
							</a>
						<?php else : ?>
							<a href="<?php the_permalink(); ?>" class="pf-no-thumb">
								<i class="fa-solid fa-folder-open" aria-hidden="true"></i>
							</a>
						<?php endif; ?>

						<?php if ( $rt_name ) : ?>
							<span class="pf-badge"><?php echo esc_html( $rt_name ); ?></span>
						<?php endif; ?>

					</div>

					<div class="pf-card-footer">
						<div class="pf-card-text">
							<h3>
								<a href="<?php the_permalink(); ?>"><?php the_title(); ?></a>
							</h3>
							<?php if ( has_excerpt() ) : ?>
								<p><?php echo esc_html( wp_trim_words( get_the_excerpt(), 10 ) ); ?></p>
							<?php endif; ?>
						</div>
						<a href="<?php the_permalink(); ?>" class="pf-action-btn" aria-label="<?php the_title_attribute(); ?>">
							<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" viewBox="0 0 24 24" aria-hidden="true">
								<path d="M7 17L17 7M17 7H7M17 7v10"/>
							</svg>
						</a>
					</div>
				</div>

			<?php endwhile; wp_reset_postdata(); ?>
		</div>

	</div>
</section>
<?php endif; ?>

<?php endwhile; ?>

</main>

<?php get_footer(); ?>