diff --git a/server.js b/server.js
index 89cfbce..10d7655 100644
--- a/server.js
+++ b/server.js
@@ -31,19 +31,35 @@ app.use(cors())
app.use('/api', apiRoutes)
// Socket
-io.on('connection', (socket) => {
- console.log('User connected')
+var hillary = io.of('hillary').on('connection', (socket) => {
+ console.log('User connected to Hillary')
let stream1 = streamClient.stream('statuses/filter', {track: 'Hillary%20Clinton'})
- // streamClient.stream('statuses/filter', {track: 'Hillary%20Clinton'}, function(stream) {
- stream1.on('data', function(tweet) {
- io.emit('tweet', tweet)
- })
- stream1.on('error', function(error) {
- console.log(error)
- })
- // })
+ stream1.on('data', function(tweet) {
+ hillary.emit('tweet', tweet)
+ })
+ stream1.on('error', function(error) {
+ console.log(error)
+ })
+
+ socket.on('disconnect', () => {
+ stream1.destroy()
+ console.log('User disconnected')
+ })
+})
+
+var trump= io.of('trump').on('connection', (socket) => {
+ console.log('User connected to Trump')
+
+ let stream1 = streamClient.stream('statuses/filter', {track: 'Donald%20Trump'})
+
+ stream1.on('data', function(tweet) {
+ trump.emit('tweet', tweet)
+ })
+ stream1.on('error', function(error) {
+ console.log(error)
+ })
socket.on('disconnect', () => {
stream1.destroy()
diff --git a/src/components/Posts.jsx b/src/components/Posts.jsx
index aa9546c..31e12d3 100644
--- a/src/components/Posts.jsx
+++ b/src/components/Posts.jsx
@@ -4,7 +4,7 @@ import { getHillaryData } from "../actions/index"
import { getTrumpData } from "../actions/index"
export function Post(props) {
- let { articles, articlesHillary, candidate, getHillaryData, getTrumpData } = props
+ let { articles, articlesTrump, articlesHillary, candidate, getHillaryData, getTrumpData } = props
// Fetch tweets when user clicks on candidate's button
useEffect(() => {
@@ -39,6 +39,16 @@ export function Post(props) {
))}
+
+
Trump stream
+
+ {articlesTrump.map(el => (
+ -
+
{el.created_at}
+ {el.text}
+
+ ))}
+
)
}
@@ -47,6 +57,7 @@ function mapStateToProps(state) {
return {
articles: state.remoteArticles.slice(0, 10),
articlesHillary: state.remoteArticlesHillary.slice(0, 10),
+ articlesTrump: state.remoteArticlesTrump.slice(0, 10),
candidate: state.candidate
}
}
diff --git a/src/constants/action-types.js b/src/constants/action-types.js
index 52ec196..3ca5edf 100644
--- a/src/constants/action-types.js
+++ b/src/constants/action-types.js
@@ -1,4 +1,5 @@
export const ADD_ARTICLE = "ADD_ARTICLE"
export const SET_CANDIDATE = "SET_CANDIDATE"
export const DATA_LOADED = "DATA_LOADED"
-export const DATA_LOADED_TO_ADD = "DATA_LOADED_TO_ADD"
+export const DATA_LOADED_TO_HILLARY = "DATA_LOADED_TO_HILLARY"
+export const DATA_LOADED_TO_TRUMP = "DATA_LOADED_TO_TRUMP"
diff --git a/src/reducers/index.js b/src/reducers/index.js
index 47d7b28..9475ba9 100644
--- a/src/reducers/index.js
+++ b/src/reducers/index.js
@@ -1,12 +1,14 @@
import { ADD_ARTICLE } from '../constants/action-types'
import { SET_CANDIDATE } from '../constants/action-types'
import { DATA_LOADED } from '../constants/action-types'
-import { DATA_LOADED_TO_ADD } from '../constants/action-types'
+import { DATA_LOADED_TO_HILLARY } from '../constants/action-types'
+import { DATA_LOADED_TO_TRUMP } from '../constants/action-types'
const initialState = {
articles: [],
remoteArticles: [],
remoteArticlesHillary: [],
+ remoteArticlesTrump: [],
candidate: ''
}
@@ -29,12 +31,18 @@ function rootReducer(state = initialState, action) {
})
}
- else if (action.type === DATA_LOADED_TO_ADD) {
+ else if (action.type === DATA_LOADED_TO_HILLARY) {
return Object.assign({}, state, {
remoteArticlesHillary: state.remoteArticlesHillary.concat(action.payload)
})
}
+ else if (action.type === DATA_LOADED_TO_TRUMP) {
+ return Object.assign({}, state, {
+ remoteArticlesTrump: state.remoteArticlesTrump.concat(action.payload)
+ })
+ }
+
return state
}
diff --git a/src/sagas/api-saga.js b/src/sagas/api-saga.js
index 9af7cc5..1274d23 100644
--- a/src/sagas/api-saga.js
+++ b/src/sagas/api-saga.js
@@ -5,7 +5,7 @@ import openSocket from 'socket.io-client'
export default function* watcherSaga() {
yield all([
workerHillaryStream(),
- workerTrump()
+ workerTrumpStream()
])
}
@@ -51,16 +51,20 @@ function getTrumpData() {
// ---------- Stream ----------------
-const socketServerURL = 'http://localhost:3030/'
+const socketServerURL = 'http://localhost:3030'
let socket
+// Hillary
function* workerHillaryStream() {
- yield takeEvery('DATA_HILLARY_REQUESTED', listenServerSaga)
+ yield takeEvery('DATA_HILLARY_REQUESTED', listenHillarySaga)
}
// wrapping function for socket.on
-const connect = () => {
- socket = openSocket(socketServerURL)
+const connectHillary = () => {
+ if (typeof socket !== 'undefined') {
+ socket.disconnect()
+ }
+ socket = openSocket(socketServerURL + '/hillary')
return new Promise((resolve) => {
socket.on('connect', () => {
resolve(socket)
@@ -80,16 +84,49 @@ const createSocketChannel = (socket, tweet)=> eventChannel((emit) => {
});
// saga that listens to the socket and puts the new data into the reducer
-const listenServerSaga = function* () {
+const listenHillarySaga = function* () {
// connect to the server
- const socket = yield call(connect)
+ const socket = yield call(connectHillary)
// then create a socket channel
- const socketChannel = yield call(createSocketChannel, socket, 'hillary')
+ const socketChannel = yield call(createSocketChannel, socket)
// then put the new data into the reducer
while (true) {
const payload = yield take(socketChannel)
- yield put({type: 'DATA_LOADED_TO_ADD', payload})
+ yield put({type: 'DATA_LOADED_TO_HILLARY', payload})
+ }
+}
+
+// Trump
+function* workerTrumpStream() {
+ yield takeEvery('DATA_TRUMP_REQUESTED', listenTrumpSaga)
+}
+
+// wrapping function for socket.on
+const connectTrump = () => {
+ if (typeof socket !== 'undefined') {
+ socket.disconnect()
+ }
+ socket = openSocket(socketServerURL + '/trump')
+ return new Promise((resolve) => {
+ socket.on('connect', () => {
+ resolve(socket)
+ })
+ })
+}
+
+// saga that listens to the socket and puts the new data into the reducer
+const listenTrumpSaga = function* () {
+ // connect to the server
+ const socket = yield call(connectTrump)
+
+ // then create a socket channel
+ const socketChannel = yield call(createSocketChannel, socket)
+
+ // then put the new data into the reducer
+ while (true) {
+ const payload = yield take(socketChannel)
+ yield put({type: 'DATA_LOADED_TO_TRUMP', payload})
}
}