<?php ( $this->listOptions['space-tiles'] )? $spacer = '' : $spacer = 'without-space'; ?>
<section class="otw-twentyfour otw-columns otw-pm-list-section" id="otw-pm-list-<?php echo $this->listOptions['id'];?>" >
	<?php echo $this->getViewAll(); ?>
	<?php echo $this->getMosaicFilter(); ?>
	<?php echo $this->getMosaicSort(); ?>
	<?php $imageHover = $this->listOptions['image_hover'];?>
	<?php
		$defaultWidth = 400;
		$defaultHeight = 400;
		
		if( !empty( $this->listOptions['thumb_width'] ) ){
			$defaultWidth = $this->listOptions['thumb_width'];
		}
		if( !empty( $this->listOptions['thumb_height'] ) ){
			$defaultHeight = $this->listOptions['thumb_height'];
		}
		
		$itemWidth = $defaultWidth / 2;
		$itemHeight = $defaultHeight / 2;
	?>
	<div data-max="<?= $itemWidth * 4?>" style="max-width: <?php echo $itemWidth * 4;?>px;" class="otw-row otw_portfolio_manager-portfolio-items-holder otw_portfolio_manager-portfolio-newspaper otw_portfolio_manager-mosaic-layout <?php echo $this->getInfiniteScroll();?> <?php echo $spacer;?>" data-columns="4">
		<?php
			$count = 0;
			
			foreach( $otw_pm_posts->posts as $post ){
				
				$class = '';
				
				$this->getMediaProportions();
				
				$imageWidth = $defaultWidth;
				$imageHeight = $defaultHeight;
				
				$postAsset = $this->getPostAsset( $post );
				$imgAsset = parse_url( $postAsset );
				
				$postLink = $this->getLink($post, 'media');
				
				$categoriesString = '';
				
				$postCategories = wp_get_post_terms( $post->ID, $this->portfolio_category );
				foreach( $postCategories as $postCategory ){
					$categoriesString .= 'cat-'.$postCategory->term_id.' ';
				}
				
				if( $count > 8 ){
					$count = 0;
				}
				
				switch( $count ){
					case 1:
							$class = 'otw_portfolio_manager-1-2';
							$imageWidth = $itemWidth * 2;
							$imageHeight = $itemHeight * 2;
						break;
					case 3:
							$class = 'otw_portfolio_manager-1-4 height2';
							$imageWidth = $itemWidth;
							$imageHeight = $itemHeight * 2;
						break;
					case 6:
							$class = 'otw_portfolio_manager-1-2 height1';
							$imageWidth = $itemWidth * 2;
							$imageHeight = $itemHeight;
						break;
					default:
							$imageWidth = $itemWidth;
							$imageHeight = $itemHeight;
						break;
				}
				$count++;
			?>
			<div  data-max_width="<?php echo esc_attr( $imageWidth );?>" data-max_height="<?php echo esc_attr( $imageHeight )?>"  style="max-width: <?php echo $imageWidth?>px; max-height: <?php echo $imageHeight?>px; min-width: <?php echo $itemWidth?>px; min-height: <?php echo $itemHeight?>px;" class="<?php echo $class;?> otw_portfolio_manager-iso-item otw_portfolio_manager-portfolio-newspaper-item <?php echo $categoriesString; ?>" data-title="<?php echo esc_attr( $post->post_name )?>" data-date="<?php echo esc_attr( $post->post_date )?>">
				<div class="otw_portfolio_manager-portfolio-full icon__small only-media <?php echo $imageHover?>">
					<?php $postMetaData = get_post_meta( $post->ID, 'otw_pm_meta_data', true );?>
					<?php $postMetaData['_otw_slider_image'] = 1;?>
					<?php $postMetaData['_otw_force_imageWidth'] = $imageWidth;?>
					<?php $postMetaData['_otw_force_imageHeight'] = $imageHeight;?>
					<?php echo $this->getMedia( $post, $postMetaData, 'media' );?>
				</div>
			</div>
			<?php }?>
		
	</div>
	<?php echo $this->getPagination( $otw_pm_posts ); ?>
</section>