diff --git a/app/screens/loading.js b/app/screens/loading.js index 1a3c410..2d818a8 100644 --- a/app/screens/loading.js +++ b/app/screens/loading.js @@ -25,7 +25,7 @@ export default class Loading extends Component { console.log('Getting User Location:'); this.latitude = parseFloat(position.coords.latitude); this.longitude = parseFloat(position.coords.longitude); - console.log(String(this.latitude) + ' ' + String(this.longitude)); + console.log(this.latitude.toString() + ' ' + this.longitude.toString()); this.storeValues(); Actions.main(); }, @@ -39,9 +39,11 @@ export default class Loading extends Component { storeValues = async () => { try { - await AsyncStorage.setItem('long', this.longitude); - await AsyncStorage.setItem('lat', this.latitude); - console.log('Stored Values!'); + var toStore = [['long', this.longitude.toString()], ['lat', this.latitude.toString()]]; + await AsyncStorage.multiSet(toStore, () => { + console.log('Stored values!'); + Actions.main(); + }); } catch (error) { console.log(error); } diff --git a/app/screens/main/UserAgent.js b/app/screens/main/UserAgent.js new file mode 100644 index 0000000..09b3a22 --- /dev/null +++ b/app/screens/main/UserAgent.js @@ -0,0 +1 @@ +window.navigator.userAgent = 'react-native'; diff --git a/app/screens/main/chat.js b/app/screens/main/chat.js index 241fcee..c04c850 100644 --- a/app/screens/main/chat.js +++ b/app/screens/main/chat.js @@ -18,7 +18,7 @@ import Icon from 'react-native-vector-icons/MaterialIcons'; import { Fonts } from '../../utils/Fonts.js'; // Socket.io imports -window.navigator.userAgent = 'react-native'; +import './UserAgent'; import io from 'socket.io-client/dist/socket.io'; const windowWidth = Dimensions.get('window').width; @@ -34,8 +34,34 @@ export default class Chat extends Component { messagesDOM: [], prevMessageUser: -1 }; - this.getValues(); + this.getValues(); // from AsyncStorage + + } + + getValues = async () => { + try { + await AsyncStorage.multiGet(['long', 'lat'], (err, stores) => { + stores.map((result, i, store) => { + let key = store[i][0]; + let value = store[i][1]; + key == 'long' ? this.long = parseFloat(value) : this.lat = parseFloat(value); + }); + }); + console.log(this.long + ' ' + this.lat); + } catch (error) { + console.log(error); + // tell UI that cannot find location + } + } + + componentDidMount() { this.socket = io('10.0.2.2:3000', {jsonp: false}); + this.socket.on('connect', () => { + var position = {long: this.long, lat: this.lat}; + console.log(position); + this.socket.emit('initial', position); + }); + this.socket.on('initMessages', (allMsg) => { console.log('Initial messages received: ' + allMsg); allMsg.map((msg) => { @@ -48,20 +74,6 @@ export default class Chat extends Component { }); } - getValues = async () => { - try { - const long = await AsyncStorage.getItem('long'); - const lat = await AsyncStorage.getItem('lat'); - this.long = JSON.parse(long); - this.lat = JSON.parse(lat); - console.log('Retrieved long: ' + this.long); - console.log('Retrieved lat: ' + this.lat); - } catch (error) { - console.log(error); - //tell UI that cannot find location - } - } - addMessage = (msg) => { console.log('New message received: ' + msg); var oldDOM = this.state.messagesDOM; @@ -84,7 +96,9 @@ export default class Chat extends Component { console.log('Message to send: ' + this.state.messageToSend); this.socket.emit('newMessage', { userId: this.userId, - text: this.state.messageToSend + text: this.state.messageToSend, + lng: this.long, + lat: this.lat }); this.setState({ messageToSend: '' @@ -121,6 +135,10 @@ export default class Chat extends Component { }); } + sendFieldStyle = () => { + return this.state.messageToSend == '' ? styles.sendIcon : styles.sendIconColor; + } + render() { return ( @@ -150,7 +168,7 @@ export default class Chat extends Component { @@ -229,7 +247,8 @@ const styles = { alignItems: 'center', justifyContent: 'space-between', height: 50, - backgroundColor: 'white' + backgroundColor: 'white', + marginTop: 10 }, iconCont: { flex: 1, @@ -247,5 +266,9 @@ const styles = { }, sendIcon: { fontSize: 25 - } + }, + sendIconColor: { + fontSize: 25, + color: '#0e8f9e' + } } diff --git a/server/app.js b/server/app.js index 3a4bea5..a48a624 100644 --- a/server/app.js +++ b/server/app.js @@ -20,32 +20,39 @@ app.get('/', function (req, res) { io.on('connection', function (socket) { console.log('Client connected: ' + socket.id); - con.query('SELECT * FROM messages', function (err, result, fields) { - if (err) throw err; - socket.emit('initMessages', result); - console.log('sent all initial messages'); + socket.on('initial', (position) => { + console.log(position.long + ' ' + position.lat); + //var sql = 'select * from messages where lng = 0'; + var sql = 'SELECT * FROM messages HAVING (6371393 * acos(cos(radians((?))) * cos(radians(lat)) * cos(radians(lng) - radians((?))) + sin(radians((?))) * sin(radians(lat))) < 100) ORDER BY id;' + con.query(sql, [position.lat, position.long, position.lat], function (err, result, fields) { + if (err) throw err; + socket.emit('initMessages', result); + console.log('sent all initial messages'); + }); }); //io.on('test', () => console.log('worked~')); // test with web page socket.on('newMessage', function(msg) { - var sql = "INSERT INTO messages (userId, text, createdAt) VALUES (?, ?, ?)"; + var sql = "INSERT INTO messages (userId, text, createdAt, lng, lat) VALUES (?, ?, ?, ?, ?)"; var currTime = new Date().toString(); - con.query(sql, [msg.userId, msg.text, currTime], function(err, result) { + con.query(sql, [msg.userId, msg.text, currTime, msg.lng, msg.lat], function(err, result) { if (err) throw err; console.log('Message sent to db!'); var msgId = 0; con.query('SELECT LAST_INSERT_ID()', function(err, result) { if(err) throw err; - msgId = result.'LAST_INSERT_ID()'; + msgId = result; console.log(msgId); }); var uploadedMsg = { id: msgId, userId: msg.userId, text: msg.text, - createdAt: currTime + createdAt: currTime, + lng: msg.lng, + lat: msg.lat }; io.emit('newMessage', uploadedMsg); });