From 31aab818bf326f2ab0f85dae273e748694b5e54b Mon Sep 17 00:00:00 2001
From: Conor McNamara <conormcnamara245@gmail.com>
Date: Tue, 28 Mar 2023 18:51:06 +0100
Subject: [PATCH] Request data on frontend with a loop

---
 src/pages/InsightsPage.vue |  4 ++--
 src/pages/MapPage.vue      | 21 +++++++++++++--------
 2 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/src/pages/InsightsPage.vue b/src/pages/InsightsPage.vue
index 3b7d4da..3425ffb 100644
--- a/src/pages/InsightsPage.vue
+++ b/src/pages/InsightsPage.vue
@@ -11,7 +11,7 @@
       <p class="card-text">Total number of trains: {{ this.insights["totalNumTrains"] }}</p>
             <ul>
                 <li><p class="card-stats">Trains: {{ this.insights["numTrains"] }}</p></li>
-                <li><p class="card-stats">Darts: {{ this.insights["numDarts"] }}</p></li>
+                <li><p class="card-stats">DARTs: {{ this.insights["numDarts"] }}</p></li>
             </ul>
     </div>
   </div>
@@ -23,7 +23,7 @@
       <p class="card-text">Total number of stations: {{ this.insights["totalNumStations"] }}</p>
             <ul>
                 <li><p class="card-stats">Trains: {{ this.insights["numTrainStations"] }}</p></li>
-                <li><p class="card-stats">Darts: {{ this.insights["numDartStations"] }}</p></li>
+                <li><p class="card-stats">DARTs: {{ this.insights["numDartStations"] }}</p></li>
             </ul>     
     </div>
   </div>
diff --git a/src/pages/MapPage.vue b/src/pages/MapPage.vue
index 59eb804..0e632ea 100644
--- a/src/pages/MapPage.vue
+++ b/src/pages/MapPage.vue
@@ -81,9 +81,9 @@
       <dt style="color:red;">Red</dt>
         <dd>Late Train</dd>
       <dt style="color:green;">Green</dt>
-        <dd>Early/On Time Train</dd>
+        <dd>Early/On-Time Train</dd>
       <dt style="color:black;">Black</dt>
-        <dd>Terminated/Not Yet Running Train</dd>
+        <dd>Terminated/Not-Yet Running Train</dd>
     </dl>
   </div>
 </div>
@@ -185,6 +185,7 @@ export default {
           publicMessages: [],
           isPaused: false,
           readyToDisplayMap: false,
+          isFirstGET: true,
           store,
 
           searchinput: "",
@@ -218,6 +219,7 @@ export default {
     
     created() {
         this.readyToDisplayMap = false
+        this.isFirstGET = true
         let host = window.location.hostname
         if (host === '127.0.0.1' || host === 'localhost') {
             this.postTrainAndStationData();
@@ -226,7 +228,7 @@ export default {
             this.getTrainAndStationData();
         }
         // request new data every 60 seconds
-        // window.setInterval(this.getTrainAndStationData, 60000);
+        window.setInterval(this.getTrainAndStationData, 60000);
     },
 
     methods: {
@@ -421,6 +423,9 @@ export default {
                       "numTrainStations": 0,
                       "numDartStations": 0
                     };
+                    
+                    // fill showTrains with the default value - true
+                    if (this.isFirstGET) this.showTrains = new Array(response.data.length).fill(true)
 
                     // create an array of coordinates and hashmap with the key-values {index: JSON obj}
                     for (var i=0; i<response.data.length; i++) {
@@ -429,8 +434,6 @@ export default {
                         this.trainCoordinates[i] = fromLonLat([train["TrainLongitude"][0], train["TrainLatitude"][0]])
                         insights["totalNumTrains"] += 1
 
-                        // fill showTrains with the default value - true
-                        this.showTrains[i] = true;
                         if (train["TrainType"][0] == "Train") insights["numTrains"] += 1;
                         else if (train["TrainType"][0] == "DART") insights["numDarts"] += 1;
 
@@ -465,20 +468,22 @@ export default {
                     getStationData().then((response) => {
                       if (!response.data) throw new Error("Error fetching station from the database");
 
+                      // fill showStations with the default value - true
+                      if (this.isFirstGET) this.showStations = new Array(response.data.length).fill(true)
+
                       for (var i=0; i<response.data.length; i++) {
                         let station = response.data[i];
                         this.allStations[i] = station;
                         this.stationCoordinates[i] = fromLonLat([station["StationLongitude"][0], station["StationLatitude"][0]])
                         insights["totalNumStations"] += 1
 
-                        // setting the station to show on the map by default - true
-                        this.showStations[i] = true; 
                         if (station["StationType"][0] == "DART") insights["numDartStations"] += 1;
                         else if (station["StationType"][0] == "Train") insights["numTrainStations"] += 1;
                       }
 
                       store.setInsights(insights);
-                      // this.loader.hide()
+                      this.isFirstGET = false
+
                       // request the user's preferences
                       this.getPreferences()
                     })