1
0
mirror of https://github.com/morris/vanilla-todo.git synced 2025-08-22 13:43:06 +02:00

update to ES2020, some refactoring and cleanups

This commit is contained in:
Morris Brodersen
2022-05-09 15:46:58 +02:00
parent b4c57030f8
commit 2fbfc5e650
26 changed files with 1507 additions and 2129 deletions

View File

@@ -1,51 +1,49 @@
/* global VT */
window.VT = window.VT || {};
import { TodoList } from './TodoList.js';
import { formatDate, formatDayOfWeek } from './util.js';
VT.TodoDay = function (el) {
var state = {
export function TodoDay(el) {
const state = {
dateId: el.dataset.key,
items: [],
};
el.innerHTML = [
'<div class="header">',
' <h3 class="dayofweek"></h3>',
' <h6 class="date"></h6>',
'</div>',
'<div class="todo-list"></div>',
].join('\n');
el.innerHTML = `
<div class="header">
<h3 class="dayofweek"></h3>
<h6 class="date"></h6>
</div>
<div class="todo-list"></div>
`;
VT.TodoList(el.querySelector('.todo-list'));
TodoList(el.querySelector('.todo-list'));
el.addEventListener('addItem', function (e) {
el.addEventListener('addItem', (e) => {
e.detail.listId = state.dateId;
});
el.addEventListener('moveItem', function (e) {
el.addEventListener('moveItem', (e) => {
e.detail.listId = state.dateId;
e.detail.index = e.detail.index || 0;
e.detail.index = e.detail.index ?? 0;
});
el.todoDay = {
update: update,
};
el.addEventListener('todoDay', (e) => update(e.detail));
function update(next) {
Object.assign(state, next);
var date = new Date(state.dateId);
var today = new Date();
const date = new Date(state.dateId);
const today = new Date();
today.setHours(0, 0, 0, 0);
var tomorrow = new Date(today);
const tomorrow = new Date(today);
tomorrow.setDate(tomorrow.getDate() + 1);
el.classList.toggle('-past', date < today);
el.classList.toggle('-today', date >= today && date < tomorrow);
el.querySelector('.header > .dayofweek').innerText = VT.formatDayOfWeek(
date
el.querySelector('.header > .dayofweek').innerText = formatDayOfWeek(date);
el.querySelector('.header > .date').innerText = formatDate(date);
el.querySelector('.todo-list').dispatchEvent(
new CustomEvent('todoItems', { detail: state.items })
);
el.querySelector('.header > .date').innerText = VT.formatDate(date);
el.querySelector('.todo-list').todoList.update({ items: state.items });
}
};
}