haskal
/
jiti-meet
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Moves native password required prompt to room lock feature. 

Moves native dialogs to use dialog container. Implements native Dialog that uses react native Prompt.
This commit is contained in:
damencho 2017-03-07 10:02:52 -06:00
parent 61470c0d24
commit 309ce43e05
7 changed files with 31 additions and 217 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

105
react/features/conference/components/Conference.native.js
View File

@ -6,10 +6,8 @@ import { DialogContainer } from '../../base/dialog';
import { Container } from '../../base/react';
import { FilmStrip } from '../../film-strip';
import { LargeVideo } from '../../large-video';
import { RoomLockPrompt } from '../../room-lock';
import { Toolbar } from '../../toolbar';
import PasswordRequiredPrompt from './PasswordRequiredPrompt';
import { styles } from './styles';
/**
@ -30,23 +28,6 @@ class Conference extends Component {
* @static
*/
static propTypes = {
/**
* The indicator which determines whether a password is required to join
* the conference and has not been provided yet.
*
* @private
* @type {JitsiConference}
*/
_passwordRequired: React.PropTypes.object,
/**
* The indicator which determines whether the user has requested to lock
* the conference/room.
*
* @private
* @type {JitsiConference}
*/
_roomLockRequested: React.PropTypes.object,
dispatch: React.PropTypes.func
}
@ -128,9 +109,6 @@ class Conference extends Component {
<DialogContainer />
{
this._renderPrompt()
}
</Container>
);
}
@ -164,56 +142,6 @@ class Conference extends Component {
this._setToolbarTimeout(toolbarVisible);
}
/**
* Renders a prompt if a password is required to join the conference.
*
* @private
* @returns {ReactElement}
*/
_renderPasswordRequiredPrompt() {
const required = this.props._passwordRequired;
if (required) {
return (
<PasswordRequiredPrompt conference = { required } />
);
}
return null;
}
/**
* Renders a prompt if necessary such as when a password is required to join
* the conference or the user has requested to lock the conference/room.
*
* @private
* @returns {ReactElement}
*/
_renderPrompt() {
return (
this._renderPasswordRequiredPrompt()
|| this._renderRoomLockPrompt()
);
}
/**
* Renders a prompt if the user has requested to lock the conference/room.
*
* @private
* @returns {ReactElement}
*/
_renderRoomLockPrompt() {
const requested = this.props._roomLockRequested;
if (requested) {
return (
<RoomLockPrompt conference = { requested } />
);
}
return null;
}
/**
* Triggers the default toolbar timeout.
*
@ -231,35 +159,4 @@ class Conference extends Component {
}
}
/**
* Maps (parts of) the Redux state to the associated Conference's props.
*
* @param {Object} state - The Redux state.
* @private
* @returns {{
* _passwordRequired: boolean
* }}
*/
function _mapStateToProps(state) {
return {
/**
* The indicator which determines whether a password is required to join
* the conference and has not been provided yet.
*
* @private
* @type {JitsiConference}
*/
_passwordRequired: state['features/base/conference'].passwordRequired,
/**
* The indicator which determines whether the user has requested to lock
* the conference/room.
*
* @private
* @type {JitsiConference}
*/
_roomLockRequested: state['features/room-lock'].requested
};
}
export default reactReduxConnect(_mapStateToProps)(Conference);
export default reactReduxConnect()(Conference);

24
react/features/room-lock/actionTypes.js
View File

@ -1,24 +0,0 @@
import { Symbol } from '../base/react';
/**
* The type of Redux action which begins a (user) request to lock a specific
* JitsiConference.
*
* {
* type: BEGIN_ROOM_LOCK_REQUEST,
* conference: JitsiConference
* }
*/
export const BEGIN_ROOM_LOCK_REQUEST = Symbol('BEGIN_ROOM_LOCK_REQUEST');
/**
* The type of Redux action which end a (user) request to lock a specific
* JitsiConference.
*
* {
* type: END_ROOM_LOCK_REQUEST,
* conference: JitsiConference,
* password: string
* }
*/
export const END_ROOM_LOCK_REQUEST = Symbol('END_ROOM_LOCK_REQUEST');

19
react/features/room-lock/actions.js
View File

