mirror of
https://gitcode.com/GitHub_Trending/ji/jitsi-meet.git
synced 2025-12-30 11:22:31 +00:00
Adds base/sounds feature which allows other features to register a sound source under specified id. A new SoundsCollection component will then render corresponding HTMLAudioElement for each such sound. Once "setRef" callback is called by the HTMLAudioElement, this element will be added to the Redux store. When that happens sound can be played through the new 'playSound' action which will call play() method on the stored HTMLAudioElement instance.
103 lines
2.5 KiB
JavaScript
103 lines
2.5 KiB
JavaScript
// @flow
|
|
|
|
import { Component } from 'react';
|
|
|
|
/**
|
|
* Describes audio element interface used in the base/media feature for audio
|
|
* playback.
|
|
*/
|
|
export type AudioElement = {
|
|
play: Function,
|
|
pause: Function
|
|
}
|
|
|
|
/**
|
|
* {@code AbstractAudio} component's property types.
|
|
*/
|
|
type Props = {
|
|
|
|
/**
|
|
* A callback which will be called with {@code AbstractAudio} instance once
|
|
* the audio element is loaded.
|
|
*/
|
|
setRef: ?Function,
|
|
|
|
/**
|
|
* The URL of a media resource to use in the element.
|
|
*
|
|
* NOTE on react-native sound files are imported through 'require' and then
|
|
* passed as the 'src' parameter which means their type will be 'any'.
|
|
*
|
|
* @type {Object | string}
|
|
*/
|
|
src: Object | string,
|
|
stream: Object
|
|
}
|
|
|
|
/**
|
|
* The React {@link Component} which is similar to Web's
|
|
* {@code HTMLAudioElement}.
|
|
*/
|
|
export default class AbstractAudio extends Component<Props> {
|
|
/**
|
|
* The {@link AudioElement} instance which implements the audio playback
|
|
* functionality.
|
|
*/
|
|
_audioElementImpl: ?AudioElement;
|
|
|
|
/**
|
|
* {@link setAudioElementImpl} bound to <code>this</code>.
|
|
*/
|
|
setAudioElementImpl: Function;
|
|
|
|
/**
|
|
* Initializes a new {@code AbstractAudio} instance.
|
|
*
|
|
* @param {Object} props - The read-only properties with which the new
|
|
* instance is to be initialized.
|
|
*/
|
|
constructor(props: Object) {
|
|
super(props);
|
|
|
|
// Bind event handlers so they are only bound once for every instance.
|
|
this.setAudioElementImpl = this.setAudioElementImpl.bind(this);
|
|
}
|
|
|
|
/**
|
|
* Attempts to pause the playback of the media.
|
|
*
|
|
* @public
|
|
* @returns {void}
|
|
*/
|
|
pause() {
|
|
this._audioElementImpl && this._audioElementImpl.pause();
|
|
}
|
|
|
|
/**
|
|
* Attempts to being the playback of the media.
|
|
*
|
|
* @public
|
|
* @returns {void}
|
|
*/
|
|
play() {
|
|
this._audioElementImpl && this._audioElementImpl.play();
|
|
}
|
|
|
|
/**
|
|
* Set the (reference to the) {@link AudioElement} object which implements
|
|
* the audio playback functionality.
|
|
*
|
|
* @param {AudioElement} element - The {@link AudioElement} instance
|
|
* which implements the audio playback functionality.
|
|
* @protected
|
|
* @returns {void}
|
|
*/
|
|
setAudioElementImpl(element: ?AudioElement) {
|
|
this._audioElementImpl = element;
|
|
|
|
if (typeof this.props.setRef === 'function') {
|
|
this.props.setRef(element ? this : null);
|
|
}
|
|
}
|
|
}
|