// Login-awards fetch runs on every navigation (including hx-boost body swaps // which preserve window, so it must live outside the __appInit guard). // Server-side _loginStreakDone cache makes it idempotent; localStorage dedupes the modal. // On a full page load we wait for the window 'load' event so React has finished // hydrating before any DOM mutations (toast injection, modal open) happen. // On hx-boost navigations readyState is already 'complete' so we fire immediately. (function() { function doLoginAwards() { if (!document.querySelector('[data-nav-dropdown]')) return; fetch('/api/htmx/login-awards', { method: 'POST' }) .then(function(r) { if (!r.ok) return { html: '', repair: false }; var repairBreakDate = r.headers.get('X-Streak-Repair') || ''; return r.text().then(function(html) { return { html: html, repairBreakDate: repairBreakDate }; }); }) .then(function(data) { if (data.html) { var tc = document.getElementById('toast-container'); if (tc) { tc.insertAdjacentHTML('beforeend', data.html); Array.from(tc.children).forEach(function(t) { if (!t.dataset.autoDismiss) { t.dataset.autoDismiss = '1'; setTimeout(function() { t.style.transition = 'opacity 300ms ease-out'; t.style.opacity = '0'; setTimeout(function() { if (t.isConnected) t.remove(); }, 300); }, 3000); } }); } } if (data.repairBreakDate) document.dispatchEvent(new CustomEvent('openStreakRepairModal', { detail: { breakDate: data.repairBreakDate } })); }).catch(function() {}); } if (document.readyState === 'complete') { doLoginAwards(); } else { window.addEventListener('load', doLoginAwards, { once: true }); } })(); (function() { if (window.__appInit) return; window.__appInit = true; // Register service worker if ('serviceWorker' in navigator) { navigator.serviceWorker.register('/sw.js'); } // PWA install prompt window.__pwaPrompt = null; var isIos = /iPad|iPhone|iPod/.test(navigator.userAgent) || (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1); var isSafari = /Safari/i.test(navigator.userAgent) && !/CriOS|FxiOS|Chrome/i.test(navigator.userAgent); var isStandalone = window.navigator.standalone === true || window.matchMedia('(display-mode: standalone)').matches; var isAndroid = /Android/i.test(navigator.userAgent); var isSamsungBrowser = /SamsungBrowser/i.test(navigator.userAgent); window.__isIosSafari = isIos && isSafari && !isStandalone; window.__isSamsungBrowser = isSamsungBrowser && isAndroid && !isStandalone; var pwaDismissed = localStorage.getItem('pwa-install-dismissed'); function showPwaDots() { if (pwaDismissed) return; var ad = document.getElementById('pwa-install-avatar-dot'); var md = document.getElementById('pwa-install-menu-dot'); if (ad) ad.style.display = ''; if (md) md.style.display = ''; } function hidePwaDots() { var ad = document.getElementById('pwa-install-avatar-dot'); var md = document.getElementById('pwa-install-menu-dot'); if (ad) ad.style.display = 'none'; if (md) md.style.display = 'none'; } function dismissPwaInstall() { localStorage.setItem('pwa-install-dismissed', new Date().toISOString()); pwaDismissed = 'true'; hidePwaDots(); } if (window.__isIosSafari || window.__isSamsungBrowser) { setTimeout(function() { var btn = document.getElementById('pwa-install-btn'); if (btn) btn.style.display = ''; showPwaDots(); }, 100); } window.addEventListener('beforeinstallprompt', function(e) { e.preventDefault(); window.__pwaPrompt = e; var btn = document.getElementById('pwa-install-btn'); if (btn) btn.style.display = ''; if (/Android/i.test(navigator.userAgent)) { showPwaDots(); } }); document.addEventListener('click', function(e) { if (!e.target.closest('#pwa-install-btn')) return; dismissPwaInstall(); var dd = e.target.closest('[data-nav-dropdown]'); if (dd) dd.removeAttribute('open'); if (window.__isIosSafari) { var tooltip = document.getElementById('ios-install-tooltip'); var overlay = document.getElementById('ios-install-overlay'); if (tooltip) { var showing = tooltip.style.display !== 'none'; tooltip.style.display = showing ? 'none' : ''; if (overlay) overlay.style.display = showing ? 'none' : ''; } return; } if (window.__isSamsungBrowser) { var sTooltip = document.getElementById('samsung-install-tooltip'); var sOverlay = document.getElementById('samsung-install-overlay'); if (sTooltip) { var sShowing = sTooltip.style.display !== 'none'; sTooltip.style.display = sShowing ? 'none' : ''; if (sOverlay) sOverlay.style.display = sShowing ? 'none' : ''; if (!sShowing) { var isLarge = window.innerWidth >= 768; var arrow = document.getElementById('samsung-tip-arrow'); var dirLabel = document.getElementById('samsung-tip-direction'); if (isLarge) { sTooltip.style.top = '1rem'; sTooltip.style.bottom = 'auto'; if (arrow) arrow.className = 'wt-arrow wt-arrow-top-far-right'; if (dirLabel) dirLabel.textContent = ' above, then '; } else { sTooltip.style.top = 'auto'; sTooltip.style.bottom = '1rem'; if (arrow) arrow.className = 'wt-arrow wt-arrow-bottom-right'; if (dirLabel) dirLabel.textContent = ' below, then '; } } } return; } if (window.__pwaPrompt) { window.__pwaPrompt.prompt(); window.__pwaPrompt.userChoice.then(function(choice) { if (choice.outcome === 'accepted') { window.__pwaPrompt = null; var btn = document.getElementById('pwa-install-btn'); if (btn) btn.style.display = 'none'; } }); } }); // Dismiss install tooltips when tapping outside or on overlay document.addEventListener('click', function(e) { if (e.target.closest('#pwa-install-btn') || e.target.closest('#ios-install-tooltip') || e.target.closest('#samsung-install-tooltip')) return; var tooltip = document.getElementById('ios-install-tooltip'); var overlay = document.getElementById('ios-install-overlay'); if (tooltip) tooltip.style.display = 'none'; if (overlay) overlay.style.display = 'none'; var sTooltip = document.getElementById('samsung-install-tooltip'); var sOverlay = document.getElementById('samsung-install-overlay'); if (sTooltip) sTooltip.style.display = 'none'; if (sOverlay) sOverlay.style.display = 'none'; }); // Dark mode toggle document.addEventListener('click', function(e) { var btn = e.target.closest('[data-theme-toggle]'); if (!btn) return; // Disable transition so button bg changes instantly with the nav btn.style.transition = 'none'; var isDark = document.documentElement.classList.toggle('dark'); localStorage.setItem('theme', isDark ? 'dark' : 'light'); document.cookie='theme='+(isDark?'dark':'light')+';path=/;max-age=31536000;SameSite=Lax'; var isCat = document.documentElement.classList.contains('catppuccin'); document.querySelectorAll('meta[name="theme-color"]').forEach(function(m){m.setAttribute('content', isDark ? (isCat ? '#1e1e2e' : '#111827') : (isCat ? '#dce0e8' : '#ffffff'))}); // Force reflow so the new colors are applied immediately void btn.offsetWidth; // Re-enable transition for subsequent hover interactions requestAnimationFrame(function() { btn.style.transition = ''; }); }); // Color theme selector document.addEventListener('click', function(e) { var btn = e.target.closest('[data-color-theme]'); if (!btn) return; var theme = btn.getAttribute('data-color-theme'); document.documentElement.classList.remove('catppuccin', 'catppuccin-warm'); if (theme === 'catppuccin' || theme === 'catppuccin-warm') { document.documentElement.classList.add(theme); } localStorage.setItem('colorTheme', theme); document.cookie='colorTheme='+theme+';path=/;max-age=31536000;SameSite=Lax'; // Update meta theme-color for the active color theme var isDark = document.documentElement.classList.contains('dark'); var isCatBase = theme === 'catppuccin' || theme === 'catppuccin-warm'; document.querySelectorAll('meta[name="theme-color"]').forEach(function(m){m.setAttribute('content', isDark ? (isCatBase ? '#1e1e2e' : '#111827') : (isCatBase ? '#dce0e8' : '#ffffff'))}); // Update active styling on buttons document.querySelectorAll('[data-color-theme]').forEach(function(b) { var isActive = b.getAttribute('data-color-theme') === theme; b.setAttribute('data-active', isActive ? 'true' : 'false'); }); }); // Nav dropdown — close when clicking outside document.addEventListener('click', function(e) { document.querySelectorAll('details[data-nav-dropdown]').forEach(function(d) { if (d.open && !d.contains(e.target)) d.removeAttribute('open'); }); }); // Nav dropdown — close after hx-boost navigation (main content swap only) document.addEventListener('htmx:afterSwap', function(e) { var target = e.detail.target || e.target; if (!target || target.id !== 'main-content') return; document.querySelectorAll('details[data-nav-dropdown][open]').forEach(function(d) { d.removeAttribute('open'); }); }); // Position a dropdown above or below its trigger depending on available space. // BOTTOM_SAFE accounts for the fixed bottom tab bar (h-14 = 56px) plus margin. function positionActionMenu(trigger, menu) { var BOTTOM_SAFE = 72; var parent = menu.offsetParent || menu.parentElement; if (!parent) return; var triggerRect = trigger.getBoundingClientRect(); var parentRect = parent.getBoundingClientRect(); var spaceBelow = window.innerHeight - triggerRect.bottom - BOTTOM_SAFE; if (spaceBelow < menu.offsetHeight) { menu.style.top = 'auto'; menu.style.bottom = (parentRect.bottom - triggerRect.top) + 'px'; } else { menu.style.top = (triggerRect.bottom - parentRect.top) + 'px'; menu.style.bottom = 'auto'; } } // Action menus (three-dot) — close when clicking outside document.addEventListener('click', function(e) { document.querySelectorAll('details[data-action-menu]').forEach(function(d) { if (d.open && !d.contains(e.target)) d.removeAttribute('open'); }); // Task card action menu trigger — toggle dropdown var trigger = e.target.closest('[data-action-menu-trigger]'); var openedId = null; if (trigger) { var menuId = trigger.getAttribute('data-action-menu-trigger'); var menu = document.getElementById(menuId); if (menu) { menu.hidden = !menu.hidden; if (!menu.hidden) { openedId = menuId; positionActionMenu(trigger, menu); } } } // Close menu when a menu item (button) is clicked var menuItem = !trigger && e.target.closest('[data-action-dropdown] button'); if (menuItem) { var dropdown = menuItem.closest('[data-action-dropdown]'); if (dropdown) dropdown.hidden = true; } // Close any other open action dropdowns document.querySelectorAll('[data-action-dropdown]:not([hidden])').forEach(function(d) { if (d.id !== openedId && !d.contains(e.target)) d.hidden = true; }); }); // Habit card action menus use

