teto_ai/views/index.ejs
Mikolaj Wojciech Gorski 44b45b7212 Major refactor: Transform into AI-powered Kasane Teto companion bot
🎭 Core Transformation:
- Reframe project as AI companion bot with Kasane Teto personality
- Focus on natural conversation, multimodal interaction, and character roleplay
- Position video recording as one tool in AI toolkit rather than main feature

🏗️ Architecture Improvements:
- Refactor messageCreate.js into modular command system (35 lines vs 310+)
- Create dedicated videoRecording service with clean API
- Implement commandHandler for extensible command routing
- Add centralized configuration system (videoConfig.js)
- Separate concerns: events, services, config, documentation

📚 Documentation Overhaul:
- Consolidate scattered READMEs into organized docs/ directory
- Create comprehensive documentation covering:
  * AI architecture and capabilities
  * Natural interaction patterns and personality
  * Setup guides for AI services and Docker deployment
  * Commands reference focused on conversational AI
  * Troubleshooting and development guidelines
- Transform root README into compelling AI companion overview

🤖 AI-Ready Foundation:
- Document integration points for:
  * Language models (GPT-4/Claude) for conversation
  * Vision models (GPT-4V/CLIP) for image analysis
  * Voice synthesis (ElevenLabs) for speaking
  * Memory systems for conversation continuity
  * Personality engine for character consistency

🔧 Technical Updates:
- Integrate custom discord.js-selfbot-v13 submodule with enhanced functionality
- Update package.json dependencies for AI and multimedia capabilities
- Maintain Docker containerization with improved architecture
- Add development and testing infrastructure

📖 New Documentation Structure:
docs/
├── README.md (documentation hub)
├── setup.md (installation & AI configuration)
├── interactions.md (how to chat with Teto)
├── ai-architecture.md (technical AI systems overview)
├── commands.md (natural language interactions)
├── personality.md (character understanding)
├── development.md (contributing guidelines)
├── troubleshooting.md (problem solving)
└── [additional specialized guides]

 This update transforms the project from a simple recording bot into a foundation for an engaging AI companion that can naturally interact through text, voice, and visual content while maintaining authentic Kasane Teto personality traits.
2025-07-26 13:08:47 +02:00

115 lines
6.3 KiB
Text

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Kasane Teto - Neural Dashboard</title>
<link rel="stylesheet" href="/style.css">
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
<script src="socket_logic.js"></script>
</head>
<body>
<div class="container">
<header>
<div class="logo">
<div class="logo-icon">04</div>
<div>
<h1>Kasane Teto - Neural Dashboard</h1>
<p class="subtitle"><span class="status-dot"></span> What are you looking at, baka?! Just kidding, welcome!</p>
</div>
</div>
<div class="user-info">
<span>User: <%= user.username %>#<%= user.discriminator %></span>
<a href="/logout" class="logout-btn">Logout</a>
</div>
</header>
<nav>
<a href="#" class="nav-item active">Overview</a>
<a href="#" class="nav-item">Memory Explorer</a>
<a href="#" class="nav-item">Server Analytics</a>
<a href="#" class="nav-item">Archives</a>
<a href="#" class="nav-item">My Profile</a>
</nav>
<main>
<div class="widget-grid">
<div class="widget large-widget">
<h3>Live Neural Activity <span class="processing-dot">●</span> Processing...</h3>
<div class="log-box" id="activity-log">
<% activityLog.forEach(log => { %>
<p><%- log.message.replace(/(\[[^\]]+\])/, '<span class="timestamp">$1</span>') %></p>
<% }) %>
</div>
</div>
<div class="widget">
<h3>Recent Actions <span class="timeframe">12 in last hour</span></h3>
<div class="actions-box">
<% let i = 0; %>
<% actionsLog.forEach(action => { %>
<% const time = i === 0 ? '5 min ago' : i === 1 ? '12 min ago' : '30 min ago'; i++; %>
<div class="action-item">
<div class="action-details">
<span><%= action.message %> <span class="channel"><%= action.channel %></span></span>
<span class="action-time"><%= time %></span>
</div>
<span class="action-icon"><%= action.icon %></span>
</div>
<% }) %>
</div>
</div>
<div class="widget">
<h3>System Resources <span class="status-online">●</span> Online</h3>
<div class="resource-box">
<div class="metric">
<div class="metric-header">
<span><strong><%= systemResources.memory.percentage %>%</strong></span>
<span class="metric-label">Memory Usage</span>
</div>
<div class="progress-bar-container">
<div class="progress-bar memory" style="width: <%= systemResources.memory.percentage %>%;"></div>
</div>
<span class="metric-details">RAM: <%= systemResources.memory.used %>GB / <%= systemResources.memory.total %>GB</span>
</div>
<div class="metric">
<div class="metric-header">
<span><strong><%= systemResources.vram.percentage %>%</strong></span>
<span class="metric-label">VRAM Usage</span>
</div>
<div class="progress-bar-container">
<div class="progress-bar vram" style="width: <%= systemResources.vram.percentage %>%;"></div>
</div>
<span class="metric-details">VRAM: <%= systemResources.vram.used %>GB / <%= systemResources.vram.total %>GB</span>
</div>
<div class="metric response-times">
<div class="metric-header">
<span><strong><%= systemResources.avgResponse %>ms</strong></span>
<span class="metric-label">Average Response</span>
</div>
<div class="response-bar"><span>Input Processing</span> <div class="bar-container"><div class="bar" style="width: 20%;"></div></div> <span>4ms</span></div>
<div class="response-bar"><span>Memory Retrieval</span> <div class="bar-container"><div class="bar" style="width: 60%;"></div></div> <span>12ms</span></div>
<div class="response-bar"><span>Neural Processing</span> <div class="bar-container"><div class="bar" style="width: 60%;"></div></div> <span>12ms</span></div>
<div class="response-bar"><span>Response Generation</span> <div class="bar-container"><div class="bar" style="width: 20%;"></div></div> <span>4ms</span></div>
</div>
<div class="metric shutdown-metric">
<div class="metric-header">
<span><strong><%= systemResources.shutdown %></strong></span>
<span class="metric-label">Until Shutdown</span>
</div>
<div class="progress-bar-container">
<div class="progress-bar shutdown" style="width: 80%;"></div>
</div>
<span class="metric-details">Session ends: <%= systemResources.sessionEnd %></span>
</div>
<div class="maintenance">
<span>&#9888;</span> Planned maintenance cycle
</div>
</div>
</div>
</div>
</main>
</div>
</body>
</html>