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

Comply w/ coding style 

@virtuacoplenny, the changes of this commit are not necessarily in
source code that you introduced in
https://github.com/jitsi/jitsi-meet/pull/1499 but I saw violations in
files modified in the PR which I had to read in order to understand the
PR.
This commit is contained in:
Lyubo Marinov 2017-04-18 16:49:52 -05:00
parent 44b81b20e3
commit 55c3f5ddff
16 changed files with 211 additions and 147 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

15
conference.js
View File

@ -409,12 +409,9 @@ class ConferenceConnector {
break;
// not enough rights to create conference
case ConferenceErrors.AUTHENTICATION_REQUIRED:
{
// schedule reconnect to check if someone else created the room
this.reconnectTimeout = setTimeout(function () {
room.join();
}, 5000);
case ConferenceErrors.AUTHENTICATION_REQUIRED: {
// Schedule reconnect to check if someone else created the room.
this.reconnectTimeout = setTimeout(() => room.join(), 5000);
const { password }
= APP.store.getState()['features/base/conference'];
@ -1449,9 +1446,9 @@ export default {
APP.UI.changeDisplayName(id, formattedDisplayName);
});
room.on(ConferenceEvents.LOCK_STATE_CHANGED, (...args) => {
APP.store.dispatch(lockStateChanged(room, ...args));
});
room.on(
ConferenceEvents.LOCK_STATE_CHANGED,
(...args) => APP.store.dispatch(lockStateChanged(room, ...args)));
room.on(ConferenceEvents.PARTICIPANT_PROPERTY_CHANGED,
(participant, name, oldValue, newValue) => {

12
css/modals/invite/_invite.scss
View File

@ -24,18 +24,18 @@
margin-top: 10px;
}
.password-overview-toggle-edit,
.remove-password-link {
cursor: pointer;
text-decoration: none;
}
.password-overview-status,
.remove-password {
display: flex;
justify-content: space-between;
}
.password-overview-toggle-edit,
.remove-password-link {
cursor: pointer;
text-decoration: none;
}
.remove-password {
margin-top: 15px;
}

8
modules/UI/side_pannels/contactlist/ContactList.js
View File

@ -24,9 +24,7 @@ class ContactList {
* @returns {Boolean}
*/
isLocked() {
const conference = APP.store.getState()['features/base/conference'];
return conference.locked;
return APP.store.getState()['features/base/conference'].locked;
}
/**
@ -36,9 +34,9 @@ class ContactList {
* @param isLocal
*/
addContact(id, isLocal) {
let isExist = this.contacts.some((el) => el.id === id);
const exists = this.contacts.some(el => el.id === id);
if (!isExist) {
if (!exists) {
let newContact = new Contact({ id, isLocal });
this.contacts.push(newContact);
APP.UI.emitEvent(UIEvents.CONTACT_ADDED, { id, isLocal });

27
modules/UI/side_pannels/contactlist/ContactListView.js
View File

@ -1,5 +1,4 @@
/* global $, APP, interfaceConfig */
const logger = require("jitsi-meet-logger").getLogger(__filename);
import { openInviteDialog } from '../../../../react/features/invite';
@ -7,6 +6,8 @@ import Avatar from '../../avatar/Avatar';
import UIEvents from '../../../../service/UI/UIEvents';
import UIUtil from '../../util/UIUtil';
const logger = require('jitsi-meet-logger').getLogger(__filename);
let numberOfContacts = 0;
const sidePanelsContainerId = 'sideToolbarContainer';
const htmlStr = `
@ -169,20 +170,28 @@ var ContactListView = {
APP.UI.addListener(UIEvents.USER_AVATAR_CHANGED, changeAvatar);
APP.UI.addListener(UIEvents.DISPLAY_NAME_CHANGED, displayNameChange);
},
/**
* Updates the view according to the passed in lock state.
*
* @param {boolean} isLocked - True if the locked UI state should display.
* @param {boolean} locked - True to display the locked UI state or false to
* display the unlocked UI state.
*/
setLockDisplay(isLocked) {
const showKey = isLocked ? this.lockKey : this.unlockKey;
const hideKey = !isLocked ? this.lockKey : this.unlockKey;
const showId = `contactList${showKey}`;
const hideId = `contactList${hideKey}`;
setLockDisplay(locked) {
let hideKey, showKey;
$(`#${showId}`).show();
$(`#${hideId}`).hide();
if (locked) {
hideKey = this.unlockKey;
showKey = this.lockKey;
} else {
hideKey = this.lockKey;
showKey = this.unlockKey;
}
$(`#contactList${hideKey}`).hide();
$(`#contactList${showKey}`).show();
},
/**
* Indicates if the chat is currently visible.
*

2
react/features/base/conference/actionTypes.js
View File

@ -118,7 +118,7 @@ export const SET_PASSWORD = Symbol('SET_PASSWORD');
/**
* The type of Redux action which signals that setting a password on a
* JitsiConference encountered an error and failed.
* JitsiConference failed (with an error).
*
* {
* type: SET_PASSWORD_FAILED,

22
react/features/base/conference/reducer.js
View File

@ -85,6 +85,14 @@ function _conferenceFailed(state, action) {
audioOnlyVideoMuted: undefined,
conference: undefined,
leaving: undefined,
/**
* The indicator of how the conference/room is locked. If falsy, the
* conference/room is unlocked; otherwise, it's either
* {@code LOCKED_LOCALLY| or {@code LOCKED_REMOTELY}.
*
* @type {string}
*/
locked: passwordRequired ? LOCKED_REMOTELY : undefined,
password: undefined,
@ -211,14 +219,14 @@ function _lockStateChanged(state, action) {
return state;
}
let lockState;
let locked;
if (action.locked) {
lockState = state.locked || LOCKED_REMOTELY;
locked = state.locked || LOCKED_REMOTELY;
}
return setStateProperties(state, {
locked: lockState,
locked,
password: action.locked ? state.password : null
});
}
@ -265,7 +273,7 @@ function _setPassword(state, action) {
const conference = action.conference;
switch (action.method) {
case conference.join: {
case conference.join:
if (state.passwordRequired === conference) {
return (
setStateProperties(state, {
@ -280,16 +288,14 @@ function _setPassword(state, action) {
passwordRequired: undefined
}));
}
break;
}
case conference.lock: {
case conference.lock:
return setStateProperties(state, {
locked: action.password ? LOCKED_LOCALLY : undefined,
password: action.password
});
}
}
return state;
}

6
react/features/invite/actions.js
View File

@ -10,9 +10,7 @@ import { InviteDialog } from './components';
* @returns {Function}
*/
export function openInviteDialog() {
return dispatch => {
dispatch(openDialog(InviteDialog, {
return openDialog(InviteDialog, {
conferenceUrl: encodeURI(APP.ConferenceUrl.getInviteUrl())
}));
};
});
}

23
react/features/invite/components/AddPasswordForm.js
View File

@ -5,11 +5,11 @@ import { setPassword } from '../../base/conference';
import { translate } from '../../base/i18n';
/**
* A React Component for locking a JitsiConference with a password.
* A React {@code Component} for locking a JitsiConference with a password.
*/
class AddPasswordForm extends Component {
/**
* AddPasswordForm component's property types.
* {@code AddPasswordForm}'s property types.
*
* @static
*/
@ -33,7 +33,7 @@ class AddPasswordForm extends Component {
}
/**
* Initializes a new AddPasswordForm instance.
* Initializes a new {@code AddPasswordForm} instance.
*
* @param {Object} props - The read-only properties with which the new
* instance is to be initialized.
@ -42,9 +42,17 @@ class AddPasswordForm extends Component {
super(props);
this.state = {
/**
* The current value to display in {@code AddPasswordForm}
* component's input field. The value is also used as the desired
* new password when creating a {@code setPassword} action.
*
* @type {string}
*/
password: ''
};
// Bind event handlers so they are only bound once for every instance.
this._onKeyDown = this._onKeyDown.bind(this);
this._onPasswordChange = this._onPasswordChange.bind(this);
this._onSubmit = this._onSubmit.bind(this);
@ -57,6 +65,8 @@ class AddPasswordForm extends Component {
* @returns {ReactElement}
*/
render() {
const { t } = this.props;
return (
<div
className = 'form-control'
@ -68,8 +78,7 @@ class AddPasswordForm extends Component {
id = 'newPasswordInput'
onChange = { this._onPasswordChange }
onKeyDown = { this._onKeyDown }
placeholder
= { this.props.t('dialog.createPassword') }
placeholder = { t('dialog.createPassword') }
type = 'text' />
<button
className = 'button-control button-control_light'
@ -77,7 +86,7 @@ class AddPasswordForm extends Component {
id = 'addPasswordBtn'
onClick = { this._onSubmit }
type = 'button'>
{ this.props.t('dialog.add') }
{ t('dialog.add') }
</button>
</div>
</div>
@ -122,7 +131,7 @@ class AddPasswordForm extends Component {
return;
}
const conference = this.props.conference;
const { conference } = this.props;
this.props.dispatch(setPassword(
conference,

26
react/features/invite/components/InviteDialog.js
View File

@ -13,12 +13,13 @@ import PasswordContainer from './PasswordContainer';
import ShareLinkForm from './ShareLinkForm';
/**
* A React Component for displaying other components responsible for copying the
* current conference url and for setting or removing a conference password.
* A React {@code Component} for displaying other components responsible for
* copying the current conference url and for setting or removing a conference
* password.
*/
class InviteDialog extends Component {
/**
* InviteDialog component's property types.
* {@code InviteDialog} component's property types.
*
* @static
*/
@ -61,19 +62,23 @@ class InviteDialog extends Component {
* @returns {ReactElement}
*/
render() {
const { _conference } = this.props;
const titleString
= this.props.t(
'invite.inviteTo',
{ conferenceName: _conference.room });
return (
<Dialog
cancelDisabled = { true }
okTitleKey = 'dialog.done'
titleString = { this.props.t(
'invite.inviteTo',
{ conferenceName: this.props._conference.room }) } >
titleString = { titleString }>
<div className = 'invite-dialog'>
<ShareLinkForm toCopy = { this.props.conferenceUrl } />
<PasswordContainer
conference = { this.props._conference.conference }
locked = { this.props._conference.locked }
password = { this.props._conference.password }
conference = { _conference.conference }
locked = { _conference.locked }
password = { _conference.password }
showPasswordEdit = { this.props._isModerator } />
</div>
</Dialog>
@ -82,7 +87,8 @@ class InviteDialog extends Component {
}
/**
* Maps (parts of) the Redux state to the associated InviteDialog's props.
* Maps (parts of) the Redux state to the associated {@code InviteDialog}'s
* props.
*
* @param {Object} state - The Redux state.
* @private

24
react/features/invite/components/LockStatePanel.js
View File

@ -7,7 +7,7 @@ import { translate } from '../../base/i18n';
*/
class LockStatePanel extends Component {
/**
* LockStatePanel component's property types.
* {@code LockStatePanel}'s property types.
*
* @static
*/
@ -30,15 +30,25 @@ class LockStatePanel extends Component {
* @returns {ReactElement}
*/
render() {
const [ lockStateClass, lockIconClass, lockTextKey ] = this.props.locked
? [ 'is-locked', 'icon-security-locked', 'invite.locked' ]
: [ 'is-unlocked', 'icon-security', 'invite.unlocked' ];
let iconClass;
let stateClass;
let textKey;
if (this.props.locked) {
iconClass = 'icon-security-locked';
stateClass = 'is-locked';
textKey = 'invite.locked';
} else {
iconClass = 'icon-security';
stateClass = 'is-unlocked';
textKey = 'invite.unlocked';
}
return (
<div className = { `lock-state ${lockStateClass}` }>
<span className = { lockIconClass } />
<div className = { `lock-state ${stateClass}` }>
<span className = { iconClass } />
<span>
{ this.props.t(lockTextKey) }
{ this.props.t(textKey) }
</span>
</div>
);

19
react/features/invite/components/PasswordContainer.js
View File

@ -8,12 +8,12 @@ import LockStatePanel from './LockStatePanel';
import RemovePasswordForm from './RemovePasswordForm';
/**
* React component for displaying the current room lock state as well as
* React {@code Component} for displaying the current room lock state as well as
* exposing features to modify the room lock.
*/
class PasswordContainer extends Component {
/**
* PasswordContainer component's property types.
* {@code PasswordContainer}'s property types.
*
* @static
*/
@ -49,7 +49,7 @@ class PasswordContainer extends Component {
}
/**
* Initializes a new PasswordContainer instance.
* Initializes a new {@code PasswordContainer} instance.
*
* @param {Object} props - The read-only properties with which the new
* instance is to be initialized.
@ -58,9 +58,16 @@ class PasswordContainer extends Component {
super(props);
this.state = {
/**
* Whether or not the form to edit the password should display. If
* true, the form should display.
*
* @type {boolean}
*/
isEditingPassword: false
};
// Bind event handlers so they are only bound once for every instance.
this._onTogglePasswordEdit = this._onTogglePasswordEdit.bind(this);
}
@ -105,12 +112,14 @@ class PasswordContainer extends Component {
return null;
}
return this.props.locked
return (
this.props.locked
? <RemovePasswordForm
conference = { this.props.conference }
lockedLocally = { this.props.locked === LOCKED_LOCALLY }
password = { this.props.password } />
: <AddPasswordForm conference = { this.props.conference } />;
: <AddPasswordForm conference = { this.props.conference } />
);
}
/**

17
react/features/invite/components/RemovePasswordForm.js
View File

@ -5,11 +5,11 @@ import { setPassword } from '../../base/conference';
import { translate } from '../../base/i18n';
/**
* A React Component for removing a lock from a JitsiConference.
* A React {@code Component} for removing a lock from a JitsiConference.
*/
class RemovePasswordForm extends Component {
/**
* RemovePasswordForm component's property types.
* {@code RemovePasswordForm}'s property types.
*
* @static
*/
@ -43,7 +43,7 @@ class RemovePasswordForm extends Component {
}
/**
* Initializes a new RemovePasswordForm instance.
* Initializes a new {@code RemovePasswordForm} instance.
*
* @param {Object} props - The read-only properties with which the new
* instance is to be initialized.
@ -51,6 +51,7 @@ class RemovePasswordForm extends Component {
constructor(props) {
super(props);
// Bind event handlers so they are only bound once for every instance.
this._onClick = this._onClick.bind(this);
}
@ -83,15 +84,15 @@ class RemovePasswordForm extends Component {
* @returns {ReactElement}
*/
_getPasswordPreviewText() {
const { lockedLocally, password, t } = this.props;
return (
<span>
<span>
{ `${this.props.t('dialog.currentPassword')} ` }
{ `${t('dialog.currentPassword')} ` }
</span>
<span className = 'remove-password-current'>
{ this.props.lockedLocally
? this.props.password
: this.props.t('passwordSetRemotely') }
{ lockedLocally ? password : t('passwordSetRemotely') }
</span>
</span>
);
@ -104,7 +105,7 @@ class RemovePasswordForm extends Component {
* @returns {void}
*/
_onClick() {
const conference = this.props.conference;
const { conference } = this.props;
this.props.dispatch(setPassword(
conference,

38
react/features/invite/components/ShareLinkForm.js
View File

@ -5,12 +5,12 @@ import { translate } from '../../base/i18n';
const logger = require('jitsi-meet-logger').getLogger(__filename);
/**
* A React Component for displaying a value with a copy button that can be
* clicked to copy the value onto the clipboard.
* A React {@code Component} for displaying a value with a copy button to copy
* the value into the clipboard.
*/
class ShareLinkForm extends Component {
/**
* ShareLinkForm component's property types.
* {@code ShareLinkForm}'s property types.
*
* @static
*/
@ -21,13 +21,13 @@ class ShareLinkForm extends Component {
t: React.PropTypes.func,
/**
* The value to be displayed and copied onto the clipboard.
* The value to be displayed and copied into the clipboard.
*/
toCopy: React.PropTypes.string
}
/**
* Initializes a new ShareLinkForm instance.
* Initializes a new {@code ShareLinkForm} instance.
*
* @param {Object} props - The read-only properties with which the new
* instance is to be initialized.
@ -35,8 +35,17 @@ class ShareLinkForm extends Component {
constructor(props) {
super(props);
/**
* The internal reference to the DOM/HTML element backing the React
* {@code Component} input with id {@code inviteLinkRef}. It is
* necessary for the implementation of copying to the clipboard.
*
* @private
* @type {HTMLInputElement}
*/
this._inputElement = null;
// Bind event handlers so they are only bound once for every instance.
this._onClick = this._onClick.bind(this);
this._setInput = this._setInput.bind(this);
}
@ -48,15 +57,15 @@ class ShareLinkForm extends Component {
* @returns {ReactElement}
*/
render() {
const inputValue = this.props.toCopy
|| this.props.t('inviteUrlDefaultMsg');
const { t } = this.props;
const inputValue = this.props.toCopy || t('inviteUrlDefaultMsg');
// FIXME input is used here instead of atlaskit field-text because
// field-text does not currently support readonly
// FIXME An input HTML element is used here instead of atlaskit's
// field-text because the latter does not currently support readOnly.
return (
<div className = 'form-control'>
<label className = 'form-control__label'>
{ this.props.t('dialog.shareLink') }
{ t('dialog.shareLink') }
</label>
<div className = 'form-control__container'>
<input
@ -71,7 +80,7 @@ class ShareLinkForm extends Component {
'button-control button-control_light copyInviteLink'
onClick = { this._onClick }
type = 'button'>
{ this.props.t('dialog.copy') }
{ t('dialog.copy') }
</button>
</div>
</div>
@ -95,10 +104,11 @@ class ShareLinkForm extends Component {
}
/**
* Sets the internal reference to the DOM element for the input field so it
* may be accessed directly.
* Sets the internal reference to the DOM/HTML element backing the React
* {@code Component} input with id {@code inviteLinkRef}.
*
* @param {Object} element - DOM element for the component's input.
* @param {HTMLInputElement} element - The DOM/HTML element for this
* {@code Component}'s input.
* @private
* @returns {void}
*/

45
react/features/room-lock/components/PasswordRequiredPrompt.web.js
View File

@ -1,7 +1,8 @@
/* global APP */
import AKFieldText from '@atlaskit/field-text';
import React, { Component } from 'react';
import { connect } from 'react-redux';
import AKFieldText from '@atlaskit/field-text';
import UIEvents from '../../../../service/UI/UIEvents';
@ -39,7 +40,9 @@ class PasswordRequiredPrompt extends Component {
constructor(props) {
super(props);
this.state = { password: '' };
this.state = {
password: ''
};
this._onPasswordChanged = this._onPasswordChanged.bind(this);
this._onSubmit = this._onSubmit.bind(this);
@ -69,19 +72,18 @@ class PasswordRequiredPrompt extends Component {
* @protected
*/
_renderBody() {
const { t } = this.props;
return (
<div>
<AKFieldText
compact = { true }
label = { t('dialog.passwordLabel') }
label = { this.props.t('dialog.passwordLabel') }
name = 'lockKey'
onChange = { this._onPasswordChanged }
shouldFitContainer = { true }
type = 'text'
value = { this.state.password } />
</div>);
</div>
);
}
/**
@ -92,7 +94,9 @@ class PasswordRequiredPrompt extends Component {
* @returns {void}
*/
_onPasswordChanged(event) {
this.setState({ password: event.target.value });
this.setState({
password: event.target.value
});
}
/**
@ -102,25 +106,26 @@ class PasswordRequiredPrompt extends Component {
* @returns {void}
*/
_onSubmit() {
const conference = this.props.conference;
const { conference } = this.props;
// we received that password is required, but user is trying
// anyway to login without a password, mark room as not
// locked in case he succeeds (maybe someone removed the
// password meanwhile), if it is still locked another
// password required will be received and the room again
// will be marked as locked.
// We received that password is required, but user is trying anyway to
// login without a password. Mark the room as not locked in case she
// succeeds (maybe someone removed the password meanwhile). If it is
// still locked, another password required will be received and the room
// again will be marked as locked.
if (!this.state.password || this.state.password === '') {
// XXX temporary solution while some components are not listening
// for lock state updates in redux
// XXX Temporary solution while some components are not listening
// for lock state updates in redux.
APP.UI.emitEvent(UIEvents.TOGGLE_ROOM_LOCK, false);
}
this.props.dispatch(setPassword(
conference, conference.join, this.state.password));
this.props.dispatch(
setPassword(conference, conference.join, this.state.password));
// we have used the password lets clean it
this.setState({ password: undefined });
// We have used the password so let's clean it.
this.setState({
password: undefined
});
return true;
}

7
react/features/room-lock/constants.js
View File

@ -1,12 +1,15 @@
/**
* The room lock state where the password was set by the current user.
* The conference/room lock state which identifies that the password was set by
* the current/local participant/user.
*
* @type {string}
*/
export const LOCKED_LOCALLY = 'LOCKED_LOCALLY';
/**
* The room lock state where the password was set by a remote user.
* The conference/room lock state which identifies that the password was set by
* a remote participant/user.
*
* @type {string}
*/
export const LOCKED_REMOTELY = 'LOCKED_REMOTELY';

51
react/features/room-lock/middleware.js
View File

@ -1,5 +1,4 @@
/* global APP */
const logger = require('jitsi-meet-logger').getLogger(__filename);
import UIEvents from '../../../service/UI/UIEvents';
@ -8,11 +7,13 @@ import {
LOCK_STATE_CHANGED,
SET_PASSWORD_FAILED
} from '../base/conference';
import JitsiMeetJS from '../base/lib-jitsi-meet';
import { JitsiConferenceErrors } from '../base/lib-jitsi-meet';
import { MiddlewareRegistry } from '../base/redux';
import { _showPasswordDialog } from './actions';
const logger = require('jitsi-meet-logger').getLogger(__filename);
/**
* Middleware that captures conference failed and checks for password required
* error and requests a dialog for user to enter password.
@ -21,41 +22,39 @@ import { _showPasswordDialog } from './actions';
* @returns {Function}
*/
MiddlewareRegistry.register(store => next => action => {
switch (action.type) {
case CONFERENCE_FAILED: {
const JitsiConferenceErrors = JitsiMeetJS.errors.conference;
const { conference, error } = action;
if (action.conference
&& JitsiConferenceErrors.PASSWORD_REQUIRED === action.error) {
// XXX temporary solution while some components are not listening
// for lock state updates in redux
if (conference && error === JitsiConferenceErrors.PASSWORD_REQUIRED) {
// XXX Temporary solution while some components are not listening
// for lock state updates in redux.
if (typeof APP !== 'undefined') {
APP.UI.emitEvent(UIEvents.TOGGLE_ROOM_LOCK, true);
}
store.dispatch(_showPasswordDialog(action.conference));
store.dispatch(_showPasswordDialog(conference));
}
break;
}
case LOCK_STATE_CHANGED: {
case LOCK_STATE_CHANGED:
// TODO Remove this logic when all components interested in the lock
// state change event are moved into react/redux.
if (typeof APP !== 'undefined') {
APP.UI.emitEvent(UIEvents.TOGGLE_ROOM_LOCK, action.locked);
}
break;
}
case SET_PASSWORD_FAILED:
return _notifySetPasswordError(store, next, action);
return _setPasswordFailed(store, next, action);
}
return next(action);
});
/**
* Handles errors that occur when a password is failed to be set.
* Handles errors that occur when a password fails to be set.
*
* @param {Store} store - The Redux store in which the specified action is being
* dispatched.
@ -67,20 +66,24 @@ MiddlewareRegistry.register(store => next => action => {
* @returns {Object} The new state that is the result of the reduction of the
* specified action.
*/
function _notifySetPasswordError(store, next, action) {
function _setPasswordFailed(store, next, action) {
if (typeof APP !== 'undefined') {
// TODO remove this logic when displaying of error messages on web is
// handled through react/redux
if (action.error
=== JitsiMeetJS.errors.conference.PASSWORD_NOT_SUPPORTED) {
// TODO Remove this logic when displaying of error messages on web is
// handled through react/redux.
const { error } = action;
let title;
let message;
if (error === JitsiConferenceErrors.PASSWORD_NOT_SUPPORTED) {
logger.warn('room passwords not supported');
APP.UI.messageHandler.showError(
'dialog.warning', 'dialog.passwordNotSupported');
title = 'dialog.warning';
message = 'dialog.passwordNotSupported';
} else {
logger.warn('setting password failed', action.error);
APP.UI.messageHandler.showError(
'dialog.lockTitle', 'dialog.lockMessage');
logger.warn('setting password failed', error);
title = 'dialog.lockTitle';
message = 'dialog.lockMessage';
}
APP.UI.messageHandler.showError(title, message);
}
return next(action);