<?php
/**
 * The Template for displaying index page.
 */
get_header(); ?>


<!-- #contents -->
<div id="contents">
	<div class="flexslider">

	<ul class="slides">
	    <?php $args = array(
	        'numberposts' => 5,                //表示（取得）する記事の数
	        'post_type' => 'key_img'    //投稿タイプの指定
	    );
	    $customPosts = get_posts($args);
	    if($customPosts) : foreach($customPosts as $post) : setup_postdata( $post ); ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key1', true),'full'); ?></li>
			<?php if(get_field("key2")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key2', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key3")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key3', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key4")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key4', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key5")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key5', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key6")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key6', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key7")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key7', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key8")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key8', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key9")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key9', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<?php if(get_field("key10")): ?>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key10', true),'full'); ?></li>
			<?php else : ?>
			<?php endif; ?>
			<!--<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key7', true),'full'); ?></li>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key8', true),'full'); ?></li>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key9', true),'full'); ?></li>
			<li><?php echo wp_get_attachment_image(get_post_meta($post->ID, 'key10', true),'full'); ?></li>-->
	    <?php endforeach; ?>
	    <?php else : //記事が無い場合 ?>
	    <?php endif; ?>
			<?php wp_reset_postdata(); ?>
	</ul>

	<div class="key_logo no_opacity" >
			<a href="<?php bloginfo('url'); ?>"><img src="<?php bloginfo('template_directory'); ?>/images/top_pat03_10.png" alt="宅都" width="240" height="410" /></a>
		<div id="search_top">&nbsp;</div>
			</div>
	</div>
	<!-- #main -->
	<div id="main">
		<?php
		// クエリ
		$meta_query = array();

		// 検索条件
		$search_conditions = array();


		/* 家賃 */
		if ( isset($_POST['yachin']) && is_array($_POST['yachin']) && count($_POST['yachin']) ) {

			$queries = array();
			for ( $i = 0, $cnt = count($_POST['yachin']); $i < $cnt; $i++ ) {

				$search_conditions[] = array(
					'display_name' => $_POST['yachin'][$i],
					'name'         => 'yachin[]',
					'value'        => $_POST['yachin'][$i]
				);

				$queries[] = array(
					'key'     => 's_yachin',
					'value'   => $_POST['yachin'][$i],
					'compare' => 'LIKE',
					'type'    => 'CHAR'
				);
			}

			if ( count($queries) ) $queries['relation'] = 'or';

			$meta_query[] = $queries;
		}

		/* 間取り */
		if ( isset($_POST['layout']) && is_array($_POST['layout']) && count($_POST['layout']) ) {

			$queries = array();
			for ( $i = 0, $cnt = count($_POST['layout']); $i < $cnt; $i++ ) {

				$search_conditions[] = array(
					'display_name' => $_POST['layout'][$i],
					'name'         => 'layout[]',
					'value'        => $_POST['layout'][$i]
				);

				$queries[] = array(
					'key'     => 's_madori',
					'value'   => $_POST['layout'][$i],
					'compare' => '='
				);
			}

			if ( count($queries) ) $queries['relation'] = 'or';

			$meta_query[] = $queries;
		}

		/* 専有面積 */
		if ( isset($_POST['menseki']) && is_array($_POST['menseki']) && count($_POST['menseki']) ) {

			$queries = array();
			for ( $i = 0, $cnt = count($_POST['menseki']); $i < $cnt; $i++ ) {

				$search_conditions[] = array(
					'display_name' => $_POST['menseki'][$i],
					'name'         => 'menseki[]',
					'value'        => $_POST['menseki'][$i]
				);

				$queries[] = array(
					'key'     => 's_menseki',
					'value'   => $_POST['menseki'][$i],
					'compare' => 'LIKE',
					'type'    => 'CHAR'
				);
			}

			if ( count($queries) ) $queries['relation'] = 'or';

			$meta_query[] = $queries;
		}

		/* 築年数 */
		if ( isset($_POST['tikunen']) && is_array($_POST['tikunen']) && count($_POST['tikunen']) ) {

			$queries = array();
			for ( $i = 0, $cnt = count($_POST['tikunen']); $i < $cnt; $i++ ) {

				$search_conditions[] = array(
					'display_name' => $_POST['tikunen'][$i],
					'name'         => 'tikunen[]',
					'value'        => $_POST['tikunen'][$i]
				);

				$queries[] = array(
					'key'     => 's_tikunen',
					'value'   => $_POST['tikunen'][$i],
					'compare' => 'LIKE',
					'type'    => 'CHAR'
				);
			}

			if ( count($queries) ) $queries['relation'] = 'or';

			$meta_query[] = $queries;
		}

		/* こだわり条件 */
		if ( isset($_POST['kodawari']) && is_array($_POST['kodawari']) && count($_POST['kodawari']) ) {

			$queries = array();
			for ( $i = 0, $cnt = count($_POST['kodawari']); $i < $cnt; $i++ ) {

				$search_conditions[] = array(
					'display_name' => $_POST['kodawari'][$i],
					'name'         => 'kodawari[]',
					'value'        => $_POST['kodawari'][$i]
				);

				$queries[] = array(
					'key'     => 's_kodawari',
					'value'   => $_POST['kodawari'][$i],
					'compare' => 'LIKE',
					'type'    => 'CHAR'
				);
			}

			if ( count($queries) ) $queries['relation'] = 'or';

			$meta_query[] = $queries;
		}


		if ( count($meta_query) ) $meta_query['relation'] = 'or';

		$args = array(
			'post_type'  => array('bukken'),
			'paged'      => (isset($_POST['page']) && is_numeric($_POST['page']))? $_POST['page'] : $paged,
			'meta_query' => $meta_query
		);

		/* タクソノミー */
		if ( isset($_POST['term_id']) && strlen($_POST['term_id']) ) {
			$term = get_term($_POST['term_id'], 'place_area');
			array_unshift($search_conditions, array(
				'display_name' => $term->name,
				'name'         => 'place-area'
			));
			$args['place_area'] = $term->slug;
		}

		query_posts($args);
		?>


		<!-- #articles -->
		<div id="articles">
			<div  class="Article_list clear_fix">
				<!-- #search-conditions -->
			<div id="search-conditions" class="clearfix">
				<!-- #search-conditions -->
