60 lines
1.7 KiB
JavaScript
60 lines
1.7 KiB
JavaScript
// Simple client for language portal
|
|
const tabs = document.querySelectorAll('#tabs button');
|
|
const content = document.getElementById('content');
|
|
let currentLang = 'en';
|
|
|
|
function setActiveTab() {
|
|
tabs.forEach(b => b.classList.toggle('active', b.dataset.lang === currentLang));
|
|
}
|
|
|
|
async function loadTerms() {
|
|
const resp = await fetch(`/api/terms/${currentLang}`);
|
|
const terms = await resp.json();
|
|
renderTerms(terms);
|
|
}
|
|
|
|
function renderTerms(terms) {
|
|
const list = document.createElement('div');
|
|
list.id = 'list';
|
|
terms.forEach(t => {
|
|
const div = document.createElement('div');
|
|
div.className = 'term';
|
|
div.textContent = `${t.term}: ${t.definition}`;
|
|
list.appendChild(div);
|
|
});
|
|
const form = document.createElement('form');
|
|
form.id = 'addForm';
|
|
form.innerHTML = `
|
|
<h3>Добавить термин</h3>
|
|
<input name="term" placeholder="Термин" required />
|
|
<input name="definition" placeholder="Определение" required />
|
|
<button type="submit">Сохранить</button>
|
|
`;
|
|
form.addEventListener('submit', async e => {
|
|
e.preventDefault();
|
|
const term = e.target.term.value.trim();
|
|
const definition = e.target.definition.value.trim();
|
|
await fetch(`/api/terms/${currentLang}`, {
|
|
method: 'POST',
|
|
headers: {'Content-Type': 'application/json'},
|
|
body: JSON.stringify({term, definition})
|
|
});
|
|
e.target.reset();
|
|
loadTerms();
|
|
});
|
|
content.innerHTML = '';
|
|
content.appendChild(list);
|
|
content.appendChild(form);
|
|
}
|
|
|
|
tabs.forEach(b => {
|
|
b.addEventListener('click', () => {
|
|
currentLang = b.dataset.lang;
|
|
setActiveTab();
|
|
loadTerms();
|
|
});
|
|
});
|
|
|
|
setActiveTab();
|
|
loadTerms();
|