diff --git a/src/public/app/services/note_list_renderer.ts b/src/public/app/services/note_list_renderer.ts index 6fd9d2ec7..4229889a8 100644 --- a/src/public/app/services/note_list_renderer.ts +++ b/src/public/app/services/note_list_renderer.ts @@ -1,16 +1,43 @@ import type FNote from "../entities/fnote.js"; +import CalendarView from "../widgets/view_widgets/calendar_view.js"; import ListOrGridView from "../widgets/view_widgets/list_or_grid_view.js"; import type ViewMode from "../widgets/view_widgets/view_mode.js"; export default class NoteListRenderer { - private viewMode: ViewMode; + private viewType: string; + private viewMode: ViewMode | null; constructor($parent: JQuery, parentNote: FNote, noteIds: string[], showNotePath: boolean = false) { - this.viewMode = new ListOrGridView($parent, parentNote, noteIds, showNotePath); + console.log("Parent note is ", parentNote); + this.viewType = this.#getViewType(parentNote); + console.log("View type is ", this.viewType); + + if (this.viewType === "list" || this.viewType === "grid") { + this.viewMode = new ListOrGridView(this.viewType, $parent, parentNote, noteIds, showNotePath); + } else if (this.viewType === "calendar") { + this.viewMode = new CalendarView(this.viewType, $parent, parentNote, noteIds, showNotePath); + } else { + this.viewMode = null; + } + } + + #getViewType(parentNote: FNote): string { + const viewType = parentNote.getLabelValue("viewType"); + + if (!["list", "grid", "calendar"].includes(viewType || "")) { + // when not explicitly set, decide based on the note type + return parentNote.type === "search" ? "list" : "grid"; + } else { + return viewType as string; + } } async renderList() { + if (!this.viewMode) { + return null; + } + return await this.viewMode.renderList(); } diff --git a/src/public/app/widgets/view_widgets/calendar_view.ts b/src/public/app/widgets/view_widgets/calendar_view.ts new file mode 100644 index 000000000..6ae367735 --- /dev/null +++ b/src/public/app/widgets/view_widgets/calendar_view.ts @@ -0,0 +1,33 @@ +import type FNote from "../../entities/fnote.js"; +import ViewMode from "./view_mode.js"; + +const TPL = ` +
+ + + Hello world. +
+`; + +export default class CalendarView extends ViewMode { + + private $root: JQuery; + + constructor(viewType: string, $parent: JQuery, parentNote: FNote, noteIds: string[], showNotePath: boolean = false) { + super($parent, parentNote, noteIds, showNotePath); + + this.$root = $(TPL); + $parent.append(this.$root); + } + + async renderList(): Promise | undefined> { + return this.$root; + } + +} diff --git a/src/public/app/widgets/view_widgets/list_or_grid_view.ts b/src/public/app/widgets/view_widgets/list_or_grid_view.ts index 96d4037a4..b5ebc5e02 100644 --- a/src/public/app/widgets/view_widgets/list_or_grid_view.ts +++ b/src/public/app/widgets/view_widgets/list_or_grid_view.ts @@ -172,12 +172,10 @@ class ListOrGridView extends ViewMode { /* * We're using noteIds so that it's not necessary to load all notes at once when paging */ - constructor($parent: JQuery, parentNote: FNote, noteIds: string[], showNotePath: boolean = false) { + constructor(viewType: string, $parent: JQuery, parentNote: FNote, noteIds: string[], showNotePath: boolean = false) { super($parent, parentNote, noteIds, showNotePath); this.$noteList = $(TPL); - - // note list must be added to the DOM immediately, otherwise some functionality scripting (canvas) won't work - $parent.empty(); + this.viewType = viewType; this.parentNote = parentNote; const includedNoteIds = this.getIncludedNoteIds(); @@ -197,13 +195,6 @@ class ListOrGridView extends ViewMode { this.pageSize = 20; } - this.viewType = parentNote.getLabelValue("viewType"); - - if (!["list", "grid"].includes(this.viewType || "")) { - // when not explicitly set, decide based on the note type - this.viewType = parentNote.type === "search" ? "list" : "grid"; - } - this.$noteList.addClass(`${this.viewType}-view`); this.showNotePath = showNotePath; diff --git a/src/public/app/widgets/view_widgets/view_mode.ts b/src/public/app/widgets/view_widgets/view_mode.ts index c854bd37f..31dfee8fd 100644 --- a/src/public/app/widgets/view_widgets/view_mode.ts +++ b/src/public/app/widgets/view_widgets/view_mode.ts @@ -3,7 +3,8 @@ import type FNote from "../../entities/fnote.js"; export default abstract class ViewMode { constructor($parent: JQuery, parentNote: FNote, noteIds: string[], showNotePath: boolean = false) { - + // note list must be added to the DOM immediately, otherwise some functionality scripting (canvas) won't work + $parent.empty(); } abstract renderList(): Promise | undefined>;