Files
Iris/src/js/components/Stream.js

69 lines
1.8 KiB
JavaScript
Executable File

import React from 'react';
import { connect } from 'react-redux';
import { bindActionCreators } from 'redux';
import * as coreActions from '../services/core/actions';
class Stream extends React.Component {
constructor(props) {
super(props);
this.state = {
uri: '',
play_state: '',
cachebuster: '',
};
}
static getDerivedStateFromProps({ play_state, current_track: { uri } = {} }, state) {
if (uri && uri === state.uri && play_state === state.play_state) return null;
return {
...state,
uri,
play_state,
cachebuster: `${Date.now()}`,
};
}
render = () => {
const {
play_state,
enabled,
volume,
url,
current_track: { uri } = {},
} = this.props;
const { cachebuster } = this.state;
if (!uri || !enabled || !url) return null;
console.debug(`Attempting to play stream ${url}?cb=${cachebuster}`);
if (play_state !== 'playing') return null;
return (
<audio
autoPlay
volume={volume / 100} // TODO: Needs to be set by script, not DOM
>
<source src={`${url}?cb=${cachebuster}`} />
</audio>
);
}
}
const mapStateToProps = (state) => ({
current_track: state.core.current_track || {},
play_state: state.mopidy.play_state,
enabled: state.core.http_streaming_enabled,
volume: state.core.http_streaming_volume >= 0 ? state.core.http_streaming_volume : 50,
url: (state.core.http_streaming_url ? state.core.http_streaming_url : null),
cachebuster: state.core.http_streaming_cachebuster,
});
const mapDispatchToProps = (dispatch) => ({
coreActions: bindActionCreators(coreActions, dispatch),
});
export default connect(mapStateToProps, mapDispatchToProps)(Stream);