/**
*
* Custom tabs 1.0.0
* Вкладки
*
* Copyright 2025 Mihail Pridannikov
*
* Released on: June 16, 2025
*
*/
const CustomTabs = function (customSettings) {
this.deepMergeObjects = function (obj1, obj2) {
const result = {};
for (const key in obj2) {
if (obj2.hasOwnProperty(key)) {
if (typeof obj2[key] === "object" && obj1.hasOwnProperty(key) && typeof obj1[key] === "object") {
result[key] = this.deepMergeObjects(obj1[key], obj2[key]);
} else {
result[key] = obj2[key];
}
}
}
for (const key in obj1) {
if (obj1.hasOwnProperty(key) && !result.hasOwnProperty(key)) {
if (typeof obj1[key] === "object") {
result[key] = this.deepMergeObjects(obj1[key], {});
} else {
result[key] = obj1[key];
}
}
}
return result;
}
const TABS = document.querySelectorAll('.tabs');
const DEFAULT_SETTINGS = {}
let settings = this.deepMergeObjects(DEFAULT_SETTINGS, customSettings);
this.init = function() {
TABS.forEach(tabs => {
tabs.querySelectorAll('.tabs__tab').forEach(tab => {
tab.addEventListener('click', e => handlerClickOnTab(e, tabs));
});
});
}
function handlerClickOnTab(e, tabs) {
e.preventDefault();
removeClassOnTabs(tabs);
removingClassOnContents(tabs);
addingClass(tabs, e.currentTarget.getAttribute('data-id'));
}
function removeClassOnTabs(tabs) {
tabs.querySelectorAll('.tabs__tab').forEach(tab => {
tab.classList.remove('is-active');
});
}
function removingClassOnContents(tabs) {
tabs.querySelectorAll('.tabs__content').forEach(content => {
content.classList.remove('is-active');
});
}
function addingClass(tabs, id) {
tabs.querySelector(`.tabs__tab[data-id="${id}"]`).classList.add('is-active');
tabs.querySelector(`.tabs__content[data-id="${id}"]`).classList.add('is-active');
}
TABS ? this.init() : null;
};