Add NearbyStation class is a form that given latitude and longitude coordinates gives nearby locations
This commit is contained in:
parent
3a1d06f53a
commit
51e91981e6
@ -5,6 +5,7 @@ import Header from './components/Header.js'
|
|||||||
import PageArea from './components/PageArea.js'
|
import PageArea from './components/PageArea.js'
|
||||||
import BottomMenu from './components/BottomMenu.js'
|
import BottomMenu from './components/BottomMenu.js'
|
||||||
import AccessToken from './components/AccessToken.js'
|
import AccessToken from './components/AccessToken.js'
|
||||||
|
import NearbyStation from './components/NearbyStation';
|
||||||
|
|
||||||
class App extends Component {
|
class App extends Component {
|
||||||
render() {
|
render() {
|
||||||
|
@ -28,6 +28,12 @@ class AccessToken extends React.Component {
|
|||||||
responseFromVT: response.data.access_token,
|
responseFromVT: response.data.access_token,
|
||||||
token: 'token sent'
|
token: 'token sent'
|
||||||
})
|
})
|
||||||
|
.error(res => {
|
||||||
|
this.setState({
|
||||||
|
responseFromVT: "some error",
|
||||||
|
token: "some error occured"
|
||||||
|
})
|
||||||
|
})
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -59,5 +65,5 @@ export default AccessToken
|
|||||||
|
|
||||||
//grant_type=client_credentials&scope=<device_id>
|
//grant_type=client_credentials&scope=<device_id>
|
||||||
|
|
||||||
//BPvMjPidHckBtETZxr3dHP1rptQa
|
//5ty7gxmAfQlUHDHdm7kgaqXwK5Ia
|
||||||
//z5MFCS_wwmqprc0s4iLZWBAUJdga
|
//wpIOURnJJcTtO6rORYmYYPq4wXka
|
101
src/components/NearbyStation.js
Normal file
101
src/components/NearbyStation.js
Normal file
@ -0,0 +1,101 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import axios from 'axios';
|
||||||
|
|
||||||
|
/*
|
||||||
|
const StopLocation = ({ name, id, lat, long, track }) => (
|
||||||
|
<div>
|
||||||
|
<div>
|
||||||
|
<p>{name}</p>
|
||||||
|
<p>{id}</p>
|
||||||
|
<p>{lat}</p>
|
||||||
|
<p>{lon}</p>
|
||||||
|
<p>{track}</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
*/
|
||||||
|
class NearbyStation extends React.Component {
|
||||||
|
state = {
|
||||||
|
lat: '57.5987',
|
||||||
|
long: '11.9454',
|
||||||
|
token: '2d596c20-a6e7-3272-8df6-51ed2468da63',
|
||||||
|
stops: [],
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
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.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">Get Token</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
|
||||||
|
|
||||||
|
//https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops?originCoordLat=57.5987&originCoordLong=11.9454&maxNo=20&format=json
|
||||||
|
|
||||||
|
//https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops
|
||||||
|
|
||||||
|
|
||||||
|
//'https://reqres.in/api/articles'
|
||||||
|
|
||||||
|
//'https://api.vasttrafik.se/token'
|
||||||
|
|
||||||
|
//grant_type=client_credentials&scope=<device_id>
|
||||||
|
|
||||||
|
//BPvMjPidHckBtETZxr3dHP1rptQa
|
||||||
|
//z5MFCS_wwmqprc0s4iLZWBAUJdga
|
Loading…
Reference in New Issue
Block a user