diff --git a/app/lib/components/Chat/Chat.jsx b/app/lib/components/Chat/Chat.jsx index 620e6e4..87480ee 100644 --- a/app/lib/components/Chat/Chat.jsx +++ b/app/lib/components/Chat/Chat.jsx @@ -5,17 +5,9 @@ import * as stateActions from '../../redux/stateActions'; import * as requestActions from '../../redux/requestActions'; import MessageList from './MessageList'; import FileSharing from './FileSharing'; -import WebTorrent from 'webtorrent'; class Chat extends Component { - constructor(props) - { - super(props); - - this.client = new WebTorrent(); - } - render() { const { @@ -29,9 +21,9 @@ class Chat extends Component return (
- + - +
{ @@ -32,7 +32,7 @@ class FileChatEntry extends Component active: true }); - this.props.client.add(this.props.message.file.magnet, (torrent) => + client.add(this.props.message.file.magnet, (torrent) => { const onProgress = () => { diff --git a/app/lib/components/Chat/FileSharing.jsx b/app/lib/components/Chat/FileSharing.jsx index f2d7514..51cc1a6 100644 --- a/app/lib/components/Chat/FileSharing.jsx +++ b/app/lib/components/Chat/FileSharing.jsx @@ -4,55 +4,48 @@ import WebTorrent from 'webtorrent'; import dragDrop from 'drag-drop'; import * as stateActions from '../../redux/stateActions'; import * as requestActions from '../../redux/requestActions'; +import { store } from '../../store'; + +export const client = new WebTorrent(); + +const notifyPeers = (file) => +{ + const { displayName, picture } = store.getState().me; + store.dispatch(stateActions.addUserFile(file)); + store.dispatch(requestActions.sendChatFile(file, displayName, picture)); +}; + +const shareFiles = (files) => +{ + client.seed(files, (torrent) => { + notifyPeers({ + magnet: torrent.magnetURI + }); + }); +}; + +dragDrop('body', shareFiles); class FileSharing extends Component { - notifyPeers = (file) => + constructor(props) { - this.props.notifyPeers( - file, - this.props.displayName, - this.props.picture - ); - }; - - componentDidMount() - { - dragDrop('body', (files) => - { - this.props.client.seed(files, (torrent) => { - this.notifyPeers({ - magnet: torrent.magnetURI - }); - }); - }); + super(props); } + handleFileChange = (event) => + { + if (event.target.files.length > 0) + { + shareFiles(event.target.files); + } + }; + render() { return ( -
- drag & drop files to share them!!! -
+ ); } } -const mapStateToProps = (state) => - ({ - displayName: state.me.displayName, - picture: state.me.picture - }); - -const mapDispatchToProps = (dispatch) => - ({ - notifyPeers: (file, displayName, picture) => - { - dispatch(stateActions.addUserFile(file)); - dispatch(requestActions.sendChatFile(file, displayName, picture)); - } - }); - -export default connect( - mapStateToProps, - mapDispatchToProps -)(FileSharing); \ No newline at end of file +export default FileSharing; \ No newline at end of file diff --git a/app/lib/components/Chat/MessageList.jsx b/app/lib/components/Chat/MessageList.jsx index 4610b80..ed38979 100644 --- a/app/lib/components/Chat/MessageList.jsx +++ b/app/lib/components/Chat/MessageList.jsx @@ -74,7 +74,7 @@ class MessageList extends Component )} {message.type === 'file' && ( - + )}
diff --git a/app/lib/index.jsx b/app/lib/index.jsx index e4ba0fa..6ab6183 100644 --- a/app/lib/index.jsx +++ b/app/lib/index.jsx @@ -3,13 +3,6 @@ import UrlParse from 'url-parse'; import React from 'react'; import { render } from 'react-dom'; import { Provider } from 'react-redux'; -import { - applyMiddleware as applyReduxMiddleware, - createStore as createReduxStore, - compose as composeRedux -} from 'redux'; -import thunk from 'redux-thunk'; -import { createLogger as createReduxLogger } from 'redux-logger'; import { getDeviceInfo } from 'mediasoup-client'; import randomString from 'random-string'; import Logger from './Logger'; @@ -17,48 +10,11 @@ import * as utils from './utils'; import * as cookiesManager from './cookiesManager'; import * as requestActions from './redux/requestActions'; import * as stateActions from './redux/stateActions'; -import reducers from './redux/reducers'; -import roomClientMiddleware from './redux/roomClientMiddleware'; import Room from './components/Room'; import { loginEnabled } from '../config'; +import { store } from './store'; const logger = new Logger(); -const reduxMiddlewares = -[ - thunk, - roomClientMiddleware -]; - -if (process.env.NODE_ENV === 'development') -{ - const reduxLogger = createReduxLogger( - { - duration : true, - timestamp : false, - level : 'log', - logErrors : true - }); - - reduxMiddlewares.push(reduxLogger); -} - -const composeEnhancers = -typeof window === 'object' && -window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? - window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ - // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize... - }) : composeRedux; - -const enhancer = composeEnhancers( - applyReduxMiddleware(...reduxMiddlewares) - // other store enhancers if any -); - -const store = createReduxStore( - reducers, - undefined, - enhancer -); domready(() => { diff --git a/app/lib/store.js b/app/lib/store.js new file mode 100644 index 0000000..d4ee190 --- /dev/null +++ b/app/lib/store.js @@ -0,0 +1,48 @@ +import { + applyMiddleware, + createStore, + compose +} from 'redux'; +import thunk from 'redux-thunk'; +import { createLogger } from 'redux-logger'; +import reducers from './redux/reducers'; +import roomClientMiddleware from './redux/roomClientMiddleware'; + +const reduxMiddlewares = +[ + thunk, + roomClientMiddleware +]; + +if (process.env.NODE_ENV === 'development') +{ + const reduxLogger = createLogger( + { + duration : true, + timestamp : false, + level : 'log', + logErrors : true + }); + + reduxMiddlewares.push(reduxLogger); +} + +const composeEnhancers = +typeof window === 'object' && +window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ ? + window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__({ + // Specify extension’s options like name, actionsBlacklist, actionsCreators, serialize... + }) : compose; + +const enhancer = composeEnhancers( + applyMiddleware(...reduxMiddlewares) + // other store enhancers if any +); + +export const store = createStore( + reducers, + undefined, + enhancer +); + +console.log(store); \ No newline at end of file