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

ref(DeviceSelectionPopup): remove.

This commit is contained in:
Hristo Terezov 2021-02-02 13:41:04 -06:00
parent a6c6cd6c56
commit 7dc899ace1
11 changed files with 1 additions and 476 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
Makefile
View File

@ -42,8 +42,6 @@ deploy-appbundle:
$(BUILD_DIR)/external_api.min.map \
$(BUILD_DIR)/flacEncodeWorker.min.js \
$(BUILD_DIR)/flacEncodeWorker.min.map \
$(BUILD_DIR)/device_selection_popup_bundle.min.js \
$(BUILD_DIR)/device_selection_popup_bundle.min.map \
$(BUILD_DIR)/dial_in_info_bundle.min.js \
$(BUILD_DIR)/dial_in_info_bundle.min.map \
$(BUILD_DIR)/alwaysontop.min.js \

1
react/features/app/reducers.any.js
View File

@ -29,7 +29,6 @@ import '../blur/reducer';
import '../calendar-sync/reducer';
import '../chat/reducer';
import '../deep-linking/reducer';
import '../device-selection/reducer';
import '../dropbox/reducer';
import '../dynamic-branding/reducer';
import '../etherpad/reducer';

10
react/features/device-selection/actionTypes.js
View File

@ -1,10 +0,0 @@
/**
* The type of Redux action which Sets information about device selection popup.
*
* {{
* type: SET_DEVICE_SELECTION_POPUP_DATA,
* popupDialogData: Object
* }}
*/
export const SET_DEVICE_SELECTION_POPUP_DATA
= 'SET_DEVICE_SELECTION_POPUP_DATA';

89
react/features/device-selection/actions.js
View File

