import { highlightElement } from 'https://unpkg.com/@speed-highlight/core@1.2.7/dist/index.js';

document.addEventListener('DOMContentLoaded', () => {
    // Initialize Syntax Highlighting
    initSyntaxHighlighting();
});

/**
 * Initialize syntax highlighting using Speed Highlight JS
 * This is a reusable function that applies syntax highlighting to code blocks
 */
async function initSyntaxHighlighting() {
    try {
        // Get all code blocks
        const codeBlocks = document.querySelectorAll('.code-example pre code');
        
        codeBlocks.forEach(block => {
            // Determine language from code-label
            let lang = 'html'; // Default to HTML
            const example = block.closest('.code-example');
            if (example) {
                const label = example.querySelector('.code-label');
                if (label) {
                    const labelText = label.textContent.trim().toLowerCase();
                    if (labelText === 'css') lang = 'css';
                    if (labelText === 'js' || labelText === 'javascript') lang = 'js';
                    if (labelText === 'go' || labelText === 'golang') lang = 'go';
                    if (labelText === 'json') lang = 'json';
                    if (labelText === 'http') lang = 'http';
                }
            }
            
            // Create a new element to hold the highlighted code
            const highlighted = document.createElement('div');
            highlighted.className = `shj-lang-${lang}`;
            highlighted.textContent = block.textContent;
            
            // Replace the pre with our new element
            const pre = block.parentElement;
            pre.parentNode.replaceChild(highlighted, pre);
            
            // Apply highlighting directly
            highlightElement(highlighted, lang);
        });
    } catch (error) {
        console.warn('Syntax highlighting failed to initialize:', error);
    }
}