mirror of
https://github.com/yggdrasil-network/yggdrasil-go.git
synced 2025-08-24 16:05:07 +03:00
160 lines
No EOL
8.2 KiB
HTML
160 lines
No EOL
8.2 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Yggdrasil Web Interface</title>
|
||
<link rel="stylesheet" href="static/style.css">
|
||
<script src="static/api.js"></script>
|
||
<script src="static/main.js"></script>
|
||
<script src="static/app.js"></script>
|
||
<script src="static/lang/ru.js"></script>
|
||
<script src="static/lang/en.js"></script>
|
||
</head>
|
||
|
||
<body>
|
||
<div class="container">
|
||
<header>
|
||
<div class="header-content">
|
||
<div>
|
||
<h1 data-key="title">🌳 Yggdrasil Web Interface</h1>
|
||
<p data-key="subtitle">Network mesh management dashboard</p>
|
||
</div>
|
||
<div class="header-actions">
|
||
<div class="controls-group">
|
||
<button onclick="toggleTheme()" class="theme-btn" id="theme-btn">
|
||
<span class="theme-icon">🌙</span>
|
||
</button>
|
||
<button onclick="switchLanguage('ru')" class="lang-btn" id="lang-ru">RU</button>
|
||
<button onclick="switchLanguage('en')" class="lang-btn" id="lang-en">EN</button>
|
||
<button onclick="logout()" class="logout-btn-header" data-key="logout"></button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<div class="layout">
|
||
<aside class="sidebar">
|
||
<nav class="nav-menu">
|
||
<div class="nav-item active" onclick="showSection('status')">
|
||
<span class="nav-icon">📊</span>
|
||
<span class="nav-text" data-key="nav_status">Состояние</span>
|
||
</div>
|
||
<div class="nav-item" onclick="showSection('peers')">
|
||
<span class="nav-icon">🌐</span>
|
||
<span class="nav-text" data-key="nav_peers">Пиры</span>
|
||
</div>
|
||
<div class="nav-item" onclick="showSection('config')">
|
||
<span class="nav-icon">⚙️</span>
|
||
<span class="nav-text" data-key="nav_config">Конфигурация</span>
|
||
</div>
|
||
</nav>
|
||
</aside>
|
||
|
||
<main class="main-content">
|
||
<div id="status-section" class="content-section active">
|
||
<div class="status-card">
|
||
<h2 data-key="status_title">Состояние узла</h2>
|
||
<p data-key="status_description">Информация о текущем состоянии вашего узла Yggdrasil</p>
|
||
</div>
|
||
|
||
<div class="info-grid">
|
||
<div class="info-card">
|
||
<h3 data-key="node_info">Информация об узле</h3>
|
||
<p><span data-key="public_key">Публичный ключ</span>: <span id="node-key"
|
||
data-key="loading">Загрузка...</span> <button onclick="copyNodeKey()"
|
||
style="margin-left: 8px; font-size: 12px;">📋</button></p>
|
||
<p><span data-key="version">Версия</span>: <span id="node-version"
|
||
data-key="loading">Загрузка...</span></p>
|
||
<p><span data-key="routing_entries">Записей маршрутизации</span>: <span id="routing-entries"
|
||
data-key="loading">Загрузка...</span></p>
|
||
<span id="node-key-full" data-value="" style="display: none;"></span>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3 data-key="network_info">Сетевая информация</h3>
|
||
<p><span data-key="address">Адрес</span>: <span id="node-address"
|
||
data-key="loading">Загрузка...</span></p>
|
||
<p><span data-key="subnet">Подсеть</span>: <span id="node-subnet"
|
||
data-key="loading">Загрузка...</span></p>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3 data-key="statistics">Статистика пиров</h3>
|
||
<p><span data-key="total_peers">Всего пиров</span>: <span id="peers-count"
|
||
data-key="loading">Загрузка...</span></p>
|
||
<p><span data-key="online_peers">Онлайн пиров</span>: <span id="peers-online"
|
||
data-key="loading">Загрузка...</span></p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="peers-section" class="content-section">
|
||
<div class="status-card">
|
||
<h2 data-key="peers_title">Управление пирами</h2>
|
||
<p data-key="peers_description">Просмотр и управление соединениями с пирами</p>
|
||
</div>
|
||
|
||
<div class="info-grid">
|
||
<div class="info-card">
|
||
<h3 data-key="add_peer">Добавить пир</h3>
|
||
<p data-key="add_peer_description">Подключение к новому узлу</p>
|
||
<button onclick="addPeer()" class="action-btn" data-key="add_peer_btn">Добавить пир</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="peers-container">
|
||
<h3 data-key="connected_peers">Подключенные пиры</h3>
|
||
<div id="peers-list" class="peers-list">
|
||
<div class="loading" data-key="loading">Загрузка...</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="config-section" class="content-section">
|
||
<div class="status-card">
|
||
<h2 data-key="config_title">Конфигурация</h2>
|
||
<p data-key="config_description">Настройки узла и параметры сети</p>
|
||
</div>
|
||
|
||
<div class="info-grid">
|
||
<div class="info-card">
|
||
<h3 data-key="basic_settings">Основные настройки</h3>
|
||
<p data-key="basic_settings_description">Базовая конфигурация узла</p>
|
||
<small data-key="coming_soon">Функция в разработке...</small>
|
||
</div>
|
||
|
||
<div class="info-card">
|
||
<h3 data-key="network_settings">Сетевые настройки</h3>
|
||
<p data-key="network_settings_description">Параметры сетевого взаимодействия</p>
|
||
<small data-key="coming_soon">Функция в разработке...</small>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
|
||
<div class="mobile-controls">
|
||
<div class="controls-group">
|
||
<button onclick="toggleTheme()" class="theme-btn" id="theme-btn-mobile">
|
||
<span class="theme-icon">🌙</span>
|
||
</button>
|
||
<button onclick="switchLanguage('ru')" class="lang-btn" id="lang-ru-mobile">RU</button>
|
||
<button onclick="switchLanguage('en')" class="lang-btn" id="lang-en-mobile">EN</button>
|
||
<button onclick="logout()" class="logout-btn-header" data-key="logout"></button>
|
||
</div>
|
||
</div>
|
||
|
||
<footer>
|
||
<p data-key="footer_text"><strong>Yggdrasil Network</strong> • <span id="footer-version"></span></p>
|
||
</footer>
|
||
</div>
|
||
|
||
<!-- Notifications container -->
|
||
<div class="notifications-container" id="notifications-container"></div>
|
||
|
||
|
||
</body>
|
||
|
||
</html> |