import React, {component} from 'react';
import { Button,  Icon,Autocomplete,  Input} from 'react-materialize';
import MyAutocomplete from './MyAutocomplete';
import Modularity from 'modularity-front';
const Module = Modularity.Module;

class SearchBarModule extends Modularity.Module{

	constructor(props){
		super(props);
	}

	_complete = (value, obj) => {
    if(value === undefined)return;
		this.SearchData.set(value);
    this.ObjectData.set(obj);
		if (this.Route.value && this.Redirect.value) {
      this.CoreSystem.go("/search/" + value);
    }
	}

	render(){
    let options = {
      data:this.Data.value,
      limit: 5
    };
		return(
	     <div className={'SearchBar ' + this.props.className}>
          <Icon>search</Icon>
          <MyAutocomplete
            data={this.Data.value}
            onChange={(v) => this.Text.set(v.target.value)}
            placeholder={this.SearchBar.value.placeholder}
            options={options}
            value={this.SearchBar.value.defaultValue}
            onComplete={(v, o) =>  this._complete(v, o)}
          />
  				{super.render()}
       </div>
			)  
		}
}
// Not used anymore
class AutocompleteNew extends Autocomplete {
  constructor(props) { super(props); }
  componentWillReceiveProps(props) {
    if (this.instance) {
      this.instance.updateData(props.options.data);
    }
    if (props.value !== this.props.value) {
      this.setState({value: props.value});
    }
  }
}

SearchBarModule.EditPosition = "top-right";
SearchBarModule.Inputs = {
     SearchBar:{
       type: Module.Types.Object,
       defaultValue:{
         placeholder:"Search",
       }
     },
		 Data : {
			 type:Module.Types.Object,
			 defaultValue:{
         'Apple': null,
         'Microsoft': null,
         'Google': 'http://placehold.it/250x250'
			 }
		 },
     Redirect: {
        type:Module.Types.Boolean,
        defaultValue: false
     },
     Route: {
        type:Module.Types.Text,
        defaultValue: 'search'
     }
}

SearchBarModule.Outputs = {
    SearchData:{},
    ObjectData:{},
    Text: {}
}


SearchBarModule.Category = 'sxoinas'


export default SearchBarModule;
