85 lines
2.6 KiB
JavaScript
85 lines
2.6 KiB
JavaScript
document.addEventListener('DOMContentLoaded', () => {
|
|
const textsList = document.getElementById('texts-list');
|
|
const createPlanModal = document.getElementById('create-plan-modal');
|
|
|
|
async function loadTexts() {
|
|
const response = await fetch('/api/texts');
|
|
const texts = await response.json();
|
|
textsList.innerHTML = texts
|
|
.map(text =>
|
|
'<li>' + text.name +
|
|
' <button class="create-plan" data-text-id="' +
|
|
text.id + '">Create plan</button></li>'
|
|
)
|
|
.join('');
|
|
}
|
|
|
|
const cancelPlanButton = createPlanModal.querySelector(
|
|
'button.cancel-plan'
|
|
);
|
|
const savePlanButton = createPlanModal.querySelector(
|
|
'button.save-plan'
|
|
);
|
|
const planNameInput = createPlanModal.querySelector('input.plan-name');
|
|
const planDateStartInput = createPlanModal.querySelector(
|
|
'input.plan-date-start'
|
|
);
|
|
const planDateEndInput = createPlanModal.querySelector(
|
|
'input.plan-date-end'
|
|
);
|
|
|
|
function openCreatePlanModal(textId) {
|
|
createPlanModal.dataset.textId = textId;
|
|
createPlanModal.hidden = false;
|
|
}
|
|
|
|
function closeCreatePlanModal() {
|
|
createPlanModal.hidden = true;
|
|
planNameInput.value = '';
|
|
planDateStartInput.value = '';
|
|
planDateEndInput.value = '';
|
|
}
|
|
|
|
textsList.addEventListener('click', (clickEvent) => {
|
|
const createPlanButton = clickEvent.target.closest(
|
|
'button.create-plan'
|
|
);
|
|
if (createPlanButton === null) {
|
|
return;
|
|
}
|
|
openCreatePlanModal(createPlanButton.dataset.textId);
|
|
});
|
|
|
|
cancelPlanButton.addEventListener('click', () => {
|
|
closeCreatePlanModal();
|
|
});
|
|
|
|
savePlanButton.addEventListener('click', async () => {
|
|
const planName = planNameInput.value;
|
|
const dateStart = planDateStartInput.value;
|
|
const dateEnd = planDateEndInput.value;
|
|
const textId = Number(createPlanModal.dataset.textId);
|
|
|
|
if (planName === '' || dateStart === '' || dateEnd === '') {
|
|
return;
|
|
}
|
|
|
|
const response = await fetch('/api/plans', {
|
|
method: 'POST',
|
|
headers: { 'Content-Type': 'application/json' },
|
|
body: JSON.stringify({
|
|
userId: 0,
|
|
textId: textId,
|
|
name: planName,
|
|
dateStart: dateStart,
|
|
dateEnd: dateEnd,
|
|
}),
|
|
});
|
|
|
|
if (response.ok) {
|
|
closeCreatePlanModal();
|
|
}
|
|
});
|
|
|
|
loadTexts();
|
|
});
|