import {Constants} from "../../constants"; import {hideElements} from "../ui/hideElements"; import {fetchPost} from "../../util/fetch"; import {onGet} from "../util/onGet"; import {showMessage} from "../../dialog/message"; import {updateHotkeyTip} from "../util/compatibility"; import {isMobile} from "../../util/functions"; import {hasClosestBlock, hasClosestByClassName} from "../util/hasClosest"; let getIndexTimeout: number export const scrollEvent = (protyle: IProtyle, element: HTMLElement) => { let elementRect = element.getBoundingClientRect(); element.addEventListener("scroll", (event) => { if (!protyle.toolbar.element.classList.contains("fn__none")) { const initY = protyle.toolbar.element.getAttribute("data-inity").split(Constants.ZWSP); const top = parseInt(initY[0]) + (parseInt(initY[1]) - element.scrollTop); if (elementRect.width === 0) { elementRect = element.getBoundingClientRect(); } const toolbarHeight = 29; if (top < elementRect.top - toolbarHeight || top > elementRect.bottom - toolbarHeight) { protyle.toolbar.element.style.display = "none"; } else { protyle.toolbar.element.style.top = top + "px"; protyle.toolbar.element.style.display = ""; } } if (!protyle.element.classList.contains("block__edit") && !isMobile()) { protyle.contentElement.setAttribute("data-scrolltop", element.scrollTop.toString()); } if (!window.siyuan.dragElement) { // https://ld246.com/article/1649638389841 hideElements(["gutter"], protyle); } if (!protyle.selectElement.classList.contains("fn__none")) { showMessage(window.siyuan.languages.crossPageUse.replace("${}", updateHotkeyTip("⇧Click")), 9000); } const panelContextElement = protyle.breadcrumb?.element.parentElement.querySelector('[data-type="context"]'); if (panelContextElement && !panelContextElement.classList.contains("ft__primary")) { // 悬浮窗需展开上下文后才能进行滚动 https://github.com/siyuan-note/siyuan/issues/2311 return; } if (protyle.scroll && !protyle.scroll.element.classList.contains("fn__none")) { clearTimeout(getIndexTimeout); getIndexTimeout = window.setTimeout(() => { elementRect = element.getBoundingClientRect(); 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")) { 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}`); }); }, Constants.TIMEOUT_BLOCKLOAD); } if (protyle.wysiwyg.element.getAttribute("data-top") || protyle.block.showAll || protyle.scroll.lastScrollTop === element.scrollTop || protyle.scroll.lastScrollTop === -1) { return; } if (protyle.scroll.lastScrollTop - element.scrollTop > 0) { // up if (element.scrollTop < element.clientHeight && protyle.wysiwyg.element.firstElementChild.getAttribute("data-eof") !== "true") { // 禁用滚动时会产生抖动 https://ld246.com/article/1666717094418 protyle.contentElement.style.width = (protyle.contentElement.clientWidth) + "px"; protyle.contentElement.style.overflow = "hidden"; protyle.wysiwyg.element.setAttribute("data-top", element.scrollTop.toString()); fetchPost("/api/filetree/getDoc", { id: protyle.wysiwyg.element.firstElementChild.getAttribute("data-node-id"), mode: 1, k: protyle.options.key || "", size: Constants.SIZE_GET, }, getResponse => { protyle.contentElement.style.overflow = ""; protyle.contentElement.style.width = ""; onGet(getResponse, protyle, [Constants.CB_GET_BEFORE, Constants.CB_GET_UNCHANGEID]); }); } } 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.setAttribute("data-top", element.scrollTop.toString()); fetchPost("/api/filetree/getDoc", { id: protyle.wysiwyg.element.lastElementChild.getAttribute("data-node-id"), mode: 2, k: protyle.options.key || "", size: Constants.SIZE_GET, }, getResponse => { onGet(getResponse, protyle, [Constants.CB_GET_APPEND, Constants.CB_GET_UNCHANGEID]); }); } protyle.scroll.lastScrollTop = Math.max(element.scrollTop, 0); }, { capture: false, passive: true, once: false }); };