diff --git a/README.md b/README.md index 7f2b344..2295667 100644 --- a/README.md +++ b/README.md @@ -12,7 +12,7 @@ # react-native-meteor -Meteor-like methods for React Native. **Currently in v1.0.0-beta2** ! For old docs, see [v0.6.2 documentation](https://github.com/inProgress-team/react-native-meteor/tree/0.6.2) (classic ddp interface). +Meteor-like methods for React Native. **Currently in v1.0.0-beta3** ! For old docs, see [v0.6.2 documentation](https://github.com/inProgress-team/react-native-meteor/tree/0.6.2) (classic ddp interface). ## What is it for ? @@ -129,10 +129,16 @@ Connect to a DDP server. You only have to do this once in your app. ## Meteor methods +* [Meteor.loginWithPassword](http://docs.meteor.com/#/full/meteor_loginwithpassword) (Please note that user is auto-resigned in - like in Meteor Web applications - thanks to React Native AsyncStorage.) +* [Meteor.logout](http://docs.meteor.com/#/full/meteor_logout) * [Meteor.call](http://docs.meteor.com/#/full/meteor_call) - + ##### NOTE Meteor call parameter still not supporting EJSON, so you can't pass param value like date, boolean etc. For now it's only support object of string (JSON) -* [Meteor.loginWithPassword](http://docs.meteor.com/#/full/meteor_loginwithpassword) (Please note that user is auto-resigned in - like in Meteor Web applications - thanks to React Native AsyncStorage.) -* [Meteor.logout](http://docs.meteor.com/#/full/meteor_logout) +## Meteor.ddp + +Once connected to the ddp server, you can access every method available in [ddp.js](https://github.com/mondora/ddp.js/). +* Meteor.ddp.on('added') +* Meteor.ddp.on('changed') +* ... diff --git a/example/mobile/app/App.js b/example/mobile/app/App.js index c915626..d591259 100644 --- a/example/mobile/app/App.js +++ b/example/mobile/app/App.js @@ -17,18 +17,23 @@ import Meteor from 'react-native-meteor'; import Icon from 'react-native-vector-icons/MaterialIcons'; import Todos from './Routes/Todos'; +import TodosListView from './Routes/TodosListView'; import Status from './Routes/Status'; export default class App extends Component { constructor(props) { super(props); this.state = { - selectedTab: 1 + selectedTab: 0 }; } componentWillMount() { const url = 'http://'+this.props.serverUrl+':3000/websocket'; Meteor.connect(url); + + Meteor.ddp.on('added', function(message) { + console.log(message); + }); } render() { //https://developer.apple.com/library/ios/documentation/UserExperience/Conceptual/MobileHIG/Bars.html @@ -43,17 +48,24 @@ export default class App extends Component { {this.setState({selectedTab: 1});}}> + + + {this.setState({selectedTab: 2});}}> {this.setState({selectedTab: 2});}}> + selected={this.state.selectedTab === 3} + onPress={() => {this.setState({selectedTab: 3});}}> diff --git a/example/mobile/app/Routes/TodosListView.js b/example/mobile/app/Routes/TodosListView.js new file mode 100644 index 0000000..a05cbf1 --- /dev/null +++ b/example/mobile/app/Routes/TodosListView.js @@ -0,0 +1,68 @@ +'use strict'; + +console.disableYellowBox = true; + + +import React, { + Component, + StyleSheet, + Text, + View, + ListView, + TabBarIOS +} from 'react-native'; + +import Meteor, { connectMeteor } from 'react-native-meteor'; + +@connectMeteor +export default class TodosListView extends Component { + constructor(props) { + super(props); + + this.state = { + ds: new ListView.DataSource({ + rowHasChanged: (row1, row2) => !_.isEqual(row1, row2), + }) + }; + } + getMeteorData() { + return { + todos: Meteor.collection('todos').find() + }; + } + startMeteorSubscriptions() { + Meteor.subscribe('todos'); + } + renderItem(todo) { + return ( + + {todo.title} + + ) + } + render() { + const { todos } = this.data; + const { ds } = this.state; + + return ( + + + + + ); + } +} + +const styles = StyleSheet.create({ + container: { + flex: 1, + alignItems: 'center' + }, + header: { + backgroundColor: 'blue', + height: 50 + } +}); diff --git a/example/mobile/ios/mobile.xcodeproj/project.pbxproj b/example/mobile/ios/mobile.xcodeproj/project.pbxproj index 7043946..e379e82 100644 --- a/example/mobile/ios/mobile.xcodeproj/project.pbxproj +++ b/example/mobile/ios/mobile.xcodeproj/project.pbxproj @@ -5,7 +5,6 @@ }; objectVersion = 46; objects = { - /* Begin PBXBuildFile section */ 00C302E51ABCBA2D00DB3ED1 /* libRCTActionSheet.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302AC1ABCB8CE00DB3ED1 /* libRCTActionSheet.a */; }; 00C302E71ABCBA2D00DB3ED1 /* libRCTGeolocation.a in Frameworks */ = {isa = PBXBuildFile; fileRef = 00C302BA1ABCB90400DB3ED1 /* libRCTGeolocation.a */; }; diff --git a/package.json b/package.json index eb8c867..58df50b 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "react-native-meteor", - "version": "1.0.0-beta2", + "version": "1.0.0-beta3", "description": "DDP React-native Client", "main": "src/Meteor.js", "scripts": { diff --git a/src/Meteor.js b/src/Meteor.js index b1e2a2f..27754ba 100644 --- a/src/Meteor.js +++ b/src/Meteor.js @@ -50,7 +50,7 @@ module.exports = { }); }, connect(endpoint) { - Data.ddp = new DDP({ + this.ddp = Data.ddp = new DDP({ endpoint: endpoint, SocketConstructor: WebSocket }); @@ -68,8 +68,7 @@ module.exports = { }); Data.ddp.on("ready", message => { - console.info('READY', message.subs); - //console.log('READY', Data.db.todos && Data.db.todos.find().length); + //console.info('READY', message.subs); }); Data.ddp.on("changed", message => {