36551-vm/chat.php
2025-12-01 16:18:35 +00:00

111 lines
4.1 KiB
PHP

<?php
session_start();
require_once __DIR__ . '/ai/LocalAIApi.php';
$aiReply = '';
$userMessage = '';
if (!isset($_SESSION['chat_history'])) {
$_SESSION['chat_history'] = [];
}
if ($_SERVER['REQUEST_METHOD'] === 'POST' && isset($_POST['message'])) {
$userMessage = trim($_POST['message']);
if (!empty($userMessage)) {
$_SESSION['chat_history'][] = ['user' => $userMessage];
$conversation = [];
foreach ($_SESSION['chat_history'] as $entry) {
if (isset($entry['user'])) {
$conversation[] = ['role' => 'user', 'content' => $entry['user']];
}
if (isset($entry['ai'])) {
$conversation[] = ['role' => 'assistant', 'content' => $entry['ai']];
}
}
$resp = LocalAIApi::createResponse(
[
'input' => $conversation,
]
);
if (!empty($resp['success'])) {
$text = LocalAIApi::extractText($resp);
if ($text === '') {
$decoded = LocalAIApi::decodeJsonFromResponse($resp);
$aiReply = $decoded ? json_encode($decoded, JSON_UNESCAPED_UNICODE) : (string)($resp['data'] ?? '');
} else {
$aiReply = $text;
}
$_SESSION['chat_history'][] = ['ai' => $aiReply];
} else {
$aiReply = 'Error: Could not get a response from the AI.';
error_log('AI error: ' . ($resp['error'] ?? 'unknown'));
$_SESSION['chat_history'][] = ['ai' => $aiReply];
}
}
}
?>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>AI Chat</title>
<link href="https://fonts.googleapis.com/css2?family=Lora:wght@400;700&family=Nunito:wght@400;700&display=swap" rel="stylesheet">
<script src="https://cdn.tailwindcss.com"></script>
<style>
body {
font-family: 'Nunito', sans-serif;
background-color: #FFFBEB;
color: #374151;
}
h1, h2, h3, h4, h5, h6 {
font-family: 'Lora', serif;
}
</style>
</head>
<body class="flex flex-col items-center justify-center min-h-screen">
<div class="w-full max-w-2xl mx-auto bg-white rounded-xl shadow-lg p-6">
<div class="mb-4">
<h1 class="text-3xl font-bold text-center text-gray-800">AI Chat</h1>
<p class="text-center text-gray-500">Have a conversation with our AI assistant.</p>
</div>
<div id="chat-box" class="h-96 overflow-y-auto mb-4 p-4 bg-gray-50 rounded-lg">
<?php foreach ($_SESSION['chat_history'] as $entry): ?>
<?php if (isset($entry['user'])): ?>
<div class="text-right mb-3">
<span class="inline-block bg-yellow-500 text-white rounded-lg px-4 py-2"><?php echo htmlspecialchars($entry['user']); ?></span>
</div>
<?php endif; ?>
<?php if (isset($entry['ai'])): ?>
<div class="text-left mb-3">
<span class="inline-block bg-gray-200 text-gray-800 rounded-lg px-4 py-2"><?php echo htmlspecialchars($entry['ai']); ?></span>
</div>
<?php endif; ?>
<?php endforeach; ?>
</div>
<form method="POST" action="chat.php" class="flex">
<input type="text" name="message" class="flex-grow rounded-l-lg p-3 border-t mr-0 border-b border-l text-gray-800 border-gray-200 bg-white focus:outline-none" placeholder="Type your message here..."/>
<button type="submit" class="px-6 rounded-r-lg bg-yellow-500 text-white font-bold p-3 uppercase border-yellow-500 border-t border-b border-r hover:bg-yellow-600">Send</button>
</form>
<div class="text-center mt-6">
<a href="index.php" class="text-yellow-500 hover:underline">Back to Home</a>
</div>
</div>
<script>
const chatBox = document.getElementById('chat-box');
chatBox.scrollTop = chatBox.scrollHeight;
</script>
</body>
</html>