2017-11-16 18:26:14 +00:00
|
|
|
// @flow
|
|
|
|
|
2018-02-26 19:37:12 +00:00
|
|
|
import { Component } from 'react';
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Describes audio element interface used in the base/media feature for audio
|
|
|
|
* playback.
|
|
|
|
*/
|
|
|
|
export type AudioElement = {
|
2018-05-16 15:03:10 +00:00
|
|
|
currentTime?: number,
|
2018-02-27 14:09:49 +00:00
|
|
|
pause: () => void,
|
|
|
|
play: () => void,
|
2018-06-20 13:36:28 +00:00
|
|
|
setSinkId?: string => void,
|
|
|
|
stop: () => void
|
2018-02-27 14:09:49 +00:00
|
|
|
};
|
2018-02-26 19:37:12 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* {@code AbstractAudio} component's property types.
|
|
|
|
*/
|
|
|
|
type Props = {
|
|
|
|
|
|
|
|
/**
|
|
|
|
* A callback which will be called with {@code AbstractAudio} instance once
|
|
|
|
* the audio element is loaded.
|
|
|
|
*/
|
2018-02-27 14:09:49 +00:00
|
|
|
setRef?: ?AudioElement => void,
|
2018-02-26 19:37:12 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* 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,
|
2018-05-16 15:03:10 +00:00
|
|
|
stream: Object,
|
|
|
|
loop?: ?boolean
|
2018-02-26 19:37:12 +00:00
|
|
|
}
|
2017-06-05 18:00:02 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* The React {@link Component} which is similar to Web's
|
|
|
|
* {@code HTMLAudioElement}.
|
|
|
|
*/
|
2018-02-26 19:37:12 +00:00
|
|
|
export default class AbstractAudio extends Component<Props> {
|
2017-06-05 18:00:02 +00:00
|
|
|
/**
|
2018-02-26 19:37:12 +00:00
|
|
|
* The {@link AudioElement} instance which implements the audio playback
|
|
|
|
* functionality.
|
2017-06-05 18:00:02 +00:00
|
|
|
*/
|
2018-02-26 19:37:12 +00:00
|
|
|
_audioElementImpl: ?AudioElement;
|
2017-06-05 18:00:02 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Initializes a new {@code AbstractAudio} instance.
|
|
|
|
*
|
2018-01-24 17:39:18 +00:00
|
|
|
* @param {Props} props - The read-only properties with which the new
|
2017-06-05 18:00:02 +00:00
|
|
|
* instance is to be initialized.
|
|
|
|
*/
|
2018-01-24 17:39:18 +00:00
|
|
|
constructor(props: Props) {
|
2017-06-05 18:00:02 +00:00
|
|
|
super(props);
|
|
|
|
|
2018-01-24 17:39:18 +00:00
|
|
|
// Bind event handlers so they are only bound once per instance.
|
2018-02-26 19:37:12 +00:00
|
|
|
this.setAudioElementImpl = this.setAudioElementImpl.bind(this);
|
2017-06-05 18:00:02 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Attempts to pause the playback of the media.
|
|
|
|
*
|
|
|
|
* @public
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
2018-02-27 14:09:49 +00:00
|
|
|
pause(): void {
|
2018-02-26 19:37:12 +00:00
|
|
|
this._audioElementImpl && this._audioElementImpl.pause();
|
2017-06-05 18:00:02 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
2018-06-20 13:36:28 +00:00
|
|
|
* Attempts to begin the playback of the media.
|
2017-06-05 18:00:02 +00:00
|
|
|
*
|
|
|
|
* @public
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
2018-02-27 14:09:49 +00:00
|
|
|
play(): void {
|
2018-02-26 19:37:12 +00:00
|
|
|
this._audioElementImpl && this._audioElementImpl.play();
|
2017-06-05 18:00:02 +00:00
|
|
|
}
|
|
|
|
|
2018-02-27 14:09:49 +00:00
|
|
|
setAudioElementImpl: ?AudioElement => void;
|
2018-01-24 17:39:18 +00:00
|
|
|
|
2017-06-05 18:00:02 +00:00
|
|
|
/**
|
2018-02-26 19:37:12 +00:00
|
|
|
* Set the (reference to the) {@link AudioElement} object which implements
|
|
|
|
* the audio playback functionality.
|
2017-06-05 18:00:02 +00:00
|
|
|
*
|
2018-02-26 19:37:12 +00:00
|
|
|
* @param {AudioElement} element - The {@link AudioElement} instance
|
|
|
|
* which implements the audio playback functionality.
|
2017-06-05 18:00:02 +00:00
|
|
|
* @protected
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
2018-02-27 14:09:49 +00:00
|
|
|
setAudioElementImpl(element: ?AudioElement): void {
|
2018-02-26 19:37:12 +00:00
|
|
|
this._audioElementImpl = element;
|
|
|
|
|
2018-01-24 17:39:18 +00:00
|
|
|
// setRef
|
|
|
|
const { setRef } = this.props;
|
|
|
|
|
2018-02-27 14:09:49 +00:00
|
|
|
// $FlowFixMe
|
2018-01-24 17:39:18 +00:00
|
|
|
typeof setRef === 'function' && setRef(element ? this : null);
|
|
|
|
}
|
|
|
|
|
|
|
|
/**
|
|
|
|
* Sets the sink ID (output device ID) on the underlying audio element.
|
|
|
|
* NOTE: Currently, implemented only on Web.
|
|
|
|
*
|
|
|
|
* @param {string} sinkId - The sink ID (output device ID).
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
2018-02-27 14:09:49 +00:00
|
|
|
setSinkId(sinkId: string): void {
|
2018-01-24 17:39:18 +00:00
|
|
|
this._audioElementImpl
|
|
|
|
&& typeof this._audioElementImpl.setSinkId === 'function'
|
|
|
|
&& this._audioElementImpl.setSinkId(sinkId);
|
2017-06-05 18:00:02 +00:00
|
|
|
}
|
2018-06-20 13:36:28 +00:00
|
|
|
|
|
|
|
/**
|
|
|
|
* Attempts to stop the playback of the media.
|
|
|
|
*
|
|
|
|
* @public
|
|
|
|
* @returns {void}
|
|
|
|
*/
|
|
|
|
stop(): void {
|
|
|
|
this._audioElementImpl && this._audioElementImpl.stop();
|
|
|
|
}
|
2017-06-05 18:00:02 +00:00
|
|
|
}
|