Add basic statistics with emulator handling

This commit is contained in:
Conor McNamara
2023-03-02 12:54:50 +00:00
parent 39a18f4820
commit f7e775188e
4 changed files with 25 additions and 20 deletions

4
dist/index.html vendored
View File

@ -5,8 +5,8 @@
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="/favicon.ico">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Irish Rail Tracker</title> <title>Irish Rail Tracker</title>
<script type="module" crossorigin src="/assets/index-e189e6d8.js"></script> <script type="module" crossorigin src="/assets/index-a9090275.js"></script>
<link rel="stylesheet" href="/assets/index-2cd109ed.css"> <link rel="stylesheet" href="/assets/index-1f27b1b8.css">
</head> </head>
<body> <body>
<div id="app"></div> <div id="app"></div>

View File

@ -18,7 +18,7 @@ exports.getLiveTrainData = functions.https.onRequest((request, response) => {
// fetch the "liveTrainData" collection // fetch the "liveTrainData" collection
admin.firestore().collection('liveTrainData').get().then((snapshot) => { admin.firestore().collection('liveTrainData').get().then((snapshot) => {
if (snapshot.empty) { if (snapshot.empty) {
response.send({data: "Error fetching live train data from the database"}); response.status(404).send({data: "Error fetching live train data from the database"});
return; return;
} }
// iterate through each of the collection's documents // iterate through each of the collection's documents
@ -40,7 +40,7 @@ exports.getStationData = functions.https.onRequest((request, response) => {
// fetch the "stations" collection // fetch the "stations" collection
admin.firestore().collection('stations').get().then((snapshot) => { admin.firestore().collection('stations').get().then((snapshot) => {
if (snapshot.empty) { if (snapshot.empty) {
response.send({data: "Error fetching station data from the database"}) response.status(404).send({data: "Error fetching station data from the database"})
return; return;
} }
// iterate through each of the collection's documents // iterate through each of the collection's documents

View File

@ -2,7 +2,7 @@
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8">
<link rel="icon" href="/favicon.ico"> <link rel="icon" href="./src/assets/train-solid.svg">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Irish Rail Tracker</title> <title>Irish Rail Tracker</title>
</head> </head>

View File

@ -4,9 +4,8 @@
<p>Number of actively running trains: {{ this.numRunningTrains }}</p> <p>Number of actively running trains: {{ this.numRunningTrains }}</p>
<p>Percentage late: {{ this.percentageLate }}%</p> <p>Percentage late: {{ this.percentageLate }}%</p>
<p>Percentage early or ontime: {{ this.percentageEarly }}%</p> <p>Percentage early or ontime: {{ this.percentageEarly }}%</p>
<p v-if="this.latestTrain['TrainCode']">Latest train: {{ this.latestTrain["TrainCode"][0] }}, {{ this.latestTrain["Direction"][0] }}, {{ this.latestTime }} mins late</p>
<p>Latest train: {{ this.latestTrain["TrainCode"][0] }}, {{ this.latestTrain["Direction"][0] }}, {{ this.latestTime }} mins late</p> <p v-if="this.earliestTrain['TrainCode']">Earliest train: {{ this.earliestTrain["TrainCode"][0] }}, {{ this.earliestTrain["Direction"][0] }}, {{ this.earliestTime * -1 }} mins early</p>
<p>Earliest train: {{ this.earliestTrain["TrainCode"][0] }}, {{ this.earliestTrain["Direction"][0] }}, {{ this.earliestTime * -1 }} mins early</p>
<button @click="getLiveTrainData">Fetch Data</button> <button @click="getLiveTrainData">Fetch Data</button>
<button @click="postLiveTrainData">Populate Database</button> <button @click="postLiveTrainData">Populate Database</button>
@ -32,7 +31,7 @@
</div> </div>
</transition> </transition>
<ol-map :loadTilesWhileAnimating="true" :loadTilesWhileInteracting="true" style="height: 1000px"> <ol-map :loadTilesWhileAnimating="true" :loadTilesWhileInteracting="true" style="height: 100vh; width: 100vw">
<ol-view ref="view" :center="center" :rotation="rotation" :zoom="zoom" :projection="projection" /> <ol-view ref="view" :center="center" :rotation="rotation" :zoom="zoom" :projection="projection" />
<ol-tile-layer> <ol-tile-layer>
<ol-source-osm /> <ol-source-osm />
@ -78,6 +77,7 @@ export default {
strokeWidth, strokeWidth,
strokeColor, strokeColor,
fillColor, fillColor,
coordinates: [], coordinates: [],
dbLiveTrainData: [], dbLiveTrainData: [],
allDataMap: {}, allDataMap: {},
@ -97,9 +97,12 @@ export default {
}, },
created() { created() {
// initial request of data if (window.location.hostname === '127.0.0.1' || window.location.hostname === 'localhost') {
this.getLiveTrainData() this.postLiveTrainData()
}
else {
this.getLiveTrainData()
}
// request new data every 60 seconds // request new data every 60 seconds
// window.setInterval(this.getLiveTrainData, 60000); // window.setInterval(this.getLiveTrainData, 60000);
}, },
@ -108,8 +111,9 @@ export default {
// fetch live train data from the Firestore database // fetch live train data from the Firestore database
getLiveTrainData() { getLiveTrainData() {
const functions = getFunctions(app); const functions = getFunctions(app);
if (window.location.hostname === '127.0.0.1') { let host = window.location.hostname
connectFunctionsEmulator(functions, "localhost", 5001); if (host === '127.0.0.1' || host === 'localhost') {
connectFunctionsEmulator(functions, host, 5001);
} }
const getData = httpsCallable(functions, 'getLiveTrainData'); const getData = httpsCallable(functions, 'getLiveTrainData');
let loader = this.$loading.show({ let loader = this.$loading.show({
@ -121,10 +125,11 @@ export default {
getData().then((response) => { getData().then((response) => {
try { try {
this.dbLiveTrainData = response.data; this.dbLiveTrainData = response.data;
console.log(this.dbLiveTrainData)
this.numRunningTrains = 0; this.numRunningTrains = 0;
this.numTrains = 0; this.numTrains = 0;
this.numLateRunningTrains = 0; this.numLateRunningTrains = 0;
var latest = null var latest = null
var currLatestTime = 0 var currLatestTime = 0
var earliest = null var earliest = null
@ -134,7 +139,7 @@ export default {
for(var i=0; i<this.dbLiveTrainData.length; i++) { for(var i=0; i<this.dbLiveTrainData.length; i++) {
this.coordinates[i] = ref(fromLonLat([this.dbLiveTrainData[i]["TrainLongitude"][0], this.dbLiveTrainData[i]["TrainLatitude"][0]])) this.coordinates[i] = ref(fromLonLat([this.dbLiveTrainData[i]["TrainLongitude"][0], this.dbLiveTrainData[i]["TrainLatitude"][0]]))
this.allDataMap[i] = this.dbLiveTrainData[i]; this.allDataMap[i] = this.dbLiveTrainData[i];
// check if the train is running // check if the train is running
if (this.dbLiveTrainData[i]["TrainStatus"][0] == "R") { if (this.dbLiveTrainData[i]["TrainStatus"][0] == "R") {
this.numRunningTrains += 1; this.numRunningTrains += 1;
@ -178,7 +183,6 @@ export default {
this.percentageLate = ((this.numLateRunningTrains / this.numRunningTrains) * 100).toFixed(2); this.percentageLate = ((this.numLateRunningTrains / this.numRunningTrains) * 100).toFixed(2);
this.percentageEarly = 100 - this.percentageLate; this.percentageEarly = 100 - this.percentageLate;
this.numTrains = Object.keys(this.allDataMap).length; this.numTrains = Object.keys(this.allDataMap).length;
this.latestTrain = latest; this.latestTrain = latest;
this.earliestTrain = earliest; this.earliestTrain = earliest;
this.latestTime = currLatestTime; this.latestTime = currLatestTime;
@ -206,13 +210,14 @@ export default {
// ---------------- TESTING ---------------- // ---------------- TESTING ----------------
postLiveTrainData() { postLiveTrainData() {
const functions = getFunctions(app); const functions = getFunctions(app);
if (window.location.hostname === '127.0.0.1') { let host = window.location.hostname
connectFunctionsEmulator(functions, "localhost", 5001); if (host === '127.0.0.1' || host === 'localhost') {
connectFunctionsEmulator(functions, host, 5001);
} }
const postData = httpsCallable(functions, 'postLiveTrainData'); const postData = httpsCallable(functions, 'postLiveTrainData');
postData().then((response) => { postData().then((response) => {
console.log("Test") this.getLiveTrainData()
}) })
} }
// ---------------- TESTING ---------------- // ---------------- TESTING ----------------