<?php global $post;

$kk_parallax = kk_parallax();
$title_type = $kk_parallax[0];
$bg_title_img = $kk_parallax[1];

?>

<?php if (have_posts()) : ?>
    <?php while (have_posts()) : the_post(); ?>

 	<!-- start main container -->
	<div class="content clearfix">
		<?php if( $title_type == 'parallax' ) { ?>
			
		<div id="kk-parallax-wrapper" class="kk-parallax-wrapper">
			
			<div id="kk-parallax-bg" class="kk-parallax-bg kk-hidden">
				<img id="kk-img-check" src="<?php echo esc_url( $bg_title_img ) ?>" alt="<?php echo esc_attr( $kk_parallax[2] ) ?>" />
			</div>

			<div id="kk-parallax-title-wrapper" class="kk-parallax-title-wrapper">
				<div id="kk-parallax-title" class="page-title">
					<?php the_title( '<h1>', '</h1>' ); ?>
				</div>	
			</div>	
			
			<a id="kk-down" class="kk-down is-loading" href="#kk-to-me"></a>
		
		</div>	
		
		<?php } ?>
		
		<div class="content-inner-wrapper clearfix">
			<span id="kk-to-me"></span>	
			<?php if( $title_type == 'default' ) { ?>
	
			<div class="page-title">
				<?php the_title( '<h1>', '</h1>' ); ?>
			</div>	

			<div class="divider clear"></div>	
		
			<?php } ?>
			
			<!-- start gallery -->			
			<div id="none" class="inner-content">		
				<?php the_content (); ?>
			</div>
			
			<?php 
				$kkGalleryLaouyt = get_post_meta( $post->ID, '_gallery_layout_value', true);
				$kkImageSize = array(413,305);
				$kkCrop = ( get_post_meta( $post->ID, '_is_masonry_value', true ) ) ? get_post_meta( $post->ID, '_is_masonry_value', true ) : 'No' ;				
			?>
			
			<div class="gallery-wrapper"  data-layout="<?php echo esc_attr( $kkGalleryLaouyt ) ?>">				
				<ul class="image-container isotope-container">
					<div class="gutter-size"></div>
				<?php 
				
					$attachments = rwmb_meta( 'kk_imgadv', 'type=image_advanced' );

					foreach ($attachments as $attachment) { 

						$kktfwp_ratio = '';
						
						if ( $kkCrop === 'Yes' ) {
							$kktfwp_ratio = wp_get_attachment_image_src( $attachment['ID'], 'full' );
							$kktfwp_ratio = $kktfwp_ratio[2]/$kktfwp_ratio[1] * 100 .'%';
						} ?>
						
						<li id="<?php echo esc_attr($attachment['ID']) ?>" <?php post_class( 'masonry'); ?> >
							<div class="portfolio-thumb">		
								<a class="kk-lightbox img-loading" data-group="kk-lightbox[<?php the_ID();?>]" href="<?php echo esc_url( $attachment['full_url'] ) ?>" data-title="<?php echo esc_attr( $attachment['title'] ) ?>" style="padding-bottom:<?php echo esc_attr( $kktfwp_ratio ); ?>">
																		
									<?php echo wp_get_attachment_image( $attachment['ID'], 'kktfwp-s', '', array( 'class' => 'responsively-lazy-img', 'title' => $attachment['title'], 'data-lazy-load' => 1 ) ); ?>
									
									<span class="kk-n"><?php _e('View','toppic'); ?></span>	
								</a>
								
								<?php if ( rwmb_meta( 'kk_proof' ) === 'proofing' ) :
								
									$kk_proofing = wp_get_attachment_metadata( $attachment['ID'] );

									if ( isset($kk_proofing['image_meta']['proof_status']) && $kk_proofing['image_meta']['proof_status'] === 'checked') {
										$kk_photo_class = 'photo-details photo-approved';
									} else {
										$kk_photo_class = 'photo-details';
									}
								?>							
									<div class="<?php echo esc_attr($kk_photo_class) ?>">
										<h5><?php echo sprintf( '#%s', esc_html($attachment['ID']) ); ?></h5>
										<span class="proof-btn" data-photo-id="<?php echo esc_attr($attachment['ID']) ?>"></span>
									</div>											
								<?php endif; ?>
								
							</div>
						</li>
					<?php } ?>
					<li id="kk-item-helper"></li>
					<li id="kk-item-helper"></li>
					<li id="kk-item-helper"></li>
				</ul>
			</div>
			<!-- end gallery -->

			<?php comments_template(); ?>				
		</div>
		
		<?php get_template_part('extends/footer-area') ?>
		
	</div>
	<!-- end container -->	

    <?php endwhile; ?>
<?php endif; ?>		