From c9b1f516bf18feaa6187ce72dac1d01546c36521 Mon Sep 17 00:00:00 2001 From: Marcin Miazga Date: Sat, 6 Oct 2018 15:06:58 +0200 Subject: [PATCH 01/16] add speech recorder --- outloud/android/app/build.gradle | 2 + .../android/app/src/main/AndroidManifest.xml | 1 + .../java/com/outloud/MainApplication.java | 4 + outloud/android/settings.gradle | 4 + outloud/ios/outloud.xcodeproj/project.pbxproj | 38 +++ outloud/package-lock.json | 18 +- outloud/package.json | 2 + outloud/src/components/MainPage.js | 1 + outloud/src/components/QuizData.js | 91 ++++--- outloud/src/components/RecordScreen.js | 27 ++ outloud/src/components/navigation/StackNav.js | 21 +- .../src/components/speech/SpeechRecorder.js | 235 ++++++++++++++++++ run-emulator.sh | 2 +- 13 files changed, 386 insertions(+), 60 deletions(-) create mode 100644 outloud/src/components/RecordScreen.js create mode 100644 outloud/src/components/speech/SpeechRecorder.js diff --git a/outloud/android/app/build.gradle b/outloud/android/app/build.gradle index 19fb3cc..464cf98 100644 --- a/outloud/android/app/build.gradle +++ b/outloud/android/app/build.gradle @@ -149,6 +149,8 @@ android { } dependencies { + api project(':react-native-sound') + api project(':react-native-audio') api project(':react-native-sentry') api project(':react-native-vector-icons') api project(':react-native-auth0') diff --git a/outloud/android/app/src/main/AndroidManifest.xml b/outloud/android/app/src/main/AndroidManifest.xml index c7a6607..f65e86a 100644 --- a/outloud/android/app/src/main/AndroidManifest.xml +++ b/outloud/android/app/src/main/AndroidManifest.xml @@ -3,6 +3,7 @@ + getPackages() { return Arrays.asList( new MainReactPackage(), + new RNSoundPackage(), + new ReactNativeAudioPackage(), new RNSentryPackage(), new VectorIconsPackage(), new A0Auth0Package() diff --git a/outloud/android/settings.gradle b/outloud/android/settings.gradle index 87e43e3..47a250a 100644 --- a/outloud/android/settings.gradle +++ b/outloud/android/settings.gradle @@ -1,4 +1,8 @@ rootProject.name = 'outloud' +include ':react-native-sound' +project(':react-native-sound').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-sound/android') +include ':react-native-audio' +project(':react-native-audio').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-audio/android') include ':react-native-sentry' project(':react-native-sentry').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-sentry/android') include ':react-native-vector-icons' diff --git a/outloud/ios/outloud.xcodeproj/project.pbxproj b/outloud/ios/outloud.xcodeproj/project.pbxproj index 4f5ad58..1e1a55c 100644 --- a/outloud/ios/outloud.xcodeproj/project.pbxproj +++ b/outloud/ios/outloud.xcodeproj/project.pbxproj @@ -55,6 +55,8 @@ 1B1C5942D03E426CB9C2FB7F /* Zocial.ttf in Resources */ = {isa = PBXBuildFile; fileRef = 99D1C6418F98414CA5DC2CC2 /* Zocial.ttf */; }; 6E87516B04464D49950A7DBC /* libRNSentry.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 0011225C01B04BED8717C24B /* libRNSentry.a */; }; 17CC0BFB5A624B2B897B62A6 /* libz.tbd in Frameworks */ = {isa = PBXBuildFile; fileRef = 600D0A678C1245F89E9AA624 /* libz.tbd */; }; + 4BC2473C28B64A8BB5D9D532 /* libRNAudio.a in Frameworks */ = {isa = PBXBuildFile; fileRef = B88B4FB355AD44A7B6B92BAB /* libRNAudio.a */; }; + C368EDA246F4490382B2886E /* libRNSound.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 40243AE54810444B832F8D38 /* libRNSound.a */; }; /* End PBXBuildFile section */ /* Begin PBXContainerItemProxy section */ @@ -381,6 +383,10 @@ 6912CC50CEEB4960B1D13FD8 /* RNSentry.xcodeproj */ = {isa = PBXFileReference; name = "RNSentry.xcodeproj"; path = "../node_modules/react-native-sentry/ios/RNSentry.xcodeproj"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; }; 0011225C01B04BED8717C24B /* libRNSentry.a */ = {isa = PBXFileReference; name = "libRNSentry.a"; path = "libRNSentry.a"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; }; 600D0A678C1245F89E9AA624 /* libz.tbd */ = {isa = PBXFileReference; name = "libz.tbd"; path = "usr/lib/libz.tbd"; sourceTree = SDKROOT; fileEncoding = undefined; lastKnownFileType = sourcecode.text-based-dylib-definition; explicitFileType = undefined; includeInIndex = 0; }; + EFC7F60EF69B4D5E85A0CAA7 /* RNAudio.xcodeproj */ = {isa = PBXFileReference; name = "RNAudio.xcodeproj"; path = "../node_modules/react-native-audio/ios/RNAudio.xcodeproj"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; }; + B88B4FB355AD44A7B6B92BAB /* libRNAudio.a */ = {isa = PBXFileReference; name = "libRNAudio.a"; path = "libRNAudio.a"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; }; + 1F2DE364E8B540A9BCCE2C1E /* RNSound.xcodeproj */ = {isa = PBXFileReference; name = "RNSound.xcodeproj"; path = "../node_modules/react-native-sound/RNSound.xcodeproj"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = wrapper.pb-project; explicitFileType = undefined; includeInIndex = 0; }; + 40243AE54810444B832F8D38 /* libRNSound.a */ = {isa = PBXFileReference; name = "libRNSound.a"; path = "libRNSound.a"; sourceTree = ""; fileEncoding = undefined; lastKnownFileType = archive.ar; explicitFileType = undefined; includeInIndex = 0; }; /* End PBXFileReference section */ /* Begin PBXFrameworksBuildPhase section */ @@ -412,6 +418,8 @@ 5D0C14CD548548A389E27040 /* libRNVectorIcons.a in Frameworks */, 6E87516B04464D49950A7DBC /* libRNSentry.a in Frameworks */, 17CC0BFB5A624B2B897B62A6 /* libz.tbd in Frameworks */, + 4BC2473C28B64A8BB5D9D532 /* libRNAudio.a in Frameworks */, + C368EDA246F4490382B2886E /* libRNSound.a in Frameworks */, ); runOnlyForDeploymentPostprocessing = 0; }; @@ -602,6 +610,8 @@ 7A84098CE45E4444BE0F1050 /* A0Auth0.xcodeproj */, C005F086220645DBB7ECBCAA /* RNVectorIcons.xcodeproj */, 6912CC50CEEB4960B1D13FD8 /* RNSentry.xcodeproj */, + EFC7F60EF69B4D5E85A0CAA7 /* RNAudio.xcodeproj */, + 1F2DE364E8B540A9BCCE2C1E /* RNSound.xcodeproj */, ); name = Libraries; sourceTree = ""; @@ -1269,12 +1279,16 @@ "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", ); HEADER_SEARCH_PATHS = ( "$(inherited)", "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Debug; @@ -1299,12 +1313,16 @@ "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", ); HEADER_SEARCH_PATHS = ( "$(inherited)", "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Release; @@ -1330,6 +1348,8 @@ "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Debug; @@ -1354,6 +1374,8 @@ "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Release; @@ -1386,12 +1408,16 @@ "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", ); HEADER_SEARCH_PATHS = ( "$(inherited)", "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Debug; @@ -1424,12 +1450,16 @@ "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", ); HEADER_SEARCH_PATHS = ( "$(inherited)", "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Release; @@ -1461,12 +1491,16 @@ "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", ); HEADER_SEARCH_PATHS = ( "$(inherited)", "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Debug; @@ -1498,12 +1532,16 @@ "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", + "\"$(SRCROOT)/$(TARGET_NAME)\"", ); HEADER_SEARCH_PATHS = ( "$(inherited)", "$(SRCROOT)\..\node_modules\react-native-auth0\ios", "$(SRCROOT)\..\node_modules\react-native-vector-icons\RNVectorIconsManager", "$(SRCROOT)\..\node_modules\react-native-sentry\ios/**", + "$(SRCROOT)\..\node_modules\react-native-audio\ios", + "$(SRCROOT)\..\node_modules\react-native-sound\RNSound", ); }; name = Release; diff --git a/outloud/package-lock.json b/outloud/package-lock.json index 96a01a4..3dca385 100644 --- a/outloud/package-lock.json +++ b/outloud/package-lock.json @@ -3420,13 +3420,11 @@ }, "balanced-match": { "version": "1.0.0", - "bundled": true, - "optional": true + "bundled": true }, "brace-expansion": { "version": "1.1.11", "bundled": true, - "optional": true, "requires": { "balanced-match": "^1.0.0", "concat-map": "0.0.1" @@ -3443,8 +3441,7 @@ }, "concat-map": { "version": "0.0.1", - "bundled": true, - "optional": true + "bundled": true }, "console-control-strings": { "version": "1.1.0", @@ -3573,7 +3570,6 @@ "minimatch": { "version": "3.0.4", "bundled": true, - "optional": true, "requires": { "brace-expansion": "^1.1.7" } @@ -7277,6 +7273,11 @@ "yargs": "^9.0.0" } }, + "react-native-audio": { + "version": "4.2.1", + "resolved": "https://registry.npmjs.org/react-native-audio/-/react-native-audio-4.2.1.tgz", + "integrity": "sha512-vRKuvAgJZOi6wsIhI6L22vyrulBHt74WtQofj//0mgjbWl3Pcz685lYWHBCVV5jHxu334q+tqZiQbix7jXwrhA==" + }, "react-native-auth0": { "version": "1.3.0", "resolved": "https://registry.npmjs.org/react-native-auth0/-/react-native-auth0-1.3.0.tgz", @@ -7329,6 +7330,11 @@ "raven-js": "^3.24.2" } }, + "react-native-sound": { + "version": "0.10.9", + "resolved": "https://registry.npmjs.org/react-native-sound/-/react-native-sound-0.10.9.tgz", + "integrity": "sha1-awCw9K/QF83gn7udFx3xtdW4Uag=" + }, "react-native-tab-view": { "version": "0.0.77", "resolved": "http://registry.npmjs.org/react-native-tab-view/-/react-native-tab-view-0.0.77.tgz", diff --git a/outloud/package.json b/outloud/package.json index cfc4297..f7147fa 100644 --- a/outloud/package.json +++ b/outloud/package.json @@ -10,8 +10,10 @@ "jwt-decode": "^2.2.0", "react": "16.5.0", "react-native": "0.57.1", + "react-native-audio": "^4.2.1", "react-native-auth0": "^1.3.0", "react-native-sentry": "^0.39.0", + "react-native-sound": "^0.10.9", "react-native-vector-icons": "^5.0.0", "react-navigation": "^2.17.0" }, diff --git a/outloud/src/components/MainPage.js b/outloud/src/components/MainPage.js index dd92fb9..19db07a 100644 --- a/outloud/src/components/MainPage.js +++ b/outloud/src/components/MainPage.js @@ -10,6 +10,7 @@ class MainPage extends Component {