Files
jitsi-meet/react/features/base/media/components/AbstractAudio.js
paweldomas 60e03e3dec feat: add join/leave sounds on mobile
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.
2018-03-13 16:57:28 -05:00

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);
}
}
}