76 lines
2.2 KiB
JavaScript
76 lines
2.2 KiB
JavaScript
import React from 'react';
|
|
import axios from 'axios';
|
|
import AccessToken from '../classes/AccessToken'
|
|
|
|
class NearbyStation extends React.Component {
|
|
state = {
|
|
lat: '57.7',
|
|
long: '12.0',
|
|
stops: [],
|
|
token: undefined,
|
|
tokenClass: new AccessToken()
|
|
}
|
|
|
|
handleChangeLat = event => {
|
|
this.setState({ lat: event.target.value});
|
|
}
|
|
|
|
handleChangeLong = event => {
|
|
this.setState({ long: event.target.value});
|
|
}
|
|
|
|
handleSubmit = event => {
|
|
event.preventDefault();
|
|
|
|
const headers = {
|
|
'Authorization': 'Bearer ' + this.state.tokenClass.token
|
|
};
|
|
|
|
console.log('Attempted connection')
|
|
|
|
axios.get('https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops?originCoordLat='+this.state.lat+'&originCoordLong='+this.state.long+'&maxNo=20&format=json', { headers })
|
|
.then(response => {
|
|
console.log(response.data.LocationList.StopLocation)
|
|
this.setState({
|
|
stops: response.data.LocationList.StopLocation,
|
|
})
|
|
})
|
|
}
|
|
|
|
render() {
|
|
return (
|
|
<div>
|
|
<form onSubmit={this.handleSubmit}>
|
|
<label>
|
|
Lattitude coord:
|
|
<input type="text" name="lat" onChange={this.handleChangeLat} />
|
|
</label>
|
|
<label>
|
|
Longitude coord:
|
|
<input type="text" name="long" onChange={this.handleChangeLong} />
|
|
</label>
|
|
<button type="submit">Stops</button>
|
|
</form>
|
|
<h1>
|
|
{this.state.lat}
|
|
</h1>
|
|
<h1>
|
|
{this.state.long}
|
|
</h1>
|
|
{this.state.stops.map((item) =>
|
|
<div>
|
|
<h1>
|
|
{item.name},
|
|
{item.id},
|
|
{item.lat},
|
|
{item.lon},
|
|
{item.track}
|
|
</h1>
|
|
</div>
|
|
)}
|
|
</div>
|
|
)
|
|
}
|
|
}
|
|
export default NearbyStation
|