Add basic statistics with emulator handling
This commit is contained in:
4
dist/index.html
vendored
4
dist/index.html
vendored
@ -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>
|
||||||
|
@ -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
|
||||||
|
@ -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>
|
||||||
|
@ -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 ----------------
|
||||||
|
Reference in New Issue
Block a user