note type context submenu WIP

src/public/javascripts/services/context_menu.js

@@ -5,42 +5,60 @@ function initContextMenu(event, itemContainer, selectContextMenuItem) {
 
     $contextMenuContainer.empty();
 
-    for (const item of itemContainer.getItems()) {
+    function addItems($parent, items) {
-        if (item.title === '----') {
+        for (const item of items) {
-            $contextMenuContainer.append($("<div>").addClass("dropdown-divider"));
+            if (item.title === '----') {
-        } else {
+                $parent.append($("<div>").addClass("dropdown-divider"));
-            const $icon = $("<span>");
-
-            if (item.uiIcon) {
-                $icon.addClass("jam jam-" + item.uiIcon);
             } else {
-                $icon.append("&nbsp;");
+                const $icon = $("<span>");
+
+                if (item.uiIcon) {
+                    $icon.addClass("jam jam-" + item.uiIcon);
+                } else {
+                    $icon.append("&nbsp;");
+                }
+
+                const $item = $("<li>")
+                    .addClass("dropdown-item");
+
+                const $link = $("<a>")
+                    .append($icon)
+                    .append(" &nbsp; ") // some space between icon and text
+                    .prop("data-cmd", item.cmd)
+                    .append(item.title);
+
+                $item.append($link);
+
+                if (item.enabled !== undefined && !item.enabled) {
+                    $link.addClass("disabled");
+                }
+
+                $link.click(async function (e) {
+                    const cmd = $(e.target).prop("data-cmd");
+
+                    e.originalTarget = event.target;
+
+                    await selectContextMenuItem(e, cmd);
+                });
+
+                if (item.items) {
+                    $item.addClass("dropdown-submenu");
+                    $link.addClass("dropdown-toggle");
+
+                    const $subMenu = $("<ul>").addClass("dropdown-menu");
+
+                    addItems($subMenu, item.items);
+
+                    $item.append($subMenu);
+                }
+
+                $parent.append($item);
             }
-
-            const $item = $("<a>")
-                .append($icon)
-                .append(" &nbsp; ") // some space between icon and text
-                .addClass("dropdown-item")
-                .prop("data-cmd", item.cmd)
-                .append(item.title);
-
-
-            if (item.enabled !== undefined && !item.enabled) {
-                $item.addClass("disabled");
-            }
-
-            $item.click(async function (e) {
-                const cmd = $(e.target).prop("data-cmd");
-
-                e.originalTarget = event.target;
-
-                await selectContextMenuItem(e, cmd);
-            });
-
-            $contextMenuContainer.append($item);
         }
     }
 
+    addItems($contextMenuContainer, itemContainer.getItems());
+
     // 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
     const clickPosition = event.pageY;

src/public/javascripts/services/tree_context_menu.js

@@ -77,9 +77,17 @@ function cut(nodes) {
     infoService.showMessage("Note(s) have been cut into clipboard.");
 }
 
+const noteTypeItems = [
+    {title: "Plain text", cmd: "insertNoteAfter", uiIcon: "file"},
+    {title: "Terminal", cmd: "insertNoteAfter", uiIcon: "terminal"},
+    {title: "Saved search", cmd: "insertNoteAfter", uiIcon: "search-folder"},
+    {title: "Relation Map", cmd: "insertNoteAfter", uiIcon: "map"},
+    {title: "Render HTML note", cmd: "insertNoteAfter", uiIcon: "play"}
+];
+
 const contextMenuItems = [
-    {title: "Insert note after <kbd>Ctrl+O</kbd>", cmd: "insertNoteAfter", uiIcon: "plus"},
+    {title: "Insert note after <kbd>Ctrl+O</kbd>", cmd: "insertNoteAfter", uiIcon: "plus", items: noteTypeItems},
-    {title: "Insert child note <kbd>Ctrl+P</kbd>", cmd: "insertChildNote", uiIcon: "plus"},
+    {title: "Insert child note <kbd>Ctrl+P</kbd>", cmd: "insertChildNote", uiIcon: "plus", items: noteTypeItems},
     {title: "Delete <kbd>Delete</kbd>", cmd: "delete", uiIcon: "trash"},
     {title: "----"},
     {title: "Hoist note <kbd>Ctrl-H</kbd>", cmd: "hoist", uiIcon: "arrow-up"},

src/public/stylesheets/desktop.css

@@ -71,7 +71,7 @@ body {
     border-radius: 7px;
 }
 
-#context-menu-container {
+#context-menu-container, #context-menu-container .dropdown-menu {
     padding: 3px 0 0;
 }
 
@@ -113,4 +113,24 @@ body {
 [data-toggle="tooltip"] span {
     padding-bottom: 0;
     border-bottom: 1px dotted;
+}
+
+li.dropdown-submenu:hover > ul.dropdown-menu {
+    display: block;
+}
+
+.dropdown-submenu {
+    position:relative;
+}
+
+.dropdown-submenu > .dropdown-menu {
+    top: 0;
+    left: 100%;
+    margin-top: -6px;
+}
+
+/* rotate caret on hover */
+.dropdown-menu > li > a:hover:after {
+    text-decoration: underline;
+    transform: rotate(-90deg);
 }

src/services/search.js

@@ -1,5 +1,6 @@
 const repository = require('./repository');
 const sql = require('./sql');
+const log = require('./log');
 const parseFilters = require('./parse_filters');
 const buildSearchQuery = require('./build_search_query');
 
@@ -8,7 +9,14 @@ async function searchForNotes(searchString) {
 
     const {query, params} = buildSearchQuery(filters);
 
-    return await repository.getEntities(query, params);
+    try {
+        return await repository.getEntities(query, params);
+    }
+    catch (e) {
+        log.error("Search failed for " + query);
+
+        throw e;
+    }
 }
 
 async function searchForNoteIds(searchString) {
@@ -16,7 +24,14 @@ async function searchForNoteIds(searchString) {
 
     const {query, params} = buildSearchQuery(filters, 'notes.noteId');
 
-    return await sql.getColumn(query, params);
+    try {
+        return await sql.getColumn(query, params);
+    }
+    catch (e) {
+        log.error("Search failed for " + query);
+
+        throw e;
+    }
 }
 
 module.exports = {