Jayden/AFFiNE-Mirror
0
0
Fork 0
mirror of https://github.com/toeverything/AFFiNE.git synced 2026-08-06 20:10:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: refactor code by lint

Browse Source
This commit is contained in:
qishaoxuan
2022-07-27 11:02:03 +08:00
parent 52e9d0b2d7
commit d71ccd3b82
1 changed files with 41 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files
libs/components/editor-core/src/editor/scroll/scroll.ts
+41 -34
View File
@@ -1,7 +1,7 @@
import EventEmitter from 'eventemitter3'; import EventEmitter from 'eventemitter3';
import { domToRect, Rect } from '@toeverything/utils'; import { domToRect, Rect } from '@toeverything/utils';
import type { Editor as BlockEditor } from '../editor'; import type { Editor as Block_editor } from '../editor';
import { AsyncBlock } from '../block'; import { AsyncBlock } from '../block';
@@ -9,22 +9,23 @@ type VerticalTypes = 'up' | 'down' | null;
type HorizontalTypes = 'left' | 'right' | null; type HorizontalTypes = 'left' | 'right' | null;
export class ScrollManager { export class ScrollManager {
private _editor: BlockEditor; private _editor: Block_editor;
private _animation_frame: null | number = null; private _animationFrame: null | number = null;
private _event_name = 'scrolling'; private _eventName = 'scrolling';
private _current_move_direction: [HorizontalTypes, VerticalTypes] = [ private _currentMoveDirection: [HorizontalTypes, VerticalTypes] = [
null, null,
null, null,
]; ];
public scrollMoveOffset = 8; private _scrollMoveOffset = 8;
public scrollingEvent = new EventEmitter(); private _scrollingEvent = new EventEmitter();
constructor(editor: BlockEditor) { constructor(editor: Block_editor) {
this._editor = editor; this._editor = editor;
console.log('scrollmanager constructor', this._editor.ui_container);
} }
private update_scroll_info(left: number, top: number) { private _updateScrollInfo(left: number, top: number) {
this.scrollTop = top; this.scrollTop = top;
this.scrollLeft = left; this.scrollLeft = left;
} }
@@ -32,12 +33,12 @@ export class ScrollManager {
public onScrolling( public onScrolling(
cb: (args: { direction: [HorizontalTypes, VerticalTypes] }) => void cb: (args: { direction: [HorizontalTypes, VerticalTypes] }) => void
) { ) {
this.scrollingEvent.on(this._event_name, cb); this._scrollingEvent.on(this._eventName, cb);
} }
public removeScrolling( public removeScrolling(
cb: (args: { direction: [HorizontalTypes, VerticalTypes] }) => void cb: (args: { direction: [HorizontalTypes, VerticalTypes] }) => void
) { ) {
this.scrollingEvent.removeListener(this._event_name, cb); this._scrollingEvent.removeListener(this._eventName, cb);
} }
public get scrollContainer() { public get scrollContainer() {
@@ -64,6 +65,12 @@ export class ScrollManager {
public set scrollLeft(left: number) { public set scrollLeft(left: number) {
this._editor.ui_container.scrollLeft = left; this._editor.ui_container.scrollLeft = left;
} }
public get scrollMoveOffset() {
return this._scrollMoveOffset;
}
public get scrollingEvent() {
return this._scrollingEvent;
}
public scrollTo({ public scrollTo({
top, top,
@@ -116,7 +123,7 @@ export class ScrollManager {
top: blockRelativeTopToEditor, top: blockRelativeTopToEditor,
behavior, behavior,
}); });
this.update_scroll_info( this._updateScrollInfo(
blockRelativeLeftToEditor, blockRelativeLeftToEditor,
blockRelativeTopToEditor blockRelativeTopToEditor
); );
@@ -136,7 +143,7 @@ export class ScrollManager {
} }
const blockRect = domToRect(block.dom); const blockRect = domToRect(block.dom);
const value = this.get_keep_in_view_params(blockRect); const value = this._getKeepInViewParams(blockRect);
if (value !== 0) { if (value !== 0) {
this.scrollTo({ this.scrollTo({
@@ -146,7 +153,7 @@ export class ScrollManager {
} }
} }
private get_keep_in_view_params(blockRect: Rect) { private _getKeepInViewParams(blockRect: Rect) {
const { top, bottom } = domToRect(this._editor.ui_container); const { top, bottom } = domToRect(this._editor.ui_container);
if (blockRect.top <= top + blockRect.height * 3) { if (blockRect.top <= top + blockRect.height * 3) {
return -1; return -1;
@@ -169,22 +176,22 @@ export class ScrollManager {
this.scrollTo({ top: 0, behavior }); this.scrollTo({ top: 0, behavior });
} }
private auto_scroll() { private _autoScroll() {
const xValue = const xValue =
this._current_move_direction[0] === 'left' this._currentMoveDirection[0] === 'left'
? -1 ? -1
: this._current_move_direction[0] === 'right' : this._currentMoveDirection[0] === 'right'
? 1 ? 1
: 0; : 0;
const yValue = const yValue =
this._current_move_direction[1] === 'up' this._currentMoveDirection[1] === 'up'
? -1 ? -1
: this._current_move_direction[1] === 'down' : this._currentMoveDirection[1] === 'down'
? 1 ? 1
: 0; : 0;
const horizontalOffset = this.scrollMoveOffset * xValue; const horizontalOffset = this._scrollMoveOffset * xValue;
const verticalOffset = this.scrollMoveOffset * yValue; const verticalOffset = this._scrollMoveOffset * yValue;
const calcLeft = this.scrollLeft + horizontalOffset; const calcLeft = this.scrollLeft + horizontalOffset;
const calcTop = this.scrollTop + verticalOffset; const calcTop = this.scrollTop + verticalOffset;
@@ -202,7 +209,7 @@ export class ScrollManager {
return; return;
} }
this._animation_frame = requestAnimationFrame(() => { this._animationFrame = requestAnimationFrame(() => {
const left = this.scrollLeft + horizontalOffset; const left = this.scrollLeft + horizontalOffset;
const top = this.scrollTop + verticalOffset; const top = this.scrollTop + verticalOffset;
@@ -211,35 +218,35 @@ export class ScrollManager {
top, top,
behavior: 'auto', behavior: 'auto',
}); });
this.update_scroll_info(left, top); this._updateScrollInfo(left, top);
this.scrollingEvent.emit(this._event_name, { this._scrollingEvent.emit(this._eventName, {
direction: this._current_move_direction, direction: this._currentMoveDirection,
}); });
this.auto_scroll(); this._autoScroll();
}); });
} }
public startAutoScroll(direction: [HorizontalTypes, VerticalTypes]) { public startAutoScroll(direction: [HorizontalTypes, VerticalTypes]) {
if (direction[0] === null && direction[1] === null) { if (direction[0] === null && direction[1] === null) {
this._current_move_direction = direction; this._currentMoveDirection = direction;
this.stopAutoScroll(); this.stopAutoScroll();
return; return;
} }
if ( if (
direction[0] !== this._current_move_direction[0] || direction[0] !== this._currentMoveDirection[0] ||
direction[1] !== this._current_move_direction[1] direction[1] !== this._currentMoveDirection[1]
) { ) {
this._current_move_direction = direction; this._currentMoveDirection = direction;
this.stopAutoScroll(); this.stopAutoScroll();
} else { } else {
return; return;
} }
this.auto_scroll(); this._autoScroll();
} }
public stopAutoScroll() { public stopAutoScroll() {
if (this._animation_frame) { if (this._animationFrame) {
cancelAnimationFrame(this._animation_frame); cancelAnimationFrame(this._animationFrame);
this._animation_frame = null; this._animationFrame = null;
} }
} }
} }