new /texts page lets a user manage their own texts (list +
create form linking to /texts/{id}); /texts/{id} reuses
text.js for the node tree, with a back link to /texts. home
gains a 'My texts' link in the header. the admin texts page
now sources its cross-user list from /api/texts/all.
43 lines
1.4 KiB
JavaScript
43 lines
1.4 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
|
const textsList = document.getElementById('texts-list');
|
|
const form = document.getElementById('texts-form');
|
|
|
|
async function loadTexts() {
|
|
const response = await fetch('/api/texts', {
|
|
credentials: 'same-origin',
|
|
});
|
|
const texts = await response.json();
|
|
textsList.innerHTML = texts.map(function (text) {
|
|
return '<li class="card"><a class="card-link"'
|
|
+ ' href=/texts/'
|
|
+ text.id
|
|
+ '>'
|
|
+ text.name
|
|
+ '</a></li>';
|
|
}).join('');
|
|
}
|
|
|
|
form.addEventListener('submit', async (submitEvent) => {
|
|
submitEvent.preventDefault();
|
|
const formData = new FormData(form);
|
|
const response = await fetch('/api/texts', {
|
|
method: 'POST',
|
|
credentials: 'same-origin',
|
|
body: formData,
|
|
});
|
|
if (response.ok) {
|
|
const text = await response.json();
|
|
const li = document.createElement('li');
|
|
li.className = 'card';
|
|
const link = document.createElement('a');
|
|
link.className = 'card-link';
|
|
link.href = '/texts/' + text.id;
|
|
link.textContent = text.name;
|
|
li.appendChild(link);
|
|
textsList.appendChild(li);
|
|
form.reset();
|
|
}
|
|
});
|
|
|
|
loadTexts();
|
|
});
|