diff --git a/src/App.js b/src/App.js index 9df211d..f1c39ec 100644 --- a/src/App.js +++ b/src/App.js @@ -5,8 +5,9 @@ import React, { Component } from "react"; import { BrowserRouter as Router, Route } from "react-router-dom"; import BottomMenu from "./components/BottomMenu.js"; -//import AccessToken from "./components/AccessToken.js"; -import NearbyStation from "./components/NearbyStation"; +import NearbyStation from "./components/NearbyStation.js"; +import Disruption from "./components/Disruption.js"; +import StationDisruption from "./components/StationDisruption.js"; import Tickets from "./components/pages/Tickets.js"; import TicketsBuy from "./components/pages/TicketsBuy.js"; @@ -20,6 +21,8 @@ class App extends Component { return (
+ + diff --git a/src/classes/Disruption.js b/src/classes/Disruption.js new file mode 100644 index 0000000..139b98c --- /dev/null +++ b/src/classes/Disruption.js @@ -0,0 +1,24 @@ +/* + Denna klass är en modell för störningar. +*/ + +class Disruption { + constructor(startTime, locations, departures) { + this.startTime = startTime; + this.affectedLines = affectedLines; + this.departures = departures; + } +} + +/* +Från västtrafiks api ett element i listan av hållplatser ser ut som följande + "id": "string", + "lon": "string", + "idx": "string", + "weight": "string", + "name": "string", + "track": "string", + "lat": "string" +*/ + +export default Disruption; \ No newline at end of file diff --git a/src/classes/Stop.js b/src/classes/Stop.js index 51a6169..fa4f76e 100644 --- a/src/classes/Stop.js +++ b/src/classes/Stop.js @@ -14,4 +14,15 @@ class Stop { } } +/* +Från västtrafiks api ett element i listan av hållplatser ser ut som följande + "id": "string", + "lon": "string", + "idx": "string", + "weight": "string", + "name": "string", + "track": "string", + "lat": "string" +*/ + export default Stop; \ No newline at end of file diff --git a/src/classes/User.js b/src/classes/User.js index 0aef9aa..bd48e47 100644 --- a/src/classes/User.js +++ b/src/classes/User.js @@ -11,6 +11,7 @@ class User { this.name = name; this.deviceId = deviceId; this.location = location; + this.stoppointgid = stoppointgid; } } diff --git a/src/components/Disruption.js b/src/components/Disruption.js new file mode 100644 index 0000000..6cb7fd6 --- /dev/null +++ b/src/components/Disruption.js @@ -0,0 +1,60 @@ +import React from 'react'; +import axios from 'axios'; +import AccessToken from '../classes/AccessToken' + +class Diruption extends React.Component { + state = { + gid: '9022014005700002', + disruptions: [], + token: undefined, + tokenClass: new AccessToken() + } + + handleChangeGid = event => { + this.setState({ lat: 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/ts/v1/traffic-situations/stoppoint/'+this.state.gid, { headers }) + //axios.get('https://api.vasttrafik.se/ts/v1/traffic-situations/stoppoint/9022014005700002', { headers }) + .then(response => { + console.log(response) + this.setState({ + disruptions: response.data + }) + }) + } + + render() { + return ( +
+
+ + +
+

+ {this.state.gid} +

+ {this.state.disruptions.map((item) => +
+

+ {item.description} +

+
+ )} +
+ ) + } +} +export default Diruption diff --git a/src/components/NearbyStation.js b/src/components/NearbyStation.js index 7455c93..5ed2a2a 100644 --- a/src/components/NearbyStation.js +++ b/src/components/NearbyStation.js @@ -1,6 +1,8 @@ import React from 'react'; import axios from 'axios'; -import AccessToken from '../classes/AccessToken' +import AccessToken from '../classes/AccessToken'; +import StopComponent from './StopComponent'; +import Stop from '../classes/Stop'; class NearbyStation extends React.Component { state = { @@ -28,7 +30,7 @@ class NearbyStation extends React.Component { 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 }) + axios.get('https://api.vasttrafik.se/bin/rest.exe/v2/location.nearbystops?originCoordLat='+this.state.lat+'&originCoordLong='+this.state.long+'&maxNo=5&format=json', { headers }) .then(response => { console.log(response.data.LocationList.StopLocation) this.setState({ @@ -58,32 +60,11 @@ class NearbyStation extends React.Component { {this.state.long} {this.state.stops.map((item) => -
-

- {item.name}, - {item.id}, - {item.lat}, - {item.lon}, - {item.track} -

-
+ )}
) } } + 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= - -//BPvMjPidHckBtETZxr3dHP1rptQa -//z5MFCS_wwmqprc0s4iLZWBAUJdga \ No newline at end of file diff --git a/src/components/StationDisruption.js b/src/components/StationDisruption.js new file mode 100644 index 0000000..fb76620 --- /dev/null +++ b/src/components/StationDisruption.js @@ -0,0 +1,64 @@ +import React from 'react'; +import axios from 'axios'; +import AccessToken from '../classes/AccessToken' + +class StationDisruption extends React.Component { + state = { + gid: '9022014005700002', + lat: '57.7', + long: '12.0', + disruptions: [], + token: undefined, + tokenClass: new AccessToken() + } + + handleChangeGid = event => { + this.setState({ lat: 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=5&format=json', { headers }) + .then(response => { + console.log(response.data.LocationList.StopLocation) + }) + axios.get('https://api.vasttrafik.se/ts/v1/traffic-situations/stoppoint/'+this.state.gid, { headers }) + .then(response => { + console.log(response) + this.setState({ + disruptions: response.data + }) + }) + } + + render() { + return ( +
+
+ + +
+

+ {this.state.gid} +

+ {this.state.disruptions.map((item) => +
+

+ {item.description} +

+
+ )} +
+ ) + } +} +export default StationDisruption diff --git a/src/components/StopComponent.js b/src/components/StopComponent.js new file mode 100644 index 0000000..db5bdb2 --- /dev/null +++ b/src/components/StopComponent.js @@ -0,0 +1,19 @@ +import React, {Component} from 'react'; + +class StopComponent extends Component { + render() { + return ( +
+

+ {this.props.stop.name}, + {this.props.stop.id}, + {this.props.stop.lat}, + {this.props.stop.lon}, + {this.props.stop.track} +

+
+ ); + } +} +// TODO Add css +export default StopComponent