refactoring of context menu items, got rid of ContextMenuItemsContainer

.idea/dataSources/a2c75661-f9e2-478f-a69f-6a9409e69997.xml

@@ -76,7 +76,6 @@ contentHash UNINDEXED</Arguments>
     <index id="31" parent="6" name="sqlite_autoindex_api_tokens_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>apiTokenId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="32" parent="6">
@@ -145,25 +144,20 @@ contentHash UNINDEXED</Arguments>
     <index id="44" parent="7" name="sqlite_autoindex_attributes_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>attributeId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <index id="45" parent="7" name="IDX_attributes_noteId_index">
       <ColNames>noteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="46" parent="7" name="IDX_attributes_name_value">
       <ColNames>name
 value</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="47" parent="7" name="IDX_attributes_name_index">
       <ColNames>name</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="48" parent="7" name="IDX_attributes_value_index">
       <ColNames>value</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <key id="49" parent="7">
       <ColNames>attributeId</ColNames>
@@ -224,21 +218,17 @@ value</ColNames>
     <index id="60" parent="8" name="sqlite_autoindex_branches_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>branchId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <index id="61" parent="8" name="IDX_branches_noteId_parentNoteId">
       <ColNames>noteId
 parentNoteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="62" parent="8" name="IDX_branches_noteId">
       <ColNames>noteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="63" parent="8" name="IDX_branches_parentNoteId">
       <ColNames>parentNoteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <key id="64" parent="8">
       <ColNames>branchId</ColNames>
@@ -266,7 +256,6 @@ parentNoteId</ColNames>
     <index id="69" parent="9" name="sqlite_autoindex_event_log_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>eventId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="70" parent="9">
@@ -319,16 +308,13 @@ parentNoteId</ColNames>
     <index id="79" parent="10" name="sqlite_autoindex_links_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>linkId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <index id="80" parent="10" name="IDX_links_noteId_index">
       <ColNames>noteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="81" parent="10" name="IDX_links_targetNoteId_index">
       <ColNames>targetNoteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <key id="82" parent="10">
       <ColNames>linkId</ColNames>
@@ -375,12 +361,10 @@ parentNoteId</ColNames>
     <index id="90" parent="11" name="sqlite_autoindex_note_contents_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>noteContentId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <index id="91" parent="11" name="IDX_note_contents_noteId">
       <ColNames>noteId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="92" parent="11">
@@ -398,7 +382,6 @@ parentNoteId</ColNames>
     <index id="95" parent="12" name="sqlite_autoindex_note_fulltext_config_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>k</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="96" parent="12">
@@ -468,7 +451,6 @@ parentNoteId</ColNames>
       <NameSurrogate>1</NameSurrogate>
       <ColNames>segid
 term</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="114" parent="16">
@@ -532,20 +514,16 @@ term</ColNames>
     <index id="125" parent="17" name="sqlite_autoindex_note_revisions_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>noteRevisionId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <index id="126" parent="17" name="IDX_note_revisions_noteId">
       <ColNames>noteId</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="127" parent="17" name="IDX_note_revisions_dateModifiedFrom">
       <ColNames>dateModifiedFrom</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <index id="128" parent="17" name="IDX_note_revisions_dateModifiedTo">
       <ColNames>dateModifiedTo</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <key id="129" parent="17">
       <ColNames>noteRevisionId</ColNames>
@@ -606,7 +584,6 @@ term</ColNames>
     <index id="139" parent="18" name="sqlite_autoindex_notes_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>noteId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="140" parent="18">
@@ -648,7 +625,6 @@ term</ColNames>
     <index id="147" parent="19" name="sqlite_autoindex_options_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>name</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="148" parent="19">
@@ -684,7 +660,6 @@ term</ColNames>
     <index id="154" parent="20" name="sqlite_autoindex_recent_notes_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>branchId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="155" parent="20">
