diff --git a/src/tracker.ts b/src/tracker.ts index 54bbb2f..15ffbbe 100644 --- a/src/tracker.ts +++ b/src/tracker.ts @@ -10,6 +10,7 @@ export interface Entry { startTime: string; endTime: string; subEntries: Entry[]; + collapsed?: number; } export async function saveTracker(tracker: Tracker, app: App, fileName: string, section: MarkdownSectionInformation): Promise { @@ -318,6 +319,27 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle renderNameAsMarkdown(nameField.label, getFile, component); + if (entry.subEntries?.length) { + let expandButton = new ButtonComponent(nameField.label) + .setClass("clickable-icon") + .setClass("simple-time-tracker-expand-button") + .setIcon(`chevron-${entry.collapsed ? 'right' : 'down'}`) + .setTooltip("Collapse") + .onClick(async () => { + if (entry.collapsed) { + delete entry.collapsed; + } else { + entry.collapsed = 1; + } + await saveTracker(tracker, this.app, getFile(), getSectionInfo()); + }); + let nameWrapper = nameField.cell.createDiv({cls: "simple-time-tracker-table-expandwrapper"}); + nameWrapper.style.marginLeft = nameField.label.style.marginLeft; + nameField.label.style.marginLeft = null; + nameWrapper.insertBefore(nameField.label, null); + nameWrapper.insertBefore(expandButton.buttonEl, null); + } + let entryButtons = row.createEl("td"); entryButtons.addClass("simple-time-tracker-table-buttons"); new ButtonComponent(entryButtons) @@ -370,7 +392,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle await saveTracker(tracker, this.app, getFile(), getSectionInfo()); }); - if (entry.subEntries) { + if (entry.subEntries && !entry.collapsed) { for (let sub of orderedEntries(entry.subEntries, settings)) addEditableTableRow(tracker, sub, table, newSegmentNameBox, trackerRunning, getFile, getSectionInfo, settings, indent + 1, component); } diff --git a/styles.css b/styles.css index 96d83fa..06b25cc 100644 --- a/styles.css +++ b/styles.css @@ -79,3 +79,20 @@ .simple-time-tracker-table tr:hover { background-color: var(--background-modifier-hover); } + +.simple-time-tracker-table :is(td,th):first-child { + /* HACKY hardcoded 2em to make room for expand/collapse button */ + padding-left: 2em; +} + +.simple-time-tracker-table-expandwrapper { + position: relative; +} + +.simple-time-tracker-expand-button { + position: absolute; + /* HACKY there should be a better way to position this */ + left: 0; + top: 50%; + transform: translate(-100%, -50%); +}