mirror of
https://github.com/toeverything/AFFiNE.git
synced 2024-12-23 16:32:04 +03:00
feature: updatescrollIntoViewByBlockId API;
This commit is contained in:
parent
b2d1968492
commit
02f8f8bcec
@ -168,11 +168,7 @@ export const TOC = () => {
|
|||||||
|
|
||||||
const onClick = async (blockId?: string) => {
|
const onClick = async (blockId?: string) => {
|
||||||
setActiveBlockId(blockId);
|
setActiveBlockId(blockId);
|
||||||
await editor.scrollManager.scrollIntoViewByBlockId(
|
await editor.scrollManager.scrollIntoViewByBlockId(blockId);
|
||||||
blockId,
|
|
||||||
'smooth',
|
|
||||||
'primary'
|
|
||||||
);
|
|
||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
|
@ -14,8 +14,6 @@ type ScrollController = {
|
|||||||
unLockScroll: () => void;
|
unLockScroll: () => void;
|
||||||
};
|
};
|
||||||
|
|
||||||
type ScrollPrimary = undefined | 'primary';
|
|
||||||
|
|
||||||
export class ScrollManager {
|
export class ScrollManager {
|
||||||
private _editor: BlockEditor;
|
private _editor: BlockEditor;
|
||||||
private _scrollContainer: HTMLElement;
|
private _scrollContainer: HTMLElement;
|
||||||
@ -152,45 +150,23 @@ export class ScrollManager {
|
|||||||
|
|
||||||
public async scrollIntoViewByBlockId(
|
public async scrollIntoViewByBlockId(
|
||||||
blockId: string,
|
blockId: string,
|
||||||
behavior: ScrollBehavior = 'smooth',
|
behavior: ScrollBehavior = 'smooth'
|
||||||
ability?: ScrollPrimary
|
|
||||||
) {
|
) {
|
||||||
const block = await this._editor.getBlockById(blockId);
|
const block = await this._editor.getBlockById(blockId);
|
||||||
|
|
||||||
await this.scrollIntoViewByBlock(block, behavior, ability);
|
await this.scrollIntoViewByBlock(block, behavior);
|
||||||
}
|
}
|
||||||
|
|
||||||
public async scrollIntoViewByBlock(
|
public async scrollIntoViewByBlock(
|
||||||
block: AsyncBlock,
|
block: AsyncBlock,
|
||||||
behavior: ScrollBehavior = 'smooth',
|
behavior: ScrollBehavior = 'smooth'
|
||||||
ability?: ScrollPrimary
|
|
||||||
) {
|
) {
|
||||||
if (!block.dom) {
|
if (!block.dom) {
|
||||||
return console.warn(`Block is not exist.`);
|
return console.warn(`Block is not exist.`);
|
||||||
}
|
}
|
||||||
|
|
||||||
/* use dom primary ability */
|
/* use dom primary ability */
|
||||||
if (ability === 'primary') {
|
|
||||||
block.dom.scrollIntoView({ block: 'start', behavior });
|
block.dom.scrollIntoView({ block: 'start', behavior });
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
const containerRect = domToRect(this._scrollContainer);
|
|
||||||
const blockRect = domToRect(block.dom);
|
|
||||||
|
|
||||||
const blockRelativeTopToEditor =
|
|
||||||
blockRect.top - containerRect.top - containerRect.height / 4;
|
|
||||||
const blockRelativeLeftToEditor = blockRect.left - containerRect.left;
|
|
||||||
|
|
||||||
this.scrollTo({
|
|
||||||
left: blockRelativeLeftToEditor,
|
|
||||||
top: blockRelativeTopToEditor,
|
|
||||||
behavior,
|
|
||||||
});
|
|
||||||
this._updateScrollInfo(
|
|
||||||
blockRelativeLeftToEditor,
|
|
||||||
blockRelativeTopToEditor
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public async keepBlockInView(
|
public async keepBlockInView(
|
||||||
|
Loading…
Reference in New Issue
Block a user