From ced0e7cc8f88264df01ed17969511d1a5788181e Mon Sep 17 00:00:00 2001
From: Stephen Abello <stephen.abello@combodo.com>
Date: Fri, 20 Aug 2021 11:17:53 +0200
Subject: [PATCH] =?UTF-8?q?N=C2=B04093=20When=20clicking=20on=20a=20tab=20?=
 =?UTF-8?q?before=20tab=20widget=20is=20loaded,=20prevent=20AjaxTabs=20fro?=
 =?UTF-8?q?m=20redirecting=20our=20page=20to=20their=20target?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 js/layouts/tab-container/tab-container.js     | 25 +++++++++++++++++--
 .../layouts/tab-container/layout.html.twig    |  4 +--
 2 files changed, 25 insertions(+), 4 deletions(-)

diff --git a/js/layouts/tab-container/tab-container.js b/js/layouts/tab-container/tab-container.js
index cdc76251b..c9f224847 100644
--- a/js/layouts/tab-container/tab-container.js
+++ b/js/layouts/tab-container/tab-container.js
@@ -24,6 +24,8 @@ $(function()
             {
                 tabs_list: '[data-role="ibo-tab-container--tabs-list"]',
                 tab_header: '[data-role="ibo-tab-container--tab-header"]',
+                tab_ajax_type: '[data-tab-type="ajax"]',
+                tab_html_type: '[data-tab-type="html"]',
                 tab_toggler: '[data-role="ibo-tab-container--tab-toggler"]',
                 extra_tabs_container: '[data-role="ibo-tab-container--extra-tabs-container"]',
                 extra_tabs_list_toggler: '[data-role="ibo-tab-container--extra-tabs-list-toggler"]',
@@ -65,10 +67,29 @@ $(function()
 		            // will be executed for the selected tab whenever the hash changes.
 		            oTabsParams['event'] = 'change';
 	            }
+	            
+	            // While our tab widget is loading, protect tab toggler from being triggered
+	            this.element.find(this.js_selectors.tab_toggler).on('click', function(e){
+	            	console.log('cc');
+		            if(me.element.attr('data-status') === 'loading') {
+			            console.log('non');
+			            e.preventDefault();
+			            e.stopImmediatePropagation();
+		            }
+	            });
+	            // Now that we are protected from toggler being triggered without tab container being loaded, we can put back
+	            // data-target attribute value back into href attribute
+	            $.each(this.element.find(this.js_selectors.tab_header + this.js_selectors.tab_ajax_type), function (a){
+	            	let oLink = $(this).find(me.js_selectors.tab_toggler);
+		            oLink.attr('href', oLink.attr('data-target'));
+	            })
+	            
 	            this._addTabsWidget(oTabsParams);
 
-
-	            this._bindEvents();
+	            this._bindEvents()
+	            
+	            // We're done, set our status as loaded
+	            this.element.attr('data-status', 'loaded');
             },
 	        /**
 	         * @param oParams {Object} Structured object representing the options for the jQuery UI Tabs widget
diff --git a/templates/base/layouts/tab-container/layout.html.twig b/templates/base/layouts/tab-container/layout.html.twig
index 726607fde..84cb726e6 100644
--- a/templates/base/layouts/tab-container/layout.html.twig
+++ b/templates/base/layouts/tab-container/layout.html.twig
@@ -1,7 +1,7 @@
 {# @copyright   Copyright (C) 2010-2021 Combodo SARL #}
 {# @license     http://opensource.org/licenses/AGPL-3.0 #}
 <div id="{{ oUIBlock.GetId() }}" class="ibo-tab-container ibo-is-{{ oUIBlock.GetLayout() }}{% if oUIBlock.GetIsScrollable() %} ibo-is-scrollable{% endif %}"
-     data-role="ibo-tab-container">
+     data-role="ibo-tab-container" data-status="loading">
     {% block iboTabContainer %}
         <ul class="ibo-tab-container--tabs-list" data-role="ibo-tab-container--tabs-list">
             {% if not aPage.isPrintable %}
@@ -14,7 +14,7 @@
                                     data-tab-type="{{ oTab.GetType() }}"
                                     data-cache="{{ oTab.GetCache() }}"
                                     data-placeholder="{{ oTab.GetPlaceholderAbsPath() }}">
-                                    <a href="{{ oTab.GetUrl() }}" class="ibo-tab-container--tab-toggler"
+                                    <a data-target="{{ oTab.GetUrl() }}" class="ibo-tab-container--tab-toggler"
                                        data-role="ibo-tab-container--tab-toggler">
                                         <span class="ibo-tab-container--tab-toggler-label" data-role="ibo-tab-container--tab-toggler-label" title="{{ oTab.GetTitle() }}">{{ oTab.GetTitle() }}</span>
                                     </a>