From: Nicolas Coden <nicolas@ncoden.fr>
Date: Sun, 26 Aug 2018 21:35:54 +0000 (+0200)
Subject: fix: return to initial state when reseting hash in Accordion & Tabs #11100
X-Git-Tag: v6.6.0~3^2~96^2~8
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=5ea51f3b96e494e3c01a581d826bc8da3cf4d3b4;p=thirdparty%2Ffoundation%2Ffoundation-sites.git

fix: return to initial state when reseting hash in Accordion & Tabs #11100

When deep-linking is enabled and the user goes back in the history up to when no hash is set, display the initially-selected content/tab instead of staying with the content/tab that was selected the first.

Closes https://github.com/zurb/foundation-sites/issues/11100
Replaces https://github.com/zurb/foundation-sites/issues/11101

Co-authored-by: Jamie Chong <jamie@hippocurious.com>
---

diff --git a/js/foundation.accordion.js b/js/foundation.accordion.js
index 67481c85d..f5c22f7de 100644
--- a/js/foundation.accordion.js
+++ b/js/foundation.accordion.js
@@ -59,15 +59,25 @@ class Accordion extends Plugin {
 
       $content.attr({'role': 'tabpanel', 'aria-labelledby': linkId, 'aria-hidden': true, 'id': id});
     });
+
     var $initActive = this.$element.find('.is-active').children('[data-tab-content]');
     this.firstTimeInit = true;
-    if($initActive.length){
+    if ($initActive.length) {
+      // Save up the initial hash to return to it later when going back in history
+      this._initialAnchor = $initActive.prev('a').attr('href');
+
       this.down($initActive, this.firstTimeInit);
       this.firstTimeInit = false;
     }
 
     this._checkDeepLink = () => {
       var anchor = window.location.hash;
+
+      // if there is no anchor, return to the initial panel
+      if (!anchor.length && this._initialAnchor) {
+        anchor = this._initialAnchor;
+      }
+
       //need a hash and a relevant anchor in this tabset
       if(anchor.length) {
         var $link = this.$element.find('[href$="'+anchor+'"]'),
diff --git a/js/foundation.tabs.js b/js/foundation.tabs.js
index 1b191366c..564af2f23 100644
--- a/js/foundation.tabs.js
+++ b/js/foundation.tabs.js
@@ -73,6 +73,11 @@ class Tabs extends Plugin {
         'aria-labelledby': linkId
       });
 
+      // Save up the initial hash to return to it later when going back in history
+      if (isActive) {
+        _this._initialAnchor = `#${hash}`;
+      }
+
       if(!isActive) {
         $tabContent.attr('aria-hidden', 'true');
       }
@@ -85,6 +90,7 @@ class Tabs extends Plugin {
         });
       }
     });
+
     if(this.options.matchHeight) {
       var $images = this.$tabContent.find('img');
 
@@ -98,8 +104,14 @@ class Tabs extends Plugin {
      //current context-bound function to open tabs on page load or history hashchange
     this._checkDeepLink = () => {
       var anchor = window.location.hash;
+
+      // if there is no anchor, return to the initial tab
+      if (!anchor.length && this._initialAnchor) {
+        anchor = this._initialAnchor;
+      }
+
       //need a hash and a relevant anchor in this tabset
-      if(anchor.length) {
+      if (anchor.length) {
         var anchorNoHash = (anchor.indexOf('#') >= 0 ? anchor.slice(1) : anchor);
         var $link = this.$element.find(`[href$="${anchor}"],[data-tabs-target="${anchorNoHash}"]`).first();
         if ($link.length) {