diff --git a/editor.css b/editor.css index 0860165..8a6cbb4 100644 --- a/editor.css +++ b/editor.css @@ -76,7 +76,7 @@ body { /* height: 40px; */ width: 100%; border-radius: 10px; - border: .5px solid rgba(0, 0, 0, 0.123); + border: 1px solid rgba(0, 0, 0, 0.123); padding-left: 38px; padding-right: 10px; outline: none; @@ -140,22 +140,38 @@ body { padding: 15px; } -#search-result-list div { - line-height: 2; - padding-top: 5px; - padding-bottom: 5px; +#search-result-list div div { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; transition: all 100ms ease-out 50ms; } -#search-result-list div:hover { +#search-result-list .search-result-info { + font-size: .75em; + padding-top: 0px; + padding-bottom: 5px; +} + +.menu-lightmode #search-result-list .search-result-info { + color: rgba(0, 0, 0, 0.5); +} + +.menu-darkmode #search-result-list .search-result-info { + color: rgba(255, 255, 255, 0.5); +} + +#search-result-list div .search-result-head { + padding-bottom: 0px; + padding-top: 5px; +} + +#search-result-list div:hover .search-result-head { font-weight: 500; color: rgb(75, 151, 151); } -#search-result-list div:active { +#search-result-list div:active .search-result-head { font-weight: 600; } diff --git a/editor.html b/editor.html index ebf0a78..e3928dc 100644 --- a/editor.html +++ b/editor.html @@ -283,4 +283,5 @@ + \ No newline at end of file diff --git a/editor.js b/editor.js index 9d7efe2..911b9b0 100644 --- a/editor.js +++ b/editor.js @@ -145,8 +145,8 @@ function openSearchMenu(menuitem) { document.getElementById('filepanel').style.opacity = 0; //Search -const nodeIndex = new FlexSearch.Index({tokenize: 'forward'}); -const actionIndex = new FlexSearch.Index({tokenize: 'forward'}); +var nodeIndex = new FlexSearch.Index({tokenize: 'forward'}); +var actionIndex = new FlexSearch.Index({tokenize: 'forward'}); // const searchDocument = new FlexSearch.Document(); // const searchWorker = new FlexSearch.Worker(); const soStates = document.getElementById('search-option-states'); @@ -188,13 +188,25 @@ function search(text) { if (stateOrEdge.id === result) target = stateOrEdge; }); + if (!target) return; var r = document.createElement('div'); - r.innerHTML = target.name; + var head = document.createElement('div'); + head.innerText = target.name; + head.classList.add('search-result-head'); + r.appendChild(head); + var info = document.createElement('div'); + if (target.actionData) + info.innerText = target.source.name + ' → ' + target.target.name; + else + info.innerText = target.stateData.abbreviation; + info.setAttribute('title', info.innerText); + info.classList.add('search-result-info'); + r.appendChild(info); searchResultList.appendChild(r); defineFocus(r, target); }) } - searchResultList.style.maxHeight = parseFloat(searchResults.style.maxHeight) - searchOptions.offsetHeight - 60; + searchResultList.style.maxHeight = parseFloat(searchResults.style.maxHeight) - searchOptions.offsetHeight - 80; // console.log('maxh', searchResults.style.maxHeight - searchOptions.offsetHeight) stateResults && format(workflow.states, stateResults, 'States'); actionResults && format(workflow.actions, actionResults, 'Edges'); @@ -279,6 +291,8 @@ function defineOnClick(item, url, title) { closeFileDisplay(); for (var key in data) workflow[key] = data[key]; + nodeIndex = new FlexSearch.Index({tokenize: 'forward'}); + actionIndex = new FlexSearch.Index({tokenize: 'forward'}); prepareWorkflow(); updateGraph(); wfGraph.centerAt(0, 0, 400); @@ -400,7 +414,7 @@ var newStateCoords = {'x': 0, 'y': 0}; //Initial coordinates of the next new sta sidePanel.style.top = mainMenu.offsetHeight + 15; searchContainer.style.left = mainMenu.offsetWidth / 2 - searchContainer.offsetWidth / 2; searchResults.style.left = searchContainer.style.left; -searchResults.style.maxHeight = 0.6 * window.innerHeight; +searchResults.style.maxHeight = 0.8 * window.innerHeight; /** diff --git a/keyboard.js b/keyboard.js new file mode 100644 index 0000000..98204e3 --- /dev/null +++ b/keyboard.js @@ -0,0 +1,25 @@ + + +document.addEventListener('keydown', e => { + console.log(e.ctrlKey, e.key); + if (e.key === 'Escape') { + closeContextMenus(contextMenuEd, contextMenuSt, contextMenuBg); + closeMenuItem(); + closeFileDisplay(); + deselect(); + rightSelection = null; + document.getElementById('search-input').blur(); + } else if (!e.ctrlKey) return; + switch (e.key) { + case 'f': + e.preventDefault(); + document.getElementById('search-input').focus(); + openSearchMenu(searchContainer.parentElement); + break; + case 'o': + e.preventDefault(); + openFileDisplay(); + default: + break; + } +}) \ No newline at end of file