diff options
author | Jenny Yu <jennyyu212@outlook.com> | 2022-04-28 16:01:49 -0400 |
---|---|---|
committer | Jenny Yu <jennyyu212@outlook.com> | 2022-04-28 16:01:49 -0400 |
commit | 0a84982e2ea59d737f394bc79fa7f26a4bf29a80 (patch) | |
tree | ad18d9abbe29692896f7f9df618e40379d3e0f4b /src | |
parent | 73ed47a8fbc6c4827c5d553e385396661d940787 (diff) |
feat: uploading works
Diffstat (limited to 'src')
-rw-r--r-- | src/client/Network.ts | 1 | ||||
-rw-r--r-- | src/client/views/nodes/RecordingBox/RecordingBox.tsx | 14 | ||||
-rw-r--r-- | src/client/views/nodes/RecordingBox/RecordingView.tsx | 23 | ||||
-rw-r--r-- | src/client/views/nodes/trails/PresElementBox.tsx | 2 |
4 files changed, 23 insertions, 17 deletions
diff --git a/src/client/Network.ts b/src/client/Network.ts index 3597e7b2b..1255e5ce0 100644 --- a/src/client/Network.ts +++ b/src/client/Network.ts @@ -19,6 +19,7 @@ export namespace Networking { } export async function UploadFilesToServer<T extends Upload.FileInformation = Upload.FileInformation>(files: File | File[]): Promise<Upload.FileResponse<T>[]> { + console.log(files) const formData = new FormData(); if (Array.isArray(files)) { if (!files.length) { diff --git a/src/client/views/nodes/RecordingBox/RecordingBox.tsx b/src/client/views/nodes/RecordingBox/RecordingBox.tsx index 4c7fdd278..6f9451925 100644 --- a/src/client/views/nodes/RecordingBox/RecordingBox.tsx +++ b/src/client/views/nodes/RecordingBox/RecordingBox.tsx @@ -22,6 +22,12 @@ export class RecordingBox extends ViewBoxBaseComponent() { } @observable result: Upload.FileInformation | undefined = undefined + @observable videoDuration: number | undefined = undefined + + @action + setVideoDuration = (duration: number) => { + this.videoDuration = duration + } @action setResult = (info: Upload.FileInformation) => { @@ -29,6 +35,9 @@ export class RecordingBox extends ViewBoxBaseComponent() { this.result = info console.log(this.result.accessPaths.agnostic.client) this.dataDoc.type = DocumentType.VID; + console.log(this.videoDuration) + this.dataDoc[this.fieldKey + "-duration"] = this.videoDuration; + this.layoutDoc.layout = VideoBox.LayoutString(this.fieldKey); this.dataDoc.nativeWidth = this.dataDoc.nativeHeight = undefined; this.layoutDoc._fitWidth = undefined; @@ -37,8 +46,9 @@ export class RecordingBox extends ViewBoxBaseComponent() { render() { return <div className="recordingBox" ref={this._ref}> - {!this.result ? <RecordingView setResult={this.setResult} /> : - <p>video box</p>} + {!this.result && <RecordingView setResult={this.setResult} setDuration={this.setVideoDuration} />} + {/* {!this.result ? <RecordingView setResult={this.setResult} /> : + <p>video box</p>} */} </div>; } } diff --git a/src/client/views/nodes/RecordingBox/RecordingView.tsx b/src/client/views/nodes/RecordingBox/RecordingView.tsx index 16f750e14..6aed07c60 100644 --- a/src/client/views/nodes/RecordingBox/RecordingView.tsx +++ b/src/client/views/nodes/RecordingBox/RecordingView.tsx @@ -22,6 +22,7 @@ interface MediaSegment { interface IRecordingViewProps { setResult: (info: Upload.FileInformation) => void + setDuration: (seconds: number) => void } const MAXTIME = 1000; @@ -47,12 +48,12 @@ export function RecordingView(props: IRecordingViewProps) { const DEFAULT_MEDIA_CONSTRAINTS = { - video: true, + // video: true, // audio: true - // video: { - // width: 1280, - // height: 720, - // }, + video: { + width: 1280, + height: 720, + }, // audio: true, // audio: { // echoCancellation: true, @@ -64,6 +65,7 @@ export function RecordingView(props: IRecordingViewProps) { useEffect(() => { if (finished) { + props.setDuration(recordingTimer * 100) let allVideoChunks: any = [] console.log(videos) videos.forEach((vid) => { @@ -72,16 +74,7 @@ export function RecordingView(props: IRecordingViewProps) { }) console.log(allVideoChunks) - - const blob = new Blob(allVideoChunks, { - type: 'video/webm' - }) - const blobUrl = URL.createObjectURL(blob) - const videoFile = new File(allVideoChunks, "video", { type: allVideoChunks[0].type, lastModified: Date.now() }); - - videoElementRef.current!.srcObject = null - videoElementRef.current!.src = blobUrl - videoElementRef.current!.muted = false + const videoFile = new File(allVideoChunks, "video.mkv", { type: allVideoChunks[0].type, lastModified: Date.now() }); // const uploadVideo = async () => { // const [{ result }] = await Networking.UploadFilesToServer(videoFile); diff --git a/src/client/views/nodes/trails/PresElementBox.tsx b/src/client/views/nodes/trails/PresElementBox.tsx index aa7622736..92834fb07 100644 --- a/src/client/views/nodes/trails/PresElementBox.tsx +++ b/src/client/views/nodes/trails/PresElementBox.tsx @@ -290,6 +290,8 @@ export class PresElementBox extends ViewBoxBaseComponent<FieldViewProps>() { console.log("x: ", pt[0], "y: ", pt[1]); recording.x = pt[0]; recording.y = pt[1]; + console.log(Doc.UserDoc().myOverlayDocs) + // Doc.RemoveDocFromList((Doc.UserDoc().myOverlayDocs as Doc), undefined, this.rootDoc); Doc.AddDocToList((Doc.UserDoc().myOverlayDocs as Doc), undefined, recording); } |