Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

React Example #362

Open
wants to merge 3 commits into
base: master
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions examples/React/.babelrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"presets": ["react-native"]
}
6 changes: 6 additions & 0 deletions examples/React/.buckconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@

[android]
target = Google Inc.:Google APIs:23

[maven_repositories]
central = https://repo1.maven.org/maven2
56 changes: 56 additions & 0 deletions examples/React/.flowconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
[ignore]
; We fork some components by platform
.*/*[.]android.js

; Ignore "BUCK" generated dirs
<PROJECT_ROOT>/\.buckd/

; Ignore unexpected extra "@providesModule"
.*/node_modules/.*/node_modules/fbjs/.*

; Ignore duplicate module providers
; For RN Apps installed via npm, "Libraries" folder is inside
; "node_modules/react-native" but in the source repo it is in the root
.*/Libraries/react-native/React.js

; Ignore polyfills
.*/Libraries/polyfills/.*

; Ignore metro
.*/node_modules/metro/.*

[include]

[libs]
node_modules/react-native/Libraries/react-native/react-native-interface.js
node_modules/react-native/flow/
node_modules/react-native/flow-github/

[options]
emoji=true

module.system=haste

munge_underscores=true

module.name_mapper='^[./a-zA-Z0-9$_-]+\.\(bmp\|gif\|jpg\|jpeg\|png\|psd\|svg\|webp\|m4v\|mov\|mp4\|mpeg\|mpg\|webm\|aac\|aiff\|caf\|m4a\|mp3\|wav\|html\|pdf\)$' -> 'RelativeImageStub'

module.file_ext=.js
module.file_ext=.jsx
module.file_ext=.json
module.file_ext=.native.js

suppress_type=$FlowIssue
suppress_type=$FlowFixMe
suppress_type=$FlowFixMeProps
suppress_type=$FlowFixMeState

suppress_comment=\\(.\\|\n\\)*\\$FlowFixMe\\($\\|[^(]\\|(\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)
suppress_comment=\\(.\\|\n\\)*\\$FlowIssue\\((\\(<VERSION>\\)? *\\(site=[a-z,_]*react_native[a-z,_]*\\)?)\\)?:? #[0-9]+
suppress_comment=\\(.\\|\n\\)*\\$FlowFixedInNextDeploy
suppress_comment=\\(.\\|\n\\)*\\$FlowExpectedError

unsafe.enable_getters_and_setters=true

[version]
^0.61.0
53 changes: 53 additions & 0 deletions examples/React/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
# OSX
#
.DS_Store

# Xcode
#
build/
*.pbxuser
!default.pbxuser
*.mode1v3
!default.mode1v3
*.mode2v3
!default.mode2v3
*.perspectivev3
!default.perspectivev3
xcuserdata
*.xccheckout
*.moved-aside
DerivedData
*.hmap
*.ipa
*.xcuserstate
project.xcworkspace

# Android/IntelliJ
#
build/
.idea
.gradle
local.properties
*.iml

# node.js
#
node_modules/
npm-debug.log
yarn-error.log

# BUCK
buck-out/
\.buckd/
*.keystore

# fastlane
#
# It is recommended to not store the screenshots in the git repo. Instead, use fastlane to re-generate the
# screenshots whenever they are needed.
# For more information about the recommended setup visit:
# https://docs.fastlane.tools/best-practices/source-control/

*/fastlane/report.xml
*/fastlane/Preview.html
*/fastlane/screenshots
1 change: 1 addition & 0 deletions examples/React/.watchmanconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
{}
101 changes: 101 additions & 0 deletions examples/React/App.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,101 @@
/**
* Sample React Native App
* https://github.com/facebook/react-native
* @flow
*/

import React, { Component } from 'react';
import {
Platform,
StyleSheet,
Text,
View,
Button,
DeviceEventEmitter,
ToastAndroid
} from 'react-native';

import Hotword from './src/native/Hotword';


export default class App extends Component {
constructor(props) {
super(props);
this.state = { isRecording: false };
}

onPressRecord(isRecording) {

if(isRecording) {
Hotword.stop();
} else {
Hotword.start();
}

this.setState({
isRecording: !this.state.isRecording
});
}

handleHotwordDetection() {
ToastAndroid.show('Hossword Detected!', ToastAndroid.SHORT);
}

componentDidMount() {
Hotword.initHotword();
DeviceEventEmitter.addListener('HOTWORD_DETECTED', (e: Event) => {
this.handleHotwordDetection();
});
}

componentWillUnmount() {
Hotword.destroy();
}

render() {
return (
<View style={styles.container}>
<View>
<Text style={styles.welcome}>
Hey Hoss!
</Text>
<Text style={styles.instructions}>
Say "Hey Hoss" to log detection.
</Text>
</View>

<View style={styles.btnWrapper}>
<Button
onPress={() => {this.onPressRecord(this.state.isRecording)}}
title={ this.state.isRecording ? "Stop" : "Start" }
color="#841584"
/>
</View>
</View>
);
}
}

const styles = StyleSheet.create({
container: {
flex: 1,
justifyContent: 'center',
backgroundColor: '#F5FCFF',
},
btnWrapper: {
marginLeft: 60,
marginRight: 60,
marginTop: 20
},
welcome: {
fontSize: 32,
textAlign: 'center',
margin: 10,
},
instructions: {
fontSize: 24,
textAlign: 'center',
color: '#333333',
marginBottom: 10,
},
});
17 changes: 17 additions & 0 deletions examples/React/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
# README #

Integrate Snowboy hotword detection into React Native.

### What is this repository for? ###

* We had difficulting running swig in the Snowboy project and porting the libs to a new/different android project. This is a springboard for getting Snowboy to work in React Native
* v0.2

### How do I get set up? ###

* Download and then run npm install

### Who do I talk to? ###

* [John Cardwell](mailto://[email protected])
* Tutorial for bringing hotword into your own Android project: https://blog.fossasia.org/hotword-detection-in-susi-android-app-using-snowboy/
12 changes: 12 additions & 0 deletions examples/React/__tests__/App.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import 'react-native';
import React from 'react';
import App from '../App';

// Note: test renderer must be required after react-native.
import renderer from 'react-test-renderer';

it('renders correctly', () => {
const tree = renderer.create(
<App />
);
});
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
#Thu Feb 01 09:31:12 PST 2018
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
Binary file not shown.
1 change: 1 addition & 0 deletions examples/React/android/.idea/.name

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

18 changes: 18 additions & 0 deletions examples/React/android/.idea/gradle.xml

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

Loading