From 0e0647986bfa0f7903f202c9e33e92bec11953cb Mon Sep 17 00:00:00 2001 From: Arjun Patel Date: Sun, 27 May 2018 14:29:49 -0700 Subject: [PATCH] mysql local db setup and some setup of socket flow --- app/screens/main/chat.js | 48 ++++++++++++++++++++++------------- package-lock.json | 55 ++++++++++++++++++++++++++++++++++++++++ package.json | 1 + server/app.js | 30 ++++++++++++++++++---- 4 files changed, 112 insertions(+), 22 deletions(-) diff --git a/app/screens/main/chat.js b/app/screens/main/chat.js index 6ee9d15..5b1bee4 100644 --- a/app/screens/main/chat.js +++ b/app/screens/main/chat.js @@ -7,7 +7,8 @@ import { View, Text, TextInput, - Image + Image, + TouchableOpacity } from 'react-native'; import { Actions @@ -33,24 +34,35 @@ export default class Chat extends Component { prevMessageUser: -1 }; this.socket = io('10.0.2.2:3000', {jsonp: false}); - this.socket.on('message', (msg) => { - console.log('New message received: ' + msg); - var oldDOM = this.state.messagesDOM; - var newMessage = this.createMessage(msg); - this.setState({ - messagesDOM: oldDOM.concat(newMessage), - prevMessageUser: msg.userId + this.socket.on('initMessages', (allMsg) => { + console.log('Initial messages received: ' + allMsg); + allMsg.map((msg) => { + this.addMessage(msg); }); }); + + this.socket.on('newMessage', (msg) => { + this.addMessage(msg); + }); } - /*componentWillMount() { + addMessage = (msg) => { + console.log('New message received: ' + msg); + var oldDOM = this.state.messagesDOM; + var newMessage = this.createMessage(msg); this.setState({ - messagesDOM: exMessages.map( - (msg) => this.createMessage(msg) - ) + messagesDOM: oldDOM.concat(newMessage), + prevMessageUser: msg.userId }); - }*/ + } + + sendMessage = () => { + console.log('Message to send: ' + this.state.messageToSend); + this.socket.emit('newMessage', this.state.messageToSend); + this.setState({ + messageToSend: '' + }); + } createMessage = (msg) => { console.log(msg.userId); @@ -110,10 +122,12 @@ export default class Chat extends Component { /> - + + + diff --git a/package-lock.json b/package-lock.json index b9ff396..2431381 100644 --- a/package-lock.json +++ b/package-lock.json @@ -2076,6 +2076,11 @@ "resolved": "https://registry.npmjs.org/big-integer/-/big-integer-1.6.28.tgz", "integrity": "sha512-OJT3rzgtsYca/5WmmEuFJDPMwROVh5SSjoEX9wIrpfbbWJ4KqRzShs8Cj6jWHaatBYAeWngBA+kmmrcHSklT1g==" }, + "bignumber.js": { + "version": "4.0.4", + "resolved": "https://registry.npmjs.org/bignumber.js/-/bignumber.js-4.0.4.tgz", + "integrity": "sha512-LDXpJKVzEx2/OqNbG9mXBNvHuiRL4PzHCGfnANHMJ+fv68Ads3exDVJeGDJws+AoNEuca93bU3q+S0woeUaCdg==" + }, "blob": { "version": "0.0.4", "resolved": "https://registry.npmjs.org/blob/-/blob-0.0.4.tgz", @@ -6777,6 +6782,51 @@ "resolved": "https://registry.npmjs.org/mute-stream/-/mute-stream-0.0.7.tgz", "integrity": "sha1-MHXOk7whuPq0PhvE2n6BFe0ee6s=" }, + "mysql": { + "version": "2.15.0", + "resolved": "https://registry.npmjs.org/mysql/-/mysql-2.15.0.tgz", + "integrity": "sha512-C7tjzWtbN5nzkLIV+E8Crnl9bFyc7d3XJcBAvHKEVkjrYjogz3llo22q6s/hw+UcsE4/844pDob9ac+3dVjQSA==", + "requires": { + "bignumber.js": "4.0.4", + "readable-stream": "2.3.3", + "safe-buffer": "5.1.1", + "sqlstring": "2.3.0" + }, + "dependencies": { + "isarray": { + "version": "1.0.0", + "resolved": "https://registry.npmjs.org/isarray/-/isarray-1.0.0.tgz", + "integrity": "sha1-u5NdSFgsuhaMBoNJV6VKPgcSTxE=" + }, + "process-nextick-args": { + "version": "1.0.7", + "resolved": "https://registry.npmjs.org/process-nextick-args/-/process-nextick-args-1.0.7.tgz", + "integrity": "sha1-FQ4gt1ZZCtP5EJPyWk8q2L/zC6M=" + }, + "readable-stream": { + "version": "2.3.3", + "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.3.tgz", + "integrity": "sha512-m+qzzcn7KUxEmd1gMbchF+Y2eIUbieUaxkWtptyHywrX0rE8QEYqPC07Vuy4Wm32/xE16NcdBctb8S0Xe/5IeQ==", + "requires": { + "core-util-is": "1.0.2", + "inherits": "2.0.3", + "isarray": "1.0.0", + "process-nextick-args": "1.0.7", + "safe-buffer": "5.1.1", + "string_decoder": "1.0.3", + "util-deprecate": "1.0.2" + } + }, + "string_decoder": { + "version": "1.0.3", + "resolved": "https://registry.npmjs.org/string_decoder/-/string_decoder-1.0.3.tgz", + "integrity": "sha512-4AH6Z5fzNNBcH+6XDMfA/BTt87skxqJlO0lAh3Dker5zThcAxG6mKz+iGu308UKoPPQ8Dcqx/4JhujzltRa+hQ==", + "requires": { + "safe-buffer": "5.1.1" + } + } + } + }, "nan": { "version": "2.10.0", "resolved": "https://registry.npmjs.org/nan/-/nan-2.10.0.tgz", @@ -8829,6 +8879,11 @@ "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=", "dev": true }, + "sqlstring": { + "version": "2.3.0", + "resolved": "https://registry.npmjs.org/sqlstring/-/sqlstring-2.3.0.tgz", + "integrity": "sha1-UluKT9Jtb3GqYegipsr5dtMa0qg=" + }, "sshpk": { "version": "1.14.1", "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.14.1.tgz", diff --git a/package.json b/package.json index 4e4c550..9b90f34 100644 --- a/package.json +++ b/package.json @@ -13,6 +13,7 @@ }, "dependencies": { "express": "^4.16.3", + "mysql": "^2.15.0", "react": "16.3.1", "react-native": "^0.55.3", "react-native-router-flux": "^4.0.0-beta.28", diff --git a/server/app.js b/server/app.js index 6d86762..f0ddf6e 100644 --- a/server/app.js +++ b/server/app.js @@ -1,6 +1,14 @@ var app = require('express')(); var server = require('http').Server(app); var io = require('socket.io')(server); +var mysql = require('mysql'); + +var con = mysql.createConnection({ + host: 'localhost', + user: 'root', + password: 'mysql', + database: 'nexto' +}); var port = 3000; server.listen(port, () => console.log('serving on port: ' + port)); @@ -23,11 +31,23 @@ var exMessages = [ ]; io.on('connection', function (socket) { - console.log(socket.id); - exMessages.map((msg) => { - socket.emit('message', msg); - console.log('sending msg by msg'); + console.log('Client connected: ' + socket.id); + console.log(socket.handshake.jsonp); + + con.query('SELECT * FROM messages;', function (err, result, fields) { + if (err) throw err; + console.log(result); + socket.emit('initMessages', result); + console.log('sent all initial messages'); }); - io.on('test', () => console.log('worked~')); + //io.on('test', () => console.log('worked~')); // test with web page + + socket.on('newMessage', function(msg) { + io.emit('newMessage', msg); + }); + + socket.on('disconnect', function() { + console.log('Client disconnected: ' + socket.id); + }); });