Search not to fiddle with URL to fix render() triggering

This commit is contained in:
James Barnsley
2018-06-15 08:56:17 +12:00
parent 7a94320d80
commit b72c77f4f8
9 changed files with 23032 additions and 21096 deletions

View File

@ -11,64 +11,32 @@ class SearchForm extends React.Component{
constructor(props){
super(props);
this.state = {
query: '',
in_focus: false
}
}
componentDidMount(){
if (this.props.query){
var query = this.props.query.replace("search:","");
this.setState({query: query});
}
}
componentWillReceiveProps(newProps){
if (newProps.query && newProps.query != this.state.query && !this.state.in_focus){
this.setState({query: newProps.query.replace("search:","")});
}
}
handleSubmit(e){
e.preventDefault()
// check for uri type matching
switch (helpers.uriType(this.state.query)){
switch (helpers.uriType(this.props.term)){
case 'album':
hashHistory.push(global.baseURL+'album/'+encodeURIComponent(this.state.query))
hashHistory.push(global.baseURL+'album/'+encodeURIComponent(this.props.term))
break
case 'artist':
hashHistory.push(global.baseURL+'artist/'+encodeURIComponent(this.state.query))
hashHistory.push(global.baseURL+'artist/'+encodeURIComponent(this.props.term))
break
case 'playlist':
hashHistory.push(global.baseURL+'playlist/'+encodeURIComponent(this.state.query))
hashHistory.push(global.baseURL+'playlist/'+encodeURIComponent(this.props.term))
break
case 'track':
hashHistory.push(global.baseURL+'track/'+encodeURIComponent(this.state.query))
hashHistory.push(global.baseURL+'track/'+encodeURIComponent(this.props.term))
break
default:
var available_views = ["all:","artist:","album:","playlist:",":track"];
var view_defined = false;
var query = this.state.query;
for (var i = 0; i < available_views.length; i++){
if (query.startsWith(available_views[i])){
view_defined = true;
}
}
if (!view_defined){
query = "all:"+query;
}
hashHistory.push(global.baseURL+'search/search:'+query);
this.props.onSubmit(e);
break
}
@ -82,10 +50,8 @@ class SearchForm extends React.Component{
<input
type="text"
placeholder="Search..."
onChange={ e => this.setState({ query: e.target.value }) }
onFocus={e => this.setState({in_focus: true})}
onBlur={e => this.setState({in_focus: false})}
value={ this.state.query } />
onChange={e => this.props.onChange(e)}
value={ this.props.term } />
</label>
</form>
)