<?php if ( count($search_conditions) ) foreach ( $search_conditions as $val ) : ?>
				<img src="<?php bloginfo('template_directory'); ?>/images/search_tag1.png" class="search_back1"/>
				<a href="javascript:void(0);" id="search_tag" data-action="clear" data-target="<?php echo $val['name']; ?>" data-value="<?php echo $val['value'] ?>">
					<?php echo $val['display_name']; ?></a>
<?php endforeach; ?>
			</div>
			<!-- /#search-conditions -->



			<?php if(have_posts()): ?>
			<?php $post_counter = 1; ?>
			<?php while(have_posts()): the_post();?>

			<?php if($post_counter == 1): ?>

			<div class="Article">
[--記事の書き出し箇所　中略--]
					</div>


			 <?php elseif($post_counter ==2): ?>

					<div class="Article2">
[--記事の書き出し箇所　中略--]
					</div>

			<?php else: ?>

			<div class="Article3">
[--記事の書き出し箇所　中略--]
					</div>



			<?php endif; ?>
			<?php $post_counter++; ?>
			<?php endwhile; ?>
			<?php else: ?>
						<p class="not-article">物件がありません。<br>条件を変えて再度検索してください。</p>
			<?php endif; ?>
<div class="clear"></div>
			<!-- #pager-->
			<div id="pager"></div>
			<!-- /#pager -->



		</div>
		</div>
		<!-- /#articles -->
	</div>
	<!-- /#main -->

<?php get_sidebar(); ?>

</div>
<!-- /#contents -->


<input type="hidden" id="m-page" name="m-page" value="<?php echo $wp_query->max_num_pages; ?>">
<input type="hidden" id="place-area" name="place-area" value="<?php echo $_POST['term_id'] ?>">

