浏览代码

Remove duplication, simplify, comply with coding style

master
Lyubomir Marinov 8 年前
父节点
当前提交
2f01746c55

+ 5
- 5
app.js 查看文件

63
 };
63
 };
64
 
64
 
65
 // TODO The execution of the mobile app starts from react/index.native.js.
65
 // TODO The execution of the mobile app starts from react/index.native.js.
66
-// Similarly, the execution of the Web app should start from
67
-// react/index.web.js for the sake of consistency and ease of understanding.
68
-// Temporarily though because we are at the beginning of introducing React
69
-// into the Web app, allow the execution of the Web app to start from app.js
70
-// in order to reduce the complexity of the beginning step.
66
+// Similarly, the execution of the Web app should start from react/index.web.js
67
+// for the sake of consistency and ease of understanding. Temporarily though
68
+// because we are at the beginning of introducing React into the Web app, allow
69
+// the execution of the Web app to start from app.js in order to reduce the
70
+// complexity of the beginning step.
71
 require('./react');
71
 require('./react');
72
 
72
 
73
 module.exports = APP;
73
 module.exports = APP;

react/features/app/actions.web.js → react/features/app/actions.js 查看文件

19
 } from './functions';
19
 } from './functions';
20
 import './reducer';
20
 import './reducer';
21
 
21
 
22
+/**
23
+ * Temporary solution. Should dispatch actions related to
24
+ * initial settings of the app like setting log levels,
25
+ * reading the config parameters from query string etc.
26
+ *
27
+ * @returns {Function}
28
+ */
29
+export function appInit() {
30
+    return () => init();
31
+}
22
 
32
 
