- Project infrastructure: go.mod, Makefile, .gitignore, README - Configuration system with YAML parsing and env overrides - Structured logging with slog - AI provider interface with Ollama, OpenAI, Anthropic implementations - Provider manager with runtime switching - Agent orchestrator with ReAct loop (reason-act-observe) - Tool registry with JSON Schema descriptions - Terminal tool: shell command execution with safety controls - Filesystem tools: read, write, list with path access control - Conversation memory with session management - Web UI server with WebSocket streaming - Modern dark theme UI with glassmorphism, animations - Frontend: WebSocket client, markdown rendering, tool call display
128 lines
6 KiB
HTML
128 lines
6 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="ru">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>ZovOS AI — AI Assistant</title>
|
||
<meta name="description" content="ZovOS AI — AI-ассистент для Linux с управлением компьютером, браузером и терминалом">
|
||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=JetBrains+Mono:wght@400;500&display=swap" rel="stylesheet">
|
||
<link rel="stylesheet" href="static/style.css">
|
||
</head>
|
||
<body>
|
||
<div class="app">
|
||
<!-- Sidebar -->
|
||
<aside class="sidebar" id="sidebar">
|
||
<div class="sidebar-header">
|
||
<div class="logo">
|
||
<div class="logo-icon">
|
||
<svg width="28" height="28" viewBox="0 0 28 28" fill="none">
|
||
<circle cx="14" cy="14" r="12" stroke="url(#grad)" stroke-width="2.5"/>
|
||
<circle cx="14" cy="14" r="5" fill="url(#grad)"/>
|
||
<defs>
|
||
<linearGradient id="grad" x1="0" y1="0" x2="28" y2="28">
|
||
<stop offset="0%" stop-color="#6C5CE7"/>
|
||
<stop offset="100%" stop-color="#00D2FF"/>
|
||
</linearGradient>
|
||
</defs>
|
||
</svg>
|
||
</div>
|
||
<span class="logo-text">ZovOS AI</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sidebar-section">
|
||
<label class="section-label">Провайдер</label>
|
||
<div class="provider-select-wrapper">
|
||
<select id="providerSelect" class="provider-select">
|
||
<option value="ollama">🦙 Ollama (Локальный)</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="sidebar-section">
|
||
<button class="btn btn-new-chat" id="btnNewChat">
|
||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none">
|
||
<path d="M8 3v10M3 8h10" stroke="currentColor" stroke-width="2" stroke-linecap="round"/>
|
||
</svg>
|
||
Новый чат
|
||
</button>
|
||
</div>
|
||
|
||
<div class="sidebar-footer">
|
||
<div class="status-indicator" id="statusIndicator">
|
||
<div class="status-dot"></div>
|
||
<span>Готов</span>
|
||
</div>
|
||
</div>
|
||
</aside>
|
||
|
||
<!-- Main Content -->
|
||
<main class="main">
|
||
<div class="chat-container" id="chatContainer">
|
||
<!-- Welcome screen -->
|
||
<div class="welcome" id="welcomeScreen">
|
||
<div class="welcome-icon">
|
||
<svg width="64" height="64" viewBox="0 0 64 64" fill="none">
|
||
<circle cx="32" cy="32" r="28" stroke="url(#grad2)" stroke-width="3"/>
|
||
<circle cx="32" cy="32" r="12" fill="url(#grad2)" opacity="0.8"/>
|
||
<circle cx="32" cy="32" r="4" fill="#fff"/>
|
||
<defs>
|
||
<linearGradient id="grad2" x1="0" y1="0" x2="64" y2="64">
|
||
<stop offset="0%" stop-color="#6C5CE7"/>
|
||
<stop offset="50%" stop-color="#00D2FF"/>
|
||
<stop offset="100%" stop-color="#0ABDE3"/>
|
||
</linearGradient>
|
||
</defs>
|
||
</svg>
|
||
</div>
|
||
<h1 class="welcome-title">ZovOS AI</h1>
|
||
<p class="welcome-subtitle">AI-ассистент для управления Linux</p>
|
||
<div class="welcome-features">
|
||
<div class="feature-card">
|
||
<span class="feature-icon">🖥️</span>
|
||
<span>Терминал</span>
|
||
</div>
|
||
<div class="feature-card">
|
||
<span class="feature-icon">🌐</span>
|
||
<span>Браузер</span>
|
||
</div>
|
||
<div class="feature-card">
|
||
<span class="feature-icon">🖱️</span>
|
||
<span>Рабочий стол</span>
|
||
</div>
|
||
<div class="feature-card">
|
||
<span class="feature-icon">📁</span>
|
||
<span>Файлы</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Messages will be inserted here -->
|
||
<div class="messages" id="messages"></div>
|
||
</div>
|
||
|
||
<!-- Input area -->
|
||
<div class="input-area">
|
||
<div class="input-wrapper">
|
||
<textarea
|
||
id="messageInput"
|
||
class="message-input"
|
||
placeholder="Напишите сообщение..."
|
||
rows="1"
|
||
></textarea>
|
||
<button class="btn-send" id="btnSend" title="Отправить (Enter)">
|
||
<svg width="20" height="20" viewBox="0 0 20 20" fill="none">
|
||
<path d="M3 10l14-7-4 7 4 7-14-7z" fill="currentColor"/>
|
||
</svg>
|
||
</button>
|
||
</div>
|
||
<div class="input-hint">Enter — отправить, Shift+Enter — новая строка</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
|
||
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
||
<script src="static/app.js"></script>
|
||
</body>
|
||
</html>
|