Ellpeck/ObsidianSimpleTimeTracker
1
0
Fork 0
mirror of https://github.com/Ellpeck/ObsidianSimpleTimeTracker.git synced 2024-12-18 19:39:22 +01:00
Code Issues Projects Releases Wiki Activity

improve async rendering code

Browse source
This commit is contained in:
Ell 2024-08-09 19:24:10 +02:00
parent 6820640a4f
commit 0ca60318f8
3 changed files with 14 additions and 19 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
src/main.ts
View file

@ -21,28 +21,23 @@ export default class SimpleTimeTrackerPlugin extends Plugin {
this.addSettingTab(new SimpleTimeTrackerSettingsTab(this.app, this)); this.addSettingTab(new SimpleTimeTrackerSettingsTab(this.app, this));
this.registerMarkdownCodeBlockProcessor("simple-time-tracker", (s, e, i) => { this.registerMarkdownCodeBlockProcessor("simple-time-tracker", async (s, e, i) => {
e.empty(); e.empty();
let component = new MarkdownRenderChild(e); let component = new MarkdownRenderChild(e);
let tracker = loadTracker(s); let tracker = loadTracker(s);
// Initial file name // Wrap file name in a function since it can change
let filePath = i.sourcePath; let filePath = i.sourcePath;
// Getter passed to displayTracker since the file name can change
const getFile = () => filePath; const getFile = () => filePath;
// Hook rename events to update the file path // Hook rename events to update the file path
const renameEventRef = this.app.vault.on("rename", (file, oldPath) => { component.registerEvent(this.app.vault.on("rename", (file, oldPath) => {
if (file instanceof TFile && oldPath === filePath) { if (file instanceof TFile && oldPath === filePath) {
filePath = file.path; filePath = file.path;
} }
}); }));
// Register the event to remove on unload await displayTracker(tracker, e, getFile, () => i.getSectionInfo(e), this.settings, component);
component.registerEvent(renameEventRef);
displayTracker(tracker, e, getFile, () => i.getSectionInfo(e), this.settings, component);
i.addChild(component); i.addChild(component);
}); });

16
src/tracker.ts
View file

@ -69,7 +69,7 @@ export async function loadAllTrackers(fileName: string): Promise<{ section: Mark
type GetFile = () => string; type GetFile = () => string;
export function displayTracker(tracker: Tracker, element: HTMLElement, getFile: GetFile, getSectionInfo: () => MarkdownSectionInformation, settings: SimpleTimeTrackerSettings, component: MarkdownRenderChild): void { export async function displayTracker(tracker: Tracker, element: HTMLElement, getFile: GetFile, getSectionInfo: () => MarkdownSectionInformation, settings: SimpleTimeTrackerSettings, component: MarkdownRenderChild): Promise<void> {
element.addClass("simple-time-tracker-container"); element.addClass("simple-time-tracker-container");
// add start/stop controls // add start/stop controls
@ -112,7 +112,7 @@ export function displayTracker(tracker: Tracker, element: HTMLElement, getFile:
createEl("th")); createEl("th"));
for (let entry of orderedEntries(tracker.entries, settings)) for (let entry of orderedEntries(tracker.entries, settings))
addEditableTableRow(tracker, entry, table, newSegmentNameBox, running, getFile, getSectionInfo, settings, 0, component); await addEditableTableRow(tracker, entry, table, newSegmentNameBox, running, getFile, getSectionInfo, settings, 0, component);
// add copy buttons // add copy buttons
let buttons = element.createEl("div", { cls: "simple-time-tracker-bottom" }); let buttons = element.createEl("div", { cls: "simple-time-tracker-bottom" });
@ -334,7 +334,7 @@ function createTableSection(entry: Entry, settings: SimpleTimeTrackerSettings):
return ret; return ret;
} }
function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableElement, newSegmentNameBox: TextComponent, trackerRunning: boolean, getFile: GetFile, getSectionInfo: () => MarkdownSectionInformation, settings: SimpleTimeTrackerSettings, indent: number, component: MarkdownRenderChild): void { async function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableElement, newSegmentNameBox: TextComponent, trackerRunning: boolean, getFile: GetFile, getSectionInfo: () => MarkdownSectionInformation, settings: SimpleTimeTrackerSettings, indent: number, component: MarkdownRenderChild): Promise<void> {
let entryRunning = getRunningEntry(tracker.entries) == entry; let entryRunning = getRunningEntry(tracker.entries) == entry;
let row = table.createEl("tr"); let row = table.createEl("tr");
@ -344,7 +344,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
row.createEl("td", { text: entry.endTime || entry.subEntries ? formatDuration(getDuration(entry), settings) : "" }); row.createEl("td", { text: entry.endTime || entry.subEntries ? formatDuration(getDuration(entry), settings) : "" });
renderNameAsMarkdown(nameField.label, getFile, component); await renderNameAsMarkdown(nameField.label, getFile, component);
let expandButton = new ButtonComponent(nameField.label) let expandButton = new ButtonComponent(nameField.label)
.setClass("clickable-icon") .setClass("clickable-icon")
@ -389,7 +389,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
await saveTracker(tracker, getFile(), getSectionInfo()); await saveTracker(tracker, getFile(), getSectionInfo());
editButton.setIcon("lucide-pencil"); editButton.setIcon("lucide-pencil");
renderNameAsMarkdown(nameField.label, getFile, component); await renderNameAsMarkdown(nameField.label, getFile, component);
} else { } else {
nameField.beginEdit(entry.name); nameField.beginEdit(entry.name);
expandButton.buttonEl.style.display = "none"; expandButton.buttonEl.style.display = "none";
@ -421,7 +421,7 @@ function addEditableTableRow(tracker: Tracker, entry: Entry, table: HTMLTableEle
if (entry.subEntries && !entry.collapsed) { if (entry.subEntries && !entry.collapsed) {
for (let sub of orderedEntries(entry.subEntries, settings)) for (let sub of orderedEntries(entry.subEntries, settings))
addEditableTableRow(tracker, sub, table, newSegmentNameBox, trackerRunning, getFile, getSectionInfo, settings, indent + 1, component); await addEditableTableRow(tracker, sub, table, newSegmentNameBox, trackerRunning, getFile, getSectionInfo, settings, indent + 1, component);
} }
} }
@ -432,8 +432,8 @@ function showConfirm(message: string): Promise<boolean> {
}); });
} }
function renderNameAsMarkdown(label: HTMLSpanElement, getFile: GetFile, component: Component): void { async function renderNameAsMarkdown(label: HTMLSpanElement, getFile: GetFile, component: Component): Promise<void> {
void MarkdownRenderer.renderMarkdown(label.innerHTML, label, getFile(), component); await MarkdownRenderer.renderMarkdown(label.innerHTML, label, getFile(), component);
// rendering wraps it in a paragraph // rendering wraps it in a paragraph
label.innerHTML = label.querySelector("p").innerHTML; label.innerHTML = label.querySelector("p").innerHTML;
} }