@ -1,8 +1,3 @@
import { API_ID } from '../../../modules/API/constants';
import {
PostMessageTransportBackend,
Transport
} from '../../../modules/transport';
import { createDeviceChangedEvent, sendAnalytics } from '../analytics';
import {
getDeviceLabelById,
@ -10,93 +5,11 @@ import {
setAudioOutputDeviceId,
setVideoInputDevice
} from '../base/devices';
import { i18next } from '../base/i18n';
import { updateSettings } from '../base/settings';
import { SET_DEVICE_SELECTION_POPUP_DATA } from './actionTypes';
import { getDeviceSelectionDialogProps, processExternalDeviceRequest } from './functions';
import { getDeviceSelectionDialogProps } from './functions';
import logger from './logger';
/**
* Opens a popup window with the device selection dialog in it.
*
* @returns {Function}
*/
export function openDeviceSelectionPopup() {
return (dispatch, getState) => {
const { popupDialogData } = getState()['features/device-selection'];
if (popupDialogData) {
popupDialogData.popup.focus();
return;
}
// API_ID will always be defined because the iframe api is enabled
const scope = `dialog_${API_ID}`;
const url = `${
window.location.origin}/static/deviceSelectionPopup.html#scope=${
encodeURIComponent(JSON.stringify(scope))}`;
const popup
= window.open(
url,
'device-selection-popup',
'toolbar=no,scrollbars=no,resizable=no,width=720,height=458');
popup.addEventListener('DOMContentLoaded', () => {
popup.init(i18next);
});
const transport = new Transport({
backend: new PostMessageTransportBackend({
postisOptions: {
scope,
window: popup
}
})
});
transport.on('request',
processExternalDeviceRequest.bind(undefined, dispatch, getState));
transport.on('event', event => {
if (event.type === 'devices-dialog' && event.name === 'close') {
popup.close();
transport.dispose();
dispatch(_setDeviceSelectionPopupData());
return true;
}
return false;
});
dispatch(_setDeviceSelectionPopupData({
popup,
transport
}));
};
}
/**
* Sets information about device selection popup in the store.
*
* @param {Object} popupDialogData - Information about the popup.
* @param {Object} popupDialog.popup - The popup object returned from
* window.open.
* @param {Object} popupDialogData.transport - The transport instance used for
* communication with the popup window.
* @returns {{
* type: SET_DEVICE_SELECTION_POPUP_DATA,
* popupDialogData: Object
* }}
*/
function _setDeviceSelectionPopupData(popupDialogData) {
return {
type: SET_DEVICE_SELECTION_POPUP_DATA,
popupDialogData
};
}
/**
* Submits the settings related to device selection.
*

1
react/features/device-selection/index.js
View File

@ -1,4 +1,3 @@
export * from './actions';
export * from './actionTypes';
export * from './components';
export * from './functions';

8
react/features/device-selection/middleware.js
View File

@ -17,16 +17,8 @@ MiddlewareRegistry.register(store => next => action => {
if (action.type === UPDATE_DEVICE_LIST) {
const state = store.getState();
const { popupDialogData } = state['features/device-selection'];
const { availableDevices } = state['features/base/devices'] || {};
if (popupDialogData) {
popupDialogData.transport.sendEvent({
name: 'deviceListChanged',
devices: availableDevices
});
}
if (typeof APP !== 'undefined') {
APP.API.notifyDeviceListChanged(availableDevices);
}

28
react/features/device-selection/reducer.js
View File

@ -1,28 +0,0 @@
import { ReducerRegistry } from '../base/redux';
import { SET_DEVICE_SELECTION_POPUP_DATA } from './actionTypes';
/**
* Listen for actions which changes the state of the popup window for the device
* selection.
*
* @param {Object} state - The Redux state of the feature
* features/device-selection.
* @param {Object} action - Action object.
* @param {string} action.type - Type of action.
* @param {Object} action.popupDialogData - Object that stores the current
* Window object of the popup and the Transport instance. If no popup is shown
* the value will be undefined.
* @returns {Object}
*/
ReducerRegistry.register('features/device-selection',
(state = {}, action) => {
if (action.type === SET_DEVICE_SELECTION_POPUP_DATA) {
return {
...state,
popupDialogData: action.popupDialogData
};
}
return state;
});

299
react/features/settings/components/web/DeviceSelectionPopup.js
View File

@ -1,299 +0,0 @@
/* global JitsiMeetJS */
import { AtlasKitThemeProvider } from '@atlaskit/theme';
import React from 'react';
import ReactDOM from 'react-dom';
import { I18nextProvider } from 'react-i18next';
import {
getAvailableDevices,
getCurrentDevices,
isDeviceChangeAvailable,
isDeviceListAvailable,
isMultipleAudioInputSupported,
setAudioInputDevice,
setAudioOutputDevice,
setVideoInputDevice
} from '../../../../../modules/API/external/functions';
import {
PostMessageTransportBackend,
Transport
} from '../../../../../modules/transport';
import DialogWithTabs from '../../../base/dialog/components/web/DialogWithTabs';
import { parseURLParams } from '../../../base/util/parseURLParams';
import DeviceSelection from '../../../device-selection/components/DeviceSelection';
/**
* Implements a class that renders the React components for the device selection
* popup page and handles the communication between the components and Jitsi
* Meet.
*/
export default class DeviceSelectionPopup {
/**
* Initializes a new DeviceSelectionPopup instance.
*
* @param {Object} i18next - The i18next instance used for translation.
*/
constructor(i18next) {
this.close = this.close.bind(this);
this._i18next = i18next;
this._onSubmit = this._onSubmit.bind(this);
const { scope } = parseURLParams(window.location);
this._transport = new Transport({
backend: new PostMessageTransportBackend({
postisOptions: {
scope,
window: window.opener
}
})
});
this._transport.on('event', event => {
if (event.name === 'deviceListChanged') {
this._updateAvailableDevices();
return true;
}
return false;
});
this._dialogProps = {
availableDevices: {},
selectedAudioInputId: '',
selectedAudioOutputId: '',
selectedVideoInputId: '',
disableAudioInputChange: true,
disableBlanketClickDismiss: true,
disableDeviceChange: true,
hideAudioInputPreview: !JitsiMeetJS.isCollectingLocalStats(),
hideAudioOutputSelect: true
};
this._initState();
}
/**
* Sends event to Jitsi Meet to close the popup dialog.
*
* @returns {void}
*/
close() {
this._transport.sendEvent({
type: 'devices-dialog',
name: 'close'
});
}
/**
* Changes the properties of the react component and re-renders it.
*
* @param {Object} newProps - The new properties that will be assigned to
* the current ones.
* @returns {void}
*/
_changeDialogProps(newProps) {
this._dialogProps = {
...this._dialogProps,
...newProps
};
this._render();
}
/**
* Returns Promise that resolves with result an list of available devices.
*
* @returns {Promise}
*/
_getAvailableDevices() {
return getAvailableDevices(this._transport);
}
/**
* Returns Promise that resolves with current selected devices.
*
* @returns {Promise}
*/
_getCurrentDevices() {
return getCurrentDevices(this._transport).then(currentDevices => {
const {
audioInput = {},
audioOutput = {},
videoInput = {}
} = currentDevices;
return {
audioInput: audioInput.deviceId,
audioOutput: audioOutput.deviceId,
videoInput: videoInput.deviceId
};
});
}
/**
* Initializes the state.
*
* @returns {void}
*/
_initState() {
return Promise.all([
this._getAvailableDevices(),
this._isDeviceListAvailable(),
this._isDeviceChangeAvailable(),
this._isDeviceChangeAvailable('output'),
this._getCurrentDevices(),
this._isMultipleAudioInputSupported()
]).then(([
availableDevices,
listAvailable,
changeAvailable,
changeOutputAvailable,
currentDevices,
multiAudioInputSupported
]) => {
this._changeDialogProps({
availableDevices,
selectedAudioInputId: currentDevices.audioInput,
selectedAudioOutputId: currentDevices.audioOutput,
selectedVideoInputId: currentDevices.videoInput,
disableAudioInputChange: !multiAudioInputSupported,
disableDeviceChange: !listAvailable || !changeAvailable,
hideAudioOutputSelect: !changeOutputAvailable
});
});
}
/**
* Returns Promise that resolves with true if the device change is available
* and with false if not.
*
* @param {string} [deviceType] - Values - 'output', 'input' or undefined.
* Default - 'input'.
* @returns {Promise}
*/
_isDeviceChangeAvailable(deviceType) {
return isDeviceChangeAvailable(this._transport, deviceType).catch(() => false);
}
/**
* Returns Promise that resolves with true if the device list is available
* and with false if not.
*
* @returns {Promise}
*/
_isDeviceListAvailable() {
return isDeviceListAvailable(this._transport).catch(() => false);
}
/**
* Returns Promise that resolves with true if multiple audio input is supported
* and with false if not.
*
* @returns {Promise}
*/
_isMultipleAudioInputSupported() {
return isMultipleAudioInputSupported(this._transport).catch(() => false);
}
/**
* Callback invoked to save changes to selected devices and close the
* dialog.
*
* @param {Object} newSettings - The chosen device IDs.
* @private
* @returns {void}
*/
_onSubmit(newSettings) {
const promises = [];
if (newSettings.selectedVideoInputId
!== this._dialogProps.selectedVideoInputId) {
promises.push(
this._setVideoInputDevice(newSettings.selectedVideoInputId));
}
if (newSettings.selectedAudioInputId
!== this._dialogProps.selectedAudioInputId) {
promises.push(
this._setAudioInputDevice(newSettings.selectedAudioInputId));
}
if (newSettings.selectedAudioOutputId
!== this._dialogProps.selectedAudioOutputId) {
promises.push(
this._setAudioOutputDevice(newSettings.selectedAudioOutputId));
}
Promise.all(promises).then(this.close, this.close);
}
/**
* Renders the React components for the popup page.
*
* @returns {void}
*/
_render() {
const onSubmit = this.close;
ReactDOM.render(
<I18nextProvider i18n = { this._i18next }>
<AtlasKitThemeProvider mode = 'dark'>
<DialogWithTabs
closeDialog = { this.close }
cssClassName = 'settings-dialog'
onSubmit = { onSubmit }
tabs = { [ {
component: DeviceSelection,
label: 'settings.devices',
props: this._dialogProps,
submit: this._onSubmit
} ] }
titleKey = 'settings.title' />
</AtlasKitThemeProvider>
</I18nextProvider>,
document.getElementById('react'));
}
/**
* Sets the audio input device to the one with the id that is passed.
*
* @param {string} id - The id of the new device.
* @returns {Promise}
*/
_setAudioInputDevice(id) {
return setAudioInputDevice(this._transport, undefined, id);
}
/**
* Sets the audio output device to the one with the id that is passed.
*
* @param {string} id - The id of the new device.
* @returns {Promise}
*/
_setAudioOutputDevice(id) {
return setAudioOutputDevice(this._transport, undefined, id);
}
/**
* Sets the video input device to the one with the id that is passed.
*
* @param {string} id - The id of the new device.
* @returns {Promise}
*/
_setVideoInputDevice(id) {
return setVideoInputDevice(this._transport, undefined, id);
}
/**
* Updates the available devices.
*
* @returns {void}
*/
_updateAvailableDevices() {
this._getAvailableDevices().then(devices =>
this._changeDialogProps({ availableDevices: devices })
);
}
}

12
react/features/settings/popup.js
View File

@ -1,12 +0,0 @@
/* global JitsiMeetJS */
import DeviceSelectionPopup from './components/web/DeviceSelectionPopup';
let deviceSelectionPopup;
window.init = i18next => {
JitsiMeetJS.init();
deviceSelectionPopup = new DeviceSelectionPopup(i18next);
};
window.addEventListener('beforeunload', () => deviceSelectionPopup.close());

21
static/deviceSelectionPopup.html
View File

@ -1,21 +0,0 @@
<html itemscope itemtype="http://schema.org/Product" prefix="og: http://ogp.me/ns#" xmlns="http://www.w3.org/1999/html">
<head>
<meta charset="utf-8">
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--#include virtual="/base.html" -->
<link rel="stylesheet" href="css/all.css">
<!--#include virtual="/title.html" -->
<script><!--#include virtual="/interface_config.js" --></script>
<script>
window.config = {};
</script>
<script src="libs/lib-jitsi-meet.min.js?v=139"></script>
<script src="libs/device_selection_popup_bundle.min.js?v=1"></script>
</head>
<body>
<div id="react"></div>
</body>
</html>

6
webpack.config.js
View File

@ -196,12 +196,6 @@ module.exports = [
},
performance: getPerformanceHints(4 * 1024 * 1024)
}),
Object.assign({}, config, {
entry: {
'device_selection_popup_bundle': './react/features/settings/popup.js'
},
performance: getPerformanceHints(750 * 1024)
}),
Object.assign({}, config, {
entry: {
'alwaysontop': './react/features/always-on-top/index.js'