chore(core): improve scroll anchoring (#8132)

Upstreams: https://github.com/toeverything/blocksuite/pull/8335
* set `padding` to `[20,20,100,20]`
* cancel smooth movement and scaling
* focus and zoom in on elements/blocks
This commit is contained in:
fundon
2024-09-13 13:13:02 +00:00
parent d2bd39a1c7
commit d2cb7b7683
2 changed files with 26 additions and 27 deletions

View File

@@ -169,11 +169,10 @@ export class Editor extends Entity {
get(this.mode$) === 'edgeless' && selector?.elementIds?.length
? selector?.elementIds?.[0]
: selector?.blockIds?.[0];
if (id) {
return { id, refreshKey: selector?.refreshKey };
} else {
return null;
}
if (!id) return null;
return { id, refreshKey: selector?.refreshKey };
});
if (focusAt$.value === null && docTitle) {
const title = docTitle.querySelector<

View File

@@ -1,9 +1,10 @@
import type { BlockStdScope } from '@blocksuite/block-std';
import type { BlockStdScope, SelectionManager } from '@blocksuite/block-std';
import type {
DocMode,
EdgelessRootService,
PageRootService,
} from '@blocksuite/blocks';
import { ZOOM_MAX } from '@blocksuite/blocks';
import { Bound, deserializeXYWH } from '@blocksuite/global/utils';
function scrollAnchoringInEdgelessMode(
@@ -11,23 +12,14 @@ function scrollAnchoringInEdgelessMode(
id: string
) {
requestAnimationFrame(() => {
let isNotInNote = true;
let bounds: Bound | null = null;
let pageSelection: SelectionManager | null = null;
const blockComponent = service.std.view.getBlock(id);
const parentComponent = blockComponent?.parentComponent;
if (parentComponent && parentComponent.flavour === 'affine:note') {
isNotInNote = false;
const selection = parentComponent.std.selection;
if (!selection) return;
selection.set([
selection.create('block', {
blockId: id,
}),
]);
pageSelection = parentComponent.std.selection;
if (!pageSelection) return;
const { left: x, width: w } = parentComponent.getBoundingClientRect();
const { top: y, height: h } = blockComponent.getBoundingClientRect();
@@ -48,20 +40,28 @@ function scrollAnchoringInEdgelessMode(
if (!bounds) return;
if (isNotInNote) {
const { zoom, centerX, centerY } = service.getFitToScreenData(
[20, 20, 100, 20],
[bounds],
ZOOM_MAX
);
service.viewport.setCenter(centerX, centerY);
service.viewport.setZoom(zoom);
if (pageSelection) {
pageSelection.setGroup('note', [
pageSelection.create('block', {
blockId: id,
}),
]);
} else {
service.selection.set({
elements: [id],
editing: false,
});
}
const { zoom, centerX, centerY } = service.getFitToScreenData(
[20, 20, 20, 20],
[bounds]
);
service.viewport.setViewport(zoom, [centerX, centerY]);
// const surfaceComponent = service.std.view.getBlock(service.surface.id);
// if (!surfaceComponent) return;
// (surfaceComponent as SurfaceBlockComponent).refresh();
@@ -82,7 +82,7 @@ function scrollAnchoringInPageMode(service: PageRootService, id: string) {
const selection = service.std.selection;
if (!selection) return;
selection.set([
selection.setGroup('note', [
selection.create('block', {
blockId: id,
}),