mirror of
https://github.com/morris/vanilla-todo.git
synced 2025-08-20 12:51:43 +02:00
add some jsdoc for element autocomplete
This commit is contained in:
@@ -1,3 +1,6 @@
|
|||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function AppCollapsible(el) {
|
export function AppCollapsible(el) {
|
||||||
const state = {
|
const state = {
|
||||||
show: true,
|
show: true,
|
||||||
|
@@ -17,6 +17,9 @@ const datesRow = `
|
|||||||
</tr>
|
</tr>
|
||||||
`;
|
`;
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function AppDatePicker(el) {
|
export function AppDatePicker(el) {
|
||||||
const now = new Date();
|
const now = new Date();
|
||||||
const state = {
|
const state = {
|
||||||
|
@@ -1,3 +1,11 @@
|
|||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
* @param {{
|
||||||
|
* dropSelector: string;
|
||||||
|
* dragThreshold?: number;
|
||||||
|
* dropRange?: number;
|
||||||
|
* }} options
|
||||||
|
*/
|
||||||
export function AppDraggable(el, options) {
|
export function AppDraggable(el, options) {
|
||||||
const dragThreshold = options.dragThreshold ?? 5;
|
const dragThreshold = options.dragThreshold ?? 5;
|
||||||
const dropRange = options.dropRange ?? 50;
|
const dropRange = options.dropRange ?? 50;
|
||||||
|
@@ -1,3 +1,11 @@
|
|||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
* @param {{
|
||||||
|
* initialDelay?: number;
|
||||||
|
* removeTimeout: number;
|
||||||
|
* selector: string;
|
||||||
|
* }} options
|
||||||
|
*/
|
||||||
export function AppFlip(el, options) {
|
export function AppFlip(el, options) {
|
||||||
let enabled = options.initialDelay === 0;
|
let enabled = options.initialDelay === 0;
|
||||||
let first;
|
let first;
|
||||||
|
@@ -1,3 +1,6 @@
|
|||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function AppFps(el) {
|
export function AppFps(el) {
|
||||||
const sampleSize = 20;
|
const sampleSize = 20;
|
||||||
let times = [];
|
let times = [];
|
||||||
|
@@ -2,6 +2,9 @@ export const BASE_URL = 'https://unpkg.com/@primer/octicons@19.8.0/build/svg/';
|
|||||||
|
|
||||||
const cache = {};
|
const cache = {};
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function AppIcon(el) {
|
export function AppIcon(el) {
|
||||||
if (el.children.length > 0) return;
|
if (el.children.length > 0) return;
|
||||||
|
|
||||||
|
@@ -1,3 +1,9 @@
|
|||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
* @param {{
|
||||||
|
* direction?: 'horizontal' | 'vertical';
|
||||||
|
* }} options
|
||||||
|
*/
|
||||||
export function AppSortable(el, options) {
|
export function AppSortable(el, options) {
|
||||||
let placeholder;
|
let placeholder;
|
||||||
let placeholderSource;
|
let placeholderSource;
|
||||||
|
@@ -7,6 +7,9 @@ import { TodoFrameDays } from './TodoFrameDays.js';
|
|||||||
import { TodoStore } from './TodoStore.js';
|
import { TodoStore } from './TodoStore.js';
|
||||||
import { formatDateId } from './util.js';
|
import { formatDateId } from './util.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoApp(el) {
|
export function TodoApp(el) {
|
||||||
const state = {
|
const state = {
|
||||||
items: [],
|
items: [],
|
||||||
|
@@ -2,6 +2,9 @@ import { AppDraggable } from './AppDraggable.js';
|
|||||||
import { AppIcon } from './AppIcon.js';
|
import { AppIcon } from './AppIcon.js';
|
||||||
import { TodoList } from './TodoList.js';
|
import { TodoList } from './TodoList.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoCustomList(el) {
|
export function TodoCustomList(el) {
|
||||||
const state = {
|
const state = {
|
||||||
list: null,
|
list: null,
|
||||||
|
@@ -1,6 +1,9 @@
|
|||||||
import { TodoList } from './TodoList.js';
|
import { TodoList } from './TodoList.js';
|
||||||
import { formatDate, formatDayOfWeek } from './util.js';
|
import { formatDate, formatDayOfWeek } from './util.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoDay(el) {
|
export function TodoDay(el) {
|
||||||
const state = {
|
const state = {
|
||||||
dateId: el.dataset.key,
|
dateId: el.dataset.key,
|
||||||
|
@@ -2,6 +2,9 @@ import { AppIcon } from './AppIcon.js';
|
|||||||
import { AppSortable } from './AppSortable.js';
|
import { AppSortable } from './AppSortable.js';
|
||||||
import { TodoCustomList } from './TodoCustomList.js';
|
import { TodoCustomList } from './TodoCustomList.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoFrameCustom(el) {
|
export function TodoFrameCustom(el) {
|
||||||
const state = {
|
const state = {
|
||||||
customLists: [],
|
customLists: [],
|
||||||
|
@@ -3,6 +3,9 @@ import { AppIcon } from './AppIcon.js';
|
|||||||
import { TodoDay } from './TodoDay.js';
|
import { TodoDay } from './TodoDay.js';
|
||||||
import { formatDateId } from './util.js';
|
import { formatDateId } from './util.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoFrameDays(el) {
|
export function TodoFrameDays(el) {
|
||||||
const RANGE = 14;
|
const RANGE = 14;
|
||||||
const state = {
|
const state = {
|
||||||
|
@@ -1,6 +1,9 @@
|
|||||||
import { AppDraggable } from './AppDraggable.js';
|
import { AppDraggable } from './AppDraggable.js';
|
||||||
import { AppIcon } from './AppIcon.js';
|
import { AppIcon } from './AppIcon.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoItem(el) {
|
export function TodoItem(el) {
|
||||||
const state = {
|
const state = {
|
||||||
item: null,
|
item: null,
|
||||||
|
@@ -1,5 +1,8 @@
|
|||||||
import { AppIcon } from './AppIcon.js';
|
import { AppIcon } from './AppIcon.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoItemInput(el) {
|
export function TodoItemInput(el) {
|
||||||
let saveOnBlur = true;
|
let saveOnBlur = true;
|
||||||
|
|
||||||
|
@@ -2,6 +2,9 @@ import { AppSortable } from './AppSortable.js';
|
|||||||
import { TodoItem } from './TodoItem.js';
|
import { TodoItem } from './TodoItem.js';
|
||||||
import { TodoItemInput } from './TodoItemInput.js';
|
import { TodoItemInput } from './TodoItemInput.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoList(el) {
|
export function TodoList(el) {
|
||||||
const state = {
|
const state = {
|
||||||
items: [],
|
items: [],
|
||||||
|
@@ -1,5 +1,8 @@
|
|||||||
import { formatDateId, uuid } from './util.js';
|
import { formatDateId, uuid } from './util.js';
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {HTMLElement} el
|
||||||
|
*/
|
||||||
export function TodoStore(el) {
|
export function TodoStore(el) {
|
||||||
const state = {
|
const state = {
|
||||||
items: [],
|
items: [],
|
||||||
|
@@ -7,6 +7,10 @@ export function uuid() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {Date} date
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
export function formatDateId(date) {
|
export function formatDateId(date) {
|
||||||
const y = date.getFullYear();
|
const y = date.getFullYear();
|
||||||
const m = date.getMonth() + 1;
|
const m = date.getMonth() + 1;
|
||||||
@@ -18,6 +22,10 @@ export function formatDateId(date) {
|
|||||||
return `${ys}-${ms}-${ds}`;
|
return `${ys}-${ms}-${ds}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {Date} date
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
export function formatDate(date) {
|
export function formatDate(date) {
|
||||||
const m = formatMonth(date);
|
const m = formatMonth(date);
|
||||||
const d = formatDayOfMonth(date);
|
const d = formatDayOfMonth(date);
|
||||||
@@ -26,6 +34,10 @@ export function formatDate(date) {
|
|||||||
return `${m} ${d} ${y}`;
|
return `${m} ${d} ${y}`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {Date} date
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
export function formatDayOfMonth(date) {
|
export function formatDayOfMonth(date) {
|
||||||
const d = date.getDate();
|
const d = date.getDate();
|
||||||
const t = d % 10;
|
const t = d % 10;
|
||||||
@@ -51,6 +63,10 @@ export const DAY_NAMES = [
|
|||||||
'Saturday',
|
'Saturday',
|
||||||
];
|
];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {Date} date
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
export function formatDayOfWeek(date) {
|
export function formatDayOfWeek(date) {
|
||||||
return DAY_NAMES[date.getDay()];
|
return DAY_NAMES[date.getDay()];
|
||||||
}
|
}
|
||||||
@@ -70,6 +86,10 @@ export const MONTH_NAMES = [
|
|||||||
'December',
|
'December',
|
||||||
];
|
];
|
||||||
|
|
||||||
|
/**
|
||||||
|
* @param {Date} date
|
||||||
|
* @returns {string}
|
||||||
|
*/
|
||||||
export function formatMonth(date) {
|
export function formatMonth(date) {
|
||||||
return MONTH_NAMES[date.getMonth()];
|
return MONTH_NAMES[date.getMonth()];
|
||||||
}
|
}
|
||||||
|
Reference in New Issue
Block a user