app
Adom Gantt
Public Made by Adomby adom
Interactive Gantt chart viewer for project timelines, with a table view and an analytics page over the same data. Data-driven, dark by default with a print-friendly light mode, and fully editable in the browser: drag bars to move or resize, multi-select and batch-shift dates, manage dependency arrows inline, reorder rows, filter by phase, and undo. One click auto-schedules the whole plan so every dependency lines up finish-to-start on working days, skipping weekends and US federal holidays, push
← Commit history
Publish 0.5.2
5 files changed
+14−5
README.md+1−1@@ -36,7 +36,7 @@ Interactive Gantt chart viewer for project timelines. Data-driven, dark by defau **Cell size.** Days, Weeks, Months, Quarters or Years. Each grain carries its own minimum cell width, sized to the widest label it draws, so a fine grain scrolls rather than squashing and a coarse one stretches to fill. Days adds weekend shading and a full calendar picker. -**Editable milestones.** Drag a milestone sideways to move its date, or click it to edit its name, date and description. In line style the tag on the dashed rule is the handle and the milestone's own row is hidden, since the rule already spans the chart. Diamond style keeps the row.+**Editable milestones.** Drag a milestone sideways to move its date, or click it to edit its name, date and description. Line style is the default: the tag on the dashed rule is the handle and the milestone's own row is hidden, since the rule already spans the chart. Diamond style keeps the row. **Bar notes.** Put a short label on the bar body, the way durations are annotated on a printed plan. Double-click a bar to type one, or use the note field in the editor.
SKILL.md+1−1@@ -166,7 +166,7 @@ rather than a category. - **Project start** in the header. Changing it moves the WHOLE plan: every task, milestone and phase shifts by the same number of days, so durations and gaps are preserved. Revert puts it back to the data file's own start. This is a real edit, recorded and undoable, not a view setting - **Cell size** picker: Days, Weeks, Months, Quarters, Years. Each grain has its own minimum cell width sized to the widest label it draws, so a fine grain scrolls rather than squashing while a coarse one stretches to fill the pane. Day and week positions are exact; month, quarter and year approximate within a month - **Bar notes** put a short label on the bar body. Double-click a bar to type one, or use the note field in the editor-- **Milestones are editable too**: drag one sideways to move its date, or click it for a panel with its name, date and description. In line style the tag on the dashed rule is the handle, and the milestone's grid row is hidden since the rule already carries it. In diamond style the row stays+- **Milestones are editable too**: drag one sideways to move its date, or click it for a panel with its name, date and description. Line style is the default: the tag on the dashed rule is the handle, and the milestone's grid row is hidden since the rule already carries it. Diamond style keeps the row - **Dynamic today marker** shows current date - **Fills the window**: months stretch to the pane width, and stop at 34px so a long plan scrolls rather than squashing - **Milestone style toggle**: diamonds, or dashed vertical rules spanning the chart
gantt.html+10−1@@ -306,7 +306,7 @@ document.title = `${project.title} — adom-gantt`; // ── View preferences (theme, milestone style, start-date override) ── const PREF_KEY = 'adom-gantt:prefs'; const prefs = Object.assign(- { theme: 'dark', msStyle: 'diamond', granularity: 'month' },+ { theme: 'dark', msStyle: 'line', granularity: 'month' }, (() => { try { return JSON.parse(localStorage.getItem(PREF_KEY)) || {}; } catch { return {}; } })() ); function savePrefs(){ try { localStorage.setItem(PREF_KEY, JSON.stringify(prefs)); } catch {} }@@ -482,6 +482,7 @@ function applyOrder(order){ const byKey=new Map();items.forEach(r=>byKey.set(r.id||r.label||r.name, r)); items.length=0;order.forEach(k=>{const r=byKey.get(k);if(r)items.push(r);}); items.forEach((r,i)=>{r._itemIdx=i;labelsEl.appendChild(r._lDiv);bars.appendChild(r._bDiv);if(r.id&&barEls[r.id])barEls[r.id].idx=i;});+ keepTailLast(); drawDeps(); } function undo(){@@ -751,6 +752,13 @@ function relayout(){ // on the chart container, or the today line and the dashed milestone rules would // stretch down through the empty tail. Both columns get the same height or they // drift apart as you scroll.+// Re-appending the rows (a reorder, or applyOrder on load) moves them AFTER the+// label column's tail spacer, which then pushes every label down and detaches the+// labels from their bars. Put the spacer back at the end whenever rows move.+function keepTailLast(){+ if(typeof labelTail!=='undefined'&&labelTail&&labelTail.parentNode) labelsEl.appendChild(labelTail);+ if(typeof barTail!=='undefined'&&barTail&&barTail.parentNode) timelineEl.appendChild(barTail);+} function sizeTailroom(){ const pane=timelineEl.clientHeight||0; const lastRow=items.length?items[items.length-1]._bDiv:null;@@ -1126,6 +1134,7 @@ document.addEventListener('mouseup',()=>{ remainingItems.splice(finalInsert,0,...moveItems); items.length=0;items.push(...remainingItems); items.forEach((r,i)=>{r._itemIdx=i;labelsEl.appendChild(r._lDiv);bars.appendChild(r._bDiv);if(r.id&&barEls[r.id])barEls[r.id].idx=i;});+ keepTailLast(); drawDeps();scheduleSave('drag-reorder');didDrag=true; } reorderState=null;
package.json+1−1@@ -2,7 +2,7 @@ "slug": "adom-gantt", "title": "Adom Gantt", "type": "app",- "version": "0.5.1",+ "version": "0.5.2", "description": "Interactive Gantt chart viewer for project timelines. Data-driven, dark by default with a print-friendly light mode, and fully editable in the browser: drag bars to move or resize, multi-select and batch-shift dates, manage dependency arrows inline, reorder rows, filter by phase, and undo. Every edit is recorded in an append-only changelog so an AI can read what a human changed and build on it. Imports JSON, CSV, MS Project XML and Jira CSV; exports JSON, CSV, SVG and a self-contained HTML snapshot.", "main": "server.js", "bin": {
page.json+1−1@@ -2,7 +2,7 @@ "slug": "adom-gantt", "title": "Adom Gantt", "type": "app",- "version": "0.5.1",+ "version": "0.5.2", "description": "Interactive Gantt chart viewer for project timelines. Data-driven, dark by default with a print-friendly light mode, and fully editable in the browser: drag bars to move or resize, multi-select and batch-shift dates, manage dependency arrows inline, reorder rows, filter by phase, and undo. Every edit is recorded in an append-only changelog so an AI can read what a human changed and build on it. Imports JSON, CSV, MS Project XML and Jira CSV; exports JSON, CSV, SVG and a self-contained HTML snapshot.", "main": "server.js", "bin": {