From 240fff74c71a9eab7acc0b321f24767fce3fb893 Mon Sep 17 00:00:00 2001 From: Lyubo Marinov Date: Mon, 12 Feb 2018 11:42:38 -0600 Subject: [PATCH] [RN] Add ability to enable / disable the filmstrip (Coding style: comments, naming) --- .../components/Conference.native.js | 4 ++-- .../conference/components/Conference.web.js | 18 +++++++-------- react/features/filmstrip/actionTypes.js | 5 ++-- react/features/filmstrip/actions.js | 21 +++++++++-------- .../filmstrip/components/Filmstrip.native.js | 15 ++++++------ react/features/filmstrip/reducer.js | 23 +++++++++++++++++++ 6 files changed, 54 insertions(+), 32 deletions(-) diff --git a/react/features/conference/components/Conference.native.js b/react/features/conference/components/Conference.native.js index 049b5aa0b..a73f140c0 100644 --- a/react/features/conference/components/Conference.native.js +++ b/react/features/conference/components/Conference.native.js @@ -355,9 +355,9 @@ function _mapDispatchToProps(dispatch) { } /** - * Maps (parts of) the Redux state to the associated Conference's props. + * Maps (parts of) the redux state to the associated {@code Conference}'s props. * - * @param {Object} state - The Redux state. + * @param {Object} state - The redux state. * @private * @returns {{ * _connecting: boolean, diff --git a/react/features/conference/components/Conference.web.js b/react/features/conference/components/Conference.web.js index 5df2d6801..0ecbbcc5e 100644 --- a/react/features/conference/components/Conference.web.js +++ b/react/features/conference/components/Conference.web.js @@ -25,9 +25,9 @@ declare var interfaceConfig: Object; type Props = { /** - * Whether or not the current local user is recording the conference. + * Whether the local participant is recording the conference. */ - _isRecording: boolean, + _iAmRecorder: boolean, dispatch: Function, t: Function @@ -102,9 +102,10 @@ class Conference extends Component { */ render() { const { filmStripOnly, VIDEO_QUALITY_LABEL_DISABLED } = interfaceConfig; - const hideVideoQualityLabel = filmStripOnly - || VIDEO_QUALITY_LABEL_DISABLED - || this.props._isRecording; + const hideVideoQualityLabel + = filmStripOnly + || VIDEO_QUALITY_LABEL_DISABLED + || this.props._iAmRecorder; return (
{ * @param {Object} state - The Redux state. * @private * @returns {{ - * _isRecording: boolean + * _iAmRecorder: boolean * }} */ function _mapStateToProps(state) { return { /** - * Indicates if the current user is recording the conference, ie, they - * are a recorder. + * Whether the local participant is recording the conference. * * @private */ - _isRecording: state['features/base/config'].iAmRecorder + _iAmRecorder: state['features/base/config'].iAmRecorder }; } diff --git a/react/features/filmstrip/actionTypes.js b/react/features/filmstrip/actionTypes.js index cd4209765..ad3b98ca5 100644 --- a/react/features/filmstrip/actionTypes.js +++ b/react/features/filmstrip/actionTypes.js @@ -1,6 +1,5 @@ /** - * The type of (redux) action which sets whether the filmstrip is enabled or - * not. + * The type of (redux) action which sets whether the filmstrip is enabled. * * { * type: SET_FILMSTRIP_ENABLED, @@ -21,7 +20,7 @@ export const SET_FILMSTRIP_ENABLED = Symbol('SET_FILMSTRIP_ENABLED'); export const SET_FILMSTRIP_HOVERED = Symbol('SET_FILMSTRIP_HOVERED'); /** - * The type of (redux) action which sets the visibility of the filmstrip. + * The type of (redux) action which sets whether the filmstrip is visible. * * { * type: SET_FILMSTRIP_VISIBLE, diff --git a/react/features/filmstrip/actions.js b/react/features/filmstrip/actions.js index 9b758079c..0276b2853 100644 --- a/react/features/filmstrip/actions.js +++ b/react/features/filmstrip/actions.js @@ -1,3 +1,5 @@ +// @flow + import { SET_FILMSTRIP_ENABLED, SET_FILMSTRIP_HOVERED, @@ -5,15 +7,15 @@ import { } from './actionTypes'; /** - * Sets if the filmstrip should be enabled. + * Sets whether the filmstrip is enabled. * - * @param {boolean} enabled - Whether the filmstrip should be enabled. + * @param {boolean} enabled - Whether the filmstrip is enabled. * @returns {{ * type: SET_FILMSTRIP_ENABLED, * enabled: boolean * }} */ -export function setFilmstripEnabled(enabled) { +export function setFilmstripEnabled(enabled: boolean) { return { type: SET_FILMSTRIP_ENABLED, enabled @@ -21,16 +23,15 @@ export function setFilmstripEnabled(enabled) { } /** - * Sets if the filmstrip is currently being hovered over. + * Sets whether the filmstrip is being hovered (over). * - * @param {boolean} hovered - Whether or not the filmstrip is currently being - * hovered over. + * @param {boolean} hovered - Whether the filmstrip is being hovered (over). * @returns {{ * type: SET_FILMSTRIP_HOVERED, * hovered: boolean * }} */ -export function setFilmstripHovered(hovered) { +export function setFilmstripHovered(hovered: boolean) { return { type: SET_FILMSTRIP_HOVERED, hovered @@ -38,15 +39,15 @@ export function setFilmstripHovered(hovered) { } /** - * Sets if the filmstrip should be visible. + * Sets whether the filmstrip is visible. * - * @param {boolean} visible - Whether the filmstrip should be visible. + * @param {boolean} visible - Whether the filmstrip is visible. * @returns {{ * type: SET_FILMSTRIP_VISIBLE, * visible: boolean * }} */ -export function setFilmstripVisible(visible) { +export function setFilmstripVisible(visible: boolean) { return { type: SET_FILMSTRIP_VISIBLE, visible diff --git a/react/features/filmstrip/components/Filmstrip.native.js b/react/features/filmstrip/components/Filmstrip.native.js index fc1128ffb..ee27c4f4f 100644 --- a/react/features/filmstrip/components/Filmstrip.native.js +++ b/react/features/filmstrip/components/Filmstrip.native.js @@ -10,7 +10,7 @@ import { makeAspectRatioAware } from '../../base/responsive-ui'; -import { styles } from './_'; +import styles from './styles'; import Thumbnail from './Thumbnail'; /** @@ -63,14 +63,11 @@ class Filmstrip extends Component { = isNarrowAspectRatio_ ? styles.filmstripNarrow : styles.filmstripWide; - const { - _participants: participants, - _visible: visible } = this.props; return ( + visible = { this.props._visible }> { { /* eslint-disable react/jsx-wrap-multilines */ - this._sort(participants, isNarrowAspectRatio_) + this._sort( + this.props._participants, + isNarrowAspectRatio_) .map(p => { } /** - * Function that maps parts of Redux state tree into component props. + * Maps (parts of) the redux state to the associated {@code Filmstrip}'s props. * - * @param {Object} state - Redux state. + * @param {Object} state - The redux state. * @private * @returns {{ * _participants: Participant[], diff --git a/react/features/filmstrip/reducer.js b/react/features/filmstrip/reducer.js index c5dd3c847..7e4cc11ce 100644 --- a/react/features/filmstrip/reducer.js +++ b/react/features/filmstrip/reducer.js @@ -1,3 +1,5 @@ +// @flow + import { ReducerRegistry } from '../base/redux'; import { @@ -7,7 +9,20 @@ import { } from './actionTypes'; const DEFAULT_STATE = { + /** + * The indicator which determines whether the {@link Filmstrip} is enabled. + * + * @public + * @type {boolean} + */ enabled: true, + + /** + * The indicator which determines whether the {@link Filmstrip} is visible. + * + * @public + * @type {boolean} + */ visible: true }; @@ -24,6 +39,14 @@ ReducerRegistry.register( case SET_FILMSTRIP_HOVERED: return { ...state, + + /** + * The indicator which determines whether the {@link Filmstrip} + * is being hovered (over). + * + * @public + * @type {boolean} + */ hovered: action.hovered };