Merge branch 'main' into we-out-of-creativity-for-names

Add: json files for departure board for all users

src/GlobalData.js

@@ -2,6 +2,7 @@ import User from './classes/User.js';
 import Disruption from './classes/Disruption.js'
 import Coordinates from './classes/Coordinates.js';
 import Stop from './classes/Stop.js'
+import Departure from './classes/Departure.js';
 
 let globalData = {
     user: new User(

src/classes/Departure.js

@@ -9,15 +9,15 @@
 */
 
 class Departure {
-    constructor(lineName, finalStop, originalTime, trafficInfo) {
+    constructor(lineName, finalStop, originalTime) {
-        this.lineName = lineName;
+        this.sname = lineName;
-        this.finalStop = finalStop;
+        this.direction = finalStop;
-        this.originalTime = originalTime;
+        this.time = originalTime;
-        this.trafficInfo = trafficInfo;
     }
 
-    timeUpdate(time) {
+    timeUpdate(time, trafficInfo) {
         this.newTime = time;
+        this.trafficInfo = trafficInfo;
     }
 }
 

src/components/SelectUserButton.js

@@ -6,25 +6,49 @@ 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 disruptIcon from '../img/flash.svg';
+import globalData from '../GlobalData.js';
 
 class SelectUserButton extends Button {
 	selectUser = () => {
         if(this.props.path === "user1"){
-            globData.user = user1
+			globData.user = user1
+			globData.stop = locationuser1.LocationList.StopLocation[0]
+			globData.stop.departures = [departureuser1.DepartureBoard.Departure]
         }else if (this.props.path === "user2"){
-            globData.user = user2
+			globData.user = user2
+			globData.stop = locationuser2.LocationList.StopLocation[0]
+			globData.stop.departures = [departureuser2.DepartureBoard.Departure]
         }else if (this.props.path === "user3"){
-            globData.user = user3
+			globData.user = user3
+			globData.stop = locationuser3.LocationList.StopLocation[0]
+			globData.stop.departures = [departureuser3.DepartureBoard.Departure]
         }else if (this.props.path === "user4"){
-            globData.user = user4
+			globData.user = user4
-        }
+			globData.stop = locationuser4.LocationList.StopLocation[0]
+			globData.stop.departures = [departureuser4.DepartureBoard.Departure]
+		}
+		console.log(globData.stop)
 	}
+    
+    updatePage = () => {
+        globalData.currentPage.render();
+    }
 
 	render() {
 		return (
-			<Button onClick={[this.selectUser]} className="disruptBtn">
+			<Button onClick={[this.selectUser, this.updatePage]} className="disruptBtn">
 				<img src={disruptIcon} alt="" />
 				<span>{this.props.username}</span>
 			</Button>

src/components/StopTitle.js

@@ -6,10 +6,21 @@ class StopTitle extends Component {
     render() {
         return (
             <div id="stopTitle">
-                <h1>{this.props.stop.name}</h1>
+                <h1>{this.props.stop.name !== undefined ?
+                        this.props.stop.name
+                        : "Hållplats saknas"
+                    }</h1>
                 <div>
-                    <h3>{this.props.stop.locations[0]}</h3>
+                    {this.props.stop.locations !== undefined ?
-                    <button>Byt Läge</button>
+                        <>
+                            <h3>
+                                <span>{this.props.stop.locations[0]}</span>
+                            </h3>
+                            <button>Byt Läge</button>
+                        </>
+                        :
+                        <h3>Vänligen aktivera platsåtkomst</h3>
+                    }
                 </div>
             </div>
         );

src/components/TrafficEntry.js

@@ -39,7 +39,7 @@ class TrafficEntry extends Component {
                 <div>
                     <div className="timeColumn">
                         {!lineInterference &&
-                            <span>{this.props.departure.originalTime}</span>
+                            <span>{this.props.departure.time}</span>
                         }
                         {lineInterference &&
                             <>
@@ -53,9 +53,9 @@ class TrafficEntry extends Component {
                     </div>
                     <div className="lineColumn">
                         <div>
-                            <span className="lineName">{this.props.departure.lineName}</span>
+                            <span className="lineName">{this.props.departure.sname}</span>
                             <img src={busIcon} alt=""></img>
-                            <span className="destination">{"Mot " + this.props.departure.finalStop}</span>
+                            <span className="destination">{"Mot " + this.props.departure.direction}</span>
                         </div>
                         {lineInterference &&
                             <div className="infoWrapper" onClick={this.toggle}>

src/components/TrafficList.js

@@ -7,21 +7,23 @@ import './css/TrafficInfo.css';
 class TrafficList extends Component {
     render() {
         let entries = [];
+        
+        if (this.props.departures) {
+            let i = 0; // React requires elems in array to have associated unique key
 
-        let i = 0; // React requires elems in array to have associated unique key
+            this.props.departures.forEach(departure => {
+                entries.push(
+                    <TrafficEntry key={i++} departure={departure} />
+                );
+            });
 
-        this.props.departures.forEach(departure => {
+            // Add separator between every element
-            entries.push(
+            const intersperse = (arr, sep) => arr.reduce((a,v)=>[...a,v,sep],[]).slice(0,-1);
-                <TrafficEntry key={i++} departure={departure} />
+            entries = intersperse(entries, (<hr key={i++} />));
-            );
-        });
 
-        // Add separator between every element
+            // Add separator after the last element
-        const intersperse = (arr, sep) => arr.reduce((a,v)=>[...a,v,sep],[]).slice(0,-1);
+            entries.push(<hr key={i++} />);
-        entries = intersperse(entries, (<hr key={i++} />));
+        }
-
-        // Add separator after the last element
-        entries.push(<hr key={i++} />);
 
         return (
             <div id="trafficList">

src/components/pages/Tickets.js

@@ -2,9 +2,12 @@ import React, { Component } from 'react';
 
 import Header from '../Header.js';
 import MainArea from '../MainArea.js';
+import globalData from '../../GlobalData.js';
 
 class Tickets extends Component {
     render() {
+        globalData.currentPage = this;
+
         return (
             <>
                 <Header title="Biljetter" />

src/components/pages/TicketsBuy.js

@@ -9,8 +9,12 @@ import clockIcon from '../../img/clock.svg';
 import calendarIcon from '../../img/calendar.svg';
 import recurringIcon from '../../img/redo.svg';
 
+import globalData from '../../GlobalData.js';
+
 class TicketsBuy extends Component {
     render() {
+        globalData.currentPage = this;
+
         return ( 
             <>
                 <Header title="Köp biljett" />

src/components/pages/TrafficInfo.js

@@ -6,38 +6,25 @@ import MainArea from "../MainArea.js";
 import StopTitle from "../StopTitle.js";
 import TrafficList from "../TrafficList.js";
 
-import Stop from "../../classes/Stop.js";
+import globalData from '../../GlobalData.js';
-import Departure from "../../classes/Departure.js";
 
 
 class TrafficInfo extends Component {
+    state = {
+        stop: globalData.stop
+    };
+    
     render() {
-        /* TEST DATA - TO BE REPLACED */
+        globalData.currentPage = this;
-        let testStop = new Stop(
-            "Lemmingsgatan",
-            ["Läge A", "Läge B", "Läge C"],
-            [
-                new Departure(
-                    "519",
-                    "Heden",
-                    "11:59",
-                    "Trafikolycka vid Partille Centrum. Olyckan ska ha inträffat i höjd med brandstationen och det är oklart om någon är skadad. Polis på väg. Två av bilarna behöver bärgas från platsen. Inga uppgifter om personskador."
-                ),
-                new Departure("58", "Västra Eriksberg", "12:07"),
-            ]
-        );
-
-        testStop.departures[0].timeUpdate("16:50");
-        /* TEST DATA - TO BE REPLACED */
 
         return (
             <>
                 <Header title="Trafikinfo" />
                 <TopMenu>
-                    <StopTitle stop={testStop} />
+                    <StopTitle stop={this.state.stop} />
                 </TopMenu>
                 <MainArea>
-                    <TrafficList departures={testStop.departures} />
+                    <TrafficList departures={this.state.stop.departures} />
                 </MainArea>
             </>
         );

src/components/pages/Travel.js

@@ -7,8 +7,12 @@ import TripSelector from '../TripSelector.js';
 
 import '../css/TripSelector.css';
 
+import globalData from '../../GlobalData.js';
+
 class Travel extends Component {
     render() {
+        globalData.currentPage = this;
+
         return (
             <>
                 <Header title="Reseplanering" />