From: Kevin Ball <kmball11@gmail.com>
Date: Wed, 18 Jan 2017 23:13:21 +0000 (-0800)
Subject: Fix tabs deeplink history to work with back button within page
X-Git-Tag: 6.3.1~27^2~3
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=b85975d8eb1e35301b7ad1ccd0ee68ce3aee95f4;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

Fix tabs deeplink history to work with back button within page
---

diff --git a/docs/pages/tabs.md b/docs/pages/tabs.md
index fd9beae9d..1f9ddd0a0 100644
--- a/docs/pages/tabs.md
+++ b/docs/pages/tabs.md
@@ -157,7 +157,7 @@ Add the attribute `data-deep-link="true"` to a tabstrip to:
 - allow users to open a particular tab at page load with a hash-appended URL
 
 ```html_example
-<ul class="tabs" data-deep-link="true" data-tabs id="deeplinked-tabs">
+<ul class="tabs" data-deep-link="true" data-update-history="true" data-deep-link-smudge="true" data-deep-link-smudge="500" data-tabs id="deeplinked-tabs">
   <li class="tabs-title is-active"><a href="#panel1d" aria-selected="true">Tab 1</a></li>
   <li class="tabs-title"><a href="#panel2d">Tab 2</a></li>
   <li class="tabs-title"><a href="#panel3d">Tab 3</a></li>
diff --git a/js/foundation.tabs.js b/js/foundation.tabs.js
index 907bf5323..3e090427a 100644
--- a/js/foundation.tabs.js
+++ b/js/foundation.tabs.js
@@ -77,32 +77,11 @@ class Tabs {
         });
       }
 
-      //use browser to open a tab, if it exists in this tabset
-      if (_this.options.deepLink) {
-        var anchor = window.location.hash;
-        //need a hash and a relevant anchor in this tabset
-        if(anchor.length) {
-          var $link = $elem.find('[href="'+anchor+'"]');
-          if ($link.length) {
-            _this.selectTab($(anchor));
-
-            //roll up a little to show the titles
-            if (_this.options.deepLinkSmudge) {
-              $(window).load(function() {
-                var offset = $elem.offset();
-                $('html, body').animate({ scrollTop: offset.top }, _this.options.deepLinkSmudgeDelay);
-              });
-            }
-
-            /**
-              * Fires when the zplugin has deeplinked at pageload
-              * @event Tabs#deeplink
-              */
-             $elem.trigger('deeplink.zf.tabs', [$link, $(anchor)]);
-           }
-        }
-      }
     });
+    //use browser to open a tab, if it exists in this tabset
+    if (this.options.deepLink) {
+      this._checkDeepLink();
+    }
 
     if(this.options.matchHeight) {
       var $images = this.$tabContent.find('img');
@@ -114,9 +93,32 @@ class Tabs {
       }
     }
 
+    this._checkDeepLink = this._checkDeepLink.bind(this);
     this._events();
   }
 
+  _checkDeepLink() {
+    var anchor = window.location.hash;
+    //need a hash and a relevant anchor in this tabset
+    if(anchor.length) {
+      var $link = this.$element.find('[href="'+anchor+'"]');
+      if ($link.length) {
+        this.selectTab($(anchor));
+
+        //roll up a little to show the titles
+        if (this.options.deepLinkSmudge) {
+          var offset = this.$element.offset();
+          $('html, body').animate({ scrollTop: offset.top }, this.options.deepLinkSmudgeDelay);
+        }
+
+        /**
+          * Fires when the zplugin has deeplinked at pageload
+          * @event Tabs#deeplink
+          */
+         this.$element.trigger('deeplink.zf.tabs', [$link, $(anchor)]);
+       }
+     }
+   }
   /**
    * Adds event handlers for items within the tabs.
    * @private
@@ -131,6 +133,10 @@ class Tabs {
 
       $(window).on('changed.zf.mediaquery', this._setHeightMqHandler);
     }
+
+    if(this.options.deepLink) {
+      $(window).on('popstate', this._checkDeepLink);
+    }
   }
 
   /**
@@ -365,6 +371,7 @@ class Tabs {
       }
     }
 
+    $(window).off('popstate', this._checkDeepLink);
     Foundation.unregisterPlugin(this);
   }
 }
diff --git a/yarn.lock b/yarn.lock
index 29093e12e..01056e4ce 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1565,16 +1565,16 @@ doiuse@^2.5.0:
     through2 "^0.6.3"
     yargs "^3.5.4"
 
-dom-serializer@0, dom-serializer@~0.1.0:
-  version "0.1.0"
-  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
+dom-serializer@0, dom-serializer@~0.0.0:
+  version "0.0.1"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.0.1.tgz#9589827f1e32d22c37c829adabd59b3247af8eaf"
   dependencies:
     domelementtype "~1.1.1"
     entities "~1.1.1"
 
-dom-serializer@~0.0.0:
-  version "0.0.1"
-  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.0.1.tgz#9589827f1e32d22c37c829adabd59b3247af8eaf"
+dom-serializer@~0.1.0:
+  version "0.1.0"
+  resolved "https://registry.yarnpkg.com/dom-serializer/-/dom-serializer-0.1.0.tgz#073c697546ce0780ce23be4a28e293e40bc30c82"
   dependencies:
     domelementtype "~1.1.1"
     entities "~1.1.1"
@@ -3553,7 +3553,7 @@ jodid25519@^1.0.0:
   dependencies:
     jsbn "~0.1.0"
 
-jquery@>=1.7, jquery@^2.2.0:
+jquery@>=1.7, jquery@>=2.2.0, jquery@^2.2.0:
   version "2.2.4"
   resolved "https://registry.yarnpkg.com/jquery/-/jquery-2.2.4.tgz#2c89d6889b5eac522a7eea32c14521559c6cbf02"