fixes

src/public/javascripts/dialogs/options/appearance.js

@@ -1,8 +1,6 @@
 import server from "../../services/server.js";
 import utils from "../../services/utils.js";
 import cssLoader from "../../services/css_loader.js";
-import zoomService from "../../services/zoom.js";
-import optionsService from "../../services/options.js";
 import appContext from "../../services/app_context.js";
 
 const TPL = `

src/public/javascripts/services/app_context.js

@@ -34,7 +34,7 @@ import utils from "./utils.js";
 import treeService from "./tree.js";
 import SidePaneContainer from "../widgets/side_pane_container.js";
 import ZoomService from "./zoom.js";
-import SidebarToggle from "../widgets/sidebar_toggle.js";
+import SidepaneToggles from "../widgets/sidebar_toggle.js";
 
 class AppContext {
     constructor() {
@@ -188,7 +188,7 @@ class AppContext {
 
         $centerPane.after(rightPaneContainer.render());
 
-        const sidebarToggleWidget = new SidebarToggle(this);
+        const sidebarToggleWidget = new SidepaneToggles(this);
 
         $centerPane.after(sidebarToggleWidget.render());
 

src/public/javascripts/services/entrypoints.js

@@ -1,5 +1,4 @@
 import utils from "./utils.js";
-import zoomService from "./zoom.js";
 import treeService from "./tree.js";
 import dateNoteService from "./date_notes.js";
 import hoistedNoteService from "./hoisted_note.js";

src/public/javascripts/services/load_results.js

@@ -1,4 +1,4 @@
-export class LoadResults {
+export default class LoadResults {
     constructor(treeCache) {
         this.treeCache = treeCache;
 

src/public/javascripts/services/tree_cache.js

@@ -2,10 +2,7 @@ import Branch from "../entities/branch.js";
 import NoteShort from "../entities/note_short.js";
 import Attribute from "../entities/attribute.js";
 import server from "./server.js";
-import {LoadResults} from "./load_results.js";
 import NoteComplement from "../entities/note_complement.js";
-import appContext from "./app_context.js";
-import options from "./options.js";
 
 /**
  * TreeCache keeps a read only cache of note tree structure in frontend's memory.
@@ -229,137 +226,6 @@ class TreeCache {
 
         return await this.noteComplementPromises[noteId];
     }
-
-    // FIXME does not actually belong here
-    async processSyncRows(syncRows) {
-        const loadResults = new LoadResults(this);
-
-        syncRows.filter(sync => sync.entityName === 'notes').forEach(sync => {
-            const note = this.notes[sync.entityId];
-
-            if (note) {
-                note.update(sync.entity);
-                loadResults.addNote(sync.entityId, sync.sourceId);
-            }
-        });
-
-        syncRows.filter(sync => sync.entityName === 'branches').forEach(sync => {
-            let branch = this.branches[sync.entityId];
-            const childNote = this.notes[sync.entity.noteId];
-            const parentNote = this.notes[sync.entity.parentNoteId];
-
-            if (branch) {
-                if (sync.entity.isDeleted) {
-                    if (childNote) {
-                        childNote.parents = childNote.parents.filter(parentNoteId => parentNoteId !== sync.entity.parentNoteId);
-                        delete childNote.parentToBranch[sync.entity.parentNoteId];
-                    }
-
-                    if (parentNote) {
-                        parentNote.children = parentNote.children.filter(childNoteId => childNoteId !== sync.entity.noteId);
-                        delete parentNote.childToBranch[sync.entity.noteId];
-                    }
-                }
-                else {
-                    branch.update(sync.entity);
-                    loadResults.addBranch(sync.entityId, sync.sourceId);
-
-                    if (childNote) {
-                        childNote.addParent(branch.parentNoteId, branch.branchId);
-                    }
-
-                    if (parentNote) {
-                        parentNote.addChild(branch.noteId, branch.branchId);
-                    }
-                }
-            }
-            else if (!sync.entity.isDeleted) {
-                if (childNote || parentNote) {
-                    branch = new Branch(this, sync.entity);
-                    this.branches[branch.branchId] = branch;
-
-                    loadResults.addBranch(sync.entityId, sync.sourceId);
-
-                    if (childNote) {
-                        childNote.addParent(branch.parentNoteId, branch.branchId);
-                    }
-
-                    if (parentNote) {
-                        parentNote.addChild(branch.noteId, branch.branchId);
-                    }
-                }
-            }
-        });
-
-        syncRows.filter(sync => sync.entityName === 'note_reordering').forEach(sync => {
-            for (const branchId in sync.positions) {
-                const branch = this.branches[branchId];
-
-                if (branch) {
-                    branch.notePosition = sync.positions[branchId];
-                }
-            }
-
-            loadResults.addNoteReordering(sync.entityId, sync.sourceId);
-        });
-
-        // missing reloading the relation target note
-        syncRows.filter(sync => sync.entityName === 'attributes').forEach(sync => {
-            let attribute = this.attributes[sync.entityId];
-            const sourceNote = this.notes[sync.entity.noteId];
-            const targetNote = sync.entity.type === 'relation' && this.notes[sync.entity.value];
-
-            if (attribute) {
-                attribute.update(sync.entity);
-                loadResults.addAttribute(sync.entityId, sync.sourceId);
-
-                if (sync.entity.isDeleted) {
-                    if (sourceNote) {
-                        sourceNote.attributes = sourceNote.attributes.filter(attributeId => attributeId !== attribute.attributeId);
-                    }
-
-                    if (targetNote) {
-                        targetNote.targetRelations = targetNote.targetRelations.filter(attributeId => attributeId !== attribute.value);
-                    }
-                }
-            }
-            else if (!sync.entity.isDeleted) {
-                if (sourceNote || targetNote) {
-                    attribute = new Attribute(this, sync.entity);
-
-                    this.attributes[attribute.attributeId] = attribute;
-
-                    loadResults.addAttribute(sync.entityId, sync.sourceId);
-
-                    if (sourceNote && !sourceNote.attributes.includes(attribute.attributeId)) {
-                        sourceNote.attributes.push(attribute.attributeId);
-                    }
-
-                    if (targetNote && !targetNote.attributes.includes(attribute.attributeId)) {
-                        targetNote.attributes.push(attribute.attributeId);
-                    }
-                }
-            }
-        });
-
-        syncRows.filter(sync => sync.entityName === 'note_contents').forEach(sync => {
-            delete this.noteComplementPromises[sync.entityId];
-
-            loadResults.addNoteContent(sync.entityId, sync.sourceId);
-        });
-
-        syncRows.filter(sync => sync.entityName === 'note_revisions').forEach(sync => {
-            loadResults.addNoteRevision(sync.entityId, sync.noteId, sync.sourceId);
-        });
-
-        syncRows.filter(sync => sync.entityName === 'options').forEach(sync => {
-            options.set(sync.entity.name, sync.entity.value);
-
-            loadResults.addOption(sync.entity.name);
-        });
-
-        appContext.trigger('entitiesReloaded', {loadResults});
-    }
 }
 
 const treeCache = new TreeCache();

src/public/javascripts/services/ws.js

@@ -1,6 +1,10 @@
 import utils from './utils.js';
 import toastService from "./toast.js";
 import server from "./server.js";
+import LoadResults from "./load_results.js";
+import Branch from "../entities/branch.js";
+import Attribute from "../entities/attribute.js";
+import options from "./options.js";
 
 const $outstandingSyncsCount = $("#outstanding-syncs-count");
 
@@ -125,9 +129,7 @@ async function consumeSyncData() {
         syncDataQueue = [];
 
         try {
-            const treeCache = (await import("./tree_cache.js")).default;
+            await processSyncRows(allSyncData);
-
-            await treeCache.processSyncRows(allSyncData);
         }
         catch (e) {
             logError(`Encountered error ${e.message}: ${e.stack}, reloading frontend.`);
@@ -197,6 +199,137 @@ subscribeToMessages(message => {
     }
 });
 
+async function processSyncRows(syncRows) {
+    const loadResults = new LoadResults(this);
+
+    syncRows.filter(sync => sync.entityName === 'notes').forEach(sync => {
+        const note = this.notes[sync.entityId];
+
+        if (note) {
+            note.update(sync.entity);
+            loadResults.addNote(sync.entityId, sync.sourceId);
+        }
+    });
+
+    syncRows.filter(sync => sync.entityName === 'branches').forEach(sync => {
+        let branch = this.branches[sync.entityId];
+        const childNote = this.notes[sync.entity.noteId];
+        const parentNote = this.notes[sync.entity.parentNoteId];
+
+        if (branch) {
+            if (sync.entity.isDeleted) {
+                if (childNote) {
+                    childNote.parents = childNote.parents.filter(parentNoteId => parentNoteId !== sync.entity.parentNoteId);
+                    delete childNote.parentToBranch[sync.entity.parentNoteId];
+                }
+
+                if (parentNote) {
+                    parentNote.children = parentNote.children.filter(childNoteId => childNoteId !== sync.entity.noteId);
+                    delete parentNote.childToBranch[sync.entity.noteId];
+                }
+            }
+            else {
+                branch.update(sync.entity);
+                loadResults.addBranch(sync.entityId, sync.sourceId);
+
+                if (childNote) {
+                    childNote.addParent(branch.parentNoteId, branch.branchId);
+                }
+
+                if (parentNote) {
+                    parentNote.addChild(branch.noteId, branch.branchId);
+                }
+            }
+        }
+        else if (!sync.entity.isDeleted) {
+            if (childNote || parentNote) {
+                branch = new Branch(this, sync.entity);
+                this.branches[branch.branchId] = branch;
+
+                loadResults.addBranch(sync.entityId, sync.sourceId);
+
+                if (childNote) {
+                    childNote.addParent(branch.parentNoteId, branch.branchId);
+                }
+
+                if (parentNote) {
+                    parentNote.addChild(branch.noteId, branch.branchId);
+                }
+            }
+        }
+    });
+
+    syncRows.filter(sync => sync.entityName === 'note_reordering').forEach(sync => {
+        for (const branchId in sync.positions) {
+            const branch = this.branches[branchId];
+
+            if (branch) {
+                branch.notePosition = sync.positions[branchId];
+            }
+        }
+
+        loadResults.addNoteReordering(sync.entityId, sync.sourceId);
+    });
+
+    // missing reloading the relation target note
+    syncRows.filter(sync => sync.entityName === 'attributes').forEach(sync => {
+        let attribute = this.attributes[sync.entityId];
+        const sourceNote = this.notes[sync.entity.noteId];
+        const targetNote = sync.entity.type === 'relation' && this.notes[sync.entity.value];
+
+        if (attribute) {
+            attribute.update(sync.entity);
+            loadResults.addAttribute(sync.entityId, sync.sourceId);
+
+            if (sync.entity.isDeleted) {
+                if (sourceNote) {
+                    sourceNote.attributes = sourceNote.attributes.filter(attributeId => attributeId !== attribute.attributeId);
+                }
+
+                if (targetNote) {
+                    targetNote.targetRelations = targetNote.targetRelations.filter(attributeId => attributeId !== attribute.value);
+                }
+            }
+        }
+        else if (!sync.entity.isDeleted) {
+            if (sourceNote || targetNote) {
+                attribute = new Attribute(this, sync.entity);
+
+                this.attributes[attribute.attributeId] = attribute;
+
+                loadResults.addAttribute(sync.entityId, sync.sourceId);
+
+                if (sourceNote && !sourceNote.attributes.includes(attribute.attributeId)) {
+                    sourceNote.attributes.push(attribute.attributeId);
+                }
+
+                if (targetNote && !targetNote.attributes.includes(attribute.attributeId)) {
+                    targetNote.attributes.push(attribute.attributeId);
+                }
+            }
+        }
+    });
+
+    syncRows.filter(sync => sync.entityName === 'note_contents').forEach(sync => {
+        delete this.noteComplementPromises[sync.entityId];
+
+        loadResults.addNoteContent(sync.entityId, sync.sourceId);
+    });
+
+    syncRows.filter(sync => sync.entityName === 'note_revisions').forEach(sync => {
+        loadResults.addNoteRevision(sync.entityId, sync.noteId, sync.sourceId);
+    });
+
+    syncRows.filter(sync => sync.entityName === 'options').forEach(sync => {
+        options.set(sync.entity.name, sync.entity.value);
+
+        loadResults.addOption(sync.entity.name);
+    });
+
+    const appContext = (await import("./app_context.js")).default;
+    appContext.trigger('entitiesReloaded', {loadResults});
+}
+
 export default {
     logError,
     subscribeToMessages,

src/public/javascripts/widgets/history_navigation.js

@@ -18,11 +18,12 @@ const TPL = `
 
 export default class HistoryNavigationWidget extends BasicWidget {
     doRender() {
-        if (!utils.isElectron()) {
+        if (utils.isElectron()) {
-            return;
+            this.$widget = $(TPL);
+        }
+        else {
+            this.$widget = $("<div>");
         }
-
-        this.$widget = $(TPL);
 
         return this.$widget;
     }

src/public/javascripts/widgets/sidebar_toggle.js

@@ -3,16 +3,16 @@ import splitService from "../services/split.js";
 import BasicWidget from "./basic_widget.js";
 
 const TPL = `
-<div>
+<div class="hide-in-zen-mode">
     <style>
-    #hide-right-pane-button, #show-right-pane-button {
+    .hide-right-pane-button, .show-right-pane-button {
         position: fixed;
         bottom: 10px;
         right: 10px;
         z-index: 1000;
     }
     
-    #hide-left-pane-button, #show-left-pane-button {
+    .hide-left-pane-button, .show-left-pane-button {
         position: fixed;
         bottom: 10px;
         left: 10px;
@@ -20,15 +20,15 @@ const TPL = `
     }
     </style>
     
-    <button id="hide-left-pane-button" class="btn btn-sm icon-button bx bx-chevrons-left hide-in-zen-mode" title="Show sidebar"></button>
+    <button class="hide-left-pane-button btn btn-sm icon-button bx bx-chevrons-left" title="Show sidebar"></button>
-    <button id="show-left-pane-button" class="btn btn-sm icon-button bx bx-chevrons-right hide-in-zen-mode" title="Hide sidebar"></button>
+    <button class="show-left-pane-button btn btn-sm icon-button bx bx-chevrons-right" title="Hide sidebar"></button>
             
-    <button id="hide-right-pane-button" class="btn btn-sm icon-button bx bx-chevrons-right hide-in-zen-mode" title="Hide sidebar"></button>
+    <button class="hide-right-pane-button btn btn-sm icon-button bx bx-chevrons-right" title="Hide sidebar"></button>
-    <button id="show-right-pane-button" class="btn btn-sm icon-button bx bx-chevrons-left hide-in-zen-mode" title="Show sidebar"></button>
+    <button class="show-right-pane-button btn btn-sm icon-button bx bx-chevrons-left" title="Show sidebar"></button>
 </div>
 `;
 
-export default class SidebarToggle extends BasicWidget {
+export default class SidepaneToggles extends BasicWidget {
     constructor(appContext) {
         super(appContext);
 
@@ -41,11 +41,11 @@ export default class SidebarToggle extends BasicWidget {
         this.toggleSidebar('left', options.is('leftPaneVisible'));
         this.toggleSidebar('right', options.is('rightPaneVisible'));
 
-        $("#show-right-pane-button").on('click', () => toggleAndSave('right', true));
+        this.$widget.find(".show-right-pane-button").on('click', () => this.toggleAndSave('right', true));
-        $("#hide-right-pane-button").on('click', () => toggleAndSave('right', false));
+        this.$widget.find(".hide-right-pane-button").on('click', () => this.toggleAndSave('right', false));
 
-        $("#show-left-pane-button").on('click', () => toggleAndSave('left', true));
+        this.$widget.find(".show-left-pane-button").on('click', () => this.toggleAndSave('left', true));
-        $("#hide-left-pane-button").on('click', () => toggleAndSave('left', false));
+        this.$widget.find(".hide-left-pane-button").on('click', () => this.toggleAndSave('left', false));
 
         splitService.setupSplit(this.paneVisible.left, this.paneVisible.right);
 
@@ -54,8 +54,8 @@ export default class SidebarToggle extends BasicWidget {
 
     toggleSidebar(side, show) {
         $(`#${side}-pane`).toggle(show);
-        $(`#show-${side}-pane-button`).toggle(!show);
+        this.$widget.find(`.show-${side}-pane-button`).toggle(!show);
-        $(`#hide-${side}-pane-button`).toggle(show);
+        this.$widget.find(`.hide-${side}-pane-button`).toggle(show);
 
         this.paneVisible[side] = show;
     }

src/public/javascripts/widgets/standard_top_widget.js

@@ -1,6 +1,5 @@
 import BasicWidget from "./basic_widget.js";
 import HistoryNavigationWidget from "./history_navigation.js";
-import keyboardActionService from "../services/keyboard_actions.js";
 import protectedSessionService from "../services/protected_session.js";
 
 const TPL = `

src/public/javascripts/widgets/title_bar_buttons.js

@@ -19,10 +19,6 @@ const TPL = `
 
 export default class TitleBarButtonsWidget extends BasicWidget {
     doRender() {
-        if (!utils.isElectron()) {
-            return;
-        }
-
         if (!options.is('nativeTitleBarVisible')) {
             this.$widget = $(TPL);
             this.$widget.show();