<ul class="map-ul menu vertical submenu is-dropdown-submenu first-sub">
<li class="map-li">
<div class="harbor-map-container">
-
+
<svg class="region-overlay">
-
+
<rect data-id="293" class="tag michiana" ry="5" fill="white" ry="5" x="315" y="370" width="100" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text onclick="get_id(this)" data-id="293" class="map-text" stroke-width="1" font-family="Lato" stroke="#1E3D67" fill="#1E3D67" x="323" y="388" > MICHIANA</text>
-
+
<rect data-id="292" class="tag grand-beach" ry="5" fill="white" ry="5" x="360" y="315" width="125" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text data-id="292" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="365" y="333" > GRAND BEACH</text>
-
+
<rect data-id="286" class="tag new-buffalo" ry="5" fill="white" ry="5" x="420" y="260" width="125" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text data-id="286" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="427" y="278" > NEW BUFFALO</text>
-
+
<rect data-id="290" class="tag union-pier" ry="5" fill="white" ry="5" x="540" y="170" width="110" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text data-id="290" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="548" y="188" > UNION PIER</text>
-
+
<rect data-id="289" class="tag lakeside" ry="5" fill="white" ry="5" x="610" y="100" width="100" height="25" stroke="#1E3D67" fill="white" fill="transparent" stroke-width="1"/>
<text alt="289" data-id="289" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="622" y="118"> LAKESIDE</text>
-
+
<rect data-id="288" class="tag harbert" ry="5" fill="white" ry="5" x="660" y="50" width="90" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text data-id="288" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="668" y="68" > HARBERT</text>
-
+
<rect data-id="291" class="tag three-oaks" ry="5" fill="white" ry="5" class="three-oaks" x="675" y="300" width="115" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text data-id="291" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="684" y="318" > THREE OAKS</text>
-
+
<rect data-id="287" class="tag sawyer" fill="white" ry="5" ry="5" x="700" y="10" width="90" height="25" stroke="#1E3D67" fill="transparent" stroke-width="1"/>
<text data-id="287" class="map-text" stroke="#1E3D67" fill="#1E3D67" x="712" y="28" > SAWYER</text>
</svg>
-
+
<div id="mapRegionData">
<?php $community_page_object = get_page( 186 ); ?>
<?php $community_page_image = wp_get_attachment_image_src( get_post_thumbnail_id( 186 ), 'map-image'); ?>
<?php //$community_page_content = substr(strip_tags($community_page_object->post_content),0, 300) . "..."; ?>
<?php //$community_page_content = json_encode(strip_shortcodes($community_page_content)); ?>
<?php $community_page_content = json_encode( get_the_excerpt( 186 ) ); ?>
-
-
+
+
<div class="map-page-title-container"><a class="map-page-link map-title-link" href="<?php echo $community_page_url ;?>"></a></div>
<div class="map-image-container"></div>
-
+
<!-- <a class="map-page-link" href="<?php echo $community_page_url ;?>"><div class="map-image-container"></div></a>-->
<div class="map-page-content"></div>
<!-- <a class="map-page-more" href="<?php echo $community_page_url ;?>"> More </a>-->
);
$nav_posts = get_posts($nav_args);
-
+$sites = array();
foreach ($nav_posts as $p){
$page_object = get_page( $p->ID );
$filter_content = strip_shortcodes($filter_content);
$sites[$p->ID]['content'] = $filter_content;
}
- $js_sites = json_encode($sites);
-//echo '<pre>', print_r($sites) , '</pre>';
+$js_sites = json_encode($sites);
?>
<script type="text/javascript">
jQuery(document).ready( function ($) {
var site_array = <?php echo $js_sites ?>;
-
+
var id, fill, classes, target_class;
var region = $('.tag');
var regionData = $('#mapRegionData');
// hover effects and data collection
$(region).hover( function (){
-
+
classes = $(this).attr("class").split(' ');
target_class = classes[0];
id = $(this).attr("data-id");
regionData.find(page_link).attr("href", site_array[id]['url']);
regionData.find(page_title).html(site_array[id]['title']);
-
+
// remove image container if there is no image
if ( site_array[id]['image'] !== null ){
image_container.css("display", "block");
$(region).on("click", function (){
window.location.href = site_array[id]['url'];
});
-
+
$(".map-text").on("click", function(){
id = $(this).attr("data-id");
window.location.href = site_array[id]['url'];
});
});
-</script>
\ No newline at end of file
+</script>