<?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="height:900px" >
<?php 	
	while ( $query->have_posts() ) : $query->the_post();
		 $locatie = get_field('plaats');
		 $image = get_field('hoofdafbeelding');
	?>	
			
			<div class="bluebox <?php if($i == 2 || $i == 5) echo 'mgr0'?>">
                <div class="title">SAMENBOUWEN<span>.IN/</span><?php echo str_replace(' ','',strtoupper($locatie));?></div>
                <div><img src="<?php echo $image['sizes']['medium']?>" alt="" width="<?php echo $image['sizes']['medium-width']?>" 
                	height="<?php echo $image['sizes']['medium-height']?>"/></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 class="clear"></div>
    	<div class="homeblock first mtop10">ALS COLLECTIEF IN<br/>UW EIGEN GEMEENTE<br/>AAN DE SLAG</div>
        <div class="homeblock first mtop10">WAT ALS IK GROND<br/>HEB VOOR EEN<br/>COLLECTIEF ?</div>
        <div style="float: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> 
   
<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 }?>				
	});
	<?php if(isset($_GET['page']) || isset($_GET['category'])) {?>
	var off = $('.jcarousel').offset();
	$('.jcarousel-control-prev').css('left', off.left - 80);
	$('.jcarousel-control-prev').css('top', off.top -200);
	$('.jcarousel-control-next').css('top', off.top -200);
	<?php }?>
</script>