@ -1,8 +1,6 @@
import { setPassword } from '../base/conference';
import { openDialog } from '../base/dialog';
import { PasswordRequiredPrompt } from './components';
import { BEGIN_ROOM_LOCK_REQUEST, END_ROOM_LOCK_REQUEST } from './actionTypes';
import { hideDialog, openDialog } from '../base/dialog';
import { PasswordRequiredPrompt, RoomLockPrompt } from './components';
/**
* Begins a (user) request to lock a specific conference/room.
@ -21,10 +19,7 @@ export function beginRoomLockRequest(conference) {
}
if (conference) {
dispatch({
type: BEGIN_ROOM_LOCK_REQUEST,
conference
});
dispatch(openDialog(RoomLockPrompt, { conference }));
}
};
}
@ -45,11 +40,7 @@ export function endRoomLockRequest(conference, password) {
? dispatch(setPassword(conference, conference.lock, password))
: Promise.resolve();
const endRoomLockRequest_ = () => {
dispatch({
type: END_ROOM_LOCK_REQUEST,
conference,
password
});
dispatch(hideDialog());
};
setPassword_.then(endRoomLockRequest_, endRoomLockRequest_);
@ -63,7 +54,7 @@ export function endRoomLockRequest(conference, password) {
* requesting password.
* @protected
* @returns {{
* type: BEGIN_DIALOG_REQUEST,
* type: OPEN_DIALOG,
* component: Component,
* props: React.PropTypes
* }}

31
react/features/conference/components/PasswordRequiredPrompt.native.js → react/features/room-lock/components/PasswordRequiredPrompt.native.js
View File

@ -1,9 +1,8 @@
import React, { Component } from 'react';
import Prompt from 'react-native-prompt';
import { connect } from 'react-redux';
import { Dialog } from '../../base/dialog';
import { setPassword } from '../../base/conference';
import { translate } from '../../base/i18n';
/**
* Implements a React Component which prompts the user when a password is
@ -22,15 +21,7 @@ class PasswordRequiredPrompt extends Component {
* @type {JitsiConference}
*/
conference: React.PropTypes.object,
dispatch: React.PropTypes.func,
/**
* The function to translate human-readable text.
*
* @public
* @type {Function}
*/
t: React.PropTypes.func
dispatch: React.PropTypes.func
}
/**
@ -54,15 +45,13 @@ class PasswordRequiredPrompt extends Component {
* @returns {ReactElement}
*/
render() {
const { t } = this.props;
return (
<Prompt
<Dialog
bodyKey = 'dialog.passwordLabel'
onCancel = { this._onCancel }
onSubmit = { this._onSubmit }
placeholder = { t('dialog.passwordLabel') }
title = { t('dialog.passwordRequired') }
visible = { true } />
titleKey = 'dialog.passwordRequired' />
);
}
@ -70,14 +59,14 @@ class PasswordRequiredPrompt extends Component {
* Notifies this prompt that it has been dismissed by cancel.
*
* @private
* @returns {void}
* @returns {boolean} whether to hide dialog.
*/
_onCancel() {
// XXX The user has canceled this prompt for a password so we are to
// attempt joining the conference without a password. If the conference
// still requires a password to join, the user will be prompted again
// later.
this._onSubmit(undefined);
return this._onSubmit(undefined);
}
/**
@ -86,13 +75,15 @@ class PasswordRequiredPrompt extends Component {
*
* @param {string} value - The submitted value.
* @private
* @returns {void}
* @returns {boolean} whether to hide dialog.
*/
_onSubmit(value) {
const conference = this.props.conference;
this.props.dispatch(setPassword(conference, conference.join, value));
return true;
}
}
export default translate(connect()(PasswordRequiredPrompt));
export default connect()(PasswordRequiredPrompt);

35
react/features/room-lock/components/RoomLockPrompt.native.js
View File

@ -1,8 +1,6 @@
import React, { Component } from 'react';
import Prompt from 'react-native-prompt';
import { connect } from 'react-redux';
import { translate } from '../../base/i18n';
import { Dialog } from '../../base/dialog';
import { endRoomLockRequest } from '../actions';
@ -23,15 +21,7 @@ class RoomLockPrompt extends Component {
* @type {JitsiConference}
*/
conference: React.PropTypes.object,
dispatch: React.PropTypes.func,
/**
* The function to translate human-readable text.
*
* @public
* @type {Function}
*/
t: React.PropTypes.func
dispatch: React.PropTypes.func
}
/**
@ -55,15 +45,13 @@ class RoomLockPrompt extends Component {
* @returns {ReactElement}
*/
render() {
const { t } = this.props;
return (
<Prompt
<Dialog
bodyKey = 'dialog.passwordLabel'
onCancel = { this._onCancel }
onSubmit = { this._onSubmit }
placeholder = { t('dialog.passwordLabel') }
title = { t('toolbar.lock') }
visible = { true } />
titleKey = 'toolbar.lock' />
);
}
@ -71,12 +59,12 @@ class RoomLockPrompt extends Component {
* Notifies this prompt that it has been dismissed by cancel.
*
* @private
* @returns {void}
* @returns {boolean} whether to hide the dialog
*/
_onCancel() {
// An undefined password is understood to cancel the request to lock the
// conference/room.
this._onSubmit(undefined);
return this._onSubmit(undefined);
}
/**
@ -85,11 +73,16 @@ class RoomLockPrompt extends Component {
*
* @param {string} value - The submitted value.
* @private
* @returns {void}
* @returns {boolean} returns false, we do not want to hide dialog as this
* will be handled inside endRoomLockRequest after setting password is
* resolved.
*/
_onSubmit(value) {
this.props.dispatch(endRoomLockRequest(this.props.conference, value));
// do not hide
return false;
}
}
export default translate(connect()(RoomLockPrompt));
export default connect()(RoomLockPrompt);

1
react/features/room-lock/index.js
View File

@ -2,4 +2,3 @@ export * from './actions';
export * from './components';
import './middleware';
import './reducer';

33
react/features/room-lock/reducer.js
View File

@ -1,33 +0,0 @@
import {
CONFERENCE_FAILED,
CONFERENCE_JOINED,
CONFERENCE_LEFT
} from '../base/conference';
import { ReducerRegistry, setStateProperty } from '../base/redux';
import { BEGIN_ROOM_LOCK_REQUEST, END_ROOM_LOCK_REQUEST } from './actionTypes';
ReducerRegistry.register('features/room-lock', (state = {}, action) => {
switch (action.type) {
case BEGIN_ROOM_LOCK_REQUEST:
return setStateProperty(state, 'requested', action.conference);
case CONFERENCE_FAILED:
case CONFERENCE_LEFT:
case END_ROOM_LOCK_REQUEST: {
if (state.requested === action.conference) {
return setStateProperty(state, 'requested', undefined);
}
break;
}
case CONFERENCE_JOINED: {
if (state.requested !== action.conference) {
return setStateProperty(state, 'requested', undefined);
}
break;
}
}
return state;
});