From e672df00710d736f15934bfda2cdf97a8189d380 Mon Sep 17 00:00:00 2001
From: Anthony Talarico <talarico@gaslightmedia.com>
Date: Wed, 13 Jul 2016 11:29:23 -0400
Subject: [PATCH] added checking for left or half of screen to adjust tooltlip
 pop out

---
 campground-map.php | 28 +++++++++++++++++++++++-----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/campground-map.php b/campground-map.php
index 3298b9c..8115594 100644
--- a/campground-map.php
+++ b/campground-map.php
@@ -205,13 +205,23 @@ $js_categories = json_encode($categories);
 <?php get_footer(); ?>
     
 <script type="text/javascript">  
-        
+     var side;
      var width = jQuery(window).width();
     jQuery(window).resize( function () {
         var width = jQuery(window).width();
         console.debug(width);
     });
     
+    jQuery("div").mouseover(function(e){
+    var pWidth = jQuery(this).innerWidth(); //use .outerWidth() if you want borders
+    var pOffset = jQuery(this).offset(); 
+    var x = e.pageX - pOffset.left;
+    if(pWidth / 2 > x)
+        side = "left";
+    else
+        side = "right";
+    });
+    
     var x, y, site, mouseover, element, site_name_text, image, id, site_loop, site_power, site_tents, site_water, site_sewer,temp,camper_string;
     var campers = new Array();
     var tool_tip = document.getElementsByClassName('tool-tip');
@@ -294,14 +304,22 @@ $js_categories = json_encode($categories);
     function show_tool_tip(){
 
         tool_tip[0].style.display = "block";
-        if (width < 800){
+        
+        if (width < 400){
             tool_tip[0].style.left = "50%";
             tool_tip[0].style.top = y + "px";
-   
             jQuery(tool_tip[0]).css("transform", "translateX(-50%)");
+        } else if(width > 400 && width < 1024) {
+            if(side === "left"){
+                tool_tip[0].style.left = "50%";
+                tool_tip[0].style.left = (x - 100) + "px";
+            } else {
+                tool_tip[0].style.left = (x - 300) + "px";
+            }
+            tool_tip[0].style.top = y + "px";
         } else {
-             tool_tip[0].style.left = (x - 200) + "px";
-             tool_tip[0].style.top = y + "px";
+            tool_tip[0].style.left = (x - 200) + "px";
+            tool_tip[0].style.top = y + "px";
         }
         
         jQuery(".tool-text").find(".site-name").html("<strong>" + site_name_text + "</strong>");
-- 
2.17.1