https://pack4.ru/static/news/news.js

1document.addEventListener('DOMContentLoaded', function() {
2    const categoryButtons = document.querySelectorAll('.category-button');
3    const newsItems = document.querySelectorAll('.news-item');
4    const blogBreadcrumb = document.getElementById('blog-breadcrumb');
5    const categoryBreadcrumb = document.getElementById('category-breadcrumb');
6    const categoryName = document.getElementById('category-name');
7
8    categoryButtons.forEach(button => {
9        button.addEventListener('click', () => {
10            const category = button.dataset.category;
11
12            // Если у кнопки нет data-category (например, кнопка "Новости"), не выполняем фильтрацию
13            if (!category) {
14                return;
15            }
16
17            // Управление активным состоянием кнопок
18            categoryButtons.forEach(btn => btn.classList.remove('active'));
19            button.classList.add('active');
20
21            // Обновление хлебных крошек
22            if (category === 'all') {
23                // Если выбрано "Все", скрываем категорию и убираем ссылку с "Блог"
24                if (blogBreadcrumb) {
25                    blogBreadcrumb.innerHTML = 'Блог';
26                }
27                if (categoryBreadcrumb) {
28                    categoryBreadcrumb.style.display = 'none';
29                }
30            } else {
31                // Если выбрана конкретная категория, показываем её в крошках
32                if (blogBreadcrumb) {
33                    blogBreadcrumb.innerHTML = '<a href="/blog">Блог</a>';
34                }
35                if (categoryName) {
36                    categoryName.textContent = category;
37                }
38                if (categoryBreadcrumb) {
39                    categoryBreadcrumb.style.display = 'block';
40                }
41            }
42
43            // Фильтрация новостей
44            newsItems.forEach(item => {
45                const categories = item.dataset.categories.split(',');
46                if (category === 'all' || categories.includes(category)) {
47                    item.style.display = 'block';
48                } else {
49                    item.style.display = 'none';
50                }
51            });
52        });
53    });
54});