— reposition on open using capture-phase toggle document.addEventListener('toggle', function(e) { if (!e.target.matches('details[data-action-menu]') || !e.target.open) return; var summary = e.target.querySelector('summary'); var dropdown = e.target.querySelector(':scope > div'); if (summary && dropdown) positionActionMenu(summary, dropdown); }, true); // Avatar image fallback — hide broken img so the initials div underneath shows. // Deferred until after hydration to avoid attribute mismatches. function __hideImg(img) { img.style.display = 'none'; } var __pendingBrokenImgs = []; document.addEventListener('error', function(e) { var img = e.target; if (!img || img.tagName !== 'IMG') return; if (document.readyState === 'complete') { __hideImg(img); } else { __pendingBrokenImgs.push(img); } }, true); window.addEventListener('load', function() { __pendingBrokenImgs.forEach(__hideImg); __pendingBrokenImgs = []; }, { once: true }); // Optimistic task-completion UI var CHECKMARK = ''; function showClientToast(message, type) { var container = document.getElementById('toast-container'); if (!container) return; var el = document.createElement('div'); var colorClass = type === 'error' ? 'bg-error text-white' : type === 'success' ? 'bg-success text-white' : 'bg-accent text-white'; var icon = type === 'error' ? '✕' : type === 'success' ? '✓' : 'ℹ'; el.className = 'flex items-center gap-3 px-4 py-3 rounded-lg shadow-lg text-sm font-medium animate-slide-in ' + colorClass; el.innerHTML = '' + icon + '' + message + ''; container.appendChild(el); setTimeout(function() { el.style.transition = 'opacity 300ms ease-out'; el.style.opacity = '0'; setTimeout(function() { if (el.isConnected) el.remove(); }, 300); }, 3000); } window.showClientToast = showClientToast; document.addEventListener('click', function(e) { var btn = e.target.closest('[data-complete-btn], [data-uncomplete-btn]'); if (!btn || btn.disabled) return; btn.dataset.origClass = btn.className; btn.dataset.origInner = btn.innerHTML; if ('habitPill' in btn.dataset) { // Habit pill: only swap the checkbox indicator, leave the rest of the pill intact var checkbox = btn.querySelector('[data-habit-checkbox]'); if (checkbox) { var filled = document.createElement('span'); filled.className = 'w-4 h-4 rounded-full bg-accent-secondary flex items-center justify-center flex-shrink-0 transition-colors'; filled.innerHTML = ''; checkbox.replaceWith(filled); } } else { btn.className = btn.dataset.doneClass; btn.innerHTML = btn.hasAttribute('data-uncomplete-btn') ? '' : CHECKMARK; } btn.disabled = true; // Optimistically update the parent task's progress bar (subtasks only) var subtaskList = btn.closest('[id^="subtask-list-"]'); if (subtaskList) { var taskId = subtaskList.id.replace('subtask-list-', ''); var track = document.getElementById('task-progress-' + taskId); var fill = track && track.firstElementChild; if (fill) { var all = subtaskList.querySelectorAll('[data-complete-btn], [data-uncomplete-btn]').length; var done = subtaskList.querySelectorAll('[data-uncomplete-btn]').length + (btn.hasAttribute('data-complete-btn') ? 1 : -1); done = Math.max(0, Math.min(all, done)); var pct = all > 0 ? Math.round((done / all) * 100) : 0; btn.dataset.origProgressWidth = fill.style.width; fill.style.width = pct + '%'; } } }); function revert(elt) { if (!elt || !elt.dataset || !elt.dataset.origClass) return; elt.className = elt.dataset.origClass; elt.innerHTML = elt.dataset.origInner || ''; elt.disabled = false; if (elt.dataset.origProgressWidth !== undefined) { var subtaskList = elt.closest('[id^="subtask-list-"]'); if (subtaskList) { var taskId = subtaskList.id.replace('subtask-list-', ''); var track = document.getElementById('task-progress-' + taskId); var fill = track && track.firstElementChild; if (fill) fill.style.width = elt.dataset.origProgressWidth; } delete elt.dataset.origProgressWidth; } delete elt.dataset.origClass; delete elt.dataset.origInner; } document.addEventListener('htmx:responseError', function(e) { if (e.detail.elt.dataset.origClass) revert(e.detail.elt); var msg = e.detail.xhr && e.detail.xhr.status === 403 ? 'You are not authorized to do that.' : (e.detail.elt.dataset.errorMsg || 'Action failed. Please try again.'); showClientToast(msg, 'error'); }); document.addEventListener('htmx:sendError', function(e) { if (e.detail.elt.dataset.origClass) revert(e.detail.elt); showClientToast('Network error. Please check your connection.', 'error'); }); // Escape cancels subtask add and edit forms document.addEventListener('keydown', function(e) { if (e.key !== 'Escape') return; // Add form — just remove it document.querySelectorAll('[id^="subtask-form-"] form').forEach(function(f) { f.remove(); }); // Edit form — click Cancel to trigger the HTMX restore request document.querySelectorAll('form[id^="task-"][hx-patch]').forEach(function(f) { var cancel = f.querySelector('button[hx-get]'); if (cancel) cancel.click(); }); }); // Sort select navigation — fires when data-sort-nav select changes document.addEventListener('change', function(e) { var el = e.target; if (!el || !el.dataset) return; if (el.dataset.sortNav) { window.location.href = el.dataset.sortNav.replace('sort=', 'sort=' + encodeURIComponent(el.value)); } else if (el.dataset.statusNav) { var url = new URL(el.dataset.statusNav.replace('status=', 'status=' + encodeURIComponent(el.value)), location.origin); if (el.value === 'completed') { url.searchParams.set('sort', 'completed'); url.searchParams.set('dir', 'desc'); } else { if (url.searchParams.get('sort') === 'completed') url.searchParams.set('sort', 'due'); url.searchParams.set('dir', 'asc'); } window.location.href = url.pathname + '?' + url.searchParams.toString(); } else if ('proUpsell' in el.dataset) { if (el.value) { el.value = 'proUpsellOriginal' in el.dataset ? el.dataset.proUpsellOriginal : ''; var proModal = document.getElementById('pro-upsell-modal'); var proIcon = document.getElementById('pro-upsell-icon'); var proBody = document.getElementById('pro-upsell-body'); if (proIcon) proIcon.textContent = el.dataset.proUpsellIcon || '📦'; if (proBody) proBody.textContent = el.dataset.proUpsellBody || ''; if (proModal) proModal.showModal(); } } }); // Pro upsell modal document.addEventListener('openProUpsellModal', function(e) { document.querySelectorAll('.task-deleting').forEach(function(el) { el.classList.remove('task-deleting'); }); var detail = (e && e.detail) || {}; var iconEl = document.getElementById('pro-upsell-icon'); var bodyEl = document.getElementById('pro-upsell-body'); if (iconEl) iconEl.textContent = detail.icon || '📦'; if (bodyEl) bodyEl.textContent = detail.body || "The backlog lets you park tasks you're not ready for without cluttering your active list. Upgrade to unlock it."; var m = document.getElementById('pro-upsell-modal'); if (m) m.showModal(); }); var proClose = document.getElementById('pro-upsell-close'); if (proClose) proClose.onclick = function() { var m = document.getElementById('pro-upsell-modal'); if (m) m.close(); }; // Edit modal — open/close via HX-Trigger response headers document.addEventListener('openEditModal', function() { var m = document.getElementById('task-edit-modal'); if (m) m.showModal(); }); document.addEventListener('closeEditModal', function() { var m = document.getElementById('task-edit-modal'); if (m) m.close(); }); // Habit preset radio — toggle custom days picker + weekly target document.addEventListener('change', function(e) { var radio = e.target; if (!radio || !radio.dataset || !('presetRadio' in radio.dataset)) return; var hidden = document.getElementById('habit-preset-value'); var cd = document.getElementById('habit-custom-days'); var wt = document.getElementById('habit-weekly-target'); if (hidden) hidden.value = radio.value; if (cd) { if (radio.value === 'custom') { cd.classList.remove('hidden'); cd.classList.add('flex'); } else { cd.classList.add('hidden'); cd.classList.remove('flex'); } } if (wt) { if (radio.value === 'custom') { wt.classList.remove('hidden'); } else { wt.classList.add('hidden'); var wtInput = document.getElementById('weekly-target-input'); if (wtInput) wtInput.value = ''; } } habitFormValidate(); }); // Day checkbox changes — update weekly target min and validate document.addEventListener('change', function(e) { var cb = e.target; if (!cb || !cb.dataset || !('dayCheckbox' in cb.dataset)) return; var wtInput = document.getElementById('weekly-target-input'); if (wtInput) { var checked = document.querySelectorAll('[data-day-checkbox]:checked').length; var newMin = Math.max(checked, 1); wtInput.min = String(newMin); if (wtInput.value && parseInt(wtInput.value, 10) < newMin) { wtInput.value = String(newMin); } } habitFormValidate(); }); // Habit form input changes (title, weekly target) — validate document.addEventListener('input', function(e) { var el = e.target; if (el && (el.id === 'weekly-target-input' || el.id === 'habit-title')) habitFormValidate(); }); // Habit form validation function habitFormValidate() { var form = document.querySelector('[data-habit-form]'); if (!form) return; var submit = form.querySelector('[data-habit-submit]'); if (!submit) return; var titleInput = form.querySelector('#habit-title'); var titleVal = titleInput && 'value' in titleInput ? titleInput.value.trim() : ''; if (!titleVal) { submit.disabled = true; return; } var preset = document.getElementById('habit-preset-value'); if (!preset || preset.value !== 'custom') { submit.disabled = false; return; } var isPro = 'isPro' in form.dataset; var checkedDays = form.querySelectorAll('[data-day-checkbox]:checked').length; var wtInput = document.getElementById('weekly-target-input'); var wtVal = wtInput ? parseInt(wtInput.value, 10) : NaN; var hasTarget = !isNaN(wtVal) && wtVal > 0; if (!isPro) { // Free: must have at least 1 day selected submit.disabled = checkedDays < 1; } else { // Pro: must have at least 1 day OR a valid weekly target if (checkedDays === 0 && !hasTarget) { submit.disabled = true; } else if (hasTarget && wtVal < Math.max(checkedDays, 1)) { submit.disabled = true; } else if (hasTarget && wtVal > 7) { submit.disabled = true; } else { submit.disabled = false; } } } // Pro upsell trigger for habit form buttons document.addEventListener('click', function(e) { var btn = e.target.closest('[data-pro-upsell-trigger]'); if (!btn) return; var iconEl = document.getElementById('pro-upsell-icon'); var bodyEl = document.getElementById('pro-upsell-body'); if (iconEl) iconEl.textContent = btn.dataset.upsellIcon || '📦'; if (bodyEl) bodyEl.textContent = btn.dataset.upsellBody || ''; var m = document.getElementById('pro-upsell-modal'); if (m) m.showModal(); }); // Desktop Safari backdrop-filter fix try { var isDesktopSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent) && !/iPad|iPhone|iPod/.test(navigator.userAgent) && !('ontouchend' in document); if (isDesktopSafari) { setTimeout(function() { var navbar = document.querySelector('nav.backdrop-blur'); if (navbar) { navbar.style.webkitBackdropFilter = 'blur(8px)'; navbar.style.backdropFilter = 'blur(8px)'; } }, 200); } } catch(e) {} // Habit modal — open/close via HX-Trigger response headers document.addEventListener('openHabitModal', function() { var m = document.getElementById('habit-modal'); if (m) m.showModal(); }); document.addEventListener('closeHabitModal', function() { var m = document.getElementById('habit-modal'); if (m) m.close(); }); // Set initial button state when habit modal content is loaded document.addEventListener('htmx:afterSwap', function(e) { var target = e.detail ? e.detail.target : e.target; if (!target || target.id !== 'habit-modal-content') return; habitFormValidate(); }); // If persistent subtask form exists, skip fetching a new one and focus the existing input document.addEventListener('htmx:beforeRequest', function(e) { var elt = e.detail.elt; if (!elt) return; var path = elt.getAttribute('hx-get') || ''; var match = path.match(new RegExp('/api/htmx/tasks/([^/]+)/subtasks$')); if (!match) return; var taskId = match[1]; var list = document.getElementById('subtask-list-' + taskId); if (!list) return; var details = list.closest('details'); var form = details && details.querySelector('[data-persistent-subtask-form]'); if (!form) return; e.preventDefault(); if (details && !details.open) details.open = true; var input = form.querySelector('input[name="title"]'); if (input) setTimeout(function() { input.focus(); }, 100); }); // Update progress bar when a subtask is added document.addEventListener('htmx:afterSwap', function(e) { var target = e.detail.target; if (!target || !target.id) return; var match = target.id.match(/^subtask-list-(.+)$/); if (!match) return; var taskId = match[1]; var all = target.querySelectorAll('[data-complete-btn], [data-uncomplete-btn]').length; if (all === 0) return; // Add spacing if this is the first subtask if (!target.classList.contains('space-y-0.5')) { target.className = 'space-y-0.5'; } // Ensure border wrapper exists around subtask list var borderWrap = target.parentNode; if (!borderWrap.hasAttribute('data-subtask-border-wrap')) { var wrapper = document.createElement('div'); wrapper.setAttribute('data-subtask-border-wrap', ''); wrapper.className = 'mt-3 md:border-l-2 md:border-edge-subtle md:pl-3'; target.parentNode.insertBefore(wrapper, target); wrapper.appendChild(target); borderWrap = wrapper; } // Wrap in

