import globalData from '../GlobalData.js';

import user1 from '../APIexamples/user1.json'
import user2 from '../APIexamples/user2.json'
import user3 from '../APIexamples/user3.json'
import user4 from '../APIexamples/user4.json'

import locationuser1 from '../APIexamples/locationuser1.json'
import locationuser2 from '../APIexamples/locationuser2.json'
import locationuser3 from '../APIexamples/locationuser3.json'
import locationuser4 from '../APIexamples/locationuser4.json'

import departureuser1 from '../APIexamples/departureuser1.json'
import departureuser2 from '../APIexamples/departureuser2.json'
import departureuser3 from '../APIexamples/departureuser3.json'
import departureuser4 from '../APIexamples/departureuser4.json'

import Button from './Button.js';
import userIcon from '../img/userDark.svg';


class SelectUserButton extends Button {
	state = {
		first : false,
		u1 : user1,
		u2 : user2,
		u3 : user3,
		u4 : user4,
	}

	genUsers = () => {
		if(globalData.users.length < 2){
			this.state.first = true;
			this.state.u1.stop = locationuser1.LocationList.StopLocation[0];
			this.state.u1.stop.departures = departureuser1.DepartureBoard.Departures;
			this.state.u2.stop = locationuser2.LocationList.StopLocation[0];
			this.state.u2.stop.departures = departureuser2.DepartureBoard.Departures;
			this.state.u3.stop = locationuser3.LocationList.StopLocation[0];
			this.state.u3.stop.departures = departureuser3.DepartureBoard.Departures;
			this.state.u4.stop = locationuser4.LocationList.StopLocation[0];
			this.state.u4.stop.departures = departureuser4.DepartureBoard.Departures;
			globalData.users = [
				this.state.u1,
				this.state.u2,
				this.state.u3,
				this.state.u4
			]
		}
	}

	selectUser = () => {
		this.genUsers()

        if(this.props.path === "user1"){
			globalData.user = user1
			globalData.user.track = locationuser1.LocationList.StopLocation[0].track
			globalData.stop = locationuser1.LocationList.StopLocation[0]
            globalData.stop.departures = departureuser1.DepartureBoard.Departures
        }else if (this.props.path === "user2"){
			globalData.user = user2
            globalData.user.track = locationuser2.LocationList.StopLocation[0].track
			globalData.stop = locationuser2.LocationList.StopLocation[0]
			globalData.stop.departures = departureuser2.DepartureBoard.Departures
        }else if (this.props.path === "user3"){
			globalData.user = user3
			globalData.user.track = locationuser3.LocationList.StopLocation[0].track
            globalData.stop = locationuser3.LocationList.StopLocation[0]
			globalData.stop.departures = departureuser3.DepartureBoard.Departures
        }else if (this.props.path === "user4"){
            globalData.user = user4
			globalData.user.track = locationuser4.LocationList.StopLocation[0].track
			globalData.stop = locationuser4.LocationList.StopLocation[0]
			globalData.stop.departures = departureuser4.DepartureBoard.Departures
		}
	}
    
    updatePage = () => {
        globalData.currentPage.forceUpdate();
    }

	render() {
		return (
			<Button onClick={[this.selectUser, this.updatePage]} className="disruptBtn">
				<img src={userIcon} alt="" />
				{this.props.username}
			</Button>
		);
	}
}

export default SelectUserButton;