// Control Main - Initialization and routing
const CATEGORIES = ['commands', 'file-transfer', 'batch', 'servers', 'workflows'];
const CATEGORY_NAMES = {
    'commands': 'Commands',
    'file-transfer': 'File Transfer',
    'batch': 'Batch Scripts',
    'servers': 'Servers',
    'workflows': 'Workflows'
};

let currentCategory = 'commands';
let currentTool = null;
let allToolSchemas = {};
let cachedRecipes = null; // Cache for recipes list
let cachedConversations = null; // Cache for conversations list

// Initialize on page load
async function init() {
    console.log('Initializing MCP Control Panel...');
    
    // Load all tool schemas
    await loadAllSchemas();
    
    // Initialize categories
    initializeCategories();
    
    // Load first category
    await loadCategory('commands');
    
    // Load server list for server selector
    await loadServers();
    
    // Check connection periodically
    checkConnection();
    
    console.log('Initialization complete');
}

// Load all tool schemas from JSON files
async function loadAllSchemas() {
    for (const category of CATEGORIES) {
        try {
            const response = await fetch(`/static/tool-schemas/${category}.json`);
            const data = await response.json();
            allToolSchemas[category] = data;
            console.log(`Loaded schema for ${category}:`, data.tools.length, 'tools');
        } catch (error) {
            console.error(`Failed to load schema for ${category}:`, error);
        }
    }
}

// Initialize category tabs
function initializeCategories() {
    const tabsContainer = document.getElementById('categoryTabs');
    
    CATEGORIES.forEach(category => {
        const tab = document.createElement('button');
        tab.className = 'category-tab';
        tab.dataset.category = category;
        tab.textContent = CATEGORY_NAMES[category];
        
        if (category === currentCategory) {
            tab.classList.add('active');
        }
        
        tab.addEventListener('click', () => switchCategory(category));
        tabsContainer.appendChild(tab);
    });
}

// Switch to different category
async function switchCategory(category) {
    if (category === currentCategory) return;
    
    currentCategory = category;
    
    // Update active tab
    document.querySelectorAll('.category-tab').forEach(tab => {
        if (tab.dataset.category === category) {
            tab.classList.add('active');
        } else {
            tab.classList.remove('active');
        }
    });
    
    // Load category tools
    await loadCategory(category);
}

// Load tools for category
async function loadCategory(category) {
    const schema = allToolSchemas[category];
    if (!schema) {
        console.error('No schema for category:', category);
        return;
    }
    
    // Populate tool dropdown
    const toolSelect = document.getElementById('toolSelect');
    toolSelect.innerHTML = '<option value="">Select a tool...</option>';
    
    schema.tools.forEach(tool => {
        const option = document.createElement('option');
        option.value = tool.name;
        option.textContent = tool.name;
        toolSelect.appendChild(option);
    });
    
    // Clear form
    document.getElementById('toolForm').innerHTML = '';
    document.getElementById('toolDescription').textContent = 'Select a tool to begin';
    
    // Reset current tool
    currentTool = null;
    
    // If switching to workflows, clear caches to force fresh load
    if (category === 'workflows') {
        cachedRecipes = null;
        cachedConversations = null;
        console.log('Switched to workflows - caches cleared');
    }
}

// Load recipes for workflows tab
async function loadRecipes() {
    if (cachedRecipes !== null) {
        console.log('Using cached recipes:', cachedRecipes.length);
        return cachedRecipes; // Return cached data
    }
    
    console.log('Loading recipes from server...');
    try {
        const response = await fetch('http://localhost:8081/execute_mcp_tool', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({
                tool: 'list_recipes',
                arguments: { limit: 200 }
            })
        });
        
        const data = await response.json();
        console.log('API Response:', data);
        
        // The execute_mcp_tool endpoint returns the parsed JSON directly:
        // {count: 1, recipes: [...]}
        // NOT wrapped in {success: true, result: {...}}
        
        if (data.recipes && Array.isArray(data.recipes)) {
            cachedRecipes = data.recipes;
            console.log('Loaded recipes:', cachedRecipes.length, 'recipes');
            return cachedRecipes;
        } else if (data.error) {
            console.error('API returned error:', data.error);
            cachedRecipes = [];
            return [];
        } else {
            console.error('Unexpected API response format:', data);
            cachedRecipes = [];
            return [];
        }
    } catch (error) {
        console.error('Error loading recipes:', error);
        cachedRecipes = []; // Cache empty array to prevent repeated failures
        return [];
    }
}