if not already wrapped (first subtask on a task with no description) if (!borderWrap.closest('details')) { var details = document.createElement('details'); details.className = 'group/details mt-2'; details.open = true; details.innerHTML = '

View details

'; borderWrap.parentNode.insertBefore(details, borderWrap); details.appendChild(borderWrap); } // Inject persistent subtask form if not already present if (!borderWrap.querySelector('[data-persistent-subtask-form]')) { var formDiv = document.createElement('form'); formDiv.setAttribute('hx-post', '/api/htmx/tasks'); formDiv.setAttribute('hx-target', '#subtask-list-' + taskId); formDiv.setAttribute('hx-swap', 'beforeend'); formDiv.setAttribute('hx-on--after-request', 'if(event.detail.successful)this.reset()'); formDiv.className = 'mt-2 flex gap-2'; formDiv.setAttribute('data-persistent-subtask-form', ''); formDiv.innerHTML = '

'; borderWrap.appendChild(formDiv); htmx.process(formDiv); } // Unhide and update progress bar var track = document.getElementById('task-progress-' + taskId); if (!track) return; track.classList.remove('hidden'); var done = target.querySelectorAll('[data-uncomplete-btn]').length; var pct = Math.round((done / all) * 100); if (track.firstElementChild) track.firstElementChild.style.width = pct + '%'; }); // Clean up persistent form + progress bar when last subtask is deleted document.addEventListener('htmx:beforeSwap', function(e) { var target = e.detail.target; if (!target || !target.id || !target.id.startsWith('task-')) return; var subtaskList = target.closest('[id^="subtask-list-"]'); if (!subtaskList) return; // outerHTML delete: response is empty, element will be removed var isDelete = !e.detail.serverResponse || !e.detail.serverResponse.trim(); if (!isDelete) return; var taskId = subtaskList.id.replace('subtask-list-', ''); // Count subtasks excluding the one being deleted var all = subtaskList.querySelectorAll('[data-complete-btn], [data-uncomplete-btn]'); var remaining = 0; all.forEach(function(btn) { if (!target.contains(btn)) remaining++; }); if (remaining > 0) { // Update progress bar after swap setTimeout(function() { var list = document.getElementById('subtask-list-' + taskId); if (!list) return; var track = document.getElementById('task-progress-' + taskId); if (!track) return; var total = list.querySelectorAll('[data-complete-btn], [data-uncomplete-btn]').length; var done = list.querySelectorAll('[data-uncomplete-btn]').length; var pct = total > 0 ? Math.round((done / total) * 100) : 0; if (track.firstElementChild) track.firstElementChild.style.width = pct + '%'; }, 500); return; } // Last subtask — immediately hide and clean up var borderWrap = subtaskList.parentNode; var details = borderWrap.closest('details') || subtaskList.closest('details'); var hasDescription = details && details.querySelector('p'); // Hide progress bar immediately var track = document.getElementById('task-progress-' + taskId); if (track) { track.classList.add('hidden'); if (track.firstElementChild) track.firstElementChild.style.width = '0%'; } if (!hasDescription && details) { // No description — fade out the entire details block (summary + subtasks + form) details.style.transition = 'opacity 0.2s ease'; details.style.opacity = '0'; setTimeout(function() { var list = document.getElementById('subtask-list-' + taskId); if (!list) return; var emptyDiv = document.createElement('div'); emptyDiv.id = 'subtask-list-' + taskId; var det = list.closest('details'); if (det) { det.replaceWith(emptyDiv); } }, 200); } else { // Has description — only fade out the form, keep details open var form = borderWrap && borderWrap.querySelector('[data-persistent-subtask-form]'); if (form) { form.style.transition = 'opacity 0.2s ease'; form.style.opacity = '0'; setTimeout(function() { form.remove(); }, 200); } setTimeout(function() { var list = document.getElementById('subtask-list-' + taskId); if (!list) return; var bw = list.parentNode; if (bw && bw.hasAttribute('data-subtask-border-wrap')) bw.replaceWith(list); list.className = ''; }, 500); } }); // Auto-remove tasks after 5s when they no longer belong in the current view. // Uses htmx:load (fires on new DOM content) instead of htmx:afterSwap // because outerHTML swap detaches the trigger element, preventing afterSwap // from bubbling to document. document.addEventListener('htmx:load', function(e) { var taskEl = e.detail.elt; if (!taskEl || !taskEl.id) return; var action = taskEl.getAttribute('data-auto-remove'); if (!action) return; // Only handle top-level tasks (not subtasks) if (taskEl.closest('[id^="subtask-list-"]')) return; var isTasksPage = window.location.pathname === '/tasks'; var statusFilter = new URLSearchParams(window.location.search).get('status') || 'active'; // Determine whether this task should be removed from current view var shouldRemove = true; var moveMessage = null; if (action === 'project-moved') { // Always remove; show toast after animation moveMessage = taskEl.getAttribute('data-move-message'); } else { // "all" view: never remove if (isTasksPage && statusFilter === 'all') shouldRemove = false; // Uncomplete on a non-"completed" view: don't remove if (action === 'uncompleted' && !(isTasksPage && statusFilter === 'completed')) shouldRemove = false; // Complete on "completed" view: don't remove (it belongs here) if (action === 'completed' && isTasksPage && statusFilter === 'completed') shouldRemove = false; } if (!shouldRemove) { // Cancel any pending removal from a previous toggle if (taskEl._removeTimeout) { clearTimeout(taskEl._removeTimeout); taskEl._removeTimeout = null; } taskEl.removeAttribute('data-auto-remove'); return; } var timeout = setTimeout(function() { // If user re-toggled (attribute removed), cancel removal if (!taskEl.isConnected || !taskEl.hasAttribute('data-auto-remove')) return; taskEl.style.transition = 'opacity 0.4s ease, max-height 0.5s ease, margin-bottom 0.5s ease'; taskEl.style.overflow = 'hidden'; taskEl.style.maxHeight = taskEl.offsetHeight + 'px'; taskEl.style.opacity = '0'; requestAnimationFrame(function() { requestAnimationFrame(function() { taskEl.style.maxHeight = '0'; taskEl.style.marginBottom = '0'; }); }); setTimeout(function() { if (taskEl.isConnected) taskEl.remove(); if (moveMessage) showClientToast(moveMessage, 'info'); }, 500); }, moveMessage ? 1000 : 3000); taskEl._removeTimeout = timeout; }); // Delete confirmation — intercept hx-confirm before browser dialog var __pendingDeleteRequest = null; document.addEventListener('htmx:confirm', function(e) { if (!e.detail.question) return; e.preventDefault(); __pendingDeleteRequest = e.detail.issueRequest; // Admin delete-user: show typed confirmation dialog if (e.detail.elt && e.detail.elt.dataset && e.detail.elt.dataset.adminDelete) { var admMsg = document.getElementById('admin-delete-confirm-message'); if (admMsg) admMsg.textContent = e.detail.question; var admInput = document.getElementById('admin-delete-confirm-input'); if (admInput) { admInput.value = ''; } var admOk = document.getElementById('admin-delete-confirm-ok'); if (admOk) admOk.disabled = true; var admDlg = document.getElementById('admin-delete-confirm-dialog'); if (admDlg) admDlg.showModal(); if (admInput) admInput.focus(); return; } var msg = document.getElementById('delete-confirm-message'); if (msg) msg.textContent = e.detail.question; var okBtn = document.getElementById('delete-confirm-ok'); if (okBtn) { var actionLabel = (e.detail.elt && e.detail.elt.dataset && e.detail.elt.dataset.confirmAction) || 'Delete'; okBtn.textContent = actionLabel; } var dlg = document.getElementById('delete-confirm-dialog'); if (dlg) dlg.showModal(); }); var delOk = document.getElementById('delete-confirm-ok'); if (delOk) delOk.onclick = function() { var dlg = document.getElementById('delete-confirm-dialog'); if (dlg) dlg.close(); if (__pendingDeleteRequest) { __pendingDeleteRequest(true); __pendingDeleteRequest = null; } }; var delCancel = document.getElementById('delete-confirm-cancel'); if (delCancel) delCancel.onclick = function() { var dlg = document.getElementById('delete-confirm-dialog'); if (dlg) dlg.close(); __pendingDeleteRequest = null; }; // Admin delete-user typed confirmation var admDelInput = document.getElementById('admin-delete-confirm-input'); var admDelOk = document.getElementById('admin-delete-confirm-ok'); if (admDelInput) admDelInput.oninput = function() { if (admDelOk) admDelOk.disabled = admDelInput.value.trim().toLowerCase() !== 'delete user'; }; if (admDelOk) admDelOk.onclick = function() { var dlg = document.getElementById('admin-delete-confirm-dialog'); if (dlg) dlg.close(); if (__pendingDeleteRequest) { __pendingDeleteRequest(true); __pendingDeleteRequest = null; } }; var admDelCancel = document.getElementById('admin-delete-confirm-cancel'); if (admDelCancel) admDelCancel.onclick = function() { var dlg = document.getElementById('admin-delete-confirm-dialog'); if (dlg) dlg.close(); __pendingDeleteRequest = null; }; // Rest-day due-date confirmation var __pendingRestDayForm = null; document.addEventListener('submit', function(e) { var form = e.target; if (!form || form.tagName !== 'FORM') return; var restDay = form.dataset && form.dataset.restDay; if (restDay == null || restDay === '') return; if (form === __pendingRestDayForm) { __pendingRestDayForm = null; return; } var dueInput = form.querySelector('[name="dueDate"]'); if (!dueInput || !dueInput.value) return; var p = dueInput.value.split('-'); if (p.length !== 3) return; var d = new Date(+p[0], +p[1] - 1, +p[2]); if (d.getDay() !== +restDay) return; e.preventDefault(); e.stopImmediatePropagation(); __pendingRestDayForm = form; var rdDlg = document.getElementById('rest-day-confirm-dialog'); if (rdDlg) rdDlg.showModal(); }, true); var rdOk = document.getElementById('rest-day-confirm-ok'); if (rdOk) rdOk.onclick = function() { var dlg = document.getElementById('rest-day-confirm-dialog'); if (dlg) dlg.close(); if (__pendingRestDayForm) { __pendingRestDayForm.dispatchEvent(new Event('submit', { bubbles: true, cancelable: true })); } }; var rdCancel = document.getElementById('rest-day-confirm-cancel'); if (rdCancel) rdCancel.onclick = function() { var dlg = document.getElementById('rest-day-confirm-dialog'); if (dlg) dlg.close(); __pendingRestDayForm = null; }; // Reorder habit pills — completed to end, uncompleted before completed (after 2s delay) var __habitReorderTimers = {}; var __habitOrigState = {}; document.addEventListener('htmx:afterSettle', function(e) { var pill = e.detail.elt; if (!pill || !pill.hasAttribute || !pill.hasAttribute('data-habit-pill')) return; var pillId = pill.id; var isNowComplete = pill.hasAttribute('data-uncomplete-btn'); // Track original state on first toggle if (!(pillId in __habitOrigState)) { __habitOrigState[pillId] = !isNowComplete; } if (__habitReorderTimers[pillId]) clearTimeout(__habitReorderTimers[pillId]); // If toggled back to original state, no reorder needed if (isNowComplete === __habitOrigState[pillId]) { delete __habitReorderTimers[pillId]; delete __habitOrigState[pillId]; return; } __habitReorderTimers[pillId] = setTimeout(function() { delete __habitReorderTimers[pillId]; delete __habitOrigState[pillId]; var el = document.getElementById(pillId); if (!el) return; var container = el.closest('[data-habit-container]'); if (!container) return; var details = container.querySelector('details'); if (el.hasAttribute('data-uncomplete-btn')) { // Just completed — move to end (before details overflow if present) if (details) container.insertBefore(el, details); else container.appendChild(el); } else { // Just uncompleted — move before the first completed pill var firstCompleted = container.querySelector('[data-uncomplete-btn]'); if (firstCompleted) { container.insertBefore(el, firstCompleted); } else if (details) { container.insertBefore(el, details); } else { container.appendChild(el); } } }, 2000); }); // Habit expand/collapse — detect overflow and toggle wrap mode var __habitExpandedState = false; function __habitCheckOverflow() { var container = document.querySelector('[data-habit-container]'); var btn = document.querySelector('[data-habit-expand-btn]'); if (!container || !btn) return; var overflows = container.scrollWidth > container.clientWidth + 1; // Show button if overflowing OR currently expanded (so user can collapse) if (overflows || __habitExpandedState) { btn.setAttribute('data-visible', ''); } else { btn.removeAttribute('data-visible'); } } function __habitExpand(container, btn) { container.classList.add('flex-wrap'); btn.setAttribute('data-visible', ''); btn.setAttribute('data-expanded', 'true'); btn.setAttribute('aria-label', 'Collapse habits'); var label = btn.querySelector('[data-expand-label]'); if (label) label.textContent = 'Collapse'; var icon = btn.querySelector('[data-chevron-icon]'); if (icon) icon.innerHTML = ''; var det = container.querySelector('details'); if (det) { det.setAttribute('open', ''); det.querySelector('summary').classList.add('hidden'); } } function __habitCollapse(container, btn) { container.classList.remove('flex-wrap'); btn.setAttribute('data-expanded', 'false'); btn.setAttribute('aria-label', 'Expand habits'); var label = btn.querySelector('[data-expand-label]'); if (label) label.textContent = 'Expand'; var icon = btn.querySelector('[data-chevron-icon]'); if (icon) icon.innerHTML = ''; var det = container.querySelector('details'); if (det) { det.removeAttribute('open'); det.querySelector('summary').classList.remove('hidden'); } } function __habitApplyExpanded() { var container = document.querySelector('[data-habit-container]'); var btn = document.querySelector('[data-habit-expand-btn]'); if (!container || !btn || !__habitExpandedState) return; __habitExpand(container, btn); } document.addEventListener('click', function(e) { var btn = e.target.closest('[data-habit-expand-btn]'); if (!btn) return; var container = document.querySelector('[data-habit-container]'); if (!container) return; var isExpanded = btn.getAttribute('data-expanded') === 'true'; if (isExpanded) { __habitCollapse(container, btn); __habitExpandedState = false; } else { __habitExpand(container, btn); __habitExpandedState = true; } // Re-check after toggle to update button visibility setTimeout(__habitCheckOverflow, 50); }); // Check overflow on load (deferred to after hydration), after HTMX swaps, and on resize (window.requestIdleCallback || function(cb) { setTimeout(cb, 300); })(__habitCheckOverflow); document.addEventListener('htmx:afterSwap', function(e) { var t = e.detail && e.detail.target; if (!t) return; if (t.hasAttribute && t.hasAttribute('data-habit-container') || t.querySelector && t.querySelector('[data-habit-container]')) __habitApplyExpanded(); }); document.addEventListener('htmx:afterSettle', function() { setTimeout(__habitCheckOverflow, 100); }); window.addEventListener('resize', __habitCheckOverflow); // Sick day modal — open/close document.addEventListener('openSickDayModal', function() { var c = document.getElementById('sick-day-modal-content'); if (c) c.innerHTML = ''; var m = document.getElementById('sick-day-modal'); if (m) m.showModal(); }); // Backfill date picker — extracted so inline hx-on-click stays short window.__selectBackfillDate = function(dateStr) { // Save current selections before switching if (window.__saveBackfillSelections) window.__saveBackfillSelections(); var SEL = 'px-2 py-1.5 text-xs font-medium rounded-lg bg-accent text-white'; var UNSEL = 'px-2 py-1.5 text-xs font-medium rounded-lg text-muted hover:text-body hover:bg-hover'; var btns = document.querySelectorAll('[data-bf-date]'); btns.forEach(function(b) { b.className = b.dataset.bfDate === dateStr ? SEL : UNSEL; }); document.getElementById('backfill-date-input').value = dateStr; // Update current date in state if (window.__backfillState) window.__backfillState.currentDate = dateStr; var list = document.getElementById('backfill-eligible-list'); list.innerHTML = '

'; var tab = window.__backfillDefaultTab || ''; var targetBtn = document.querySelector('[data-bf-date="' + dateStr + '"]'); var tb = (targetBtn && targetBtn.dataset.taskGap) ? '1' : ''; var hb = list.dataset.habitBreak || ''; list.setAttribute('hx-get', '/api/htmx/items/backfill/eligible?date=' + dateStr + '&defaultTab=' + tab + '&taskBreak=' + tb + '&habitBreak=' + hb); // After htmx swaps the eligible list, restore selections var handler = function(evt) { var target = evt.detail.target || evt.target; if (!target || target.id !== 'backfill-eligible-list') return; document.removeEventListener('htmx:afterSwap', handler); if (window.__restoreBackfillSelections) window.__restoreBackfillSelections(); }; document.addEventListener('htmx:afterSwap', handler); htmx.process(list); htmx.trigger(list, 'load'); }; // Backfill modal — open/close document.addEventListener('openBackfillModal', function(e) { window.__backfillDefaultTab = (e.detail && e.detail.defaultTab) || window.__backfillDefaultTab || null; var c = document.getElementById('backfill-modal-content'); if (c) c.innerHTML = ''; var m = document.getElementById('backfill-modal'); if (m) m.showModal(); document.dispatchEvent(new Event('fetchBackfillModal')); }); // Streak repair modal — shown once per day after login if streaks are broken document.addEventListener('openStreakRepairModal', function(e) { var breakDate = (e.detail && e.detail.breakDate) || ''; if (!breakDate) return; if (localStorage.getItem('streakRepairBreakDate') === breakDate) return; localStorage.setItem('streakRepairBreakDate', breakDate); var m = document.getElementById('streak-repair-modal'); if (m) m.showModal(); }); // Streak repair modal — triggered by repair button click (no once-per-day gate) document.addEventListener('showStreakRepairModal', function() { var c = document.getElementById('streak-repair-modal-content'); if (c) c.innerHTML = ''; var m = document.getElementById('streak-repair-modal'); if (m) m.showModal(); }); // Highlight active bottom tab via injected

Sign in to Achiever