<?php if ( !isset($_POST['search']) || $_POST['search'] === false ) : ?>
<script>
$(function() {

	var $page = 1;

	search();

	$(document).on('change', '[data-action="search"]', function() {

		$('html, body').animate({scrollTop:$('#articles').offset().top}, 500, 'swing');

		search();
	});
	$(document).on('click', 'a[data-action="search"]', function() {

		$('#place-area').val($(this).data('id'));

		$('html, body').animate({scrollTop:$('#articles').offset().top}, 500, 'swing');

		search();
	});

	$(document).on('click', '[data-action="paging"]', function() {

		$('html, body').animate({scrollTop:$('#articles').offset().top}, 500, 'swing');

		search($(this).data('page'));
	});

	$(document).on('click', '[data-action="clear"]', function () {

		var $split = $(this).data('target').split(',');
		var $value = $(this).data('value');

		$.each($split, function($i, $val) {
			$tag_name = $('[name="' + $val + '"]')[0].tagName;

			if ( $tag_name == 'SELECT' ) {
				$('[name="' + $val + '"] option').prop('selected', false);
			}
			else if ( $tag_name == 'INPUT' ) {
				if ( $('[name="' + $val + '"]').attr('type') == 'checkbox' || $('[name="' + $val + '"]').attr('type') == 'radio' ) {
					$('[name="' + $val + '"][value="' + $value + '"]').prop('checked', false);
				}
				else {
					$('[name="' + $val + '"]').val('');
				}
			}
		});

		search();
	});

	function search($current_page) {
		$('#articles').children().remove();
		$('#articles').append('<p id="loading" style="text-align: center; margin-top: 30p;">Loading ...</p>');
		if ( $current_page == null ) {
			$page = 1;
		}
		else {
			$page = $current_page;
		}

		var $data = {'search': true, 'page': $page, 'term_id': $('#place-area').val(), 'kodawari':[], 'tikunen':[], 'layout':[], 'menseki':[], 'yachin':[]};
		$('input[name="kodawari[]"]:checked').each(function() {
			$data['kodawari'].push($(this).val());
		});
		$('input[name="tikunen[]"]:checked').each(function() {
			$data['tikunen'].push($(this).val());
		});
		$('input[name="layout[]"]:checked').each(function() {
			$data['layout'].push($(this).val());
		});
		$('input[name="menseki[]"]:checked').each(function() {
			$data['menseki'].push($(this).val());
		});
		$('input[name="yachin[]"]:checked').each(function() {
			$data['yachin'].push($(this).val());
		});

		$.ajax({
			type : 'POST',
			dataType : 'html',
			data : $data,
			success : function($html) {
				$html = $html.replace(/\r?\n/g, "");
				$html = $html.replace(/\t/g, "");
				var $articles = $html.match(/<div id="articles">.+?<!-- \/#articles -->/i);
				var $search_number = $html.match(/id="search-number"[^>]*?>([0-9,]+)/i);
				var $m_page = $html.match(/id="m-page"[^>]*?value="([0-9]+?)">/i);
				$('#m-page').val($m_page[1]);
				$('#search-number').text($search_number[1]);
				$('#articles').append($articles[0]);
				create_pager($page);

				$('.flexslider').flexslider({
					animation: "slide",
					slideshow:false,
					directionNav:false,
				});
			},
			error : function($XMLHttpRequest, $textStatus, $errorThrown) {
				console.log($textStatus);
			},
			complete : function () {
				$('#loading').remove();
			}
		});
	}

	function create_pager($current_page) {
		if ( $current_page == null ) {
			$page = 1;
		}
		else {
			$page = $current_page;
		}
		if ( !parseInt($('#m-page').val()) ) return;
		var $dom = '';

		if ( $page > 1 ) {
			$dom += '<a href="javascript:void(0);" class="prev" data-action="paging" data-page="1">前へ</a>';
		}
		else {
			$dom += '<span class="prev not">前へ</span>';
		}
		var $next_page = parseInt($page) + 1;
		if ( $page < $('#m-page').val() ) {
			$dom += '<a href="javascript:void(0);" class="next" data-action="paging" data-page="' + $next_page + '">次へ</a>';
		}
		else {
			$dom += '<span class="next not">次へ</span>';
		}
		$('#pager').append($dom);
	}
});
</script>
<?php endif; ?>

<?php get_footer(); ?>