Tracklist behavior defaults; View to override
This commit is contained in:
@ -16,13 +16,13 @@ class Player extends React.Component{
|
|||||||
super(props);
|
super(props);
|
||||||
}
|
}
|
||||||
|
|
||||||
renderTrackInFocus(){
|
renderTrack(){
|
||||||
if( this.props.mopidy && this.props.mopidy.currentTlTrack ){
|
if( this.props.mopidy && this.props.mopidy.current_tltrack ){
|
||||||
return (
|
return (
|
||||||
<div className="track-in-focus">
|
<div className="track-in-focus">
|
||||||
{ this.props.spotify.track && !this.props.mini ? <Thumbnail size="large" images={this.props.spotify.track.album.images} /> : null }
|
{ this.props.spotify.track && !this.props.mini ? <Thumbnail size="large" images={this.props.spotify.track.album.images} /> : null }
|
||||||
<div className="title">{ this.props.mopidy.currentTlTrack.track.name }</div>
|
<div className="title">{ this.props.mopidy.current_tltrack.track.name }</div>
|
||||||
<ArtistSentence artists={ this.props.mopidy.currentTlTrack.track.artists } />
|
<ArtistSentence artists={ this.props.mopidy.current_tltrack.track.artists } />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
@ -68,7 +68,7 @@ class Player extends React.Component{
|
|||||||
return (
|
return (
|
||||||
<div className="player">
|
<div className="player">
|
||||||
|
|
||||||
{ this.renderTrackInFocus() }
|
{ this.renderTrack() }
|
||||||
|
|
||||||
<div className="controls">
|
<div className="controls">
|
||||||
{ this.renderPlayButton() }
|
{ this.renderPlayButton() }
|
||||||
|
|||||||
@ -29,14 +29,16 @@ class TrackList extends React.Component{
|
|||||||
}
|
}
|
||||||
|
|
||||||
handleKeyUp(e){
|
handleKeyUp(e){
|
||||||
|
if( this.selectedTracks().length <= 0 ) return;
|
||||||
|
|
||||||
switch(e.keyCode){
|
switch(e.keyCode){
|
||||||
|
|
||||||
case 13: // enter
|
case 13: // enter
|
||||||
this.playTrack( this.state.tracks[this.state.lastSelectedTrack] );
|
this.playTracks();
|
||||||
break;
|
break;
|
||||||
|
|
||||||
case 46: // delete
|
case 46: // delete
|
||||||
console.log('delete')
|
this.removeTracks();
|
||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@ -81,9 +83,7 @@ class TrackList extends React.Component{
|
|||||||
|
|
||||||
handleDoubleClick( e, index ){
|
handleDoubleClick( e, index ){
|
||||||
if( this.props.ui.context_menu.show ) this.props.uiActions.hideContextMenu();
|
if( this.props.ui.context_menu.show ) this.props.uiActions.hideContextMenu();
|
||||||
|
this.playTracks()
|
||||||
var tracks = this.state.tracks;
|
|
||||||
this.playTrack( tracks[index] )
|
|
||||||
}
|
}
|
||||||
|
|
||||||
handleContextMenu( e, index ){
|
handleContextMenu( e, index ){
|
||||||
@ -104,10 +104,12 @@ class TrackList extends React.Component{
|
|||||||
|
|
||||||
var tracks = this.selectedTracks();
|
var tracks = this.selectedTracks();
|
||||||
|
|
||||||
|
// if we've got a specific action, run it
|
||||||
if( typeof(this.props.playTracks) !== 'undefined' ){
|
if( typeof(this.props.playTracks) !== 'undefined' ){
|
||||||
return this.props.playTracks( tracks );
|
return this.props.playTracks( tracks );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// default to playing a bunch of uris
|
||||||
var uris = [];
|
var uris = [];
|
||||||
for( var i = 0; i < tracks.length; i++ ){
|
for( var i = 0; i < tracks.length; i++ ){
|
||||||
uris.push( tracks[i].uri )
|
uris.push( tracks[i].uri )
|
||||||
@ -115,23 +117,16 @@ class TrackList extends React.Component{
|
|||||||
return this.props.mopidyActions.playTracks( uris )
|
return this.props.mopidyActions.playTracks( uris )
|
||||||
}
|
}
|
||||||
|
|
||||||
playTrack( track ){
|
|
||||||
|
|
||||||
if( typeof(this.props.playTrack) !== 'undefined' ){
|
|
||||||
return this.props.playTrack( track );
|
|
||||||
}
|
|
||||||
|
|
||||||
var uris = [track.uri];
|
|
||||||
this.props.mopidyActions.playTracks( uris )
|
|
||||||
}
|
|
||||||
|
|
||||||
removeTracks(){
|
removeTracks(){
|
||||||
|
|
||||||
var tracks = this.selectedTracks();
|
var tracks = this.selectedTracks();
|
||||||
|
|
||||||
|
// if we've got a specific action, run it
|
||||||
if( typeof(this.props.removeTracks) !== 'undefined' ){
|
if( typeof(this.props.removeTracks) !== 'undefined' ){
|
||||||
return this.props.removeTracks( tracks );
|
return this.props.removeTracks( tracks );
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// by default, do nothing
|
||||||
}
|
}
|
||||||
|
|
||||||
render(){
|
render(){
|
||||||
|
|||||||
@ -11,7 +11,7 @@ import ArtistSentence from '../components/ArtistSentence'
|
|||||||
import AlbumLink from '../components/AlbumLink'
|
import AlbumLink from '../components/AlbumLink'
|
||||||
import Header from '../components/Header'
|
import Header from '../components/Header'
|
||||||
|
|
||||||
import * as actions from '../services/mopidy/actions'
|
import * as mopidyActions from '../services/mopidy/actions'
|
||||||
|
|
||||||
class Queue extends React.Component{
|
class Queue extends React.Component{
|
||||||
|
|
||||||
@ -39,7 +39,7 @@ class Queue extends React.Component{
|
|||||||
context="queue"
|
context="queue"
|
||||||
tracks={this.props.mopidy.tracks}
|
tracks={this.props.mopidy.tracks}
|
||||||
removeTracks={ tracks => this.removeTracks( tracks ) }
|
removeTracks={ tracks => this.removeTracks( tracks ) }
|
||||||
playTracks={ null }
|
playTracks={ tracks => this.playTracks( tracks ) }
|
||||||
playTrack={ track => this.playTrack( track ) }
|
playTrack={ track => this.playTrack( track ) }
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
@ -52,11 +52,15 @@ class Queue extends React.Component{
|
|||||||
for( var i = 0; i < tracks.length; i++ ){
|
for( var i = 0; i < tracks.length; i++ ){
|
||||||
tlids.push( tracks[i].tlid )
|
tlids.push( tracks[i].tlid )
|
||||||
}
|
}
|
||||||
this.props.actions.removeTracks( tlids )
|
this.props.mopidyActions.removeTracks( tlids )
|
||||||
}
|
}
|
||||||
|
|
||||||
playTrack( track ){
|
playTrack( track ){
|
||||||
this.props.actions.changeTrack( track.tlid )
|
this.props.mopidyActions.changeTrack( track.tlid )
|
||||||
|
}
|
||||||
|
|
||||||
|
playTracks( tracks ){
|
||||||
|
this.props.mopidyActions.changeTrack( tracks[0].tlid )
|
||||||
}
|
}
|
||||||
|
|
||||||
render(){
|
render(){
|
||||||
@ -86,7 +90,7 @@ const mapStateToProps = (state, ownProps) => {
|
|||||||
|
|
||||||
const mapDispatchToProps = (dispatch) => {
|
const mapDispatchToProps = (dispatch) => {
|
||||||
return {
|
return {
|
||||||
actions: bindActionCreators(actions, dispatch)
|
mopidyActions: bindActionCreators(mopidyActions, dispatch)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user