// Get cached recipes (for use in forms)
function getCachedRecipes() {
    console.log('getCachedRecipes called, cachedRecipes:', cachedRecipes);
    return cachedRecipes || [];
}

// Load conversations for workflows tab
async function loadConversations() {
    if (cachedConversations !== null) {
        console.log('Using cached conversations:', cachedConversations.length);
        return cachedConversations;
    }
    
    console.log('Loading conversations from server...');
    try {
        const response = await fetch('http://localhost:8081/execute_mcp_tool', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({
                tool: 'list_conversations',
                arguments: { limit: 200 }
            })
        });
        
        const data = await response.json();
        console.log('Conversations API Response:', data);
        
        if (data.conversations && Array.isArray(data.conversations)) {
            cachedConversations = data.conversations;
            console.log('Loaded conversations:', cachedConversations.length, 'conversations');
            return cachedConversations;
        } else if (data.error) {
            console.error('API returned error:', data.error);
            cachedConversations = [];
            return [];
        } else {
            console.error('Unexpected API response format:', data);
            cachedConversations = [];
            return [];
        }
    } catch (error) {
        console.error('Error loading conversations:', error);
        cachedConversations = [];
        return [];
    }
}

// Get cached conversations (for use in forms)
function getCachedConversations() {
    console.log('getCachedConversations called, cachedConversations:', cachedConversations);
    return cachedConversations || [];
}

// Load session commands for command_select fields
async function loadSessionCommands() {
    console.log('Loading session commands...');
    try {
        const response = await fetch('http://localhost:8081/execute_mcp_tool', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({
                tool: 'list_session_commands',
                arguments: {}
            })
        });
        
        const data = await response.json();
        console.log('Session Commands API Response:', data);
        
        if (data.commands && Array.isArray(data.commands)) {
            console.log('Loaded session commands:', data.commands.length, 'commands');
            return data.commands;
        } else if (data.error) {
            console.error('API returned error:', data.error);
            return [];
        } else {
            console.error('Unexpected API response format:', data);
            return [];
        }
    } catch (error) {
        console.error('Error loading session commands:', error);
        return [];
    }
}

// Get session commands (non-cached, always fresh)
async function getSessionCommands() {
    return await loadSessionCommands();
}



// Load batch scripts for script_select fields
async function loadBatchScripts() {
    console.log('Loading batch scripts...');
    try {
        const response = await fetch('http://localhost:8081/execute_mcp_tool', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({
                tool: 'list_batch_scripts',
                arguments: { limit: 200 }
            })
        });
        
        const data = await response.json();
        console.log('Batch Scripts API Response:', data);
        
        const scripts = [];
        
        // Extract text from wrapped response
        const text = data.result || data;
        
        if (typeof text === 'string') {
            const lines = text.split('\n');
            let currentScript = null;
            
            for (const line of lines) {
                if (line.startsWith('ID: ')) {
                    if (currentScript) scripts.push(currentScript);
                    currentScript = { id: parseInt(line.substring(4)) };
                } else if (currentScript && line.trim().startsWith('Description: ')) {
                    currentScript.description = line.trim().substring(13);
                }
            }
            if (currentScript) scripts.push(currentScript);
            
            console.log('Parsed batch scripts:', scripts.length, 'scripts');
        }
        // ADD THIS LINE: Sort numerically by ID
        scripts.sort((a, b) => a.id - b.id);
        return scripts;
    } catch (error) {
        console.error('Error loading batch scripts:', error);
        return [];
    }
}


async function getBatchScripts() {
    return await loadBatchScripts();
}


