Browse Source

Remove obsolete UnsupportedMobileBrowser functionality

The desired behavior of the button 'Start a conference' / 'Join the
conversation' is to launch the mobile app if installed; otherwise, do
nothing i.e. continue to display UnsupportedMobileBrowser.

Anyway, we may change our minds about allowing the user to continue in a
supported mobile browser so preserve the source code that enables that
but give it more appropriate naming.
master
Lyubomir Marinov 8 years ago
parent
commit
88eabf23f4

+ 2
- 5
react/features/base/util/interceptComponent.js View File

17
      * app even if the browser supports the app (e.g. Google Chrome with
17
      * app even if the browser supports the app (e.g. Google Chrome with
18
      * WebRTC support on Android).
18
      * WebRTC support on Android).
19
      *
19
      *
20
-     * @param {Object} state - Object containing Redux state.
21
      * @returns {UnsupportedMobileBrowser|void} If the rule is satisfied then
20
      * @returns {UnsupportedMobileBrowser|void} If the rule is satisfied then
22
      * we should intercept existing component by UnsupportedMobileBrowser.
21
      * we should intercept existing component by UnsupportedMobileBrowser.
23
      */
22
      */
24
-    state => {
23
+    () => {
25
         const OS = Platform.OS;
24
         const OS = Platform.OS;
26
-        const { mobileBrowserPageIsShown }
27
-            = state['features/unsupported-browser'];
28
 
25
 
29
-        if ((OS === 'android' || OS === 'ios') && !mobileBrowserPageIsShown) {
26
+        if (OS === 'android' || OS === 'ios') {
30
             return UnsupportedMobileBrowser;
27
             return UnsupportedMobileBrowser;
31
         }
28
         }
32
     }
29
     }

+ 11
- 5
react/features/unsupported-browser/actionTypes.js View File

1
 import { Symbol } from '../base/react';
1
 import { Symbol } from '../base/react';
2
 
2
 
3
 /**
3
 /**
4
- * The type of the Redux action which signals that a mobile browser page
5
- * is shown.
4
+ * The type of the Redux action which signals that the React Component
5
+ * UnsupportedMobileBrowser which was rendered as a promotion of the mobile app
6
+ * on a browser was dismissed by the user. For example, the Web app may possibly
7
+ * run in Google Chrome on Android but we choose to promote the mobile app
8
+ * anyway claiming the user experience provided by the Web app is inferior to
9
+ * that of the mobile app. Eventually, the user may choose to dismiss the
10
+ * promotion of the mobile app and take their chances with the Web app instead.
11
+ * If unused, then we have chosen to force the mobile app and not allow the Web
12
+ * app in mobile browsers.
6
  *
13
  *
7
  * {
14
  * {
8
- *     type: MOBILE_BROWSER_PAGE_IS_SHOWN
15
+ *     type: DISMISS_MOBILE_APP_PROMO
9
  * }
16
  * }
10
  */
17
  */
11
-// eslint-disable-next-line max-len
12
-export const MOBILE_BROWSER_PAGE_IS_SHOWN = Symbol('MOBILE_BROWSER_PAGE_IS_SHOWN');
18
+export const DISMISS_MOBILE_APP_PROMO = Symbol('DISMISS_MOBILE_APP_PROMO');

+ 12
- 6
react/features/unsupported-browser/actions.js View File

1
-import { MOBILE_BROWSER_PAGE_IS_SHOWN } from './actionTypes';
1
+import { DISMISS_MOBILE_APP_PROMO } from './actionTypes';
2
 import './reducer';
2
 import './reducer';
3
 
3
 
