aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/nodes/RecordingBox/RecordingView.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/nodes/RecordingBox/RecordingView.tsx')
-rw-r--r--src/client/views/nodes/RecordingBox/RecordingView.tsx126
1 files changed, 23 insertions, 103 deletions
diff --git a/src/client/views/nodes/RecordingBox/RecordingView.tsx b/src/client/views/nodes/RecordingBox/RecordingView.tsx
index a5c2dc85c..8c8728fc3 100644
--- a/src/client/views/nodes/RecordingBox/RecordingView.tsx
+++ b/src/client/views/nodes/RecordingBox/RecordingView.tsx
@@ -18,7 +18,7 @@ export interface MediaSegment {
}
interface IRecordingViewProps {
- setResult: (info: Upload.FileInformation, trackScreen: boolean) => void
+ setResult: (info: Upload.AccessPathInfo, trackScreen: boolean) => void
setDuration: (seconds: number) => void
id: string
}
@@ -57,7 +57,7 @@ export function RecordingView(props: IRecordingViewProps) {
useEffect(() => {
- console.log('in videos useEffect')
+ // console.log('in videos useEffect', finished)
if (finished) {
(async () => {
@@ -71,89 +71,18 @@ export function RecordingView(props: IRecordingViewProps) {
const { name } = videoFile;
inputPaths.push(name)
})
-
- console.log(inputPaths)
- const data = await Networking.UploadSegmentsAndConcatenate(videoFiles)
- console.log('data', data)
- const result = data[0].result
- if (!(result instanceof Error)) { // convert this screenshotBox into normal videoBox
- props.setResult(result, trackScreen)
- } else {
- alert("video conversion failed");
- }
-
-
+ const serverPaths: string[] = (await Networking.UploadFilesToServer(videoFiles))
+ .map(res => (res.result instanceof Error) ? '' : res.result.accessPaths.agnostic.server)
- // const inputListName = 'order.txt';
- // fs.writeFileSync(inputListName, inputPaths.join('\n'));
- // var merge = ffmpeg();
- // merge.input(inputListName)
- // .inputOptions(['-f concat', '-safe 0'])
- // .outputOptions('-c copy')
- // .save('output.mp4')
-
- // fs.unlinkSync(inputListName);
-
- // const combined = await DashUploadUtils.combineSegments(videoFiles, inputPaths)
- // console.log('combined', combined)
-
- // const outputFile = new File(['output.mp4'], 'output.mp4', { type: 'video/mp4', lastModified: Date.now() });
-
- // const data = await Networking.UploadFilesToServer(combined)
- // const result = data[0].result
- // if (!(result instanceof Error)) { // convert this screenshotBox into normal videoBox
- // props.setResult(result, trackScreen)
- // } else {
- // alert("video conversion failed");
- // }
-
-
- // if (format.includes("x-matroska")) {
- // await new Promise(res => ffmpeg(file.path)
- // .videoCodec("copy") // this will copy the data instead of reencode it
- // .save(file.path.replace(".mkv", ".mp4"))
- // .on('end', res));
- // file.path = file.path.replace(".mkv", ".mp4");
- // format = ".mp4";
- // }
- // console.log('crossOriginIsolated', crossOriginIsolated)
- // props.setDuration(recordingTimer * 100)
-
- // console.log('Loading ffmpeg-core.js');
- // const ffmpeg = createFFmpeg({ log: true });
- // await ffmpeg.load();
- // console.log('ffmpeg-core.js loaded');
-
- // let allVideoChunks: any = [];
- // const inputPaths: string[] = [];
- // // write each segment into it's indexed file
- // videos.forEach(async (vid, i) => {
- // const vidName = `segvideo${i}.mkv`
- // inputPaths.push(vidName)
- // const videoFile = new File(vid.videoChunks, vidName, { type: allVideoChunks[0].type, lastModified: Date.now() });
- // ffmpeg.FS('writeFile', vidName, await fetchFile(videoFile));
- // // })
- // ffmpeg.FS('writeFile', 'order.txt', inputPaths.join('\n'));
-
- // console.log('concat')
- // await ffmpeg.run('-f', 'concat', '-safe', '0', '-i', 'order.txt', 'ouput.mp4');
-
- // const { buffer } = ffmpeg.FS('readFile', 'output.mp4');
- // const concatVideo = new File([buffer], 'concat.mp4', { type: "video/mp4" });
-
- // const data = await Networking.UploadFilesToServer(concatVideo)
- // const result = data[0].result
- // if (!(result instanceof Error)) { // convert this screenshotBox into normal videoBox
- // props.setResult(result, trackScreen)
- // } else {
- // alert("video conversion failed");
- // }
-
- // // delete all files in MEMFS
- // inputPaths.forEach(path => ffmpeg.FS('unlink', path));
- // ffmpeg.FS('unlink', 'order.txt');
- // ffmpeg.FS('unlink', 'output.mp4');
+ const result: Upload.AccessPathInfo | Error = await Networking.PostToServer('/concatVideos', serverPaths)
+ console.log(result)
+ if (!(result instanceof Error)) { // convert this screenshotBox into normal videoBox
+ props.setResult(result, trackScreen)
+ } else {
+ alert("video conversion failed");
+ }
+
})();
}
@@ -162,8 +91,6 @@ export function RecordingView(props: IRecordingViewProps) {
}, [videos])
useEffect(() => {
-
- console.log('in finish useEffect')
if (finished) {
setOrderVideos(true);
@@ -177,7 +104,7 @@ export function RecordingView(props: IRecordingViewProps) {
if (!navigator.mediaDevices) {
console.log('This browser does not support getUserMedia.')
}
- console.log('This device has the correct media devices.')
+ // console.log('This device has the correct media devices.')
}, [])
useEffect(() => {
@@ -244,7 +171,6 @@ export function RecordingView(props: IRecordingViewProps) {
// reset the temporary chunks
videoChunks = []
setRecording(false);
- setFinished(true);
trackScreen && RecordingApi.Instance.pause();
}
@@ -269,8 +195,10 @@ export function RecordingView(props: IRecordingViewProps) {
}
- const stop = () => {
- if (videoRecorder.current) {
+ const stop = (e: React.MouseEvent) => {
+ e.stopPropagation()
+ if (videoRecorder.current) {
+ setFinished(true);
if (videoRecorder.current.state !== "inactive") {
videoRecorder.current.stop();
// recorder.current.stream.getTracks().forEach((track: any) => track.stop())
@@ -278,19 +206,21 @@ export function RecordingView(props: IRecordingViewProps) {
}
}
- const pause = () => {
+ const pause = (e: React.MouseEvent) => {
+ e.stopPropagation()
if (videoRecorder.current) {
if (videoRecorder.current.state === "recording") {
- videoRecorder.current.pause();
+ videoRecorder.current.stop();
}
}
}
- const startOrResume = () => {
+ const startOrResume = (e: React.MouseEvent) => {
+ e.stopPropagation()
if (!videoRecorder.current || videoRecorder.current.state === "inactive") {
record();
} else if (videoRecorder.current.state === "paused") {
- videoRecorder.current.resume();
+ videoRecorder.current.start();
}
}
@@ -315,16 +245,6 @@ export function RecordingView(props: IRecordingViewProps) {
const seconds = Math.floor((milliseconds % (1000 * 60)) / 1000);
return toTwoDigit(minutes) + " : " + toTwoDigit(seconds);
}
-
- const doTranscode = async () => {
-
- // console.log('Start transcoding');
- // ffmpeg.FS('writeFile', 'test.avi', await fetchFile('/flame.avi'));
- // await ffmpeg.run('-i', 'test.avi', 'test.mp4');
- // console.log('Complete transcoding');
- // const data = ffmpeg.FS('readFile', 'test.mp4');
- // console.log(URL.createObjectURL(new Blob([data.buffer], { type: 'video/mp4' })));
- };
return (
<div className="recording-container">
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 21:31:23 +0000