Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2026-01-24 17:26:10 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

🎨 fix https://github.com/siyuan-note/siyuan/issues/9009

Browse source
This commit is contained in:
Vanessa 2023-08-20 10:34:02 +08:00
parent 55fdc3741e
commit f4d63f3a76
3 changed files with 37 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

6
app/src/assets/scss/component/_typography.scss
View file

@ -88,9 +88,9 @@
background-color: var(--b3-protyle-inline-mark-background);
color: var(--b3-protyle-inline-mark-color);
&.mark__current {
background-color: var(--b3-protyle-search-current-background);
box-shadow: 0 0 1px var(--b3-theme-on-background);
&.mark--hl {
background-color: var(--b3-theme-primary-lighter);
box-shadow: 0 0 0 .5px var(--b3-theme-on-background);
}
}

33
app/src/search/assets.ts
View file

@ -67,11 +67,12 @@ export const openSearchAsset = (element: Element, isStick: boolean) => {
<div class="search__layout${localSearch.layout === 1 ? " search__layout--row" : ""}">
<div id="searchAssetList" class="fn__flex-1 search__list b3-list b3-list--background"></div>
<div class="search__drag"></div>
<div id="searchAssetPreview" class="fn__flex-1 search__preview" style="padding: 8px"></div>
<div id="searchAssetPreview" class="fn__flex-1 search__preview b3-typography" style="padding: 8px"></div>
</div>
<div class="search__tip${isStick ? " fn__none" : ""}">
<kbd>↑/↓</kbd> ${window.siyuan.languages.searchTip1}
${enterTip}
<kbd>Click</kbd> ${window.siyuan.languages.searchTip3}
<kbd>Esc</kbd> ${window.siyuan.languages.searchTip5}
</div>`;
const searchPanelElement = element.querySelector("#searchAssetList");
@ -313,10 +314,36 @@ export const toggleAssetHistory = (historyElement: Element, searchInputElement:
export const renderPreview = (element: Element, id: string, query: string, queryMethod: number) => {
fetchPost("/api/search/getAssetContent", {id, query, queryMethod}, (response) => {
element.innerHTML = response.data.assetContent.content;
element.innerHTML = `<p>${response.data.assetContent.content}</p>`;
const matchElement = element.querySelector("mark");
if (matchElement) {
matchElement.classList.add("mark--hl");
const contentRect = element.getBoundingClientRect();
element.scrollTop = element.scrollTop + matchElement.getBoundingClientRect().top - contentRect.top - contentRect.height / 2;
}
});
};
export const renderNextAssetMark = (element: Element) => {
let matchElement;
const allMatchElements = Array.from(element.querySelectorAll("mark"));
allMatchElements.find((item, itemIndex) => {
if (item.classList.contains("mark--hl")) {
item.classList.remove("mark--hl");
matchElement = allMatchElements[itemIndex + 1];
return;
}
});
if (!matchElement) {
matchElement = allMatchElements[0];
}
if (matchElement) {
matchElement.classList.add("mark--hl");
const contentRect = element.getBoundingClientRect();
element.scrollTop = element.scrollTop + matchElement.getBoundingClientRect().top - contentRect.top - contentRect.height / 2;
}
};
export const assetMethodMenu = (target: HTMLElement, cb: () => void) => {
const method = window.siyuan.storage[Constants.LOCAL_SEARCHASSET].method;
if (!window.siyuan.menus.menu.element.classList.contains("fn__none") &&
@ -357,7 +384,7 @@ export const assetMethodMenu = (target: HTMLElement, cb: () => void) => {
window.siyuan.menus.menu.popup({x: rect.right, y: rect.bottom}, true);
};
const filterTypesHTML = (types:IObject) => {
const filterTypesHTML = (types: IObject) => {
let html = "";
Constants.SIYUAN_ASSETS_SEARCH.sort((a: string, b: string) => {
return a.localeCompare(b);

5
app/src/search/util.ts
View file

@ -27,7 +27,7 @@ import {
assetFilterMenu,
assetInputEvent,
assetMethodMenu, assetMoreMenu,
openSearchAsset,
openSearchAsset, renderNextAssetMark,
renderPreview,
toggleAssetHistory
} from "./assets";
@ -729,6 +729,9 @@ export const genSearch = (app: App, config: ISearchOption, element: Element, clo
target.classList.add("b3-list-item--focus");
renderPreview(element.querySelector("#searchAssetPreview"), target.dataset.id, searchAssetInputElement.value, window.siyuan.storage[Constants.LOCAL_SEARCHASSET].method);
searchAssetInputElement.focus();
} else if (target.classList.contains("b3-list-item--focus")) {
renderNextAssetMark(element.querySelector("#searchAssetPreview"));
searchAssetInputElement.focus();
}
} else {
if (event.altKey) {