Feat/recorder adapter node (#569)

* feat: implemented thread safe circular buffer

* feat: implemented recorder_adapter_node

implemented RecorderAdapterNode:
- hostObject
- typescript interface
- c++ classes

modified AndroidRecorder (currently commented out)
implemented method for creating node on BaseAudioContext
modified AudioRecorder so it works with the adapter well
modified example app so it can showcase how it works

* fix: fixed some errors

- set isInitialized on adapter node when it is ready
- added copying data to all channels in adapter node processing
- removed debuging logs

* chore: some changes request by msluszniak

- added noexcept to constructors
- added std:: namespace prefix to memory ops
- marked properties as mutable in CircularOverflowableAudioArray and
  made read const
- cleaned Recorder example from commented out code

* fix: changed adapter node to extend audio node

- changed AdapterNode to extend AudioNode instead of
  AudioScheduledSourceNode
- Added showcase of how u can stop recorder and adapter will play
  silence in the recorder example

* feat: added adapter buffer write in ios recorder

now IOSAudioRecorder also writes to the adapter circular buffer
but currently there is a problem that it seems to not work correctly on
ios. The played data is somehow corrupted and has "robotic" feel
also the previous example recorder app does not work on ios

* chore: conducted tests and cleaned minor things

* feat: aligned adapter node usage to other nodes

changed on how adapter node is connected to the recorder
moved adapter buffer to adapter node

* fix: fixed bug with ios misconfiguration

there was a weird bug that on ios devices sample rates kept being
misconfigured. It was caused by allowBluetooth mainly but took a lot of
time to find.

* docs: updated documentation

* fix: aplied requested changes

- updated recorder example by combining both example
- fixed misleading note in docs
- cleaned up some comments and logs
- tested if everything works fine on various sample rates
- fixed example usage code in docs to not use refs

* Update packages/audiodocs/docs/inputs/audio-recorder.mdx

Co-authored-by: Maciej Makowski <[email protected]>

* fix: aplied requested changes

- fixed adapter node docs
- fixed access modifiers for recorder and adapter node in ts

* fix: fixed possible thread safety related issues

- added disconnect method for recorder
- added lock for adapter node access in recorder now when we change
  recorders adapter nothing bad will happen
- added init checking for adapter so it is checked in typescript layer
- updated docs

* fix: added disconnect method on ts layer

- added disconnect method in typescript layer
- fixed namming in adapter node

---------

Co-authored-by: Kacper Poneta <[email protected]>
Co-authored-by: Maciej Makowski <[email protected]>

Author: 3 people

apps/common-app/src/examples/Record/Record.tsx

@@ -1,35 +1,102 @@
 import React, { useRef, FC, useEffect } from 'react';
 import {
-  AudioBuffer,
   AudioContext,
   AudioManager,
   AudioRecorder,
+  RecorderAdapterNode,
   AudioBufferSourceNode,
+  AudioBuffer
 } from 'react-native-audio-api';
 
 import { Container, Button } from '../../components';
+import { View, Text } from 'react-native';
+import { colors } from '../../styles';
+
+const SAMPLE_RATE = 16000;
 
 const Record: FC = () => {
   const recorderRef = useRef<AudioRecorder | null>(null);
+  const aCtxRef = useRef<AudioContext | null>(null);
+  const recorderAdapterRef = useRef<RecorderAdapterNode | null>(null);
   const audioBuffersRef = useRef<AudioBuffer[]>([]);
   const sourcesRef = useRef<AudioBufferSourceNode[]>([]);
-  const aCtxRef = useRef<AudioContext | null>(null);
+
 
   useEffect(() => {
     AudioManager.setAudioSessionOptions({
       iosCategory: 'playAndRecord',
       iosMode: 'spokenAudio',
-      iosOptions: ['allowBluetooth', 'defaultToSpeaker'],
+      iosOptions: ['defaultToSpeaker', 'allowBluetoothA2DP'],
     });
-
+    
     recorderRef.current = new AudioRecorder({
-      sampleRate: 16000,
-      bufferLengthInSamples: 16000,
+      sampleRate: SAMPLE_RATE,
+      bufferLengthInSamples: SAMPLE_RATE,
     });
   }, []);
 
-  const onReplay = () => {
-    const aCtx = new AudioContext({ sampleRate: 16000 });
+
+  const startEcho = () => {
+    if (!recorderRef.current) {
+      console.error('AudioContext or AudioRecorder is not initialized');
+      return;
+    }
+
+    aCtxRef.current = new AudioContext({ sampleRate: SAMPLE_RATE });
+    recorderAdapterRef.current = aCtxRef.current.createRecorderAdapter();
+    recorderAdapterRef.current.connect(aCtxRef.current.destination);
+    recorderRef.current.connect(recorderAdapterRef.current);
+    
+    recorderRef.current.start();
+    console.log('Recording started'); 
+    console.log('Audio context state:', aCtxRef.current.state);
+    if (aCtxRef.current.state === 'suspended') {
+      console.log('Resuming audio context');
+      aCtxRef.current.resume();
+    }
+  }
+
+  /// This stops only the recording, not the audio context
+  const stopEcho = () => {
+    if (!recorderRef.current) {
+      console.error('AudioRecorder is not initialized');
+      return;
+    }
+    recorderRef.current.stop();
+    aCtxRef.current = null;
+    recorderAdapterRef.current = null;
+    console.log('Recording stopped');
+  }
+
+  const startRecordReplay = () => {
+    if (!recorderRef.current) {
+      console.error('AudioRecorder is not initialized');
+      return;
+    }
+
+    recorderRef.current.onAudioReady((event) => {
+      const { buffer, numFrames, when } = event;
+
+      console.log(
+        'Audio recorder buffer ready:',
+        buffer.duration,
+        numFrames,
+        when
+      );
+      audioBuffersRef.current.push(buffer);
+    });
+
+    recorderRef.current.start();
+
+    setTimeout(() => {
+      recorderRef.current?.stop();
+      console.log('Recording stopped');
+    }, 5000);
+
+  }
+
+  const stopRecordReplay = () => {
+    const aCtx = new AudioContext({ sampleRate: SAMPLE_RATE });
     aCtxRef.current = aCtx;
 
     if (aCtx.state === 'suspended') {
@@ -47,9 +114,6 @@ const Record: FC = () => {
       source.buffer = buffers[i];
 
       source.connect(aCtx.destination);
-      source.onended = () => {
-        console.log('Audio buffer source ended');
-      };
       sourcesRef.current.push(source);
 
       source.start(nextStartAt);
@@ -64,36 +128,22 @@ const Record: FC = () => {
       },
       (nextStartAt - tNow) * 1000
     );
-  };
 
-  const onRecord = () => {
-    if (!recorderRef.current) {
-      return;
-    }
-
-    recorderRef.current.onAudioReady((event) => {
-      const { buffer, numFrames, when } = event;
-
-      console.log(
-        'Audio recorder buffer ready:',
-        buffer.duration,
-        numFrames,
-        when
-      );
-      audioBuffersRef.current.push(buffer);
-    });
-
-    recorderRef.current.start();
-
-    setTimeout(() => {
-      recorderRef.current?.stop();
-    }, 3000);
-  };
+  }
 
   return (
-    <Container centered>
-      <Button title="Record" onPress={onRecord} />
-      <Button title="Replay" onPress={onReplay} />
+    <Container style={{ gap: 40 }}>
+      <Text style={{ color: colors.white, fontSize: 24, textAlign: 'center' }}>Sample rate: {SAMPLE_RATE}</Text>
+      <View style={{ alignItems: 'center', justifyContent: 'center', gap: 5 }}>
+        <Text style={{ color: colors.white, fontSize: 24 }}>Echo example</Text>
+        <Button title="Start Recording" onPress={startEcho} />
+        <Button title="Stop Recording" onPress={stopEcho} />
+      </View>
+      <View style={{ alignItems: 'center', justifyContent: 'center', gap: 5 }}>
+        <Text style={{ color: colors.white, fontSize: 24 }}>Record & replay example</Text>
+        <Button title="Record for Replay" onPress={startRecordReplay} />
+        <Button title="Replay" onPress={stopRecordReplay} />
+      </View>
     </Container>
   );
 };

packages/audiodocs/docs/core/base-audio-context.mdx

@@ -52,6 +52,12 @@ The above method lets you create [`AnalyserNode`](/analysis/analyser-node).
 
 #### Returns `AnalyserNode`.
 
+### `createRecorderAdapter`
+
+The above method lets you create [`RecorderAdapterNode`](/sources/recorder-adapter-node).
+
+#### Returns `RecorderAdapterNode`
+
 ### `createBiquadFilter`
 
 The above method lets you create `BiquadFilterNode`.

packages/audiodocs/docs/inputs/audio-recorder.mdx

@@ -51,6 +51,20 @@ The above stops recording.
 
 #### Returns `undefined`.
 
+### `connect`
+
+The above method connects recorder to the adapter. If the recorder is already connected it will change its adapter (it is equivalent of calling disconnect() previously).
+Be carefull `RecorderAdapterNode` can be connected only once. You can't connect same adapter twice (even to different recorders).
+
+| Parameters | Type | Description |
+| :---: | :---: | :---- |
+| `node` | [RecorderAdapterNode](/sources/recorder-adapter-node) | Adapter that we want to connect to. |
+
+#### Returns `undefined`
+
+### `disconnect`
+
+The above method disconnects recorder from the currently connected adapter. It does not need to be called before connect.
 
 ### `onAudioReady`
 

packages/audiodocs/docs/sources/recorder-adapter-node.mdx

@@ -0,0 +1,34 @@
+---
+sidebar_position: 6
+---
+
+import AudioNodePropsTable from "@site/src/components/AudioNodePropsTable"
+import { Optional, ReadOnly } from '@site/src/components/Badges';
+
+# RecorderAdapterNode
+
+The `RecorderAdapterNode` is an [`AudioNode`](/core/audio-node) which is an adapter for [`AudioRecorder`](/inputs/audio-recorder).
+It lets you compose audio input from recorder into an audio graph.
+
+## Constructor
+
+[`BaseAudioContext.createRecorderAdapter()`](/core/base-audio-context#createrecorderadapter)
+
+## Example
+
+```tsx
+const recorder = new AudioRecorder({
+    sampleRate: 48000,
+    bufferLengthInSamples: 48000,
+});
+const audioContext = new AudioContext({ sampleRate: 48000 });
+const recorderAdapterNode = aCtxRef.current.createRecorderAdapter();
+
+recorder.connect(recorderAdapterNode);
+recorderAdapterNode.connect(audioContext.destination)
+```
+
+## Remarks
+- Adapter without the recorder will produce silence
+- Adapter that is connected only to the recorder will work fine and keep small buffer of recorded Data
+- Adapter node will not be garbage collected until he is connected to either some destination or recorder 

packages/react-native-audio-api/android/src/main/cpp/audioapi/android/core/AndroidAudioRecorder.cpp

@@ -1,9 +1,11 @@
 #include <audioapi/android/core/AndroidAudioRecorder.h>
 #include <audioapi/core/Constants.h>
+#include <audioapi/core/sources/RecorderAdapterNode.h>
 #include <audioapi/events/AudioEventHandlerRegistry.h>
 #include <audioapi/utils/AudioArray.h>
 #include <audioapi/utils/AudioBus.h>
 #include <audioapi/utils/CircularAudioArray.h>
+#include <audioapi/utils/CircularOverflowableAudioArray.h>
 
 namespace audioapi {
 
@@ -65,7 +67,7 @@ DataCallbackResult AndroidAudioRecorder::onAudioReady(
     int32_t numFrames) {
   if (isRunning_.load()) {
     auto *inputChannel = static_cast<float *>(audioData);
-    circularBuffer_->push_back(inputChannel, numFrames);
+    writeToBuffers(inputChannel, numFrames);
   }
 
   while (circularBuffer_->getNumberOfAvailableFrames() >= bufferLength_) {

packages/react-native-audio-api/common/cpp/audioapi/HostObjects/AudioRecorderHostObject.h

@@ -5,6 +5,7 @@
 #include <audioapi/core/sources/AudioBuffer.h>
 #include <audioapi/HostObjects/AudioBufferHostObject.h>
 #include <audioapi/core/inputs/AudioRecorder.h>
+#include <audioapi/HostObjects/RecorderAdapterNodeHostObject.h>
 
 #ifdef ANDROID
 #include <audioapi/android/core/AndroidAudioRecorder.h>
@@ -45,7 +46,22 @@ class AudioRecorderHostObject : public JsiHostObject {
 
     addFunctions(
       JSI_EXPORT_FUNCTION(AudioRecorderHostObject, start),
-      JSI_EXPORT_FUNCTION(AudioRecorderHostObject, stop));
+      JSI_EXPORT_FUNCTION(AudioRecorderHostObject, stop),
+      JSI_EXPORT_FUNCTION(AudioRecorderHostObject, connect),
+      JSI_EXPORT_FUNCTION(AudioRecorderHostObject, disconnect)
+    );
+  }
+
+  JSI_HOST_FUNCTION(connect) {
+    auto adapterNodeHostObject = args[0].getObject(runtime).getHostObject<RecorderAdapterNodeHostObject>(runtime);
+    audioRecorder_->connect(
+        std::static_pointer_cast<RecorderAdapterNode>(adapterNodeHostObject->node_));
+    return jsi::Value::undefined();
+  }
+
+  JSI_HOST_FUNCTION(disconnect) {
+    audioRecorder_->disconnect();
+    return jsi::Value::undefined();
   }
 
   JSI_HOST_FUNCTION(start) {

packages/react-native-audio-api/common/cpp/audioapi/HostObjects/BaseAudioContextHostObject.h

@@ -14,6 +14,7 @@
 #include <audioapi/HostObjects/PeriodicWaveHostObject.h>
 #include <audioapi/HostObjects/StereoPannerNodeHostObject.h>
 #include <audioapi/HostObjects/AnalyserNodeHostObject.h>
+#include <audioapi/HostObjects/RecorderAdapterNodeHostObject.h>
 
 #include <jsi/jsi.h>
 #include <memory>
@@ -40,6 +41,7 @@ class BaseAudioContextHostObject : public JsiHostObject {
         JSI_EXPORT_PROPERTY_GETTER(BaseAudioContextHostObject, currentTime));
 
     addFunctions(
+        JSI_EXPORT_FUNCTION(BaseAudioContextHostObject, createRecorderAdapter),
         JSI_EXPORT_FUNCTION(BaseAudioContextHostObject, createOscillator),
         JSI_EXPORT_FUNCTION(BaseAudioContextHostObject, createCustomProcessor),
         JSI_EXPORT_FUNCTION(BaseAudioContextHostObject, createGain),
@@ -73,6 +75,12 @@ class BaseAudioContextHostObject : public JsiHostObject {
     return {context_->getCurrentTime()};
   }
 
+  JSI_HOST_FUNCTION(createRecorderAdapter) {
+    auto recorderAdapter = context_->createRecorderAdapter();
+    auto recorderAdapterHostObject = std::make_shared<RecorderAdapterNodeHostObject>(recorderAdapter);
+    return jsi::Object::createFromHostObject(runtime, recorderAdapterHostObject);
+  }
+
   JSI_HOST_FUNCTION(createOscillator) {
     auto oscillator = context_->createOscillator();
     auto oscillatorHostObject =

packages/react-native-audio-api/common/cpp/audioapi/HostObjects/RecorderAdapterNodeHostObject.h

@@ -0,0 +1,26 @@
+#pragma once
+
+#include <audioapi/core/sources/RecorderAdapterNode.h>
+#include <audioapi/HostObjects/AudioNodeHostObject.h>
+
+#include <memory>
+#include <string>
+#include <vector>
+
+namespace audioapi {
+using namespace facebook;
+
+class AudioRecorderHostObject;
+
+class RecorderAdapterNodeHostObject : public AudioNodeHostObject {
+ public:
+    explicit RecorderAdapterNodeHostObject(
+        const std::shared_ptr<RecorderAdapterNode> &node)
+        : AudioNodeHostObject(node) {
+        }
+
+ private:
+    friend class AudioRecorderHostObject;
+};
+
+} // namespace audioapi

packages/react-native-audio-api/common/cpp/audioapi/core/BaseAudioContext.cpp

@@ -9,6 +9,7 @@
 #include <audioapi/core/sources/AudioBufferQueueSourceNode.h>
 #include <audioapi/core/sources/AudioBufferSourceNode.h>
 #include <audioapi/core/sources/OscillatorNode.h>
+#include <audioapi/core/sources/RecorderAdapterNode.h>
 #include <audioapi/core/utils/AudioDecoder.h>
 #include <audioapi/core/utils/AudioNodeManager.h>
 #include <audioapi/events/AudioEventHandlerRegistry.h>
@@ -49,6 +50,12 @@ std::shared_ptr<AudioDestinationNode> BaseAudioContext::getDestination() {
   return destination_;
 }
 
+std::shared_ptr<RecorderAdapterNode> BaseAudioContext::createRecorderAdapter() {
+  auto recorderAdapter = std::make_shared<RecorderAdapterNode>(this);
+  nodeManager_->addProcessingNode(recorderAdapter);
+  return recorderAdapter;
+}
+
 std::shared_ptr<OscillatorNode> BaseAudioContext::createOscillator() {
   auto oscillator = std::make_shared<OscillatorNode>(this);
   nodeManager_->addSourceNode(oscillator);

packages/react-native-audio-api/common/cpp/audioapi/core/BaseAudioContext.h

@@ -3,6 +3,7 @@
 #include <audioapi/core/types/ContextState.h>
 #include <audioapi/core/types/OscillatorType.h>
 
+
 #include <functional>
 #include <memory>
 #include <string>
@@ -30,6 +31,7 @@ class AudioDecoder;
 class AnalyserNode;
 class AudioEventHandlerRegistry;
 class IAudioEventHandlerRegistry;
+class RecorderAdapterNode;
 
 class BaseAudioContext {
  public:
@@ -42,6 +44,7 @@ class BaseAudioContext {
   [[nodiscard]] std::size_t getCurrentSampleFrame() const;
   std::shared_ptr<AudioDestinationNode> getDestination();
 
+  std::shared_ptr<RecorderAdapterNode> createRecorderAdapter();
   std::shared_ptr<OscillatorNode> createOscillator();
   std::shared_ptr<CustomProcessorNode> createCustomProcessor(const std::string& identifier);
   std::shared_ptr<GainNode> createGain();