// Handle tool selection
async function handleToolSelection() {
    const toolName = document.getElementById('toolSelect').value;
    
    if (!toolName) {
        document.getElementById('toolForm').innerHTML = '';
        document.getElementById('toolDescription').textContent = 'Select a tool to begin';
        currentTool = null;
        return;
    }
    
    // Find tool in current category
    const schema = allToolSchemas[currentCategory];
    const tool = schema.tools.find(t => t.name === toolName);
    
    if (!tool) {
        console.error('Tool not found:', toolName);
        return;
    }
    
    currentTool = tool;
    
    // Update description
    document.getElementById('toolDescription').textContent = tool.description;
    
    // If in workflows category AND tool uses recipe_select or conversation_select, load them first
    const needsRecipes = tool.arguments && tool.arguments.some(arg => arg.type === 'recipe_select');
    const needsConversations = tool.arguments && tool.arguments.some(arg => arg.type === 'conversation_select');
    const needsCommands = tool.arguments && tool.arguments.some(arg => arg.type === 'command_select');
    
    if (currentCategory === 'workflows' && needsRecipes) {
        console.log('Tool needs recipes, loading...');
        await loadRecipes();
        console.log('Recipes loaded, generating form');
    }
    
    if (currentCategory === 'workflows' && needsConversations) {
        console.log('Tool needs conversations, loading...');
        await loadConversations();
        console.log('Conversations loaded, generating form');
    }
    
    // Commands tab - load session commands if needed
    if (currentCategory === 'commands' && needsCommands) {
        console.log('Tool needs session commands, loading...');
        // Will be loaded fresh in createCommandSelectField
    }
    
    // Batch Scripts tab - load scripts if needed
    const needsScripts = tool.arguments && tool.arguments.some(arg => arg.type === 'script_select');
    if (currentCategory === 'batch' && needsScripts) {
        console.log('Tool needs batch scripts, loading...');
        // Will be loaded fresh in createScriptSelectField
    }

    // Generate form
    generateForm(tool);
}

// Load servers for server selector
async function loadServers() {
    try {
        const response = await fetch('http://localhost:8081/api/list_servers');
        const data = await response.json();
        const servers = data.servers || [];
        
        const select = document.getElementById('serverSelect');
        select.innerHTML = '';
        
        if (servers.length === 0) {
            select.innerHTML = '<option value="">No servers configured</option>';
            return;
        }
        
        servers.forEach(srv => {
            const option = document.createElement('option');
            option.value = srv.name;
            option.textContent = `${srv.name} (${srv.user}@${srv.host}:${srv.port})${srv.is_current ? ' [CURRENT]' : ''}`;
            if (srv.is_current) {
                option.selected = true;
            }
            select.appendChild(option);
        });
    } catch (error) {
        console.error('Failed to load servers:', error);
    }
}


// Check connection status
async function checkConnection() {
    try {
        const response = await fetch('http://localhost:8081/api/connection_info');
        const data = await response.json();
        
        // Build info display
        let infoHtml = `<div style="color: #888;">${data.connection}</div>`;
        
        if (data.machine_id) {
            infoHtml += `<div class="info-line"><strong>Machine ID:</strong> ${data.machine_id}</div>`;
        }
        
        if (data.hostname) {
            infoHtml += `<div class="info-line"><strong>Hostname:</strong> ${data.hostname}</div>`;
        }
        
        document.getElementById('serverInfo').innerHTML = infoHtml;
        
        // Update status badge using explicit 'connected' field from backend
        const statusEl = document.getElementById('connectionStatus');
        if (data.connected === true) {
            statusEl.textContent = 'Connected';
            statusEl.className = 'status connected';
        } else {
            statusEl.textContent = 'Disconnected';
            statusEl.className = 'status disconnected';
        }
    } catch (error) {
        console.error('Connection check failed:', error);
        // Set disconnected on error
        const statusEl = document.getElementById('connectionStatus');
        statusEl.textContent = 'Disconnected';
        statusEl.className = 'status disconnected';
    }
}


// Switch server
async function switchServer() {
    const select = document.getElementById('serverSelect');
    const serverName = select.value;
    
    if (!serverName) {
        alert('Please select a server');
        return;
    }
    
    const btn = event.target;
    btn.disabled = true;
    btn.textContent = '⏳ Switching...';
    
    try {
        const response = await fetch('http://localhost:8081/api/select_server', {
            method: 'POST',
            headers: { 'Content-Type': 'application/json' },
            body: JSON.stringify({ identifier: serverName })
        });
        
        const result = await response.json();
        
        if (result.success) {
            alert(`Successfully switched to ${serverName}\n\nMachine ID: ${result.server_info.machine_id}\nHostname: ${result.server_info.hostname || 'N/A'}`);
            await loadServers();
            await checkConnection();
        } else {
            alert(`Failed to switch server:\n${result.error}`);
        }
    } catch (error) {
        alert(`Error switching server:\n${error.toString()}`);
    } finally {
        btn.disabled = false;
        btn.textContent = '🔄 Switch';
    }
}

// Export for global access
window.controlMain = {
    init,
    handleToolSelection,
    switchServer,
    getCachedRecipes,
    getCachedConversations,
    getSessionCommands,
    getBatchScripts
};