111 lines
3.6 KiB
JavaScript
111 lines
3.6 KiB
JavaScript
/*
|
|
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP error! status: ${response.status}`);
|
|
}
|
|
return response.json(); // Or handle other response formats
|
|
})
|
|
.then(responseData => {
|
|
console.log('Response received:', responseData);
|
|
// Handle the server's response
|
|
});
|
|
|
|
*/
|
|
|
|
document.addEventListener('DOMContentLoaded', function() {
|
|
var todos = document.getElementsByClassName('todo_item');
|
|
var action_items = (document.getElementById('todo_actions')).querySelectorAll('button');
|
|
|
|
// General Modal handling
|
|
function handle_modal(modal) {
|
|
console.log('handling modal');
|
|
let modal_close = modal.querySelector('.modal_close');
|
|
let submit_button = modal.querySelector('input[type="submit"]');
|
|
modal.style.display = 'block';
|
|
|
|
modal_close.addEventListener('click', function() {
|
|
modal.style.display = "none";
|
|
});
|
|
|
|
submit_button.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
let todo = {
|
|
'title': modal.querySelector('#title').value,
|
|
'description': modal.querySelector('#description'),
|
|
'priority': modal.querySelector('#priority'),
|
|
'due_date': modal.querySelector('#due_date'),
|
|
};
|
|
|
|
fetch('director.php', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
},
|
|
body: 'ajax_id=todo&action_id=create_update_todo&todo_id=' + this.todo_id + '&todo=' + encodeURIComponent(JSON.stringify(todo)),
|
|
})
|
|
.then(response => {
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP error! status: ${response.status}`);
|
|
}
|
|
return response.json(); // Or handle other response formats
|
|
})
|
|
.then(responseData => {
|
|
console.log('Response received:', responseData);
|
|
// Handle the server's response
|
|
});
|
|
});
|
|
}
|
|
|
|
for (let i = 0; i < action_items.length; i++) {
|
|
let action = action_items[i];
|
|
|
|
action.addEventListener('click', function(e) {
|
|
e.preventDefault();
|
|
|
|
switch (action.value) {
|
|
case 'new':
|
|
let new_todo_item = document.querySelector('#new_todo_item');
|
|
handle_modal(new_todo_item);
|
|
break;
|
|
}
|
|
});
|
|
}
|
|
|
|
for (let i = 0; i < todos.length; i++) {
|
|
let item = todos[i];
|
|
|
|
// Detailed todo item view via a modal
|
|
let modal_button = item.querySelector('.modal_activation_area');
|
|
let modal = item.querySelector('.modal');
|
|
modal_button.addEventListener('click', () => handle_modal(modal));
|
|
|
|
// Checkboxes & AJAX for updating the DB
|
|
var checkbox = item.querySelector('input[type="checkbox"]');
|
|
checkbox.todo_id = item.querySelector('input[name="todo_id"]').value;
|
|
checkbox.is_checked = checkbox.checked;
|
|
|
|
checkbox.addEventListener('click', function() {
|
|
if (!this.is_checked) {
|
|
this.is_checked = true;
|
|
fetch('director.php', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
},
|
|
body: 'ajax_id=todo&action_id=status&todo_id=' + this.todo_id + '&status=completed',
|
|
});
|
|
} else {
|
|
this.is_checked = false;
|
|
fetch('director.php', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/x-www-form-urlencoded',
|
|
},
|
|
body: 'ajax_id=todo&action_id=status&todo_id=' + this.todo_id + '&status=open',
|
|
});
|
|
}
|
|
});
|
|
}
|
|
});
|