diff options
| -rw-r--r-- | src/client/views/collections/CollectionVideoView.tsx | 10 | ||||
| -rw-r--r-- | src/client/views/nodes/ImageBox.scss | 4 | ||||
| -rw-r--r-- | src/client/views/nodes/ImageBox.tsx | 6 |
3 files changed, 16 insertions, 4 deletions
diff --git a/src/client/views/collections/CollectionVideoView.tsx b/src/client/views/collections/CollectionVideoView.tsx index 29fb342c6..779dc8fc3 100644 --- a/src/client/views/collections/CollectionVideoView.tsx +++ b/src/client/views/collections/CollectionVideoView.tsx @@ -37,10 +37,13 @@ export class CollectionVideoView extends React.Component<FieldViewProps> { ]); } + _ele: HTMLDivElement | null = null; @action mainCont = (ele: HTMLDivElement | null) => { + this._ele = ele; if (ele) { this._player = ele.getElementsByTagName("video")[0]; + console.log(this._player); if (this.props.Document.GetNumber(KeyStore.CurPage, -1) >= 0) { this._currentTimecode = this.props.Document.GetNumber(KeyStore.CurPage, -1); } @@ -57,9 +60,12 @@ export class CollectionVideoView extends React.Component<FieldViewProps> { @action updateTimecode = () => { + this._player = this._player ? this._player : this._ele ? this._ele.getElementsByTagName("video")[0] : undefined; if (this._player) { - if ((this._player as any).AHackBecauseSomethingResetsTheVideoToZero !== -1) { - this._player.currentTime = (this._player as any).AHackBecauseSomethingResetsTheVideoToZero; + let timecode = (this._player as any).hasOwnProperty("AHackBecauseSomethingResetsTheVideoToZero") ? + (this._player as any).AHackBecauseSomethingResetsTheVideoToZero : -1; + if (timecode !== -1 && Object) { + this._player.currentTime = timecode; (this._player as any).AHackBecauseSomethingResetsTheVideoToZero = -1; } else { this._currentTimecode = this._player.currentTime; diff --git a/src/client/views/nodes/ImageBox.scss b/src/client/views/nodes/ImageBox.scss index f4b3837ff..db9a08fba 100644 --- a/src/client/views/nodes/ImageBox.scss +++ b/src/client/views/nodes/ImageBox.scss @@ -6,6 +6,10 @@ height: auto; max-width: 100%; max-height: 100%; + pointer-events: none; +} +.imageBox-cont-interactive { + pointer-events: all; } .imageBox-dot { diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index ce855384c..5d9aefd61 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -15,6 +15,8 @@ import { ContextMenu } from "../../views/ContextMenu"; import { FieldView, FieldViewProps } from './FieldView'; import "./ImageBox.scss"; import React = require("react"); +import { InkingControl } from '../InkingControl'; +import { InkTool } from '../../../fields/InkField'; @observer export class ImageBox extends React.Component<FieldViewProps> { @@ -87,7 +89,6 @@ export class ImageBox extends React.Component<FieldViewProps> { onPointerDown = (e: React.PointerEvent): void => { if (Date.now() - this._lastTap < 300) { if (e.buttons === 1) { - e.stopPropagation(); this._downX = e.clientX; this._downY = e.clientY; document.removeEventListener("pointerup", this.onPointerUp); @@ -161,8 +162,9 @@ export class ImageBox extends React.Component<FieldViewProps> { else if (field instanceof ImageField) paths = [field.Data.href]; else if (field instanceof ListField) paths = field.Data.filter(val => val as ImageField).map(p => (p as ImageField).Data.href); let nativeWidth = this.props.Document.GetNumber(KeyStore.NativeWidth, 1); + let interactive = InkingControl.Instance.selectedTool ? "" : "interactive" return ( - <div className="imageBox-cont" onPointerDown={this.onPointerDown} onDrop={this.onDrop} ref={this.createDropTarget} onContextMenu={this.specificContextMenu}> + <div className={`imageBox-cont-${interactive}`} onPointerDown={this.onPointerDown} onDrop={this.onDrop} ref={this.createDropTarget} onContextMenu={this.specificContextMenu}> <img src={paths[Math.min(paths.length, this._photoIndex)]} style={{ objectFit: (this._photoIndex === 0 ? undefined : "contain") }} width={nativeWidth} alt="Image not found" ref={this._imgRef} onLoad={this.onLoad} /> {paths.length > 1 ? this.dots(paths) : (null)} {this.lightbox(paths)} |