2
test-vault/test-markdown.md
View file

@ -1,5 +1,5 @@
Tested for #tag, *italic*, [link](test2), etc: Tested for #tag, *italic*, [link](test2), etc:
```simple-time-tracker ```simple-time-tracker
{"entries":[{"name":"`Segment 1`","startTime":"2022-09-27T19:51:18.000Z","endTime":"2022-09-27T19:51:24.000Z"},{"name":"Segment 2","startTime":"2022-09-27T19:51:25.000Z","endTime":"2022-09-27T19:51:26.000Z"},{"name":"#tag Seqment 3 *add* #tag1 text","startTime":null,"endTime":null,"subEntries":[{"name":"Part 1 #tagp1","startTime":"2024-03-17T11:16:00.382Z","endTime":"2024-03-17T11:16:15.966Z","subEntries":null},{"name":"Part 3","startTime":"2024-03-17T11:17:08.000Z","endTime":"2024-03-17T11:17:24.000Z","subEntries":null}],"collapsed":true},{"name":"#tag3 Segment 4","startTime":null,"endTime":null,"subEntries":[{"name":"Part 1 #tag4","startTime":"2024-03-17T12:22:04.000Z","endTime":"2024-03-17T12:22:16.000Z","subEntries":null},{"name":"#tag5 Part 2 *italic*","startTime":"2024-03-17T12:22:20.000Z","endTime":"2024-03-17T12:22:24.000Z","subEntries":null}]},{"name":"*italic* Segment 5 #tag6 [test2](test2)","startTime":"2024-03-17T12:40:37.000Z","endTime":"2024-03-17T12:40:45.000Z","subEntries":null},{"name":"Segment 6","startTime":"2024-03-27T13:20:56.000Z","endTime":"2024-08-09T16:27:18.029Z","subEntries":null}]} {"entries":[{"name":"`Segment 1`","startTime":"2022-09-27T19:51:18.000Z","endTime":"2022-09-27T19:51:24.000Z"},{"name":"Segment 2","startTime":"2022-09-27T19:51:25.000Z","endTime":"2022-09-27T19:51:26.000Z"},{"name":"#tag Seqment 3 *add* #tag1 text","startTime":null,"endTime":null,"subEntries":[{"name":"Part 1 #tagp1","startTime":"2024-03-17T11:16:00.382Z","endTime":"2024-03-17T11:16:15.966Z","subEntries":null},{"name":"Part 3","startTime":"2024-03-17T11:17:08.000Z","endTime":"2024-03-17T11:17:24.000Z","subEntries":null}],"collapsed":true},{"name":"#tag3 Segment 4","startTime":null,"endTime":null,"subEntries":[{"name":"Part 1 #tag4","startTime":"2024-03-17T12:22:04.000Z","endTime":"2024-03-17T12:22:16.000Z","subEntries":null},{"name":"#tag5 Part 2 *italic*","startTime":"2024-03-17T12:22:20.000Z","endTime":"2024-03-17T12:22:24.000Z","subEntries":null}],"collapsed":true},{"name":"*italic* Segment 5 #tag6 [test2](test2)","startTime":"2024-03-17T12:40:37.000Z","endTime":"2024-03-17T12:40:45.000Z","subEntries":null},{"name":"Segment 6","startTime":"2024-03-27T13:20:56.000Z","endTime":"2024-08-09T16:27:18.029Z","subEntries":null}]}
``` ```