23
 /**
33
 /**
24
  * Triggers an in-app navigation to a different route. Allows navigation to be
34
  * Triggers an in-app navigation to a different route. Allows navigation to be
91
     };
101
     };
92
 }
102
 }
93
 
103
 
94
-/**
95
- * Temporary solution. Should dispatch actions related to
96
- * initial settings of the app like setting log levels,
97
- * reading the config parameters from query string etc.
98
- *
99
- * @returns {Function}
100
- */
101
-export function appInit() {
102
-    return () => {
103
-        init();
104
-    };
105
-}
106
-
107
 /**
104
 /**
108
  * Signals that a specific App will mount (in the terms of React).
105
  * Signals that a specific App will mount (in the terms of React).
109
  *
106
  *

+ 0
- 158
react/features/app/actions.native.js 查看文件

1
-import { setRoom } from '../base/conference';
2
-import {
3
-    getDomain,
4
-    setDomain
5
-} from '../base/connection';
6
-import {
7
-    loadConfig,
8
-    setConfig
9
-} from '../base/lib-jitsi-meet';
10
-
11
-import {
12
-    APP_WILL_MOUNT,
13
-    APP_WILL_UNMOUNT
14
-} from './actionTypes';
15
-import {
16
-    _getRoomAndDomainFromUrlString,
17
-    _getRouteToRender
18
-} from './functions';
19
-import './reducer';
20
-
21
-/**
22
- * Triggers an in-app navigation to a different route. Allows navigation to be
23
- * abstracted between the mobile and web versions.
24
- *
25
- * @param {(string|undefined)} urlOrRoom - The URL or room name to which to
26
- * navigate.
27
- * @returns {Function}
28
- */
29
-export function appNavigate(urlOrRoom) {
30
-    return (dispatch, getState) => {
31
-        const oldDomain = getDomain(getState());
32
-
33
-        const { domain, room } = _getRoomAndDomainFromUrlString(urlOrRoom);
34
-
35
-        // TODO Kostiantyn Tsaregradskyi: We should probably detect if user is
36
-        // currently in a conference and ask her if she wants to close the
37
-        // current conference and start a new one with the new room name or
38
-        // domain.
39
-
40
-        if (typeof domain === 'undefined' || oldDomain === domain) {
41
-            // If both domain and room vars became undefined, that means we're
42
-            // actually dealing with just room name and not with URL.
43
-            dispatch(
44
-                _setRoomAndNavigate(
45
-                    typeof room === 'undefined' && typeof domain === 'undefined'
46
-                        ? urlOrRoom
47
-                        : room));
48
-        } else if (oldDomain !== domain) {
49
-            // Update domain without waiting for config to be loaded to prevent
50
-            // race conditions when we will start to load config multiple times.
51
-            dispatch(setDomain(domain));
52
-
53
-            // If domain has changed, we need to load the config of the new
54
-            // domain and set it, and only after that we can navigate to
55
-            // different route.
56
-            loadConfig(`https://${domain}`)
57
-                .then(
58
-                    config => configLoaded(/* err */ undefined, config),
59
-                    err => configLoaded(err, /* config */ undefined));
60
-        }
61
-
62
-        /**
63
-         * Notifies that an attempt to load the config(uration) of domain has
64
-         * completed.
65
-         *
66
-         * @param {string|undefined} err - If the loading has failed, the error
67
-         * detailing the cause of the failure.
68
-         * @param {Object|undefined} config - If the loading has succeeded, the
69
-         * loaded config(uration).
70
-         * @returns {void}
71
-         */
72
-        function configLoaded(err, config) {
73
-            if (err) {
74
-                // XXX The failure could be, for example, because of a
75
-                // certificate-related error. In which case the connection will
76
-                // fail later in Strophe anyway even if we use the default
77
-                // config here.
78
-
79
-                // The function loadConfig will log the err.
80
-                return;
81
-            }
82
-
83
-            // We set room name only here to prevent race conditions on app
84
-            // start to not make app re-render conference page for two times.
85
-            dispatch(setRoom(room));
86
-            dispatch(setConfig(config));
87
-            _navigate(getState());
88
-        }
89
-    };
90
-}
91
-
92
-/**
93
- * Signals that a specific App will mount (in the terms of React).
94
- *
95
- * @param {App} app - The App which will mount.
96
- * @returns {{
97
- *     type: APP_WILL_MOUNT,
98
- *     app: App
99
- * }}
100
- */
101
-export function appWillMount(app) {
102
-    return {
103
-        type: APP_WILL_MOUNT,
104
-        app
105
-    };
106
-}
107
-
108
-/**
109
- * Signals that a specific App will unmount (in the terms of React).
110
- *
111
- * @param {App} app - The App which will unmount.
112
- * @returns {{
113
- *     type: APP_WILL_UNMOUNT,
114
- *     app: App
115
- * }}
116
- */
117
-export function appWillUnmount(app) {
118
-    return {
119
-        type: APP_WILL_UNMOUNT,
120
-        app
121
-    };
122
-}
123
-
124
-/**
125
- * Navigates to route corresponding to current room name.
126
- *
127
- * @param {Object} state - Redux state.
128
- * @private
129
- * @returns {void}
130
- */
131
-function _navigate(state) {
132
-    const app = state['features/app'].app;
133
-    const routeToRender = _getRouteToRender(state);
134
-
135
-    app._navigate(routeToRender);
136
-}
137
-
138
-/**
139
- * Sets room and navigates to new route if needed.
140
- *
141
- * @param {string} newRoom - New room name.
142
- * @private
143
- * @returns {Function}
144
- */
145
-function _setRoomAndNavigate(newRoom) {
146
-    return (dispatch, getState) => {
147
-        const oldRoom = getState()['features/base/conference'].room;
148
-
149
-        dispatch(setRoom(newRoom));
150
-
151
-        const state = getState();
152
-        const room = state['features/base/conference'].room;
153
-
154
-        if (room !== oldRoom) {
155
-            _navigate(state);
156
-        }
157
-    };
158
-}

+ 1
- 1
react/features/app/components/AbstractApp.js 查看文件

42
          * The URL, if any, with which the app was launched.
42
          * The URL, if any, with which the app was launched.
43
          */
43
          */
44
         url: React.PropTypes.string
44
         url: React.PropTypes.string
45
-    };
45
+    }
46
 
46
 
47
     /**
47
     /**
48
      * Init lib-jitsi-meet and create local participant when component is going
48
      * Init lib-jitsi-meet and create local participant when component is going

+ 35
- 37
react/features/app/components/App.web.js 查看文件

1
 /* global $ */
1
 /* global $ */
2
 import React from 'react';
2
 import React from 'react';
3
 import { Provider } from 'react-redux';
3
 import { Provider } from 'react-redux';
