aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/VideoBox.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/VideoBox.tsx')
-rw-r--r--src/client/views/nodes/VideoBox.tsx27
1 files changed, 13 insertions, 14 deletions
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index 9d7c2bc56..b34f1dc08 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -1,18 +1,16 @@
import React = require("react");
+import { action, computed, IReactionDisposer, trace } from "mobx";
import { observer } from "mobx-react";
+import Measure from "react-measure";
import { FieldWaiting, Opt } from '../../../fields/Field';
+import { KeyStore } from "../../../fields/KeyStore";
import { VideoField } from '../../../fields/VideoField';
import { FieldView, FieldViewProps } from './FieldView';
import "./VideoBox.scss";
-import Measure from "react-measure";
-import { action, trace, observable, IReactionDisposer, computed, reaction } from "mobx";
-import { KeyStore } from "../../../fields/KeyStore";
-import { number } from "prop-types";
@observer
export class VideoBox extends React.Component<FieldViewProps> {
- private _reactionDisposer: Opt<IReactionDisposer>;
private _videoRef = React.createRef<HTMLVideoElement>();
public static LayoutString() { return FieldView.LayoutString(VideoBox); }
@@ -54,25 +52,26 @@ export class VideoBox extends React.Component<FieldViewProps> {
(vref as any).AHackBecauseSomethingResetsTheVideoToZero = this.curPage;
}
}
+ videoContent(path: string) {
+ return <video className="videobox-cont" ref={this.setVideoRef}>
+ <source src={path} type="video/mp4" />
+ Not supported.
+ </video>;
+ }
render() {
let field = this.props.Document.GetT(this.props.fieldKey, VideoField);
if (!field || field === FieldWaiting) {
return <div>Loading</div>;
}
- let path = field.Data.href;
- trace();
- return (
+ return (this.props.Document.GetNumber(KeyStore.NativeHeight, 0)) ?
+ this.videoContent(field.data.href) :
<Measure onResize={this.setScaling}>
{({ measureRef }) =>
<div style={{ width: "100%", height: "auto" }} ref={measureRef}>
- <video className="videobox-cont" ref={this.setVideoRef}>
- <source src={path} type="video/mp4" />
- Not supported.
- </video>
+ {this.videoContent(field.data.href)}
</div>
}
- </Measure>
- );
+ </Measure>;
}
} \ No newline at end of file