← All changes | includes/widgets/Tabs/script.js +89 -0 51.1.2 → 51.1.83 View file →

		@@ -1,0 +1,89 @@
	1	+"use strict";
	2	+(function ($) {
	3	+ $(window).on("elementor/frontend/init", function () {
	4	+ elementorFrontend.hooks.addAction(
	5	+ "frontend/element_ready/king-addons-tabs.default",
	6	+ function ($scope) {
	7	+ elementorFrontend.elementsHandler.addHandler(
	8	+ elementorModules.frontend.handlers.Base.extend({
	9	+ onInit: function () {
	10	+ const $scope = this.$element;
	11	+ const $tabs = $(".king-addons-tabs", $scope).first();
	12	+ const $tabsWrap = $(".king-addons-tabs-wrap", $tabs).first();
	13	+ const $contentWrap = $(".king-addons-tabs-content-wrap", $tabs).first();
	14	+ const $tabItems = $tabsWrap.children(".king-addons-tab");
	15	+ const $contentItems = $contentWrap.children(".king-addons-tab-content");
	16	+ const tabsData = $tabs.data("options");
	17	+
	18	+ // Determine active tab from settings or URL
	19	+ let activeTabIndex = tabsData.activeTab - 1;
	20	+ const urlActiveTabPos = window.location.href.indexOf("active_tab=");
	21	+ if (urlActiveTabPos > -1) {
	22	+ activeTabIndex = parseInt(
	23	+ window.location.href
	24	+ .substring(urlActiveTabPos, window.location.href.lastIndexOf("#"))
	25	+ .replace("active_tab=", "")
	26	+ ) - 1;
	27	+ }
	28	+
	29	+ // Mark initial active tab and content
	30	+ $tabItems.eq(activeTabIndex).addClass("king-addons-tab-active");
	31	+ $contentItems.eq(activeTabIndex).addClass(
	32	+ "king-addons-tab-content-active king-addons-animation-enter"
	33	+ );
	34	+
	35	+ // Optional autoplay
	36	+ let autoplayInterval;
	37	+ if (tabsData.autoplay === "yes") {
	38	+ let startIndex = activeTabIndex;
	39	+ autoplayInterval = setInterval(() => {
	40	+ startIndex = startIndex < $tabItems.length - 1 ? startIndex + 1 : 0;
	41	+ switchTab(startIndex);
	42	+ }, tabsData.autoplaySpeed);
	43	+ }
	44	+
	45	+ // Hover or click trigger
	46	+ const eventName = tabsData.trigger === "hover" ? "mouseenter" : "click";
	47	+ $tabItems.on(eventName, function () {
	48	+ const index = $(this).data("tab") - 1;
	49	+ clearInterval(autoplayInterval);
	50	+ switchTab(index);
	51	+ });
	52	+
	53	+ // Switch tab utility
	54	+ const switchTab = (index) => {
	55	+ const $activeTab = $tabItems.eq(index);
	56	+ const $activeContent = $contentItems.eq(index);
	57	+
	58	+ // Fix wrapper height during transition
	59	+ $contentWrap.css("height", $contentWrap.outerHeight(true));
	60	+
	61	+ $tabItems.removeClass("king-addons-tab-active");
	62	+ $activeTab.addClass("king-addons-tab-active");
	63	+ $contentItems.removeClass("king-addons-tab-content-active king-addons-animation-enter");
	64	+
	65	+ // Calculate target height including container borders
	66	+ const targetHeight =
	67	+ $activeContent.outerHeight(true) +
	68	+ parseInt($contentWrap.css("border-top-width"), 10) +
	69	+ parseInt($contentWrap.css("border-bottom-width"), 10);
	70	+
	71	+ // Apply active classes and animate
	72	+ $activeContent.addClass(
	73	+ "king-addons-tab-content-active king-addons-animation-enter"
	74	+ );
	75	+ $contentWrap.css("height", targetHeight);
	76	+
	77	+ // Set back to auto after transition
	78	+ setTimeout(() => {
	79	+ $contentWrap.css("height", "auto");
	80	+ }, 500);
	81	+ };
	82	+ },
	83	+ }),
	84	+ { $element: $scope }
	85	+ );
	86	+ }
	87	+ );
	88	+ });
	89	+})(jQuery);