diff options
Diffstat (limited to 'src')
-rw-r--r-- | src/Utils.ts | 8 | ||||
-rw-r--r-- | src/client/views/nodes/VideoBox.tsx | 24 |
2 files changed, 17 insertions, 15 deletions
diff --git a/src/Utils.ts b/src/Utils.ts index f160df6f7..3cf695a30 100644 --- a/src/Utils.ts +++ b/src/Utils.ts @@ -614,6 +614,10 @@ export function setupMoveUpEvents( const _moveEvent = (e: PointerEvent): void => { if (Math.abs(e.clientX - (target as any)._downX) > Utils.DRAG_THRESHOLD || Math.abs(e.clientY - (target as any)._downY) > Utils.DRAG_THRESHOLD) { + if ((target as any)._doubleTime) { + clearTimeout((target as any)._doubleTime); + (target as any)._doubleTime = undefined; + } if (moveEvent(e, [(target as any)._downX, (target as any)._downY], [e.clientX - (target as any)._lastX, e.clientY - (target as any)._lastY])) { document.removeEventListener("pointermove", _moveEvent); @@ -630,6 +634,10 @@ export function setupMoveUpEvents( (target as any)._lastTap = Date.now(); upEvent(e, [e.clientX - (target as any)._downX, e.clientY - (target as any)._downY]); if (Math.abs(e.clientX - (target as any)._downX) < 4 && Math.abs(e.clientY - (target as any)._downY) < 4) { + if ((target as any)._doubleTime && (target as any)._doubleTap) { + clearTimeout((target as any)._doubleTime); + (target as any)._doubleTime = undefined; + } clickEvent(e, (target as any)._doubleTap); } document.removeEventListener("pointermove", _moveEvent); diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx index 4de25a8b3..12822b64a 100644 --- a/src/client/views/nodes/VideoBox.tsx +++ b/src/client/views/nodes/VideoBox.tsx @@ -50,6 +50,7 @@ export class VideoBox extends ViewBoxAnnotatableComponent<FieldViewProps, VideoD static LabelPlayScript: ScriptField; static heightPercent = 60; // height of timeline in percent of height of videoBox. private _disposers: { [name: string]: IReactionDisposer } = {}; + private _doubleTime: NodeJS.Timeout | undefined; // bcz: Hack! this must be called _doubleTime since setupMoveDragEvents will use that field name private _youtubePlayer: YT.Player | undefined = undefined; private _videoRef: HTMLVideoElement | null = null; private _youtubeIframeId: number = -1; @@ -507,30 +508,27 @@ export class VideoBox extends ViewBoxAnnotatableComponent<FieldViewProps, VideoD toggleTimeline = (e: React.PointerEvent) => this.layoutDoc._showTimeline = !this.layoutDoc._showTimeline // ref for timeline - timelineRef = (timeline: HTMLDivElement) => { this._timeline = timeline; } + timelineRef = (timeline: HTMLDivElement) => { this._timeline = timeline; }; - _doubleTime: NodeJS.Timeout | undefined; // starting the drag event creating a range marker @action onPointerDownTimeline = (e: React.PointerEvent): void => { - const rect = this._timeline?.getBoundingClientRect();// (e.target as any).getBoundingClientRect(); + const rect = this._timeline?.getBoundingClientRect(); if (rect && e.target !== this._audioRef.current && this.active()) { const wasPlaying = this._playing; if (this._playing) this.Pause(); - !wasPlaying && !this._doubleTime && (this._doubleTime = setTimeout(() => { - this._doubleTime = undefined; - this.player!.currentTime = this.layoutDoc._currentTimecode = (e.clientX - rect.x) / rect.width * this.videoDuration; - }, 300)); + else if (!this._doubleTime) { + this._doubleTime = setTimeout(() => { + this._doubleTime = undefined; + this.player!.currentTime = this.layoutDoc._currentTimecode = (e.clientX - rect.x) / rect.width * this.videoDuration; + }, 300); + } this._markerStart = this._markerEnd = this.toTimeline(e.clientX - rect.x, rect.width); VideoBox.SelectingRegion = this; setupMoveUpEvents(this, e, action(e => { this._markerEnd = this.toTimeline(e.clientX - rect.x, rect.width); - if (this._doubleTime) { - clearTimeout(this._doubleTime); - this._doubleTime = undefined; - } return false; }), action((e, movement) => { @@ -543,10 +541,6 @@ export class VideoBox extends ViewBoxAnnotatableComponent<FieldViewProps, VideoD VideoBox.SelectingRegion = undefined; }), (e, doubleTap) => { - if (this._doubleTime && doubleTap) { - clearTimeout(this._doubleTime); - this._doubleTime = undefined; - } this.props.select(false); e.shiftKey && this.createMarker(this.player!.currentTime); !wasPlaying && doubleTap && this.Play(); |