<?php 
/* 
Template Name: Portfolio :: Filterable
*/ 
?>

<?php 
$kk_content_style = get_option('toppic_theme_content_style');

$kk_portfolio_style = get_post_meta($post->ID, '_portfolio_layout_value', true); 

switch( $kk_portfolio_style ) {
	case '3-column': 
		$kk_col = 'three-col-p';
		$kk_hp = false;
		break;
	case '4-column':
		$kk_col = 'four-col-p';
		$kk_hp = false;
		break;
	case '3-column (wide)':
		$kk_col = 'three-col-p';
		$kk_hp = true;
		break;
	case '4-column (wide)':
		$kk_col = 'four-col-p';
		$kk_hp = true;
		break;
} 

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

?>

<?php get_header(); ?>

<?php if ( post_password_required( $post ) ) { 

		get_template_part( 'password-form' );
		
	} else { ?>

   <!-- start content wrapper -->			
	<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">
					<h1><?php the_title(); ?></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">
					<h1><?php the_title(); ?></h1>
				</div>
				
				<div class="divider clear"></div>	
				
			<?php endif; ?>
		
		<?php if ( post_password_required( $post ) ) { ?>
				<div id="none" class="inner-content">	
					<?php echo get_the_password_form(); ?>
				</div>

		<?php } else {
			while ( have_posts() ) : the_post();	
			$content = get_the_content();
			if(!empty($content)) : 	?>
			
				<div id="none" class="inner-content">		
					<?php the_content(); ?>
				</div>
				
		<?php endif; endwhile; ?>

			<!-- start portfolio filter -->
			<?php 
			if ( current_theme_supports( 'kk-cpt' ) ) {
			$categories = rwmb_meta( 'kk_filter-portfolio', 'type=taxonomy&taxonomy=portfolio-type'); 
			if (!empty($categories)) {
			?>
				<div id="filter">
					<a id="filter-trigger" href="#" data-category="all">
						<span><?php _e('Sort Portfolio','toppic') ?></span> 
						<i class="kk-icon kk-icon-angle-down"></i>
					</a>
					<ul>
						<li> 
							<a class="filter" href="#" data-filter=".all"><?php _e('All','toppic') ?></a>
						</li>
						 <?php 
							foreach ($categories as $category) {
						?>		
							<li class="filter" data-filter=".<?php echo esc_attr($category->slug) ?>" >
								<a href="#" ><?php echo esc_html($category->name) ?></a>
							</li>
													
						<?php
						
							// Build new array with selected categories
							$kk_filter_terms[] = $category->slug;				
						}	?>	
					</ul>
				</div>
			<?php } ?>
			<!-- end portfolio filter -->			
			
			<?php if (($kk_content_style == 'kk-full' ) & ($kk_hp == true)) {
				echo '</div><div class="wide-portfolio">';
			} ?>
			
			
			<!-- start portfolio items -->			
			<div class="portfolio-wrapper">
					<ul class="isotope-container" id="<?php echo esc_attr($kk_col) ?>">
					
						<?php 
						if (empty($categories)) {
							$args = array(
								'post_type' => 'portfolio',
								'posts_per_page' => -1,
							);
						} else {
							$args = array(
								'post_type' => 'portfolio',
								'tax_query' => array(
									array(
										'taxonomy' => 'portfolio-type',
										'field' => 'slug',
										'terms' => $kk_filter_terms
									)
								),
								'posts_per_page' => -1,
							);
						}
						$query = new WP_Query( $args );
						
						while ( $query->have_posts() ) : $query->the_post();  ?>
						
						<?php 
							$terms =  get_the_terms( $post->ID, 'portfolio-type' ); 
							$term_list = '';
							
							if( is_array($terms) ) {
								foreach( $terms as $term ) {
									$term_list .= $term->slug;
									$term_list .= ' ';
								}
							}
						?>						
						
						<!-- start work -->
						<li id="<?php echo the_ID()?>" <?php post_class("$term_list isotope-item all"); ?> >
			
							<div class="portfolio-thumb effect-zoom linkto">	
								<a href="<?php the_permalink() ?>" class="img-loading" title="<?php the_title(); ?>">	
									<?php if( has_post_thumbnail() ): ?>								
										<?php echo get_the_post_thumbnail( get_the_id(), 'kktfwp-s', array( 'class' => 'responsively-lazy-img', 'data-lazy-load' => 1 ) ); ?>
									<?php endif; ?>
									<span class="kk-n"><?php _e('View','toppic'); ?></span>	
								</a>
							</div>

							<div class="portfolio-title">
								<h2>
									<a href="<?php the_permalink() ?>" title="<?php the_title(); ?>">
										<?php the_title(); ?>
									</a>
								</h2>
							</div>			
							<?php if (function_exists('printLikes')) { ?>
								<div class="kk-likes-portfolio">
									<?php printLikes(get_the_ID()); ?>
								</div>
							<?php } ?>	
						</li>
											
						<?php endwhile; wp_reset_query(); ?>
						<!-- end work -->
						
						<li id="kk-item-helper"></li>
						<li id="kk-item-helper"></li>
						
					</ul>
			</div>
			<!-- end portfolio items -->
			<?php } ?>
			<?php } ?>
		</div>
		
		<?php get_template_part('extends/footer-area') ?>
		
	</div>
	<!-- end content wrapper -->
<?php } ?>

<?php get_footer(); ?>