<?php
/**
 * The template for displaying Archive pages.
 *
 * Learn more: http://codex.wordpress.org/Template_Hierarchy
 *
 * @package progression
 */

get_header(); ?>


<div id="page-title">		
	<div class="width-container">
		<h1><?php _e( 'Portfolio', 'progression' ); ?></h1>
		<?php if(function_exists('bcn_display')) {
				echo '<div id="bread-crumb">';
		        bcn_display();
				echo '</div>';
		}?>
		<div class="clearfix"></div>
	</div>
</div><!-- close #page-title -->


	
<div class="width-container">
	<?php if ( have_posts() ) : ?>	
		
		<ul id="portfolio-sub-nav">
		</ul>	
		
		<div id="mason-layout" class="transitions-enabled fluid">
			<?php
			/* Start the Loop */
			?>
			<?php while ( have_posts() ) : the_post();
				$col_count_progression = get_theme_mod('portfolio_col_progression', '2');
			?>
			<div class="boxed-mason col<?php echo get_theme_mod('portfolio_col_progression', '2'); ?>">
				<?php
					get_template_part( 'content', 'portfolio');
				?>
			</div>

			<?php endwhile; ?>


			<script>
			jQuery(document).ready(function($) {
				
				var $container = $('#mason-layout');
				$container.imagesLoaded(function(){
				  $container.masonry({
				    itemSelector : '.boxed-mason'
				  });
				});
		
			    $('#mason-layout').masonry({
			      itemSelector: '.boxed-mason',
			      // set columnWidth a fraction of the container width
			      columnWidth: function( containerWidth ) {
			        return containerWidth / <?php echo get_theme_mod('portfolio_col_progression', '2'); ?>;
			      }
	
			    });
				
			});

			</script>
			
		</div><!-- close #mason-layout-pro -->

			<div class="clearfix"></div>
			<?php show_pagination_links( ); ?>
		
	<?php else : ?>
			<?php get_template_part( 'no-results', 'archive' ); ?>
	<?php endif; ?>
	
<div class="clearfix"></div>
</div><!-- close .width-container -->
<?php get_footer(); ?>