@@ -705,7 +680,6 @@ term</ColNames>
     <index id="158" parent="21" name="sqlite_autoindex_source_ids_1">
       <NameSurrogate>1</NameSurrogate>
       <ColNames>sourceId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <key id="159" parent="21">
@@ -768,12 +742,10 @@ term</ColNames>
     <index id="172" parent="24" name="IDX_sync_entityName_entityId">
       <ColNames>entityName
 entityId</ColNames>
-      <ColumnCollations></ColumnCollations>
       <Unique>1</Unique>
     </index>
     <index id="173" parent="24" name="IDX_sync_syncDate">
       <ColNames>syncDate</ColNames>
-      <ColumnCollations></ColumnCollations>
     </index>
     <key id="174" parent="24">
       <ColNames>id</ColNames>

src/public/javascripts/mobile.js

@@ -4,7 +4,6 @@ import dragAndDropSetup from "./services/drag_and_drop.js";
 import treeCache from "./services/tree_cache.js";
 import treeBuilder from "./services/tree_builder.js";
 import contextMenuWidget from "./services/context_menu.js";
-import ContextMenuItemsContainer from "./services/context_menu_items_container.js";
 import treeChangesService from "./services/branches.js";
 import utils from "./services/utils.js";
 import treeUtils from "./services/tree_utils.js";
