"""
Browser Use REST API Server
Простой HTTP API для управления браузером из n8n
"""
import os
import asyncio
from typing import Optional
from fastapi import FastAPI, HTTPException
from pydantic import BaseModel
from browser_use import Agent, Browser, ChatOpenAI
from browser_use.agent.views import AgentHistoryList
from browser_use.browser.context import BrowserContextConfig, BrowserConfig
import uvicorn
from fastapi.responses import HTMLResponse

# Настройки Remote Debugging
REMOTE_DEBUGGING_PORT = int(os.getenv("REMOTE_DEBUGGING_PORT", "9222"))
REMOTE_DEBUGGING_ENABLED = os.getenv("REMOTE_DEBUGGING_ENABLED", "false").lower() == "true"

app = FastAPI(title="Browser Use API", version="1.0.0")

# Модели запросов
class TaskRequest(BaseModel):
    task: str
    max_steps: Optional[int] = 20
    model: Optional[str] = DEFAULT_MODEL

class TaskResponse(BaseModel):
    task_id: str
    status: str
    result: Optional[str] = None
    error: Optional[str] = None

# Хранилище задач
tasks = {}

@app.post("/api/tasks", response_model=TaskResponse)
async def create_task(request: TaskRequest):
    """Создать новую задачу браузера"""
    import uuid
    task_id = str(uuid.uuid4())[:8]
    
    tasks[task_id] = {
        "status": "pending",
        "task": request.task,
        "result": None
    }
    
    # Запускаем задачу в фоне
    asyncio.create_task(run_browser_task(task_id, request.task, request.max_steps, request.model))
    
    return TaskResponse(
        task_id=task_id,
        status="pending"
    )

async def run_browser_task(task_id: str, task: str, max_steps: int, model: str):
    """Выполнение задачи браузера"""
    browser = None
    try:
        tasks[task_id]["status"] = "running"
        
        # Настройка LLM через OpenRouter
        api_key = os.getenv("OPENROUTER_API_KEY", "")
        if not api_key:
            raise ValueError("OPENROUTER_API_KEY not set")
        
        # Используем ChatOpenAI с base_url для OpenRouter
        llm = ChatOpenAI(
            model=model,
            base_url="https://openrouter.ai/api/v1",
            api_key=api_key
        )
        
        # Настройки браузера
        browser_config = BrowserConfig(
            user_data_dir="/app/browser-data",
            profile_directory="Default",
            headless=True,
        )
        
        # Добавляем remote debugging если включено
        if REMOTE_DEBUGGING_ENABLED:
            browser_config.extra_chromium_args = [
                f"--remote-debugging-port={REMOTE_DEBUGGING_PORT}",
                "--remote-debugging-address=0.0.0.0"
            ]
        
        browser = Browser(config=browser_config)
        
        # Создание агента
        agent = Agent(
            task=task,
            llm=llm,
            browser=browser,
        )
        
        # Выполнение задачи
        history: AgentHistoryList = await agent.run(max_steps=max_steps)
        
        # Получение результата
        result = history.final_result()
        
        tasks[task_id]["status"] = "completed"
        tasks[task_id]["result"] = result
        
    except Exception as e:
        tasks[task_id]["status"] = "failed"
        tasks[task_id]["error"] = str(e)
    finally:
        # Закрытие браузера (правильный способ)
        if browser:
            try:
                # browser_use сам управляет закрытием
                pass
            except:
                pass

@app.get("/api/tasks/{task_id}", response_model=TaskResponse)
async def get_task(task_id: str):
    """Получить статус/результат задачи"""
    if task_id not in tasks:
        raise HTTPException(status_code=404, detail="Task not found")
    
    task = tasks[task_id]
    return TaskResponse(
        task_id=task_id,
        status=task["status"],
        result=task.get("result"),
        error=task.get("error")
    )

@app.get("/api/tasks")
async def list_tasks():
    """Получить список всех задач"""
    return {
        "tasks": [
            {
                "task_id": task_id,
                "status": task["status"],
                "task": task.get("task", ""),
                "result": task.get("result"),
                "error": task.get("error")
            }
            for task_id, task in tasks.items()
        ]
    }

@app.get("/api/health")
async def health_check():
    """Проверка здоровья сервера"""
    return {
        "status": "healthy",
        "service": "browser-use-api",
        "version": "1.0.0"
    }

# Web UI - Главная страница
WEB_UI_HTML = """
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Browser Use API</title>
    <style>
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; max-width: 800px; margin: 50px auto; padding: 20px; }
        h1 { color: #333; }
        .card { border: 1px solid #ddd; border-radius: 8px; padding: 20px; margin: 20px 0; }
        .btn { background: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; text-decoration: none; display: inline-block; }
        .btn:hover { background: #0056b3; }
        code { background: #f4f4f4; padding: 2px 6px; border-radius: 3px; }
        pre { background: #f4f4f4; padding: 15px; border-radius: 5px; overflow-x: auto; }
    </style>
</head>
<body>
    <h1>Browser Use API</h1>
    <p>REST API для автоматизации браузера с помощью AI</p>
    
    <div class="card">
        <h2>Быстрые ссылки</h2>
        <p><a href="/dashboard" class="btn">Открыть Dashboard</a></p>
    </div>
    
    <div class="card">
        <h2>API Endpoints</h2>
        <ul>
            <li><code>POST /api/tasks</code> - Создать задачу</li>
            <li><code>GET /api/tasks/{task_id}</code> - Получить результат</li>
            <li><code>GET /api/health</code> - Проверка здоровья</li>
        </ul>
    </div>
    
    <div class="card">
        <h2>Пример использования</h2>
        <pre>curl -X POST http://localhost:8383/api/tasks \\
  -H "Content-Type: application/json" \\
  -d '{"task": "Перейди на example.com", "max_steps": 20}'</pre>
    </div>
</body>
</html>
"""

