ParleyChat/static/index.html

86 lines
No EOL
3.9 KiB
HTML
Raw Permalink Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html lang="ru">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, viewport-fit=cover">
<meta name="theme-color" content="#0084ff">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="default">
<title>Parley Chat</title>
<base href="{{.BasePath}}/">
<link rel="stylesheet" href="static/style.css">
</head>
<body>
<!-- Экран логина/регистрации -->
<div id="auth-screen" class="auth-screen">
<div class="auth-container">
<h2>💬 Parley Chat</h2>
<div class="tabs">
<button class="tab active" onclick="switchTab('login')">Вход</button>
<button class="tab" onclick="switchTab('register')">Регистрация</button>
</div>
<div id="login-form" class="auth-form">
<input type="text" id="login-username" placeholder="Имя пользователя" autocomplete="username">
<input type="password" id="login-password" placeholder="Пароль" autocomplete="current-password">
<button onclick="login()">Войти</button>
</div>
<div id="register-form" class="auth-form" style="display:none">
<input type="text" id="reg-username" placeholder="Придумайте имя" autocomplete="off">
<input type="password" id="reg-password" placeholder="Придумайте пароль" autocomplete="new-password">
<button onclick="register()">Зарегистрироваться</button>
</div>
<div id="auth-error" class="auth-error"></div>
</div>
</div>
<!-- Основной экран чата -->
<div id="chat-screen" class="chat-screen" style="display:none">
<div class="container">
<!-- Левая панель с пользователями -->
<div class="sidebar hidden" id="sidebar">
<div class="sidebar-header">
<span id="current-username">👤 Пользователь</span>
<button id="admin-btn" style="display:none" onclick="showAdminPanel()" title="Админ-панель">⚙️</button>
</div>
<div id="users-list" class="users-list">
<div style="padding: 20px; text-align: center; color: #888;">Загрузка...</div>
</div>
</div>
<!-- Правая панель чата -->
<div class="chat-area" id="chat-area">
<div id="chat-header" class="chat-header">
<span class="mobile-back-btn" onclick="showSidebar()" title="Назад к списку"></span>
<span>💬 Выберите собеседника</span>
</div>
<div id="messages" class="messages">
<div class="empty-chat">
<div>
<div class="empty-chat-icon">💭</div>
<div class="empty-chat-text">Выберите собеседника<br>для начала общения</div>
</div>
</div>
</div>
<div class="message-input">
<input type="text" id="message-input" placeholder="Введите сообщение..." disabled>
<button id="send-btn" onclick="sendMessage()" disabled title="Отправить"></button>
</div>
</div>
</div>
</div>
<!-- Админ панель -->
<div id="admin-panel" class="modal" style="display:none">
<div class="modal-content">
<h3>👑 Управление пользователями</h3>
<div id="admin-users-list"></div>
<button class="close-btn" onclick="closeAdminPanel()">Закрыть</button>
</div>
</div>
<script src="static/app.js"></script>
</body>
</html>