This commit is contained in:
parent
c4d72c16c3
commit
cf4c5396ab
1 changed files with 24 additions and 18 deletions
|
@ -65,7 +65,7 @@ export const openSnippets = () => {
|
|||
<div class="fn__flex-1"></div>
|
||||
<div class="b3-form__icon">
|
||||
<svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg>
|
||||
<input data-type="css" data-action="search" type="text" placeholder="${window.siyuan.languages.enterKey} ${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input">
|
||||
<input data-type="css" data-action="search" type="text" placeholder="${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input">
|
||||
</div>
|
||||
<div class="fn__space"></div>
|
||||
<span aria-label="${window.siyuan.languages.addAttr} CSS" id="addCodeSnippetCSS" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show">
|
||||
|
@ -81,7 +81,7 @@ export const openSnippets = () => {
|
|||
<div class="fn__flex-1"></div>
|
||||
<div class="b3-form__icon">
|
||||
<svg class="b3-form__icon-icon"><use xlink:href="#iconSearch"></use></svg>
|
||||
<input data-type="js" data-action="search" type="text" placeholder="${window.siyuan.languages.enterKey} ${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input">
|
||||
<input data-type="js" data-action="search" type="text" placeholder="${window.siyuan.languages.search}" class="b3-text-field b3-form__icon-input">
|
||||
</div>
|
||||
<div class="fn__space"></div>
|
||||
<span aria-label="${window.siyuan.languages.addAttr} JS" id="addCodeSnippetJS" class="b3-tooltips b3-tooltips__sw block__icon block__icon--show">
|
||||
|
@ -162,28 +162,34 @@ export const openSnippets = () => {
|
|||
}
|
||||
});
|
||||
dialog.element.querySelectorAll('[data-action="search"]').forEach((inputItem: HTMLInputElement) => {
|
||||
inputItem.addEventListener("keydown", (event: KeyboardEvent) => {
|
||||
if (event.key === "Enter" && !event.isComposing) {
|
||||
fetchPost("/api/snippet/getSnippet", {
|
||||
type: "all",
|
||||
enabled: 2,
|
||||
keyword: inputItem.value
|
||||
}, (searchResponse) => {
|
||||
dialog.element.querySelectorAll(`.fn__flex-1 > div > [data-type="${inputItem.dataset.type}"]`).forEach((snipeetPanel: Element) => {
|
||||
snipeetPanel.classList.add("fn__none");
|
||||
});
|
||||
searchResponse.data.snippets.forEach((snippetItem: ISnippet) => {
|
||||
if (snippetItem.type === inputItem.dataset.type) {
|
||||
dialog.element.querySelector(`[data-id="${snippetItem.id}"]`).classList.remove("fn__none");
|
||||
}
|
||||
});
|
||||
});
|
||||
inputItem.addEventListener("input", (event: KeyboardEvent) => {
|
||||
if (event.isComposing) {
|
||||
return
|
||||
}
|
||||
filterSnippet(dialog, inputItem)
|
||||
});
|
||||
inputItem.addEventListener("compositionend", () => {
|
||||
filterSnippet(dialog, inputItem)
|
||||
});
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const filterSnippet = (dialog: Dialog, inputItem: HTMLInputElement) => {
|
||||
dialog.element.querySelectorAll(`.fn__flex-1 > div > [data-type="${inputItem.dataset.type}"]`).forEach((snippetPanel: Element) => {
|
||||
const snippetName = snippetPanel.querySelector("input").value.toLowerCase();
|
||||
const snippetContent = snippetPanel.querySelector("textarea").value.toLowerCase();
|
||||
const searchValue = inputItem.value.toLowerCase();
|
||||
if (!searchValue ||
|
||||
(snippetName && (searchValue.includes(snippetName) || snippetName.includes(searchValue))) ||
|
||||
(snippetContent && (snippetContent.includes(searchValue) || searchValue.includes(snippetContent)))) {
|
||||
snippetPanel.classList.remove("fn__none");
|
||||
} else {
|
||||
snippetPanel.classList.add("fn__none");
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
const genSnippet = (options: ISnippet) => {
|
||||
return `<div data-id="${options.id || ""}" data-type="${options.type}">
|
||||
<div class="fn__hr--b"></div>
|
||||
|
|
Loading…
Add table
Reference in a new issue