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

event listner using shortcut added

Browse source
This commit is contained in:
Umang G. Patel 2022-08-28 23:38:10 +05:30
parent ba9e854086
commit 8b90e95270
1 changed files with 21 additions and 16 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -62,7 +62,7 @@ export default class Sidebar {
sidebarContent: null, sidebarContent: null,
toggler: null, toggler: null,
slider: null, slider: null,
search:null, search: null,
searchResults: [], searchResults: [],
selectedSearchResultIndex: null, selectedSearchResultIndex: null,
}; };
@ -112,8 +112,6 @@ export default class Sidebar {
}); });
// Get search results if search input is empty. // Get search results if search input is empty.
this.search(''); this.search('');
// Add event listener for keyboard events.
document.addEventListener('keydown', e => this.keyboardListener(e));
this.ready(); this.ready();
} }
@ -241,6 +239,13 @@ export default class Sidebar {
on: document.body, on: document.body,
callback: () => this.handleSliderClick(), callback: () => this.handleSliderClick(),
}); });
// eslint-disable-next-line no-new
new Shortcut({
name: 'CMD+P',
on: document.body,
callback: () => {this.nodes.search.focus()},
});
} }
/** /**
@ -301,14 +306,14 @@ export default class Sidebar {
// if item is focused and up press, focus previous item. // if item is focused and up press, focus previous item.
if (e.code === 'ArrowUp') { if (e.code === 'ArrowUp') {
this.nodes.selectedSearchResultIndex--; this.nodes.selectedSearchResultIndex--;
if ( this.nodes.selectedSearchResultIndex < 0 ) { if (this.nodes.selectedSearchResultIndex < 0) {
this.nodes.selectedSearchResultIndex = this.nodes.searchResults.length - 1; this.nodes.selectedSearchResultIndex = this.nodes.searchResults.length - 1;
} }
} }
// if item is focused and down press, focus next item. // if item is focused and down press, focus next item.
if (e.code === 'ArrowDown') { if (e.code === 'ArrowDown') {
this.nodes.selectedSearchResultIndex++; this.nodes.selectedSearchResultIndex++;
if ( this.nodes.selectedSearchResultIndex >= this.nodes.searchResults.length ) { if (this.nodes.selectedSearchResultIndex >= this.nodes.searchResults.length) {
this.nodes.selectedSearchResultIndex = 0; this.nodes.selectedSearchResultIndex = 0;
} }
} }
@ -316,7 +321,7 @@ export default class Sidebar {
// remove focus from previous item. // remove focus from previous item.
if (prevSelectedSearchResultIndex !== null) { if (prevSelectedSearchResultIndex !== null) {
const { element:preElement, type:preType } = this.nodes.searchResults[prevSelectedSearchResultIndex]; const { element: preElement, type: preType } = this.nodes.searchResults[prevSelectedSearchResultIndex];
if (preElement) { if (preElement) {
// remove focus from previous item or title. // remove focus from previous item or title.
@ -336,7 +341,7 @@ export default class Sidebar {
if (type === 'title') { if (type === 'title') {
element.classList.add(Sidebar.CSS.sectionTitleSelected); element.classList.add(Sidebar.CSS.sectionTitleSelected);
} }
if ( type === 'item') { if (type === 'item') {
element.classList.add(Sidebar.CSS.sectionListItemSlelected); element.classList.add(Sidebar.CSS.sectionListItemSlelected);
} }
// find the parent section. // find the parent section.
@ -347,7 +352,7 @@ export default class Sidebar {
const elemBottom = rect.bottom; const elemBottom = rect.bottom;
// scroll top if item is not visible. // scroll top if item is not visible.
if ( elemTop < 0) { if (elemTop < 0) {
this.nodes.sidebarContent.scroll({ this.nodes.sidebarContent.scroll({
top: elemTop, top: elemTop,
behavior: 'smooth', behavior: 'smooth',
@ -364,7 +369,7 @@ export default class Sidebar {
} }
// if enter is pressed, click on focused item. // if enter is pressed, click on focused item.
if (e.code === 'Enter') { if (e.code === 'Enter') {
if (this.nodes.selectedSearchResultIndex!==null) { if (this.nodes.selectedSearchResultIndex !== null) {
this.nodes.searchResults[this.nodes.selectedSearchResultIndex].element.click(); this.nodes.searchResults[this.nodes.selectedSearchResultIndex].element.click();
} }
} }
@ -386,7 +391,7 @@ export default class Sidebar {
if (type === 'title') { if (type === 'title') {
element.classList.remove(Sidebar.CSS.sectionTitleSelected); element.classList.remove(Sidebar.CSS.sectionTitleSelected);
} }
if ( type === 'item') { if (type === 'item') {
element.classList.remove(Sidebar.CSS.sectionListItemSlelected); element.classList.remove(Sidebar.CSS.sectionListItemSlelected);
} }
// empty selected index. // empty selected index.
@ -422,8 +427,8 @@ export default class Sidebar {
item.parentElement.classList.remove(Sidebar.CSS.sectionListItemWrapperHidden); item.parentElement.classList.remove(Sidebar.CSS.sectionListItemWrapperHidden);
// add item to search results. // add item to search results.
matchResults.push({ matchResults.push({
element:item, element: item,
type:'item', type: 'item',
}); });
isItemMatch = true; isItemMatch = true;
} else { } else {
@ -440,8 +445,8 @@ export default class Sidebar {
section.classList.remove(Sidebar.CSS.sectionHidden); section.classList.remove(Sidebar.CSS.sectionHidden);
// add section title to search results. // add section title to search results.
this.nodes.searchResults.push({ this.nodes.searchResults.push({
element:sectionTitle, element: sectionTitle,
type:'title', type: 'title',
}, ...matchResults); }, ...matchResults);
} }
}); });