1
0
Fork 0
mirror of https://github.com/codex-team/codex.docs.git synced 2025-08-10 07:55:24 +02:00

unusal things

This commit is contained in:
Umang G. Patel 2022-07-23 19:16:33 +05:30
parent 22f4a592f2
commit 7e33388d1c

View file

@ -58,7 +58,6 @@ export default class Sidebar {
toggler: null, toggler: null,
search:null, search:null,
searchResults: [], searchResults: [],
selectedSearchResult: null,
selectedSearchResultIndex: null, selectedSearchResultIndex: null,
}; };
this.sidebarStorage = new Storage(LOCAL_STORAGE_KEY); this.sidebarStorage = new Storage(LOCAL_STORAGE_KEY);
@ -196,34 +195,88 @@ export default class Sidebar {
*/ */
ready() { ready() {
this.nodes.sidebarContent.classList.remove(Sidebar.CSS.sidebarContentInvisible); this.nodes.sidebarContent.classList.remove(Sidebar.CSS.sidebarContentInvisible);
document.addEventListener('keydown', e => this.keyboardShortcutListener(e)); document.addEventListener('keydown', e => this.keyboardListener(e));
} }
keyboardShortcutListener(e) { /**
* Keyboard event listener added
*
* @param {KeyboardEvent} e - keyboard event.
*/
keyboardListener(e) {
if (e.ctrlKey && e.code === 'KeyP') { if (e.ctrlKey && e.code === 'KeyP') {
this.nodes.search.focus(); this.nodes.search.focus();
e.preventDefault(); e.preventDefault();
} }
if (this.nodes.search === document.activeElement) { if (this.nodes.search === document.activeElement) {
if (e.code === 'ArrowUp') { if (e.code === 'ArrowUp' || e.code === 'ArrowDown') {
console.log("up");
e.stopImmediatePropagation();
e.preventDefault();
}
if (e.code === 'ArrowDown') {
console.log("down");
e.stopImmediatePropagation(); e.stopImmediatePropagation();
e.preventDefault(); e.preventDefault();
if (this.nodes.searchResults.length === 0) {
return;
}
const prevSelectedSearchResultIndex = this.nodes.selectedSearchResultIndex;
if (this.nodes.selectedSearchResultIndex === null) {
if (e.code === 'ArrowUp') {
this.nodes.selectedSearchResultIndex = this.nodes.searchResults.length - 1;
}
if (e.code === 'ArrowDown') {
this.nodes.selectedSearchResultIndex = 0;
}
} else {
if (e.code === 'ArrowUp') {
this.nodes.selectedSearchResultIndex--;
if ( this.nodes.selectedSearchResultIndex < 0 ) {
this.nodes.selectedSearchResultIndex = this.nodes.searchResults.length - 1;
}
}
if (e.code === 'ArrowDown') {
this.nodes.selectedSearchResultIndex++;
if ( this.nodes.selectedSearchResultIndex >= this.nodes.searchResults.length ) {
this.nodes.selectedSearchResultIndex = 0;
}
}
}
if (prevSelectedSearchResultIndex) {
const { preElement, preType } = this.nodes.searchResults[prevSelectedSearchResultIndex];
if (preElement) {
if (preType === 'title') {
preElement.classList.add(Sidebar.CSS.sectionTitleSelected);
}
if ( preType === 'item') {
preElement.classList.add(Sidebar.CSS.sectionListItemSlelected);
}
}
}
const { element, type } = this.nodes.searchResults[this.nodes.selectedSearchResultIndex];
if (element) {
if (type === 'title') {
element.classList.add(Sidebar.CSS.sectionTitleSelected);
}
if ( type === 'item') {
element.classList.add(Sidebar.CSS.sectionListItemSlelected);
}
}
} }
} }
} }
/**
* Search for items in the sidebar.
*
* @param {InputEvent} e - input event.
*/
search(e) { search(e) {
const searchValue = e.target.value; const searchValue = e.target.value;
if (this.nodes.selectedSearchResult) { if (this.nodes.selectedSearchResultIndex) {
const { element, type } = this.nodes.selectedSearchResult; const { element, type } = this.nodes.searchResults[this.nodes.selectedSearchResultIndex];
if (element) { if (element) {
if (type === 'title') { if (type === 'title') {
@ -232,7 +285,6 @@ export default class Sidebar {
if ( type === 'item') { if ( type === 'item') {
element.classList.remove(Sidebar.CSS.sectionListItemSlelected); element.classList.remove(Sidebar.CSS.sectionListItemSlelected);
} }
this.nodes.selectedSearchResult = null;
this.nodes.selectedSearchResultIndex = null; this.nodes.selectedSearchResultIndex = null;
} }
} }