Merge pull request #74 from 0hAodha/loopedFrontendGET

Request data on frontend with a loop
This commit is contained in:
2023-03-29 07:48:46 +01:00
committed by GitHub
2 changed files with 15 additions and 10 deletions

View File

@ -11,7 +11,7 @@
<p class="card-text">Total number of trains: {{ this.insights["totalNumTrains"] }}</p> <p class="card-text">Total number of trains: {{ this.insights["totalNumTrains"] }}</p>
<ul> <ul>
<li><p class="card-stats">Trains: {{ this.insights["numTrains"] }}</p></li> <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> </ul>
</div> </div>
</div> </div>
@ -23,7 +23,7 @@
<p class="card-text">Total number of stations: {{ this.insights["totalNumStations"] }}</p> <p class="card-text">Total number of stations: {{ this.insights["totalNumStations"] }}</p>
<ul> <ul>
<li><p class="card-stats">Trains: {{ this.insights["numTrainStations"] }}</p></li> <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> </ul>
</div> </div>
</div> </div>

View File

@ -81,9 +81,9 @@
<dt style="color:red;">Red</dt> <dt style="color:red;">Red</dt>
<dd>Late Train</dd> <dd>Late Train</dd>
<dt style="color:green;">Green</dt> <dt style="color:green;">Green</dt>
<dd>Early/On Time Train</dd> <dd>Early/On-Time Train</dd>
<dt style="color:black;">Black</dt> <dt style="color:black;">Black</dt>
<dd>Terminated/Not Yet Running Train</dd> <dd>Terminated/Not-Yet Running Train</dd>
</dl> </dl>
</div> </div>
</div> </div>
@ -185,6 +185,7 @@ export default {
publicMessages: [], publicMessages: [],
isPaused: false, isPaused: false,
readyToDisplayMap: false, readyToDisplayMap: false,
isFirstGET: true,
store, store,
searchinput: "", searchinput: "",
@ -218,6 +219,7 @@ export default {
created() { created() {
this.readyToDisplayMap = false this.readyToDisplayMap = false
this.isFirstGET = true
let host = window.location.hostname let host = window.location.hostname
if (host === '127.0.0.1' || host === 'localhost') { if (host === '127.0.0.1' || host === 'localhost') {
this.postTrainAndStationData(); this.postTrainAndStationData();
@ -226,7 +228,7 @@ export default {
this.getTrainAndStationData(); this.getTrainAndStationData();
} }
// request new data every 60 seconds // request new data every 60 seconds
// window.setInterval(this.getTrainAndStationData, 60000); window.setInterval(this.getTrainAndStationData, 60000);
}, },
methods: { methods: {
@ -421,6 +423,9 @@ export default {
"numTrainStations": 0, "numTrainStations": 0,
"numDartStations": 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} // create an array of coordinates and hashmap with the key-values {index: JSON obj}
for (var i=0; i<response.data.length; i++) { 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]]) this.trainCoordinates[i] = fromLonLat([train["TrainLongitude"][0], train["TrainLatitude"][0]])
insights["totalNumTrains"] += 1 insights["totalNumTrains"] += 1
// fill showTrains with the default value - true
this.showTrains[i] = true;
if (train["TrainType"][0] == "Train") insights["numTrains"] += 1; if (train["TrainType"][0] == "Train") insights["numTrains"] += 1;
else if (train["TrainType"][0] == "DART") insights["numDarts"] += 1; else if (train["TrainType"][0] == "DART") insights["numDarts"] += 1;
@ -465,20 +468,22 @@ export default {
getStationData().then((response) => { getStationData().then((response) => {
if (!response.data) throw new Error("Error fetching station from the database"); 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++) { for (var i=0; i<response.data.length; i++) {
let station = response.data[i]; let station = response.data[i];
this.allStations[i] = station; this.allStations[i] = station;
this.stationCoordinates[i] = fromLonLat([station["StationLongitude"][0], station["StationLatitude"][0]]) this.stationCoordinates[i] = fromLonLat([station["StationLongitude"][0], station["StationLatitude"][0]])
insights["totalNumStations"] += 1 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; if (station["StationType"][0] == "DART") insights["numDartStations"] += 1;
else if (station["StationType"][0] == "Train") insights["numTrainStations"] += 1; else if (station["StationType"][0] == "Train") insights["numTrainStations"] += 1;
} }
store.setInsights(insights); store.setInsights(insights);
// this.loader.hide() this.isFirstGET = false
// request the user's preferences // request the user's preferences
this.getPreferences() this.getPreferences()
}) })