4
 /**
4
 /**
5
- * Returns an action that mobile browser page is shown and there is no need
6
- * to show it on other pages.
5
+ * Returns a Redux action which signals that the UnsupportedMobileBrowser which
6
+ * was rendered as a promotion of the mobile app on a browser was dismissed by
7
+ * the user. For example, the Web app may possibly run in Google Chrome
8
+ * on Android but we choose to promote the mobile app anyway claiming the user
9
+ * experience provided by the Web app is inferior to that of the mobile app.
10
+ * Eventually, the user may choose to dismiss the promotion of the mobile app
11
+ * and take their chances with the Web app instead. If unused, then we have
12
+ * chosen to force the mobile app and not allow the Web app in mobile browsers.
7
  *
13
  *
8
  * @returns {{
14
  * @returns {{
9
- *     type: MOBILE_BROWSER_PAGE_IS_SHOWN
15
+ *     type: DISMISS_MOBILE_APP_PROMO
10
  * }}
16
  * }}
11
  */
17
  */
12
-export function mobileBrowserPageIsShown() {
18
+export function dismissMobileAppPromo() {
13
     return {
19
     return {
14
-        type: MOBILE_BROWSER_PAGE_IS_SHOWN
20
+        type: DISMISS_MOBILE_APP_PROMO
15
     };
21
     };
16
 }
22
 }

+ 34
- 38
react/features/unsupported-browser/components/UnsupportedMobileBrowser.js View File

1
 import React, { Component } from 'react';
1
 import React, { Component } from 'react';
2
 import { connect } from 'react-redux';
2
 import { connect } from 'react-redux';
3
 
3
 
4
-import { appNavigate } from '../../app';
5
 import { Platform } from '../../base/react';
4
 import { Platform } from '../../base/react';
6
 
5
 
7
-import { mobileBrowserPageIsShown } from '../actions';
8
-
9
 /**
6
 /**
10
  * The map of platforms to URLs at which the mobile app for the associated
7
  * The map of platforms to URLs at which the mobile app for the associated
11
  * platform is available for download.
8
  * platform is available for download.
27
      * @static
24
      * @static
28
      */
25
      */
29
     static propTypes = {
26
     static propTypes = {
30
-        dispatch: React.PropTypes.func,
31
-        room: React.PropTypes.string
27
+        /**
28
+         * The name of the conference room to be joined upon clicking the
29
+         * respective button.
30
+         *
31
+         * @private
32
+         * @type {string}
33
+         */
34
+        _room: React.PropTypes.string
32
     }
35
     }
33
 
36
 
34
     /**
37
     /**
41
         super(props);
44
         super(props);
42
 
45
 
43
         // Bind methods
46
         // Bind methods
44
-        this._onClickJoin = this._onClickJoin.bind(this);
45
-    }
46
-
47
-    /**
48
-     * React lifecycle method triggered after component is mounted.
49
-     *
50
-     * @returns {void}
51
-     */
52
-    componentDidMount() {
53
-        this.props.dispatch(mobileBrowserPageIsShown());
47
+        this._onJoinClick = this._onJoinClick.bind(this);
54
     }
48
     }
55
 
49
 
56
     /**
50
     /**
59
      * @returns {void}
53
      * @returns {void}
60
      */
54
      */
61
     componentWillMount() {
55
     componentWillMount() {
62
-        const { room } = this.props;
63
-        let btnText;
64
-        let link;
65
-
66
-        if (room) {
67
-            btnText = 'Join the conversation';
68
-            link = room;
69
-        } else {
70
-            btnText = 'Start a conference';
71
-            link = '';
72
-        }
56
+        const joinButtonText
57
+            = this.props._room ? 'Join the conversation' : 'Start a conference';
73
 
58
 
74
         this.setState({
59
         this.setState({
75
-            btnText,
76
-            link
60
+            joinButtonText
77
         });
61
         });
78
     }
62
     }
79
 
63
 
84
      */
68
      */
