Update index.html
This commit is contained in:
parent
b88f69251f
commit
6ccdd517b2
47
index.html
47
index.html
|
|
@ -11,8 +11,6 @@
|
||||||
.tab-btn.active { background: #00ff00; color: #000; }
|
.tab-btn.active { background: #00ff00; color: #000; }
|
||||||
.hidden { display: none; }
|
.hidden { display: none; }
|
||||||
.tab-content { border: 1px solid #00ff00; padding: 20px; margin-top: 10px; background: #222; }
|
.tab-content { border: 1px solid #00ff00; padding: 20px; margin-top: 10px; background: #222; }
|
||||||
|
|
||||||
/* Стили для сворачивания */
|
|
||||||
.item-box { border: 1px solid #555; padding: 10px; margin-bottom: 10px; background: #2b2b2b; }
|
.item-box { border: 1px solid #555; padding: 10px; margin-bottom: 10px; background: #2b2b2b; }
|
||||||
.item-header { display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-weight: bold; background: #333; padding: 5px; }
|
.item-header { display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-weight: bold; background: #333; padding: 5px; }
|
||||||
.item-body { padding-top: 10px; border-top: 1px dashed #555; margin-top: 5px; }
|
.item-body { padding-top: 10px; border-top: 1px dashed #555; margin-top: 5px; }
|
||||||
|
|
@ -23,8 +21,8 @@
|
||||||
|
|
||||||
<div id="auth-block">
|
<div id="auth-block">
|
||||||
<h2>Вход в секретный бункер</h2>
|
<h2>Вход в секретный бункер</h2>
|
||||||
<input type="text" id="username" placeholder="Логин"><br>
|
<input type="text" id="username" placeholder="Логин" onkeydown="handleKeyPress(event)"><br>
|
||||||
<input type="password" id="password" placeholder="Пароль"><br>
|
<input type="password" id="password" placeholder="Пароль" onkeydown="handleKeyPress(event)"><br>
|
||||||
<button onclick="auth('login')">Войти</button>
|
<button onclick="auth('login')">Войти</button>
|
||||||
<button onclick="auth('register')">Рега</button>
|
<button onclick="auth('register')">Рега</button>
|
||||||
<p id="auth-response"></p>
|
<p id="auth-response"></p>
|
||||||
|
|
@ -81,17 +79,17 @@
|
||||||
<script>
|
<script>
|
||||||
const API_URL = "https://universeofbadcode.online/api";
|
const API_URL = "https://universeofbadcode.online/api";
|
||||||
|
|
||||||
async function hashPassword(password) {
|
|
||||||
const msgBuffer = new TextEncoder().encode(password);
|
|
||||||
const hashBuffer = await crypto.subtle.digest('SHA-256', msgBuffer);
|
|
||||||
return Array.from(new Uint8Array(hashBuffer)).map(b => b.toString(16).padStart(2, '0')).join('');
|
|
||||||
}
|
|
||||||
|
|
||||||
function getHeaders() {
|
function getHeaders() {
|
||||||
return { 'Content-Type': 'application/json', 'X-Token': localStorage.getItem('token') };
|
return { 'Content-Type': 'application/json', 'X-Token': localStorage.getItem('token') };
|
||||||
}
|
}
|
||||||
|
|
||||||
// Функция сворачивания/разворачивания блоков
|
// Слушаем нажатие клавиш в форме авторизации
|
||||||
|
function handleKeyPress(event) {
|
||||||
|
if (event.key === 'Enter') {
|
||||||
|
auth('login');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
function toggleCollapse(id, headerEl) {
|
function toggleCollapse(id, headerEl) {
|
||||||
const body = document.getElementById(id);
|
const body = document.getElementById(id);
|
||||||
const icon = headerEl.querySelector('.toggle-icon');
|
const icon = headerEl.querySelector('.toggle-icon');
|
||||||
|
|
@ -110,13 +108,17 @@
|
||||||
const resElement = document.getElementById('auth-response');
|
const resElement = document.getElementById('auth-response');
|
||||||
if(!user || !pass) return;
|
if(!user || !pass) return;
|
||||||
|
|
||||||
const hashedPassword = await hashPassword(pass);
|
// Проверка на фронте для удобства UX
|
||||||
|
if (action === 'register' && pass.length < 6) {
|
||||||
|
resElement.innerText = "Ошибка: Пароль должен быть не менее 6 символов";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
try {
|
try {
|
||||||
const response = await fetch(`${API_URL}/${action}`, {
|
const response = await fetch(`${API_URL}/${action}`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: { 'Content-Type': 'application/json' },
|
headers: { 'Content-Type': 'application/json' },
|
||||||
body: JSON.stringify({ username: user, password: hashedPassword })
|
body: JSON.stringify({ username: user, password: pass }) // Пароль летит чистым
|
||||||
});
|
});
|
||||||
const data = await response.json();
|
const data = await response.json();
|
||||||
if (response.ok) {
|
if (response.ok) {
|
||||||
|
|
@ -125,7 +127,7 @@
|
||||||
localStorage.setItem('token', data.token);
|
localStorage.setItem('token', data.token);
|
||||||
initSystem();
|
initSystem();
|
||||||
} else {
|
} else {
|
||||||
resElement.innerText = "Рега успешна. Жми Войти.";
|
resElement.innerText = "Рега успешна. Жми Войти или Enter.";
|
||||||
}
|
}
|
||||||
} else { resElement.innerText = "Ошибка: " + data.detail; }
|
} else { resElement.innerText = "Ошибка: " + data.detail; }
|
||||||
} catch (err) { resElement.innerText = "Бэк упал."; }
|
} catch (err) { resElement.innerText = "Бэк упал."; }
|
||||||
|
|
@ -153,6 +155,7 @@
|
||||||
localStorage.clear();
|
localStorage.clear();
|
||||||
document.getElementById('main-block').classList.add('hidden');
|
document.getElementById('main-block').classList.add('hidden');
|
||||||
document.getElementById('auth-block').classList.remove('hidden');
|
document.getElementById('auth-block').classList.remove('hidden');
|
||||||
|
document.getElementById('auth-response').innerText = '';
|
||||||
}
|
}
|
||||||
|
|
||||||
async function changePassword() {
|
async function changePassword() {
|
||||||
|
|
@ -160,11 +163,16 @@
|
||||||
const msgEl = document.getElementById('change-pwd-msg');
|
const msgEl = document.getElementById('change-pwd-msg');
|
||||||
if(!newPwd) return;
|
if(!newPwd) return;
|
||||||
|
|
||||||
const hashedNewPwd = await hashPassword(newPwd);
|
if (newPwd.length < 6) {
|
||||||
|
msgEl.innerText = "Минимум 6 символов!";
|
||||||
|
msgEl.style.color = "#ff0000";
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
const res = await fetch(`${API_URL}/change-password`, {
|
const res = await fetch(`${API_URL}/change-password`, {
|
||||||
method: 'POST',
|
method: 'POST',
|
||||||
headers: getHeaders(),
|
headers: getHeaders(),
|
||||||
body: JSON.stringify({ new_password: hashedNewPwd })
|
body: JSON.stringify({ new_password: newPwd })
|
||||||
});
|
});
|
||||||
const data = await res.json();
|
const data = await res.json();
|
||||||
if(res.ok) {
|
if(res.ok) {
|
||||||
|
|
@ -172,7 +180,7 @@
|
||||||
msgEl.style.color = "#00ff00";
|
msgEl.style.color = "#00ff00";
|
||||||
switchTab('profile');
|
switchTab('profile');
|
||||||
} else {
|
} else {
|
||||||
msgEl.innerText = "Ошибка";
|
msgEl.innerText = "Ошибка: " + data.detail;
|
||||||
msgEl.style.color = "#ff0000";
|
msgEl.style.color = "#ff0000";
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -182,14 +190,15 @@
|
||||||
document.querySelectorAll('.tab-btn').forEach(el => el.classList.remove('active'));
|
document.querySelectorAll('.tab-btn').forEach(el => el.classList.remove('active'));
|
||||||
|
|
||||||
document.getElementById(`tab-${tabName}`).classList.remove('hidden');
|
document.getElementById(`tab-${tabName}`).classList.remove('hidden');
|
||||||
if(event) event.target.classList.add('active');
|
if(window.event && window.event.target && window.event.target.classList.contains('tab-btn')) {
|
||||||
|
window.event.target.classList.add('active');
|
||||||
|
}
|
||||||
|
|
||||||
if (tabName === 'profile') {
|
if (tabName === 'profile') {
|
||||||
const res = await fetch(`${API_URL}/profile`, { headers: getHeaders() });
|
const res = await fetch(`${API_URL}/profile`, { headers: getHeaders() });
|
||||||
const data = await res.json();
|
const data = await res.json();
|
||||||
document.getElementById('prof-username').innerText = data.username;
|
document.getElementById('prof-username').innerText = data.username;
|
||||||
document.getElementById('prof-hash').value = data.hash;
|
document.getElementById('prof-hash').value = data.hash;
|
||||||
// Сбрасываем состояние скрытия на дефолтное
|
|
||||||
document.getElementById('prof-body').classList.add('hidden');
|
document.getElementById('prof-body').classList.add('hidden');
|
||||||
document.querySelector('#tab-profile .toggle-icon').innerText = "[Развернуть]";
|
document.querySelector('#tab-profile .toggle-icon').innerText = "[Развернуть]";
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue