$( document ).ready(function() {
	var currentTabIndex = 1;

	$(".b-tabs__link").on("click", function() {
		currentTabIndex = $(this).data("w-tab").slice(-1);
	});

	$(".b-sider__arrow-left").on("click", function(e) {
		const tabsDiv = $(this).parent().parent().parent().siblings(".b-tabs__menu");

		const tabIndex = Number($(this).parent().parent().data("w-tab").slice(-1));
		const tabsLength = $(this).closest(".b-tabs__content").find(".b-tabs__pane").length;

		let prevTabIndex = tabIndex - 1;
		console.log("prevTabIndex", prevTabIndex);

		if(prevTabIndex < 1) prevTabIndex = 5

		console.log("prevTabIndex after", prevTabIndex);

		changeTabPrev($(this), prevTabIndex, tabsLength)
	})

	$(".b-arrow-coral").on("click", function(e) {
		const tabsDiv = $(this).parent().parent().parent().siblings(".b-tabs__menu");

		const tabIndex = Number($(this).parent().parent().data("w-tab").slice(-1));
		const tabsLength = $(this).closest(".b-tabs__content").find(".b-tabs__pane").length;

		let nextTabIndex = tabIndex + 1;

		if(nextTabIndex > tabsLength) nextTabIndex = 1

		changeTab($(this), nextTabIndex, tabsLength)
	})

	function changeTab(ctx, currentTabIndex, tabsLength) {
		changeSelectedTab(currentTabIndex);
		const tabsDiv = ctx.parent().parent().parent().siblings(".b-tabs__menu");

		const currentTabPane = ctx.parent().parent();
		const firstPane = ctx.parent().parent().parent().find(".b-tabs__pane").eq(0);
		const nextPane = ctx.parent().parent().next();

		const nextTabPane = currentTabIndex !== 1
			? changeToAnother()
			: changeToFirst()

		function changeToFirst() {
			firstPane.css({"opacity": 1, "transition": "opacity 0.3s ease 0s, opacity 300ms ease 0s"}).addClass("w--tab-active");
		}

		function changeToAnother() {
			nextPane.css({"opacity": 1, "transition": "opacity 0.3s ease 0s, opacity 300ms ease 0s"}).addClass("w--tab-active")
			currentTabPane.removeClass("w--tab-active").removeAttr("style");
		}

	}

	function changeTabPrev(ctx, currentTabIndex, tabsLength) {
		changeSelectedTab(currentTabIndex);
		const tabsDiv = ctx.parent().parent().parent().siblings(".b-tabs__menu");
		// currentTabIndex = currentTabIndex + 1

		console.log("currentTabIndex", currentTabIndex);
		console.log("===", currentTabIndex === tabsLength);

		const currentTabPane = ctx.parent().parent();
		const lastPane = ctx.parent().parent().parent().find(".b-tabs__pane").eq(tabsLength - 1);
		const nextPane = ctx.parent().parent().prev();

		console.log("lastPane", lastPane);

		const nextTabPane = currentTabIndex !== tabsLength
			? changeToAnother()
			: changeToLast()

		function changeToLast() {
			currentTabPane.removeClass("w--tab-active").removeAttr("style");
			lastPane.css({"opacity": 1, "transition": "opacity 0.3s ease 0s, opacity 300ms ease 0s"}).addClass("w--tab-active");
		}

		function changeToAnother() {
			nextPane.css({"opacity": 1, "transition": "opacity 0.3s ease 0s, opacity 300ms ease 0s"}).addClass("w--tab-active")
			currentTabPane.removeClass("w--tab-active").removeAttr("style");
		}
	}

	function changeSelectedTab(idx) {
		// console.log("currentTabIndex from changeSelectedTab", currentTabIndex);
		$(".b-tabs__menu .w--current").removeClass("w--current");
		$(".b-tabs__menu").find(".b-tabs__link").eq(idx - 1).addClass("w--current");
	}
})