secstate/Iris
Public Access
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases 1 Wiki Activity

Selecting tracks where multiple instances on one playlist

Browse Source
This commit is contained in:
James Barnsley
2016-11-15 13:34:55 +13:00
parent 76fbd358b7
commit ddcdc58043
3 changed files with 29 additions and 21 deletions
Download Patch File Download Diff File Expand all files Collapse all files

46
src/js/components/TrackList.js
View File

@ -14,7 +14,7 @@ class TrackList extends React.Component{
super(props);
this.state = {
tracks: this.props.tracks,
tracks: this.keyifyTracks(this.props.tracks),
lastSelectedTrack: false
}
@ -29,6 +29,10 @@ class TrackList extends React.Component{
window.removeEventListener("keyup", this.handleKeyUp, false);
}
componentWillReceiveProps( nextProps ){
this.setState({ tracks: this.keyifyTracks(nextProps.tracks) });
}
handleKeyUp(e){
if( this.selectedTracks().length <= 0 ) return;
@ -44,51 +48,48 @@ class TrackList extends React.Component{
}
}
componentWillReceiveProps( nextProps ){
this.setState({ tracks: nextProps.tracks });
}
handleClick( e, index ){
if( this.props.context_menu.show ) this.props.uiActions.hideContextMenu();
if( this.props.context_menu.show ) this.props.uiActions.hideContextMenu()
var tracks = this.state.tracks;
var tracks = this.state.tracks
if( e.ctrlKey ){
tracks[index].selected = !tracks[index].selected;
tracks[index].selected = !tracks[index].selected
}else if( e.shiftKey ){
if( this.state.lastSelectedTrack < index ){
var start = this.state.lastSelectedTrack;
var end = index;
var start = this.state.lastSelectedTrack
var end = index
}else{
var start = index;
var end = this.state.lastSelectedTrack;
var start = index
var end = this.state.lastSelectedTrack
}
for( var i = start; i <= end; i++ ){
tracks[i].selected = true;
tracks[i].selected = true
}
}else{
for( var i = 0; i < tracks.length; i++ ){
tracks[i].selected = false;
tracks[i].selected = false
}
tracks[index].selected = !tracks[index].selected;
tracks[index].selected = !tracks[index].selected
}
this.setState({ tracks: tracks, lastSelectedTrack: index });
this.setState({ tracks: tracks, lastSelectedTrack: index })
}
handleDoubleClick(e, index){
if( this.props.context_menu.show ) this.props.uiActions.hideContextMenu();
if( this.props.context_menu.show ) this.props.uiActions.hideContextMenu()
this.playTracks()
}
handleDragStart(e, index){
this.props.uiActions.dragStart( e, 'tltracks', this.selectedTracks() )
this.props.uiActions.dragStart( e, this.props.context, this.selectedTracks() )
}
handleContextMenu(e, index){
@ -100,6 +101,13 @@ class TrackList extends React.Component{
this.props.uiActions.showContextMenu( e, this.props.context, data )
}
keyifyTracks( tracks ){
for( var i = 0; i < tracks.length; i++ ){
tracks[i] = Object.assign({}, tracks[i], { key: i+'_'+tracks[i].uri })
}
return tracks
}
selectedTracks(){
function isSelected( track ){
return ( typeof(track.selected) !== 'undefined' && track.selected );
@ -161,7 +169,7 @@ class TrackList extends React.Component{
(track, index) => {
return <Track
show_source_icon={ this.props.show_source_icon }
key={index+'_'+track.uri}
key={track.key}
track={track}
handleDoubleClick={ e => self.handleDoubleClick(e, index)}
handleClick={ e => self.handleClick(e, index)}

2
src/js/services/localstorage/middleware.js
View File

@ -12,7 +12,7 @@ const localstorageMiddleware = (function(){
// append our state to a global variable. This gives us access to debug the store at any point
window._store = store
console.log(action)
//console.log(action)
switch( action.type ){

2
src/js/views/Playlist.js
View File

@ -124,7 +124,7 @@ class Playlist extends React.Component{
<li>{ this.props.playlist.tracks_total } tracks, <Dater type="total-time" data={this.props.playlist.tracks} /></li>
{ this.props.playlist.last_modified ? <li>Updated <Dater type="ago" data={this.props.playlist.last_modified} /> ago</li> : null }
{ this.props.playlist.followers ? <li>{this.props.playlist.followers.total.toLocaleString()} followers</li> : null }
{ scheme == 'spotify' ? <li>By <Link to={'/user/'+this.props.playlist.owner.id}>{this.props.playlist.owner.id}</Link> &nbsp;{ !this.props.playlist.public ? <FontAwesome name="lock" /> : null }</li> : null }
{ scheme == 'spotify' && this.props.playlist.owner ? <li>By <Link to={'/user/'+this.props.playlist.owner.id}>{this.props.playlist.owner.id}</Link> &nbsp;{ !this.props.playlist.public ? <FontAwesome name="lock" /> : null }</li> : null }
{ scheme == 'spotify' ? <li><FontAwesome name="spotify" /> Spotify playlist</li> : null }
{ scheme == 'm3u' ? <li><FontAwesome name="folder" /> Local playlist</li> : null }
</ul>