Рефакторизация структуры кода для улучшения читаемости и удобства сопровождения.
This commit is contained in:
@@ -0,0 +1 @@
|
||||
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
@@ -0,0 +1,180 @@
|
||||
<!DOCTYPE html>
|
||||
<html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8">
|
||||
<title> Клиент NetBird </title>
|
||||
<style>
|
||||
html { line-height: 1.15; -webkit-text-size-adjust: 100% }
|
||||
body { margin: 0 }
|
||||
main { display: block }
|
||||
h1 { font-size: 2em; margin: .67em 0 }
|
||||
body {
|
||||
background-color: #181a1d;
|
||||
font-family: system-ui, -apple-system, BlinkMacSystemFont, Roboto, Helvetica Neue, Segoe UI, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
|
||||
color: #fff;
|
||||
}
|
||||
*, h1, h2, h3, h4, h5, h6, p, span {
|
||||
color: #fff;
|
||||
font-size: 20px;
|
||||
font-weight: normal;
|
||||
}
|
||||
.success { color: #63FB72; }
|
||||
.text-muted { opacity: 0.8; }
|
||||
.text-small { font-size: 16px; opacity: 0.8; }
|
||||
hr {
|
||||
width: 100%;
|
||||
height: 2px;
|
||||
background: #2F2C2C;
|
||||
border: none;
|
||||
margin: 40px 0;
|
||||
}
|
||||
.container { padding: 40px; max-width: 1440px; margin: auto; }
|
||||
.app-icon { border-radius: 20px; }
|
||||
.app {
|
||||
display: flex;
|
||||
margin: 20px 0 40px 0;
|
||||
}
|
||||
.app>.app-icon {
|
||||
flex-shrink: 0;
|
||||
height: 140px;
|
||||
width: 140px;
|
||||
box-shadow: 0 0 40px 0 rgba(0, 0, 0, 0.95);
|
||||
margin-right: 24px;
|
||||
}
|
||||
.app>.app-details>.app-status { display: block; font-size: 20px; margin: 10px 0 0 0; }
|
||||
.app>.app-details>.app-name {
|
||||
font-size: 52px; line-height: 52px; font-weight: bold; margin: 10px 0 0 0;
|
||||
}
|
||||
.kbd {
|
||||
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
|
||||
background: #2b2e34; border: 1px solid #f68330; border-radius: 6px; padding: 2px 6px;
|
||||
}
|
||||
.note {
|
||||
background: #181a1d; border-radius: 12px; padding: 16px; margin-top: 16px;
|
||||
}
|
||||
ol li { margin-bottom: 14px; }
|
||||
code.block { display: block; background: #f68330; border: 1px solid #f68330; padding: 14px; border-radius: 8px; overflow-x: auto; }
|
||||
|
||||
.config-card {
|
||||
background: #252222;
|
||||
border-radius: 18px;
|
||||
padding: 28px 28px 24px 28px;
|
||||
border: 1px solid #343131;
|
||||
box-shadow: 0 18px 40px rgba(0, 0, 0, 0.55);
|
||||
margin-top: 10px;
|
||||
margin-bottom: 32px;
|
||||
}
|
||||
.config-card h2 {
|
||||
margin-top: 0;
|
||||
margin-bottom: 12px;
|
||||
}
|
||||
.config-intro {
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
.config-intro code.block {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
.steps-list {
|
||||
margin-top: 10px;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.steps-list li {
|
||||
padding-left: 4px;
|
||||
}
|
||||
.note {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
</style>
|
||||
<link rel="shortcut icon" type="image/jpg" href="favicon.png">
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<section class="container app-container">
|
||||
<div class="app">
|
||||
<img class="app-icon" src="logo.png" width="256" height="256" alt="NetBird">
|
||||
<div class="app-details">
|
||||
<span class="app-status success">● Запущено</span>
|
||||
<h1 class="app-name">Клиент NetBird</h1>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<p class="text-muted"> </p>
|
||||
<hr />
|
||||
|
||||
|
||||
<h2 style="font-weight: 650;">⚙️ Подключите ваш DFWebOS к NetBird</h2>
|
||||
<p>Для настройки NetBird требуется ключ установки, так как он регистрирует новые устройства в сети и связывает их с нужной учетной записью во время первоначальной активации.</p>
|
||||
|
||||
<div id="status-container">
|
||||
<p>Загрузка статуса...</p>
|
||||
</div>
|
||||
|
||||
<div id="setup-instructions" style="display: none;">
|
||||
<h3>Пошаговая инструкция</h3>
|
||||
<ol>
|
||||
<li>Нажмите на ссылку активации выше или скопируйте ее в браузер.</li>
|
||||
<li>Войдите в систему, используя свою учетную запись NetBird.</li>
|
||||
<li>Подтвердите устройство, когда появится запрос, и ваш клиент DFWebOS будет зарегистрирован автоматически.</li>
|
||||
<li>После этого первого входа контейнер будет оставаться подключенным даже после перезапусков.</li>
|
||||
</ol>
|
||||
|
||||
<div class="note">
|
||||
<p><span class="kbd">💡 Совет:</span> Вы всегда можете сгенерировать новый код, перезапустив контейнер.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="connected-message" style="display: none;">
|
||||
<p class="success" style="font-size: 24px;">✓ Ваш DFWebOS уже подключен к NetBird!</p>
|
||||
<p>Устройство зарегистрировано и готово к использованию. Больше ничего делать не нужно.</p>
|
||||
</div>
|
||||
|
||||
<div id="waiting-message" style="display: none;">
|
||||
<p>Ожидание инициализации NetBird...</p>
|
||||
<p class="text-small">Если ссылка активации не появляется, нажмите правой кнопкой мыши по приложению и выберите <strong>Troubleshoot</strong>, чтобы посмотреть логи.</p>
|
||||
</div>
|
||||
|
||||
<hr />
|
||||
<p class="text-small text-muted">
|
||||
Подробные инструкции по установке и настройке смотрите в официальной документации NetBird:
|
||||
<a href="https://docs.netbird.io/" target="_blank" class="text-small">https://docs.netbird.io/</a>
|
||||
</p>
|
||||
|
||||
</section>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', function () {
|
||||
fetch('status.json')
|
||||
.then(response => response.json())
|
||||
.then(data => {
|
||||
const statusContainer = document.getElementById('status-container');
|
||||
const setupInstructions = document.getElementById('setup-instructions');
|
||||
const connectedMessage = document.getElementById('connected-message');
|
||||
const waitingMessage = document.getElementById('waiting-message');
|
||||
|
||||
if (data.status === 'connected') {
|
||||
// Show connected message
|
||||
statusContainer.style.display = 'none';
|
||||
connectedMessage.style.display = 'block';
|
||||
} else if (data.status === 'pending' && data.activationUrl) {
|
||||
// Show activation URL and instructions
|
||||
statusContainer.innerHTML = '<p>Ваша ссылка активации NetBird:</p>' +
|
||||
'<p><a href="' + data.activationUrl + '" target="_blank" style="color: #f68330; font-weight: bold; font-size: 22px;">' +
|
||||
data.activationUrl + '</a></p>' +
|
||||
'<p class="text-small text-muted">Код пользователя: <strong style="color: #fff;">' + data.userCode + '</strong></p>';
|
||||
setupInstructions.style.display = 'block';
|
||||
} else {
|
||||
// Show waiting message
|
||||
statusContainer.style.display = 'none';
|
||||
waitingMessage.style.display = 'block';
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error('Error loading status:', error);
|
||||
document.getElementById('status-container').innerHTML =
|
||||
'<p class="text-muted">Не удалось загрузить статус. Проверьте логи приложения, чтобы найти ссылку активации.</p>';
|
||||
});
|
||||
});
|
||||
</script>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 22 KiB |
Reference in New Issue
Block a user