Wersja 1.20.5

Wersja 1.20.5

package.json

@@ -1,6 +1,6 @@
 {
   "name": "stacjownik",
-  "version": "1.20.4",
+  "version": "1.20.5",
   "private": true,
   "scripts": {
     "dev": "vite",

src/App.vue

@@ -47,8 +47,6 @@ import TrainModal from './components/TrainsView/TrainModal.vue';
 import StorageManager from './managers/storageManager';
 import { useApiStore } from './store/apiStore';
 import { Status } from './typings/common';
-import { Websocket } from './typings/api';
-import socket from './websocket';
 
 export default defineComponent({
   components: {
@@ -88,39 +86,7 @@ export default defineComponent({
       this.setReleaseURL();
       this.setupOfflineHandling();
 
-      this.apiStore.setupStaticAPIData();
-      this.connectToWebsocket();
-    },
-
-    async connectToWebsocket() {
-      this.apiStore.dataStatuses.connection = Status.Data.Loading;
-
-      console.log('ws connecting');
-
-      socket.on('connect_error', (err) => {
-        console.error(`WS connection error: ${err.message}`);
-
-        this.apiStore.dataStatuses.connection = Status.Data.Error;
-        this.apiStore.websocketData = undefined;
-      });
-
-      let timeFrom = Date.now();
-      socket.on('connect', () => {
-        socket.emit('CONNECTION', { version: packageInfo.version }, () => {
-          console.log(`Connection time: ${Date.now() - timeFrom}ms`);
-        });
-
-        console.log('ws connected');
-      });
-
-      socket.on('UPDATE', (data: Websocket.Payload) => {
-        console.log('ws update');
-
-        this.apiStore.websocketData = data;
-        this.apiStore.dataStatuses.connection = Status.Data.Loaded;
-      });
-
-      this.fetchWebsocketData();
+      this.apiStore.setupAPIData();
     },
 
     setupOfflineHandling() {
@@ -135,24 +101,14 @@ export default defineComponent({
     handleOfflineMode() {
       this.store.isOffline = true;
 
-      this.apiStore.websocketData = undefined;
+      this.apiStore.activeData = undefined;
       this.apiStore.dataStatuses.connection = Status.Data.Offline;
     },
 
     handleOnlineMode() {
       this.store.isOffline = false;
 
-      this.apiStore.setupStaticAPIData();
-      this.connectToWebsocket();
-    },
-
-    fetchWebsocketData() {
-      socket.emit('FETCH_DATA', (data: Websocket.Payload) => {
-        console.log('ws fetch data');
-
-        this.apiStore.websocketData = data;
-        this.apiStore.dataStatuses.connection = Status.Data.Loaded;
-      });
+      this.apiStore.setupAPIData();
     },
 
     changeLang(lang: string) {

src/components/App/StatusIndicator.vue

@@ -36,11 +36,11 @@
             <circle id="Ellipse 18" cx="15" cy="17" r="7" fill="#393838" />
           </g>
 
-          <g v-if="greenLight" filter="url(#filter0_d_843_28)">
+          <g v-if="indicator.lights.greenLight" filter="url(#filter0_d_843_28)">
             <circle cx="15" cy="17" r="7" fill="#00FF0A" />
           </g>
 
-          <g v-if="greenBlinkLight" filter="url(#filter0_d_843_28)">
+          <g v-if="indicator.lights.greenBlinkLight" filter="url(#filter0_d_843_28)">
             <circle cx="15" cy="17" r="7" fill="#00FF0A" />
 
             <animate
@@ -52,14 +52,14 @@
             />
           </g>
 
-          <g v-if="redTopLight" filter="url(#filter1_d_843_28)">
+          <g v-if="indicator.lights.redTopLight" filter="url(#filter1_d_843_28)">
             <circle cx="15" cy="36" r="7" fill="#F40000" />
           </g>
 
-          <g v-if="orangeLight" filter="url(#filter2_d_843_28)">
+          <g v-if="indicator.lights.orangeLight" filter="url(#filter2_d_843_28)">
             <circle cx="15" cy="55" r="7" fill="#FFB800" />
           </g>
-          <g v-if="redBottomLight" filter="url(#filter3_d_843_28)">
+          <g v-if="indicator.lights.redBottomLight" filter="url(#filter3_d_843_28)">
             <circle cx="15" cy="74" r="7" fill="#F40000" />
 
             <animate
@@ -186,7 +186,11 @@
       </svg>
 
       <transition name="tooltip-anim">
-        <div v-html="$t(indicator.message)" class="indicator-tooltip" v-if="tooltipActive"></div>
+        <div
+          v-html="$t('data-status.' + indicator.message)"
+          class="indicator-tooltip"
+          v-if="tooltipActive"
+        ></div>
       </transition>
     </div>
   </div>
@@ -194,125 +198,112 @@
 
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useMainStore } from '../../store/mainStore';
 import { Status } from '../../typings/common';
 import { useApiStore } from '../../store/apiStore';
+import { APIDataStatus } from '../../typings/api';
+
+interface Indicator {
+  // status: Status.Data;
+  message: string;
+
+  lights: {
+    greenLight: boolean;
+    greenBlinkLight: boolean;
+    redTopLight: boolean;
+    orangeLight: boolean;
+    redBottomLight: boolean;
+  };
+}
 
 export default defineComponent({
   data() {
     return {
       tooltipActive: false,
-      indicator: {
-        offline: false,
-        status: Status.Data.Loading,
-        message: 'data-status.S3'
-      },
-
-      greenLight: false,
-      greenBlinkLight: false,
-      redTopLight: false,
-      orangeLight: false,
-      redBottomLight: false
+      apiStore: useApiStore()
     };
   },
 
-  mounted() {
-    this.setSignalStatus(Status.Data.Loading);
-  },
-
-  setup() {
-    const store = useMainStore();
-    const apiStore = useApiStore();
-
-    return {
-      dataStatus: apiStore.dataStatuses,
-      store
-    };
-  },
-
-  watch: {
-    dataStatus: {
-      deep: true,
-
-      handler(statuses: any) {
-        const connectionStatus = statuses.connection;
-        const sceneryDataStatus = statuses.sceneries;
-        const trainsDataStatus = statuses.trains;
-        const dispatcherDataStatus = statuses.dispatchers;
-
-        if (connectionStatus == Status.Data.Offline) {
-          this.setSignalStatus(Status.Data.Offline);
-          this.indicator.status = Status.Data.Offline;
-          this.indicator.message = 'data-status.S1-offline';
-          return;
-        }
-
-        if (connectionStatus == Status.Data.Error) {
-          this.setSignalStatus(connectionStatus);
-          this.indicator.status = connectionStatus;
-          this.indicator.message = 'data-status.S1a-connection';
-          return;
-        }
-
-        if (sceneryDataStatus == Status.Data.Error) {
-          this.setSignalStatus(sceneryDataStatus);
-          this.indicator.status = sceneryDataStatus;
-          this.indicator.message = 'data-status.S1a-sceneries';
-          return;
-        }
-
-        if (trainsDataStatus == Status.Data.Warning) {
-          this.setSignalStatus(trainsDataStatus);
-          this.indicator.status = trainsDataStatus;
-          this.indicator.message = 'data-status.S5-trains';
-          return;
-        }
-
-        if (dispatcherDataStatus == Status.Data.Warning) {
-          this.setSignalStatus(dispatcherDataStatus);
-          this.indicator.status = dispatcherDataStatus;
-          this.indicator.message = 'data-status.S5-dispatchers';
-          return;
-        }
-
-        if (sceneryDataStatus == Status.Data.Loaded) {
-          this.setSignalStatus(Status.Data.Loaded);
-
-          this.indicator.status = Status.Data.Loaded;
-          this.indicator.message = 'data-status.S2';
-        }
-      }
-    }
-  },
-
   methods: {
-    setSignalStatus(status: Status.Data) {
-      this.greenLight = false;
-      this.greenBlinkLight = false;
-      this.redTopLight = false;
-      this.orangeLight = false;
-      this.redBottomLight = false;
+    setLights(message: string) {
+      let lights = {
+        greenBlinkLight: false,
+        greenLight: false,
+        orangeLight: false,
+        redBottomLight: false,
+        redTopLight: false
+      };
 
-      if (status == Status.Data.Initialized || status == Status.Data.Offline) {
-        this.redTopLight = true;
+      switch (message) {
+        case 'S3':
+          lights.greenBlinkLight = true;
+          break;
+
+        case 'S2':
+          lights.greenLight = true;
+          break;
+
+        case 'S1-offline':
+          lights.redTopLight = true;
+          break;
+
+        case 'S1a-connection':
+        case 'S1a-sceneries':
+          lights.redTopLight = true;
+          lights.redBottomLight = true;
+          break;
+
+        case 'S5-dispatchers':
+        case 'S5-trains':
+          lights.orangeLight = true;
+          break;
+        default:
+          break;
       }
 
-      if (status == Status.Data.Loaded) {
-        this.greenLight = true;
+      return lights;
+    }
+  },
+
+  computed: {
+    indicator(): Indicator {
+      const dataStatuses = this.apiStore.dataStatuses;
+      const swdrStatuses = this.apiStore.activeData?.apiStatuses;
+
+      let message = 'S3';
+
+      switch (dataStatuses.connection) {
+        case Status.Data.Loading:
+          message = 'S3';
+          break;
+        case Status.Data.Loaded:
+          message = 'S2';
+          break;
+        case Status.Data.Offline:
+          message = 'S1-offline';
+          break;
+        case Status.Data.Error:
+          message = 'S1a-connection';
+          break;
+        default:
+          break;
       }
 
-      if (status == Status.Data.Warning) {
-        this.orangeLight = true;
+      if (swdrStatuses?.dispatchersAPI == APIDataStatus.WARNING) {
+        message = 'S5-dispatchers';
       }
 
-      if (status == Status.Data.Error) {
-        this.redTopLight = true;
-        this.redBottomLight = true;
+      if (swdrStatuses?.trainsAPI == APIDataStatus.WARNING) {
+        message = 'S5-trains';
       }
 
-      if (status == Status.Data.Loading) {
-        this.greenBlinkLight = true;
+      if (swdrStatuses?.stationsAPI == APIDataStatus.WARNING) {
+        message = 'S1a-sceneries';
       }
+
+      return {
+        lights: this.setLights(message),
+        message
+      };
     }
   }
 });

src/store/apiStore.ts

@@ -1,18 +1,18 @@
 import { defineStore } from 'pinia';
 import http from '../http';
-import { API, Websocket } from '../typings/api';
+import { API } from '../typings/api';
 import axios from 'axios';
 import { Status } from '../typings/common';
 import { StationJSONData } from './typings';
 
+// Update seconds cron for active data scheduler
+const UPDATE_SECONDS = [3, 23, 43];
+
 export const useApiStore = defineStore('apiStore', {
   state: () => ({
     dataStatuses: {
       connection: Status.Data.Loading,
-      sceneries: Status.Data.Loading,
-      timetables: Status.Data.Loading,
-      dispatchers: Status.Data.Loading,
-      trains: Status.Data.Loading
+      sceneries: Status.Data.Loading
     },
 
     activeData: undefined as API.ActiveData.Response | undefined,
@@ -20,17 +20,45 @@ export const useApiStore = defineStore('apiStore', {
     donatorsData: [] as API.Donators.Response,
     sceneryData: [] as StationJSONData[],
 
-    websocketData: undefined as Websocket.Payload | undefined
-
-    // activeDataTimeout: undefined as number | undefined
+    activeDataScheduler: undefined as number | undefined
   }),
 
   actions: {
-    async setupStaticAPIData() {
+    async setupAPIData() {
       // Static data
       this.fetchStockInfoData();
       this.fetchDonatorsData();
       this.fetchStationsGeneralInfo();
+
+      // Active data schedueler
+      this.fetchActiveData();
+      this.setupActiveDataFetcher();
+    },
+
+    async setupActiveDataFetcher() {
+      if (this.activeDataScheduler) return;
+
+      this.dataStatuses.connection = Status.Data.Loading;
+
+      this.activeDataScheduler = window.setInterval(() => {
+        if (UPDATE_SECONDS.includes(new Date().getSeconds())) {
+          this.fetchActiveData();
+        }
+      }, 1000);
+    },
+
+    async fetchActiveData() {
+      try {
+        const response = await http.get<API.ActiveData.Response>('api/getActiveData');
+
+        this.activeData = response.data;
+        this.dataStatuses.connection = Status.Data.Loaded;
+
+        console.log('Fetching active data at ' + new Date().toLocaleTimeString('pl-PL'));
+      } catch (error) {
+        this.dataStatuses.connection = Status.Data.Error;
+        console.error('Ups! Wystąpił błąd podczas pobierania danych online:', error);
+      }
     },
 
     async fetchDonatorsData() {

src/store/mainStore.ts

@@ -7,7 +7,6 @@ import { OnlineScenery, ScheduledTrain, StoreState } from './typings';
 import { Status } from '../typings/common';
 import Station from '../scripts/interfaces/Station';
 import { useApiStore } from './apiStore';
-import { API } from '../typings/api';
 import { StationRoutes } from '../scripts/interfaces/StationRoutes';
 
 export const useMainStore = defineStore('store', {
@@ -34,7 +33,7 @@ export const useMainStore = defineStore('store', {
     trainList(): Train[] {
       const apiStore = useApiStore();
 
-      return (apiStore.websocketData?.activeTrains ?? [])
+      return (apiStore.activeData?.trains ?? [])
         .filter((train) => train.timetable || train.online)
         .map((train) => {
           const stock = train.stockString.split(';');
@@ -88,9 +87,9 @@ export const useMainStore = defineStore('store', {
       const apiStore = useApiStore();
 
       if (state.isOffline) return [];
-      if (!apiStore.websocketData?.activeSceneries) return [];
+      if (!apiStore.activeData?.activeSceneries) return [];
 
-      return apiStore.websocketData?.activeSceneries.reduce((list, scenery) => {
+      return apiStore.activeData?.activeSceneries.reduce((list, scenery) => {
         if (scenery.isOnline !== 1 && Date.now() - scenery.lastSeen > 1000 * 60 * 2) return list;
         if (scenery.dispatcherStatus == Status.ActiveDispatcher.UNKNOWN) return list;
 

src/typings/api.ts

@@ -1,10 +1,22 @@
 import { Status } from './common';
 
+export enum APIDataStatus {
+  OK = 'OK',
+  WARNING = 'WARNING'
+}
 export namespace API {
   export namespace ActiveData {
+    export interface APIStatuses {
+      stationsAPI: APIDataStatus;
+      trainsAPI: APIDataStatus;
+      dispatchersAPI: APIDataStatus;
+      sceneryRequirementsAPI: APIDataStatus;
+    }
+
     export interface Response {
       activeSceneries?: API.ActiveSceneries.Response;
       trains?: API.ActiveTrains.Response;
+      apiStatuses?: APIStatuses;
     }
   }
   export namespace DispatcherHistory {

src/websocket.ts

@@ -1,14 +0,0 @@
-import { io } from 'socket.io-client';
-
-const URL =
-  import.meta.env.VITE_WS_MODE === 'development'
-    ? 'http://localhost:3001'
-    : 'https://stacjownik.spythere.eu';
-
-const socket = io(URL, {
-  transports: ['websocket', 'polling'],
-  rememberUpgrade: true,
-  reconnection: true
-});
-
-export default socket;