// traffic_tabs.js - Handle query parameters for tab selection in traffic.html

document.addEventListener('DOMContentLoaded', function() {
    // Get all tab items
    const tabItems = document.querySelectorAll('.tab-item');
    
    // Function to activate a tab
    function activateTab(tabName) {
        // Find the tab item with the given tab name
        const tabItem = document.querySelector(`.tab-item[data-tab="${tabName}"]`);
        if (!tabItem) return;
        
        // Remove active class from all tab items
        tabItems.forEach(item => item.classList.remove('active'));
        
        // Add active class to the selected tab item
        tabItem.classList.add('active');
        
        // Get all tab panes
        const tabPanes = document.querySelectorAll('.tab-pane');
        
        // Remove active class from all tab panes
        tabPanes.forEach(pane => pane.classList.remove('active'));
        
        // Add active class to the corresponding tab pane
        document.getElementById(tabName + '-tab').classList.add('active');
        
        // Save active tab to localStorage
        localStorage.setItem('activeTab', tabName);
        
        // Update URL with query parameter
        const url = new URL(window.location.href);
        url.searchParams.set('tab', tabName);
        history.replaceState(null, '', url);
    }
    
    // Add click event listener to each tab item
    tabItems.forEach(tab => {
        tab.addEventListener('click', function() {
            // Get the tab name from data-tab attribute
            const tabName = this.getAttribute('data-tab');
            
            // Activate the tab
            activateTab(tabName);
        });
    });
    
    // Check for tab query parameter
    const urlParams = new URLSearchParams(window.location.search);
    const tabParam = urlParams.get('tab');
    
    if (tabParam) {
        // Activate the tab from query parameter
        activateTab(tabParam);
    } else {
        // Restore active tab from localStorage if no query parameter
        const activeTab = localStorage.getItem('activeTab');
        if (activeTab) {
            // Activate the tab from localStorage
            activateTab(activeTab);
        }
    }
});