feat: Add onBytesWrittenVideo event while recording Videos (#3549)

* Android Event Emitter for receiving Bytes when recording Video

* Implement Android Event Emitter as it should be for Android Views

* working for ios

* update docs

* small changes

* fix lint issues

* fix pr comments

* chore: Format Swift code

---------

Co-authored-by: Felipe Rodriguez Esturo <[email protected]>
Co-authored-by: Felipe Rodriguez Esturo <[email protected]>
Co-authored-by: Marc Rousavy <[email protected]>

Author: 4 people

docs/docs/guides/RECORDING_VIDEOS.mdx

@@ -42,6 +42,7 @@ To start a video recording you first have to enable video capture:
   {...props}
   video={true}
   audio={true} // <-- optional
+  onBytesWrittenVideo={(bytes) => {/*Whatever you need with bytes in realtime while it is recording*/}} // <-- optional
 />
 ```
 

example/src/CameraPage.tsx

@@ -205,6 +205,7 @@ export function CameraPage({ navigation }: Props): React.ReactElement {
                 ref={camera}
                 onInitialized={onInitialized}
                 onError={onError}
+                onBytesWrittenVideo={(bytes) => console.log(`Bytes written: ${bytes / 1024 / 1024} MB!`)}
                 onStarted={() => console.log('Camera started!')}
                 onStopped={() => console.log('Camera stopped!')}
                 onPreviewStarted={() => console.log('Preview started!')}

package/android/src/main/cpp/frameprocessors/FrameHostObject.cpp

@@ -55,7 +55,7 @@ std::vector<jsi::PropNameID> FrameHostObject::getPropertyNames(jsi::Runtime& rt)
   return result;
 }
 
-#define JSI_FUNC [=](jsi::Runtime & runtime, const jsi::Value& thisValue, const jsi::Value* arguments, size_t count) -> jsi::Value
+#define JSI_FUNC [=](jsi::Runtime & runtime, const jsi::Value& thisValue, const jsi::Value* arguments, size_t count)->jsi::Value
 
 jsi::Value FrameHostObject::get(jsi::Runtime& runtime, const jsi::PropNameID& propName) {
   auto name = propName.utf8(runtime);

package/android/src/main/java/com/mrousavy/camera/core/CameraSession+Video.kt

@@ -17,7 +17,8 @@ fun CameraSession.startRecording(
   enableAudio: Boolean,
   options: RecordVideoOptions,
   callback: (video: Video) -> Unit,
-  onError: (error: CameraError) -> Unit
+  onError: (error: CameraError) -> Unit,
+  onBytesWrittenCallback: (bytes: Long) -> Unit
 ) {
   if (camera == null) throw CameraNotReadyError()
   if (recording != null) throw RecordingInProgressError()
@@ -49,7 +50,10 @@ fun CameraSession.startRecording(
 
       is VideoRecordEvent.Pause -> Log.i(CameraSession.TAG, "Recording paused!")
 
-      is VideoRecordEvent.Status -> Log.i(CameraSession.TAG, "Status update! Recorded ${event.recordingStats.numBytesRecorded} bytes.")
+      is VideoRecordEvent.Status -> {
+        Log.i(CameraSession.TAG, "Status update! Recorded ${event.recordingStats.numBytesRecorded} bytes.")
+        onBytesWrittenCallback(event.recordingStats.numBytesRecorded)
+      }
 
       is VideoRecordEvent.Finalize -> {
         if (isRecordingCanceled) {

package/android/src/main/java/com/mrousavy/camera/core/CameraSession.kt

@@ -221,5 +221,6 @@ class CameraSession(internal val context: Context, internal val callback: Callba
     fun onOutputOrientationChanged(outputOrientation: Orientation)
     fun onPreviewOrientationChanged(previewOrientation: Orientation)
     fun onCodeScanned(codes: List<Barcode>, scannerFrame: CodeScannerFrame)
+    fun onBytesWrittenVideo(bytesWritten: Double)
   }
 }

package/android/src/main/java/com/mrousavy/camera/react/CameraView+Events.kt

@@ -125,6 +125,17 @@ fun CameraView.invokeOnAverageFpsChanged(averageFps: Double) {
   this.sendEvent(event)
 }
 
+fun CameraView.invokeOnBytesWrittenVideo(bytesWritten: Double) {
+  Log.i(CameraView.TAG, "invokeOnBytesWrittenVideo($bytesWritten)")
+
+  val surfaceId = UIManagerHelper.getSurfaceId(this)
+  val data = Arguments.createMap()
+  data.putDouble("bytesWritten", bytesWritten)
+
+  val event = BytesWrittenVideoEvent(surfaceId, id, data)
+  this.sendEvent(event)
+}
+
 fun CameraView.invokeOnCodeScanned(barcodes: List<Barcode>, scannerFrame: CodeScannerFrame) {
   val codes = Arguments.createArray()
   barcodes.forEach { barcode ->

package/android/src/main/java/com/mrousavy/camera/react/CameraView+RecordVideo.kt

@@ -17,7 +17,9 @@ import com.mrousavy.camera.core.types.Video
 import com.mrousavy.camera.react.utils.makeErrorMap
 
 fun CameraView.startRecording(options: RecordVideoOptions, onRecordCallback: Callback) {
-  // check audio permission
+  val onBytesWrittenCallback = { bytes: Long ->
+    this.onBytesWrittenVideo(bytes.toDouble())
+  }
   if (audio) {
     if (ContextCompat.checkSelfPermission(context, Manifest.permission.RECORD_AUDIO) != PackageManager.PERMISSION_GRANTED) {
       throw MicrophonePermissionError()
@@ -36,7 +38,7 @@ fun CameraView.startRecording(options: RecordVideoOptions, onRecordCallback: Cal
     val errorMap = makeErrorMap(error.code, error.message)
     onRecordCallback(null, errorMap)
   }
-  cameraSession.startRecording(audio, options, callback, onError)
+  cameraSession.startRecording(audio, options, callback, onError, onBytesWrittenCallback)
 }
 
 fun CameraView.pauseRecording() {

package/android/src/main/java/com/mrousavy/camera/react/CameraView.kt

@@ -350,4 +350,8 @@ class CameraView(context: Context) :
   override fun onAverageFpsChanged(averageFps: Double) {
     invokeOnAverageFpsChanged(averageFps)
   }
+
+  override fun onBytesWrittenVideo(bytesWritten: Double) {
+    invokeOnBytesWrittenVideo(bytesWritten)
+  }
 }

package/android/src/main/java/com/mrousavy/camera/react/CameraViewManager.kt

@@ -41,6 +41,7 @@ class CameraViewManager : ViewGroupManager<CameraView>() {
       .put(CameraOutputOrientationChangedEvent.EVENT_NAME, MapBuilder.of("registrationName", "onOutputOrientationChanged"))
       .put(CameraPreviewOrientationChangedEvent.EVENT_NAME, MapBuilder.of("registrationName", "onPreviewOrientationChanged"))
       .put(AverageFpsChangedEvent.EVENT_NAME, MapBuilder.of("registrationName", "onAverageFpsChanged"))
+      .put(BytesWrittenVideoEvent.EVENT_NAME, MapBuilder.of("registrationName", "onBytesWrittenVideo"))
       .build()
 
   override fun getName(): String = TAG

package/android/src/main/java/com/mrousavy/camera/react/Events.kt

@@ -102,3 +102,11 @@ class CameraCodeScannedEvent(surfaceId: Int, viewId: Int, private val data: Writ
     const val EVENT_NAME = "topCameraCodeScanned"
   }
 }
+class BytesWrittenVideoEvent(surfaceId: Int, viewId: Int, private val data: WritableMap) :
+  Event<BytesWrittenVideoEvent>(surfaceId, viewId) {
+  override fun getEventName() = EVENT_NAME
+  override fun getEventData() = data
+  companion object {
+    const val EVENT_NAME = "bytesWrittenVideoEvent"
+  }
+}