62 lines
1.5 KiB
JavaScript
62 lines
1.5 KiB
JavaScript
|
|
||
|
|
import React from 'react'
|
||
|
|
|
||
|
|
import Icon from '../Icon'
|
||
|
|
import * as helpers from '../../helpers'
|
||
|
|
|
||
|
|
export default class EditPlaylistModal extends React.Component{
|
||
|
|
|
||
|
|
constructor(props){
|
||
|
|
super(props)
|
||
|
|
this.state = {
|
||
|
|
submit_enabled: true,
|
||
|
|
name: this.props.data.name,
|
||
|
|
is_public: this.props.data.is_public
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
setPlaylistName(name){
|
||
|
|
var submit_enabled = false
|
||
|
|
if( name && name != '' ) submit_enabled = true
|
||
|
|
this.setState({
|
||
|
|
name: name,
|
||
|
|
submit_enabled: submit_enabled
|
||
|
|
})
|
||
|
|
}
|
||
|
|
|
||
|
|
savePlaylist(e){
|
||
|
|
e.preventDefault();
|
||
|
|
this.props.uiActions.savePlaylist( this.props.data.uri, this.state.name, this.state.is_public )
|
||
|
|
this.props.uiActions.closeModal()
|
||
|
|
return false;
|
||
|
|
}
|
||
|
|
|
||
|
|
render(){
|
||
|
|
return (
|
||
|
|
<div>
|
||
|
|
<h4>Edit playlist</h4>
|
||
|
|
<form onSubmit={(e) => this.savePlaylist(e)}>
|
||
|
|
<div className="field">
|
||
|
|
<input
|
||
|
|
type="text"
|
||
|
|
placeholder="Playlist name"
|
||
|
|
onChange={ e => this.setPlaylistName( e.target.value )}
|
||
|
|
value={ this.state.name } />
|
||
|
|
</div>
|
||
|
|
<div className="field checkbox white">
|
||
|
|
<label>
|
||
|
|
<input
|
||
|
|
type="checkbox"
|
||
|
|
name="playlist_private"
|
||
|
|
checked={ this.state.is_public }
|
||
|
|
onChange={ e => this.setState({ is_public: !this.state.is_public })} />
|
||
|
|
<span className="label">Public</span>
|
||
|
|
</label>
|
||
|
|
</div>
|
||
|
|
<button type="submit" className="primary centered" disabled={!this.state.submit_enabled}>Save</button>
|
||
|
|
</form>
|
||
|
|
</div>
|
||
|
|
)
|
||
|
|
}
|
||
|
|
}
|