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

🎨 https://github.com/siyuan-note/siyuan/issues/8224 改进重启滚动条定位和定位块无法加载问题

Browse source
This commit is contained in:
Vanessa 2023-05-10 22:32:08 +08:00
parent e0e803d743
commit adf5e3af96
8 changed files with 27 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

17
app/src/protyle/scroll/event.ts
View file

@ -39,22 +39,15 @@ export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => {
const targetElement = document.elementFromPoint(elementRect.left + elementRect.width / 2, elementRect.top + 10);
const blockElement = hasClosestBlock(targetElement);
if (!blockElement) {
if (hasClosestByClassName(targetElement, "protyle-background") ||
hasClosestByClassName(targetElement, "protyle-title")) {
if (protyle.wysiwyg.element.firstElementChild.getAttribute("data-eof") === "1" &&
(hasClosestByClassName(targetElement, "protyle-background") || hasClosestByClassName(targetElement, "protyle-title"))) {
const inputElement = protyle.scroll.element.querySelector(".b3-slider") as HTMLInputElement;
inputElement.value = "1";
protyle.scroll.element.setAttribute("aria-label", `Blocks 1/${protyle.block.blockCount}`);
}
return;
}
fetchPost("/api/block/getBlockIndex", {id: blockElement.getAttribute("data-node-id")}, (response) => {
if (!response.data) {
return;
}
const inputElement = protyle.scroll.element.querySelector(".b3-slider") as HTMLInputElement;
inputElement.value = response.data;
protyle.scroll.element.setAttribute("aria-label", `Blocks ${response.data}/${protyle.block.blockCount}`);
});
protyle.scroll.updateIndex(protyle, blockElement.getAttribute("data-node-id"));
}, Constants.TIMEOUT_LOAD);
}
if (protyle.wysiwyg.element.getAttribute("data-top") || protyle.block.showAll ||
@ -65,7 +58,7 @@ export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => {
if (protyle.scroll.lastScrollTop - element.scrollTop > 0) {
// up
if (element.scrollTop < element.clientHeight &&
protyle.wysiwyg.element.firstElementChild.getAttribute("data-eof") !== "true") {
protyle.wysiwyg.element.firstElementChild.getAttribute("data-eof") !== "1") {
// 禁用滚动时会产生抖动 https://ld246.com/article/1666717094418
protyle.contentElement.style.width = (protyle.contentElement.clientWidth) + "px";
protyle.contentElement.style.overflow = "hidden";
@ -83,7 +76,7 @@ export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => {
}
} else if ((element.scrollTop > element.scrollHeight - element.clientHeight * 1.8) &&
protyle.wysiwyg.element.lastElementChild &&
protyle.wysiwyg.element.lastElementChild.getAttribute("data-eof") !== "true") {
protyle.wysiwyg.element.lastElementChild.getAttribute("data-eof") !== "2") {
protyle.wysiwyg.element.setAttribute("data-top", element.scrollTop.toString());
fetchPost("/api/filetree/getDoc", {
id: protyle.wysiwyg.element.lastElementChild.getAttribute("data-node-id"),

11
app/src/protyle/scroll/index.ts
View file

@ -74,6 +74,17 @@ export class Scroll {
});
}
public updateIndex(protyle: IProtyle, id: string) {
fetchPost("/api/block/getBlockIndex", {id}, (response) => {
if (!response.data) {
return;
}
const inputElement = protyle.scroll.element.querySelector(".b3-slider") as HTMLInputElement;
inputElement.value = response.data;
protyle.scroll.element.setAttribute("aria-label", `Blocks ${response.data}/${protyle.block.blockCount}`);
});
}
public update(protyle: IProtyle) {
if (typeof protyle.block.blockCount === "number") {
this.inputElement.setAttribute("max", protyle.block.blockCount.toString());

2
app/src/protyle/scroll/saveScroll.ts
View file

@ -100,6 +100,8 @@ export const restoreScroll = (protyle: IProtyle, scrollAttr: IScrollAttr) => {
pushBack(protyle, range || undefined);
/// #endif
}
// 使用动态滚动条定位到最后一个块，重启后无法触发滚动事件，需要再次更新 index
protyle.scroll.updateIndex(protyle, scrollAttr.startId);
});
} else if (scrollAttr.scrollTop) {
protyle.contentElement.scrollTop = scrollAttr.scrollTop;