4
-import { compose } from 'redux';
5
 import {
4
 import {
6
     browserHistory,
5
     browserHistory,
7
     Route,
6
     Route,
8
     Router
7
     Router
9
 } from 'react-router';
8
 } from 'react-router';
10
 import { push, syncHistoryWithStore } from 'react-router-redux';
9
 import { push, syncHistoryWithStore } from 'react-router-redux';
10
+import { compose } from 'redux';
11
 
11
 
12
 import { getDomain } from '../../base/connection';
12
 import { getDomain } from '../../base/connection';
13
 import { RouteRegistry } from '../../base/navigator';
13
 import { RouteRegistry } from '../../base/navigator';
14
 
14
 
15
-import { AbstractApp } from './AbstractApp';
16
 import { appInit } from '../actions';
15
 import { appInit } from '../actions';
17
-
16
+import { AbstractApp } from './AbstractApp';
18
 
17
 
19
 /**
18
 /**
20
  * Root application component.
19
  * Root application component.
27
      *
26
      *
28
      * @static
27
      * @static
29
      */
28
      */
30
-    static propTypes = AbstractApp.propTypes;
29
+    static propTypes = AbstractApp.propTypes
31
 
30
 
32
     /**
31
     /**
33
      * Initializes a new App instance.
32
      * Initializes a new App instance.
46
         this.history = syncHistoryWithStore(browserHistory, props.store);
45
         this.history = syncHistoryWithStore(browserHistory, props.store);
47
 
46
 
48
         // Bind event handlers so they are only bound once for every instance.
47
         // Bind event handlers so they are only bound once for every instance.
49
-        this._onRouteEnter = this._onRouteEnter.bind(this);
50
-        this._routerCreateElement = this._routerCreateElement.bind(this);
51
         this._getRoute = this._getRoute.bind(this);
48
         this._getRoute = this._getRoute.bind(this);
52
         this._getRoutes = this._getRoutes.bind(this);
49
         this._getRoutes = this._getRoutes.bind(this);
50
+        this._onRouteEnter = this._onRouteEnter.bind(this);
51
+        this._routerCreateElement = this._routerCreateElement.bind(this);
53
     }
52
     }
54
 
53
 
55
     /**
54
     /**
59
      */
58
      */
60
     componentWillMount(...args) {
59
     componentWillMount(...args) {
61
         super.componentWillMount(...args);
60
         super.componentWillMount(...args);
61
+
62
         this.props.store.dispatch(appInit());
62
         this.props.store.dispatch(appInit());
63
     }
63
     }
64
 
64
 
69
      * @returns {ReactElement}
69
      * @returns {ReactElement}
70
      */
70
      */
