Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
<!-- Define first query for states to highlight on the map -->
<?php if($query):?>
<?php $states = array(); // create an empty array to store states to highlight on the map
$region = array(); // create an empty associative array to create place states in a defined region
?>
// Look through query to create $state array
<?php while( $query->have_posts() ) : $query->the_post();?>
<?php
$title = get_the_title();
$inRegion = get_field('region'); // an ACF relationship field
?>
<?php array_push($states, $title); // Adds state to the $state array ?>
<?php if($inRegion):?>
<!-- Loop through query to create $regions array -->
<?php foreach( $inRegion as $post): setup_postdata($post); ?>
<?php $slug = basename( get_the_permalink()); ?>
<?php $region[$title] = $slug;?>
<?php endforeach; ?>
<?php wp_reset_postdata();?>
<?php endif;?>
<?php endwhile;?>
<!-- Create a dropdown selector for accessibility -->
<select id="state-resources-selector">
<option>Choose State or Region</option>
<!-- Loop through query to create options for select input -->
<?php while( $query->have_posts() ) : $query->the_post();?>
<?php $slug = $post->post_name;?>
<option value="<?php echo $slug;?>"><?php the_title();?></option>
<?php endwhile;?>
</select>
<?php endif;?>
<?php wp_reset_query(); ?>
<!-- End first query to add highlighted states to the map and select dropdown -->
<?php endif;?>
<!-- Define second query for all the locations, states and regions -->
<div class="map-container">
<?php if( $query2->have_posts() ): ?>
<?php while( $query2->have_posts() ) : $query2->the_post();?>
<?php $stateSlug = $post->post_name;?>
<div class="location-card location-<?php echo $stateSlug;?>">
<button class="close-button">Close</button>
<h2><?php the_title();?></h2>
<?php if(have_rows('key_partners_listing')):?>
<h3>Key Partners</h3>
<ul class="partners">
<?php while(have_rows('key_partners_listing')): the_row();?>
<li><?php the_sub_field('partner_name');?></li>
<?php endwhile;?>
</ul>
<?php endif;?>
<?php if(have_rows('resources_listing')):?>
<div class="resources">
<h3>Resources</h3>
<ul class="resources-listing">
<?php while(have_rows('resources_listing')): the_row();?>
<li><a href="<?php the_sub_field('resource_link');?>"><?php the_sub_field('resource_name');?></a></li>
<?php endwhile;?>
<li><a href="<?php the_permalink();?>">Success Story</a></li>
</ul>
</div>
<?php else:?>
<div class="resources">
<h3>Resources</h3>
<ul class="resources-listing">
<li><a href="<?php the_permalink();?>">Success Story</a></li>
</ul>
</div>
<?php endif;?>
</div>
<?php endwhile;?>
<?php endif;?>
<?php wp_reset_query(); ?>
<!-- SVG map -->
<div class="map state-view" id="map">
<svg>
<!-- Conditionals on the polygons and paths to see if the state is an active partnership and then another conditional to check if it is part of a defined region -->
<polygon id="kansas" <?php if(in_array('Kansas', $states)): echo 'class="active" '; endif;?><?php if(isset($region['Kansas'])): echo 'data-region="'.$region['Kansas'].'" '; endif;?>points="..."></polygon>
</svg>
</div>
</div>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.