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

feat: more user friendly default device label 

Also fixes an issue where starting Chrome 90 air pods
no longer have the "Default -" prefix and the default
entry looks like a buggy duplicated one.
This commit is contained in:
Pawel Domas 2021-05-14 16:37:48 -05:00 committed by Paweł Domas
parent e33674fb2e
commit 6f5e0b0321
2 changed files with 25 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
lang/main.json
View File

@ -674,6 +674,7 @@
"more": "More", "more": "More",
"name": "Name", "name": "Name",
"noDevice": "None", "noDevice": "None",
"sameAsSystem": "Same as system ({{label}})",
"selectAudioOutput": "Audio output", "selectAudioOutput": "Audio output",
"selectCamera": "Camera", "selectCamera": "Camera",
"selectMic": "Microphone", "selectMic": "Microphone",

30
react/features/settings/components/web/audio/AudioSettingsContent.js
View File

@ -14,6 +14,20 @@ import SpeakerEntry from './SpeakerEntry';
const browser = JitsiMeetJS.util.browser; const browser = JitsiMeetJS.util.browser;
/**
* Translates the default device label into a more user friendly one.
*
* @param {string} deviceId - The device Id.
* @param {string} label - The device label.
* @param {Function} t - The translation function.
* @returns {string}
*/
function transformDefaultDeviceLabel(deviceId, label, t) {
return deviceId === 'default'
? t('settings.sameAsSystem', { label: label.replace('Default - ', '') })
: label;
}
export type Props = { export type Props = {
/** /**
@ -125,10 +139,12 @@ class AudioSettingsContent extends Component<Props, State> {
* *
* @param {Object} data - An object with the deviceId, jitsiTrack & label of the microphone. * @param {Object} data - An object with the deviceId, jitsiTrack & label of the microphone.
* @param {number} index - The index of the element, used for creating a key. * @param {number} index - The index of the element, used for creating a key.
* @param {Function} t - The translation function.
* @returns {React$Node} * @returns {React$Node}
*/ */
_renderMicrophoneEntry(data, index) { _renderMicrophoneEntry(data, index, t) {
const { deviceId, label, jitsiTrack, hasError } = data; const { deviceId, jitsiTrack, hasError } = data;
const label = transformDefaultDeviceLabel(deviceId, data.label, t);
const isSelected = deviceId === this.props.currentMicDeviceId; const isSelected = deviceId === this.props.currentMicDeviceId;
return ( return (
@ -149,10 +165,12 @@ class AudioSettingsContent extends Component<Props, State> {
* *
* @param {Object} data - An object with the deviceId and label of the speaker. * @param {Object} data - An object with the deviceId and label of the speaker.
* @param {number} index - The index of the element, used for creating a key. * @param {number} index - The index of the element, used for creating a key.
* @param {Function} t - The translation function.
* @returns {React$Node} * @returns {React$Node}
*/ */
_renderSpeakerEntry(data, index) { _renderSpeakerEntry(data, index, t) {
const { deviceId, label } = data; const { deviceId } = data;
const label = transformDefaultDeviceLabel(deviceId, data.label, t);
const key = `se-${index}`; const key = `se-${index}`;
return ( return (
@ -251,7 +269,7 @@ class AudioSettingsContent extends Component<Props, State> {
IconComponent = { IconMicrophoneHollow } IconComponent = { IconMicrophoneHollow }
text = { t('settings.microphones') } /> text = { t('settings.microphones') } />
{this.state.audioTracks.map((data, i) => {this.state.audioTracks.map((data, i) =>
this._renderMicrophoneEntry(data, i), this._renderMicrophoneEntry(data, i, t),
)} )}
{ outputDevices.length > 0 && ( { outputDevices.length > 0 && (
<> <>
@ -263,7 +281,7 @@ class AudioSettingsContent extends Component<Props, State> {
) )
} }
{outputDevices.map((data, i) => {outputDevices.map((data, i) =>
this._renderSpeakerEntry(data, i), this._renderSpeakerEntry(data, i, t),
)} )}
</div> </div>
</div> </div>