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:
@@ -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();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
Reference in New Issue
Block a user