@@ -78,17 +77,16 @@ $("#note-menu-button").click(async e => {
     const parentNote = await treeCache.getNote(branch.parentNoteId);
     const isNotRoot = note.noteId !== 'root';
 
-    const itemsContainer = new ContextMenuItemsContainer([
+    const items = [
-        {title: "Insert note after", cmd: "insertNoteAfter", uiIcon: "plus"},
+        { title: "Insert note after", cmd: "insertNoteAfter", uiIcon: "plus",
-        {title: "Insert child note", cmd: "insertChildNote", uiIcon: "plus"},
+            enabled: isNotRoot && parentNote.type !== 'search' },
-        {title: "Delete this note", cmd: "delete", uiIcon: "trash"}
+        { title: "Insert child note", cmd: "insertChildNote", uiIcon: "plus",
-    ]);
+            enabled: note.type !== 'search' },
+        { title: "Delete this note", cmd: "delete", uiIcon: "trash",
+            enabled: isNotRoot && parentNote.type !== 'search' }
+    ];
 
-    itemsContainer.enableItem("insertNoteAfter", isNotRoot && parentNote.type !== 'search');
+    contextMenuWidget.initContextMenu(e, items, (event, cmd) => {
-    itemsContainer.enableItem("insertChildNote", note.type !== 'search');
-    itemsContainer.enableItem("delete", isNotRoot && parentNote.type !== 'search');
-
-    contextMenuWidget.initContextMenu(e, itemsContainer, (event, cmd) => {
         if (cmd === "insertNoteAfter") {
             const parentNoteId = node.data.parentNoteId;
             const isProtected = treeUtils.getParentProtectedStatus(node);

src/public/javascripts/services/context_menu.js

@@ -1,6 +1,6 @@
 const $contextMenuContainer = $("#context-menu-container");
 
-function initContextMenu(event, itemContainer, selectContextMenuItem) {
+function initContextMenu(event, contextMenuItems, selectContextMenuItem) {
     event.stopPropagation();
 
     $contextMenuContainer.empty();
@@ -57,7 +57,7 @@ function initContextMenu(event, itemContainer, selectContextMenuItem) {
         }
     }
 
-    addItems($contextMenuContainer, itemContainer.getItems());
+    addItems($contextMenuContainer, contextMenuItems);
 
     // code below tries to detect when dropdown would overflow from page
     // in such case we'll position it above click coordinates so it will fit into client

src/public/javascripts/services/context_menu_items_container.js

@@ -1,28 +0,0 @@
-class ContextMenuItemsContainer {
-    constructor(items) {
-        // clone the item array and the items themselves
-        this.items = items.map(item => Object.assign({}, item));
-    }
-
-    hideItem(cmd, hidden = true) {
-        if (hidden) {
-            this.items = this.items.filter(item => item.cmd !== cmd);
-        }
-    }
-
-    enableItem(cmd, enabled) {
-        const item = this.items.find(item => item.cmd === cmd);
-
-        if (!item) {
-            throw new Error(`Command ${cmd} has not been found!`);
-        }
-
-        item.enabled = enabled;
-    }
-
-    getItems() {
-        return this.items;
-    }
-}
-
-export default ContextMenuItemsContainer;

src/public/javascripts/services/note_detail_relation_map.js

@@ -9,7 +9,6 @@ import attributeAutocompleteService from "./attribute_autocomplete.js";
 import promptDialog from "../dialogs/prompt.js";
 import infoDialog from "../dialogs/info.js";
 import confirmDialog from "../dialogs/confirm.js";
-import ContextMenuItemsContainer from "./context_menu_items_container.js";
 
 const $component = $("#note-detail-relation-map");
 const $relationMapContainer = $("#relation-map-container");
@@ -314,9 +313,9 @@ function connectionContextMenuHandler(connection, event) {
     event.preventDefault();
     event.stopPropagation();
 
-    const contextMenuItemsContainer = new ContextMenuItemsContainer([ {title: "Remove relation", cmd: "remove", uiIcon: "trash"} ]);
+    const items = [ {title: "Remove relation", cmd: "remove", uiIcon: "trash"} ];
 
-    contextMenuWidget.initContextMenu(event, contextMenuItemsContainer, async (event, cmd) => {
+    contextMenuWidget.initContextMenu(event, items, async (event, cmd) => {
         if (cmd === 'remove') {
             if (!await confirmDialog.confirm("Are you sure you want to remove the relation?")) {
                 return;
@@ -390,12 +389,12 @@ async function connectionCreatedHandler(info, originalEvent) {
 }
 
 $relationMapContainer.on("contextmenu", ".note-box", e => {
-    const contextMenuItemsContainer = new ContextMenuItemsContainer([
+    const items = [
         {title: "Remove note", cmd: "remove", uiIcon: "trash"},
         {title: "Edit title", cmd: "edit-title", uiIcon: "pencil"},
-    ]);
+    ];
 
-    contextMenuWidget.initContextMenu(e, contextMenuItemsContainer, noteContextMenuHandler);
+    contextMenuWidget.initContextMenu(e, items, noteContextMenuHandler);
 
     return false;
 });

src/public/javascripts/services/tree.js

@@ -464,8 +464,8 @@ function initFancyTree(tree) {
     });
 
     $tree.on('contextmenu', '.fancytree-node', function(e) {
-        treeContextMenuService.getContextMenuItems(e).then(contextMenuItemContainer => {
+        treeContextMenuService.getContextMenuItems(e).then(contextMenuItems => {
-            contextMenuWidget.initContextMenu(e, contextMenuItemContainer, treeContextMenuService.selectContextMenuItem);
+            contextMenuWidget.initContextMenu(e, contextMenuItems, treeContextMenuService.selectContextMenuItem);
         });
 
         return false; // blocks default browser right click menu

src/public/javascripts/services/tree_context_menu.js

@@ -11,7 +11,6 @@ import infoService from "./info.js";
 import treeCache from "./tree_cache.js";
 import syncService from "./sync.js";
 import hoistedNoteService from './hoisted_note.js';
-import ContextMenuItemsContainer from './context_menu_items_container.js';
 
 let clipboardIds = [];
 let clipboardMode = null;
@@ -92,34 +91,7 @@ function getNoteTypeItems(baseCmd) {
     ];
 }
 
-function getTopLevelItems(note) {
+async function getTopLevelItems(event) {
-    return [
-        { title: "Insert note after <kbd>Ctrl+O</kbd>", cmd: "insertNoteAfter", uiIcon: "plus", items: note.type !== 'search' ? getNoteTypeItems("insertNoteAfter") : null },
-        { title: "Insert child note <kbd>Ctrl+P</kbd>", cmd: "insertChildNote", uiIcon: "plus", items: note.type !== 'search' ? getNoteTypeItems("insertChildNote") : null },
-        { title: "Delete <kbd>Delete</kbd>", cmd: "delete", uiIcon: "trash" },
-        { title: "----" },
-        { title: "Hoist note <kbd>Ctrl-H</kbd>", cmd: "hoist", uiIcon: "arrow-up" },
-        { title: "Unhoist note <kbd>Ctrl-H</kbd>", cmd: "unhoist", uiIcon: "arrow-up" },
-        { title: "Edit branch prefix <kbd>F2</kbd>", cmd: "editBranchPrefix", uiIcon: "pencil" },
-        { title: "----" },
-        { title: "Protect subtree", cmd: "protectSubtree", uiIcon: "shield-check" },
-        { title: "Unprotect subtree", cmd: "unprotectSubtree", uiIcon: "shield-close" },
-        { title: "----" },
-        { title: "Copy / clone <kbd>Ctrl+C</kbd>", cmd: "copy", uiIcon: "files" },
-        { title: "Cut <kbd>Ctrl+X</kbd>", cmd: "cut", uiIcon: "scissors" },
-        { title: "Paste into <kbd>Ctrl+V</kbd>", cmd: "pasteInto", uiIcon: "clipboard" },
-        { title: "Paste after", cmd: "pasteAfter", uiIcon: "clipboard" },
-        { title: "----" },
-        { title: "Export", cmd: "export", uiIcon: "arrow-up-right" },
-        { title: "Import into note", cmd: "importIntoNote", uiIcon: "arrow-down-left" },
-        { title: "----" },
-        { title: "Collapse subtree <kbd>Alt+-</kbd>", cmd: "collapseSubtree", uiIcon: "align-justify" },
-        { title: "Force note sync", cmd: "forceNoteSync", uiIcon: "refresh" },
-        { title: "Sort alphabetically <kbd>Alt+S</kbd>", cmd: "sortAlphabetically", uiIcon: "arrows-v" }
-    ];
-}
-
-async function getContextMenuItems(event) {
     const node = $.ui.fancytree.getNode(event);
     const branch = await treeCache.getBranch(node.data.branchId);
     const note = await treeCache.getNote(node.data.noteId);
@@ -127,24 +99,52 @@ async function getContextMenuItems(event) {
     const isNotRoot = note.noteId !== 'root';
     const isHoisted = note.noteId === await hoistedNoteService.getHoistedNoteId();
 
-    const itemsContainer = new ContextMenuItemsContainer(getTopLevelItems(note));
+    const insertNoteAfterEnabled = isNotRoot && !isHoisted && parentNote.type !== 'search';
+    const insertChildNoteEnabled = note.type !== 'search';
 
-    // Modify menu entries depending on node status
+    return [
-    itemsContainer.enableItem("insertNoteAfter", isNotRoot && !isHoisted && parentNote.type !== 'search');
+        { title: "Insert note after <kbd>Ctrl+O</kbd>", cmd: "insertNoteAfter", uiIcon: "plus",
-    itemsContainer.enableItem("insertChildNote", note.type !== 'search');
+            items: insertNoteAfterEnabled ? getNoteTypeItems("insertNoteAfter") : null,
-    itemsContainer.enableItem("delete", isNotRoot && parentNote.type !== 'search');
+            enabled: insertNoteAfterEnabled },
-    itemsContainer.enableItem("copy", isNotRoot);
+        { title: "Insert child note <kbd>Ctrl+P</kbd>", cmd: "insertChildNote", uiIcon: "plus",
-    itemsContainer.enableItem("cut", isNotRoot);
+            items: insertChildNoteEnabled ? getNoteTypeItems("insertChildNote") : null,
-    itemsContainer.enableItem("pasteAfter", clipboardIds.length > 0 && isNotRoot && parentNote.type !== 'search');
+            enabled: insertChildNoteEnabled },
-    itemsContainer.enableItem("pasteInto", clipboardIds.length > 0 && note.type !== 'search');
+        { title: "Delete <kbd>Delete</kbd>", cmd: "delete", uiIcon: "trash",
-    itemsContainer.enableItem("importIntoNote", note.type !== 'search');
+            enabled: isNotRoot && parentNote.type !== 'search' },
-    itemsContainer.enableItem("export", note.type !== 'search');
+        { title: "----" },
-    itemsContainer.enableItem("editBranchPrefix", isNotRoot && parentNote.type !== 'search');
+        isHoisted ? null : { title: "Hoist note <kbd>Ctrl-H</kbd>", cmd: "hoist", uiIcon: "arrow-up" },
+        !isHoisted || !isNotRoot ? null : { title: "Unhoist note <kbd>Ctrl-H</kbd>", cmd: "unhoist", uiIcon: "arrow-up" },
+        { title: "Edit branch prefix <kbd>F2</kbd>", cmd: "editBranchPrefix", uiIcon: "pencil",
+            enabled: isNotRoot && parentNote.type !== 'search'},
+        { title: "----" },
+        { title: "Protect subtree", cmd: "protectSubtree", uiIcon: "shield-check" },
+        { title: "Unprotect subtree", cmd: "unprotectSubtree", uiIcon: "shield-close" },
+        { title: "----" },
+        { title: "Copy / clone <kbd>Ctrl+C</kbd>", cmd: "copy", uiIcon: "files",
+            enabled: isNotRoot },
+        { title: "Cut <kbd>Ctrl+X</kbd>", cmd: "cut", uiIcon: "scissors",
+            enabled: isNotRoot },
+        { title: "Paste into <kbd>Ctrl+V</kbd>", cmd: "pasteInto", uiIcon: "clipboard",
+            enabled: clipboardIds.length > 0 && note.type !== 'search' },
+        { title: "Paste after", cmd: "pasteAfter", uiIcon: "clipboard",
+            enabled: clipboardIds.length > 0 && isNotRoot && parentNote.type !== 'search' },
+        { title: "----" },
+        { title: "Export", cmd: "export", uiIcon: "arrow-up-right",
+            enabled: note.type !== 'search' },
+        { title: "Import into note", cmd: "importIntoNote", uiIcon: "arrow-down-left",
+            enabled: note.type !== 'search' },
+        { title: "----" },
+        { title: "Collapse subtree <kbd>Alt+-</kbd>", cmd: "collapseSubtree", uiIcon: "align-justify" },
+        { title: "Force note sync", cmd: "forceNoteSync", uiIcon: "refresh" },
+        { title: "Sort alphabetically <kbd>Alt+S</kbd>", cmd: "sortAlphabetically", uiIcon: "arrows-v" }
+    ].filter(row => row !== null);
+}
 
-    itemsContainer.hideItem("hoist", isHoisted);
+async function getContextMenuItems(event) {
-    itemsContainer.hideItem("unhoist", !isHoisted || !isNotRoot);
+    const items = await getTopLevelItems(event);
 
     // Activate node on right-click
+    const node = $.ui.fancytree.getNode(event);
     node.setActive();
 
     // right click resets selection to just this node
@@ -153,7 +153,7 @@ async function getContextMenuItems(event) {
     node.setSelected(true);
     treeService.clearSelectedNodes();
 
-    return itemsContainer;
+    return items;
 }
 
 function selectContextMenuItem(event, cmd) {

src/public/stylesheets/style.css

@@ -426,6 +426,10 @@ div.ui-tooltip {
     background-color: var(--menu-background-color) !important;
 }
 
+.dropdown-menu .disabled {
+    color: #888 !important;
+}
+
 .dropdown-menu a:hover:not(.disabled) {
     color: var(--hover-item-text-color) !important;
     background-color: var(--hover-item-background-color) !important;