85
     render() {
69
     render() {
86
         const ns = 'unsupported-mobile-browser';
70
         const ns = 'unsupported-mobile-browser';
87
-        const primaryButtonClasses
88
-            = `${ns}__button ${ns}__button_primary`;
71
+        const downloadButtonClassName = `${ns}__button ${ns}__button_primary`;
89
 
72
 
90
         return (
73
         return (
91
             <div className = { ns }>
74
             <div className = { ns }>
98
                         conversation on your mobile
81
                         conversation on your mobile
99
                     </p>
82
                     </p>
100
                     <a href = { URLS[Platform.OS] }>
83
                     <a href = { URLS[Platform.OS] }>
101
-                        <button className = { primaryButtonClasses }>
84
+                        <button className = { downloadButtonClassName }>
102
                             Download the App
85
                             Download the App
103
                         </button>
86
                         </button>
104
                     </a>
87
                     </a>
109
                     </p>
92
                     </p>
110
                     <button
93
                     <button
111
                         className = { `${ns}__button` }
94
                         className = { `${ns}__button` }
112
-                        onClick = { this._onClickJoin }>
95
+                        onClick = { this._onJoinClick }>
113
                         {
96
                         {
114
-                            this.state.btnText
97
+                            this.state.joinButtonText
115
                         }
98
                         }
116
                     </button>
99
                     </button>
117
                 </div>
100
                 </div>
120
     }
103
     }
121
 
104
 
122
     /**
105
     /**
123
-     * Navigates to the next state of the app.
106
+     * Handles clicks on the button that joins the local participant in a
107
+     * conference.
124
      *
108
      *
125
      * @private
109
      * @private
126
      * @returns {void}
110
      * @returns {void}
127
      */
111
      */
128
-    _onClickJoin() {
129
-        this.props.dispatch(appNavigate(this.state.link));
112
+    _onJoinClick() {
113
+        // If the user installed the app while this Component was displayed
114
+        // (e.g. the user clicked the Download the App button), then we would
115
+        // like to open the current URL in the mobile app.
116
+
117
+        // TODO The only way to do it appears to be a link with an app-specific
118
+        // scheme, not a Universal Link.
130
     }
119
     }
131
 }
120
 }
132
 
121
 
136
  *
125
  *
137
  * @param {Object} state - Redux state.
126
  * @param {Object} state - Redux state.
138
  * @returns {{
127
  * @returns {{
139
- *     room: string
128
+ *     _room: string
140
  * }}
129
  * }}
141
  */
130
  */
142
 function mapStateToProps(state) {
131
 function mapStateToProps(state) {
143
     return {
132
     return {
144
-        room: state['features/base/conference'].room
133
+        /**
134
+         * The name of the conference room to be joined upon clicking the
135
+         * respective button.
136
+         *
137
+         * @private
138
+         * @type {string}
139
+         */
140
+        _room: state['features/base/conference'].room
145
     };
141
     };
146
 }
142
 }
147
 
143
 

+ 8
- 4
react/features/unsupported-browser/reducer.js View File

1
 import { ReducerRegistry } from '../base/redux';
1
 import { ReducerRegistry } from '../base/redux';
2
 
2
 
3
-import { MOBILE_BROWSER_PAGE_IS_SHOWN } from './actionTypes';
3
+import { DISMISS_MOBILE_APP_PROMO } from './actionTypes';
4
 
4
 
5
 ReducerRegistry.register(
5
 ReducerRegistry.register(
6
         'features/unsupported-browser',
6
         'features/unsupported-browser',
7
         (state = {}, action) => {
7
         (state = {}, action) => {
8
             switch (action.type) {
8
             switch (action.type) {
9
-            case MOBILE_BROWSER_PAGE_IS_SHOWN:
9
+            case DISMISS_MOBILE_APP_PROMO:
10
                 return {
10
                 return {
11
                     ...state,
11
                     ...state,
12
 
12
 
13
                     /**
13
                     /**
14
-                     * Flag that shows that mobile browser page is shown.
14
+                     * The indicator which determines whether the React
15
+                     * Component UnsupportedMobileBrowser which was rendered as
16
+                     * a promotion of the mobile app on a browser was dismissed
17
+                     * by the user. If unused, then we have chosen to force the
18
+                     * mobile app and not allow the Web app in mobile browsers.
15
                      *
19
                      *
16
                      * @type {boolean}
20
                      * @type {boolean}
17
                      */
21
                      */
18
-                    mobileBrowserPageIsShown: true
22
+                    mobileAppPromoDismissed: true
19
                 };
23
                 };
20
             }
24
             }
21
 
25
 

Loading…
Cancel
Save