<?php 			
	require_once ('../../../../wp-load.php');
	$paged = isset($_GET['page']) ? $_GET['page'] : 1;
	$args = array(
			'post_type' => array('projecten'), 
			'post_status' => 'publish', 
			'posts_per_page' => 6, 
			'paged' => $paged
	);
	$category = 'alles';
	if(isset($_GET['category']) && $_GET['category'] != 'alles') {
		$args['meta_key'] = 'category';
		$args['meta_value'] = $_GET['category'];
		$category = $_GET['category'];
	}
	$query = new WP_Query($args);
	$maxPages = $query->max_num_pages;
	$i = 0;
?>
<div style="min-height:862px">
<?php 	
	while ( $query->have_posts() ) : $query->the_post();
		 $locatie = get_field('plaats');
		 $image = get_field('hoofdafbeelding');
		
		 if($i % 3 == 0) {
			if($i == 3) echo '</div><br>';
	?>	
	<div class="row-fluid">
	<?php } ?>
			
			<div class="span4 bluebox <?php //if($i == 2 || $i == 5) echo 'mgr0'?>">
                <div class="title"><h4>SAMENBOUWEN<span>.IN/</span><?php echo str_replace(' ','',strtoupper($locatie));?></h4></div>
                <div><img src="<?php echo $image['sizes']['project-medium']?>" alt=""/></div><br/>
                <table width="100%">
                    <tr><td>locatie:</td><td class="w"><?php echo $locatie?></td></tr>
                    <tr><td>aantal woningen:</td><td class="w"><?php the_field('aantal_woningen')?></td></tr>
                    <tr><td>prijsklasse:</td><td class="w">vanaf &euro;<?php echo str_replace(',','.',number_format(get_field('vanaf_prijs')))?>,- VON</td></tr>
                </table>
                <br/>
                <div class="wbtn"><a href="<?php the_permalink()?>">MEER INFORMATIE</a></div>
            </div>  
                     	
<?php 
		$i++;
	endwhile; ?>  
 		</div>
</div> 		
 		<br><br>
 		<div class="row-fluid">
			<div class="span4 homeblock first"><h4>ALS COLLECTIEF IN<br/>UW EIGEN GEMEENTE<br/>AAN DE SLAG</h4></div>
			<div class="span4 homeblock first"><h4>WAT ALS IK GROND<br/>HEB VOOR EEN<br/>COLLECTIEF ?</h4></div>
			<div class="span4">
				<div class="pull-right">
					<ul class="inlineul">
						<li><a href="#" class="prevprojs"><i class="f-darkone-left <?php if($paged > 1) echo 'active';?>"></i></a></li>
			            <li><a href="#" class="nextprojs"><i class="f-darkone-right <?php if($paged < $maxPages) echo 'active'; ?>"></i></a></li>
			        </ul>
				</div>
				<div class="clearfix"></div>
			</div>
		</div>
   
<script type="text/javascript">	
	$('.prevprojs').click(function(e){
		e.preventDefault();
	<?php if($paged > 1) {?>
		$("#projectsArea").fadeOut("slow");
		$.ajax({
			type: 'post',
			url: '<?php echo get_template_directory_uri(); ?>/include/projects.php?page=<?php echo $page - 1?>&category=<?php echo $category?>',
			success : function(data) {
				$('#projectsArea').html(data);
				$("#projectsArea").fadeIn();
				$('#projectsArea .bluebox').hide();
				$('#projectsArea .bluebox').each(function(i) {
					$(this).delay(200*i).fadeIn();
				});
			}
		});	
	<?php }?>
	});
	
	$('.nextprojs').click(function(e){
		e.preventDefault();
		$("#projectsArea").fadeOut("slow");
	<?php if($paged < $maxPages) {?>
		$.ajax({
			type: 'post',
			url: '<?php echo get_template_directory_uri(); ?>/include/projects.php?page=<?php echo $page + 1?>&category=<?php echo $category?>',
			success : function(data) {
				$('#projectsArea').html(data);
				$("#projectsArea").fadeIn();
				$('#projectsArea .bluebox').hide();
				$('#projectsArea .bluebox').each(function(i) {
					$(this).delay(200*i).fadeIn();
				});
			}
		});
	<?php }?>				
	});
	
</script>