Docker/codex.docs
Docker/codex.docs
1
0
Fork 0
mirror of https://github.com/codex-team/codex.docs.git synced 2025-08-08 06:55:26 +02:00
Code Issues Releases Activity

the enter evenlister added with search refactring

Browse source
This commit is contained in:
Umang G. Patel 2022-07-23 23:42:35 +05:30
parent 7e33388d1c
commit 8475e22635
1 changed files with 23 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

38
src/frontend/js/modules/sidebar.js
View file

@ -9,7 +9,7 @@ const LOCAL_STORAGE_KEY = 'docs_sidebar_state';
/** /**
* Section list item height in px * Section list item height in px
*/ */
const ITEM_HEIGHT = 31; const ITEM_HEIGHT = 35;
/** /**
* Sidebar module * Sidebar module
@ -86,7 +86,11 @@ export default class Sidebar {
className = Sidebar.CSS.sidebarSearchWrapperMac; className = Sidebar.CSS.sidebarSearchWrapperMac;
} }
this.nodes.search.parentElement.classList.add(className); this.nodes.search.parentElement.classList.add(className);
this.nodes.search.addEventListener('input', e => this.search(e)); this.nodes.search.addEventListener('input', e => {
e.stopImmediatePropagation();
e.preventDefault();
this.search(e.target.value);
});
this.ready(); this.ready();
} }
@ -207,6 +211,7 @@ export default class Sidebar {
if (e.ctrlKey && e.code === 'KeyP') { if (e.ctrlKey && e.code === 'KeyP') {
this.nodes.search.focus(); this.nodes.search.focus();
e.preventDefault(); e.preventDefault();
this.search('');
} }
if (this.nodes.search === document.activeElement) { if (this.nodes.search === document.activeElement) {
if (e.code === 'ArrowUp' || e.code === 'ArrowDown') { if (e.code === 'ArrowUp' || e.code === 'ArrowDown') {
@ -240,15 +245,15 @@ export default class Sidebar {
} }
} }
if (prevSelectedSearchResultIndex) { if (prevSelectedSearchResultIndex !== null) {
const { preElement, preType } = this.nodes.searchResults[prevSelectedSearchResultIndex]; const { element:preElement, type:preType } = this.nodes.searchResults[prevSelectedSearchResultIndex];
if (preElement) { if (preElement) {
if (preType === 'title') { if (preType === 'title') {
preElement.classList.add(Sidebar.CSS.sectionTitleSelected); preElement.classList.remove(Sidebar.CSS.sectionTitleSelected);
} }
if ( preType === 'item') { if (preType === 'item') {
preElement.classList.add(Sidebar.CSS.sectionListItemSlelected); preElement.classList.remove(Sidebar.CSS.sectionListItemSlelected);
} }
} }
} }
@ -264,17 +269,20 @@ export default class Sidebar {
} }
} }
} }
if (e.code === 'Enter') {
if (this.nodes.selectedSearchResultIndex!==null) {
this.nodes.searchResults[this.nodes.selectedSearchResultIndex].element.click();
}
}
} }
} }
/** /**
* Search for items in the sidebar. * Search for items in the sidebar.
* *
* @param {InputEvent} e - input event. * @param {InputEvent} searchValue - search value.
*/ */
search(e) { search(searchValue) {
const searchValue = e.target.value;
if (this.nodes.selectedSearchResultIndex) { if (this.nodes.selectedSearchResultIndex) {
const { element, type } = this.nodes.searchResults[this.nodes.selectedSearchResultIndex]; const { element, type } = this.nodes.searchResults[this.nodes.selectedSearchResultIndex];
@ -292,6 +300,7 @@ export default class Sidebar {
this.nodes.sections.forEach(section => { this.nodes.sections.forEach(section => {
const sectionTitle = section.querySelector('.' + Sidebar.CSS.sectionTitle); const sectionTitle = section.querySelector('.' + Sidebar.CSS.sectionTitle);
let isTitleMatch = true; let isTitleMatch = true;
const matchResults = [];
if (sectionTitle.innerText.trim().toLowerCase() if (sectionTitle.innerText.trim().toLowerCase()
.indexOf(searchValue.toLowerCase()) === -1) { .indexOf(searchValue.toLowerCase()) === -1) {
@ -308,7 +317,7 @@ export default class Sidebar {
if (item.innerText.trim().toLowerCase() if (item.innerText.trim().toLowerCase()
.indexOf(searchValue.toLowerCase()) !== -1) { .indexOf(searchValue.toLowerCase()) !== -1) {
item.parentElement.classList.remove(Sidebar.CSS.sectionListItemWrapperHidden); item.parentElement.classList.remove(Sidebar.CSS.sectionListItemWrapperHidden);
this.nodes.searchResults.push({ matchResults.push({
element:item, element:item,
type:'item', type:'item',
}); });
@ -325,9 +334,8 @@ export default class Sidebar {
this.nodes.searchResults.push({ this.nodes.searchResults.push({
element:sectionTitle, element:sectionTitle,
type:'title', type:'title',
}); }, ...matchResults);
} }
}); });
e.stopImmediatePropagation();
} }
} }