71
     render() {
71
     render() {
72
-
73
         return (
72
         return (
74
             <Provider store = { this.props.store }>
73
             <Provider store = { this.props.store }>
75
                 <Router
74
                 <Router
82
     }
81
     }
83
 
82
 
84
     /**
83
     /**
85
-     * Navigates to a specific Route (via platform-specific means).
84
+     * Method returns route for React Router.
86
      *
85
      *
87
-     * @param {Route} route - The Route to which to navigate.
88
-     * @returns {void}
86
+     * @param {Object} route - Object that describes route.
87
+     * @returns {ReactElement}
88
+     * @private
89
      */
89
      */
90
-    _navigate(route) {
91
-        let path = route.path;
92
-        const store = this.props.store;
93
-
94
-        // The syntax :room bellow is defined by react-router. It "matches a URL
95
-        // segment up to the next /, ?, or #. The matched string is called a
96
-        // param."
97
-        path
98
-            = path.replace(
99
-                /:room/g,
100
-                store.getState()['features/base/conference'].room);
90
+    _getRoute(route) {
91
+        const onEnter = route.onEnter || $.noop;
92
+        const handler = compose(this._onRouteEnter, onEnter);
101
 
93
 
102
-        return store.dispatch(push(path));
94
+        return (
95
+            <Route
96
+                component = { route.component }
97
+                key = { route.component }
98
+                onEnter = { handler }
99
+                path = { route.path } />
100
+        );
103
     }
101
     }
104
 
102
 
105
     /**
103
     /**
115
     }
113
     }
116
 
114
 
117
     /**
115
     /**
118
-     * Method returns route for React Router.
116
+     * Navigates to a specific Route (via platform-specific means).
119
      *
117
      *
120
-     * @param {Object} route - Object that describes route.
121
-     * @returns {ReactElement}
122
-     * @private
118
+     * @param {Route} route - The Route to which to navigate.
119
+     * @returns {void}
123
      */
120
      */
124
-    _getRoute(route) {
125
-        const onEnter = route.onEnter || $.noop;
126
-        const handler = compose(this._onRouteEnter, onEnter);
121
+    _navigate(route) {
122
+        let path = route.path;
123
+        const store = this.props.store;
127
 
124
 
128
-        return (
129
-            <Route
130
-                component = { route.component }
131
-                key = { route.component }
132
-                onEnter = { handler }
133
-                path = { route.path } />
134
-        );
125
+        // The syntax :room bellow is defined by react-router. It "matches a URL
126
+        // segment up to the next /, ?, or #. The matched string is called a
127
+        // param."
128
+        path
129
+            = path.replace(
130
+                /:room/g,
131
+                store.getState()['features/base/conference'].room);
132
+
133
+        return store.dispatch(push(path));
135
     }
134
     }
136
 
135
 
137
     /**
136
     /**
142
      * @returns {void}
141
      * @returns {void}
143
      */
142
      */
144
     _onRouteEnter() {
143
     _onRouteEnter() {
145
-
146
         // XXX The following is mandatory. Otherwise, moving back & forward
144
         // XXX The following is mandatory. Otherwise, moving back & forward
147
         // through the browser's history could leave this App on the Conference
145
         // through the browser's history could leave this App on the Conference
148
         // page without a room name.
146
         // page without a room name.

react/features/base/lib-jitsi-meet/actions.native.js → react/features/base/lib-jitsi-meet/actions.js 查看文件

1
+import React from 'react';
2
+
1
 import JitsiMeetJS from './';
3
 import JitsiMeetJS from './';
2
 import {
4
 import {
3
     LIB_DISPOSED,
5
     LIB_DISPOSED,
40
             throw new Error('Cannot initialize lib-jitsi-meet without config');
42
             throw new Error('Cannot initialize lib-jitsi-meet without config');
41
         }
43
         }
42
 
44
 
45
+        if (!React.View) {
46
+            // XXX Temporarily until conference.js is moved to the React app we
47
+            // shouldn't use JitsiMeetJS from the React app.
48
+            return Promise.resolve();
49
+        }
50
+
43
         return JitsiMeetJS.init(config)
51
         return JitsiMeetJS.init(config)
44
             .then(() => dispatch({ type: LIB_INITIALIZED }))
52
             .then(() => dispatch({ type: LIB_INITIALIZED }))
45
             .catch(error => {
53
             .catch(error => {

+ 0
- 61
react/features/base/lib-jitsi-meet/actions.web.js 查看文件

1
-import {
2
-    LIB_DISPOSED,
3
-    SET_CONFIG
4
-} from './actionTypes';
5
-import './middleware';
6
-import './reducer';
7
-
8
-/**
9
- * Disposes lib-jitsi-meet.
10
- *
11
- * @returns {Function}
12
- */
13
-export function disposeLib() {
14
-    // XXX We're wrapping it with Promise, because:
15
-    // a) to be better aligned with initLib() method, which is async.
16
-    // b) as currently there is no implementation for it in lib-jitsi-meet, and
17
-    // there is a big chance it will be async.
18
-    // TODO Currently, lib-jitsi-meet doesn't have any functionality to
19
-    // dispose itself.
20
-    return dispatch => {
21
-        dispatch({ type: LIB_DISPOSED });
22
-
23
-        return Promise.resolve();
24
-    };
25
-}
26
-
27
-/**
28
- * Initializes lib-jitsi-meet with passed configuration.
29
- *
30
- * @returns {Function}
31
- */
32
-export function initLib() {
33
-    return (dispatch, getState) => {
34
-        const config = getState()['features/base/lib-jitsi-meet'].config;
35
-
36
-        if (!config) {
37
-            throw new Error('Cannot initialize lib-jitsi-meet without config');
38
-        }
39
-
40
-        // XXX Temporary solution. Until conference.js hasn't been moved
41
-        // to the react app we shouldn't use JitsiMeetJS from react app.
42
-        return Promise.resolve();
43
-    };
44
-}
45
-
46
-/**
47
- * Sets config.
48
- *
49
- * @param {Object} config - Config object accepted by JitsiMeetJS#init()
50
- * method.
51
- * @returns {{
52
- *      type: SET_CONFIG,
53
- *      config: Object
54
- *  }}
55
- */
56
-export function setConfig(config) {
57
-    return {
58
-        type: SET_CONFIG,
59
-        config
60
-    };
61
-}

react/features/base/lib-jitsi-meet/functions.native.js → react/features/base/lib-jitsi-meet/functions.js 查看文件

1
+import React from 'react';
2
+
1
 import { loadScript } from '../../base/util';
3
 import { loadScript } from '../../base/util';
2
 
4
 
3
 /**
5
 /**
8
  * @returns {Promise<Object>}
10
  * @returns {Promise<Object>}
9
  */
11
  */
10
 export function loadConfig(host, path = '/config.js') {
12
 export function loadConfig(host, path = '/config.js') {
13
+    if (!React.View) {
14
+        // Returns config.js file from global scope. We can't use the version
15
+        // that's being used for the React Native app because the old/current
16
+        // Web app uses config from the global scope.
17
+        return Promise.resolve(window.config);
18
+    }
19
+
11
     return loadScript(new URL(path, host).toString())
20
     return loadScript(new URL(path, host).toString())
12
         .then(() => {
21
         .then(() => {
13
             const config = window.config;
22
             const config = window.config;

+ 0
- 10
react/features/base/lib-jitsi-meet/functions.web.js 查看文件

1
-/**
2
- * Returns config.js file from global scope.
3
- * We can't use version that's being used for native app
4
- * because the old app uses config from global scope.
5
- *
6
- * @returns {Promise<Object>}
7
- */
8
-export function loadConfig() {
9
-    return Promise.resolve(window.config);
10
-}

+ 1
- 1
react/features/conference/components/Conference.web.js 查看文件

1
-/* global APP, $, interfaceConfig */
1
+/* global $, APP, interfaceConfig */
2
 import React, { Component } from 'react';
2
 import React, { Component } from 'react';
3
 import { connect as reactReduxConnect } from 'react-redux';
3
 import { connect as reactReduxConnect } from 'react-redux';
4
 
4
 

+ 2
- 2
react/features/conference/route.js 查看文件

8
  */
8
  */
9
 RouteRegistry.register({
9
 RouteRegistry.register({
10
     component: Conference,
10
     component: Conference,
11
-    path: '/:room',
12
     onEnter: () => {
11
     onEnter: () => {
13
         // XXX: If config or jwt are set by hash or query parameters
12
         // XXX: If config or jwt are set by hash or query parameters
14
         // Getting raw URL before stripping it.
13
         // Getting raw URL before stripping it.
15
         obtainConfigAndInit();
14
         obtainConfigAndInit();
16
-    }
15
+    },
16
+    path: '/:room'
17
 });
17
 });

+ 1
- 11
react/features/welcome/components/WelcomePage.web.js 查看文件

1
-/* global interfaceConfig, APP, $  */
1
+/* global $, APP, interfaceConfig */
2
 
2
 
3
 import React from 'react';
3
 import React from 'react';
4
 import { connect } from 'react-redux';
4
 import { connect } from 'react-redux';
340
         return null;
340
         return null;
341
     }
341
     }
342
 
342
 
343
-    /**
344
-    * Handles updating roomname.
345
-    *
346
-    * @private
347
-    * @returns {void}
348
-    */
349
-    _onUpdateRoomname() {
350
-        this._updateRoomname();
351
-    }
352
-
353
     /**
343
     /**
354
      * Renders the main part of this WelcomePage.
344
      * Renders the main part of this WelcomePage.
355
      *
345
      *

+ 2
- 2
react/features/welcome/route.js 查看文件

26
  */
26
  */
27
 RouteRegistry.register({
27
 RouteRegistry.register({
28
     component: WelcomePage,
28
     component: WelcomePage,
29
-    path: '/',
30
-    onEnter
29
+    onEnter,
30
+    path: '/'
31
 });
31
 });

正在加载...
取消
保存