DASHBOARD_HTML = """
<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Browser Use Dashboard</title>
    <style>
        * { box-sizing: border-box; }
        body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif; margin: 0; padding: 20px; background: #f5f5f5; }
        .container { max-width: 1200px; margin: 0 auto; }
        h1 { color: #333; }
        .card { background: white; border-radius: 8px; padding: 20px; margin-bottom: 20px; box-shadow: 0 2px 4px rgba(0,0,0,0.1); }
        .task-form { display: flex; gap: 10px; flex-wrap: wrap; }
        input, select { padding: 10px; border: 1px solid #ddd; border-radius: 4px; font-size: 14px; }
        input[type="text"] { flex: 1; min-width: 200px; }
        input[type="number"] { width: 100px; }
        button { background: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 4px; cursor: pointer; font-size: 14px; }
        button:hover { background: #0056b3; }
        .task-list { list-style: none; padding: 0; }
        .task-item { border: 1px solid #eee; padding: 15px; margin: 10px 0; border-radius: 4px; }
        .status-pending { border-left: 4px solid #ffc107; }
        .status-running { border-left: 4px solid #17a2b8; }
        .status-completed { border-left: 4px solid #28a745; }
        .status-failed { border-left: 4px solid #dc3545; }
        .badge { display: inline-block; padding: 4px 8px; border-radius: 3px; font-size: 12px; background: #eee; }
        .result { background: #f8f9fa; padding: 10px; border-radius: 4px; margin-top: 10px; white-space: pre-wrap; }
        .nav { margin-bottom: 20px; }
        .nav a { color: #007bff; text-decoration: none; }
    </style>
</head>
<body>
    <div class="container">
        <div class="nav"><a href="/">&larr; На главную</a></div>
        <h1>Browser Use Dashboard</h1>
        
        <div class="card">
            <h2>Создать задачу</h2>
            <form class="task-form" id="taskForm">
                <input type="text" id="taskInput" placeholder="Описание задачи (например: Перейди на example.com)" required>
                <input type="number" id="maxSteps" value="20" min="1" max="100" placeholder="Шаги">
                <select id="modelSelect">
                    <option value="arcee-ai/trinity-large-preview:free">arcee-ai/trinity-large-preview:free</option>
                    <option value="openai/gpt-4o-mini">openai/gpt-4o-mini</option>
                    <option value="google/gemini-2.0-flash-001">google/gemini-2.0-flash-001</option>
                </select>
                <button type="submit">Запустить</button>
            </form>
        </div>
        
        <div class="card">
            <h2>Задачи</h2>
            <button onclick="refreshTasks()">Обновить</button>
            <ul class="task-list" id="taskList"></ul>
        </div>
    </div>
    
    <script>
        let pollInterval;
        
        document.getElementById('taskForm').addEventListener('submit', async (e) => {
            e.preventDefault();
            const task = document.getElementById('taskInput').value;
            const max_steps = parseInt(document.getElementById('maxSteps').value);
            const model = document.getElementById('modelSelect').value;
            
            const response = await fetch('/api/tasks', {
                method: 'POST',
                headers: {'Content-Type': 'application/json'},
                body: JSON.stringify({task, max_steps, model})
            });
            const data = await response.json();
            alert('Задача создана! ID: ' + data.task_id);
            refreshTasks();
        });
        
        async function refreshTasks() {
            try {
                const res = await fetch('/api/tasks');
                const data = await res.json();
                const list = document.getElementById('taskList');
                list.innerHTML = '';
                
                const taskList = data.tasks || [];
                if (taskList.length === 0) {
                    list.innerHTML = '<li>Нет задач. Создайте первую задачу!</li>';
                    return;
                }
                
                for (const task of taskList) {
                    const li = document.createElement('li');
                    li.className = 'task-item status-' + task.status;
                    li.innerHTML = `
                        <strong>Task ID:</strong> ${task.task_id}<br>
                        <strong>Задача:</strong> ${task.task || 'N/A'}<br>
                        <span class="badge">${task.status}</span><br>
                        <strong>Результат:</strong>
                        <div class="result">${task.result || task.error || 'Ожидание...'}</div>
                    `;
                    list.appendChild(li);
                }
            } catch (e) {
                console.error(e);
            }
        }
        
        refreshTasks();
        setInterval(refreshTasks, 5000);
    </script>
</body>
</html>
"""

@app.get("/", response_class=HTMLResponse)
async def root():
    """Главная страница"""
    return HTMLResponse(content=WEB_UI_HTML)

@app.get("/dashboard", response_class=HTMLResponse)
async def dashboard():
    """Dashboard"""
    return HTMLResponse(content=DASHBOARD_HTML)

if __name__ == "__main__":
    uvicorn.run(app, host="0.0.0.0", port=8383)