diff --git a/src/client/actions/PeerActions.js b/src/client/actions/PeerActions.js
index 7e44a39..c05a10d 100644
--- a/src/client/actions/PeerActions.js
+++ b/src/client/actions/PeerActions.js
@@ -1,3 +1,4 @@
+import * as ChatActions from '../actions/ChatActions.js'
import * as NotifyActions from '../actions/NotifyActions.js'
import * as StreamActions from '../actions/StreamActions.js'
import * as constants from '../constants.js'
@@ -46,10 +47,25 @@ class PeerHandler {
}
handleData = object => {
const { dispatch, user } = this
- object = JSON.parse(new window.TextDecoder('utf-8').decode(object))
+ const message = JSON.parse(new window.TextDecoder('utf-8').decode(object))
debug('peer: %s, message: %o', user.id, object)
- const message = user.id + ': ' + object.message
- dispatch(NotifyActions.info(message))
+ switch (object.type) {
+ case 'file':
+ dispatch(ChatActions.addMessage({
+ userId: user.id,
+ message: 'Sent a file: "' + message.payload.name,
+ timestamp: new Date().toLocaleString(),
+ image: message.payload.data
+ }))
+ break
+ default:
+ dispatch(ChatActions.addMessage({
+ userId: user.id,
+ message: message.payload,
+ timestamp: new Date().toLocaleString(),
+ image: null
+ }))
+ }
}
handleClose = () => {
const { dispatch, user } = this
@@ -126,7 +142,42 @@ export const destroyPeers = () => ({
})
export const sendMessage = message => (dispatch, getState) => {
- message = JSON.stringify({ message })
const { peers } = getState()
- _.each(peers, peer => peer.send(message))
+ dispatch(NotifyActions.info('Sending message type: {0} to {1} peers.',
+ message.type, Object.keys(peers).length))
+ _.each(peers, peer => {
+ switch (message.type) {
+ case 'file':
+ dispatch(ChatActions.addMessage({
+ userId: 'You',
+ message: 'Send file: "' +
+ message.payload.name + '" to peer: ' + peer._id,
+ timestamp: new Date().toLocaleString(),
+ image: message.payload.data
+ }))
+ }
+ peer.send(JSON.stringify(message))
+ })
+}
+
+export const sendFile = file => async (dispatch, getState) => {
+ const { name, size, type } = file
+ if (!window.FileReader) {
+ dispatch(NotifyActions.error('File API is not supported by your browser'))
+ return
+ }
+ const reader = new window.FileReader()
+ const base64File = await new Promise(resolve => {
+ reader.addEventListener('load', () => {
+ resolve({
+ name,
+ size,
+ type,
+ data: reader.result
+ })
+ })
+ reader.readAsDataURL(file)
+ })
+
+ sendMessage({ payload: base64File, type: 'file' })(dispatch, getState)
}
diff --git a/src/client/components/App.js b/src/client/components/App.js
index 955f003..5cdd1d7 100644
--- a/src/client/components/App.js
+++ b/src/client/components/App.js
@@ -20,6 +20,7 @@ export default class App extends React.PureComponent {
peers: PropTypes.object.isRequired,
sendMessage: PropTypes.func.isRequired,
streams: PropTypes.objectOf(StreamPropType).isRequired,
+ onSendFile: PropTypes.func.isRequired,
toggleActive: PropTypes.func.isRequired
}
constructor () {
@@ -56,6 +57,7 @@ export default class App extends React.PureComponent {
notifications,
notify,
messages,
+ onSendFile,
peers,
sendMessage,
toggleActive,
@@ -70,6 +72,7 @@ export default class App extends React.PureComponent {
chatVisible={this.state.chatVisible}
messages={messages}
onToggleChat={this.handleToggleChat}
+ onSendFile={onSendFile}
stream={streams[constants.ME]}
/>
{message.message}
+
+ {message.image && (
+
+ )}
+ {message.message}
+