🚚 Remove 'pt' prefix for clarity and decoupling

This commit is contained in:
Manuel Cillero 2024-03-02 09:16:30 +01:00
parent e7744cbb93
commit 1dfc789172
24 changed files with 729 additions and 734 deletions

View file

@ -1,15 +1,15 @@
function pt_menu__showChildren(nav, children) {
let submenu = children[0].querySelector('.pt-menu__subs');
function menu__showChildren(nav, children) {
let submenu = children[0].querySelector('.menu__subs');
submenu.classList.add('active');
submenu.style.animation = 'slideLeft 0.5s ease forwards';
let title = children[0].querySelector('i').parentNode.childNodes[0].textContent;
nav.querySelector('.pt-menu__title').innerHTML = title;
nav.querySelector('.pt-menu__header').classList.add('active');
nav.querySelector('.menu__title').innerHTML = title;
nav.querySelector('.menu__header').classList.add('active');
}
function pt_menu__hideChildren(nav, children) {
let submenu = children[0].querySelector('.pt-menu__subs');
function menu__hideChildren(nav, children) {
let submenu = children[0].querySelector('.menu__subs');
submenu.style.animation = 'slideRight 0.5s ease forwards';
setTimeout(() => {
submenu.classList.remove('active');
@ -19,70 +19,69 @@ function pt_menu__hideChildren(nav, children) {
children.shift();
if (children.length > 0) {
let title = children[0].querySelector('i').parentNode.childNodes[0].textContent;
nav.querySelector('.pt-menu__title').innerHTML = title;
nav.querySelector('.menu__title').innerHTML = title;
} else {
nav.querySelector('.pt-menu__header').classList.remove('active');
nav.querySelector('.pt-menu__title').innerHTML = '';
nav.querySelector('.menu__header').classList.remove('active');
nav.querySelector('.menu__title').innerHTML = '';
}
}
function pt_menu__toggle(nav, overlay) {
function menu__toggle(nav, overlay) {
nav.classList.toggle('active');
overlay.classList.toggle('active');
}
function pt_menu__reset(menu, nav) {
nav.querySelector('.pt-menu__header').classList.remove('active');
nav.querySelector('.pt-menu__title').innerHTML = '';
menu.querySelectorAll('.pt-menu__subs').forEach(submenu => {
function menu__reset(menu, nav) {
nav.querySelector('.menu__header').classList.remove('active');
nav.querySelector('.menu__title').innerHTML = '';
menu.querySelectorAll('.menu__subs').forEach(submenu => {
submenu.classList.remove('active');
submenu.style.removeProperty("animation");
});
}
document.querySelectorAll('.pt-menu__container').forEach(menu => {
document.querySelectorAll('.menu__container').forEach(menu => {
let menuChildren = [];
const menuNav = menu.querySelector('.pt-menu__nav');
const menuOverlay = menu.querySelector('.pt-menu__overlay');
const menuNav = menu.querySelector('.menu__nav');
const menuOverlay = menu.querySelector('.menu__overlay');
menu.querySelector('.pt-menu__section').addEventListener('click', (e) => {
if (!menuNav.classList.contains('active')) {
return;
}
let target = e.target.closest('.pt-menu__children');
if (target && target != menuChildren[0]) {
menuChildren.unshift(target);
pt_menu__showChildren(menuNav, menuChildren);
menu.querySelector('.menu__section').addEventListener('click', (e) => {
if (menuNav.classList.contains('active')) {
let target = e.target.closest('.menu__children');
if (target && target != menuChildren[0]) {
menuChildren.unshift(target);
menu__showChildren(menuNav, menuChildren);
}
}
});
menu.querySelector('.pt-menu__arrow').addEventListener('click', () => {
pt_menu__hideChildren(menuNav, menuChildren);
menu.querySelector('.menu__arrow').addEventListener('click', () => {
menu__hideChildren(menuNav, menuChildren);
});
menu.querySelector('.pt-menu__close').addEventListener('click', () => {
pt_menu__toggle(menuNav, menuOverlay);
menu.querySelector('.menu__close').addEventListener('click', () => {
menu__toggle(menuNav, menuOverlay);
setTimeout(() => {
pt_menu__reset(menu, menuNav);
menu__reset(menu, menuNav);
menuChildren = [];
}, 300);
});
menu.querySelector('.pt-menu__trigger').addEventListener('click', () => {
pt_menu__toggle(menuNav, menuOverlay);
menu.querySelector('.menu__trigger').addEventListener('click', () => {
menu__toggle(menuNav, menuOverlay);
});
menuOverlay.addEventListener('click', () => {
pt_menu__toggle(menuNav, menuOverlay);
menu__toggle(menuNav, menuOverlay);
});
window.onresize = function () {
if (this.innerWidth >= 992) {
if (menuNav.classList.contains('active')) {
pt_menu__toggle(menuNav, menuOverlay);
menu__toggle(menuNav, menuOverlay);
setTimeout(() => {
pt_menu__reset(menu, menuNav);
menu__reset(menu, menuNav);
menuChildren = [];
}, 300);
}