Merge pull request #69 from Spythere/development

Wersja 1.19.1
bump 1.19.1
2026-05-03 05:18:11 +00:00 · 2023-12-02 23:04:55 +01:00 · 2023-12-02 23:04:24 +01:00 · 2023-12-02 23:02:08 +01:00 · 2023-12-02 18:31:58 +01:00 · 2023-12-02 18:15:52 +01:00
113 changed files with 7390 additions and 19461 deletions
@@ -1,11 +1,14 @@
-<!DOCTYPE html>
+<!doctype html>
 <html lang="pl">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width,initial-scale=1.0" />
-    <meta name="keywords" content="Stacjownik, TD2, Train Driver 2, stacjownik-td2, stacjownik, td2.info.pl" />
+    <meta
      name="keywords"
      content="Stacjownik, TD2, Train Driver 2, stacjownik-td2, stacjownik, td2.info.pl"
    />
    <meta name="description" content="Pomocnik maszynisty i dyżurnego symulatora Train Driver 2" />
    <title>Stacjownik</title>
@@ -18,10 +21,6 @@
    <meta name="msapplication-TileColor" content="#da532c" />
    <meta name="theme-color" content="#222222" />
    <link rel="icon" href="favicon-64.png" sizes="64x64" type="image/png" />
    <link rel="icon" href="favicon-62.png" sizes="62x62" type="image/png" />
    <link rel="icon" href="favicon-32.png" sizes="32x32" type="image/png" />
    <link rel="icon" href="favicon-16.png" sizes="16x16" type="image/png" />
    <link rel="icon" href="favicon.ico" />
    <!-- Static OpenGraph meta -->
@@ -29,18 +28,33 @@
    <meta property="og:url" content="https://stacjownik-td2.web.app/" />
    <meta property="og:type" content="website" />
    <meta property="og:title" content="Stacjownik" />
-    <meta property="og:description" content="Pomocnik maszynisty i dyżurnego symulatora Train Driver 2" />
+    <meta
-    <meta property="og:image" content="https://raw.githubusercontent.com/Spythere/api/main/thumbnails/stacjownik.jpg" />
+      property="og:description"
      content="Pomocnik maszynisty i dyżurnego symulatora Train Driver 2"
    />
    <meta
      property="og:image"
      content="https://raw.githubusercontent.com/Spythere/api/main/thumbnails/stacjownik.jpg"
    />
    <meta property="og:image:width" content="1200" />
    <meta property="og:image:height" content="630" />
    <meta property="og:site_name" content="Stacjownik" />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:title" content="Stacjownik" />
-    <meta name="twitter:description" content="Pomocnik maszynisty i dyżurnego symulatora Train Driver 2" />
+    <meta
-    <meta name="twitter:image" content="https://raw.githubusercontent.com/Spythere/api/main/thumbnails/stacjownik.jpg" />
+      name="twitter:description"
      content="Pomocnik maszynisty i dyżurnego symulatora Train Driver 2"
    />
    <meta
      name="twitter:image"
      content="https://raw.githubusercontent.com/Spythere/api/main/thumbnails/stacjownik.jpg"
    />
-    <link href="https://fonts.googleapis.com/css2?family=Quicksand:wght@500;700&display=swap" rel="stylesheet" />
+    <link
      href="https://fonts.googleapis.com/css2?family=Quicksand:wght@500;700&display=swap"
      rel="stylesheet"
    />
  </head>
  <body>
