SteelBase/public/js/ui/navigation.js

/**
 * Navigation System
 * Handles section switching and sidebar management
 */

import { appState, updateState } from '../core/state.js';
import { loadSection, showLoading, showError } from './section-loader.js';

/**
 * Show a section
 * @param {string} sectionId - Section identifier
 */
export async function showSection(sectionId) {
    console.log(`🔄 Navegando para: ${sectionId}`);
    
    // Update state
    updateState('currentSection', sectionId);
    
    // Update sidebar active state
    updateSidebarActive(sectionId);
    
    // Show loading
    showLoading();
    
    try {
        // Load section content
        const content = await loadSection(sectionId);
        
        // Inject content
        const mainContent = document.getElementById('main-content');
        if (mainContent) {
            mainContent.innerHTML = content;
        }
        
        // Add help button after content loads
        setTimeout(() => {
            if (typeof window.addHelpButton === 'function') {
                // For sections with tabs, show help for first tab
                if (sectionId === 'preaquecimento') {
                    window.addHelpButton('preaquecimento');
                } else if (sectionId === 'parafusos') {
                    window.addHelpButton('parafusos-cisalhamento');
                } else {
                    window.addHelpButton(sectionId);
                }
            }
        }, 100);
        
        // Scroll to top
        window.scrollTo({ top: 0, behavior: 'smooth' });
        
        console.log(`✅ Seção ${sectionId} exibida`);
        
    } catch (error) {
        console.error(`❌ Erro ao exibir seção ${sectionId}:`, error);
        showError('Erro ao carregar seção. Tente novamente.');
    }
}

/**
 * Update sidebar active state
 * @param {string} sectionId - Active section ID
 */
function updateSidebarActive(sectionId) {
    document.querySelectorAll('.sidebar-item').forEach(item => {
        const isActive = item.dataset.section === sectionId;
        item.classList.toggle('active', isActive);
    });
}

/**
 * Switch sidebar tab
 * @param {number} tabIndex - Tab index
 */
export function switchSidebarTab(tabIndex) {
    console.log(`🔄 Mudando para aba: ${tabIndex}`);
    
    // Update state
    updateState('currentSidebarTab', tabIndex);
    
    // Update tab buttons
    document.querySelectorAll('.sidebar-tab').forEach((tab, i) => {
        tab.classList.toggle('active', i === tabIndex);
    });
    
    // Update tab content
    document.querySelectorAll('.sidebar-content').forEach((content, i) => {
        content.classList.toggle('active', i === tabIndex);
    });
}

/**
 * Switch tab within a section
 * @param {number} tabIndex - Tab index
 */
export function switchTab(tabIndex) {
    document.querySelectorAll('.tab-btn').forEach((btn, i) => {
        btn.classList.toggle('active', i === tabIndex);
    });
    document.querySelectorAll('.tab-content').forEach((content, i) => {
        content.classList.toggle('active', i === tabIndex);
    });
    
    // Update help button for the active tab (for parafusos section)
    const tabIds = ['parafusos-cisalhamento', 'parafusos-esmagamento', 'parafusos-bloco', 'layout', 'parafuso-vs-solda'];
    if (tabIds[tabIndex] && typeof window.addHelpButton === 'function') {
        window.addHelpButton(tabIds[tabIndex]);
    }
}

/**
 * Switch welding tab
 * @param {number} index - Tab index
 */
export function switchWeldTab(index) {
    document.querySelectorAll('.tabs-nav .tab-btn').forEach((btn, i) => {
        if (btn.textContent.includes('Pré-Aquecimento') || btn.textContent.includes('Filete') || 
            btn.textContent.includes('Energia') || btn.textContent.includes('Consumo') ||
            btn.textContent.includes('Sequência') || btn.textContent.includes('Padrões')) {
            btn.classList.toggle('active', i === index);
        }
    });
    
    for (let i = 0; i < 6; i++) {
        const tab = document.getElementById(`weld-tab-${i}`);
        if (tab) {
            tab.classList.toggle('active', i === index);
        }
    }
    
    // Update help button for the active tab
    const tabIds = ['preaquecimento', 'filete', 'energia', 'consumo-eletrodo', 'sequencia-soldagem', 'padroes-soldagem'];
    if (typeof window.addHelpButton === 'function') {
        window.addHelpButton(tabIds[index]);
    }
}

/**
 * Navigate to a specific tool/tab (used by global search)
 * @param {string} toolId - Tool identifier
 * @param {number|null} tabIndex - Optional tab index
 */
export async function navegarParaFerramenta(toolId, tabIndex) {
    // Close search modal if open
    if (typeof window.closeGlobalSearchModal === 'function') {
        window.closeGlobalSearchModal();
    }
    
    // Determine which section to show
    let sectionId = toolId;
    
    // Handle tabs within sections
    if (toolId.startsWith('parafusos-')) {
        sectionId = 'parafusos';
    } else if (['filete', 'energia', 'consumo-eletrodo', 'sequencia-soldagem', 'padroes-soldagem'].includes(toolId)) {
        sectionId = 'preaquecimento';
    }
    
    // Show the section
    await showSection(sectionId);
    
    // Switch to specific tab if needed
    setTimeout(() => {
        if (tabIndex !== null && tabIndex !== undefined) {
            if (sectionId === 'parafusos') {
                switchTab(tabIndex);
            } else if (sectionId === 'preaquecimento') {
                switchWeldTab(tabIndex);
            }
        }
        
        // Scroll to top
        window.scrollTo({ top: 0, behavior: 'smooth' });
    }, 200);
}

// Export to global scope for compatibility
if (typeof window !== 'undefined') {
    window.showSection = showSection;
    window.switchSidebarTab = switchSidebarTab;
    window.switchTab = switchTab;
    window.switchWeldTab = switchWeldTab;
    window.navegarParaFerramenta = navegarParaFerramenta;
}