<?php
$limit      = !empty( $instance['limit'] ) ? $instance['limit'] : 8;
$filter     = isset( $instance['filter'] ) ? $instance['filter'] : true;
$columns    = !empty( $instance['columns'] ) ? $instance['columns'] : 3;

$query_args = array(
	'post_type'      => 'post',
	'tax_query'      => array(
		array(
			'taxonomy' => 'post_format',
			'field'    => 'slug',
			'terms'    => array( 'post-format-gallery' ), 
		)
	),
	'posts_per_page' => $limit
);

if ( !empty( $instance['cat'] ) ) {
	if ( '' != get_cat_name( $instance['cat'] ) ) {
		$query_args['cat'] = $instance['cat'];
	}
}

switch ( $columns ) {
	case 2:
		$class_col = "col-sm-6";
		break;
	case 3:
		$class_col = "col-sm-4";
		break;
	case 4:
		$class_col = "col-sm-3";
		break;
	case 5:
		$class_col = "thim-col-5";
		break;
	case 6:
		$class_col = "col-sm-2";
		break;
	default:
		$class_col = "col-sm-4";
}

$class_col .= ' item_post';

$posts_display = new WP_Query( $query_args );



if ( $posts_display->have_posts() ) :
	wp_enqueue_script( 'magnific-popup');
	wp_enqueue_script('isotope');
	$categories = array();
	$html      = '';

	while ( $posts_display->have_posts() ) : $posts_display->the_post();

		$img   = thim_get_feature_image( get_post_thumbnail_id(), 'full' );
		$class = '';
		$cats  = get_the_category();
		if ( !empty( $cats ) ) {
			foreach ( $cats as $key => $value ) {
				$class .= ' filter-' . $value->term_id;
				$categories[$value->term_id] = $value->name;
			}
		}
		$html .= '<div class="item_gallery ' . $class_col . $class . '">';
		$html .= apply_filters( 'thim_before_gallery_popup', '', get_the_ID() );
		$html .= '<a class="thim-gallery-popup" href="#" data-id="' . get_the_ID() . '">';
        $html .= '<div class="info_post"><div class="inner-info">';
        $html .= '<h5 class="inner-title">'. get_the_title().'</h5>';
		$html .= '<p>'. get_the_date() .'</p>';
		$html .= '<i class="edu-arrow-right"></i>';
		$html .= '</div></div>';
        $html .= $img;
        $html .= '</a>';
		$html .= apply_filters( 'thim_after_gallery_popup', '', get_the_ID() ); 
		$html .= '</div>';

	endwhile;

	 if ( $filter ): ?>
	<div class="wrapper-filter-controls">
		<ul class="filter-controls">
			<li>
				<a class="filter active" data-filter="*" href="javascript:;"><?php esc_html_e( 'All', 'eduma' ); ?></a>
			</li>
			<?php

			if ( !empty( $categories ) ) {
				foreach ( $categories as $key => $value ) {
					echo '<li><a class="filter" href="javascript:;" data-filter=".filter-' . $key . '">' . $value . '</a></li>';
				}
			}
			?>
		</ul>
	</div>
<?php endif; ?>

	<div class="wrapper-gallery-filter isotope-layout" itemscope itemtype="http://schema.org/ItemList" data-column="<?php echo esc_attr( $columns ) ?>">
		<?php
		echo ent2ncr( $html );
		?>
	</div>
	<div class="thim-gallery-show"></div>
	
	<?php if ( !empty( $instance['load_more'] ) && $posts_display->max_num_pages > 1 ) : ?>
		<div class="thim-gallery-loadmore-wrap">
			<button class="thim-gallery-load-more" 
				data-page="1" 
				data-max="<?php echo esc_attr( $posts_display->max_num_pages ); ?>"
				data-limit="<?php echo esc_attr( $limit ); ?>"
				data-columns="<?php echo esc_attr( $columns ); ?>"
				data-cat="<?php echo esc_attr( !empty( $instance['cat'] ) ? $instance['cat'] : '' ); ?>"
				data-template="isotope"
				data-nonce="<?php echo wp_create_nonce( 'thim_gallery_nonce' ); ?>">
				<?php esc_html_e( 'Load More', 'eduma' ); ?>
			</button>
		</div>
	<?php endif; ?>

	<?php
endif;
wp_reset_postdata();
