class ResultList extends React.Component{
    constructor(props){
     super(props);
        this.state ={ usersDataArr:null ,markers: []}
    }

    markerOver(index,event){
        var update ={};
        update[index] ={
            $merge:{
                icon:'http://bsccongress.com/im22/pink-pin-clip-art.png'
            }
        }
        alert('mabite');
    }

    componentDidMount() {
        getAvaiabilityResults(this.props.params.places,this.props.params.branch,this.props.params.dayOfMonth,this.props.params.timeStart,this.props.params.timeEnd)
        .then(function(data){
            this.setState({
                usersDataArr:data.AvaiabilityResults
            })
        }.bind(this));

        setTimeout(() => {
         let { markers } = this.state;
        this.state.usersDataArr.map((teacher,i)=>{
            markers = update(markers, {
                $push: [
                  {
                    position: {
                      lat: parseFloat(teacher.lat),
                      lng: parseFloat(teacher.lon),
                    },
                    icon:'http://icons.iconarchive.com/icons/paomedia/small-n-flat/32/map-marker-icon.png',
                    key: teacher.key,
                    onMouseover:this.markerOver.bind(this,i)
                  },
                ],
              });
        });
        this.setState({ markers });
          }, 2000);
    }

    render(){
                return(
            <div>

                    <ResultMap  markers={this.state.markers} />

            {this.state.usersDataArr && <Results teachers={this.state.usersDataArr} place={this.props.params.places} />}

           </div>
            );
    }
}