Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
/**
* Sample React Native App
* https://github.com/facebook/react-native
*/
'use strict';
var PushManager = require('./RemotePushIOS');
var registerInstallation = require('./Installation');
var WEBVIEW_REF = 'webview';
var React = require('react-native');
var {
AlertIOS,
PushNotificationIOS,
StyleSheet,
Text,
TouchableHighlight,
View,
AppRegistry,
NavigatorIOS,
WebView,
} = React;
var myMeal = React.createClass({
render: function() {
return (
<LaunchScreen />
)
}
});
class HomeScreen extends React.Component {
showDetail() {
this.props.navigator.push({
title: "Detail Screen",
component: SubScreen,
passProps: { link: 'https://www.theguardian.com/football'}
});
}
render() {
// http://stackoverflow.com/questions/30079640/undefined-is-not-an-object-evaluating-this-props-navigator-push
return (
<View
navigator={this.props.navigator}
style={styles.container}
>
<Text>Intentionally Blank</Text>
<Button
onPress={this.showDetail.bind(this)}
label='Show subscreen'
/>
</View>
)
}
}
class SubScreen extends React.Component {
render() {
return (
<View
style={styles.webViewContainer}
navigator={this.props.navigator}
>
<WebView
ref={WEBVIEW_REF}
automaticallyAdjustContentInsets={false}
style={styles.webView}
url={this.props.link}
javaScriptEnabledAndroid={true}
onNavigationStateChange={this.onNavigationStateChange}
startInLoadingState={true}
/>
</View>
)
}
}
class Button extends React.Component {
render() {
return (
<TouchableHighlight
underlayColor={'white'}
style={styles.button}
onPress={this.props.onPress}>
<Text style={styles.buttonLabel}>
{this.props.label}
</Text>
</TouchableHighlight>
);
}
}
class LaunchScreen extends React.Component {
componentDidMount() {
PushManager.requestPermissions(function(err, data) {
if (err) {
console.log("Could not register for push");
} else {
// console.log(data.token)
registerInstallation({
"deviceType": "ios",
"deviceToken": data.token,
"channels": ["global"]
});
}
});
PushManager.setListenerForNotifications(this.receiveRemoteNotification);
}
onPressFollow() {
console.log("follow");
console.log(this); // says 'undefined'
this.refs.nav.push(subScreenRoute); // obviously fails
// this.goTo(subScreenRoute); // fails too
}
receiveRemoteNotification(notification) {
// Your code to run when the alert fires
var subScreenRoute = {
component: SubScreen,
title: 'Detail via Notification',
passProps: { link: notification.link }
}
// console.log(notification);
// the sample JSON of the notifications is in samplePushNotification.json file
// https://developer.apple.com/library/ios/documentation/NetworkingInternet/Conceptual/RemoteNotificationsPG/Chapters/ApplePushService.html
// https://parse.com/docs/rest/guide/#push-notifications
AlertIOS.alert(
notification.aps.alert.title,
notification.aps.alert.body,
[
{text: 'OK', onPress: () => console.log('Ok pressed!')},
//{text: 'Follow link', onPress: () => console.log(this)}
{text: 'Follow link', onPress: this.onPressFollow.bind(this)}
]
);
}
render() {
return (
<NavigatorIOS
ref="nav"
style={styles.wrapper}
initialRoute={{
title: 'Home Screen',
component: HomeScreen,
//passProps: { myProp: 'foo' },
}}
/>
);
}
}
var styles = StyleSheet.create({
wrapper: {
flex: 1,
},
webViewContainer: {
flex: 1,
justifyContent: 'flex-start',
alignItems: 'stretch',
backgroundColor: '#F5FCFF',
flexDirection: 'column',
paddingTop: 64,
},
webView: {
},
container: {
flex: 1,
flexDirection: 'column',
alignItems: 'center',
justifyContent: 'center',
},
button: {
padding: 10,
alignItems: 'center',
justifyContent: 'center',
},
buttonLabel: {
color: 'blue',
},
});
AppRegistry.registerComponent('myMeal', () => myMeal);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.