diff --git a/src/js/components/ContextMenu.js b/src/js/components/ContextMenu.js index 68cd336a..c00e6fb2 100755 --- a/src/js/components/ContextMenu.js +++ b/src/js/components/ContextMenu.js @@ -1140,6 +1140,18 @@ class ContextMenu extends React.Component { )} ); + case 'current-track': + return ( +
+ {add_to_playlist} + {this.canBeInLibrary() && toggle_in_library} + {toggle_loved} +
+ {context.source === 'spotify' && context.items_count <= 5 && go_to_recommendations} + {context.items_count === 1 && go_to_track} + {copy_uris} +
+ ); case 'queue-track': return (
diff --git a/src/js/components/PlaybackControls.js b/src/js/components/PlaybackControls.js index 6685ea0c..31f21545 100755 --- a/src/js/components/PlaybackControls.js +++ b/src/js/components/PlaybackControls.js @@ -37,6 +37,42 @@ class PlaybackControls extends React.Component { }; } + setTransition(direction) { + this.setState({ + transition_track: this.state.current_track, + transition_direction: direction, + }); + + // Allow time for the animation to complete, then remove + // the transitioning track from state + setTimeout(() => { + this.setState({ + transition_track: null, + }); + }, + 250); + } + + handleContextMenu = (e) => { + const { + current_track, + } = this.state; + const { + uiActions: { + showContextMenu, + }, + } = this.props; + + e.preventDefault(); + + showContextMenu({ + e, + context: 'current-track', + items: [current_track], + uris: [current_track.uri], + }); + } + handleTouchStart = (e) => { const { touch_enabled } = this.props; if (!touch_enabled) return; @@ -92,22 +128,6 @@ class PlaybackControls extends React.Component { e.preventDefault(); } - setTransition(direction) { - this.setState({ - transition_track: this.state.current_track, - transition_direction: direction, - }); - - // Allow time for the animation to complete, then remove - // the transitioning track from state - setTimeout(() => { - this.setState({ - transition_track: null, - }); - }, - 250); - } - renderPlayButton() { let button = ; if (this.props.play_state == 'playing') { @@ -225,6 +245,7 @@ class PlaybackControls extends React.Component { className="current-track current-track__incoming" onTouchStart={this.handleTouchStart} onTouchEnd={this.handleTouchEnd} + onContextMenu={this.handleContextMenu} tabIndex="-1" key={current_track.tlid} >