Make video recording work on Safari

tools/sense_studio/static/video_recording.js

@@ -77,10 +77,22 @@ function setupRecording(stream, url) {
 
 
 function startRecording(stream, recordingDuration, url) {
-    let mediaRecorder = new MediaRecorder(stream, {mimeType: 'video/webm; codecs=vp8'});
+    let mimeType;
+    if (MediaRecorder.isTypeSupported('video/webm; codecs=vp8')) {
+        mimeType = 'video/webm;codecs=vp8';
+        videoType = 'webm';
+    } else if (MediaRecorder.isTypeSupported('video/mp4')) {
+        mimeType = 'video/mp4';
+        videoType = 'mp4';
+    } else {
+        displayOverlay('No supported video format detected. Please try using Firefox, Chrome or Safari.');
+        return;
+    }
+
+    let mediaRecorder = new MediaRecorder(stream, {mimeType: mimeType});
     mediaRecorder.ondataavailable = function (event) {
         if (event.data.size > 0) {
-            saveVideo(event.data, url);
+            saveVideo(event.data, url, videoType);
         }
     };
     mediaRecorder.start();
@@ -107,10 +119,11 @@ function stopRecording(mediaRecorder) {
 }
 
 
-function saveVideo(chunk, url) {
-    let blob = new Blob([chunk], {type: 'video/webm'});
+function saveVideo(chunk, url, videoType) {
+    let blob = new Blob([chunk], {type: 'video/' + videoType});
     const formData = new FormData();
     formData.append('video', blob);
+    formData.append('video_type', videoType);
     fetch(url, {
         method: 'POST',
         body: formData,

tools/sense_studio/video_recording.py

@@ -43,10 +43,13 @@ def save_video(project, split, label):
     label = urllib.parse.unquote(label)
     path = project_utils.lookup_project_path(project)
 
+    data = request.form
+    video_type = data['video_type']
+
     # Read given video to a file
     input_stream = request.files['video']
     output_path = os.path.join(path, f'videos_{split}', label)
-    temp_file_name = os.path.join(output_path, 'temp_video.webm')
+    temp_file_name = os.path.join(output_path, f'temp_video.{video_type}')
     with open(temp_file_name, 'wb') as temp_file:
         temp_file.write(input_stream.read())
 
@@ -59,7 +62,8 @@ def save_video(project, split, label):
         output_file = os.path.join(output_path, f'video_{video_idx}.mp4')
 
     # Convert video to target frame rate and save to output name
-    subprocess.call(f'ffmpeg -i "{temp_file_name}" -r 30 "{output_file}"', shell=True)
+    # subprocess.call(f'ffmpeg -i "{temp_file_name}" -r 30 "{output_file}"', shell=True)
+    subprocess.call(f'cp "{temp_file_name}" "{output_file}"', shell=True)
 
     # Remove temp video file
     os.remove(temp_file_name)