117 lines
2.9 KiB
JavaScript
117 lines
2.9 KiB
JavaScript
// @flow
|
|
|
|
import PropTypes from 'prop-types';
|
|
import React, { Component } from 'react';
|
|
|
|
/**
|
|
* The React {@link Component} which is similar to Web's
|
|
* {@code HTMLAudioElement}.
|
|
*/
|
|
export default class AbstractAudio extends Component<*> {
|
|
/**
|
|
* The (reference to the) {@link ReactElement} which actually implements
|
|
* this {@code AbstractAudio}.
|
|
*/
|
|
_ref: ?Object;
|
|
|
|
_setRef: Function;
|
|
|
|
/**
|
|
* {@code AbstractAudio} component's property types.
|
|
*
|
|
* @static
|
|
*/
|
|
static propTypes = {
|
|
/**
|
|
* The URL of a media resource to use in the element.
|
|
*
|
|
* @type {string}
|
|
*/
|
|
src: PropTypes.string,
|
|
stream: PropTypes.object
|
|
};
|
|
|
|
/**
|
|
* 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._setRef = this._setRef.bind(this);
|
|
}
|
|
|
|
/**
|
|
* Attempts to pause the playback of the media.
|
|
*
|
|
* @public
|
|
* @returns {void}
|
|
*/
|
|
pause() {
|
|
this._ref && typeof this._ref.pause === 'function' && this._ref.pause();
|
|
}
|
|
|
|
/**
|
|
* Attempts to being the playback of the media.
|
|
*
|
|
* @public
|
|
* @returns {void}
|
|
*/
|
|
play() {
|
|
this._ref && typeof this._ref.play === 'function' && this._ref.play();
|
|
}
|
|
|
|
/**
|
|
* Renders this {@code AbstractAudio} as a React {@link Component} of a
|
|
* specific type.
|
|
*
|
|
* @param {string|ReactClass} type - The type of the React {@code Component}
|
|
* which is to be rendered.
|
|
* @param {Object|undefined} props - The read-only React {@code Component}
|
|
* properties, if any, to render. If {@code undefined}, the props of this
|
|
* instance will be rendered.
|
|
* @protected
|
|
* @returns {ReactElement}
|
|
*/
|
|
_render(type, props) {
|
|
const {
|
|
children,
|
|
|
|
/* eslint-disable no-unused-vars */
|
|
|
|
// The following properties are consumed by React itself so they are
|
|
// to not be propagated.
|
|
ref,
|
|
|
|
/* eslint-enable no-unused-vars */
|
|
|
|
...filteredProps
|
|
} = props || this.props;
|
|
|
|
return (
|
|
React.createElement(
|
|
type,
|
|
{
|
|
...filteredProps,
|
|
ref: this._setRef
|
|
},
|
|
children));
|
|
}
|
|
|
|
/**
|
|
* Set the (reference to the) {@link ReactElement} which actually implements
|
|
* this {@code AbstractAudio}.
|
|
*
|
|
* @param {Object} ref - The (reference to the) {@code ReactElement} which
|
|
* actually implements this {@code AbstractAudio}.
|
|
* @private
|
|
* @returns {void}
|
|
*/
|
|
_setRef(ref) {
|
|
this._ref = ref;
|
|
}
|
|
}
|