refactoring of context menu items, got rid of ContextMenuItemsContainer

This commit is contained in:
zadam 2019-03-19 22:56:37 +01:00
parent 0267468cd5
commit 616829464f
9 changed files with 2501 additions and 2556 deletions

View file

@ -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>

4870
package-lock.json generated

File diff suppressed because it is too large Load diff

View file

@ -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([
{title: "Insert note after", cmd: "insertNoteAfter", uiIcon: "plus"},
{title: "Insert child note", cmd: "insertChildNote", uiIcon: "plus"},
{title: "Delete this note", cmd: "delete", uiIcon: "trash"}
]);
const items = [
{ title: "Insert note after", cmd: "insertNoteAfter", uiIcon: "plus",
enabled: isNotRoot && parentNote.type !== 'search' },
{ 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');
itemsContainer.enableItem("insertChildNote", note.type !== 'search');
itemsContainer.enableItem("delete", isNotRoot && parentNote.type !== 'search');
contextMenuWidget.initContextMenu(e, itemsContainer, (event, cmd) => {
contextMenuWidget.initContextMenu(e, items, (event, cmd) => {
if (cmd === "insertNoteAfter") {
const parentNoteId = node.data.parentNoteId;
const isProtected = treeUtils.getParentProtectedStatus(node);

View file

@ -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

View file

@ -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;

View file

@ -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;
});

View file

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

View file

@ -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) {
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) {
async function getTopLevelItems(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
itemsContainer.enableItem("insertNoteAfter", isNotRoot && !isHoisted && parentNote.type !== 'search');
itemsContainer.enableItem("insertChildNote", note.type !== 'search');
itemsContainer.enableItem("delete", isNotRoot && parentNote.type !== 'search');
itemsContainer.enableItem("copy", isNotRoot);
itemsContainer.enableItem("cut", isNotRoot);
itemsContainer.enableItem("pasteAfter", clipboardIds.length > 0 && isNotRoot && parentNote.type !== 'search');
itemsContainer.enableItem("pasteInto", clipboardIds.length > 0 && note.type !== 'search');
itemsContainer.enableItem("importIntoNote", note.type !== 'search');
itemsContainer.enableItem("export", note.type !== 'search');
itemsContainer.enableItem("editBranchPrefix", isNotRoot && parentNote.type !== 'search');
return [
{ title: "Insert note after <kbd>Ctrl+O</kbd>", cmd: "insertNoteAfter", uiIcon: "plus",
items: insertNoteAfterEnabled ? getNoteTypeItems("insertNoteAfter") : null,
enabled: insertNoteAfterEnabled },
{ title: "Insert child note <kbd>Ctrl+P</kbd>", cmd: "insertChildNote", uiIcon: "plus",
items: insertChildNoteEnabled ? getNoteTypeItems("insertChildNote") : null,
enabled: insertChildNoteEnabled },
{ title: "Delete <kbd>Delete</kbd>", cmd: "delete", uiIcon: "trash",
enabled: isNotRoot && parentNote.type !== 'search' },
{ title: "----" },
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);
itemsContainer.hideItem("unhoist", !isHoisted || !isNotRoot);
async function getContextMenuItems(event) {
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) {

View file

@ -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;