From 98698ba89accac8fa707095cbc5020199012686c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Sa=C3=BAl=20Ibarra=20Corretg=C3=A9?= Date: Tue, 8 Oct 2019 14:27:35 +0200 Subject: [PATCH] etherpad: refactor to share code with mobile - simplify initialization procedure - set user display name as the Etherpad name\ - use SharedDocumentButton --- modules/UI/UI.js | 10 ++-- modules/UI/etherpad/Etherpad.js | 26 ++------ react/features/etherpad/actionTypes.js | 10 ---- react/features/etherpad/actions.js | 14 ----- react/features/etherpad/reducer.js | 22 +------ .../toolbox/components/web/Toolbox.js | 59 +------------------ 6 files changed, 16 insertions(+), 125 deletions(-) diff --git a/modules/UI/UI.js b/modules/UI/UI.js index 97cdb8d97..893969b4a 100644 --- a/modules/UI/UI.js +++ b/modules/UI/UI.js @@ -15,7 +15,7 @@ import Filmstrip from './videolayout/Filmstrip'; import { getLocalParticipant } from '../../react/features/base/participants'; import { toggleChat } from '../../react/features/chat'; -import { setEtherpadHasInitialzied } from '../../react/features/etherpad'; +import { setDocumentUrl } from '../../react/features/etherpad'; import { setFilmstripVisible } from '../../react/features/filmstrip'; import { setNotificationsEnabled } from '../../react/features/notifications'; import { @@ -240,10 +240,12 @@ UI.initEtherpad = name => { return; } logger.log('Etherpad is enabled'); - etherpadManager - = new EtherpadManager(config.etherpad_base, name, eventEmitter); - APP.store.dispatch(setEtherpadHasInitialzied()); + etherpadManager = new EtherpadManager(eventEmitter); + + const url = new URL(name, config.etherpad_base); + + APP.store.dispatch(setDocumentUrl(url.toString())); }; /** diff --git a/modules/UI/etherpad/Etherpad.js b/modules/UI/etherpad/Etherpad.js index 71577b05b..325e3249d 100644 --- a/modules/UI/etherpad/Etherpad.js +++ b/modules/UI/etherpad/Etherpad.js @@ -1,22 +1,12 @@ /* global $, APP, interfaceConfig */ -import { setDocumentEditingState } from '../../../react/features/etherpad'; +import { getSharedDocumentUrl, setDocumentEditingState } from '../../../react/features/etherpad'; import { getToolboxHeight } from '../../../react/features/toolbox'; import VideoLayout from '../videolayout/VideoLayout'; import LargeContainer from '../videolayout/LargeContainer'; import Filmstrip from '../videolayout/Filmstrip'; -/** - * Etherpad options. - */ -const options = $.param({ - showControls: true, - showChat: false, - showLineNumbers: true, - useMonospaceFont: false -}); - /** * */ @@ -70,13 +60,13 @@ class Etherpad extends LargeContainer { /** * Creates new Etherpad object */ - constructor(domain, name) { + constructor(url) { super(); const iframe = document.createElement('iframe'); iframe.id = 'etherpadIFrame'; - iframe.src = `${domain + name}?${options}`; + iframe.src = url; iframe.frameBorder = 0; iframe.scrolling = 'no'; iframe.width = DEFAULT_WIDTH; @@ -199,13 +189,7 @@ export default class EtherpadManager { /** * */ - constructor(domain, name, eventEmitter) { - if (!domain || !name) { - throw new Error('missing domain or name'); - } - - this.domain = domain; - this.name = name; + constructor(eventEmitter) { this.eventEmitter = eventEmitter; this.etherpad = null; } @@ -228,7 +212,7 @@ export default class EtherpadManager { * Create new Etherpad frame. */ openEtherpad() { - this.etherpad = new Etherpad(this.domain, this.name); + this.etherpad = new Etherpad(getSharedDocumentUrl(APP.store.getState)); VideoLayout.addLargeVideoContainer( ETHERPAD_CONTAINER_TYPE, this.etherpad diff --git a/react/features/etherpad/actionTypes.js b/react/features/etherpad/actionTypes.js index 1ff61bc1c..74d4f48f8 100644 --- a/react/features/etherpad/actionTypes.js +++ b/react/features/etherpad/actionTypes.js @@ -1,13 +1,3 @@ -/** - * The type of the action which signals document editing has been enabled. - * - * { - * type: ETHERPAD_INITIALIZED - * } - */ -export const ETHERPAD_INITIALIZED = 'ETHERPAD_INITIALIZED'; - - /** * The type of the action which signals document editing has stopped or started. * diff --git a/react/features/etherpad/actions.js b/react/features/etherpad/actions.js index 189b49b0c..b5a737039 100644 --- a/react/features/etherpad/actions.js +++ b/react/features/etherpad/actions.js @@ -1,7 +1,6 @@ // @flow import { - ETHERPAD_INITIALIZED, SET_DOCUMENT_EDITING_STATUS, SET_DOCUMENT_URL, TOGGLE_DOCUMENT_EDITING @@ -40,19 +39,6 @@ export function setDocumentUrl(documentUrl: ?string) { }; } -/** - * Dispatches an action to set Etherpad as having been initialized. - * - * @returns {{ - * type: ETHERPAD_INITIALIZED - * }} - */ -export function setEtherpadHasInitialzied() { - return { - type: ETHERPAD_INITIALIZED - }; -} - /** * Dispatches an action to show or hide Etherpad. * diff --git a/react/features/etherpad/reducer.js b/react/features/etherpad/reducer.js index ff7671397..e9bacb9c1 100644 --- a/react/features/etherpad/reducer.js +++ b/react/features/etherpad/reducer.js @@ -2,11 +2,7 @@ import { ReducerRegistry } from '../base/redux'; -import { - ETHERPAD_INITIALIZED, - SET_DOCUMENT_EDITING_STATUS, - SET_DOCUMENT_URL -} from './actionTypes'; +import { SET_DOCUMENT_EDITING_STATUS, SET_DOCUMENT_URL } from './actionTypes'; const DEFAULT_STATE = { @@ -21,15 +17,7 @@ const DEFAULT_STATE = { * @public * @type {boolean} */ - editing: false, - - /** - * Whether or not Etherpad is ready to use. - * - * @public - * @type {boolean} - */ - initialized: false + editing: false }; /** @@ -39,12 +27,6 @@ ReducerRegistry.register( 'features/etherpad', (state = DEFAULT_STATE, action) => { switch (action.type) { - case ETHERPAD_INITIALIZED: - return { - ...state, - initialized: true - }; - case SET_DOCUMENT_EDITING_STATUS: return { ...state, diff --git a/react/features/toolbox/components/web/Toolbox.js b/react/features/toolbox/components/web/Toolbox.js index 929bdd0d6..a2f4bfd71 100644 --- a/react/features/toolbox/components/web/Toolbox.js +++ b/react/features/toolbox/components/web/Toolbox.js @@ -21,7 +21,6 @@ import { IconRaisedHand, IconRec, IconShareDesktop, - IconShareDoc, IconShareVideo } from '../../../base/icons'; import { @@ -34,7 +33,7 @@ import { OverflowMenuItem } from '../../../base/toolbox'; import { getLocalVideoTrack, toggleScreensharing } from '../../../base/tracks'; import { VideoBlurButton } from '../../../blur'; import { ChatCounter, toggleChat } from '../../../chat'; -import { toggleDocument } from '../../../etherpad'; +import { SharedDocumentButton } from '../../../etherpad'; import { openFeedbackDialog } from '../../../feedback'; import { beginAddPeople, @@ -111,16 +110,6 @@ type Props = { */ _dialog: boolean, - /** - * Whether or not the local participant is currently editing a document. - */ - _editingDocument: boolean, - - /** - * Whether or not collaborative document editing is enabled. - */ - _etherpadInitialized: boolean, - /** * Whether or not call feedback can be sent. */ @@ -247,8 +236,6 @@ class Toolbox extends Component { this._onToolbarOpenVideoQuality = this._onToolbarOpenVideoQuality.bind(this); this._onToolbarToggleChat = this._onToolbarToggleChat.bind(this); - this._onToolbarToggleEtherpad - = this._onToolbarToggleEtherpad.bind(this); this._onToolbarToggleFullScreen = this._onToolbarToggleFullScreen.bind(this); this._onToolbarToggleProfile @@ -424,16 +411,6 @@ class Toolbox extends Component { this.props.dispatch(toggleChat()); } - /** - * Dispatches an action to show or hide document editing. - * - * @private - * @returns {void} - */ - _doToggleEtherpad() { - this.props.dispatch(toggleDocument()); - } - /** * Dispatches an action to toggle screensharing. * @@ -749,25 +726,6 @@ class Toolbox extends Component { this._doToggleChat(); } - _onToolbarToggleEtherpad: () => void; - - /** - * Creates an analytics toolbar event and dispatches an action for toggling - * the display of document editing. - * - * @private - * @returns {void} - */ - _onToolbarToggleEtherpad() { - sendAnalytics(createToolbarEvent( - 'toggle.etherpad', - { - enable: !this.props._editingDocument - })); - - this._doToggleEtherpad(); - } - _onToolbarToggleFullScreen: () => void; /** @@ -960,8 +918,6 @@ class Toolbox extends Component { */ _renderOverflowMenuContent() { const { - _editingDocument, - _etherpadInitialized, _feedbackConfigured, _fullScreen, _screensharing, @@ -1007,16 +963,9 @@ class Toolbox extends Component { ? t('toolbar.stopSharedVideo') : t('toolbar.sharedvideo') } />, this._shouldShowButton('etherpad') - && _etherpadInitialized - && , + showLabel = { true } />,