From: Kevin Ball <kmball11@gmail.com>
Date: Wed, 27 Apr 2016 23:57:24 +0000 (-0700)
Subject: Fix data-click-open tooltip behavior
X-Git-Tag: v6.2.2-rc1~31^2
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=refs%2Fpull%2F8691%2Fhead;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Fix data-click-open tooltip behavior
---

diff --git a/docs/pages/tooltip.md b/docs/pages/tooltip.md
index c1919d107..e829db768 100644
--- a/docs/pages/tooltip.md
+++ b/docs/pages/tooltip.md
@@ -30,6 +30,21 @@ At the spot thus attained a second peg was driven, and about this, as a centre,
 
 ---
 
+## Tooltip clicking
+By default, clicking on a tooltip will leave it open until you click somewhere else.  However, you can disable that by adding data-click-open="false"
+
+```html_example
+<p>
+this 
+<span data-tooltip aria-haspopup="true" class="has-tip top" data-disable-hover="false" tabindex="2" title="You see?  I'm open!">tooltip will stay open</span>
+
+while 
+<span data-tooltip aria-haspopup="true" class="has-tip top" data-click-open="false" data-disable-hover="false" tabindex="2" title="I don't stay open">this one will only be open when hovered</span>
+</p>
+```
+
+---
+
 ## Tooltip Right and Left
 
 You can also position the tooltips to the right and left of the word by adding the classes `.right` or `.left` to the `<span>` element.
diff --git a/js/foundation.tooltip.js b/js/foundation.tooltip.js
index 827fcd298..dc17c3c73 100644
--- a/js/foundation.tooltip.js
+++ b/js/foundation.tooltip.js
@@ -249,7 +249,7 @@ class Tooltip {
       })
       .on('mouseleave.zf.tooltip', function(e) {
         clearTimeout(_this.timeout);
-        if (!isFocus || (!_this.isClick && _this.options.clickOpen)) {
+        if (!isFocus || (_this.isClick && !_this.options.clickOpen)) {
           _this.hide();
         }
       });
@@ -268,6 +268,11 @@ class Tooltip {
           }
         }
       });
+    } else {
+      this.$element.on('mousedown.zf.tooltip', function(e) {
+        e.stopImmediatePropagation();
+        _this.isClick = true;
+      });
     }
 
     if (!this.options.disableForTouch) {
@@ -286,11 +291,12 @@ class Tooltip {
     this.$element
       .on('focus.zf.tooltip', function(e) {
         isFocus = true;
-        // console.log(_this.isClick);
         if (_this.isClick) {
+          // If we're not showing open on clicks, we need to pretend a click-launched focus isn't
+          // a real focus, otherwise on hover and come back we get bad behavior
+          if(!_this.options.clickOpen) { isFocus = false; }
           return false;
         } else {
-          // $(window)
           _this.show();
         }
       })