Add basic socket.io and notification functionality

This commit is contained in:
Tanner Collin 2016-12-22 17:40:05 -07:00
parent 8a6d3c0f11
commit 14644ee21b
3 changed files with 48 additions and 14 deletions

View File

@ -25,6 +25,7 @@
"react": "^0.13.0",
"react-router": "^0.13.3",
"shortid": "^2.2.6",
"socket.io": "^1.7.2"
"socket.io": "^1.7.2",
"socket.io-client": "^1.7.2"
}
}

View File

@ -4,27 +4,45 @@ const bodyParser = require('body-parser');
const app = express();
const host = 'http://localhost';
const host = 'http://0.0.0.0';
const port = 3000;
app.use(bodyParser.urlencoded({ extended: false }));
app.use('/static', express.static(path.join(__dirname, 'dist')));
app.use('/assets', express.static(path.join(__dirname, 'assets')));
app.get('/', (req, res) => {
app.get('/*', (req, res) => {
res.sendFile(path.join(__dirname, 'index.html'));
});
app.post('*', (req, res) => {
console.log("to: " + req.path);
console.log(Object.keys(req.body)[0]);
let id = req.path.substring(1);
let message = Object.keys(req.body)[0];
console.log("to: " + id);
console.log(message);
io.in(id).emit('message', message);
res.end();
});
app.listen(port, 'localhost', (err) => {
const server = app.listen(port, 'localhost', (err) => {
if (err) {
console.log(err);
return;
}
console.info('==> Listening on port %s. Open up %s:%s/ in your browser.', port, host, port);
});
const io = require('socket.io').listen(server);
io.on('connection', (socket) => {
console.log("new connection!");
socket.on('room', (room) => {
console.log("telling it to join room.");
socket.join(room);
});
});

View File

@ -1,5 +1,6 @@
'use strict';
import React from 'react';
import io from 'socket.io-client';
export default class NotifPage extends React.Component {
constructor(props) {
@ -10,13 +11,27 @@ export default class NotifPage extends React.Component {
}
}
componentDidMount() {
let socket = io.connect();
let room = this.props.urlid;
socket.on('connect', () => {
socket.emit('room', room);
});
socket.on('message', (data) => {
new Notification(data);
});
}
checkperm(permission) {
if (permission === 'granted') {
this.setState({haveperm: true});
}
}
render(){
render() {
let supported = ("Notification" in window);
if (supported) {