1
0
mirror of https://github.com/morris/vanilla-todo.git synced 2025-08-20 12:51:43 +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,20 +1,19 @@
/* global VT */
window.VT = window.VT || {};
import { AppIcon } from './AppIcon.js';
VT.TodoItemInput = function (el) {
var saveOnBlur = true;
export function TodoItemInput(el) {
let saveOnBlur = true;
el.innerHTML = [
'<input type="text" class="input use-focus-other">',
'<button class="app-button save"><i class="app-icon" data-id="plus-24"></i></button>',
].join('\n');
el.innerHTML = `
<input type="text" class="input use-focus-other">
<button class="app-button save"><i class="app-icon" data-id="plus-24"></i></button>
`;
var inputEl = el.querySelector('.input');
var saveEl = el.querySelector('.save');
const inputEl = el.querySelector('.input');
const saveEl = el.querySelector('.save');
el.querySelectorAll('.app-icon').forEach(VT.AppIcon);
el.querySelectorAll('.app-icon').forEach(AppIcon);
inputEl.addEventListener('keyup', function (e) {
inputEl.addEventListener('keyup', (e) => {
switch (e.keyCode) {
case 13: // enter
save();
@@ -25,24 +24,24 @@ VT.TodoItemInput = function (el) {
}
});
inputEl.addEventListener('blur', function () {
inputEl.addEventListener('blur', () => {
if (saveOnBlur) save();
saveOnBlur = true;
});
inputEl.addEventListener('focusOther', save);
saveEl.addEventListener('mousedown', function () {
saveEl.addEventListener('mousedown', () => {
saveOnBlur = false;
});
saveEl.addEventListener('click', function () {
saveEl.addEventListener('click', () => {
save();
inputEl.focus();
});
function save() {
var label = inputEl.value.trim();
const label = inputEl.value.trim();
if (label === '') return;
@@ -50,7 +49,7 @@ VT.TodoItemInput = function (el) {
el.dispatchEvent(
new CustomEvent('addItem', {
detail: { label: label },
detail: { label },
bubbles: true,
})
);
@@ -60,4 +59,4 @@ VT.TodoItemInput = function (el) {
inputEl.value = '';
inputEl.blur();
}
};
}