blob: 68f3b3ad4561a11addb6da767f8c8cf5997b1f2b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
|
import { action, observable } from "mobx";
import { observer } from "mobx-react";
import * as React from "react";
import { VideoField } from "../../../../fields/URLField";
import { Upload } from "../../../../server/SharedMediaTypes";
import { ViewBoxBaseComponent } from "../../DocComponent";
import { FieldView } from "../FieldView";
import { VideoBox } from "../VideoBox";
import { RecordingView } from './RecordingView';
import { DocumentType } from "../../../documents/DocumentTypes";
import { RecordingApi } from "../../../util/RecordingApi";
import { Doc, FieldsSym } from "../../../../fields/Doc";
import { Id } from "../../../../fields/FieldSymbols";
@observer
export class RecordingBox extends ViewBoxBaseComponent() {
public static LayoutString(fieldKey: string) { return FieldView.LayoutString(RecordingBox, fieldKey); }
private _ref: React.RefObject<HTMLDivElement> = React.createRef();
constructor(props: any) {
super(props);
}
componentDidMount() {
console.log("set native width and height")
Doc.SetNativeWidth(this.dataDoc, 1280);
Doc.SetNativeHeight(this.dataDoc, 720);
}
@observable result: Upload.FileInformation | undefined = undefined
@observable videoDuration: number | undefined = undefined
@action
setVideoDuration = (duration: number) => {
this.videoDuration = duration
}
@action
setResult = (info: Upload.FileInformation, trackScreen: boolean) => {
this.result = info
this.dataDoc.type = DocumentType.VID;
this.dataDoc[this.fieldKey + "-duration"] = this.videoDuration;
this.dataDoc.layout = VideoBox.LayoutString(this.fieldKey);
this.dataDoc[this.props.fieldKey] = new VideoField(this.result.accessPaths.agnostic.client);
this.dataDoc[this.fieldKey + "-recorded"] = true;
// stringify the presenation and store it
if (trackScreen) {
this.dataDoc[this.fieldKey + "-presentation"] = JSON.stringify(RecordingApi.Instance.clear());
}
}
render() {
console.log("Proto[Is]: ", this.rootDoc.proto?.[Id])
return <div className="recordingBox" ref={this._ref}>
{!this.result && <RecordingView setResult={this.setResult} setDuration={this.setVideoDuration} id={this.rootDoc.proto?.[Id] || ''} />}
</div>;
}
}
|