@@ -1,6 +1,6 @@
 {
  "name": "stacjownik",
-  "version": "1.18.1",
+  "version": "1.19.1",
  "private": true,
  "scripts": {
    "dev": "vite",
@@ -18,27 +18,26 @@
    "howler": "^2.2.4",
    "pinia": "^2.1.6",
    "sass": "^1.67.0",
    "socket.io-client": "^4.7.2",
    "vue": "^3.3.4",
    "vue-i18n": "^9.4.1",
    "vue-router": "^4.2.4"
  },
  "devDependencies": {
    "@rushstack/eslint-patch": "^1.3.3",
    "@types/node": "^20.6.2",
    "@vite-pwa/assets-generator": "^0.0.10",
    "@vitejs/plugin-vue": "^4.3.4",
    "@vue/eslint-config-prettier": "^8.0.0",
    "@vue/eslint-config-typescript": "^12.0.0",
    "@vue/tsconfig": "^0.4.0",
    "axios": "^1.5.0",
    "eslint": "^8.49.0",
    "eslint-plugin-vue": "^9.17.0",
    "prettier": "^3.0.3",
    "typescript": "^5.2.2",
    "vite": "^4.4.9",
    "vite-plugin-pwa": "^0.16.5",
-    "vue-tsc": "^1.8.11",
+    "vue-tsc": "^1.8.11"
    "@vue/eslint-config-prettier": "^8.0.0",
    "@vue/eslint-config-typescript": "^12.0.0",
    "@vue/tsconfig": "^0.4.0",
    "eslint": "^8.49.0",
    "eslint-plugin-vue": "^9.17.0",
    "@rushstack/eslint-patch": "^1.3.3"
  },
  "browserslist": [
    "> 1%",
@@ -0,0 +1,56 @@
 <?xml version="1.0" encoding="utf-8"?>
 <!-- Generator: Adobe Illustrator 24.3.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
 <svg version="1.1" id="Warstwa_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
 	 viewBox="0 0 159 38.8" style="enable-background:new 0 0 159 38.8;" xml:space="preserve">
 <style type="text/css">
 	.st0{fill:#00A962;}
 	.st1{enable-background:new    ;}
 	.st2{fill:#FFFFFF;}
 	.st3{fill:#1E3A33;}
 	.st4{fill-rule:evenodd;clip-rule:evenodd;fill:#FFFFFF;}
 </style>
 <path class="st0" d="M139.6,38.7H19.4C8.7,38.7,0,30.1,0,19.3l0,0C0,8.6,8.7-0.1,19.4-0.1h120.2c10.7,0,19.4,8.7,19.4,19.4l0,0
 	C159,30.1,150.3,38.7,139.6,38.7z"/>
 <g class="st1">
 	<path class="st2" d="M48.9,23.7c0,0.5-0.4,0.9-0.9,0.9c-0.5,0-0.9-0.4-0.9-0.9v-9.9c0-0.6,0.4-1,1-1h3.7c2.5,0,3.6,1.9,3.6,3.7
 		s-1,3.7-3.6,3.7h-2.9V23.7z M48.9,14.5v4.1h2.8c1.3,0,1.9-1,1.9-2c0-1-0.5-2.1-1.8-2.1H48.9z"/>
 	<path class="st2" d="M56.3,20.5c0-2.5,1.9-4.1,4.1-4.1c2.3,0,4.2,1.6,4.2,4.1c0,2.5-1.9,4.2-4.2,4.2C58.2,24.7,56.3,23,56.3,20.5z
 		 M62.9,20.5c0-1.5-1.1-2.4-2.4-2.4c-1.3,0-2.4,1-2.4,2.4c0,1.5,1.1,2.5,2.4,2.5C61.8,23,62.9,22,62.9,20.5z"/>
 	<path class="st2" d="M66.6,21.9c0.4-0.2,0.7,0.1,0.9,0.3c0.3,0.6,0.9,1,1.7,1c0.8,0,1.4-0.4,1.4-1c0-0.5-0.5-0.7-1.1-0.9l-1.1-0.3
 		c-1.7-0.5-2.3-1.4-2.2-2.7c0.1-1.2,1.4-2.1,2.8-2.1c1.1,0,2,0.3,2.5,1.2c0.2,0.4,0.1,0.8-0.2,1c-0.3,0.2-0.6,0.2-1-0.1
 		c-0.4-0.4-1-0.5-1.4-0.5c-0.4,0-0.9,0.2-1.1,0.4c-0.1,0.2-0.2,0.4-0.1,0.7c0.1,0.3,0.6,0.5,1,0.6l1.2,0.3c1.7,0.4,2.1,1.5,2.1,2.3
 		c0,1.5-1.3,2.4-3.2,2.4c-1.2,0-2.5-0.6-2.9-1.8C66,22.5,66.2,22.1,66.6,21.9z"/>
 	<path class="st2" d="M74.6,18h-0.8c-0.4,0-0.7-0.3-0.7-0.7c0-0.4,0.3-0.7,0.7-0.7h0.8v-2.2c0-0.5,0.4-0.9,0.9-0.9
 		c0.5,0,0.9,0.4,0.9,0.9v2.2h1c0.4,0,0.7,0.3,0.7,0.7c0,0.4-0.3,0.7-0.7,0.7h-1v5.7c0,0.5-0.4,0.9-0.9,0.9c-0.5,0-0.9-0.4-0.9-0.9
 		V18z"/>
 	<path class="st2" d="M85.7,23.4c-0.5,0.9-1.7,1.3-2.7,1.3c-2.1,0-4-1.6-4-4.1c0-2.5,1.9-4.1,4-4.1c1,0,2.1,0.4,2.7,1.3v-0.3
 		c0-0.5,0.4-0.9,0.9-0.9c0.5,0,0.9,0.4,0.9,0.9v6.3c0,0.5-0.4,0.9-0.9,0.9c-0.5,0-0.9-0.4-0.9-0.9V23.4z M83.2,23
 		c1.3,0,2.4-0.9,2.4-2.5c0-1.6-1.3-2.4-2.4-2.4c-1.3,0-2.4,1-2.4,2.4C80.8,22,81.9,23,83.2,23z"/>
 	<path class="st2" d="M95.1,16.6c0.5,0,0.9,0.3,1,0.8l1.6,4.6l1.7-4.8c0.2-0.5,0.6-0.7,1.1-0.6c0.5,0.1,0.7,0.6,0.6,1.1l-2.4,6.3
 		c-0.2,0.5-0.5,0.7-0.9,0.7h-0.1c-0.4,0-0.7-0.2-0.9-0.7L95.1,19l-1.7,4.9c-0.2,0.5-0.5,0.7-0.9,0.7h-0.1c-0.4,0-0.7-0.2-0.9-0.7
 		l-2.4-6.3c-0.2-0.4,0.1-1,0.6-1.1c0.5-0.1,0.9,0.1,1.1,0.6l1.7,4.8l1.6-4.6C94.2,16.8,94.6,16.6,95.1,16.6L95.1,16.6z"/>
 	<path class="st2" d="M112.9,23.2c0.3,0.3,0.3,0.9,0,1.2c-0.4,0.3-0.9,0.3-1.2,0l-3.2-3.5v2.9c0,0.5-0.4,0.9-0.9,0.9
 		c-0.5,0-0.8-0.4-0.8-0.9V13.1c0-0.5,0.4-0.9,0.8-0.9c0.5,0,0.9,0.4,0.9,0.9v6.1l2.4-2.4c0.3-0.3,0.9-0.3,1.2,0
 		c0.3,0.4,0.3,0.9,0,1.2l-2,2.1L112.9,23.2z"/>
 	<path class="st2" d="M120.8,23.4c-0.5,0.9-1.7,1.3-2.7,1.3c-2.1,0-4-1.6-4-4.1c0-2.5,1.9-4.1,4-4.1c1,0,2.1,0.4,2.7,1.3v-0.3
 		c0-0.5,0.4-0.9,0.8-0.9c0.5,0,0.9,0.4,0.9,0.9v6.3c0,0.5-0.4,0.9-0.9,0.9c-0.5,0-0.8-0.4-0.8-0.9V23.4z M118.4,23
 		c1.3,0,2.4-0.9,2.4-2.5c0-1.6-1.3-2.4-2.4-2.4c-1.3,0-2.4,1-2.4,2.4C115.9,22,117,23,118.4,23z"/>
 	<path class="st2" d="M130.3,16.6c0.5,0,0.9,0.3,1,0.8l1.6,4.6l1.7-4.8c0.2-0.5,0.6-0.7,1.1-0.6c0.5,0.1,0.7,0.6,0.6,1.1l-2.4,6.3
 		c-0.2,0.5-0.5,0.7-0.9,0.7h-0.1c-0.4,0-0.7-0.2-0.9-0.7l-1.7-4.9l-1.7,4.9c-0.2,0.5-0.5,0.7-0.9,0.7h-0.1c-0.4,0-0.7-0.2-0.9-0.7
 		l-2.4-6.3c-0.2-0.4,0.1-1,0.6-1.1c0.5-0.1,0.9,0.1,1.1,0.6l1.7,4.8l1.6-4.6C129.3,16.8,129.7,16.6,130.3,16.6L130.3,16.6z"/>
 	<path class="st2" d="M143.6,26.1c0,0.2,0.2,0.5,0.6,0.5c0.1,0,0.4,0,0.5-0.4c0.1-0.4,0.3-0.5,0.7-0.5c0.4,0.1,0.6,0.4,0.5,0.8
 		c-0.2,0.8-0.9,1.4-1.7,1.4c-1.3,0-1.9-0.8-1.9-1.7c0-0.2,0.1-0.6,0.2-0.8l0.5-1c-0.5,0.2-1,0.3-1.6,0.3c-2.3,0-4.1-1.6-4.1-4.2
 		c0-2.5,1.8-4.1,4.1-4.1c2.2,0,3.9,1.5,4,4c0,0.5-0.4,0.8-0.8,0.8h-5.5c0.2,1.2,1.2,2,2.4,2c0.8,0,1.3-0.3,1.9-0.8
 		c0.3-0.2,0.8-0.4,1.1-0.1c0.3,0.3,0.2,0.7,0,1.1C143.5,25.9,143.6,26.1,143.6,26.1z M143.7,19.9c-0.2-1.2-1.1-2-2.3-2
 		c-1.2,0-2.2,0.7-2.3,2H143.7z"/>
 </g>
 <g>
 	<path class="st3" d="M21.6,26.7c-4.9,0-7.4-2.6-8.5-4.9c-1.2-2.4-1.4-5-1.4-6c0-2.2,1.8-3.8,4.3-3.8h7c0.7,0,1.3,0.6,1.3,1.3
 		c0,0.7-0.6,1.3-1.3,1.3h-7c-0.5,0-1,0.1-1.3,0.4c-0.3,0.2-0.4,0.4-0.4,0.8c0,1.9,0.5,8.3,7.3,8.3c5.8,0,7.3-4.6,7.9-8.1
 		c0-0.2,0-0.3,0.1-0.4c0.2-0.9,0.4-1.7,0.8-2.3C31,12.4,31.9,12,33,12c0.5,0,0.9,0.2,1.2,0.5c0.5,0.4,0.9,1.3,1.2,4.1
 		c0.1,1.4,0.1,2.6,0.1,2.7c0,0.7-0.6,1.3-1.3,1.3l0,0c-0.7,0-1.3-0.6-1.3-1.3c0,0,0-1.1-0.1-2.3c-0.1-1-0.2-1.7-0.3-2.1
 		c-0.1,0.3-0.2,0.9-0.3,1.1c0,0.1,0,0.2-0.1,0.4c-0.2,1.2-0.7,3.7-2.1,5.9c-0.8,1.3-1.9,2.3-3.2,3.1C25.4,26.3,23.6,26.7,21.6,26.7z
 		"/>
 	<ellipse class="st4" cx="26.7" cy="13.3" rx="1.3" ry="1.3"/>
 </g>
 </svg>
@@ -0,0 +1,18 @@
 <svg width="256" height="213" viewBox="0 0 256 213" fill="none" xmlns="http://www.w3.org/2000/svg">
 <g filter="url(#filter0_d_1571_41)">
 <path d="M217.048 55.9333L238 80.4039L128 194.6L18 80.4039L38.9524 55.9333L71.6905 18.6H128H184.31L217.048 55.9333Z" fill="#F47FFF"/>
 <path d="M238 80.4039L217.048 55.9333L184.31 18.6M238 80.4039L128 194.6M238 80.4039H164.536M128 194.6L18 80.4039M128 194.6L91.4641 80.4039M128 194.6L164.536 80.4039M184.31 18.6H128M184.31 18.6L164.536 80.4039M18 80.4039L38.9524 55.9333L71.6905 18.6M18 80.4039H91.4641M71.6905 18.6L91.4641 80.4039M71.6905 18.6H128M91.4641 80.4039H128H164.536M91.4641 80.4039L128 18.6M128 18.6L164.536 80.4039" stroke="#ECECEC" stroke-width="7.45763" stroke-linejoin="round"/>
 </g>
 <defs>
 <filter id="filter0_d_1571_41" x="0.367179" y="0.967155" width="255.266" height="211.266" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
 <feFlood flood-opacity="0" result="BackgroundImageFix"/>
 <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
 <feOffset/>
 <feGaussianBlur stdDeviation="6.952"/>
 <feComposite in2="hardAlpha" operator="out"/>
 <feColorMatrix type="matrix" values="0 0 0 0 0.956863 0 0 0 0 0.498039 0 0 0 0 1 0 0 0 1 0"/>
 <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_1571_41"/>
 <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_1571_41" result="shape"/>
 </filter>
 </defs>
 </svg>
@@ -1 +0,0 @@
 <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="18px" height="18px"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.09V20h-2.67v-1.93c-1.71-.36-3.16-1.46-3.27-3.4h1.96c.1 1.05.82 1.87 2.65 1.87 1.96 0 2.4-.98 2.4-1.59 0-.83-.44-1.61-2.67-2.14-2.48-.6-4.18-1.62-4.18-3.67 0-1.72 1.39-2.84 3.11-3.21V4h2.67v1.95c1.86.45 2.79 1.86 2.85 3.39H14.3c-.05-1.11-.64-1.87-2.22-1.87-1.5 0-2.4.68-2.4 1.64 0 .84.65 1.39 2.67 1.91s4.18 1.39 4.18 3.91c-.01 1.83-1.38 2.83-3.12 3.16z"/></svg>
@@ -1,3 +1 @@
-<svg width="144" height="144" viewBox="0 0 144 144" fill="none" xmlns="http://www.w3.org/2000/svg">
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="18px" height="18px"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.09V20h-2.67v-1.93c-1.71-.36-3.16-1.46-3.27-3.4h1.96c.1 1.05.82 1.87 2.65 1.87 1.96 0 2.4-.98 2.4-1.59 0-.83-.44-1.61-2.67-2.14-2.48-.6-4.18-1.62-4.18-3.67 0-1.72 1.39-2.84 3.11-3.21V4h2.67v1.95c1.86.45 2.79 1.86 2.85 3.39H14.3c-.05-1.11-.64-1.87-2.22-1.87-1.5 0-2.4.68-2.4 1.64 0 .84.65 1.39 2.67 1.91s4.18 1.39 4.18 3.91c-.01 1.83-1.38 2.83-3.12 3.16z"/></svg>
 <path d="M67.4283 9.79351L67.8252 31.2232H79.5983L79.8628 9.79351H67.4283ZM67.8252 110.989L67.4283 132.816H79.8628L79.466 110.989H67.8252ZM91.6359 51.33L103.938 43.7899C102.439 40.527 100.322 37.3963 97.5886 34.3979C94.9429 31.3995 91.5918 28.9303 87.5352 26.9901C83.5667 25.05 78.8046 24.0799 73.2487 24.0799C67.6929 24.0799 62.7103 25.1382 58.3009 27.2547C53.8915 29.3712 50.4081 32.1932 47.8506 35.7207C45.3814 39.2483 44.1467 43.1726 44.1467 47.4938C44.1467 51.9032 44.9404 55.6512 46.5278 58.7378C48.1152 61.8243 50.1435 64.47 52.6128 66.6747C55.082 68.7912 57.6836 70.5549 60.4174 71.9659C63.2394 73.2888 65.7969 74.347 68.0897 75.1407C71.6173 76.4635 74.9243 77.8745 78.0109 79.3737C81.1856 80.8729 83.7431 82.7249 85.6832 84.9296C87.7115 87.0461 88.7257 89.824 88.7257 93.2633C88.7257 95.9089 88.1966 98.2018 87.1383 100.142C86.1683 101.994 84.625 103.405 82.5085 104.375C80.4801 105.345 77.8786 105.83 74.7038 105.83C71.0881 105.83 67.8693 105.08 65.0473 103.581C62.3134 102.082 59.8001 99.9215 57.5072 97.0995C55.2143 94.2775 53.0978 90.8381 51.1577 86.7815L39.12 94.5861C41.0602 99.3483 43.7499 103.581 47.1892 107.285C50.6286 110.989 54.6411 113.943 59.2269 116.148C63.8126 118.265 68.7512 119.323 74.0424 119.323C80.6565 119.323 86.2564 118.265 90.8422 116.148C95.428 113.943 98.9555 110.813 101.425 106.756C103.894 102.699 105.129 97.9814 105.129 92.6019C105.129 88.4571 104.423 84.8414 103.012 81.7548C101.601 78.6682 99.7492 76.0667 97.4563 73.9502C95.1634 71.7455 92.606 69.8935 89.784 68.3943C87.0501 66.8951 84.3604 65.6605 81.7148 64.6904C78.0109 63.2794 74.5275 61.8684 71.2645 60.4574C68.0016 59.0464 65.3559 57.3709 63.3276 55.4307C61.2993 53.4906 60.2851 51.0213 60.2851 48.0229C60.2851 45.7301 60.7261 43.7899 61.6079 42.2025C62.578 40.527 64.0331 39.2483 65.9732 38.3664C68.0016 37.4845 70.559 37.0436 73.6456 37.0436C76.644 37.0436 79.2455 37.705 81.4502 39.0278C83.6549 40.3506 85.5509 42.1144 87.1383 44.319C88.8139 46.4356 90.3131 48.7725 91.6359 51.33Z" fill="white"/>
 </svg>
@@ -0,0 +1,48 @@
 <svg width="512" height="512" viewBox="0 0 512 512" fill="none" xmlns="http://www.w3.org/2000/svg">
 <rect width="512" height="512" rx="256" fill="#121212"/>
 <rect x="325.818" y="405.665" width="7.11086" height="143.867" rx="3.55543" transform="rotate(90 325.818 405.665)" fill="white"/>
 <rect x="361.785" y="430.553" width="10.6663" height="208.608" rx="5.33314" transform="rotate(90 361.785 430.553)" fill="white"/>
 <g filter="url(#filter0_d_272_208)">
 <rect width="25.0328" height="117.468" rx="12.5164" transform="matrix(0.711174 0.703016 -0.711174 0.703016 211.54 363)" fill="white"/>
 </g>
 <g filter="url(#filter1_d_272_208)">
 <rect width="25.0328" height="117.468" rx="12.5164" transform="matrix(-0.711174 0.703016 0.711174 0.703016 300.46 363)" fill="white"/>
 </g>
 <g filter="url(#filter2_d_272_208)">
 <rect x="139.352" y="65.4912" width="232.66" height="325.893" rx="41.5866" stroke="#7A7A7A" stroke-width="8.31733"/>
 <path fill-rule="evenodd" clip-rule="evenodd" d="M135.193 107.078C135.193 81.8134 155.674 61.3325 180.938 61.3325H330.425C355.69 61.3325 376.171 81.8134 376.171 107.078V349.797C376.171 375.062 355.69 395.543 330.426 395.543H180.938C155.674 395.543 135.193 375.062 135.193 349.797V107.078ZM208.217 338.656C208.217 352.401 196.774 363.544 182.659 363.544C168.543 363.544 157.1 352.401 157.1 338.656C157.1 324.91 168.543 313.768 182.659 313.768C196.774 313.768 208.217 324.91 208.217 338.656ZM328.706 363.544C342.821 363.544 354.264 352.401 354.264 338.656C354.264 324.91 342.821 313.768 328.706 313.768C314.591 313.768 303.148 324.91 303.148 338.656C303.148 352.401 314.591 363.544 328.706 363.544ZM248.38 136.323C248.38 132.07 244.932 128.622 240.679 128.622H164.802C160.549 128.622 157.101 132.07 157.101 136.323V203.223C157.101 207.476 160.549 210.924 164.802 210.924H240.679C244.932 210.924 248.38 207.476 248.38 203.223V136.323ZM346.563 128.622C350.817 128.622 354.265 132.07 354.265 136.323V203.223C354.265 207.476 350.817 210.924 346.563 210.924H270.686C266.433 210.924 262.985 207.476 262.985 203.223V136.323C262.985 132.07 266.433 128.622 270.686 128.622H346.563Z" fill="white"/>
 <ellipse cx="255.682" cy="64.888" rx="25.5582" ry="24.888" fill="#F3F1F1"/>
 </g>
 <defs>
 <filter id="filter0_d_272_208" x="106.676" y="341.617" width="143.99" height="142.947" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
 <feFlood flood-opacity="0" result="BackgroundImageFix"/>
 <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
 <feOffset/>
 <feGaussianBlur stdDeviation="13.269"/>
 <feComposite in2="hardAlpha" operator="out"/>
 <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
 <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_272_208"/>
 <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_272_208" result="shape"/>
 </filter>
 <filter id="filter1_d_272_208" x="261.334" y="341.617" width="143.99" height="142.947" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
 <feFlood flood-opacity="0" result="BackgroundImageFix"/>
 <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
 <feOffset/>
 <feGaussianBlur stdDeviation="13.269"/>
 <feComposite in2="hardAlpha" operator="out"/>
 <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
 <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_272_208"/>
 <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_272_208" result="shape"/>
 </filter>
 <filter id="filter2_d_272_208" x="110.241" y="15.048" width="290.882" height="405.446" filterUnits="userSpaceOnUse" color-interpolation-filters="sRGB">
 <feFlood flood-opacity="0" result="BackgroundImageFix"/>
 <feColorMatrix in="SourceAlpha" type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0" result="hardAlpha"/>
 <feOffset/>
 <feGaussianBlur stdDeviation="12.476"/>
 <feComposite in2="hardAlpha" operator="out"/>
 <feColorMatrix type="matrix" values="0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"/>
 <feBlend mode="normal" in2="BackgroundImageFix" result="effect1_dropShadow_272_208"/>
 <feBlend mode="normal" in="SourceGraphic" in2="effect1_dropShadow_272_208" result="shape"/>
 </filter>
 </defs>
 </svg>
@@ -1,33 +1,7 @@
@import './styles/responsive.scss';
@import './styles/variables.scss';
@import './styles/global.scss';
-
+@import './styles/animations.scss';
 // VUE ROUTE CHANGE ANIMATION
 .view-anim {
  &-enter-from,
  &-leave-to {
    opacity: 0.02;
  }
  &-enter-active,
  &-leave-active {
    transition: all $animDuration $animType;
    min-height: 100%;
  }
 }
 .modal-anim {
  &-enter-active,
  &-leave-active {
    transition: all $animDuration $animType;
  }
  &-enter-from,
  &-leave-to {
    transform: translateY(-25%);
    opacity: 0;
  }
 }
 .route {
  margin: 0 0.2em;
@@ -56,24 +30,15 @@
 // CONTAINER
 .app_container {
-  display: flex;
+  display: grid;
-  flex-flow: column;
+  grid-template-rows: auto 1fr auto;
  grid-template-columns: 100%;
  min-height: 100vh;
 }
-  header {
+.app_main {
-    flex: 0 0 auto;
+  padding: 0 0.5em;
  }
  main {
    flex: 1 1 auto;
    padding: 0 0.5em;
  }
  footer {
    flex: 0 1 0.2em;
  }
 }
 .warning {
@@ -10,7 +10,7 @@
    <main class="app_main">
      <router-view v-slot="{ Component }">
-        <keep-alive exclude="JournalView">
+        <keep-alive exclude="JournalView,SceneryView">
          <component :is="Component" :key="$route.name" />
        </keep-alive>
      </router-view>
@@ -39,12 +39,12 @@ import Clock from './components/App/Clock.vue';
 import packageInfo from '.././package.json';
 import { regions } from './data/options.json';
-import { useStore } from './store/store';
+import { useStore } from './store/mainStore';
 import StatusIndicator from './components/App/StatusIndicator.vue';
 import TrainModal from './components/Global/TrainModal.vue';
 import StorageManager from './scripts/managers/storageManager';
 import AppHeader from './components/App/AppHeader.vue';
 import axios from 'axios';
 import StorageManager from './managers/storageManager';
 export default defineComponent({
  components: {
@@ -65,19 +65,16 @@ export default defineComponent({
  created() {
    this.loadLang();
-    this.store.connectToAPI();
+    this.store.setupAPI();
    this.store.isOffline = !window.navigator.onLine;
    window.addEventListener('offline', () => {
      this.store.isOffline = true;
-      this.store.apiData = {
+      this.store.activeData.activeSceneries = [];
-        stations: [],
+      this.store.activeData.trains = [];
-        dispatchers: [],
+      this.store.activeData.connectedSocketCount = 0;
        trains: [],
        connectedSocketCount: 0
      };
      this.store.setStatuses();
    });
@@ -68,7 +68,7 @@
 </template>
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import StatusIndicator from './StatusIndicator.vue';
 import Clock from './Clock.vue';
 import RegionDropdown from '../Global/RegionDropdown.vue';
@@ -96,11 +96,13 @@ export default defineComponent({
  computed: {
    onlineTrainsCount() {
-      return this.store.trainList.filter((train) => train.online).length;
+      return this.store.trainList.filter((train) => train.region == this.store.region.id).length;
    },
    onlineDispatchersCount() {
-      return this.store.onlineSceneryList.length;
+      return this.store.onlineSceneryList.filter(
        (scenery) => scenery.region == this.store.region.id
      ).length;
    },
    factorU() {
@@ -194,9 +194,9 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { DataStatus } from '../../scripts/enums/DataStatus';
+import { StoreState } from '../../store/typings';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
-import { StoreState } from '../../scripts/interfaces/store/storeTypes';
+import { Status } from '../../typings/common';
 export default defineComponent({
  data() {
@@ -204,7 +204,7 @@ export default defineComponent({
      tooltipActive: false,
      indicator: {
        offline: false,
-        status: DataStatus.Loading,
+        status: Status.Data.Loading,
        message: 'data-status.S3'
      },
@@ -217,7 +217,7 @@ export default defineComponent({
  },
  mounted() {
-    this.setSignalStatus(DataStatus.Loading);
+    this.setSignalStatus(Status.Data.Loading);
  },
  setup() {
@@ -240,44 +240,44 @@ export default defineComponent({
        const dispatcherDataStatus = statuses.dispatchers;
        if (this.store.isOffline) {
-          this.setSignalStatus(DataStatus.Initialized);
+          this.setSignalStatus(Status.Data.Initialized);
-          this.indicator.status = DataStatus.Initialized;
+          this.indicator.status = Status.Data.Initialized;
          this.indicator.message = 'data-status.S1-offline';
          return;
        }
-        if (connectionStatus == DataStatus.Error) {
+        if (connectionStatus == Status.Data.Error) {
          this.setSignalStatus(connectionStatus);
          this.indicator.status = connectionStatus;
          this.indicator.message = 'data-status.S1a-connection';
          return;
        }
-        if (sceneryDataStatus == DataStatus.Error) {
+        if (sceneryDataStatus == Status.Data.Error) {
          this.setSignalStatus(sceneryDataStatus);
          this.indicator.status = sceneryDataStatus;
          this.indicator.message = 'data-status.S1a-sceneries';
          return;
        }
-        if (trainsDataStatus == DataStatus.Warning) {
+        if (trainsDataStatus == Status.Data.Warning) {
          this.setSignalStatus(trainsDataStatus);
          this.indicator.status = trainsDataStatus;
          this.indicator.message = 'data-status.S5-trains';
          return;
        }
-        if (dispatcherDataStatus == DataStatus.Warning) {
+        if (dispatcherDataStatus == Status.Data.Warning) {
          this.setSignalStatus(dispatcherDataStatus);
          this.indicator.status = dispatcherDataStatus;
          this.indicator.message = 'data-status.S5-dispatchers';
          return;
        }
-        if (sceneryDataStatus == DataStatus.Loaded) {
+        if (sceneryDataStatus == Status.Data.Loaded) {
-          this.setSignalStatus(DataStatus.Loaded);
+          this.setSignalStatus(Status.Data.Loaded);
-          this.indicator.status = DataStatus.Loaded;
+          this.indicator.status = Status.Data.Loaded;
          this.indicator.message = 'data-status.S2';
        }
      }
@@ -285,31 +285,31 @@ export default defineComponent({
  },
  methods: {
-    setSignalStatus(status: DataStatus) {
+    setSignalStatus(status: Status.Data) {
      this.greenLight = false;
      this.greenBlinkLight = false;
      this.redTopLight = false;
      this.orangeLight = false;
      this.redBottomLight = false;
-      if (status == DataStatus.Initialized) {
+      if (status == Status.Data.Initialized) {
        this.redTopLight = true;
      }
-      if (status == DataStatus.Loaded) {
+      if (status == Status.Data.Loaded) {
        this.greenLight = true;
      }
-      if (status == DataStatus.Warning) {
+      if (status == Status.Data.Warning) {
        this.orangeLight = true;
      }
-      if (status == DataStatus.Error) {
+      if (status == Status.Data.Error) {
        this.redTopLight = true;
        this.redBottomLight = true;
      }
-      if (status == DataStatus.Loading) {
+      if (status == Status.Data.Loading) {
        this.greenBlinkLight = true;
      }
    }
@@ -0,0 +1,101 @@
 <template>
  <transition name="modal-anim" tag="div" class="modal">
    <div class="body" v-if="isOpen">
      <div class="background" @click="toggleModal(false)"></div>
      <div class="wrapper" ref="wrapper" tabindex="0">
        <slot></slot>
      </div>
      <div class="tab-exit" ref="exit" tabindex="0" @focus="toggleModal(false)"></div>
    </div>
  </transition>
 </template>
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { useStore } from '../../store/mainStore';
 export default defineComponent({
  emits: ['toggleModal'],
  props: {
    isOpen: Boolean
  },
  data() {
    return {
      store: useStore()
    };
  },
  watch: {
    isOpen(v) {
      this.$nextTick(() => {
        if (v) (this.$refs['wrapper'] as HTMLElement).focus();
        else (this.store.modalLastClickedTarget as HTMLElement)?.focus();
      });
    }
  },
  methods: {
    toggleModal(value: boolean) {
      this.$emit('toggleModal', value);
    }
  }
 });
 </script>
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
 .body {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  width: 100vw;
  height: 100vh;
 }
 .background {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.55);
 }
 .wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  background-color: #1a1a1a;
  box-shadow: 0 0 15px 10px #333333;
  width: 95%;
  max-width: 800px;
  max-height: 95vh;
  & > :slotted(div) {
    max-height: 95vh;
  }
 }
@include smallScreen {
  .wrapper {
    top: 0;
    transform: translate(-50%, 1em);
    max-height: 90vh;
    & > :slotted(div) {
      max-height: 90vh;
    }
  }
 }
 </style>
@@ -0,0 +1,201 @@
 <template>
  <div class="donation-modal" @keydown.esc="toggleModal(false)">
    <button
      class="btn-toggle btn--image"
      ref="btn"
      @click="toggleModal(true)"
      @focus="toggleModal(false)"
    >
      <img src="/images/icon-dollar.svg" alt="dollar donation icon" />
      <span>{{ $t('donations.button-title') }}</span>
    </button>
    <AnimatedModal :isOpen="isModalOpen" @toggleModal="toggleModal">
      <div class="modal_content">
        <div class="modal_main">
          <h1 v-html="$t('donations.header')"></h1>
          <br />
          <p v-html="$t('donations.p1')"></p>
          <br />
          <i18n-t keypath="donations.p2" tag="p">
            <template v-slot:b1>
              <b>{{ $t('donations.p2-b1') }}</b>
            </template>
            <template v-slot:b2>
              <b>{{ $t('donations.p2-b2') }}</b>
            </template>
            <template v-slot:b3>
              <b>{{ $t('donations.p2-b3') }}</b>
            </template>
            <template v-slot:link>
              <a class="discord" href="https://discord.gg/x2mpNN3svk" target="_blank">
                {{ $t('donations.p2-a1') }}
              </a>
            </template>
          </i18n-t>
          <br />
          <p v-html="$t('donations.p3')"></p>
          <br />
          <i18n-t keypath="donations.p4" tag="p">
            <template v-slot:img>
              <img src="/images/icon-diamond.svg" alt="donator diamond icon" />
            </template>
            <template v-slot:b1>
              <b>{{ $t('donations.p4-b1') }}</b>
            </template>
            <template v-slot:b2>
              <b>{{ $t('donations.p4-b2') }}</b>
            </template>
          </i18n-t>
          <br />
          <i
            v-html="$t('donations.p5')"
            style="display: flex; justify-content: flex-end; text-align: right"
          >
          </i>
        </div>
        <div class="modal_actions">
          <a
            class="modal-action a-button btn--image coffee"
            href="https://buycoffee.to/spythere"
            target="_blank"
          >
            <img src="/images/icon-coffee.png" width="20" alt="buycoffee.to donation" />
            {{ $t('donations.action-buycoffee') }}
          </a>
          <a
            class="modal-action a-button btn--image paypal"
            href="https://www.paypal.com/donate/?hosted_button_id=EDB3SKFAHXFTW"
            target="_blank"
          >
            <img src="/images/icon-dollar.svg" alt="paypal donation" />
            {{ $t('donations.action-paypal') }}
          </a>
          <button class="modal-action btn--image exit" @click="toggleModal(false)">
            <img src="/images/icon-exit.svg" alt="dollar donation icon" />
            {{ $t('donations.action-exit') }}
          </button>
        </div>
      </div>
    </AnimatedModal>
  </div>
 </template>
 <script lang="ts">
 import { defineComponent } from 'vue';
 import AnimatedModal from './AnimatedModal.vue';
 export default defineComponent({
  props: {
    isModalOpen: Boolean
  },
  emits: ['toggleModal'],
  methods: {
    toggleModal(value: boolean) {
      this.$emit('toggleModal', value);
    }
  },
  components: { AnimatedModal }
 });
 </script>
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
 button.btn-toggle {
  $btnColor: #254069;
  background-color: $btnColor;
  &:hover {
    background-color: lighten($btnColor, 5%);
  }
  @include smallScreen {
    span {
      display: none;
    }
  }
 }
 .modal_content {
  display: grid;
  grid-template-rows: 1fr auto;
  gap: 1em;
  font-size: 1.1em;
  & > div {
    padding: 1em;
  }
  h1 {
    font-size: 1.95em;
    text-align: center;
  }
  p {
    text-align: justify;
  }
  a.discord {
    text-decoration: underline;
  }
 }
 .modal_main {
  overflow: auto;
  img {
    max-height: 20px;
    margin-right: 5px;
    vertical-align: text-bottom;
  }
 }
 .modal_actions {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 0.5em;
  form button {
    width: 100%;
  }
 }
 .modal_actions > .modal-action {
  &.paypal {
    $btnColor: #254069;
    background-color: $btnColor;
    &:hover {
      background-color: lighten($btnColor, 5%);
    }
  }
  &.coffee {
    $btnColor: #009255;
    background-color: $btnColor;
    &:hover {
      background-color: lighten($btnColor, 5%);
    }
  }
  &.exit {
    $btnColor: #686868;
    background-color: $btnColor;
    &:hover {
      background-color: lighten($btnColor, 5%);
    }
  }
 }
 </style>
@@ -29,8 +29,8 @@
 <script lang="ts">
 import { defineComponent, Ref, ref } from 'vue';
 import { useStore } from '../../store/store';
 import { regions as regionsJSON } from '../../data/options.json';
 import { useStore } from '../../store/mainStore';
 interface Item {
  id: string;
@@ -67,16 +67,15 @@ export default defineComponent({
    selectedItem() {
      return this.regionList[this.selectedItemIndex] || null;
    },
    regionList() {
      return regionsJSON.map((region) => {
-        const regionStationCount =
+        const regionStationCount = this.store.onlineSceneryList.filter(
-          this.store.apiData.stations?.filter(
+          (scenery) => scenery.region == region.id
-            (station) => station.region == region.id && station.isOnline
+        ).length;
          ).length || 0;
        const regionTrainCount =
-          this.store.apiData.trains?.filter((train) => train.region == region.id && train.online)
+          this.store.trainList.filter((train) => train.region == region.id).length || 0;
            .length || 0;
        return {
          id: region.id,
@@ -1,7 +1,11 @@
 <template>
-  <span class="status-badge" :class="statusID" v-if="isOnline">
+  <span class="status-badge" :class="statusName" v-if="isOnline">
-    {{ $t(`status.${statusID}`) }}
+    {{ $t(`status.${statusName}`) }}
-    {{ statusID == 'online' ? timestampToString(statusTimestamp!) : '' }}
+    {{
      statusName == 'online' && dispatcherStatus && dispatcherStatus > 5
        ? timestampToString(dispatcherStatus)
        : ''
    }}
  </span>
  <span class="status-badge free" v-else>
@@ -10,22 +14,61 @@
 </template>
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { PropType, defineComponent } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import { Status } from '../../typings/common';
 export default defineComponent({
  props: {
-    statusID: {
+    dispatcherStatus: {
-      type: String
+      type: Number as PropType<Status.ActiveDispatcher | number>
    },
-    statusTimestamp: {
+    dispatcherTimestamp: {
-      type: Number
+      type: Number as PropType<number | null>
    },
    isOnline: {
      type: Boolean
    }
  },
-  mixins: [dateMixin]
+  mixins: [dateMixin],
  computed: {
    statusName() {
      if (this.dispatcherStatus === undefined) return 'free';
      switch (this.dispatcherStatus) {
        case Status.ActiveDispatcher.AFK:
          return 'afk';
        case Status.ActiveDispatcher.NO_LIMIT:
          return 'no-limit';
        case Status.ActiveDispatcher.ENDING:
          return 'ending';
        case Status.ActiveDispatcher.INVALID:
          return 'invalid';
        case Status.ActiveDispatcher.NOT_LOGGED_IN:
          return 'not-signed';
        case Status.ActiveDispatcher.NO_SPACE:
          return 'no-space';
        case Status.ActiveDispatcher.UNAVAILABLE:
          return 'unavailable';
        case Status.ActiveDispatcher.UNKNOWN:
          return 'unknown';
        default:
          if (this.dispatcherTimestamp != null && this.dispatcherStatus >= Date.now() + 25500000)
            return 'no-limit';
          return 'online';
      }
    }
  }
 });
 </script>
@@ -34,10 +77,10 @@ $free: #8a8a8a;
 $ending: #e6c300;
 $no-limit: #117fc9;
 $unav: #ff3d5d;
-$brb: #e6a100;
+$afk: #e6a100;
 $no-space: #222;
 $online: #09a116;
-$unknown: rgb(185, 60, 60);
+$unknown: #b93c3c;
 .status-badge {
  border-radius: 1rem;
@@ -69,8 +112,8 @@ $unknown: rgb(185, 60, 60);
    font-size: 0.85em;
  }
-  &.brb {
+  &.afk {
-    background-color: $brb;
+    background-color: $afk;
    color: black;
    font-size: 0.95em;
  }
@@ -82,7 +125,8 @@ $unknown: rgb(185, 60, 60);
    font-size: 0.85em;
  }
-  &.unknown {
+  &.unknown,
  &.invalid {
    background-color: $unknown;
    font-size: 0.95em;
  }
@@ -50,8 +50,8 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
-import { RollingStockInfo } from '../../scripts/interfaces/github_api/StockInfoGithubData';
+import { API } from '../../typings/api';
 export default defineComponent({
  props: {
@@ -71,7 +71,7 @@ export default defineComponent({
    onImageError(event: Event, stockName: string) {
      const fallbackName =
        Object.keys(this.store.rollingStockData!.info).find((type) => {
-          return this.store.rollingStockData!.info[type as keyof RollingStockInfo].find(
+          return this.store.rollingStockData!.info[type as keyof API.RollingStock.Info].find(
            (v) => v[0] === stockName.split(':')[0]
          );
        }) || 'vehicle-unknown';
@@ -51,16 +51,16 @@
 </template>
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { PropType, defineComponent } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
-import TrainStop from '../../scripts/interfaces/TrainStop';
+import { TrainStop } from '../../store/typings';
 export default defineComponent({
  mixins: [dateMixin],
  props: {
    stop: {
-      type: Object as () => TrainStop,
+      type: Object as PropType<TrainStop>,
      required: true
    }
  },
@@ -16,7 +16,6 @@
 import { defineComponent } from 'vue';
 import modalTrainMixin from '../../mixins/modalTrainMixin';
 import trainInfoMixin from '../../mixins/trainInfoMixin';
 import { useStore } from '../../store/store';
 import TrainInfo from '../TrainsView/TrainInfo.vue';
 import TrainSchedule from '../TrainsView/TrainSchedule.vue';
@@ -30,31 +29,12 @@ export default defineComponent({
    };
  },
  setup() {
    const store = useStore();
    return {
      store
    };
  },
  activated() {
    const contentEl = this.$refs['content'] as HTMLElement;
    this.$nextTick(() => {
      contentEl.focus();
    });
  },
  methods: {
    handleContentScroll(e: Event) {
      const trainInfoCompHeight: number = (
        this.$refs['trainInfo'] as any
      ).$el.getBoundingClientRect().height;
      const posTop = (e.target as HTMLElement).scrollTop;
      this.isTopBarVisible = posTop > trainInfoCompHeight;
    }
  }
 });
 </script>
@@ -16,8 +16,8 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
-import { RollingStockInfo } from '../../scripts/interfaces/github_api/StockInfoGithubData';
+import { API } from '../../typings/api';
 export default defineComponent({
  props: {
@@ -54,7 +54,7 @@ export default defineComponent({
      return (
        Object.keys(this.store.rollingStockData.info).find((type) => {
-          return this.store.rollingStockData?.info[type as keyof RollingStockInfo].find(
+          return this.store.rollingStockData?.info[type as keyof API.RollingStock.Info].find(
            (v) => v[0] === this.name.split(':')[0]
          );
        }) || 'vehicle-unknown'
@@ -1,7 +1,7 @@
 <template>
  <section class="daily-stats">
    <span :data-active="statsStatus">
-      <b v-if="statsStatus == DataStatus.Loading">
+      <b v-if="statsStatus == Status.Data.Loading">
        {{ $t('app.loading') }}
      </b>
@@ -32,24 +32,26 @@
          </i18n-t>
        </div>
-        <div v-if="stats.timetableId">
+        <div v-if="stats.maxTimetable">
          &bull;
          <i18n-t keypath="journal.timetable-stats-longest">
            <template #id>
-              <router-link :to="`/journal/timetables?timetableId=${stats.timetableId}`">
+              <router-link :to="`/journal/timetables?timetableId=${stats.maxTimetable.id}`">
-                <b>{{ stats.timetableId }}</b>
+                <b>{{ stats.maxTimetable.id }}</b>
              </router-link>
            </template>
            <template #author>
-              <router-link :to="`/journal/dispatchers?dispatcherName=${stats.timetableAuthor}`">
+              <router-link
-                <b>{{ stats.timetableAuthor }}</b>
+                :to="`/journal/dispatchers?dispatcherName=${stats.maxTimetable.authorName}`"
              >
                <b>{{ stats.maxTimetable.authorName }}</b>
              </router-link>
            </template>
            <template #driver>
-              <b class="text--primary">{{ stats.timetableDriver }}</b>
+              <b class="text--primary">{{ stats.maxTimetable.driverName }}</b>
            </template>
            <template #distance>
-              <b class="text--primary">{{ stats.timetableRouteDistance }} km</b>
+              <b class="text--primary">{{ stats.maxTimetable.routeDistance }} km</b>
            </template>
          </i18n-t>
        </div>
@@ -134,12 +136,10 @@
 import axios from 'axios';
 import { defineComponent } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
-import { DataStatus } from '../../scripts/enums/DataStatus';
+
 import {
  ITimetablesDailyStats,
  ITimetablesDailyStatsResponse
 } from '../../scripts/interfaces/api/StatsAPIData';
 import { URLs } from '../../scripts/utils/apiURLs';
 import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
 export default defineComponent({
  mixins: [dateMixin],
@@ -147,22 +147,11 @@ export default defineComponent({
  data() {
    return {
-      DataStatus,
+      Status,
-      statsStatus: DataStatus.Loading,
+      statsStatus: Status.Data.Loading,
      intervalId: -1,
-      stats: {
+      stats: {} as API.DailyStats.Response
        totalTimetables: 0,
        distanceSum: 0,
        distanceAvg: 0,
        timetableAuthor: '',
        timetableDriver: '',
        timetableId: 0,
        timetableRouteDistance: 0,
        longestDuties: [],
        mostActiveDrivers: [],
        mostActiveDispatchers: []
      } as ITimetablesDailyStats
    };
  },
@@ -187,28 +176,30 @@ export default defineComponent({
  methods: {
    async fetchDailyTimetableStats() {
      try {
-        const res: ITimetablesDailyStatsResponse = await (
+        const res: API.DailyStats.Response = await (
          await axios.get(`${URLs.stacjownikAPI}/api/getDailyTimetableStats`)
        ).data;
-        this.stats = {
+        // this.stats = {
-          totalTimetables: res.totalTimetables,
+        //   totalTimetables: res.totalTimetables,
-          distanceSum: res.distanceSum,
+        //   distanceSum: res.distanceSum,
-          distanceAvg: res.distanceAvg,
+        //   distanceAvg: res.distanceAvg,
-          timetableAuthor: res.maxTimetable?.authorName || '',
+        //   // timetableAuthor: res.maxTimetable?.authorName || '',
-          timetableDriver: res.maxTimetable?.driverName || '',
+        //   // timetableDriver: res.maxTimetable?.driverName || '',
-          timetableId: res.maxTimetable?.id || 0,
+        //   // timetableId: res.maxTimetable?.id || 0,
-          timetableRouteDistance: res.maxTimetable?.routeDistance || 0,
+        //   // timetableRouteDistance: res.maxTimetable?.routeDistance || 0,
-          mostActiveDispatchers: res.mostActiveDispatchers,
+        //   mostActiveDispatchers: res.mostActiveDispatchers,
-          mostActiveDrivers: res.mostActiveDrivers,
+        //   mostActiveDrivers: res.mostActiveDrivers,
-          longestDuties: res.longestDuties
+        //   longestDuties: res.longestDuties
-        };
+        // };
-        this.statsStatus = DataStatus.Loaded;
+        this.stats = res;
        this.statsStatus = Status.Data.Loaded;
      } catch (error) {
        console.error('Ups! Wystąpił błąd podczas pobierania statystyk rozkładów jazdy...');
-        this.statsStatus = DataStatus.Error;
+        this.statsStatus = Status.Data.Error;
      }
    },
@@ -52,11 +52,10 @@
 <script lang="ts">
 import axios from 'axios';
 import { defineComponent } from 'vue';
 import { DispatcherStatsAPIData } from '../../scripts/interfaces/api/DispatcherStatsAPIData';
 import { TimetableHistory } from '../../scripts/interfaces/api/TimetablesAPIData';
 import { URLs } from '../../scripts/utils/apiURLs';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import { API } from '../../typings/api';
 export default defineComponent({
  components: { Loading },
@@ -73,7 +72,7 @@ export default defineComponent({
    return {
      cardVisible: false,
      lastDispatcherName: '',
-      timetables: [] as TimetableHistory[]
+      timetables: [] as API.TimetableHistory.Response
    };
  },
@@ -90,13 +89,13 @@ export default defineComponent({
        this.store.dispatcherStatsData = undefined;
      }
-      const statsData: DispatcherStatsAPIData = await (
+      const statsData: API.DispatcherStats.Response = await (
        await axios.get(
          `${URLs.stacjownikAPI}/api/getDispatcherInfo?name=${this.store.dispatcherStatsName}`
        )
      ).data;
-      const timetables: TimetableHistory[] = await (
+      const timetables: API.TimetableHistory.Response = await (
        await axios.get(
          `${URLs.stacjownikAPI}/api/getTimetables?authorName=${this.store.dispatcherStatsName}`
        )
@@ -6,9 +6,9 @@
          {{ $t('app.offline') }}
        </div>
-        <Loading v-else-if="dataStatus == DataStatus.Loading" />
+        <Loading v-else-if="dataStatus == Status.Data.Loading" />
-        <div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
+        <div v-else-if="dataStatus == Status.Data.Error" class="journal_warning error">
          {{ $t('app.error') }}
        </div>
@@ -43,7 +43,17 @@
                    <router-link
                      :to="`/journal/dispatchers?dispatcherName=${historyItem.dispatcherName}`"
                    >
-                      <b>{{ historyItem.dispatcherName }}</b>
+                      <b
                        v-if="isDonator(historyItem.dispatcherName)"
                        class="text--donator"
                        :title="$t('donations.dispatcher-message')"
                      >
                        {{ historyItem.dispatcherName }}
                      </b>
                      <b v-else>
                        {{ historyItem.dispatcherName }}
                      </b>
                    </router-link>
                  </td>
                  <td>
@@ -114,22 +124,23 @@
 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIData';
 import styleMixin from '../../mixins/styleMixin';
-import { DataStatus } from '../../scripts/enums/DataStatus';
+import { useStore } from '../../store/mainStore';
 import { useStore } from '../../store/store';
 import Loading from '../Global/Loading.vue';
 import { regions } from '../../data/options.json';
 import AddDataButton from '../Global/AddDataButton.vue';
 import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
 import donatorMixin from '../../mixins/donatorMixin';
 export default defineComponent({
  components: { Loading, AddDataButton },
-  mixins: [dateMixin, styleMixin],
+  mixins: [dateMixin, styleMixin, donatorMixin],
  props: {
    dispatcherHistory: {
-      type: Array as PropType<DispatcherHistory[]>,
+      type: Array as PropType<API.DispatcherHistory.Response>,
      required: true
    },
    scrollNoMoreData: {
@@ -142,13 +153,13 @@ export default defineComponent({
      type: Function as PropType<() => void>
    },
    dataStatus: {
-      type: Number as PropType<DataStatus>
+      type: Number as PropType<Status.Data>
    }
  },
  data() {
    return {
-      DataStatus,
+      Status,
      store: useStore(),
      regions
    };
@@ -166,7 +177,7 @@ export default defineComponent({
          return acc;
        },
-        [] as (DispatcherHistory | string)[]
+        [] as (API.DispatcherHistory.Data | string)[]
      );
    }
  },
@@ -235,10 +246,6 @@ table.scenery-history-table {
      margin: 0 auto;
    }
  }
  @media screen and (max-width: 550px) {
    font-size: 0.9em;
  }
 }
 .text {
@@ -43,10 +43,10 @@
      </div>
    </span>
-    <b v-else-if="store.driverStatsStatus == DataStatus.Loading">{{
+    <b v-else-if="store.driverStatsStatus == Status.Data.Loading">{{
      $t('journal.stats-loading')
    }}</b>
-    <b v-else-if="store.driverStatsStatus == DataStatus.Error">
+    <b v-else-if="store.driverStatsStatus == Status.Data.Error">
      {{ $t('journal.stats-error ') }}
    </b>
    <b v-else>{{ $t('journal.driver-stats-info') }}</b>
@@ -55,14 +55,14 @@
 <script lang="ts">
 import { defineComponent } from 'vue';
-import { DataStatus } from '../../scripts/enums/DataStatus';
+import { useStore } from '../../store/mainStore';
-import { useStore } from '../../store/store';
+import { Status } from '../../typings/common';
 export default defineComponent({
  data() {
    return {
      store: useStore(),
-      DataStatus
+      Status: Status
    };
  }
 });
@@ -1,6 +1,6 @@
 <template>
-  <div class="filters-options" @keydown.esc="showOptions = false">
+  <div class="filters-options dropdown" @keydown.esc="showOptions = false">
-    <div class="bg" v-if="showOptions" @click="showOptions = false"></div>
+    <div class="dropdown_background" v-if="showOptions" @click="showOptions = false"></div>
    <div class="actions-bar">
      <button
@@ -27,8 +27,8 @@
      <option v-for="(sugg, i) in dispatcherSuggestions" :key="i" :value="sugg"></option>
    </datalist>
-    <transition name="options-anim">
+    <transition name="dropdown-anim">
-      <div class="options_wrapper" v-if="showOptions">
+      <div class="dropdown_wrapper" v-if="showOptions">
        <div class="options_content">
          <h1 class="option-title">{{ $t('options.search-title') }}</h1>
          <div class="search_content">
@@ -113,12 +113,11 @@
 import axios from 'axios';
 import { defineComponent, inject, PropType } from 'vue';
 import keyMixin from '../../mixins/keyMixin';
 import { DataStatus } from '../../scripts/enums/DataStatus';
 import { DriverStatsAPIData } from '../../scripts/interfaces/api/DriverStatsAPIData';
 import { URLs } from '../../scripts/utils/apiURLs';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
-import { JournalFilterSection } from '../../scripts/enums/JournalFilterType';
+import { Journal } from './typings';
-import { JournalFilter } from '../../scripts/types/JournalTimetablesTypes';
+import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
 export default defineComponent({
  emits: ['onSearchConfirm', 'onOptionsReset', 'onRefreshData'],
@@ -131,13 +130,13 @@ export default defineComponent({
    },
    filters: {
-      type: Array as PropType<JournalFilter[]>,
+      type: Array as PropType<Journal.TimetableFilter[]>,
      default: () => []
    },
    dataStatus: {
-      type: Number as PropType<DataStatus>,
+      type: Number as PropType<Status.Data>,
-      default: DataStatus.Initialized
+      default: -1
    },
    currentOptionsActive: {
@@ -154,7 +153,6 @@ export default defineComponent({
  data() {
    return {
      showOptions: false,
      JournalFilterSection,
      driverSuggestions: [] as string[],
      dispatcherSuggestions: [] as string[],
@@ -162,7 +160,7 @@ export default defineComponent({
      searchTimeout: 0,
      store: useStore(),
-      DataStatus
+      JournalFilterSection: Journal.FilterSection
    };
  },
@@ -170,7 +168,7 @@ export default defineComponent({
    return {
      searchersValues: inject('searchersValues') as { [key: string]: string },
      sorterActive: inject('sorterActive') as { id: string | number; dir: number },
-      filterList: inject('filterList') as JournalFilter[] | undefined
+      filterList: inject('filterList') as Journal.TimetableFilter[] | undefined
    };
  },
@@ -212,23 +210,23 @@ export default defineComponent({
      this.store.driverStatsData = undefined;
      if (!this.store.driverStatsName) {
-        this.store.driverStatsStatus = DataStatus.Initialized;
+        this.store.driverStatsStatus = Status.Data.Initialized;
        return;
      }
      try {
-        this.store.driverStatsStatus = DataStatus.Loading;
+        this.store.driverStatsStatus = Status.Data.Loading;
-        const statsData: DriverStatsAPIData = await (
+        const statsData: API.DriverStats.Response = await (
          await axios.get(
            `${URLs.stacjownikAPI}/api/getDriverInfo?name=${this.store.driverStatsName}`
          )
        ).data;
        this.store.driverStatsData = statsData;
-        this.store.driverStatsStatus = DataStatus.Loaded;
+        this.store.driverStatsStatus = Status.Data.Loaded;
      } catch (error) {
-        this.store.driverStatsStatus = DataStatus.Error;
+        this.store.driverStatsStatus = Status.Data.Error;
        console.error('Ups! Wystąpił błąd przy próbie pobrania statystyk maszynisty! :/');
      }
    },
@@ -270,7 +268,7 @@ export default defineComponent({
      this.$emit('onSearchConfirm');
    },
-    onFilterChange(filter: JournalFilter) {
+    onFilterChange(filter: Journal.TimetableFilter) {
      // this.journalFilterActive = filter;
      this.filterList
        ?.filter((f) => f.filterSection === filter.filterSection)
@@ -302,5 +300,6 @@ export default defineComponent({
 </script>
 <style lang="scss" scoped>
-@import '../../styles/filters_options.scss';
+@import '../../styles/dropdown.scss';
@import '../../styles/dropdown_filters.scss';
 </style>
@@ -29,10 +29,10 @@
 <script setup lang="ts">
 import { computed, onMounted, reactive, Ref, ref, watch } from 'vue';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import JournalDailyStats from './DailyStats.vue';
 import JournalDriverStats from './JournalDriverStats.vue';
-import StorageManager from '../../scripts/managers/storageManager';
+import StorageManager from '../../managers/storageManager';
 // Types
 type TStatTab = 'daily' | 'driver';
@@ -60,7 +60,8 @@ let data = reactive({
 // Methods
 function onTabButtonClick(tab: TStatTab) {
-  if (lastClickedTab.value == tab || !lastClickedTab.value || !areStatsOpen.value) areStatsOpen.value = !areStatsOpen.value;
+  if (lastClickedTab.value == tab || !lastClickedTab.value || !areStatsOpen.value)
    areStatsOpen.value = !areStatsOpen.value;
  if (tab == 'daily') {
    StorageManager.setBooleanValue('dailyStatsOpen', areStatsOpen.value);
@@ -6,9 +6,9 @@
          {{ $t('app.offline') }}
        </div>
-        <Loading v-else-if="dataStatus == DataStatus.Loading" />
+        <Loading v-else-if="dataStatus == Status.Data.Loading" />
-        <div v-else-if="dataStatus == DataStatus.Error" class="journal_warning error">
+        <div v-else-if="dataStatus == Status.Data.Error" class="journal_warning error">
          {{ $t('app.error') }}
        </div>
@@ -38,20 +38,20 @@
 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
 import { DataStatus } from '../../../scripts/enums/DataStatus';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 import { useStore } from '../../../store/store';
 import Loading from '../../Global/Loading.vue';
 import AddDataButton from '../../Global/AddDataButton.vue';
 import TimetableHistoryList from './TimetableHistoryList.vue';
 import { useStore } from '../../../store/mainStore';
 import { Status } from '../../../typings/common';
 import { API } from '../../../typings/api';
 export default defineComponent({
  components: { Loading, AddDataButton, TimetableHistoryList },
  props: {
    timetableHistory: {
-      type: Array as PropType<TimetableHistory[]>,
+      type: Array as PropType<API.TimetableHistory.Response>,
      required: true
    },
    scrollNoMoreData: {
@@ -64,13 +64,13 @@ export default defineComponent({
      type: Function as PropType<() => void>
    },
    dataStatus: {
-      type: Number as PropType<DataStatus>
+      type: Number as PropType<Status.Data>
    }
  },
  data() {
    return {
-      DataStatus,
+      Status,
      store: useStore()
    };
  }
@@ -77,8 +77,8 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 import StockList from '../../Global/StockList.vue';
 import { API } from '../../../typings/api';
 export default defineComponent({
  components: { StockList },
@@ -88,7 +88,7 @@ export default defineComponent({
      required: true
    },
    timetable: {
-      type: Object as PropType<TimetableHistory>,
+      type: Object as PropType<API.TimetableHistory.Data>,
      required: true
    }
  },
@@ -28,7 +28,17 @@
        {{ timetable.driverLevel < 2 ? 'L' : `${timetable.driverLevel}` }}
      </strong>
-      <strong>{{ timetable.driverName }}</strong>
+      <strong
        v-if="isDonator(timetable.driverName)"
        class="text--donator"
        :title="$t('donations.driver-message')"
      >
        {{ timetable.driverName }}
      </strong>
      <strong v-else>
        {{ timetable.driverName }}
      </strong>
    </span>
    <span class="general-time">
@@ -62,24 +72,25 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 import { API } from '../../../typings/api';
 import dateMixin from '../../../mixins/dateMixin';
 import modalTrainMixin from '../../../mixins/modalTrainMixin';
 import styleMixin from '../../../mixins/styleMixin';
 import donatorMixin from '../../../mixins/donatorMixin';
 export default defineComponent({
-  mixins: [dateMixin, modalTrainMixin, styleMixin],
+  mixins: [dateMixin, modalTrainMixin, styleMixin, donatorMixin],
  props: {
    timetable: {
-      type: Object as PropType<TimetableHistory>,
+      type: Object as PropType<API.TimetableHistory.Data>,
      required: true
    }
  },
  methods: {
-    showTimetable(timetable: TimetableHistory, target: EventTarget | null) {
+    showTimetable(timetable: API.TimetableHistory.Data, target: EventTarget | null) {
      if (timetable?.terminated) return;
      this.selectModalTrain(timetable.driverName + timetable.trainNo.toString(), target);
@@ -38,17 +38,19 @@
 <script lang="ts">
 import { PropType, defineComponent, ref } from 'vue';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 import TimetableGeneral from './TimetableGeneral.vue';
 import TimetableStops from './TimetableStops.vue';
 import TimetableStatus from './TimetableStatus.vue';
 import TimetableExtra from './TimetableExtra.vue';
 import { API } from '../../../typings/api';
 export default defineComponent({
  components: { TimetableGeneral, TimetableStops, TimetableStatus, TimetableExtra },
  props: {
    timetableHistory: {
-      type: Array as PropType<TimetableHistory[]>,
+      type: Array as PropType<API.TimetableHistory.Response>,
      required: true
    }
  },
@@ -59,9 +61,7 @@ export default defineComponent({
        showExtraInfo: ref(false)
      }));
    }
-  },
+  }
  methods: {},
  components: { TimetableGeneral, TimetableStops, TimetableStatus, TimetableExtra }
 });
 </script>
@@ -44,14 +44,14 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 import ProgressBar from '../../Global/ProgressBar.vue';
 import { API } from '../../../typings/api';
 export default defineComponent({
  components: { ProgressBar },
  props: {
    timetable: {
-      type: Object as PropType<TimetableHistory>,
+      type: Object as PropType<API.TimetableHistory.Data>,
      required: true
    }
  }
@@ -24,8 +24,7 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
 import dateMixin from '../../../mixins/dateMixin';
-
+import { API } from '../../../typings/api';
 import { TimetableHistory } from '../../../scripts/interfaces/api/TimetablesAPIData';
 export default defineComponent({
  mixins: [dateMixin],
@@ -37,7 +36,7 @@ export default defineComponent({
    },
    timetable: {
-      type: Object as PropType<TimetableHistory>,
+      type: Object as PropType<API.TimetableHistory.Data>,
      required: true
    }
  },
@@ -0,0 +1,49 @@
 export namespace Journal {
  export type DispatcherSearcher = {
    [key in 'search-dispatcher' | 'search-station' | 'search-date']: string;
  };
  export interface DispatcherSorter {
    id: 'timestampFrom' | 'duration';
    dir: -1 | 1;
  }
  export type TimetableSearchKey =
    | 'search-driver'
    | 'search-train'
    | 'search-date'
    | 'search-dispatcher'
    | 'search-issuedFrom';
  export type TimetableSearchType = {
    [key in TimetableSearchKey]: string;
  };
  export const enum TimetableFilterId {
    ACTIVE = 'active',
    FULFILLED = 'fulfilled',
    ABANDONED = 'abandoned',
    ALL = 'all',
    TWR = 'twr',
    SKR = 'skr',
    TWR_SKR = 'twr-skr'
  }
  export enum FilterSection {
    TIMETABLE_STATUS = 'timetable-status',
    TWRSKR = 'twrskr'
  }
  export interface TimetableFilter {
    id: TimetableFilterId;
    filterSection: string;
    isActive: boolean;
  }
  export type TimetableSorterKey = 'timetableId' | 'beginDate' | 'distance' | 'total-stops';
  export interface TimetableSorter {
    id: TimetableSorterKey;
    dir: 'asc' | 'desc';
  }
 }
@@ -69,14 +69,14 @@
 import axios from 'axios';
 import { defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import { DataStatus } from '../../scripts/enums/DataStatus';
 import { DispatcherHistory } from '../../scripts/interfaces/api/DispatchersAPIData';
 import Station from '../../scripts/interfaces/Station';
 import { URLs } from '../../scripts/utils/apiURLs';
 import Loading from '../Global/Loading.vue';
 import styleMixin from '../../mixins/styleMixin';
 import listObserverMixin from '../../mixins/listObserverMixin';
-import { OnlineScenery } from '../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../store/typings';
 import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
 export default defineComponent({
  name: 'SceneryDispatchersHistory',
@@ -95,9 +95,9 @@ export default defineComponent({
  data() {
    return {
-      historyList: [] as DispatcherHistory[],
+      historyList: [] as API.DispatcherHistory.Response,
-      dataStatus: DataStatus.Loading,
+      dataStatus: Status.Data.Loading,
-      DataStatus
+      DataStatus: Status.Data
    };
  },
@@ -109,17 +109,22 @@ export default defineComponent({
  },
  methods: {
-    async fetchAPIData(countFrom = 0, countLimit = 30): Promise<DispatcherHistory[] | null> {
+    async fetchAPIData(
      countFrom = 0,
      countLimit = 30
    ): Promise<API.DispatcherHistory.Response | null> {
      try {
-        this.dataStatus = DataStatus.Loading;
+        this.dataStatus = Status.Data.Loading;
        const requestString = `${URLs.stacjownikAPI}/api/getDispatchers?stationName=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
-        const historyAPIData: DispatcherHistory[] = await (await axios.get(requestString)).data;
+        const historyAPIData: API.DispatcherHistory.Response = await (
          await axios.get(requestString)
        ).data;
-        this.dataStatus = DataStatus.Loaded;
+        this.dataStatus = Status.Data.Loaded;
        return historyAPIData;
      } catch (error) {
-        this.dataStatus = DataStatus.Error;
+        this.dataStatus = Status.Data.Error;
        console.error(error);
        return null;
      }
@@ -153,3 +158,4 @@ export default defineComponent({
  }
 }
 </style>
 ../../store/storeTypes
@@ -15,7 +15,7 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
 import Station from '../../scripts/interfaces/Station';
-import { OnlineScenery } from '../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../store/typings';
 export default defineComponent({
  props: {
@@ -58,3 +58,4 @@ export default defineComponent({
  font-size: 1.2em;
 }
 </style>
 ../../store/storeTypes
@@ -90,7 +90,7 @@ import SceneryInfoUserList from './SceneryInfo/SceneryInfoUserList.vue';
 import SceneryInfoSpawnList from './SceneryInfo/SceneryInfoSpawnList.vue';
 import SceneryInfoRoutes from './SceneryInfo/SceneryInfoRoutes.vue';
 import Station from '../../scripts/interfaces/Station';
-import { OnlineScenery } from '../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../store/typings';
 export default defineComponent({
  components: {
@@ -110,7 +110,7 @@ export default defineComponent({
      type: Object as PropType<OnlineScenery>,
      required: false
    }
-  },
+  }
 });
 </script>
@@ -12,7 +12,14 @@
        class="dispatcher_name"
        :to="`/journal/dispatchers?dispatcherName=${onlineScenery.dispatcherName}`"
      >
-        {{ onlineScenery.dispatcherName }}
+        <span
          class="text--donator"
          v-if="isDonator(onlineScenery.dispatcherName)"
          :title="$t('donations.dispatcher-message')"
        >
          {{ onlineScenery.dispatcherName }}
        </span>
        <span v-else>{{ onlineScenery.dispatcherName }}</span>
      </router-link>
      <span class="dispatcher_likes text--primary">
@@ -22,9 +29,9 @@
    </div>
    <StationStatusBadge
      :statusID="onlineScenery?.statusID"
      :isOnline="onlineScenery ? true : false"
-      :statusTimestamp="onlineScenery?.statusTimestamp"
+      :dispatcherStatus="onlineScenery?.dispatcherStatus"
      :dispatcherTimestamp="onlineScenery?.dispatcherTimestamp"
    />
  </section>
 </template>
@@ -35,10 +42,11 @@ import dateMixin from '../../../mixins/dateMixin';
 import routerMixin from '../../../mixins/routerMixin';
 import styleMixin from '../../../mixins/styleMixin';
 import StationStatusBadge from '../../Global/StationStatusBadge.vue';
-import { OnlineScenery } from '../../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../../store/typings';
 import donatorMixin from '../../../mixins/donatorMixin';
 export default defineComponent({
-  mixins: [styleMixin, dateMixin, routerMixin],
+  mixins: [styleMixin, dateMixin, routerMixin, donatorMixin],
  props: {
    onlineScenery: {
      type: Object as PropType<OnlineScenery>,
@@ -7,7 +7,11 @@
    </h3>
    <transition-group name="spawns-anim" tag="ul">
-      <li class="badge spawn badge-none" v-if="!onlineScenery || onlineScenery.spawns.length == 0" key="no-spawns">
+      <li
        class="badge spawn badge-none"
        v-if="!onlineScenery || onlineScenery.spawns.length == 0"
        key="no-spawns"
      >
        {{ $t('scenery.no-spawns') }}
      </li>
@@ -26,7 +30,7 @@
 <script lang="ts">
 import { PropType, defineComponent } from 'vue';
-import { OnlineScenery } from '../../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../../store/typings';
 export default defineComponent({
  props: {
@@ -32,7 +32,7 @@
 import { PropType, defineComponent } from 'vue';
 import modalTrainMixin from '../../../mixins/modalTrainMixin';
 import routerMixin from '../../../mixins/routerMixin';
-import { OnlineScenery } from '../../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../../store/typings';
 export default defineComponent({
  mixins: [routerMixin, modalTrainMixin],
@@ -85,9 +85,11 @@
                <strong>{{ scheduledTrain.category }}</strong>
                {{ scheduledTrain.trainNo }}
-                <span class="g-tooltip" v-if="scheduledTrain.stopInfo.comments">
+                <span
                  v-if="scheduledTrain.stopInfo.comments"
                  :title="scheduledTrain.stopInfo.comments"
                >
                  <img src="/images/icon-warning.svg" />
                  <span class="content" v-html="scheduledTrain.stopInfo.comments"> </span>
                </span>
              </span>
              &nbsp;|&nbsp;
@@ -185,10 +187,10 @@ import Loading from '../Global/Loading.vue';
 import dateMixin from '../../mixins/dateMixin';
 import routerMixin from '../../mixins/routerMixin';
 import Station from '../../scripts/interfaces/Station';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import modalTrainMixin from '../../mixins/modalTrainMixin';
 import ScheduledTrainStatus from './ScheduledTrainStatus.vue';
-import { OnlineScenery } from '../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../store/typings';
 export default defineComponent({
  name: 'SceneryTimetable',
@@ -1,6 +1,16 @@
 <template>
  <!-- WIP -->
  <!-- <div class="top-filters">
    <button class="btn btn--option">ROZPOCZYNA BIEG</button>
    <button class="btn btn--option">PRZEZ</button>
    <button class="btn btn--option">KOŃCZY BIEG</button>
  </div> -->
  <section class="scenery-table-section">
    <Loading v-if="dataStatus != DataStatus.Loaded" />
    <div class="no-history" v-else-if="historyList.length == 0">
      {{ $t('scenery.history-list-empty') }}
    </div>
@@ -18,9 +28,9 @@
      <tbody>
        <tr v-for="historyItem in historyList" :key="historyItem.id">
          <td>
-            <router-link :to="`/journal/timetables?timetableId=${historyItem.id}`"
+            <router-link :to="`/journal/timetables?timetableId=${historyItem.id}`">
-              >#{{ historyItem.id }}</router-link
+              #{{ historyItem.id }}
-            >
+            </router-link>
          </td>
          <td>
            <b class="text--primary">{{ historyItem.trainCategoryCode }}</b> <br />
@@ -56,16 +66,14 @@
 import axios from 'axios';
 import { defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
-import { DataStatus } from '../../scripts/enums/DataStatus';
+
 import {
  TimetableHistory,
  SceneryTimetableHistory
 } from '../../scripts/interfaces/api/TimetablesAPIData';
 import Station from '../../scripts/interfaces/Station';
 import { URLs } from '../../scripts/utils/apiURLs';
 import Loading from '../Global/Loading.vue';
 import listObserverMixin from '../../mixins/listObserverMixin';
-import { OnlineScenery } from '../../scripts/interfaces/store/storeTypes';
+import { OnlineScenery } from '../../store/typings';
 import { API } from '../../typings/api';
 import { Status } from '../../typings/common';
 export default defineComponent({
  name: 'SceneryTimetablesHistory',
@@ -83,28 +91,28 @@ export default defineComponent({
  data() {
    return {
-      historyList: [] as TimetableHistory[],
+      historyList: [] as API.TimetableHistory.Response,
-      dataStatus: DataStatus.Loading,
+      dataStatus: Status.Data.Loading,
-      DataStatus
+      DataStatus: Status.Data
    };
  },
  async activated() {
-    const fetchedHistory = await this.fetchAPIData();
+    this.fetchAPIData();
    if (fetchedHistory) this.historyList = fetchedHistory.timetables;
  },
  methods: {
-    async fetchAPIData(countFrom = 0, countLimit = 15): Promise<SceneryTimetableHistory | null> {
+    async fetchAPIData(countFrom = 0, countLimit = 15) {
      try {
-        const requestString = `${URLs.stacjownikAPI}/api/getIssuedTimetables?name=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
+        const requestString = `${URLs.stacjownikAPI}/api/getTimetables?issuedFrom=${this.station.name}&countFrom=${countFrom}&countLimit=${countLimit}`;
        const historyAPIData: SceneryTimetableHistory = await (await axios.get(requestString)).data;
-        this.dataStatus = DataStatus.Loaded;
+        const response: API.TimetableHistory.Response = await (await axios.get(requestString)).data;
-        return historyAPIData;
+
        this.historyList = response;
        this.dataStatus = Status.Data.Loaded;
      } catch (error) {
        console.error(error);
        return null;
      }
    },
@@ -119,4 +127,14 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
@import '../../styles/sceneryViewTables.scss';
 .top-filters {
  display: flex;
  justify-content: center;
  gap: 0.5em;
  button {
    padding: 0.5em;
  }
 }
 </style>
@@ -11,7 +11,7 @@
 <script lang="ts">
 import { defineComponent, PropType } from 'vue';
-import { ScheduledTrain, StopStatus } from '../../scripts/interfaces/ScheduledTrain';
+import { ScheduledTrain, StopStatus } from '../../store/typings';
 interface ScheduledTrainComp extends ScheduledTrain {
  stopStatusIndicator: string;
@@ -42,7 +42,7 @@ export default defineComponent({
        stopStatusIndicator = '';
      switch (stopStatus) {
-        case StopStatus.arriving:
+        case StopStatus.ARRIVING:
          stopStatusIndicator = `${this.$t('timetables.from')}: ${prevDepartureIndicator}`;
          stopStatusDescription = this.$t('timetables.desc-arriving', {
            prevStationName,
@@ -50,8 +50,8 @@ export default defineComponent({
          });
          break;
-        case StopStatus.online:
+        case StopStatus.ONLINE:
-        case StopStatus.stopped:
+        case StopStatus.STOPPED:
          stopStatusIndicator = nextArrivalLine
            ? `${this.$t('timetables.to')}: ${nextArrivalIndicator}`
            : `${this.$t('timetables.desc-end')}`;
@@ -60,7 +60,7 @@ export default defineComponent({
            : '';
          break;
-        case StopStatus.departed:
+        case StopStatus.DEPARTED:
          stopStatusIndicator = `${this.$t('timetables.to')}: ${nextArrivalIndicator}`;
          stopStatusDescription = this.$t('timetables.desc-departed', {
            nextStationName,
@@ -68,7 +68,7 @@ export default defineComponent({
          });
          break;
-        case StopStatus['departed-away']:
+        case StopStatus.DEPARTED_AWAY:
          stopStatusIndicator = `${this.$t('timetables.to')}: ${nextArrivalIndicator}`;
          stopStatusDescription = this.$t('timetables.desc-departed-away', {
            nextStationName,
@@ -76,7 +76,7 @@ export default defineComponent({
          });
          break;
-        case StopStatus.terminated:
+        case StopStatus.TERMINATED:
          stopStatusIndicator = `X ${this.$t('timetables.desc-terminated')}`;
          stopStatusDescription = this.$t('timetables.desc-terminated');
          break;
@@ -138,11 +138,11 @@
 import { defineComponent, inject } from 'vue';
 import keyMixin from '../../mixins/keyMixin';
 import routerMixin from '../../mixins/routerMixin';
 import StorageManager from '../../scripts/managers/storageManager';
 import { useStationFiltersStore } from '../../store/stationFiltersStore';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import FilterOption from './FilterOption.vue';
 import StorageManager from '../../managers/storageManager';
 export default defineComponent({
  components: { FilterOption },
@@ -295,19 +295,7 @@ export default defineComponent({
 <style lang="scss" scoped>
@import '../../styles/responsive.scss';
@import '../../styles/card.scss';
-
+@import '../../styles/animations.scss';
 .card-anim {
  &-enter-active,
  &-leave-active {
    transition: all $animDuration $animType;
  }
  &-enter-from,
  &-leave-to {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.45);
  }
 }
 .card {
  display: grid;
@@ -108,14 +108,26 @@
            <td class="station_status">
              <StationStatusBadge
                :statusID="station.onlineInfo?.statusID"
                :isOnline="station.onlineInfo ? true : false"
-                :statusTimestamp="station.onlineInfo?.statusTimestamp"
+                :dispatcherStatus="station.onlineInfo?.dispatcherStatus"
              />
            </td>
            <td class="station_dispatcher-name">
-              {{ station.onlineInfo ? station.onlineInfo.dispatcherName : '' }}
+              <span v-if="station.onlineInfo?.dispatcherName">
                <b
                  v-if="store.donatorsData.includes(station.onlineInfo.dispatcherName)"
                  :title="$t('donations.dispatcher-message')"
                  @click.stop="openDonationModal"
                >
                  <img src="/images/icon-diamond.svg" alt="" />
                  {{ station.onlineInfo.dispatcherName }}
                </b>
                <div v-else>
                  {{ station.onlineInfo.dispatcherName }}
                </div>
              </span>
            </td>
            <td class="station_dispatcher-exp">
@@ -128,7 +140,7 @@
                  )
                "
              >
-                {{ 2 > station.onlineInfo.dispatcherExp ? 'L' : station.onlineInfo.dispatcherExp }}
+                {{ station.onlineInfo.dispatcherExp < 2 ? 'L' : station.onlineInfo.dispatcherExp }}
              </span>
            </td>
@@ -280,13 +292,13 @@ import { defineComponent, computed, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import stationInfoMixin from '../../mixins/stationInfoMixin';
 import styleMixin from '../../mixins/styleMixin';
 import { DataStatus } from '../../scripts/enums/DataStatus';
 import Station from '../../scripts/interfaces/Station';
 import { useStationFiltersStore } from '../../store/stationFiltersStore';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import { HeadIdsTypes, headIconsIds, headIds } from '../../scripts/data/stationHeaderNames';
 import StationStatusBadge from '../Global/StationStatusBadge.vue';
 import { Status } from '../../typings/common';
 export default defineComponent({
  props: {
@@ -296,6 +308,7 @@ export default defineComponent({
    }
  },
  emits: ['toggleDonationModal'],
  components: { Loading, StationStatusBadge },
  mixins: [styleMixin, dateMixin, stationInfoMixin],
@@ -316,11 +329,13 @@ export default defineComponent({
    const stationFiltersStore = useStationFiltersStore();
    const isDataLoaded = computed(() => {
-      return store.dataStatuses.sceneries != DataStatus.Loading;
+      return store.dataStatuses.sceneries != Status.Data.Loading;
    });
    return {
      isDataLoaded,
-      stationFiltersStore
+      stationFiltersStore,
      store
    };
  },
@@ -340,6 +355,11 @@ export default defineComponent({
      });
    },
    openDonationModal(e: Event) {
      this.$emit('toggleDonationModal', true);
      this.store.modalLastClickedTarget = e.target;
    },
    openForumSite(e: Event, url: string | undefined) {
      if (!url) return;
      e.preventDefault();
@@ -374,21 +394,17 @@ $rowCol: #424242;
  }
 }
-section.station_table {
+.table_wrapper {
  overflow: auto;
  overflow-y: hidden;
  font-weight: 500;
 }
 .table_wrapper {
  overflow: auto;
  overflow-y: hidden;
 }
 table {
  white-space: nowrap;
  border-collapse: collapse;
-  min-width: 1350px;
+  // min-width: 1350px;
  width: 100%;
  @include smallScreen() {
    min-width: auto;
@@ -494,6 +510,15 @@ td.station {
    }
  }
  // &_dispatcher-name {
  //   position: relative;
  // }
  &_dispatcher-name img {
    max-width: 1.35em;
    vertical-align: text-bottom;
  }
  &_level {
    span {
      background-color: #888;
@@ -1,4 +1,11 @@
-export default interface Filter {
+export interface FilterOption {
  id: string;
  name: string;
  value: boolean;
  defaultValue: boolean;
 }
 export interface Filter {
  [key: string]: boolean | number | string;
  default: boolean;
  notDefault: boolean;
@@ -1,22 +1,22 @@
 <template>
  <div class="train-info">
-    <section class="train-route">
+    <section class="train-general">
-      <div class="train_general">
+      <div class="general-info">
        <b class="warning-timeout" v-if="train.isTimeout" :title="$t('trains.timeout')">?</b>
-        <span class="timetable-id" v-if="train.timetableData"
+        <span class="timetable-id" v-if="train.timetableData">
-          >#{{ train.timetableData.timetableId }}</span
+          #{{ train.timetableData.timetableId }}
-        >
+        </span>
        <span
-          class="timetable_warnings"
+          class="timetable-warnings"
          v-if="train.timetableData?.TWR || train.timetableData?.SKR"
        >
-          <span class="train-badge twr" v-if="train.timetableData?.TWR" :title="$t('general.TWR')"
+          <span class="train-badge twr" v-if="train.timetableData?.TWR" :title="$t('general.TWR')">
-            >TWR</span
+            TWR
-          >
+          </span>
-          <span class="train-badge skr" v-if="train.timetableData?.SKR" :title="$t('general.SKR')"
+          <span class="train-badge skr" v-if="train.timetableData?.SKR" :title="$t('general.SKR')">
-            >SKR</span
+            SKR
-          >
+          </span>
        </span>
        <strong>
@@ -32,10 +32,20 @@
        >
          {{ train.driverLevel < 2 ? 'L' : `${train.driverLevel}` }}
        </b>
-        <span>{{ train.driverName }}</span>
+
        <div class="train-driver">
          <b
            v-if="store.donatorsData.includes(train.driverName)"
            :title="$t('donations.driver-message')"
          >
            {{ train.driverName }}
            <img src="/images/icon-diamond.svg" alt="donator diamond icon" />
          </b>
          <span v-else>{{ train.driverName }}</span>
        </div>
      </div>
-      <div class="timetable_route" v-if="train.timetableData">
+      <div class="general-timetable" v-if="train.timetableData">
        <strong>{{ train.timetableData.route.replace('|', ' - ') }}</strong>
        <img
          v-if="getSceneriesWithComments(train.timetableData).length > 0"
@@ -49,28 +59,33 @@
      <hr style="margin: 0.25em 0" />
-      <div class="timetable_stops" v-if="train.timetableData">
+      <div class="general-stops" v-if="train.timetableData">
        <span v-if="train.timetableData.followingStops.length > 2">
          {{ $t('trains.via-title') }}
          <span v-html="displayStopList(train.timetableData.followingStops)"></span>
        </span>
      </div>
-      <div class="timetable_progress" style="margin-top: 0.5em" v-if="train.timetableData">
+      <div class="general-status">
-        <ProgressBar :progressPercent="confirmedPercentage(train.timetableData.followingStops)" />
+        <div class="timetable-progress" v-if="train.timetableData">
          <ProgressBar :progressPercent="confirmedPercentage(train.timetableData.followingStops)" />
-        <span class="timetable_progress-distance">
+          <span class="progress-distance">
-          &nbsp; {{ currentDistance(train.timetableData.followingStops) }} km /
+            &nbsp; {{ currentDistance(train.timetableData.followingStops) }} km /
-          <span class="text--primary"> {{ train.timetableData.routeDistance }} km </span>
+            <span class="text--primary"> {{ train.timetableData.routeDistance }} km </span>
-          |
+            |
-          <span v-html="currentDelay(train.timetableData.followingStops)"></span>
+            <span v-html="currentDelay(train.timetableData.followingStops)"></span>
-        </span>
+          </span>
        </div>
-        <div class="train-status-badges">
+        <div class="status-badges">
          <div v-if="!train.currentStationHash" class="train-badge offline">
            <img src="/images/icon-offline.svg" alt="" />
            {{ $t('trains.scenery-offline') }}
          </div>
          <div v-if="!train.online" class="train-badge offline">
            <img src="/images/icon-offline.svg" alt="" />
            Offline {{ lastSeenMessage(train.lastSeen) }}
          </div>
        </div>
@@ -111,6 +126,7 @@ import trainInfoMixin from '../../mixins/trainInfoMixin';
 import Train from '../../scripts/interfaces/Train';
 import ProgressBar from '../Global/ProgressBar.vue';
 import TrainThumbnail from '../Global/TrainThumbnail.vue';
 import { useStore } from '../../store/mainStore';
 export default defineComponent({
  mixins: [trainInfoMixin, styleMixin],
@@ -125,6 +141,12 @@ export default defineComponent({
      type: Boolean,
      default: true
    }
  },
  data() {
    return {
      store: useStore()
    };
  }
 });
 </script>
@@ -168,6 +190,11 @@ export default defineComponent({
  gap: 0.5em;
 }
 .train-driver img {
  max-height: 20px;
  vertical-align: text-bottom;
 }
 .timetable-id {
  color: #d2d2d2;
 }
@@ -181,11 +208,17 @@ export default defineComponent({
  padding: 0 0.25em;
 }
-.timetable_stops {
+.train-general {
-  font-size: 0.75em;
+  display: flex;
  flex-direction: column;
  gap: 0.25em;
 }
-.train_general {
+.general-stops {
  font-size: 0.8em;
 }
 .general-info {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
@@ -193,55 +226,45 @@ export default defineComponent({
  gap: 0.25em;
  margin-right: 1.5em;
 }
-.train-status-badges {
+.general-status {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.25em;
 }
-.train-driver {
+.status-badges {
  &.supporter {
    color: orange;
    text-shadow: orange 0 0 5px;
  }
 }
 .timetable_route {
  display: flex;
  align-items: center;
  margin-top: 0.5em;
 }
 .timetable_warnings {
  display: flex;
  gap: 0.25em;
 }
 .timetable_progress {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
 }
-.timetable_progress-distance {
+  gap: 0.25em;
  margin-right: 0.25em;
 }
 .comments {
  display: flex;
  align-items: center;
  font-size: 0.9em;
  margin-top: 1em;
  img {
-    margin-right: 0.5em;
+    height: 15px;
  }
 }
 .general-timetable {
  display: flex;
  align-items: center;
 }
 .timetable-warnings {
  display: flex;
  gap: 0.25em;
 }
 .timetable-progress {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
 }
 .progress-distance {
  margin-right: 0.25em;
 }
@include smallScreen() {
  .train-info {
    grid-template-columns: 1fr;
@@ -251,23 +274,13 @@ export default defineComponent({
    font-size: 1.15em;
  }
-  .train-stats {
+  .general-info,
-    font-size: 1.1em;
+  .general-status,
-  }
+  .general-timetable {
  .train_general {
    justify-content: center;
  }
-  .train-status-badges {
+  .timetable-progress {
    justify-content: center;
  }
  .timetable_route {
    justify-content: center;
  }
  .timetable_progress {
    justify-content: center;
  }
@@ -1,6 +1,6 @@
 <template>
-  <div class="filters-options" @keydown.esc="showOptions = false">
+  <div class="dropdown" @keydown.esc="showOptions = false">
-    <div class="bg" v-if="showOptions" @click="showOptions = false"></div>
+    <div class="dropdown_background" v-if="showOptions" @click="showOptions = false"></div>
    <button class="filter-button btn--filled btn--image" @click="toggleShowOptions" ref="button">
      <img src="/images/icon-filter2.svg" alt="Open filters icon" />
@@ -8,8 +8,8 @@
      <span class="active-indicator" v-if="currentOptionsActive"></span>
    </button>
-    <transition name="options-anim">
+    <transition name="dropdown-anim">
-      <div class="options_wrapper" v-if="showOptions">
+      <div class="dropdown_wrapper" v-if="showOptions">
        <div class="options_content">
          <h1 class="option-title">{{ $t('options.search-title') }}</h1>
          <div class="search_content">
@@ -23,7 +23,11 @@
                v-model="searchedTrain"
              />
              <button class="search-exit">
-                <img src="/images/icon-exit.svg" alt="Trains search clear icon" @click="onInputClear('train')" />
+                <img
                  src="/images/icon-exit.svg"
                  alt="Trains search clear icon"
                  @click="onInputClear('train')"
                />
              </button>
            </div>
@@ -36,7 +40,11 @@
                v-model="searchedDriver"
              />
              <button class="search-exit">
-                <img src="/images/icon-exit.svg" alt="Driver search clear icon" @click="onInputClear('driver')" />
+                <img
                  src="/images/icon-exit.svg"
                  alt="Driver search clear icon"
                  @click="onInputClear('driver')"
                />
              </button>
            </div>
          </div>
@@ -79,6 +87,8 @@
            </button>
          </div>
        </div>
        <div tabindex="0" @focus="showOptions = false"></div>
      </div>
    </transition>
  </div>
@@ -87,8 +97,7 @@
 <script lang="ts">
 import { defineComponent, inject, PropType } from 'vue';
 import keyMixin from '../../mixins/keyMixin';
-import { TrainFilterSection } from '../../scripts/enums/TrainFilterType';
+import { TrainFilter, TrainFilterSection } from './typings';
 import { TrainFilter } from '../../scripts/interfaces/Trains/TrainFilter';
 export default defineComponent({
  mixins: [keyMixin],
@@ -152,9 +161,6 @@ export default defineComponent({
    },
    onFilterChange(filter: TrainFilter) {
      // if (this.lastSelectedFilter?.id === filter.id)
      //   this.trainFilterList.forEach((tf) => (tf.isActive = filter.id === tf.id));
      filter.isActive = !filter.isActive;
      this.lastSelectedFilter = filter;
    },
@@ -180,7 +186,8 @@ export default defineComponent({
 </script>
 <style lang="scss" scoped>
-@import '../../styles/filters_options.scss';
+@import '../../styles/dropdown.scss';
@import '../../styles/dropdown_filters.scss';
 .search_content > div {
  margin: 0.5em auto;
@@ -72,10 +72,10 @@
 import { computed, defineComponent, PropType } from 'vue';
 import dateMixin from '../../mixins/dateMixin';
 import Train from '../../scripts/interfaces/Train';
-import TrainStop from '../../scripts/interfaces/TrainStop';
+import { useStore } from '../../store/mainStore';
 import { useStore } from '../../store/store';
 import StopDate from '../Global/StopDate.vue';
 import StockList from '../Global/StockList.vue';
 import { TrainStop } from '../../store/typings';
 export default defineComponent({
  components: { StopDate, StockList },
@@ -0,0 +1,280 @@
 <template>
  <div class="dropdown" @keydown.esc="showOptions = false" @focusout="showOptions = false">
    <div class="bg" v-if="showOptions" @click="showOptions = false"></div>
    <button class="filter-button btn--filled btn--image" @click="toggleShowOptions" ref="button">
      <img src="/images/icon-stats.svg" alt="Open filters icon" />
      {{ $t('train-stats.stats-button') }}
    </button>
    <transition name="dropdown-anim">
      <div class="dropdown_wrapper" v-if="showOptions">
        <h1 class="text--primary">
          <img src="/images/icon-stats.svg" alt="Open filters icon" />
          {{ $t('train-stats.title') }}
        </h1>
        <hr style="margin: 0.5em 0" />
        <div v-if="store.dataStatuses.trains == Status.Loaded && regionTrains.length > 0">
          <div class="top-list general">
            <transition-group tag="ul" name="stats-anim">
              <li class="badge" key="timetable-count">
                <span>{{ $t('train-stats.timetable-count') }}</span>
                <span>
                  <b>{{ regionTrainsWithTT.length }}</b>
                </span>
              </li>
              <li class="badge" key="avg-speed">
                <span>{{ $t('train-stats.avg-speed') }}</span>
                <span>
                  <b>{{ stats.avgSpeed.toFixed(1) }} km/h</b>
                </span>
              </li>
              <li class="badge" key="avg-distance">
                <span>{{ $t('train-stats.avg-timetable') }}</span>
                <span>
                  <b>{{ stats.avgDistance.toFixed(1) }} km</b>
                </span>
              </li>
            </transition-group>
          </div>
          <div class="top-list categories">
            <h3>{{ $t('train-stats.top-categories') }}</h3>
            <transition-group tag="ul" name="stats-anim">
              <li class="badge" v-for="top in stats.topCategories" :key="top.name">
                <span>{{ top.name }}</span>
                <span>{{ top.count }}</span>
              </li>
            </transition-group>
            <span class="no-data" v-if="stats.topCategories.length == 0">
              {{ $t('train-stats.no-timetables') }}
            </span>
          </div>
          <div class="top-list vehicles">
            <h3>{{ $t('train-stats.top-vehicles') }}</h3>
            <transition-group tag="ul" name="stats-anim">
              <li class="badge" v-for="top in stats.topVehicles" :key="top.name">
                <span>{{ top.name }}</span>
                <span>{{ top.count }}</span>
              </li>
            </transition-group>
            <span class="no-data" v-if="stats.topVehicles.length == 0">
              {{ $t('train-stats.no-vehicles') }}
            </span>
          </div>
          <div class="top-list vehicle-types">
            <h3>{{ $t('train-stats.top-units') }}</h3>
            <transition-group tag="ul" name="stats-anim">
              <li class="badge" v-for="top in stats.topUnits.slice(0, 7)" :key="top.name">
                <span>{{ top.name }}</span>
                <span>{{ top.count }}</span>
              </li>
            </transition-group>
            <span class="no-data" v-if="stats.topUnits.length == 0">
              {{ $t('train-stats.no-units') }}
            </span>
          </div>
        </div>
        <div v-else-if="store.dataStatuses.trains != Status.Loaded">
          {{ $t('train-stats.stats-loading') }}
        </div>
        <div class="no-data" v-else>
          {{ $t('train-stats.no-stats') }}
        </div>
      </div>
    </transition>
  </div>
 </template>
 <script lang="ts">
 import { defineComponent } from 'vue';
 import { useStore } from '../../store/mainStore';
 import { Status } from '../../typings/common';
 interface ITop {
  name: string;
  count: number;
 }
 interface IStats {
  timetableCount: number;
  avgSpeed: number;
  avgDistance: number;
  topCategories: ITop[];
  topVehicles: ITop[];
  topUnits: ITop[];
 }
 function compareTop(top1: ITop, top2: ITop) {
  return Math.sign(top2.count - top1.count) || top1.name.localeCompare(top2.name, 'pl-PL');
 }
 export default defineComponent({
  data() {
    return {
      showOptions: false,
      store: useStore(),
      Status: Status.Data
    };
  },
  computed: {
    regionTrains() {
      return this.store.trainList.filter((train) => train.region == this.store.region.id);
    },
    regionTrainsWithTT() {
      return this.regionTrains.filter((train) => train.timetableData);
    },
    stats() {
      const stats = this.regionTrains.reduce(
        (acc, train, i, arr) => {
          // AVG SPEED
          acc.avgSpeed += train.speed / arr.length;
          // TOP VEHICLES
          const locoType = train.locoType.split('-')[0];
          const topVehicle = acc.topVehicles.find((top) => top.name == locoType);
          if (!topVehicle) acc.topVehicles.push({ name: locoType, count: 1 });
          else topVehicle.count++;
          // TOP UNITS
          const unitType = train.locoType;
          const topUnit = acc.topUnits.find((top) => top.name == unitType);
          if (!topUnit) acc.topUnits.push({ name: unitType, count: 1 });
          else topUnit.count++;
          if (train.timetableData !== undefined) {
            acc.timetableCount++;
            // AVG DISTANCE
            acc.avgDistance += train.timetableData.routeDistance;
            // TOP CATEGORIES
            const topCategory = acc.topCategories.find(
              (top) => top.name == train.timetableData!.category
            );
            if (!topCategory)
              acc.topCategories.push({ name: train.timetableData!.category, count: 1 });
            else topCategory.count++;
          }
          if (i == arr.length - 1 && acc.timetableCount != 0) {
            acc.avgDistance /= acc.timetableCount;
          }
          return acc;
        },
        {
          timetableCount: 0,
          avgDistance: 0,
          avgSpeed: 0,
          topCategories: [],
          topUnits: [],
          topVehicles: []
        } as IStats
      );
      stats.topCategories.sort(compareTop);
      stats.topUnits.sort(compareTop);
      stats.topVehicles.sort(compareTop);
      return stats;
    }
  },
  methods: {
    toggleShowOptions() {
      this.showOptions = !this.showOptions;
      this.$nextTick(() => {
        if (this.showOptions) (this.$refs['button'] as HTMLButtonElement)?.focus();
      });
    }
  }
 });
 </script>
 <style lang="scss" scoped>
@import '../../styles/dropdown.scss';
@import '../../styles/badge.scss';
@import '../../styles/responsive.scss';
 h1 img {
  vertical-align: text-bottom;
 }
 h3 {
  margin: 0.5em 0;
 }
 .no-data {
  font-size: 1.1em;
  color: #ccc;
 }
 .top-list ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5em;
  // @include smallScreen {
  //   justify-content: center;
  // }
 }
 .badge {
  margin: 0;
  & > span:first-child {
    background-color: $accentCol;
    color: black;
  }
 }
 .dropdown_wrapper {
  max-width: 600px;
 }
 .stats-anim {
  &-move,
  &-enter-active,
  &-leave-active {
    transition: all 250ms ease;
  }
  &-enter-from,
  &-leave-to {
    opacity: 0;
    transform: translateX(5px);
  }
  &-leave-active {
    position: absolute;
  }
 }
@include smallScreen {
  h1,
  .no-data {
    text-align: center;
  }
 }
 </style>
@@ -1,44 +1,44 @@
 <template>
-  <div class="train-table">
+  <transition name="status-anim" mode="out-in" tag="div" class="train-table">
-    <transition name="anim" mode="out-in">
+    <div :key="store.dataStatuses.trains">
-      <div :key="store.dataStatuses.trains">
+      <div class="table-info" key="offline" v-if="store.isOffline">
-        <div class="table-info" v-if="store.isOffline">
+        {{ $t('app.offline') }}
          {{ $t('app.offline') }}
        </div>
        <Loading v-else-if="trains.length == 0 && store.dataStatuses.trains == 0" />
        <div
          class="table-info no-trains"
          v-else-if="trains.length == 0 && store.dataStatuses.trains != 0"
        >
          {{ $t('trains.no-trains') }}
        </div>
        <transition-group name="list-anim" tag="ul" class="train-list" v-else>
          <li
            class="train-row"
            v-for="train in currentTrains"
            :key="train.trainId"
            tabindex="0"
            @click.stop="selectModalTrain(train.trainId, $event.currentTarget)"
            @keydown.enter="selectModalTrain(train.trainId, $event.currentTarget)"
          >
            <TrainInfo :train="train" />
          </li>
        </transition-group>
      </div>
-    </transition>
+
-  </div>
+      <Loading v-else-if="trains.length == 0 && store.dataStatuses.trains == 0" key="loading" />
      <div
        class="table-info"
        key="no-trains"
        v-else-if="trains.length == 0 && store.dataStatuses.trains != 0"
      >
        {{ $t('trains.no-trains') }}
      </div>
      <transition-group name="list-anim" tag="ul">
        <li
          class="train-row"
          v-for="train in trains"
          :key="train.trainId"
          tabindex="0"
          @click.stop="selectModalTrain(train.trainId, $event.currentTarget)"
          @keydown.enter="selectModalTrain(train.trainId, $event.currentTarget)"
        >
          <TrainInfo :train="train" />
        </li>
      </transition-group>
    </div>
  </transition>
 </template>
 <script lang="ts">
-import { computed, defineComponent, inject, PropType, Ref } from 'vue';
+import { defineComponent, inject, PropType, Ref } from 'vue';
 import modalTrainMixin from '../../mixins/modalTrainMixin';
 import Train from '../../scripts/interfaces/Train';
-import { useStore } from '../../store/store';
+import { useStore } from '../../store/mainStore';
 import Loading from '../Global/Loading.vue';
 import TrainInfo from './TrainInfo.vue';
 import { Status } from '../../typings/common';
 export default defineComponent({
  components: { Loading, TrainInfo },
@@ -52,18 +52,14 @@ export default defineComponent({
  mixins: [modalTrainMixin],
-  setup(props) {
+  setup() {
    const store = useStore();
    const searchedTrain = inject('searchedTrain') as Ref<string>;
    const searchedDriver = inject('searchedDriver') as Ref<string>;
    const currentTrains = computed(() => {
      return props.trains;
    });
    return {
      searchedTrain,
      searchedDriver,
      currentTrains,
      store,
      sorterActive: inject('sorterActive') as {
        id: string | number;
@@ -72,6 +68,17 @@ export default defineComponent({
    };
  },
  computed: {
    dataStatus() {
      if (this.store.isOffline) return Status.Data.Offline;
      if (this.trains.length == 0 && this.store.dataStatuses.trains == Status.Data.Loading)
        return Status.Data.Loading;
      return Status.Data.Loaded;
    }
  },
  activated() {
    const query = this.$route.query;
    if (query.trainNo && query.driverName) {
@@ -89,19 +96,13 @@ export default defineComponent({
@import '../../styles/responsive.scss';
@import '../../styles/animations.scss';
-.anim {
+.train-table {
-  &-enter-from,
+  position: relative;
  &-leave-to {
    opacity: 0;
  }
-  &-enter-active {
+  height: 90vh;
-    transition: all 100ms ease-out;
+  min-height: 550px;
-  }
+  overflow-y: auto;
-
+  overflow-x: hidden;
  &-leave-active {
    transition: all 100ms ease-out;
  }
 }
 .table-info {
@@ -114,96 +115,11 @@ export default defineComponent({
  background: #1a1a1a;
 }
-img.train-image {
+li.train-row {
-  width: 12em;
+  background-color: var(--clr-secondary);
-}
+  margin-bottom: 1em;
  width: 100%;
-.traffic-warning {
+  cursor: pointer;
  padding: 1em 0;
  margin-bottom: 0.5em;
  background: var(--clr-warning);
 }
 .timeouts-warning {
  background-color: #333;
  font-weight: bold;
  font-size: 1.05em;
  margin-bottom: 0.5em;
  padding: 0.5em;
 }
 .warning-timeout {
  background-color: #be3728;
  color: white;
  display: inline-block;
  text-align: center;
  width: 1.25em;
  height: 1.25em;
  border-radius: 50%;
 }
 .train {
  &-list {
    position: relative;
    @include smallScreen() {
      width: 100%;
    }
  }
  &-row {
    background-color: var(--clr-secondary);
    margin-bottom: 1em;
    cursor: pointer;
  }
  &_cars {
    display: flex;
    align-items: center;
    overflow: auto;
  }
 }
 .paginator {
  display: flex;
  justify-content: center;
  &_item {
    padding: 0.25em 0.5em;
    margin: 0 0.5em;
    outline: 2px solid salmon;
    min-width: 30px;
    text-align: center;
    cursor: pointer;
    &.page-number {
      font-weight: bold;
      color: gold;
    }
    &.disabled {
      outline: 2px solid lightgray;
      color: lightgray;
    }
    &:focus {
      outline: 2px solid white;
    }
  }
 }
@include smallScreen() {
  .info-bottom {
    text-align: center;
  }
 }
 </style>
@@ -1,63 +1,93 @@
-import { TrainFilterSection, TrainFilterType } from '../../scripts/enums/TrainFilterType';
+export enum TrainFilterSection {
-import { TrainFilter } from '../../scripts/interfaces/Trains/TrainFilter';
+  TRAIN_TYPE = 'TRAIN_TYPE',
  TIMETABLE_TYPE = 'TIMETABLE_TYPE',
  COMMENTS = 'COMMENTS',
  TIMETABLE = 'TIMETABLE'
 }
 export const enum TrainFilterId {
  noComments = 'noComments',
  withComments = 'withComments',
  twr = 'twr',
  skr = 'skr',
  common = 'common',
  passenger = 'passenger',
  freight = 'freight',
  other = 'other',
  noTimetable = 'noTimetable',
  withTimetable = 'withTimetable'
 }
 export interface TrainFilter {
  id: TrainFilterId;
  section: TrainFilterSection;
  isActive: boolean;
 }
 export interface TrainSorter {
  id: string;
  value: string;
 }
 export const trainFilters: TrainFilter[] = [
  {
-    id: TrainFilterType.twr,
+    id: TrainFilterId.twr,
    section: TrainFilterSection.TRAIN_TYPE,
    isActive: true
  },
  {
-    id: TrainFilterType.skr,
+    id: TrainFilterId.skr,
    section: TrainFilterSection.TRAIN_TYPE,
    isActive: true
  },
  {
-    id: TrainFilterType.common,
+    id: TrainFilterId.common,
    section: TrainFilterSection.TRAIN_TYPE,
    isActive: true
  },
  {
-    id: TrainFilterType.passenger,
+    id: TrainFilterId.passenger,
    section: TrainFilterSection.TIMETABLE_TYPE,
    isActive: true
  },
  {
-    id: TrainFilterType.freight,
+    id: TrainFilterId.freight,
    section: TrainFilterSection.TIMETABLE_TYPE,
    isActive: true
  },
  {
-    id: TrainFilterType.other,
+    id: TrainFilterId.other,
    section: TrainFilterSection.TIMETABLE_TYPE,
    isActive: true
  },
  {
-    id: TrainFilterType.withComments,
+    id: TrainFilterId.withComments,
    section: TrainFilterSection.COMMENTS,
    isActive: true
  },
  {
-    id: TrainFilterType.noComments,
+    id: TrainFilterId.noComments,
    section: TrainFilterSection.COMMENTS,
    isActive: true
  },
  {
-    id: TrainFilterType.withTimetable,
+    id: TrainFilterId.withTimetable,
    section: TrainFilterSection.TIMETABLE,
    isActive: true
  },
  {
-    id: TrainFilterType.noTimetable,
+    id: TrainFilterId.noTimetable,
    section: TrainFilterSection.TIMETABLE,
    isActive: true
  }
 ];
-export const sorterOptions = [
+export const sorterOptions: TrainSorter[] = [
  {
    id: 'distance',
    value: 'kilometraż'
@@ -1,46 +0,0 @@
 import { JournalFilterSection, JournalFilterType } from '../../scripts/enums/JournalFilterType';
 import { JournalFilter } from '../../scripts/types/JournalTimetablesTypes';
 export const journalTimetableFilters: JournalFilter[] = [
  {
    id: JournalFilterType.ALL,
    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: true
  },
  {
    id: JournalFilterType.ACTIVE,
    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: false
  },
  {
    id: JournalFilterType.FULFILLED,
    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: false
  },
  {
    id: JournalFilterType.ABANDONED,
    filterSection: JournalFilterSection.TIMETABLE_STATUS,
    isActive: false
  },
  {
    id: JournalFilterType.TWR_SKR,
    filterSection: JournalFilterSection.TWRSKR,
    isActive: true
  },
  {
    id: JournalFilterType.TWR,
    filterSection: JournalFilterSection.TWRSKR,
    isActive: false
  },
  {
    id: JournalFilterType.SKR,
    filterSection: JournalFilterSection.TWRSKR,
    isActive: false
  }
 ];
@@ -1,23 +0,0 @@
 [
  "EP07-356",
  "EP07-356",
  "EP07-356",
  "ET41-074",
  "2EN57-694+716rb",
  "EU07E-083",
  "EN57-716rb",
  "EN57-716rb",
  "EN57-716rb",
  "EN57-038rb",
  "EN57-038rb",
  "SM42-329_PLREG",
  "2EN57-038+1715rb",
  "EN57-1953rb",
  "EN57-1953rb",
  "SM42-1121",
  "SM42-091",
  "SM42-404",
  "SM42-404",
  "EN57-1914rb",
  "EN57-961rb"
 ]
@@ -1,4 +1,24 @@
 {
  "donations": {
    "button-title": "TOSS A COIN",
    "header": "Toss a coin to Stacjownik!",
    "p1": "<b>Hello o7!</b> This is Spythere, the creator of Stacjownik, Pojazdownik and several other applications that enhance the gameplay of Train Driver 2!",
    "p2": "{b1} is a completely free tool, created and continuously developed for the Train Driver 2 simulator community since 2020. However, a part of the project is sustained solely through my private financial contribution.  Features such as  {b2} or {b3} (operating on my {link} - to which you are warmly invited) must function on a dedicated server where they can collect and process data, and then display it on the website.",
    "p2-b1": "Stacjownik",
    "p2-b2": "Journal",
    "p2-b3": "Stacjobot (Stacjownik bot)",
    "p2-a1": "Discord server",
    "p3": "<b>If you have the means and would like to support my work, I would be grateful for any financial assistance that could help cover at least some of the server costs and further enhance the capabilities of the application!</b>",
    "p4": "Every person who decides to contribute at least {b1} (in case of PayPal it must be a payment including additional transaction fees) for the development of Stacjownik, will receive (upon a personal request) {img}{b2} of username in the app and on my Discord server (after verifying the payment author, preferably by providing the username directly with the payment).",
    "p4-b1": "5 PLN",
    "p4-b2": "a symbolic highlight",
    "p5": "Thank you and enjoy the app!<br />~ Spythegre",
    "action-exit": "Maybe next time...",
    "action-paypal": "DONATE WITH PAYPAL",
    "action-buycoffee": "BUY ME A COFFEE!",
    "dispatcher-message": "Dispatcher supporting the Stacjownik project!",
    "driver-message": "Driver supporting the Stacjownik project!"
  },
  "general": {
    "and": " and ",
    "refresh": "REFRESH",
@@ -78,8 +98,9 @@
    "not-signed": "NOT SIGNED IN",
    "no-limit": "NO LIMIT",
    "unavailable": "UNAVAILABLE",
-    "brb": "AFK",
+    "afk": "AFK",
    "no-space": "NO SPACE",
    "invalid": "INVALID HASH",
    "unknown": "UNKNOWN"
  },
  "options": {
@@ -274,6 +295,21 @@
    "scenery-offline": "Offline ride",
    "timeout": "An error occured while trying to refresh SWDR timetable data!"
  },
  "train-stats": {
    "stats-button": "STATISTICS",
    "title": "STATISTICS ONLINE",
    "timetable-count": "ACTIVE TIMETABLES",
    "avg-speed": "AVG SPEED",
    "avg-timetable": "AVG TIMETABLE",
    "top-categories": "Timetable categories",
    "top-vehicles": "Vehicles online",
    "top-units": "Common units online",
    "stats-loading": "Loading...",
    "no-timetables": "No active timetables in this region!",
    "no-vehicles": "No active vehicles in this region!",
    "no-units": "No active units in this region!",
    "no-stats": "No statistics available for the current region!"
  },
  "journal": {
    "title": "DISPATCHER HISTORY",
    "loading": "Loading dispatcher history data...",
@@ -1,434 +0,0 @@
 {
  "general": {
    "and": " oraz ",
    "refresh": "ODŚWIEŻ",
    "TWR": "Towar niebezpieczny wysokiego ryzyka",
    "SKR": "Przekroczona skrajnia"
  },
  "app": {
    "sceneries": "SCENERIE",
    "trains": "POCIĄGI",
    "journal": "DZIENNIK",
    "loading": "Pobieranie danych...",
    "support": "Wspomóż projekt",
    "error": "Wystąpił problem z załadowaniem danych!",
    "no-result": "Brak wyników o podanych kryteriach!",
    "migration-warning": "Usługi Stacjownika będą niedostępne w godzinach 1:00-3:00 2 czerwca 2022r. z powodu migracji hostingów API!",
    "migration-confirm": "Przyjąłem!",
    "offline": "Aplikacja w trybie offline!"
  },
  "footer": {
    "discord": "Serwer Discord Stacjownika"
  },
  "update": {
    "title": "Nowa wersja Stacjownika jest dostępna!",
    "paragraph1": "Miłego korzystania z aplikacji i niech S2 będzie z wami!",
    "release-link": "Kliknij, aby przejrzeć listę zmian (GitHub)",
    "confirm-button": "ZAKTUALIZUJ",
    "later-button": "PÓŹNIEJ"
  },
  "data-status": {
    "S1-offline": "<b>Sygnał S1</b> <br> Aplikacja działa w trybie offline!",
    "S1a-connection": "<b>Sygnał S1a</b> <br> Błąd podczas próby połączenia się z API Stacjownika!",
    "S1a-sceneries": "<b>Sygnał S1a</b> <br> Błąd podczas pobierania danych o sceneriach online!",
    "S2": "<b>Sygnał S2</b> <br> Pomyślnie załadowano dane!",
    "S3": "<b>Sygnał S3</b> <br> Pobieranie danych...",
    "S5-timetables": "<b>Sygnał S5</b> <br> Rozkłady jazdy mogą być niekompletne!",
    "S5-dispatchers": "<b>Sygnał S5</b> <br> Błąd podczas pobierania danych o statusach dyżurnych ruchu!",
    "S5-trains": "<b>Sygnał S5</b>  <br> Błąd podczas pobierania danych o pociągach online!"
  },
  "desc": {
    "control-type": "Sterowanie: ",
    "signals-type": "Sygnalizacja: ",
    "SBL": "Sceneria posiada SBL na szlakach: ",
    "SUP": "Wymaga programu SUP do kontroli systemu RASP-UZK",
    "TWB-all": "Sceneria posiada blokadę dwukierunkową na wszystkich szlakach",
    "TWB-routes": "Sceneria posiada blokadę dwukierunkową na szlakach: ",
    "default": "Sceneria dostępna domyślnie w paczce z grą",
    "non-public": "Sceneria niepubliczna",
    "unavailable": "Sceneria niedostępna",
    "unknown": "Nieznana sceneria",
    "real": "Sceneria z realnymi liniami kolejowymi: ",
    "abandoned": "Sceneria wycofana z rozgrywki"
  },
  "signals": {
    "title": "Sygnalizacja",
    "współczesna": "współczesna",
    "mieszana": "mieszana",
    "kształtowa": "kształtowa",
    "historyczna": "historyczna"
  },
  "controls": {
    "title": "Sterowanie",
    "SPK": "SPK",
    "SCS": "SCS",
    "SCS-SPK": "SCS/SPK",
    "SPE": "SPE",
    "ręczne": "ręczne",
    "ręczne+SPK": "ręczne z SPK",
    "ręczne+SCS": "ręczne z SCS",
    "mechaniczne": "mechaniczne",
    "mechaniczne+SPK": "mechaniczne z SPK",
    "mechaniczne+SCS": "mechaniczne z SCS"
  },
  "status": {
    "online": "DO ",
    "free": "WOLNA",
    "ending": "KOŃCZY",
    "not-signed": "NIEZALOGOWANY",
    "no-limit": "BEZ LIMITU",
    "unavailable": "NIEDOSTĘPNY",
    "brb": "Z/W",
    "no-space": "BRAK MIEJSCA",
    "unknown": "NIEZNANY"
  },
  "options": {
    "filters": "FILTRY",
    "donate": "WESPRZYJ",
    "search-button": "Szukaj",
    "reset-button": "Zresetuj",
    "sort-title": "SORTUJ WG:",
    "filter-title": "FILTRUJ WG:",
    "search-title": "SZUKAJ:",
    "search-train-no": "Nr pociągu",
    "search-train": "Nr pociągu / #",
    "search-driver": "Nick maszynisty",
    "search-dispatcher": "Nick dyżurnego",
    "search-station": "Nazwa scenerii",
    "search-author": "Nick autora rozkładu jazdy",
    "search-issuedFrom": "Sceneria początkowa",
    "search-timetables-date": "Data rozkładu jazdy (UTC+2 / CEST)",
    "search-dispatchers-date": "Data służby (UTC+2 / CEST)",
    "search-date": "Data (UTC+2 / CEST)",
    "sort-routeDistance": "kilometraż",
    "sort-allStopsCount": "stacje",
    "sort-beginDate": "data",
    "sort-timetableId": "ID rozkładu",
    "sort-timestampFrom": "data",
    "sort-duration": "czas dyżuru",
    "sort-id": "id rozkładu",
    "sort-mass": "masa",
    "sort-speed": "prędkość",
    "sort-length": "długość",
    "sort-timetable": "nr pociągu",
    "sort-progress": "przebyta trasa",
    "sort-delay": "opóźnienie",
    "sort-comments": "uwagi ekspl.",
    "filter-withComments": "UWAGI EKSPLOATACYJNE",
    "filter-noComments": "BEZ UWAG",
    "filter-twr": "WYS. RYZYKA",
    "filter-skr": "SKRAJNIA",
    "filter-twr-skr": "WSZYSTKIE",
    "filter-common": "ZWYKŁE",
    "filter-passenger": "PASAŻERSKIE",
    "filter-freight": "TOWAROWE",
    "filter-other": "INNE",
    "filter-noTimetable": "BEZ RJ",
    "filter-withTimetable": "ROZKŁAD JAZDY",
    "filter-reset": "ZRESETUJ FILTRY",
    "filter-clear": "WYŁĄCZ FILTRY",
    "filter-section-timetable-status": "STATUS ROZKŁADU JAZDY",
    "filter-section-twrskr": "UWAGI",
    "filter-all": "WSZYSTKIE",
    "filter-abandoned": "PORZUCONE",
    "filter-fulfilled": "WYPEŁNIONE",
    "filter-active": "AKTYWNE"
  },
  "filters": {
    "desc": " &bull; Kliknięcie: zaznaczenie / odznaczenie filtru <br /> &bull; Podwójne kliknięcie: odznaczenie reszty filtrów z <b class='text--primary'>grupy</b> <br /> &bull; <span style='color: coral'>RESET</span>: zresetowanie filtrów z <b class='text--primary'>grupy</b>",
    "sections": {
      "quick": "SZYBKIE FILTRY",
      "reality": "FIKCYJNOŚĆ SCENERII",
      "package-access": "DOSTĘPNOŚĆ W PACZCE",
      "access": "DOSTĘPNOŚĆ OGÓLNA",
      "control": "TYP STEROWANIA",
      "signals": "TYP SYGNALIZACJI",
      "addons": "DODATKOWE PROGRAMY",
      "blockades": "BLOKADY LINIOWE",
      "status": "STATUS ONLINE"
    },
    "all-available": "WSZYSTKIE DOSTĘPNE",
    "all-free": "WSZYSTKIE WOLNE",
    "endingStatus": "KOŃCZY",
    "afkStatus": "Z/W",
    "noSpaceStatus": "BRAK MIEJSCA",
    "unavailableStatus": "NIEDOSTĘPNY",
    "title": "FILTRUJ STACJE",
    "default": "DOMYŚLNA",
    "not-default": "POZA PACZKĄ",
    "real": "REALNA",
    "fictional": "FIKCYJNA",
    "unavailable": "NIEDOSTĘPNA",
    "non-public": "NIEPUBLICZNA",
    "abandoned": "WYCOFANA",
    "SPK": "SPK",
    "SPK-R": "SPK + RĘCZNE",
    "SPK-M": "SPK + MECH.",
    "SCS": "SCS",
    "SCS-R": "SCS + RĘCZNE",
    "SCS-M": "SCS + MECH.",
    "SPE": "SPE",
    "manual": "RĘCZNE",
    "SUP": "SUP (RASP-UZK)",
    "noSUP": "BEZ SUP",
    "SBL": "SAMOCZYNNA",
    "PBL": "PÓŁSAMOCZYNNA",
    "mechanical": "MECHANICZNE",
    "modern": "WSPÓŁCZESNA",
    "semaphores": "KSZTAŁTOWA",
    "mixed": "MIESZANA",
    "historical": "HISTORYCZNA",
    "free": "WOLNA",
    "occupied": "ZAJĘTA",
    "sliders": {
      "min-lvl": "MIN. WYMAGANY POZIOM DYŻURNEGO",
      "max-lvl": "MAKS. WYMAGANY POZIOM DYŻURNEGO",
      "routes-1t-cat": "SZLAKI JEDNOTOROWE ZELEKTR. (MINIMUM)",
      "routes-1t-other": "SZLAKI JEDNOTOROWE NIEZELEKTR. (MINIMUM)",
      "routes-2t-cat": "SZLAKI DWUTOROWE ZELEKTR. (MINIMUM)",
      "routes-2t-other": "SZLAKI DWUTOROWE NIEZELEKTR. (MINIMUM)"
    },
    "authors-search": "Szukaj autora (uwzględnia inne filtry)",
    "minimum-hours-title": "POKAŻ TYLKO SCENERIE DOSTĘPNE MINIMUM DO:",
    "now": "TERAZ",
    "hour": " godz.",
    "no-limit": "BEZ LIMITU",
    "include-selected": "POKAŻ ZAZNACZONE",
    "save": "ZAPAMIĘTAJ FILTRY",
    "reset": "RESETUJ FILTRY",
    "close": "ZAMKNIJ FILTRY"
  },
  "sceneries": {
    "station": "Stacja",
    "abbr": "Skrót\nposterunku",
    "min-lvl": "Min. poziom\ndyżurnego",
    "status": "Status",
    "dispatcher": "Dyżurny",
    "dispatcher-lvl": "Poziom\ndyżurnego",
    "routes": "Szlaki\n2tor / 1tor",
    "general": "Informacje\nogólne",
    "user": "Maszyniści online",
    "spawn": "Otwarte spawny",
    "timetableAll": "Aktywne rozkłady jazdy",
    "timetableConfirmed": "Zatwierdzone rozkłady jazdy",
    "timetableUnconfirmed": "Niezatwierdzone rozkłady jazdy",
    "no-stations": "Brak stacji do wyświetlenia!",
    "scenery-search": "Wyszukaj scenerię..."
  },
  "trains": {
    "no-trains": "Brak pociągów do wyświetlenia!",
    "loading": "Pobieranie danych o pociągach...",
    "offline": "Przejazd offline",
    "stats": "STATYSTYKI RUCHU",
    "stats-speed": "PRĘDKOŚCI POCIĄGÓW (MIN, ŚR, MAX) [km/h]",
    "stats-length": "DŁUGOŚCI ROZKŁADÓW (MIN, ŚR, MAX) [km]",
    "stats-categories": "KATEGORIE RJ",
    "stats-special-twr": "WYSOKIEGO RYZYKA",
    "stats-special-skr": "PRZEKROCZONA SKRAJNIA",
    "stats-locos": "NAJCZĘSTSZE JEDNOSTKI",
    "current-scenery": "na scenerii",
    "current-signal": "przy semaforze",
    "current-track": "na szlaku",
    "delayed": "Opóźniony: ",
    "preponed": "Przed czasem: ",
    "on-time": "Planowo",
    "route-progress": "Postęp: ",
    "detailed-timetable": "Szczegółowy rozkład jazdy pociągu ",
    "via-title": "Przez: ",
    "no-timetable": "brak rozkładu jazdy",
    "distance-exceeded": "Uwaga! Z powodu wewnętrznego błędu serwera TD2, rozkłady jazdy o kilometrażu powyżej 200km mogą być niepoprawne!",
    "cars": "Wagony",
    "EZT": "EZT",
    "SZT": "SZT",
    "loco-electric": "Elektrowóz",
    "loco-diesel": "Spalinowóz",
    "timetable-comments": "Pociąg z uwagami eksploatacyjnymi",
    "comment": "Uwagi eksploatacyjne dla: ",
    "table-limit": "Dla płynności działania strony pokazanych jest tylko 10 pociągów zgodnie z wybranymi filtrami.",
    "last-seen-now": "od niedawna",
    "last-seen-min": "od minuty",
    "last-seen-ago": "od {minutes} minut",
    "scenery-offline": "Przejazd offline",
    "timeout": "Wystąpił problem z aktualizacją rozkładów jazdy z SWDR"
  },
  "journal": {
    "title": "HISTORIA DYŻURÓW",
    "loading": "Ładowanie historii dyżurów...",
    "no-history": "Brak historii dyżurów dla tej scenerii!",
    "data-refreshed-at": "Dane odświeżone o",
    "section-timetables": "ROZKŁADY JAZDY",
    "section-dispatchers": "DYŻURNI",
    "no-further-data": "Brak dalszych wyników dla podanych parametrów",
    "loading-further-data": "Ładowanie...",
    "online-since": "ONLINE OD",
    "duty-lasted": "Dyżur trwał",
    "hours": "{value} godz.",
    "minutes": "{value} min.",
    "seconds": "{value} sek.",
    "route-length": "Kilometraż:",
    "station-count": "Stacje:",
    "dispatcher-name": "Autor",
    "timetable-day": "Rozkład z dnia",
    "timetable-active": "AKTYWNY",
    "timetable-fulfilled": "WYPEŁNIONY",
    "timetable-abandoned": "PORZUCONY",
    "stock-info": "DODATKOWE INFORMACJE",
    "stock-length": "Długość",
    "stock-mass": "Masa",
    "stock-max-speed": "Prędkość maks.",
    "load-data": "Pobierz dalszą historię...",
    "stats-title": "STATYSTYKI MASZYNISTY",
    "last-seen-at": "Ostatnio widziany na: ",
    "currently-at": "Obecnie na scenerii: ",
    "stats-timetables": "ROZKŁADY JAZDY",
    "stats-longest-timetable": "NAJDŁUŻSZY RJ",
    "stats-avg-timetable": "ŚREDNIA DŁUGOŚĆ RJ",
    "stats-distance": "DYSTANS",
    "stats-stations": "STACJE",
    "timetable-stats-total": "Stworzone rozkłady jazdy: {count} (łączny dystans: {distance})",
    "timetable-stats-longest": "Najdłuższy rozkład jazdy: #{id} (stworzony przez dyżurnego {author} dla maszynisty {driver} o dystansie {distance})",
    "timetable-stats-most-active-dr": "Najaktywniejszy dyżurny: {dispatcher} (stworzył {count})",
    "timetable-stats-most-active-dr-many": "Najaktywniejsi dyżurni: {dispatchers} (stworzyli po {count})",
    "timetable-stats-most-active-driver": "Najaktywniejszy maszynista: {driver} (łączny przejechany dystans: {distance})",
    "timetable-stats-longest-duties": "Najdłuższa służba: {dispatcher} na scenerii {station} (czas trwania: {duration})",
    "timetable-count": "rozkład jazdy | rozkładów jazdy",
    "daily-stats-title": "STATYSTYKI DNIA",
    "daily-stats-info": "Dzisiejsze statystyki nie są jeszcze dostępne!",
    "driver-stats-title": "STATYSTYKI GRACZA",
    "driver-stats-info": "Wpisz nazwę użytkownika w filtrach [F], aby zobaczyć jego statystyki maszynisty!",
    "stats-loading": "Pobieranie statystyk...",
    "stats-error": "Ups! Wystąpił błąd podczas próby pobrania statystyk! :/",
    "timetable-location-signal": "semafor:",
    "timetable-location-route": "szlak:",
    "history-name": "Sceneria",
    "history-hash": "Hash",
    "history-dispatcher": "Dyżurny",
    "history-level": "Poziom",
    "history-rate": "Ocena",
    "history-region": "Region",
    "history-date": "Data służby"
  },
  "scenery": {
    "users": "GRACZE ONLINE",
    "spawns": "OTWARTE SPAWNY",
    "timetables": "AKTYWNE ROZKŁADY JAZDY",
    "no-timetables": "Brak aktywnych rozkładów!",
    "offline": "Sceneria jest offline",
    "no-users": "BRAK AKTYWNYCH GRACZY",
    "no-spawns": "BRAK OTWARTYCH SPAWNÓW",
    "no-scenery": "Ups! Ta sceneria nie istnieje!",
    "return-btn": "Wróć na stronę główną",
    "history-btn": "Przejdź do widoku historii dyżurnych ruchu",
    "info-btn": "Wróć do widoku scenerii",
    "authors-title": "Autor scenerii | Autorzy scenerii",
    "abbrev": "Skrót posterunku:",
    "lines-title": "Rzeczywiste linie",
    "project-title": "Projekt",
    "one-way-routes": "Szlaki jednotorowe",
    "two-way-routes": "Szlaki dwutorowe",
    "option-active-timetables": "Aktywne rozkłady jazdy",
    "option-timetables-history": "Historia rozkładów",
    "option-dispatchers-history": "Historia dyżurów",
    "timetable-author-title": "Wydany przez",
    "timetable-author-unknown": "Autor nieznany",
    "timetables-history-id": "ID",
    "timetables-history-number": "Numer",
    "timetables-history-route": "Trasa",
    "timetables-history-driver": "Maszynista",
    "timetables-history-author": "Autor RJ",
    "timetables-history-date": "Data",
    "dispatchers-history-hash": "Hash",
    "dispatchers-history-dispatcher": "Dyżurny",
    "dispatchers-history-level": "Poziom",
    "dispatchers-history-rate": "Ocena",
    "dispatchers-history-date": "Data służby",
    "req-level": "ogólnodostępna | minimum {lvl} poziom dyżurnego | minimum {lvl} poziom dyżurnego",
    "history-list-empty": "Brak historii dla tej scenerii!",
    "forum-topic": "Oficjalny wątek scenerii {name}",
    "pragotron-link": "Paletowa tablica informacyjna (beta)",
    "tablice-link": "Tablica informacyjna zbiorcza (autorstwa Thundo)",
    "bottom-info": "Pokaż pełną historię w zakładce Dziennika"
  },
  "availability": {
    "title": "Dostępność",
    "default": "w paczce",
    "nonDefault": "poza paczką",
    "unavailable": "niedostępna",
    "nonPublic": "niepubliczna",
    "abandoned": "wycofana"
  },
  "timetables": {
    "timetable-only": "Wyodrębnij rozkłady jazdy",
    "end": "Koniec rozkładu jazdy",
    "terminated": "Rozkład jazdy zakończony",
    "begins": "ROZPOCZYNA\nBIEG",
    "terminates": "KOŃCZY BIEG",
    "from": "Z",
    "to": "DO",
    "desc-arriving": "Pociągu nie ma jeszcze na tej scenerii. Przyjedzie z: {prevStationName} (szlak {prevDepartureLine})",
    "desc-online": "Pociąg jest na tej scenerii. Odjedzie do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-stopped": "Pociąg jest na tej scenerii i odbywa postój. Odjedzie do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-next-arrival": "Odjeżdża do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-departed": "Pociąg jest na tej scenerii i został odprawiony. Odjeżdża do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-departed-away": "Pociąg został odprawiony i odjechał do: {nextStationName} (szlak {nextArrivalLine})",
    "desc-end": "Pociąg kończy bieg",
    "desc-terminated": "Pociąg skończył bieg"
  },
  "history": {
    "title": "DZIENNIK ROZKŁADÓW JAZDY"
  }
 }
@@ -1,4 +1,24 @@
 {
  "donations": {
    "button-title": "GROSZA DAJ",
    "header": "Grosza daj Stacjownikowi!",
    "p1": "<b>Hej o7!</b> Z tej strony Spythere, twórca Stacjownika, Pojazdownika oraz kilku innych aplikacji wspomagających rozgrywkę symulatora Train Driver 2!",
    "p2": "{b1} to narzędzie całkowicie darmowe, tworzone i rozwijane dla społeczności symulatora TD2 nieprzerwanie od 2020 roku. Jednakże, część projektu jest podtrzymywana wyłącznie dzięki mojemu prywatnemu wkładowi finansowemu. Funkcje takie jak {b2} czy też {b3} działający na moim {link} (na który serdeczne zapraszam) muszą działać na wydzielonym serwerze, gdzie będą mogły zbierać i przetwarzać dane, aby następnie pokazać je na stronie.",
    "p2-b1": "Stacjownik",
    "p2-b2": "Dziennik",
    "p2-b3": "Stacjobot",
    "p2-a1": "serwerze Discord",
    "p3": "<b>Jeśli masz możliwość i chcesz wspomóc moją twórczość dla symulatora, będę wdzięczny za wszelkie pomoce finansowe, które pozwolą na choćby częściowe pokrycie kosztów serwera oraz dalsze rozwijanie możliwości aplikacji!</b>",
    "p4": "Każda osoba, która postanowi przelać co najmniej {b1} (w przypadku PayPala musi być to opłata brutto z dodatkową opłatą za transakcję) na rozwój Stacjownika, otrzyma na życzenie symboliczne {img}{b2} nicku użytkownika na stronie i moim serwerze Discord (po zweryfikowaniu autora płatności, najlepiej poprzez podanie nicku bezpośrednio przy niej).",
    "p4-b1": "5 złotych",
    "p4-b2": "wyróżnienie",
    "p5": "Dzięki i miłego korzystania z aplikacji! <br />~ Spythere",
    "action-exit": "Może kiedy indziej...",
    "action-paypal": "PRZELEJ PAYPALEM",
    "action-buycoffee": "POSTAW KAWĘ!",
    "dispatcher-message": "Dyżurny wspierający projekt Stacjownika!",
    "driver-message": "Maszynista wspierający projekt Stacjownika!"
  },
  "general": {
    "and": " oraz ",
    "refresh": "ODŚWIEŻ",
@@ -66,8 +86,9 @@
    "not-signed": "NIEZALOGOWANY",
    "no-limit": "BEZ LIMITU",
    "unavailable": "NIEDOSTĘPNY",
-    "brb": "Z/W",
+    "afk": "Z/W",
    "no-space": "BRAK MIEJSCA",
    "invalid": "NIEWPISANY",
    "unknown": "NIEZNANY"
  },
  "options": {
@@ -257,6 +278,21 @@
    "timeout": "Wystąpił problem z aktualizacją rozkładów jazdy z SWDR"
  },
  "train-stats": {
    "stats-button": "STATYSTYKI",
    "title": "STATYSTYKI ONLINE",
    "timetable-count": "AKTYWNE RJ",
    "avg-speed": "ŚREDNIA PRĘDKOŚĆ",
    "avg-timetable": "ŚREDNI RJ",
    "top-categories": "Kategorie RJ",
    "top-vehicles": "Pojazdy w grze",
    "top-units": "Najczęstsze jednostki w grze",
    "stats-loading": "Ładowanie...",
    "no-timetables": "Brak aktywnych rozkładów jazdy na tym serwerze!",
    "no-vehicles": "Brak aktywnych pojazdów na tym serwerze!",
    "no-units": "Brak aktywnych jednostek na tym serwerze!",
    "no-stats": "Brak statystyk online dla wybranego serwera!"
  },
  "journal": {
    "title": "HISTORIA DYŻURÓW",
    "loading": "Ładowanie historii dyżurów...",
@@ -1,7 +1,6 @@
-import { TrainFilter } from '../interfaces/Trains/TrainFilter';
+import { TrainFilter, TrainFilterId } from '../components/TrainsView/typings';
-import { TrainFilterType } from '../enums/TrainFilterType';
+import Train from '../scripts/interfaces/Train';
-import Train from '../interfaces/Train';
+import { TrainStop } from '../store/typings';
 import TrainStop from '../interfaces/TrainStop';
 function confirmedPercentage(stops: TrainStop[] | undefined) {
  if (!stops) return -1;
@@ -32,34 +31,34 @@ function filterTrainList(
      if (f.isActive) return true;
      switch (f.id) {
-        case TrainFilterType.noTimetable:
+        case TrainFilterId.noTimetable:
          return train.timetableData;
-        case TrainFilterType.withTimetable:
+        case TrainFilterId.withTimetable:
          return !train.timetableData;
-        case TrainFilterType.withComments:
+        case TrainFilterId.withComments:
          return !train.timetableData?.followingStops.some((stop) => stop.comments);
-        case TrainFilterType.noComments:
+        case TrainFilterId.noComments:
          return train.timetableData?.followingStops.some((stop) => stop.comments);
-        case TrainFilterType.twr:
+        case TrainFilterId.twr:
          return !train.timetableData?.TWR;
-        case TrainFilterType.skr:
+        case TrainFilterId.skr:
          return !train.timetableData?.SKR;
-        case TrainFilterType.common:
+        case TrainFilterId.common:
          return train.timetableData?.SKR || train.timetableData?.TWR;
-        case TrainFilterType.passenger:
+        case TrainFilterId.passenger:
          return !/^[AMRE]\D{2}$/.test(train.timetableData?.category || '');
-        case TrainFilterType.freight:
+        case TrainFilterId.freight:
          return !train.timetableData?.category.startsWith('T');
-        case TrainFilterType.other:
+        case TrainFilterId.other:
          return !/^[PXZL]\D{2}$/.test(train.timetableData?.category || '');
        default:
@@ -72,7 +71,6 @@ function filterTrainList(
      (searchedDriver.length > 0
        ? train.driverName.toLowerCase().startsWith(searchedDriver.toLowerCase())
        : true) &&
      (!train.timetableData ? train.online : train.timetableData) &&
      isFiltered
    );
  });
@@ -0,0 +1,16 @@
 import { defineComponent } from 'vue';
 import { useStore } from '../store/mainStore';
 export default defineComponent({
  data() {
    return {
      store: useStore()
    };
  },
  methods: {
    isDonator(name: string) {
      return this.store.donatorsData.includes(name);
    }
  }
 });
@@ -1,5 +1,5 @@
 import { defineComponent } from 'vue';
-import { useStore } from '../store/store';
+import { useStore } from '../store/mainStore';
 export default defineComponent({
  data() {
@@ -1,6 +1,6 @@
 import { defineComponent } from 'vue';
 import Train from '../scripts/interfaces/Train';
-import TrainStop from '../scripts/interfaces/TrainStop';
+import { TrainStop } from '../store/typings';
 export default defineComponent({
  data: () => ({
@@ -61,7 +61,8 @@ const routes: Array<RouteRecordRaw> = [
 const router = createRouter({
  scrollBehavior(to, from, savedPosition) {
-    if (to.name == 'SceneryView' && from.name) return { el: `.app_main` };
+    if (to.name == 'SceneryView' && from.name && from.query['view'] === undefined)
      return { el: `.app_main` };
    if (savedPosition) return savedPosition;
@@ -1,49 +0,0 @@
 import Filter from '../../interfaces/Filter';
 export const filterInitStates: Filter = {
  default: false,
  notDefault: false,
  real: false,
  fictional: false,
  SPK: false,
  SCS: false,
  SPE: false,
  SUP: false,
  noSUP: false,
  ręczne: false,
  'ręczne+SPK': false,
  'ręczne+SCS': false,
  mechaniczne: false,
  'mechaniczne+SPK': false,
  'mechaniczne+SCS': false,
  współczesna: false,
  kształtowa: false,
  historyczna: false,
  mieszana: false,
  SBL: false,
  PBL: false,
  minLevel: 0,
  maxLevel: 20,
  minOneWayCatenary: 0,
  minOneWay: 0,
  minTwoWayCatenary: 0,
  minTwoWay: 0,
  'include-selected': false,
  'no-1track': false,
  'no-2track': false,
  free: true,
  occupied: false,
  ending: false,
  nonPublic: false,
  unavailable: true,
  abandoned: true,
  afkStatus: false,
  endingStatus: false,
  noSpaceStatus: false,
  unavailableStatus: false,
  unsignedStatus: false,
  authors: '',
  onlineFromHours: 0
 };
@@ -1,7 +0,0 @@
 export enum DataStatus {
  Initialized = -1,
  Loading = 0,
  Error = 1,
  Loaded = 2,
  Warning = 3
 }
@@ -1,11 +0,0 @@
 export enum DispatcherStatusID {
  Unknown = 'unknown',
  Outdated = 'outdated',
  Unauthorized = 'not-signed',
  OnlineNoLimit = 'no-limit',
  Afk = 'brb',
  Ending = 'ending',
  NoSpace = 'no-space',
  Unavailable = 'unavailable',
  OnlineWithHours = 'online'
 }
@@ -1,14 +0,0 @@
 export const enum JournalFilterType {
  ACTIVE = 'active',
  FULFILLED = 'fulfilled',
  ABANDONED = 'abandoned',
  ALL = 'all',
  TWR = 'twr',
  SKR = 'skr',
  TWR_SKR = 'twr-skr'
 }
 export enum JournalFilterSection {
  TIMETABLE_STATUS = 'timetable-status',
  TWRSKR = 'twrskr'
 }
@@ -1,21 +0,0 @@
 export enum TrainFilterSection {
  TRAIN_TYPE = 'TRAIN_TYPE',
  TIMETABLE_TYPE = 'TIMETABLE_TYPE',
  COMMENTS = 'COMMENTS',
  TIMETABLE = 'TIMETABLE'
 }
 export const enum TrainFilterType {
  noComments = 'noComments',
  withComments = 'withComments',
  twr = 'twr',
  skr = 'skr',
  common = 'common',
  passenger = 'passenger',
  freight = 'freight',
  other = 'other',
  noTimetable = 'noTimetable',
  withTimetable = 'withTimetable'
 }
@@ -1,6 +0,0 @@
 export default interface FilterOption {
  id: string;
  name: string;
  value: boolean;
  defaultValue: boolean;
 }
@@ -1,38 +0,0 @@
 interface Scenery {
  stationName: string;
  stationURL: string;
  stationLines: string;
  stationProject: string;
  reqLevel: string;
  supportersOnly: string;
  signalType: string;
  controlType: string;
  SBL: string;
  twoWayBlock: string;
  routesOneWayCatenary: number;
  routesOneWayOther: number;
  routesTwoWayCatenary: number;
  routesToWayOther: number;
  default: boolean;
  nonPublic: boolean;
  unavailable: boolean;
  hasData: boolean;
  stops: string[];
  checkpoints: string[];
  currentDispatcher: string;
  currentDispatcherId: number;
  currentDispatcherFrom: number;
  dispatcherHistory: {
    dispatcherName: string;
    dispatcherId: number;
    dispatcherFrom: number;
    dispatcherTo: number;
  }[];
 }
 export default Scenery;
@@ -1,43 +0,0 @@
 import TrainStop from './TrainStop';
 export enum StopStatus {
  'arriving' = 'arriving',
  'departed' = 'departed',
  'departed-away' = 'departed-away',
  'online' = 'online',
  'stopped' = 'stopped',
  'terminated' = 'terminated'
 }
 export interface ScheduledTrain {
  checkpointName: string;
  trainId: string;
  trainNo: number;
  driverName: string;
  driverId: number;
  currentStationName: string;
  currentStationHash: string;
  category: string;
  stopInfo: TrainStop;
  terminatesAt: string;
  beginsAt: string;
  prevStationName: string;
  nextStationName: string;
  arrivingLine: string | null;
  departureLine: string | null;
  prevDepartureLine: string | null;
  nextArrivalLine: string | null;
  signal: string;
  connectedTrack: string;
  stopLabel: string;
  stopStatus: StopStatus;
  stopStatusID: number;
 }
@@ -1,5 +1,4 @@
-import { Availability, OnlineScenery } from './store/storeTypes';
+import { Availability, OnlineScenery, ScheduledTrain } from '../../store/typings';
 import { ScheduledTrain } from './ScheduledTrain';
 import StationRoutes from './StationRoutes';
 export default interface Station {
@@ -1,13 +0,0 @@
 import { DataStatus } from '../enums/DataStatus';
 import Station from './Station';
 import Train from './Train';
 export interface StoreData {
  stationList: Station[];
  trainList: Train[];
  dispatcherCount: number;
  sceneryDataStatus: DataStatus;
  dispatcherDataStatus: DataStatus;
  trainsDataStatus: DataStatus;
 }
@@ -1,23 +0,0 @@
 import TrainStop from './TrainStop';
 export default interface Timetable {
  trainNo: number;
  success: boolean;
  data?: {
    trainNo: number;
    driverName: string;
    driverId: number;
    currentStationName: string;
    currentStationHash: string;
    timetableId: number;
    category: string;
    route: string;
    TWR: boolean;
    SKR: boolean;
    routeDistance: number;
    followingStops: TrainStop[];
    followingSceneries: string[];
  };
 }
@@ -1,4 +1,4 @@
-import TrainStop from './TrainStop';
+import { TrainStop } from '../../store/typings';
 export default interface Train {
  trainId: string;
@@ -1,30 +0,0 @@
 export default interface TrainStop {
  stopName: string;
  stopNameRAW: string;
  stopType: string;
  stopDistance: number;
  mainStop: boolean;
  arrivalLine: string | null;
  // arrivalTimeString: string | null;
  arrivalTimestamp: number;
  // arrivalRealTimeString: string | null;
  arrivalRealTimestamp: number;
  arrivalDelay: number;
  departureLine: string | null;
  // departureTimeString: string | null;
  departureTimestamp: number;
  // departureRealTimeString: string | null;
  departureRealTimestamp: number;
  departureDelay: number;
  pointId: number;
  comments?: any;
  beginsHere: boolean;
  terminatesHere: boolean;
  confirmed: boolean;
  stopped: boolean;
  stopTime: number | null;
 }
@@ -1,7 +0,0 @@
 import { TrainFilterSection, TrainFilterType } from '../../enums/TrainFilterType';
 export interface TrainFilter {
  id: TrainFilterType;
  section: TrainFilterSection;
  isActive: boolean;
 }
@@ -1,27 +0,0 @@
 export interface Sum {
  routeDistance: number;
 }
 export interface Max {
  routeDistance: number;
 }
 export interface Min {
  routeDistance: number;
 }
 export interface Avg {
  routeDistance: number;
 }
 export interface Count {
  _all: number;
 }
 export interface DispatcherStatsAPIData {
  _sum: Sum;
  _max: Max;
  _min: Min;
  _avg: Avg;
  _count: Count;
 }
@@ -1,18 +0,0 @@
 export interface DispatcherHistory {
  id: string;
  currentDuration: number;
  dispatcherId: number;
  dispatcherName: string;
  dispatcherLevel: number | null;
  dispatcherRate: number;
  dispatcherIsSupporter: boolean;
  dispatcherStatus?: number;
  isOnline: boolean;
  lastOnlineTimestamp: number;
  region: string;
  stationHash: string;
  stationName: string;
  timestampFrom: number;
  timestampTo?: number;
 }
@@ -1,27 +0,0 @@
 export interface Sum {
  routeDistance: number;
  confirmedStopsCount: number;
  allStopsCount: number;
  currentDistance: number;
 }
 export interface Count {
  fulfilled: number;
  terminated: number;
  _all: number;
 }
 export interface Max {
  routeDistance: number;
 }
 export interface Avg {
  routeDistance: number;
 }
 export interface DriverStatsAPIData {
  _sum: Sum;
  _count: Count;
  _max: Max;
  _avg: Avg;
 }
@@ -1,18 +0,0 @@
 export default interface StationAPIData {
  dispatcherId: number;
  dispatcherName: string;
  dispatcherIsSupporter: boolean;
  stationName: string;
  stationHash: string;
  region: string;
  maxUsers: number;
  currentUsers: number;
  spawn: number;
  lastSeen: number;
  dispatcherExp: number;
  nameFromHeader: string;
  spawnString: string | null;
  networkConnectionString: string;
  isOnline: number;
  dispatcherRate: number;
 }
@@ -1,51 +0,0 @@
 import { TimetableHistory } from './TimetablesAPIData';
 export interface ITimetablesDailyStats {
  totalTimetables: number;
  distanceSum: number;
  distanceAvg: number;
  timetableId: number;
  timetableAuthor: string;
  timetableDriver: string;
  timetableRouteDistance: number;
  mostActiveDispatchers: {
    name: string;
    count: number;
  }[];
  mostActiveDrivers: {
    name: string;
    distance: number;
  }[];
  longestDuties: {
    name: string;
    duration: number;
    station: string;
  }[];
 }
 export interface ITimetablesDailyStatsResponse {
  totalTimetables: number;
  distanceSum: number;
  distanceAvg: number;
  maxTimetable: TimetableHistory | null;
  mostActiveDispatchers: {
    name: string;
    count: number;
  }[];
  mostActiveDrivers: {
    name: string;
    distance: number;
  }[];
  longestDuties: {
    name: string;
    duration: number;
    station: string;
  }[];
 }
@@ -1,67 +0,0 @@
 export interface TimetableHistory {
  id: number;
  createdAt: string;
  updatedAt: string;
  timetableId: number;
  trainNo: number;
  trainCategoryCode: string;
  driverId: number;
  driverName: string;
  driverLevel: number | null;
  driverIsSupporter: boolean;
  route: string;
  twr: number;
  skr: number;
  sceneriesString: string;
  currentLocation: string[];
  routeDistance: number;
  currentDistance: number;
  confirmedStopsCount: number;
  allStopsCount: number;
  beginDate: string;
  endDate: string;
  scheduledBeginDate: string;
  scheduledEndDate: string;
  terminated: boolean;
  fulfilled: boolean;
  authorName?: string;
  authorId?: number;
  stopsString?: string;
  stockString?: string;
  stockHistory: string[];
  stockMass?: number;
  stockLength?: number;
  maxSpeed?: number;
  hashesString?: string;
  currentSceneryName?: string;
  currentSceneryHash?: string;
  routeSceneries?: string;
  checkpointArrivals?: string[];
  checkpointDepartures?: string[];
  checkpointArrivalsScheduled?: string[];
  checkpointDeparturesScheduled?: string[];
  checkpointStopTypes?: string[];
 }
 export interface SceneryTimetableHistory {
  timetables: TimetableHistory[];
  // totalCount: number;
  // sceneryName: string;
 }
@@ -1,23 +0,0 @@
 import { JournalTimetableSorter } from '../../types/JournalTimetablesTypes';
 export interface TimetablesQueryParams {
  driverName?: string;
  trainNo?: string;
  timetableId?: string;
  authorName?: string;
  timestampFrom?: number;
  timestampTo?: number;
  issuedFrom?: string;
  countFrom?: number;
  countLimit?: number;
  fulfilled?: number;
  terminated?: number;
  twr?: number;
  skr?: number;
  sortBy?: JournalTimetableSorter['id'];
 }
@@ -1,68 +0,0 @@
 export interface TimetableStop {
  stopName: string;
  stopNameRAW: string;
  stopType: string;
  stopDistance: number;
  pointId: number;
  mainStop: boolean;
  arrivalLine: string;
  arrivalTimestamp: number;
  arrivalRealTimestamp: number;
  arrivalDelay: number;
  departureLine: string;
  departureTimestamp: number;
  departureRealTimestamp: number;
  departureDelay: number;
  comments?: any;
  beginsHere: boolean;
  terminatesHere: boolean;
  confirmed: boolean;
  stopped: boolean;
  stopTime: number;
 }
 export interface TrainTimetable {
  timetableId: number;
  category: string;
  route: string;
  stopList: TimetableStop[];
  TWR: boolean;
  SKR: boolean;
  sceneries: string[];
 }
 export interface TrainAPIData {
  trainNo: number;
  mass: number;
  length: number;
  speed: number;
  stockString: string;
  signal: string;
  distance: number;
  connectedTrack: string;
  driverName: string;
  driverId: number;
  driverIsSupporter: boolean;
  driverLevel?: number;
  currentStationName: string;
  currentStationHash: string;
  online: boolean;
  lastSeen: number;
  region: string;
  isTimeout: boolean;
  timetable?: TrainTimetable;
 }
@@ -1,41 +0,0 @@
 export interface Author {
  login: string;
  id: number;
  node_id: string;
  avatar_url: string;
  gravatar_id: string;
  url: string;
  html_url: string;
  followers_url: string;
  following_url: string;
  gists_url: string;
  starred_url: string;
  subscriptions_url: string;
  organizations_url: string;
  repos_url: string;
  events_url: string;
  received_events_url: string;
  type: string;
  site_admin: boolean;
 }
 export interface ReleaseAPIData {
  url: string;
  assets_url: string;
  upload_url: string;
  html_url: string;
  id: number;
  author: Author;
  node_id: string;
  tag_name: string;
  target_commitish: string;
  name: string;
  draft: boolean;
  prerelease: boolean;
  created_at: Date;
  published_at: Date;
  assets: any[];
  tarball_url: string;
  zipball_url: string;
  body: string;
 }
@@ -1,13 +0,0 @@
 export interface RollingStockGithubData {
  usage: Record<string, string>;
  info: RollingStockInfo;
 }
 export interface RollingStockInfo {
  'loco-e': [string, string, string, string, boolean][];
  'loco-s': [string, string, string, string, boolean][];
  'loco-szt': [string, string, string, string, boolean][];
  'loco-ezt': [string, string, string, string, boolean][];
  'car-passenger': [string, string, boolean, boolean, string][];
  'car-cargo': [string, string, boolean, boolean, string][];
 }
@@ -1,129 +0,0 @@
 import { Socket } from 'socket.io-client';
 import { DataStatus } from '../../enums/DataStatus';
 import StationAPIData from '../api/StationAPIData';
 import { TrainAPIData } from '../api/TrainAPIData';
 import { DispatcherStatsAPIData } from '../api/DispatcherStatsAPIData';
 import { DriverStatsAPIData } from '../api/DriverStatsAPIData';
 import { RollingStockGithubData } from '../github_api/StockInfoGithubData';
 import Station from '../Station';
 import { ScheduledTrain } from '../ScheduledTrain';
 import { DispatcherStatusID } from '../../enums/DispatcherStatus';
 export type Availability = 'default' | 'unavailable' | 'nonPublic' | 'abandoned' | 'nonDefault';
 export interface StoreState {
  stationList: Station[];
  apiData: APIData;
  rollingStockData?: RollingStockGithubData;
  lastDispatcherStatuses: { hash: string; statusTimestamp: number; statusID: DispatcherStatusID }[];
  sceneryData: any[][];
  region: { id: string; value: string };
  trainCount: number;
  stationCount: number;
  webSocket?: Socket;
  isOffline: boolean;
  dispatcherStatsName: string;
  dispatcherStatsData?: DispatcherStatsAPIData;
  driverStatsName: string;
  driverStatsData?: DriverStatsAPIData;
  driverStatsStatus: DataStatus;
  chosenModalTrainId?: string;
  currentStatsTab: 'daily' | 'driver' | null;
  dataStatuses: {
    connection: DataStatus;
    sceneries: DataStatus;
    timetables: DataStatus;
    dispatchers: DataStatus;
    trains: DataStatus;
  };
  listenerLaunched: boolean;
  blockScroll: boolean;
  modalLastClickedTarget: EventTarget | null;
 }
 export interface APIData {
  stations?: StationAPIData[];
  dispatchers?: string[][];
  trains?: TrainAPIData[];
  connectedSocketCount: number;
 }
 export interface StationRoutesInfo {
  routeName: string;
  isElectric: boolean;
  isInternal: boolean;
  isRouteSBL: boolean;
  routeLength: number;
  routeSpeed: number;
  routeTracks: number;
 }
 export interface StationJSONData {
  name: string;
  abbr: string;
  url: string;
  lines: string;
  project: string;
  projectUrl: string;
  reqLevel: number;
  signalType: string;
  controlType: string;
  SUP: boolean;
  // routes: string;
  routesInfo: StationRoutesInfo[];
  checkpoints: string | null;
  authors?: string;
  availability: Availability;
 }
 export interface StationTrain {
  driverName: string;
  driverId: number;
  trainNo: number;
  trainId: string;
  stopStatus: string;
 }
 export interface OnlineScenery {
  name: string;
  hash: string;
  region: string;
  maxUsers: number;
  currentUsers: number;
  spawns: { spawnName: string; spawnLength: number; isElectrified: boolean }[];
  dispatcherName: string;
  dispatcherRate: number;
  dispatcherId: number;
  dispatcherExp: number;
  dispatcherIsSupporter: boolean;
  statusTimestamp: number;
  statusID: DispatcherStatusID;
  isOnline: boolean;
  stationTrains?: StationTrain[];
  scheduledTrains?: ScheduledTrain[];
  scheduledTrainCount: {
    all: number;
    confirmed: number;
    unconfirmed: number;
  }
 }
@@ -1,8 +0,0 @@
 export type JournalDispatcherSearcher = {
  [key in 'search-dispatcher' | 'search-station' | 'search-date']: string;
 };
 export interface JournalDispatcherSorter {
  id: 'timestampFrom' | 'duration';
  dir: -1 | 1;
 }
@@ -1,25 +0,0 @@
 import { JournalFilterType } from '../../scripts/enums/JournalFilterType';
 export type JournalTimetableSearchKey =
  | 'search-driver'
  | 'search-train'
  | 'search-date'
  | 'search-dispatcher'
  | 'search-issuedFrom';
 export type JournalTimetableSorterKey = 'timetableId' | 'beginDate' | 'distance' | 'total-stops';
 export type JournalTimetableSearchType = {
  [key in JournalTimetableSearchKey]: string;
 };
 export interface JournalFilter {
  id: JournalFilterType;
  filterSection: string;
  isActive: boolean;
 }
 export interface JournalTimetableSorter {
  id: JournalTimetableSorterKey;
  dir: 'asc' | 'desc';
 }
@@ -2,6 +2,6 @@ export const URLs = {
  stacjownikAPI:
    import.meta.env.VITE_APP_API_DEV === '1' && !import.meta.env.PROD
      ? 'http://localhost:3001'
-      : 'https://stacjownik.spythere.pl',
+      : 'https://stacjownik.spythere.eu',
  stacjownikAPIDev: 'localhost:3000'
 };
@@ -1,8 +1,19 @@
 import { Filter } from '../../components/StationsView/typings';
 import { Status } from '../../typings/common';
 import { HeadIdsTypes } from '../data/stationHeaderNames';
 import { DispatcherStatusID } from '../enums/DispatcherStatus';
 import Filter from '../interfaces/Filter';
 import Station from '../interfaces/Station';
 const dispatcherStatusPriority = [
  Status.ActiveDispatcher.UNKNOWN,
  Status.ActiveDispatcher.INVALID,
  Status.ActiveDispatcher.NOT_LOGGED_IN,
  Status.ActiveDispatcher.UNAVAILABLE,
  Status.ActiveDispatcher.AFK,
  Status.ActiveDispatcher.ENDING,
  Status.ActiveDispatcher.NO_SPACE,
  undefined
 ];
 export const sortStations = (
  a: Station,
  b: Station,
@@ -19,7 +30,11 @@ export const sortStations = (
      break;
    case 'status':
-      diff = (a.onlineInfo?.statusTimestamp || 0) - (b.onlineInfo?.statusTimestamp || 0);
+      diff =
        (a.onlineInfo?.dispatcherTimestamp ??
          dispatcherStatusPriority.indexOf(a.onlineInfo?.dispatcherStatus)) -
        (b.onlineInfo?.dispatcherTimestamp ??
          dispatcherStatusPriority.indexOf(b.onlineInfo?.dispatcherStatus));
      break;
    case 'dispatcher':
@@ -53,28 +68,20 @@ export const sortStations = (
    case 'timetableConfirmed':
      diff =
-        (a.onlineInfo?.scheduledTrains
+        (a.onlineInfo?.scheduledTrainCount.confirmed ?? -1) -
-          ? a.onlineInfo.scheduledTrains.filter((train) => train.stopInfo.confirmed).length
+        (b.onlineInfo?.scheduledTrainCount.confirmed ?? -1);
          : -1) -
        (b.onlineInfo?.scheduledTrains
          ? b.onlineInfo.scheduledTrains.filter((train) => train.stopInfo.confirmed).length
          : -1);
      break;
    case 'timetableUnconfirmed':
      diff =
-        (a.onlineInfo?.scheduledTrains
+        (a.onlineInfo?.scheduledTrainCount.unconfirmed ?? -1) -
-          ? a.onlineInfo.scheduledTrains.filter((train) => !train.stopInfo.confirmed).length
+        (b.onlineInfo?.scheduledTrainCount.unconfirmed ?? -1);
          : -1) -
        (b.onlineInfo?.scheduledTrains
          ? b.onlineInfo.scheduledTrains.filter((train) => !train.stopInfo.confirmed).length
          : -1);
      break;
    case 'timetableAll':
      diff =
-        (a.onlineInfo?.scheduledTrains ? a.onlineInfo.scheduledTrains.length : -1) -
+        (a.onlineInfo?.scheduledTrainCount.all ?? -1) -
-        (b.onlineInfo?.scheduledTrains ? b.onlineInfo.scheduledTrains.length : -1);
+        (b.onlineInfo?.scheduledTrainCount.all ?? -1);
      break;
    default:
@@ -89,27 +96,28 @@ export const filterStations = (station: Station, filters: Filter) => {
  if (!station.onlineInfo && filters['free']) return false;
  if (station.onlineInfo) {
-    const { statusID, statusTimestamp } = station.onlineInfo;
+    const { dispatcherStatus } = station.onlineInfo;
-    const isEnding = statusID == DispatcherStatusID.Ending && filters['endingStatus'];
+    const isEnding = dispatcherStatus == Status.ActiveDispatcher.ENDING && filters['endingStatus'];
    const isNotSigned =
-      (statusID == 'not-signed' || statusID == 'unavailable') && filters['unavailableStatus'];
+      (dispatcherStatus == Status.ActiveDispatcher.NOT_LOGGED_IN ||
        dispatcherStatus == Status.ActiveDispatcher.UNAVAILABLE) &&
      filters['unavailableStatus'];
-    const isAFK = statusID == 'brb' && filters['afkStatus'];
+    const isAFK = dispatcherStatus == Status.ActiveDispatcher.AFK && filters['afkStatus'];
-    const isNoSpace = statusID == 'no-space' && filters['noSpaceStatus'];
+    const isNoSpace =
      dispatcherStatus == Status.ActiveDispatcher.NO_SPACE && filters['noSpaceStatus'];
    const isOccupied = station.onlineInfo && filters['occupied'];
-    const isOnlineInBounds =
+    if (isEnding || isNotSigned || isAFK || isNoSpace || isOccupied) return false;
      (filters['onlineFromHours'] < 8 &&
        statusTimestamp > 0 &&
        statusTimestamp <= Date.now() + filters['onlineFromHours'] * 3600000) ||
      (filters['onlineFromHours'] > 0 && statusTimestamp <= 0) ||
      (filters['onlineFromHours'] == 8 && statusID != 'no-limit');
-    if (isEnding || isOnlineInBounds || isNotSigned || isAFK || isNoSpace || isOccupied)
+    if (
      filters['onlineFromHours'] > 0 &&
      dispatcherStatus <= Date.now() + filters['onlineFromHours'] * 3600000
    )
      return false;
  }
@@ -1,36 +1,26 @@
 import axios from 'axios';
 import { defineStore } from 'pinia';
 import { io } from 'socket.io-client';
 import { DataStatus } from '../scripts/enums/DataStatus';
 import StationRoutes from '../scripts/interfaces/StationRoutes';
 import Train from '../scripts/interfaces/Train';
 import { URLs } from '../scripts/utils/apiURLs';
-import {
+import { parseSpawns, getScheduledTrains, getStationTrains } from './utils';
  getDispatcherStatus,
  parseSpawns,
  getScheduledTrains,
  getStationTrains
 } from '../scripts/utils/storeUtils';
-import {
+import { OnlineScenery, ScheduledTrain, StationJSONData, StoreState } from './typings';
  APIData,
  OnlineScenery,
  StationJSONData,
  StoreState
 } from '../scripts/interfaces/store/storeTypes';
-import packageInfo from '../../package.json';
+import { API } from '../typings/api';
-import { RollingStockGithubData } from '../scripts/interfaces/github_api/StockInfoGithubData';
+import { Status } from '../typings/common';
-import { ScheduledTrain } from '../scripts/interfaces/ScheduledTrain';
+
-import { DispatcherStatusID } from '../scripts/enums/DispatcherStatus';
+const API_INTERVAL_MS = 30000;
 export const useStore = defineStore('store', {
  state: () =>
    ({
-      apiData: {} as unknown,
+      activeData: {} as unknown,
      rollingStockData: undefined,
      donatorsData: [],
      stationList: [],
      regionOnlineCounters: [],
      routesList: [],
@@ -42,7 +32,6 @@ export const useStore = defineStore('store', {
      trainCount: 0,
      stationCount: 0,
      webSocket: undefined,
      isOffline: false,
      dispatcherStatsName: '',
@@ -50,33 +39,36 @@ export const useStore = defineStore('store', {
      driverStatsName: '',
      driverStatsData: undefined,
-      driverStatsStatus: DataStatus.Initialized,
+      driverStatsStatus: Status.Data.Initialized,
      chosenModalTrainId: undefined,
      dataStatuses: {
-        connection: DataStatus.Loading,
+        connection: Status.Data.Loading,
-        sceneries: DataStatus.Loading,
+        sceneries: Status.Data.Loading,
-        timetables: DataStatus.Loading,
+        timetables: Status.Data.Loading,
-        dispatchers: DataStatus.Loading,
+        dispatchers: Status.Data.Loading,
-        trains: DataStatus.Loading
+        trains: Status.Data.Loading
      },
      currentStatsTab: null,
      blockScroll: false,
      listenerLaunched: false,
-      modalLastClickedTarget: null
+      modalLastClickedTarget: null,
      tooltip: {
        content: '',
        visible: false,
        x: 0,
        y: 0
      }
    }) as StoreState,
  getters: {
    trainList(): Train[] {
-      return (this.apiData?.trains ?? [])
+      return (this.activeData?.trains ?? [])
-        .filter(
+        .filter((train) => train.timetable || train.online)
          (train) =>
            train.region === this.region.id &&
            (train.online || train.timetable || train.lastSeen > Date.now() - 180000)
        )
        .map((train) => {
          const stock = train.stockString.split(';');
          const locoType = stock ? stock[0] : train.stockString;
@@ -127,72 +119,67 @@ export const useStore = defineStore('store', {
    onlineSceneryList(state): OnlineScenery[] {
      if (state.isOffline) return [];
-      if (!state.apiData?.stations) return [];
+      if (!state.activeData?.activeSceneries) return [];
-      return (
+      return state.activeData?.activeSceneries.reduce((list, scenery) => {
-        state.apiData?.stations
+        if (scenery.isOnline !== 1 && Date.now() - scenery.lastSeen > 1000 * 60 * 2) return list;
-          // ?.filter((apiStation) => apiStation.region == state.region.id)
+        if (scenery.dispatcherStatus == Status.ActiveDispatcher.UNKNOWN) return list;
          .reduce((list, apiStation) => {
            if (apiStation.region != state.region.id) return list;
-            const dispatcherStatus = getDispatcherStatus(state as StoreState, apiStation);
+        const station = this.stationList.find((s) => s.name === scenery.stationName);
-            if (dispatcherStatus.statusID == DispatcherStatusID.Unknown) return list;
+        const scheduledTrains = getScheduledTrains(this.trainList, scenery, station?.generalInfo);
-            const station = this.stationList.find((s) => s.name === apiStation.stationName);
+        const stationTrains = getStationTrains(
          this.trainList,
          scheduledTrains,
          this.region.id,
          scenery
        );
-            const scheduledTrains = getScheduledTrains(
+        // Remove checkpoint duplicates
-              this.trainList,
+        const uniqueScheduledTrains = scheduledTrains.reduce(
-              apiStation,
+          (uniqueList, sTrain) =>
-              station?.generalInfo
+            uniqueList.find((v) => v.trainId === sTrain.trainId)
-            );
+              ? uniqueList
              : [...uniqueList, sTrain],
          [] as ScheduledTrain[]
        );
-            const stationTrains = getStationTrains(
+        const dispatcherTimestamp =
-              this.trainList,
+          scenery.dispatcherStatus == Status.ActiveDispatcher.NO_LIMIT
-              scheduledTrains,
+            ? Date.now() + 25500000
-              this.region.id,
+            : scenery.dispatcherStatus > 5
-              apiStation
+            ? scenery.dispatcherStatus
-            );
+            : null;
-            // Remove checkpoint duplicates
+        list.push({
-            const uniqueScheduledTrains = scheduledTrains.reduce(
+          name: scenery.stationName,
-              (uniqueList, sTrain) =>
+          hash: scenery.stationHash,
-                uniqueList.find((v) => v.trainId === sTrain.trainId)
+          region: scenery.region,
-                  ? uniqueList
+          maxUsers: scenery.maxUsers,
-                  : [...uniqueList, sTrain],
+          currentUsers: scenery.currentUsers,
-              [] as ScheduledTrain[]
+          spawns: parseSpawns(scenery.spawnString),
-            );
+          dispatcherName: scenery.dispatcherName,
          dispatcherRate: scenery.dispatcherRate,
          dispatcherId: scenery.dispatcherId,
          dispatcherExp: scenery.dispatcherExp,
          dispatcherIsSupporter: scenery.dispatcherIsSupporter,
          scheduledTrains: scheduledTrains,
          stationTrains: stationTrains,
          dispatcherStatus: scenery.dispatcherStatus,
          dispatcherTimestamp: dispatcherTimestamp,
-            list.push({
+          isOnline: scenery.isOnline == 1,
              name: apiStation.stationName,
              hash: apiStation.stationHash,
              region: apiStation.region,
              maxUsers: apiStation.maxUsers,
              currentUsers: apiStation.currentUsers,
              spawns: parseSpawns(apiStation.spawnString),
              dispatcherName: apiStation.dispatcherName,
              dispatcherRate: apiStation.dispatcherRate,
              dispatcherId: apiStation.dispatcherId,
              dispatcherExp: apiStation.dispatcherExp,
              dispatcherIsSupporter: apiStation.dispatcherIsSupporter,
              scheduledTrains: scheduledTrains,
              stationTrains: stationTrains,
              statusTimestamp: dispatcherStatus.statusTimestamp,
              statusID: dispatcherStatus.statusID,
-              isOnline: apiStation.isOnline == 1,
+          scheduledTrainCount: {
            all: uniqueScheduledTrains.length,
            confirmed: uniqueScheduledTrains.filter((train) => train.stopInfo.confirmed).length,
            unconfirmed: uniqueScheduledTrains.filter((train) => !train.stopInfo.confirmed).length
          }
        });
-              scheduledTrainCount: {
+        return list;
-                all: uniqueScheduledTrains.length,
+      }, [] as OnlineScenery[]);
                confirmed: uniqueScheduledTrains.filter((train) => train.stopInfo.confirmed).length,
                unconfirmed: uniqueScheduledTrains.filter((train) => !train.stopInfo.confirmed)
                  .length
              }
            });
            return list;
          }, [] as OnlineScenery[])
      );
    }
  },
  actions: {
@@ -202,7 +189,7 @@ export const useStore = defineStore('store', {
      ).data;
      if (!sceneryData) {
-        this.dataStatuses.sceneries = DataStatus.Error;
+        this.dataStatuses.sceneries = Status.Data.Error;
        return;
      }
@@ -257,11 +244,11 @@ export const useStore = defineStore('store', {
      });
    },
-    async connectToWebsocket() {
+    async fetchActiveData() {
      if (import.meta.env.VITE_APP_WS_DEV === '1') {
        const mockWebsocketData = await import('../data/mockWebsocketData.json');
-        this.dataStatuses.connection = DataStatus.Loaded;
+        this.dataStatuses.connection = Status.Data.Loaded;
-        this.apiData = mockWebsocketData as any;
+        this.activeData = mockWebsocketData as any;
        this.setStatuses();
        console.warn('Stacjownik działa w trybie mockowania danych z WS');
@@ -269,36 +256,29 @@ export const useStore = defineStore('store', {
        return;
      }
-      const socket = io(URLs.stacjownikAPI, {
+      try {
-        transports: ['websocket', 'polling'],
+        const data = (
-        rememberUpgrade: true,
+          await axios.get<API.ActiveData.Response>(`${URLs.stacjownikAPI}/api/getActiveData`)
-        reconnection: true
+        ).data;
      });
-      socket.emit('CONNECTION', { version: packageInfo.version });
+        this.activeData = data;
-
+        this.dataStatuses.connection = Status.Data.Loaded;
      socket.on('connect_error', () => {
        this.dataStatuses.connection = DataStatus.Error;
      });
      socket.on('UPDATE', (data: APIData) => {
        this.apiData = data;
        this.dataStatuses.connection = DataStatus.Loaded;
        this.setStatuses();
-      });
+      } catch (error) {
-
+        this.dataStatuses.connection = Status.Data.Error;
-      socket.emit('FETCH_DATA', { version: packageInfo.version }, (data: APIData) => {
+        console.error('Wystąpił błąd podczas pobierania danych online z API!');
-        this.dataStatuses.connection = DataStatus.Loaded;
+      }
        this.apiData = data;
        this.setStatuses();
      });
      this.webSocket = socket;
    },
-    async connectToAPI() {
+    async setupAPI() {
-      this.connectToWebsocket();
+      this.fetchActiveData();
      setInterval(() => {
        this.fetchActiveData();
      }, API_INTERVAL_MS);
      this.fetchStockInfoData();
      this.fetchDonatorsData();
      this.fetchStationsGeneralInfo();
    },
@@ -309,7 +289,7 @@ export const useStore = defineStore('store', {
    async fetchStockInfoData() {
      try {
        this.rollingStockData = (
-          await axios.get<RollingStockGithubData>(
+          await axios.get<API.RollingStock.Response>(
            'https://raw.githubusercontent.com/Spythere/api/main/td2/data/stockInfo.json'
          )
        ).data;
@@ -318,22 +298,30 @@ export const useStore = defineStore('store', {
      }
    },
    async fetchDonatorsData() {
      try {
        const response = await axios.get<API.Donators.Response>(
          `${URLs.stacjownikAPI}/api/getDonators`
        );
        if (response.data) this.donatorsData = response.data;
      } catch (error) {
        console.error('Ups! Wystąpił błąd podczas pobierania informacji o donatorach:', error);
      }
    },
    async setStatuses() {
-      if (!this.apiData.stations) {
+      if (!this.activeData.activeSceneries) {
-        this.dataStatuses.sceneries = DataStatus.Error;
+        this.dataStatuses.sceneries = Status.Data.Error;
-        this.dataStatuses.trains = DataStatus.Error;
+        this.dataStatuses.trains = Status.Data.Error;
-        this.dataStatuses.dispatchers = DataStatus.Error;
+        this.dataStatuses.dispatchers = Status.Data.Error;
        return;
      }
-      this.dataStatuses.sceneries = DataStatus.Loaded;
+      this.dataStatuses.sceneries = Status.Data.Loaded;
-      this.dataStatuses.trains = !this.apiData.trains ? DataStatus.Warning : DataStatus.Loaded;
+      this.dataStatuses.trains = !this.activeData.trains ? Status.Data.Warning : Status.Data.Loaded;
-      this.dataStatuses.dispatchers = !this.apiData.dispatchers
+      this.dataStatuses.dispatchers = Status.Data.Loaded;
        ? DataStatus.Warning
        : DataStatus.Loaded;
      // if (this.apiData.dispatchers != null) this.lastDispatcherStatuses = prevDispatcherStatuses;
    }
  }
 });
@@ -1,10 +1,58 @@
 import { defineStore } from 'pinia';
 import inputData from '../data/options.json';
-import StorageManager from '../scripts/managers/storageManager';
+import { useStore } from './mainStore';
 import { useStore } from './store';
 import { filterInitStates } from '../scripts/constants/stores/initFilterStates';
 import { filterStations, sortStations } from '../scripts/utils/filterUtils';
 import { HeadIdsTypes } from '../scripts/data/stationHeaderNames';
 import StorageManager from '../managers/storageManager';
 import { Filter } from '../components/StationsView/typings';
 const filterInitStates: Filter = {
  default: false,
  notDefault: false,
  real: false,
  fictional: false,
  SPK: false,
  SCS: false,
  SPE: false,
  SUP: false,
  noSUP: false,
  ręczne: false,
  'ręczne+SPK': false,
  'ręczne+SCS': false,
  mechaniczne: false,
  'mechaniczne+SPK': false,
  'mechaniczne+SCS': false,
  współczesna: false,
  kształtowa: false,
  historyczna: false,
  mieszana: false,
  SBL: false,
  PBL: false,
  minLevel: 0,
  maxLevel: 20,
  minOneWayCatenary: 0,
  minOneWay: 0,
  minTwoWayCatenary: 0,
  minTwoWay: 0,
  'include-selected': false,
  'no-1track': false,
  'no-2track': false,
  free: true,
  occupied: false,
  ending: false,
  nonPublic: false,
  unavailable: true,
  abandoned: true,
  afkStatus: false,
  endingStatus: false,
  noSpaceStatus: false,
  unavailableStatus: false,
  unsignedStatus: false,
  authors: '',
  onlineFromHours: 0
 };
 export const useStationFiltersStore = defineStore('stationFiltersStore', {
  state() {
@@ -26,7 +74,9 @@ export const useStationFiltersStore = defineStore('stationFiltersStore', {
      return store.stationList
        .map((station) => ({
          ...station,
-          onlineInfo: store.onlineSceneryList.find((os) => os.name == station.name)
+          onlineInfo: store.onlineSceneryList.find(
            (os) => os.name == station.name && os.region == store.region.id
          )
        }))
        .filter((station) => filterStations(station, state.filters))
        .sort((a, b) => sortStations(a, b, state.sorterActive));
@@ -0,0 +1,203 @@
 import Station from '../scripts/interfaces/Station';
 import { API } from '../typings/api';
 import { Status } from '../typings/common';
 export type Availability = 'default' | 'unavailable' | 'nonPublic' | 'abandoned' | 'nonDefault';
 export interface RegionCounters {
  stationCount: number;
  trainsCount: number;
  timetablesCount: number;
 }
 export interface StoreState {
  stationList: Station[];
  activeData: API.ActiveData.Response;
  rollingStockData?: API.RollingStock.Response;
  donatorsData: API.Donators.Response;
  regionOnlineCounters: RegionCounters[];
  lastDispatcherStatuses: {
    hash: string;
    statusTimestamp: number;
    statusID: Status.ActiveDispatcher;
  }[];
  sceneryData: any[][];
  region: { id: string; value: string };
  trainCount: number;
  stationCount: number;
  isOffline: boolean;
  dispatcherStatsName: string;
  dispatcherStatsData?: API.DispatcherStats.Response;
  driverStatsName: string;
  driverStatsData?: API.DriverStats.Response;
  driverStatsStatus: Status.Data;
  chosenModalTrainId?: string;
  currentStatsTab: 'daily' | 'driver' | null;
  dataStatuses: {
    connection: Status.Data;
    sceneries: Status.Data;
    timetables: Status.Data;
    dispatchers: Status.Data;
    trains: Status.Data;
  };
  listenerLaunched: boolean;
  blockScroll: boolean;
  modalLastClickedTarget: EventTarget | null;
  tooltip: {
    visible: boolean;
    x: number;
    y: number;
    content: string;
  };
 }
 export interface StationRoutesInfo {
  routeName: string;
  isElectric: boolean;
  isInternal: boolean;
  isRouteSBL: boolean;
  routeLength: number;
  routeSpeed: number;
  routeTracks: number;
 }
 export interface StationJSONData {
  name: string;
  abbr: string;
  url: string;
  lines: string;
  project: string;
  projectUrl: string;
  reqLevel: number;
  signalType: string;
  controlType: string;
  SUP: boolean;
  // routes: string;
  routesInfo: StationRoutesInfo[];
  checkpoints: string | null;
  authors?: string;
  availability: Availability;
 }
 export interface OnlineScenery {
  name: string;
  hash: string;
  region: string;
  maxUsers: number;
  currentUsers: number;
  spawns: { spawnName: string; spawnLength: number; isElectrified: boolean }[];
  dispatcherName: string;
  dispatcherRate: number;
  dispatcherId: number;
  dispatcherExp: number;
  dispatcherIsSupporter: boolean;
  dispatcherStatus: Status.ActiveDispatcher | number;
  dispatcherTimestamp: number | null;
  isOnline: boolean;
  stationTrains?: StationTrain[];
  scheduledTrains?: ScheduledTrain[];
  scheduledTrainCount: {
    all: number;
    confirmed: number;
    unconfirmed: number;
  };
 }
 export interface StationTrain {
  driverName: string;
  driverId: number;
  trainNo: number;
  trainId: string;
  stopStatus: string;
 }
 export interface ScheduledTrain {
  checkpointName: string;
  trainId: string;
  trainNo: number;
  driverName: string;
  driverId: number;
  currentStationName: string;
  currentStationHash: string;
  category: string;
  stopInfo: TrainStop;
  terminatesAt: string;
  beginsAt: string;
  prevStationName: string;
  nextStationName: string;
  arrivingLine: string | null;
  departureLine: string | null;
  prevDepartureLine: string | null;
  nextArrivalLine: string | null;
  signal: string;
  connectedTrack: string;
  stopLabel: string;
  stopStatus: StopStatus;
  stopStatusID: number;
 }
 export enum StopStatus {
  ARRIVING = 'arriving',
  DEPARTED = 'departed',
  DEPARTED_AWAY = 'departed-away',
  ONLINE = 'online',
  STOPPED = 'stopped',
  TERMINATED = 'terminated'
 }
 export interface TrainStop {
  stopName: string;
  stopNameRAW: string;
  stopType: string;
  stopDistance: number;
  mainStop: boolean;
  arrivalLine: string | null;
  arrivalTimestamp: number;
  arrivalRealTimestamp: number;
  arrivalDelay: number;
  departureLine: string | null;
  departureTimestamp: number;
  departureRealTimestamp: number;
  departureDelay: number;
  pointId: number;
  comments?: string;
  beginsHere: boolean;
  terminatesHere: boolean;
  confirmed: boolean;
  stopped: boolean;
  stopTime: number | null;
 }
@@ -1,52 +1,15 @@
-import { DispatcherStatusID } from '../enums/DispatcherStatus';
+import Station from '../scripts/interfaces/Station';
-import { ScheduledTrain, StopStatus } from '../interfaces/ScheduledTrain';
+import Train from '../scripts/interfaces/Train';
-import Station from '../interfaces/Station';
+import { API } from '../typings/api';
-import Train from '../interfaces/Train';
+import { ScheduledTrain, StationTrain, StopStatus, TrainStop } from './typings';
 import TrainStop from '../interfaces/TrainStop';
 import StationAPIData from '../interfaces/api/StationAPIData';
 import { StationTrain, StoreState } from '../interfaces/store/storeTypes';
-export const getLocoURL = (locoType: string): string =>
+export function getLocoURL(locoType: string): string {
-  `https://rj.td2.info.pl/dist/img/thumbnails/${
+  return `https://rj.td2.info.pl/dist/img/thumbnails/${
    locoType.includes('EN') ? locoType + 'rb' : locoType
  }.png`;
 }
-export const getStatusID = (
+export function getStatusTimestamp(stationStatus: any): number {
  stationStatus: any[] | undefined,
  isSWDROnline: boolean
 ): DispatcherStatusID => {
  if (isSWDROnline && !stationStatus) return DispatcherStatusID.Unauthorized;
  if (!stationStatus) return DispatcherStatusID.Unknown;
  // if (stationStatus == -1) return DispatcherStatusID.Unauthorized;
  const statusCode = stationStatus[2];
  const statusTimestamp = stationStatus[3];
  switch (statusCode) {
    case 0:
      if (statusTimestamp - Date.now() > 21000000) return DispatcherStatusID.OnlineNoLimit;
      return DispatcherStatusID.OnlineWithHours;
    case 1:
      return DispatcherStatusID.Afk;
    case 2:
      if (statusTimestamp == 0) return DispatcherStatusID.Ending;
      break;
    case 3:
      return DispatcherStatusID.NoSpace;
    default:
      break;
  }
  return DispatcherStatusID.Unavailable;
 };
 export const getStatusTimestamp = (stationStatus: any): number => {
  if (!stationStatus) return -2;
  const statusCode = stationStatus[2];
@@ -67,9 +30,9 @@ export const getStatusTimestamp = (stationStatus: any): number => {
  }
  return -1;
-};
+}
-export const parseSpawns = (spawnString: string | null) => {
+export function parseSpawns(spawnString: string | null) {
  if (!spawnString) return [];
  if (spawnString === 'NO_SPAWN') return [];
@@ -81,47 +44,49 @@ export const parseSpawns = (spawnString: string | null) => {
    return { spawnName, spawnLength, isElectrified };
  });
-};
+}
-export const getTimestamp = (date: string | null): number => (date ? new Date(date).getTime() : 0);
+export function getTimestamp(date: string | null): number {
  return date ? new Date(date).getTime() : 0;
 }
-export const getTrainStopStatus = (
+export function getTrainStopStatus(
  stopInfo: TrainStop,
  currentStationName: string,
  sceneryName: string
-) => {
+) {
-  let stopStatus = StopStatus['arriving'],
+  let stopStatus = StopStatus.ARRIVING,
    stopLabel = '',
    stopStatusID = -1;
  if (stopInfo.terminatesHere && stopInfo.confirmed) {
-    stopStatus = StopStatus['terminated'];
+    stopStatus = StopStatus.TERMINATED;
    stopLabel = 'Skończył bieg';
    stopStatusID = 5;
  } else if (!stopInfo.terminatesHere && stopInfo.confirmed && currentStationName == sceneryName) {
-    stopStatus = StopStatus['departed'];
+    stopStatus = StopStatus.DEPARTED;
    stopLabel = 'Odprawiony';
    stopStatusID = 2;
  } else if (!stopInfo.terminatesHere && stopInfo.confirmed && currentStationName != sceneryName) {
-    stopStatus = StopStatus['departed-away'];
+    stopStatus = StopStatus.DEPARTED_AWAY;
    stopLabel = 'Odjechał';
    stopStatusID = 4;
  } else if (currentStationName == sceneryName && !stopInfo.stopped) {
-    stopStatus = StopStatus['online'];
+    stopStatus = StopStatus.ONLINE;
    stopLabel = 'Na stacji';
    stopStatusID = 0;
  } else if (currentStationName == sceneryName && stopInfo.stopped) {
-    stopStatus = StopStatus['stopped'];
+    stopStatus = StopStatus.STOPPED;
    stopLabel = 'Postój';
    stopStatusID = 1;
  } else if (currentStationName != sceneryName) {
-    stopStatus = StopStatus['arriving'];
+    stopStatus = StopStatus.ARRIVING;
    stopLabel = 'W drodze';
    stopStatusID = 3;
  }
  return { stopStatus, stopLabel, stopStatusID };
-};
+}
 export function getCheckpointTrain(
  train: Train,
@@ -218,40 +183,12 @@ export function getCheckpointTrain(
  };
 }
 export function getDispatcherStatus(state: StoreState, onlineStationData: StationAPIData) {
  const { dispatchers } = state.apiData;
  const prevDispatcherStatus = state.lastDispatcherStatuses.find(
    (dispatcher) => dispatcher.hash === onlineStationData.stationHash
  );
  const stationStatus = dispatchers?.find(
    (status: string[]) => status[0] == onlineStationData.stationHash && status[1] == state.region.id
  );
  const statusTimestamp =
    prevDispatcherStatus && !dispatchers
      ? prevDispatcherStatus.statusTimestamp
      : getStatusTimestamp(stationStatus);
  const statusID =
    prevDispatcherStatus && !dispatchers
      ? prevDispatcherStatus.statusID
      : getStatusID(stationStatus, onlineStationData.isOnline === 1);
  return {
    hash: onlineStationData.stationHash,
    statusID,
    statusTimestamp
  };
 }
 export function getScheduledTrains(
  trainList: Train[],
-  stationAPIData: StationAPIData,
+  sceneryData: API.ActiveSceneries.Data,
  stationGeneralInfo: Station['generalInfo']
 ): ScheduledTrain[] {
-  const stationName = stationAPIData.stationName.toLocaleLowerCase();
+  const stationNameLower = sceneryData.stationName.toLocaleLowerCase();
  stationGeneralInfo?.checkpoints.forEach((cp) => (cp.scheduledTrains.length = 0));
@@ -259,17 +196,17 @@ export function getScheduledTrains(
    if (!train.timetableData) return acc;
    const timetable = train.timetableData;
-    if (!timetable.sceneries.includes(stationAPIData.stationHash)) return acc;
+    if (!timetable.sceneries.includes(sceneryData.stationHash)) return acc;
    const stopInfoIndex = timetable.followingStops.findIndex((stop) => {
-      const stopName = stop.stopNameRAW.toLowerCase();
+      const stopNameLower = stop.stopNameRAW.toLocaleLowerCase();
      return (
-        stationName == stopName ||
+        stationNameLower == stopNameLower ||
-        (!/(po\.|podg\.)/.test(stopName) && stopName.includes(stationName)) ||
+        (!/(po\.|podg\.)/.test(stopNameLower) && stopNameLower.includes(stationNameLower)) ||
-        (!/(po\.|podg\.)/.test(stationName) && stationName.includes(stopName)) ||
+        (!/(po\.|podg\.)/.test(stationNameLower) && stationNameLower.includes(stopNameLower)) ||
-        (stopName.split(', podg.')[0] !== undefined &&
+        (stopNameLower.split(', podg.')[0] !== undefined &&
-          stationName.startsWith(stopName.split(', podg.')[0]))
+          stationNameLower.startsWith(stopNameLower.split(', podg.')[0]))
      );
    });
@@ -277,12 +214,12 @@ export function getScheduledTrains(
    if (stopInfoIndex != -1) {
      checkpointScheduledTrains.push(
-        getCheckpointTrain(train, stopInfoIndex, stationAPIData.stationName)
+        getCheckpointTrain(train, stopInfoIndex, sceneryData.stationName)
      );
    }
    stationGeneralInfo?.checkpoints?.forEach((checkpoint) => {
-      if (checkpoint.checkpointName.toLocaleLowerCase() == stationName) return;
+      // if (checkpoint.checkpointName.toLocaleLowerCase() == stationNameLower) return;
      if (
        checkpointScheduledTrains.findIndex(
@@ -298,9 +235,7 @@ export function getScheduledTrains(
      );
      if (index > -1)
-        checkpointScheduledTrains.push(
+        checkpointScheduledTrains.push(getCheckpointTrain(train, index, sceneryData.stationName));
          getCheckpointTrain(train, index, stationAPIData.stationName)
        );
    });
    acc.push(...checkpointScheduledTrains);
@@ -312,14 +247,14 @@ export function getStationTrains(
  trainList: Train[],
  scheduledTrainList: ScheduledTrain[],
  region: string,
-  apiStation: StationAPIData
+  sceneryData: API.ActiveSceneries.Data
 ): StationTrain[] {
  return trainList
    .filter(
      (train) =>
        train?.region === region &&
        train.online &&
-        train.currentStationName === apiStation.stationName
+        train.currentStationName === sceneryData.stationName
    )
    .map((train) => ({
      driverName: train.driverName,
@@ -1,7 +1,11 @@
 $animDuration: 150ms;
 $animType: ease-in-out;
 // List animation
 .list-anim-move,
 .list-anim-enter-active,
 .list-anim-leave-active {
-  transition: all 250ms ease;
+  transition: all $animDuration ease;
 }
 .list-anim-enter-from,
@@ -15,6 +19,21 @@
  width: 100%;
 }
 // View animation
 .view-anim {
  &-enter-from,
  &-leave-to {
    opacity: 0.02;
  }
  &-enter-active,
  &-leave-active {
    transition: all $animDuration $animType;
    min-height: 100%;
  }
 }
 // Data status list animation
 .status-anim {
  &-enter-from,
  &-leave-to {
@@ -22,10 +41,38 @@
  }
  &-enter-active {
-    transition: all 100ms ease-out;
+    transition: all $animDuration ease-out;
  }
  &-leave-active {
-    transition: all 100ms ease-out;
+    transition: all $animDuration ease-out;
  }
 }
 // Card animation
 .card-anim {
  &-enter-active,
  &-leave-active {
    transition: all $animDuration $animType;
  }
  &-enter-from,
  &-leave-to {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.45);
  }
 }
 // Modal animation
 .modal-anim {
  &-enter-active,
  &-leave-active {
    transition: all $animDuration $animType;
  }
  &-enter-from,
  &-leave-to {
    transform: translateY(-25%);
    opacity: 0;
  }
 }
@@ -76,7 +76,11 @@
 }
 .train-badge {
-  padding: 0.1em 0.2em;
+  display: flex;
  align-items: center;
  gap: 0.5em;
  padding: 0.1em 0.3em;
  border-radius: 0.2em;
  font-weight: bold;
@@ -0,0 +1,47 @@
@import 'responsive.scss';
@import 'variables.scss';
 .dropdown-anim {
  &-enter-from,
  &-leave-to {
    opacity: 0;
    transform: translateY(10px);
  }
  &-enter-active,
  &-leave-active {
    transition: all 150ms ease;
  }
 }
 .dropdown_background {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 10;
 }
 .dropdown_wrapper {
  position: absolute;
  left: 0;
  top: calc(100% + 0.5em);
  background-color: $bgCol;
  box-shadow: 0 5px 10px 2px #0f0f0f;
  width: 100%;
  max-width: 550px;
  padding: 1em;
  z-index: 100;
 }
@include smallScreen {
  .dropdown_wrapper {
    font-size: 1.1em;
    max-width: 100%;
  }
 }
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Spythere	3dbbb3b4f9	Merge pull request #69 from Spythere/development Wersja 1.19.1	2023-12-02 23:04:55 +01:00
Spythere	07a77c463b	bump 1.19.1	2023-12-02 23:04:24 +01:00
Spythere	1a8e2231dd	przejście z WS na komunikację http	2023-12-02 23:02:08 +01:00
Spythere	f630d272ca	Merge pull request #68 from Spythere/development Wersja 1.19.0	2023-12-02 18:31:58 +01:00
Spythere	a381cf806c	wyróżnienie nicku donatora w widoku scenerii	2023-12-02 18:15:52 +01:00
Spythere	0023ab8cfd	tłumaczenia; poprawki dropdown	2023-12-02 18:01:01 +01:00
Spythere	a392940d52	tłumaczenia	2023-12-02 16:15:37 +01:00
Spythere	74984ad653	dodano wyróżnienie nicku wspierającego w Dzienniku	2023-12-02 16:11:29 +01:00
Spythere	a8991434bc	tłumaczenia statystyk pociągów	2023-12-02 16:00:28 +01:00
Spythere	825610b4c2	hotfix; aktualizacja paczek	2023-12-01 21:40:04 +01:00
Spythere	fef3991206	bump: 1.19.0	2023-12-01 21:27:13 +01:00
Spythere	a21cb31a0a	ikona przy informacji offline pociągu	2023-12-01 21:26:57 +01:00
Spythere	23a954a0d1	statystyki ruchu online	2023-12-01 21:19:04 +01:00
Spythere	b7bc9625b8	dodatkowe opcje darowizny	2023-12-01 16:11:56 +01:00
Spythere	bc58196804	cleanup	2023-12-01 14:55:13 +01:00
Spythere	6550d6973e	zmiana API do pobierania informacji o wspierających	2023-12-01 14:54:55 +01:00
Spythere	d7a609a4f2	Merge pull request #67 from Spythere/development poprawki tłumaczeń; scrolling	2023-11-28 19:12:57 +01:00
Spythere	763506d5a9	bump: 1.18.6	2023-11-28 19:10:08 +01:00
Spythere	8dbb32b821	dodatkowe tłumaczenia	2023-11-28 19:09:14 +01:00
Spythere	b8a21e0f70	Merge pull request #66 from Spythere/development hotfix: scrollowanie tabelki scenerii	2023-11-28 18:58:27 +01:00
Spythere	7c2b5fbd50	hotfix scrollowania	2023-11-28 18:56:02 +01:00
Spythere	ac740c2743	Merge pull request #65 from Spythere/development feature: darowizny + poprawki (wersja 1.18.5)	2023-11-28 18:44:44 +01:00
Spythere	916f19df72	poprawki tłumaczenia en	2023-11-28 18:38:42 +01:00
Spythere	de8facfb05	bump: 1.18.5	2023-11-28 18:36:37 +01:00
Spythere	5d5ad44508	wielkość czcionki	2023-11-28 18:35:41 +01:00
Spythere	647055d2f0	ikona donatora w zakładce Pociągi; poprawki tłumaczeń	2023-11-28 18:33:40 +01:00
Spythere	1947555724	poprawki responsywności	2023-11-28 17:56:08 +01:00
Spythere	86417f3422	lock sync	2023-11-26 19:50:04 +01:00
Spythere	a224b58d17	feature: modal darowizn	2023-11-26 19:49:32 +01:00
Spythere	69be01fb1e	Merge pull request #64 - 1.18.4 fix poprawki do 1.18.4	2023-11-17 16:55:09 +01:00
Spythere	6ef04f0dbd	fix sortowania statusów dr; linting	2023-11-17 16:52:53 +01:00
Spythere	451d90f854	bump: 1.18.4	2023-11-15 21:09:30 +01:00
Spythere	b01d3e894b	Merge pull request #63 from Spythere/development hotfix: statusy dr	2023-11-15 21:07:28 +01:00
Spythere	13dc6a0e32	hotfix: statusy dr	2023-11-15 21:06:16 +01:00
Spythere	96714550d0	Merge pull request #62 - Wersja 1.18.3 Wersja 1.18.3	2023-11-15 02:13:54 +01:00
Spythere	2b6c751f55	hotifx toString	2023-11-13 15:57:01 +01:00
Spythere	08d3a2a03a	feature: nawigacja URL w widoku scenerii	2023-11-13 15:32:02 +01:00
Spythere	a79ca78781	poprawki animacji statusów danych & tryb offline	2023-11-13 14:59:17 +01:00
Spythere	e08333dba1	fix: tłumaczenie statusów dr	2023-11-12 16:40:25 +01:00
Spythere	8705dd1df5	fix filtrowania RJ na posterunkach; favicons index	2023-11-12 15:47:55 +01:00
Spythere	7b4da9d422	poprawki layoutu aplikacji	2023-11-10 16:18:06 +01:00
Spythere	e51b2fe2f3	poprawki filtrów poc.	2023-11-10 15:39:49 +01:00
Spythere	f8b4ce103f	refactor typów danych	2023-11-10 15:04:49 +01:00
Spythere	e82b4b8817	bump 1.18.3	2023-11-08 22:04:11 +01:00
Spythere	36e9df82b0	hotfixy	2023-11-08 22:03:45 +01:00
Spythere	cbce9af00b	nowe pobieranie i przetwarzanie statusów dyżurnych	2023-11-07 20:16:58 +01:00
Spythere	4a4304d65f	Merge pull request #61 - Wersja 1.18.2 Wersja 1.18.2	2023-11-04 17:03:51 +01:00
Spythere	edad5306f2	bump: 1.18.2	2023-11-04 17:01:01 +01:00
Spythere	5b775dfec9	fix: filtry RJ	2023-11-04 17:00:50 +01:00
Spythere	a485652ca5	Merge pull request #60 (hotfix) hotfix: maksymalny timeout dyżurnych (1.18.1)	2023-11-02 22:44:48 +01:00
Spythere	ed308246d7	hotfix: maksymalny timeout dyżurnych	2023-11-02 22:42:28 +01:00
		`@@ -1 +0,0 @@`
			<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="white" width="18px" height="18px"><path d="M0 0h24v24H0z" fill="none"/><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1.41 16.09V20h-2.67v-1.93c-1.71-.36-3.16-1.46-3.27-3.4h1.96c.1 1.05.82 1.87 2.65 1.87 1.96 0 2.4-.98 2.4-1.59 0-.83-.44-1.61-2.67-2.14-2.48-.6-4.18-1.62-4.18-3.67 0-1.72 1.39-2.84 3.11-3.21V4h2.67v1.95c1.86.45 2.79 1.86 2.85 3.39H14.3c-.05-1.11-.64-1.87-2.22-1.87-1.5 0-2.4.68-2.4 1.64 0 .84.65 1.39 2.67 1.91s4.18 1.39 4.18 3.91c-.01 1.83-1.38 2.83-3.12 3.16z"/></svg>