refactor(ui): step5 - extract auth.js (doLogin, doLogout, checkAuth, showLoginOverlay, jwtEmail, setUserAvatar)
This commit is contained in:
“Naeel”
+1
-93
@@ -16,6 +16,7 @@
|
|||||||
<script src="js/config.js"></script>
|
<script src="js/config.js"></script>
|
||||||
<script src="js/api.js"></script>
|
<script src="js/api.js"></script>
|
||||||
<script src="js/ui.js"></script>
|
<script src="js/ui.js"></script>
|
||||||
|
<script src="js/auth.js"></script>
|
||||||
</head>
|
</head>
|
||||||
|
|
||||||
<body>
|
<body>
|
||||||
@@ -796,88 +797,6 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function showLoginOverlay() {
|
|
||||||
document.getElementById('login-overlay').style.display = 'flex';
|
|
||||||
}
|
|
||||||
|
|
||||||
function hideLoginOverlay() {
|
|
||||||
document.getElementById('login-overlay').style.display = 'none';
|
|
||||||
}
|
|
||||||
|
|
||||||
async function doLogin() {
|
|
||||||
var btn = document.getElementById('l-btn');
|
|
||||||
var errEl = document.getElementById('l-error');
|
|
||||||
var token = (document.getElementById('l-token').value || '').trim();
|
|
||||||
var env = document.getElementById('l-env').value;
|
|
||||||
if (!token) { errEl.textContent = 'Введите токен'; errEl.style.display = 'block'; return; }
|
|
||||||
btn.disabled = true;
|
|
||||||
errEl.style.display = 'none';
|
|
||||||
try {
|
|
||||||
const res = await fetch(API_BASE + '/auth', {
|
|
||||||
method: 'POST',
|
|
||||||
headers: { 'Content-Type': 'application/json' },
|
|
||||||
body: JSON.stringify({ token: token, env: env })
|
|
||||||
});
|
|
||||||
if (!res.ok) {
|
|
||||||
const d = await res.json().catch(function () { return {}; });
|
|
||||||
throw new Error(d.error || 'Ошибка входа');
|
|
||||||
}
|
|
||||||
localStorage.setItem('auth_token', token);
|
|
||||||
localStorage.setItem('auth_env', env);
|
|
||||||
setUserAvatar(token);
|
|
||||||
hideLoginOverlay();
|
|
||||||
// Проверяем статус NS — если не ready, показываем init overlay
|
|
||||||
try {
|
|
||||||
var sr = await fetch(API_BASE + '/ns/status', { headers: { 'X-Auth-Token': token, 'X-Auth-Env': env } });
|
|
||||||
var sd = await sr.json();
|
|
||||||
if (!sd.ready) {
|
|
||||||
pollNSStatus();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
} catch (_) { }
|
|
||||||
reloadAll();
|
|
||||||
} catch (e) {
|
|
||||||
errEl.textContent = e.message;
|
|
||||||
errEl.style.display = 'block';
|
|
||||||
} finally {
|
|
||||||
btn.disabled = false;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function jwtEmail(token) {
|
|
||||||
try {
|
|
||||||
var payload = JSON.parse(atob(token.split('.')[1].replace(/-/g,'+').replace(/_/g,'/')));
|
|
||||||
return payload.email || payload.sub || null;
|
|
||||||
} catch (_) { return null; }
|
|
||||||
}
|
|
||||||
|
|
||||||
function setUserAvatar(token) {
|
|
||||||
var el = document.getElementById('user-avatar');
|
|
||||||
if (!el) return;
|
|
||||||
var email = token ? jwtEmail(token) : null;
|
|
||||||
if (email) {
|
|
||||||
el.textContent = email;
|
|
||||||
el.title = email;
|
|
||||||
el.style.fontSize = '0.7rem';
|
|
||||||
el.style.minWidth = '60px';
|
|
||||||
el.style.padding = '0 8px';
|
|
||||||
} else {
|
|
||||||
el.textContent = 'N';
|
|
||||||
el.title = '';
|
|
||||||
el.style.fontSize = '';
|
|
||||||
el.style.minWidth = '';
|
|
||||||
el.style.padding = '';
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
function doLogout() {
|
|
||||||
localStorage.removeItem('auth_token');
|
|
||||||
localStorage.removeItem('auth_env');
|
|
||||||
try { document.getElementById('l-token').value = ''; } catch (_) { }
|
|
||||||
setUserAvatar(null);
|
|
||||||
showLoginOverlay();
|
|
||||||
}
|
|
||||||
|
|
||||||
async function aiCheck(codeId, langId, resultId) {
|
async function aiCheck(codeId, langId, resultId) {
|
||||||
var code = document.getElementById(codeId).value.trim();
|
var code = document.getElementById(codeId).value.trim();
|
||||||
var lang = (document.getElementById(langId) ? document.getElementById(langId).value : '') || 'python';
|
var lang = (document.getElementById(langId) ? document.getElementById(langId).value : '') || 'python';
|
||||||
@@ -1085,17 +1004,6 @@
|
|||||||
}, 5000);
|
}, 5000);
|
||||||
}
|
}
|
||||||
|
|
||||||
function checkAuth() {
|
|
||||||
var storedToken = localStorage.getItem('auth_token');
|
|
||||||
if (!storedToken) {
|
|
||||||
showLoginOverlay();
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
setUserAvatar(storedToken);
|
|
||||||
hideLoginOverlay();
|
|
||||||
reloadAll();
|
|
||||||
}
|
|
||||||
|
|
||||||
checkAuth();
|
checkAuth();
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|||||||
@@ -0,0 +1,94 @@
|
|||||||
|
/* auth.js — авторизация */
|
||||||
|
|
||||||
|
function showLoginOverlay() {
|
||||||
|
document.getElementById('login-overlay').style.display = 'flex';
|
||||||
|
}
|
||||||
|
|
||||||
|
function hideLoginOverlay() {
|
||||||
|
document.getElementById('login-overlay').style.display = 'none';
|
||||||
|
}
|
||||||
|
|
||||||
|
async function doLogin() {
|
||||||
|
var btn = document.getElementById('l-btn');
|
||||||
|
var errEl = document.getElementById('l-error');
|
||||||
|
var token = (document.getElementById('l-token').value || '').trim();
|
||||||
|
var env = document.getElementById('l-env').value;
|
||||||
|
if (!token) { errEl.textContent = 'Введите токен'; errEl.style.display = 'block'; return; }
|
||||||
|
btn.disabled = true;
|
||||||
|
errEl.style.display = 'none';
|
||||||
|
try {
|
||||||
|
const res = await fetch(API_BASE + '/auth', {
|
||||||
|
method: 'POST',
|
||||||
|
headers: { 'Content-Type': 'application/json' },
|
||||||
|
body: JSON.stringify({ token: token, env: env })
|
||||||
|
});
|
||||||
|
if (!res.ok) {
|
||||||
|
const d = await res.json().catch(function () { return {}; });
|
||||||
|
throw new Error(d.error || 'Ошибка входа');
|
||||||
|
}
|
||||||
|
localStorage.setItem('auth_token', token);
|
||||||
|
localStorage.setItem('auth_env', env);
|
||||||
|
setUserAvatar(token);
|
||||||
|
hideLoginOverlay();
|
||||||
|
// Проверяем статус NS — если не ready, показываем init overlay
|
||||||
|
try {
|
||||||
|
var sr = await fetch(API_BASE + '/ns/status', { headers: { 'X-Auth-Token': token, 'X-Auth-Env': env } });
|
||||||
|
var sd = await sr.json();
|
||||||
|
if (!sd.ready) {
|
||||||
|
pollNSStatus();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
} catch (_) { }
|
||||||
|
reloadAll();
|
||||||
|
} catch (e) {
|
||||||
|
errEl.textContent = e.message;
|
||||||
|
errEl.style.display = 'block';
|
||||||
|
} finally {
|
||||||
|
btn.disabled = false;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function jwtEmail(token) {
|
||||||
|
try {
|
||||||
|
var payload = JSON.parse(atob(token.split('.')[1].replace(/-/g,'+').replace(/_/g,'/')));
|
||||||
|
return payload.email || payload.sub || null;
|
||||||
|
} catch (_) { return null; }
|
||||||
|
}
|
||||||
|
|
||||||
|
function setUserAvatar(token) {
|
||||||
|
var el = document.getElementById('user-avatar');
|
||||||
|
if (!el) return;
|
||||||
|
var email = token ? jwtEmail(token) : null;
|
||||||
|
if (email) {
|
||||||
|
el.textContent = email;
|
||||||
|
el.title = email;
|
||||||
|
el.style.fontSize = '0.7rem';
|
||||||
|
el.style.minWidth = '60px';
|
||||||
|
el.style.padding = '0 8px';
|
||||||
|
} else {
|
||||||
|
el.textContent = 'N';
|
||||||
|
el.title = '';
|
||||||
|
el.style.fontSize = '';
|
||||||
|
el.style.minWidth = '';
|
||||||
|
el.style.padding = '';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function doLogout() {
|
||||||
|
localStorage.removeItem('auth_token');
|
||||||
|
localStorage.removeItem('auth_env');
|
||||||
|
try { document.getElementById('l-token').value = ''; } catch (_) { }
|
||||||
|
setUserAvatar(null);
|
||||||
|
showLoginOverlay();
|
||||||
|
}
|
||||||
|
|
||||||
|
function checkAuth() {
|
||||||
|
var storedToken = localStorage.getItem('auth_token');
|
||||||
|
if (!storedToken) {
|
||||||
|
showLoginOverlay();
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
setUserAvatar(storedToken);
|
||||||
|
hideLoginOverlay();
|
||||||
|
reloadAll();
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user