lazy loading of note complement

src/public/javascripts/dialogs/note_info.js

@@ -9,14 +9,16 @@ const $type = $("#note-info-type");
 const $mime = $("#note-info-mime");
 const $okButton = $("#note-info-ok-button");
 
-export function showDialog() {
+export async function showDialog() {
     utils.closeActiveDialog();
 
     glob.activeDialog = $dialog;
 
     $dialog.modal();
 
-    const {note, noteComplement} = appContext.getActiveTabContext();
+    const activeTabContext = appContext.getActiveTabContext();
+    const {note} = activeTabContext;
+    const noteComplement = await activeTabContext.getNoteComplement();
 
     $noteId.text(note.noteId);
     $dateCreated.text(noteComplement.dateCreated);

src/public/javascripts/services/note_detail.js

@@ -1,7 +1,5 @@
 import server from './server.js';
-import ws from "./ws.js";
+import NoteComplement from "../entities/note_complement.js";
-import treeCache from "./tree_cache.js";
-import NoteComplement from "../entities/note_full.js";
 import appContext from "./app_context.js";
 
 function getActiveEditor() {
@@ -16,6 +14,10 @@ function getActiveEditor() {
 }
 
 async function loadNoteComplement(noteId) {
+    if (!noteId) {
+        return null;
+    }
+
     const row = await server.get('notes/' + noteId);
 
     return new NoteComplement(row);

src/public/javascripts/services/tab_context.js

@@ -51,9 +51,6 @@ class TabContext extends Component {
         /** @property {NoteShort} */
         this.note = await treeCache.getNote(noteId);
 
-        /** @property {NoteComplement} */
-        this.noteComplement = await noteDetailService.loadNoteComplement(noteId);
-
         //this.cleanup(); // esp. on windows autocomplete is not getting closed automatically
 
         setTimeout(async () => {
@@ -78,6 +75,23 @@ class TabContext extends Component {
         this.trigger('openTabsChanged');
     }
 
+    get noteId() {
+        return this.note && this.note.noteId;
+    }
+
+    /** @return {NoteComplement} */
+    async getNoteComplement() {
+        if (!this.noteId) {
+            return null;
+        }
+
+        if (!this.noteComplementPromise) {
+            this.noteComplementPromise = noteDetailService.loadNoteComplement(this.noteId);
+        }
+
+        return await this.noteComplementPromise;
+    }
+
     async remove() {
         await this.trigger('beforeTabRemove', {tabId: this.tabId}, true);
 

src/public/javascripts/widgets/note_detail.js

@@ -37,8 +37,9 @@ export default class NoteDetailWidget extends TabAwareWidget {
         this.typeWidgetPromises = {};
 
         this.spacedUpdate = new SpacedUpdate(async () => {
-            const {noteComplement, note} = this.tabContext;
+            const {note} = this.tabContext;
             const {noteId} = note;
+            const noteComplement = await this.tabContext.getNoteComplement();
 
             // FIXME hack
             const dto = note.dto;
@@ -102,14 +103,14 @@ export default class NoteDetailWidget extends TabAwareWidget {
         let foundType;
 
         do {
-            foundType = this.type = this.getWidgetType();
+            foundType = this.type = await this.getWidgetType();
 
             if (!(this.type in this.typeWidgetPromises)) {
                 this.typeWidgetPromises[this.type] = this.initWidgetType(this.type);
             }
 
             await this.typeWidgetPromises[this.type];
-        } while (foundType !== this.getWidgetType());
+        } while (foundType !== await this.getWidgetType());
     }
 
     setupClasses() {
@@ -150,7 +151,7 @@ export default class NoteDetailWidget extends TabAwareWidget {
         typeWidget.eventReceived('setTabContext', {tabContext: this.tabContext});
     }
 
-    getWidgetType(disableAutoBook) {
+    async getWidgetType(disableAutoBook) {
         const note = this.tabContext.note;
 
         if (!note) {
@@ -160,11 +161,15 @@ export default class NoteDetailWidget extends TabAwareWidget {
         let type = note.type;
 
         if (type === 'text' && !disableAutoBook
-            && utils.isHtmlEmpty(this.tabContext.noteComplement.content)
+            && note.hasChildren()
-            && note.hasChildren()) {
+            && utils.isDesktop()) {
 
+            const noteComplement = await this.tabContext.getNoteComplement();
+
+            if (utils.isHtmlEmpty(noteComplement.content)) {
                 type = 'book';
             }
+        }
 
         if (note.isProtected && !protectedSessionHolder.isProtectedSessionAvailable()) {
             type = 'protected-session';

src/public/javascripts/widgets/note_info.js

@@ -42,14 +42,14 @@ class NoteInfoWidget extends StandardWidget {
         this.$body.html(TPL);
     }
 
-    refreshWithNote(note) {
+    async refreshWithNote(note) {
         const $noteId = this.$body.find(".note-info-note-id");
         const $dateCreated = this.$body.find(".note-info-date-created");
         const $dateModified = this.$body.find(".note-info-date-modified");
         const $type = this.$body.find(".note-info-type");
         const $mime = this.$body.find(".note-info-mime");
 
-        const {noteComplement} = this.tabContext;
+        const noteComplement = await this.tabContext.getNoteComplement();
 
         $noteId.text(note.noteId);
         $dateCreated

src/public/javascripts/widgets/type_widgets/code.js

@@ -71,11 +71,13 @@ export default class CodeTypeWidget extends TypeWidget {
         this.codeEditor.on('change', () => this.spacedUpdate.scheduleUpdate());
     }
     
-    doRefresh(note) {
+    async doRefresh(note) {
+        const noteComplement = await this.tabContext.getNoteComplement();
+
         this.spacedUpdate.allowUpdateWithoutChange(() => {
             // CodeMirror breaks pretty badly on null so even though it shouldn't happen (guarded by consistency check)
             // we provide fallback
-            this.codeEditor.setValue(this.tabContext.noteComplement.content || "");
+            this.codeEditor.setValue(noteComplement.content || "");
 
             const info = CodeMirror.findModeByMIME(note.mime);
 

src/public/javascripts/widgets/type_widgets/file.js

@@ -128,9 +128,11 @@ export default class FileTypeWidget extends TypeWidget {
         this.$fileSize.text(note.contentLength + " bytes");
         this.$fileType.text(note.mime);
 
-        if (this.tabContext.noteComplement.content) {
+        const noteComplement = await this.tabContext.getNoteComplement();
+
+        if (noteComplement.content) {
             this.$previewContent.show();
-            this.$previewContent.text(this.tabContext.noteComplement.content);
+            this.$previewContent.text(noteComplement.content);
         }
         else {
             this.$previewContent.empty().hide();

src/public/javascripts/widgets/type_widgets/image.js

@@ -132,7 +132,7 @@ class NoteDetailImage extends TypeWidget {
         this.$fileSize.text(note.contentLength + " bytes");
         this.$fileType.text(note.mime);
 
-        const imageHash = this.tabContext.noteComplement.utcDateModified.replace(" ", "_");
+        const imageHash = utils.randomString(10);
 
         this.$imageView.prop("src", `api/images/${note.noteId}/${note.title}?${imageHash}`);
     }

src/public/javascripts/widgets/type_widgets/relation_map.js

@@ -240,7 +240,7 @@ export default class RelationMapTypeWidget extends TypeWidget {
         }
     }
 
-    loadMapData() {
+    async loadMapData() {
         this.mapData = {
             notes: [],
             // it is important to have this exact value here so that initial transform is same as this
@@ -254,9 +254,11 @@ export default class RelationMapTypeWidget extends TypeWidget {
             }
         };
 
-        if (this.tabContext.noteComplement.content) {
+        const noteComplement = await this.tabContext.getNoteComplement();
+
+        if (noteComplement.content) {
             try {
-                this.mapData = JSON.parse(this.tabContext.noteComplement.content);
+                this.mapData = JSON.parse(noteComplement.content);
             } catch (e) {
                 console.log("Could not parse content: ", e);
             }
@@ -272,7 +274,7 @@ export default class RelationMapTypeWidget extends TypeWidget {
     }
 
     async doRefresh(note) {
-        this.loadMapData();
+        await this.loadMapData();
 
         this.initJsPlumbInstance();
 

src/public/javascripts/widgets/type_widgets/search.js

@@ -39,13 +39,14 @@ export default class SearchTypeWidget extends TypeWidget {
         return this.$widget;
     }
 
-    doRefresh(note) {
+    async doRefresh(note) {
         this.$help.html(searchNotesService.getHelpText());
 
         this.$component.show();
 
         try {
-            const json = JSON.parse(this.tabContext.noteComplement.content);
+            const noteComplement = await this.tabContext.getNoteComplement();
+            const json = JSON.parse(noteComplement.content);
 
             this.$searchString.val(json.searchString);
         }

src/public/javascripts/widgets/type_widgets/text.js

@@ -139,8 +139,10 @@ export default class TextTypeWidget extends TypeWidget {
     async doRefresh(note) {
         this.textEditor.isReadOnly = await note.hasLabel('readOnly');
 
+        const noteComplement = await this.tabContext.getNoteComplement();
+
         this.spacedUpdate.allowUpdateWithoutChange(() => {
-            this.textEditor.setData(this.tabContext.noteComplement.content);
+            this.textEditor.setData(noteComplement.content);
         });
     }