+ const actionBar =
+ currentView === "archived"
+ ? ""
+ : `
`;
- const titlePrefix = currentView === 'archived' ? 'Archived: ' : '';
- const emptyStateTitle = currentView === 'archived' ? 'No archived tasks' : 'Start your journey';
- const emptyStateText = currentView === 'archived'
- ? 'Your archive is empty. Completed tasks you archive will appear here.'
- : 'No tasks yet! Start planning your study schedule and stay on top of your goals.';
- const emptyStateIcon = currentView === 'archived' ? '📦' : '✨';
-
- const emptyState = dueSoon.length === 0 && thisWeek.length === 0 && completed.length === 0
- ? `
+ const titlePrefix = currentView === "archived" ? "Archived: " : "";
+ const emptyStateTitle =
+ currentView === "archived" ? "No archived tasks" : "Start your journey";
+ const emptyStateText =
+ currentView === "archived"
+ ? "Your archive is empty. Completed tasks you archive will appear here."
+ : "No tasks yet! Start planning your study schedule and stay on top of your goals.";
+ const emptyStateIcon = currentView === "archived" ? "📦" : "✨";
+
+ const emptyState =
+ dueSoon.length === 0 && thisWeek.length === 0 && completed.length === 0
+ ? `
${emptyStateIcon}
${emptyStateTitle}
${emptyStateText}
- ${currentView !== 'archived' ? `
+ ${
+ currentView !== "archived"
+ ? `
` : ''}
+ `
+ : ""
+ }
`
- : '';
-
- tasksSection.innerHTML = actionBar +
- renderGroup(titlePrefix + 'âš Due soon', dueSoon, 'var(--color-text-danger)', true)
- + renderGroup(titlePrefix + 'This week', thisWeek, 'var(--color-text-secondary)', true) +
- renderGroup(titlePrefix + 'Completed', completed, 'var(--color-text-tertiary)') +
- emptyState;
+ : "";
+
+ tasksSection.innerHTML =
+ actionBar +
+ renderGroup(
+ titlePrefix + "âš Due soon",
+ dueSoon,
+ "var(--color-text-danger)",
+ true,
+ ) +
+ renderGroup(
+ titlePrefix + "This week",
+ thisWeek,
+ "var(--color-text-secondary)",
+ true,
+ ) +
+ renderGroup(
+ titlePrefix + "Completed",
+ completed,
+ "var(--color-text-tertiary)",
+ ) +
+ emptyState;
}
// Bind CTA button in empty state
- const emptyStateAddBtn = document.getElementById('empty-state-add-btn');
+ const emptyStateAddBtn = document.getElementById("empty-state-add-btn");
if (emptyStateAddBtn) {
- emptyStateAddBtn.addEventListener('click', () => {
- document.getElementById('add-task-btn')?.click();
+ emptyStateAddBtn.addEventListener("click", () => {
+ document.getElementById("add-task-btn")?.click();
});
}
-
- document.querySelectorAll('.task-item').forEach(el => {
- el.addEventListener('click', (e) => {
- if (e.target.closest('.task-actions') || e.target.closest('.task-check')) return;
-
+
+ document.querySelectorAll(".task-item").forEach((el) => {
+ el.addEventListener("click", (e) => {
+ if (e.target.closest(".task-actions") || e.target.closest(".task-check"))
+ return;
+
const taskId = el.dataset.id;
- const task = store.tasks.find(t => String(t.id) === String(taskId));
+ const task = store.tasks.find((t) => String(t.id) === String(taskId));
if (task && task._isEditing) return;
-
+
store.toggleTaskStatus(taskId);
});
});
- document.querySelectorAll('.edit-task-btn').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".edit-task-btn").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
store.setTaskEditing(el.dataset.id, true);
});
});
- document.querySelectorAll('.cancel-board-edit-btn').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".cancel-board-edit-btn").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
store.setTaskEditing(el.dataset.id, false);
});
});
- document.querySelectorAll('.save-board-edit-btn').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".save-board-edit-btn").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
const taskId = el.dataset.id;
- const itemEl = el.closest('.task-item');
-
- const rawTitle = itemEl.querySelector('.board-edit-title').value;
- const subject_id = itemEl.querySelector('.board-edit-subject').value;
- let dateVal = itemEl.querySelector('.board-edit-date').value;
- const notes = itemEl.querySelector('.board-edit-notes').value;
- const priority = itemEl.querySelector('.board-edit-priority').value;
-
+ const itemEl = el.closest(".task-item");
+
+ const rawTitle = itemEl.querySelector(".board-edit-title").value;
+ const subject_id = itemEl.querySelector(".board-edit-subject").value;
+ let dateVal = itemEl.querySelector(".board-edit-date").value;
+ const notes = itemEl.querySelector(".board-edit-notes").value;
+ const priority = itemEl.querySelector(".board-edit-priority").value;
+
const { cleanTitle, labels } = extractLabels(rawTitle);
-
+
store.updateTask(taskId, {
title: cleanTitle || rawTitle,
subject_id,
- due_at: dateVal ? new Date(dateVal).toISOString() : '',
+ due_at: dateVal ? new Date(dateVal).toISOString() : "",
notes,
priority,
- labels
+ labels,
});
});
});
- document.querySelectorAll('.task-check').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".task-check").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
- const taskId = el.closest('.task-item').dataset.id;
+ const taskId = el.closest(".task-item").dataset.id;
store.toggleTaskStatus(taskId);
});
});
- document.querySelectorAll('.archive-task-btn').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".archive-task-btn").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
store.archiveTask(el.dataset.id);
});
});
- document.querySelectorAll('.restore-task-btn').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".restore-task-btn").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
store.restoreTask(el.dataset.id);
});
});
- document.querySelectorAll('.delete-task-btn').forEach(el => {
- el.addEventListener('click', (e) => {
+ document.querySelectorAll(".delete-task-btn").forEach((el) => {
+ el.addEventListener("click", (e) => {
e.stopPropagation();
store.deleteTask(el.dataset.id);
});
});
- const markAllPendingBtn = document.getElementById('mark-all-pending-btn');
+ const markAllPendingBtn = document.getElementById("mark-all-pending-btn");
if (markAllPendingBtn) {
- markAllPendingBtn.addEventListener('click', (e) => {
+ markAllPendingBtn.addEventListener("click", (e) => {
e.stopPropagation();
store.markAllPendingCompleted();
});
}
- const markDayCompleteBtn = document.getElementById('mark-day-complete-btn');
+ const markDayCompleteBtn = document.getElementById("mark-day-complete-btn");
if (markDayCompleteBtn) {
- markDayCompleteBtn.addEventListener('click', (e) => {
+ markDayCompleteBtn.addEventListener("click", (e) => {
e.stopPropagation();
store.markPendingTasksForDateCompleted(selectedDate);
});
}
}
-
-const summaryBox = document.getElementById('summary-box');
+const summaryBox = document.getElementById("summary-box");
if (summaryBox) {
summaryBox.innerHTML = generateSummary(store.tasks, store.subjects);
}
function renderCalendar() {
- const calTitle = document.getElementById('cal-month-title');
- const calGrid = document.getElementById('cal-grid');
+ const calTitle = document.getElementById("cal-month-title");
+ const calGrid = document.getElementById("cal-grid");
if (!calGrid) return;
-
+
const year = currentMonthDate.getFullYear();
const month = currentMonthDate.getMonth();
-
- const monthNames = ["January", "February", "March", "April", "May", "June", "July", "August", "September", "October", "November", "December"];
+
+ const monthNames = [
+ "January",
+ "February",
+ "March",
+ "April",
+ "May",
+ "June",
+ "July",
+ "August",
+ "September",
+ "October",
+ "November",
+ "December",
+ ];
calTitle.textContent = `${monthNames[month]} ${year}`;
-
- const topbarTitle = document.querySelector('.topbar-title');
- if(topbarTitle) topbarTitle.textContent = `${monthNames[month]} ${year}`;
+
+ const topbarTitle = document.querySelector(".topbar-title");
+ if (topbarTitle) topbarTitle.textContent = `${monthNames[month]} ${year}`;
const firstDay = new Date(year, month, 1).getDay();
const daysInMonth = new Date(year, month + 1, 0).getDate();
const prevMonthDays = new Date(year, month, 0).getDate();
-
+
const today = new Date();
-
+
let html = `
Su
Mo
Tu
We
Th
Fr
Sa
`;
-
+
for (let i = 0; i < firstDay; i++) {
html += `
${prevMonthDays - firstDay + i + 1}
`;
}
-
+
for (let i = 1; i <= daysInMonth; i++) {
- const isToday = i === today.getDate() && month === today.getMonth() && year === today.getFullYear();
- const isSelected = selectedDate && i === selectedDate.getDate() && month === selectedDate.getMonth() && year === selectedDate.getFullYear();
-
+ const isToday =
+ i === today.getDate() &&
+ month === today.getMonth() &&
+ year === today.getFullYear();
+ const isSelected =
+ selectedDate &&
+ i === selectedDate.getDate() &&
+ month === selectedDate.getMonth() &&
+ year === selectedDate.getFullYear();
+
// Find tasks for this day
- const dayTasks = store.tasks.filter(t => {
+ const dayTasks = store.tasks.filter((t) => {
if (t.archived) return false;
- if (t.status === 'Done') return false;
+ if (t.status === "Done") return false;
if (!t.due_at) return false;
const d = new Date(t.due_at);
- return d.getDate() === i && d.getMonth() === month && d.getFullYear() === year;
+ return (
+ d.getDate() === i && d.getMonth() === month && d.getFullYear() === year
+ );
});
- let indicatorHtml = '';
+ let indicatorHtml = "";
if (dayTasks.length > 0) {
indicatorHtml = `
`;
dayTasks.forEach((t, idx) => {
- if (idx > 2) return;
- const sub = store.subjects.find(s => s.id === t.subject_id) || store.subjects[0];
- indicatorHtml += `
`;
+ if (idx > 2) return;
+ const sub =
+ store.subjects.find((s) => s.id === t.subject_id) ||
+ store.subjects[0];
+ indicatorHtml += `
`;
});
indicatorHtml += `
`;
}
- const extraStyle = isSelected ? `border: 1.5px solid var(--color-text-primary);` : '';
+ const extraStyle = isSelected
+ ? `border: 1.5px solid var(--color-text-primary);`
+ : "";
- html += `
+ html += `
${i}
${indicatorHtml}
`;
}
-
+
const totalCells = firstDay + daysInMonth;
const nextDays = (7 - (totalCells % 7)) % 7;
for (let i = 1; i <= nextDays; i++) {
html += `
${i}
`;
}
-
+
calGrid.innerHTML = html;
// Bind day clicks
- document.querySelectorAll('.interactive-day').forEach(el => {
- el.addEventListener('click', (e) => {
- const d = parseInt(e.currentTarget.getAttribute('data-day'));
+ document.querySelectorAll(".interactive-day").forEach((el) => {
+ el.addEventListener("click", (e) => {
+ const d = parseInt(e.currentTarget.getAttribute("data-day"));
const clickedDate = new Date(year, month, d);
-
+
if (selectedDate && clickedDate.getTime() === selectedDate.getTime()) {
selectedDate = null;
} else {
@@ -870,29 +979,37 @@ function renderCalendar() {
function renderExtraction() {
const pasteItems = store.currentPaste;
if (!pasteItems || pasteItems.length === 0) {
- extractPreview.innerHTML = '';
+ extractPreview.innerHTML = "";
addItemsBtn.disabled = true;
- addItemsBtn.textContent = 'Add items to planner';
+ addItemsBtn.textContent = "Add items to planner";
return;
}
-
+
addItemsBtn.disabled = false;
addItemsBtn.textContent = `Add ${pasteItems.length} items to planner`;
-
+
let html = ``;
pasteItems.forEach((item, index) => {
// try to match subject name
- const sub = store.subjects.find(s => s.name.toLowerCase().includes((item.subject_name || '').toLowerCase())) || store.subjects[3];
+ const sub =
+ store.subjects.find((s) =>
+ s.name.toLowerCase().includes((item.subject_name || "").toLowerCase()),
+ ) || store.subjects[3];
// Attach subject id to item so Add will work
item.subject_id = sub.id;
-
+
if (item._isEditing) {
- let subjectOptions = store.subjects.map(s =>
- `
`
- ).join('');
-
- const localDate = item.due_at ? new Date(item.due_at).toISOString().substring(0, 16) : '';
-
+ let subjectOptions = store.subjects
+ .map(
+ (s) =>
+ `
`,
+ )
+ .join("");
+
+ const localDate = item.due_at
+ ? new Date(item.due_at).toISOString().substring(0, 16)
+ : "";
+
html += `